@import url("gateway-v8.css?v=20261002-9");

/* -------------------------------------------------------------------------
   VEYDRAN PUBLIC GATEWAY v9
   Goal: alien civil service, not generic sci-fi dashboard.
   ------------------------------------------------------------------------- */

:root{
  --v9-ink:#dff7ff;
  --v9-soft:#8cb4c3;
  --v9-faint:#527887;
  --v9-line:rgba(67,214,255,.22);
  --v9-line-strong:rgba(67,214,255,.46);
  --v9-panel:rgba(2,18,28,.78);
  --v9-panel-deep:rgba(1,10,17,.94);
  --v9-cyan:#39d8ff;
  --v9-mint:#66ffc5;
  --v9-amber:#ffd76b;
}

html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(circle at 76% 9%,rgba(35,80,167,.19),transparent 32%),
    radial-gradient(circle at 7% 72%,rgba(0,128,145,.10),transparent 27%),
    linear-gradient(180deg,#01080d 0%,#020d14 54%,#01070b 100%);
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.22;
  background-image:
    linear-gradient(rgba(64,205,235,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(64,205,235,.035) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,black,transparent 85%);
}
.shell{max-width:1220px;padding-top:18px;padding-bottom:56px}
.topbar{
  position:relative;
  padding:18px 0 20px;
  border-bottom:1px solid var(--v9-line);
  gap:18px;
}
.topbar:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,var(--v9-cyan),transparent 26%,transparent 74%,var(--v9-cyan));
  opacity:.34;
}
.brand-name{font-size:14px;letter-spacing:1.9px;font-weight:850}
.brand-sub{font-size:8px;letter-spacing:1.7px;color:#6b9aaa;margin-top:3px}
.seal{
  width:44px;height:44px;
  background:linear-gradient(145deg,rgba(44,212,255,.14),rgba(15,52,71,.22));
  border:1px solid rgba(73,221,255,.35);
  box-shadow:inset 0 0 24px rgba(51,218,255,.06),0 0 25px rgba(21,166,215,.07);
}
.seal span{font-size:19px}
.topbar-right{display:flex;align-items:center;gap:12px}
.node-state{
  display:flex;align-items:center;gap:7px;
  font-size:8px;letter-spacing:1.45px;color:#7fa8b5;
  padding:8px 10px;border:1px solid rgba(73,221,255,.13);
  background:rgba(4,18,27,.55);
}
.node-state i{
  width:6px;height:6px;border-radius:50%;
  background:var(--v9-mint);box-shadow:0 0 10px var(--v9-mint);
}
.language-toggle{
  border-color:rgba(73,221,255,.42);
  background:linear-gradient(180deg,rgba(13,73,94,.52),rgba(5,35,48,.72));
  box-shadow:inset 0 0 18px rgba(49,207,255,.05);
}

/* HERO */
.hero-v9{
  display:grid;
  grid-template-columns:minmax(0,1.42fr) minmax(285px,.58fr);
  gap:46px;
  align-items:end;
  padding:76px 0 52px;
  position:relative;
}
.hero-v9:before{
  content:"";
  position:absolute;
  width:520px;height:320px;
  left:-180px;top:22px;
  background:radial-gradient(ellipse,rgba(31,199,255,.09),transparent 70%);
  pointer-events:none;
}
.hero-copy{position:relative;z-index:1}
.hero-v9 .eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  color:#62dcff;font-size:9px;letter-spacing:2.3px;
  margin-bottom:15px;
}
.hero-v9 .eyebrow:before{content:"";width:26px;height:1px;background:var(--v9-cyan);box-shadow:0 0 8px var(--v9-cyan)}
.hero-v9 h1{
  font-size:clamp(55px,7.4vw,100px);
  max-width:890px;
  line-height:.88;
  letter-spacing:-4.6px;
  margin:0 0 25px;
  text-wrap:balance;
  text-shadow:0 0 38px rgba(83,213,255,.07);
}
.hero-v9 .lede{
  max-width:760px;
  font-size:17px;
  line-height:1.67;
  color:#98bdca;
  margin:0;
}
.access-profile{
  position:relative;
  border:1px solid rgba(64,217,255,.25);
  background:
    linear-gradient(135deg,rgba(5,32,46,.92),rgba(2,14,22,.92)),
    var(--v9-panel);
  padding:22px;
  min-height:250px;
  box-shadow:0 22px 55px rgba(0,0,0,.25),inset 0 0 40px rgba(30,183,230,.025);
}
.access-profile:before,.access-profile:after{
  content:"";position:absolute;width:28px;height:28px;pointer-events:none
}
.access-profile:before{left:-1px;top:-1px;border-left:2px solid var(--v9-cyan);border-top:2px solid var(--v9-cyan)}
.access-profile:after{right:-1px;bottom:-1px;border-right:2px solid var(--v9-cyan);border-bottom:2px solid var(--v9-cyan)}
.profile-label{font-size:8px;letter-spacing:2px;color:#5ea8be;margin-bottom:17px}
.profile-row{
  display:flex;justify-content:space-between;gap:20px;
  padding:11px 0;border-top:1px solid rgba(74,193,223,.12);
  font-size:10px;letter-spacing:.8px;color:#6f95a2;
}
.profile-row strong{color:#dcf7ff;font-size:10px;letter-spacing:1px;text-align:right}
.profile-row strong.good{color:var(--v9-mint)}
.profile-stamp{
  margin-top:16px;border:1px dashed rgba(255,215,107,.3);
  color:#c5a85d;background:rgba(255,196,53,.035);
  padding:8px 9px;text-align:center;font-size:7px;letter-spacing:1.8px;
}

/* TELEMETRY / CIVIC HEADER */
.civic-strip{
  display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid rgba(72,213,247,.16);
  background:rgba(2,15,23,.55);
  margin-bottom:26px;
}
.civic-strip>div{padding:13px 17px;border-right:1px solid rgba(72,213,247,.12)}
.civic-strip>div:last-child{border-right:0}
.civic-strip small{display:block;color:#527f8e;font-size:7px;letter-spacing:1.65px;margin-bottom:4px}
.civic-strip strong{font-size:10px;letter-spacing:1.05px;color:#bcdde7}
.civic-strip .online{color:var(--v9-mint)}

/* PUBLIC SERVICES */
.section-intro{
  display:flex;align-items:end;justify-content:space-between;gap:24px;
  margin:42px 0 16px;
}
.section-intro .kicker{margin-bottom:6px}
.section-intro h2{font-size:27px;margin:0;letter-spacing:-.4px}
.section-note{font-size:8px;letter-spacing:1.5px;color:#557d8c;text-align:right}
.directory-v9{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.service-v9{
  position:relative;
  min-height:210px;
  padding:24px 24px 22px 108px;
  border:1px solid rgba(60,209,245,.18);
  background:
    linear-gradient(115deg,rgba(5,34,47,.76),rgba(2,15,23,.82) 64%),
    var(--v9-panel);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
  overflow:hidden;
}
.service-v9:before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
  background:linear-gradient(var(--v9-cyan),transparent 78%);opacity:.55;
}
.service-v9:hover{
  transform:translateY(-2px);
  border-color:rgba(76,221,255,.36);
  box-shadow:0 18px 35px rgba(0,0,0,.20),inset 0 0 30px rgba(36,190,225,.025);
}
.service-v9.live{border-color:rgba(73,226,255,.36);background:linear-gradient(115deg,rgba(4,49,65,.84),rgba(2,17,25,.87) 67%)}
.service-icon{
  position:absolute;left:23px;top:25px;
  width:62px;height:62px;
  display:grid;place-items:center;
  border:1px solid rgba(67,214,255,.24);
  background:linear-gradient(145deg,rgba(25,126,157,.12),rgba(4,20,28,.72));
  color:#68dcff;
  box-shadow:inset 0 0 20px rgba(52,205,245,.04);
}
.service-icon svg{width:34px;height:34px;stroke:currentColor;fill:none;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
.service-code{font-size:8px;letter-spacing:1.7px;color:#5ca4b9;margin:1px 0 10px}
.service-v9 h3{font-size:26px;margin:0 0 9px}
.service-v9 p{font-size:12px;line-height:1.55;color:#7fa3b0;max-width:420px;margin:0 0 18px}
.service-v9 a,.service-v9 button{
  min-height:37px;padding:0 13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  text-decoration:none;
  font-size:8px;letter-spacing:1.35px;
  border:1px solid rgba(62,214,250,.35);
  background:rgba(6,45,59,.74);
  color:#dff8ff;
}
.service-v9 a:hover,.service-v9 button:hover{background:rgba(12,74,94,.74);border-color:rgba(80,231,255,.58)}
.service-access{
  position:absolute;right:16px;top:15px;
  font-size:7px;letter-spacing:1.25px;color:#587d89;
}
.service-v9.live .service-access{color:var(--v9-mint)}
.service-v9.live .service-access:before{
  content:"";display:inline-block;width:5px;height:5px;border-radius:50%;
  background:var(--v9-mint);box-shadow:0 0 8px var(--v9-mint);margin-right:6px;
}

/* BUREAUCRATIC BULLETINS */
.bulletin-panel{margin-top:18px;padding:0!important;overflow:hidden}
.bulletin-head{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:13px 17px;border-bottom:1px solid rgba(66,203,239,.15);
  background:rgba(5,29,40,.55);
}
.bulletin-head strong{font-size:9px;letter-spacing:1.8px;color:#86c3d3}
.bulletin-head span{font-size:7px;letter-spacing:1.3px;color:#4c7685}
.bulletin-list{display:grid;grid-template-columns:repeat(3,1fr)}
.bulletin{
  padding:18px 18px 19px;
  border-right:1px solid rgba(66,203,239,.12);
  min-height:118px;
}
.bulletin:last-child{border-right:0}
.bulletin small{display:block;font-size:7px;letter-spacing:1.5px;color:#4f8090;margin-bottom:8px}
.bulletin p{font-size:11px;line-height:1.5;color:#91b3be;margin:0}
.bulletin b{color:#d9f5fb;font-weight:750}

/* VRAX AS A LOCAL CIVIC RECORD, NOT THE WEBSITE'S HERO */
.vrax-record{
  display:grid;grid-template-columns:auto 1fr auto;
  gap:20px;align-items:center;
  margin-top:18px;padding:19px 21px!important;
  background:linear-gradient(90deg,rgba(5,37,49,.70),rgba(2,17,24,.88));
}
.vrax-glyph{
  width:46px;height:46px;border:1px solid rgba(64,214,250,.25);
  display:grid;place-items:center;font-size:16px;font-weight:900;color:#78dfff;
  background:rgba(7,45,58,.45)
}
.vrax-record .kicker{margin-bottom:5px}
.vrax-record h3{font-size:19px;margin:0 0 4px}
.vrax-record p{font-size:10px;color:#7297a4;margin:0}
.vrax-data{display:flex;gap:22px;text-align:right}
.vrax-data small{display:block;font-size:7px;letter-spacing:1.3px;color:#527b88;margin-bottom:4px}
.vrax-data strong{display:block;font-size:9px;letter-spacing:.9px;color:#d6f2f8}
.vrax-data .active{color:var(--v9-mint)}

/* WORKFORCE PROPAGANDA */
.synergy-v9{
  position:relative;
  margin-top:38px!important;
  min-height:610px;
  padding:0!important;
  overflow:hidden;
  display:flex;
  align-items:center;
  isolation:isolate;
  background:#03111a;
  box-shadow:
    0 30px 80px rgba(0,0,0,.34),
    inset 0 0 90px rgba(18,145,190,.035);
}
.synergy-bg-v9{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
  filter:saturate(.96) contrast(1.02);
}
.synergy-v9:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,
      rgba(1,9,14,.82) 0%,
      rgba(1,10,16,.70) 22%,
      rgba(1,11,17,.48) 39%,
      rgba(1,10,16,.16) 57%,
      rgba(1,9,14,.035) 76%,
      rgba(1,9,14,.06) 100%),
    linear-gradient(0deg,
      rgba(1,8,13,.62) 0%,
      rgba(1,8,13,.18) 28%,
      transparent 58%,
      rgba(1,8,13,.14) 100%),
    radial-gradient(circle at 24% 54%,rgba(13,92,120,.17),transparent 42%);
}
.synergy-v9:after{
  content:"● 04-77";
  position:absolute;
  right:18px;
  top:18px;
  z-index:3;
  padding:8px 10px;
  border:1px solid rgba(101,255,192,.30);
  background:rgba(0,14,18,.72);
  font-size:7px;
  letter-spacing:1.6px;
  color:var(--v9-mint);
  box-shadow:0 0 18px rgba(77,255,185,.06);
  backdrop-filter:blur(8px);
}
.synergy-copy-v9{
  position:relative;
  z-index:2;
  width:min(650px,51%);
  margin-left:48px;
  padding:38px 0 36px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  text-shadow:
    0 2px 18px rgba(0,0,0,.92),
    0 0 36px rgba(0,0,0,.55);
}
.synergy-copy-v9 .kicker{
  margin-bottom:10px;
  color:#72cce3;
}
.synergy-copy-v9 h2{
  font-size:clamp(42px,4.55vw,64px);
  line-height:.98;
  letter-spacing:-2.1px;
  margin:0 0 18px;
  max-width:620px;
  color:#effcff;
}
.synergy-copy-v9 .campaign-line{
  font-size:11px;
  letter-spacing:2.2px;
  color:var(--v9-mint);
  margin-bottom:17px;
}
.synergy-copy-v9 p{
  font-size:13px;
  line-height:1.7;
  color:#c0dce4;
  max-width:600px;
  margin:0 0 23px;
}
.synergy-metrics{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  max-width:600px;
}
.synergy-metrics span{
  padding:10px 11px;
  border:1px solid rgba(88,220,252,.26);
  background:rgba(2,17,25,.42);
  font-size:7px;
  letter-spacing:1.25px;
  color:#c8e7ee;
  backdrop-filter:blur(6px);
}
.campaign-file{
  margin-top:27px;
  font-size:7px;
  letter-spacing:1.5px;
  color:#7ba5b1;
}

/* COMMERCIAL FEED */
.ad-section-v9{margin-top:20px!important}
.ad-section-v9 .panel-head{margin-bottom:17px}
.ad-grid-v9{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ad-grid-v9 .featured{grid-column:1/-1}
.ad-grid-v9 .ad-card{
  margin:0;
  border:1px solid rgba(63,205,240,.19);
  background:#020b10;
  overflow:hidden;
}
.ad-grid-v9 .artwork-button{min-height:0}
.ad-grid-v9 .featured .artwork-button{min-height:0}
.cinematic-ad{
  position:relative;
  display:block;width:100%;
  aspect-ratio:16/9;
  overflow:hidden;text-align:left!important;
  background-color:#020c12!important;
  background-size:cover!important;background-position:center!important;
  border:0!important;padding:0!important;
}
.cinematic-ad.storage{
  background-image:
    linear-gradient(90deg,rgba(1,8,13,.18) 0%,rgba(1,8,13,.30) 42%,rgba(1,8,13,.94) 78%),
    linear-gradient(0deg,rgba(1,8,13,.92),transparent 48%),
    var(--v9-art-storage)!important;
}
.cinematic-ad.brood{
  background-image:
    linear-gradient(90deg,rgba(1,8,13,.16) 0%,rgba(1,8,13,.42) 47%,rgba(1,8,13,.95) 79%),
    linear-gradient(0deg,rgba(1,8,13,.90),transparent 47%),
    var(--v9-art-brood)!important;
}
.cinematic-ad:after{
  content:"";position:absolute;inset:0;border:1px solid rgba(85,222,255,.18);
  box-shadow:inset 0 0 45px rgba(20,160,210,.08);pointer-events:none;
}
.cinematic-ad .sponsor-meta{
  position:absolute;top:15px;left:16px;z-index:2;
  font-size:6px;letter-spacing:1.45px;color:#8ed4e6;
  padding:6px 8px;background:rgba(1,12,18,.68);border:1px solid rgba(67,211,245,.18);
}
.cinematic-copy{
  position:absolute;z-index:2;right:18px;top:50%;transform:translateY(-46%);
  width:43%;min-width:210px;text-align:left;
}
.cinematic-copy .brandline{display:block;font-size:7px;letter-spacing:1.55px;color:#72dfff;margin-bottom:6px}
.cinematic-copy h3{font-size:clamp(20px,2.3vw,31px);line-height:.98;margin:0 0 8px;color:#f0fcff;letter-spacing:-.8px;text-shadow:0 3px 18px #000}
.cinematic-copy p{font-size:9px;line-height:1.45;color:#9fc1cb;margin:0 0 10px}
.cinematic-copy .offer{
  display:flex;align-items:center;gap:9px;margin:9px 0 11px;
  padding:7px 9px;border:1px solid rgba(255,220,90,.23);background:rgba(40,31,0,.26)
}
.cinematic-copy .offer b{font-size:28px;line-height:1;color:var(--v9-amber)}
.cinematic-copy .offer span{font-size:7px;line-height:1.35;letter-spacing:1px;color:#e9d99c}
.cinematic-copy em{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid rgba(71,222,255,.35);background:rgba(4,64,81,.72);
  padding:8px 10px;color:#e7faff;font-style:normal;font-size:7px;font-weight:850;letter-spacing:1.1px;
}
.cinematic-ad.brood .cinematic-copy em{border-color:rgba(100,255,181,.35);background:rgba(3,75,53,.72)}
.cinematic-ad.brood .cinematic-copy .brandline{color:#78ffc0}
.cinematic-ad:hover{filter:brightness(1.08)}
.ad-grid-v9 .artwork-fallback{display:none!important}

/* Restore Singles as a premium full-width placement */
.ad-grid-v9 #singlesCard{box-shadow:0 18px 45px rgba(0,0,0,.24)}
.ad-grid-v9 #singlesCard .artwork-button{background:#020b10}
.ad-grid-v9 #singlesCard img{width:100%!important;height:auto!important;object-fit:cover!important}

/* final notice / footer */
.notice-v9{margin-top:18px!important;padding:20px 22px!important;display:grid;grid-template-columns:190px 1fr;gap:20px;align-items:start}
.notice-v9 .kicker{margin:2px 0 0}
.notice-v9 p{margin:0;color:#779aa6;font-size:11px;line-height:1.62}
footer{margin-top:18px;border-top:1px solid rgba(61,199,235,.13);padding-top:18px}
footer span{color:#456d79}

/* make existing overlays/modal fit v9 */
.modal-card{border-color:rgba(70,215,250,.32);box-shadow:0 35px 100px rgba(0,0,0,.65),inset 0 0 40px rgba(33,190,228,.035)}
.toast{border-color:rgba(69,212,246,.32)}

/* RESPONSIVE */
@media(max-width:920px){
  .hero-v9{grid-template-columns:1fr;gap:25px;padding:54px 0 38px}
  .access-profile{min-height:0}
  .synergy-v9{min-height:560px}
  .synergy-bg-v9{object-position:56% center}
  .synergy-copy-v9{width:min(610px,68%);margin-left:32px;padding:34px 0}
  .bulletin-list{grid-template-columns:1fr}
  .bulletin{border-right:0;border-bottom:1px solid rgba(66,203,239,.12);min-height:0}
  .bulletin:last-child{border-bottom:0}
}
@media(max-width:720px){
  .shell{padding-left:16px;padding-right:16px}
  .topbar-right .node-state{display:none}
  .hero-v9 h1{font-size:58px;letter-spacing:-3px}
  .hero-v9 .lede{font-size:14px}
  .civic-strip{grid-template-columns:1fr}
  .civic-strip>div{border-right:0;border-bottom:1px solid rgba(72,213,247,.12)}
  .civic-strip>div:last-child{border-bottom:0}
  .directory-v9{grid-template-columns:1fr}
  .section-intro{align-items:flex-start;flex-direction:column;gap:8px}
  .section-note{text-align:left}
  .vrax-record{grid-template-columns:auto 1fr}
  .vrax-data{grid-column:1/-1;justify-content:flex-start;text-align:left;padding-top:5px}
  .ad-grid-v9{grid-template-columns:1fr}
  .ad-grid-v9 .featured{grid-column:auto}
  .cinematic-ad{aspect-ratio:1.24/1}
  .cinematic-ad.storage,.cinematic-ad.brood{
    background-image:
      linear-gradient(0deg,rgba(1,8,13,.98) 0%,rgba(1,8,13,.72) 46%,rgba(1,8,13,.10) 74%),
      var(--v9-art-storage)!important;
    background-position:42% center!important;
  }
  .cinematic-ad.brood{
    background-image:
      linear-gradient(0deg,rgba(1,8,13,.98) 0%,rgba(1,8,13,.72) 46%,rgba(1,8,13,.10) 74%),
      var(--v9-art-brood)!important;
  }
  .cinematic-copy{left:17px;right:17px;top:auto;bottom:17px;transform:none;width:auto;min-width:0}
  .cinematic-copy p{font-size:9px}
  .notice-v9{grid-template-columns:1fr;gap:8px}
}
@media(max-width:480px){
  .brand-name{font-size:11px}
  .brand-sub{font-size:7px}
  .language-toggle{padding:8px 9px;font-size:8px}
  .hero-v9{padding-top:42px}
  .hero-v9 h1{font-size:48px;letter-spacing:-2.5px}
  .service-v9{padding:92px 18px 20px;min-height:270px}
  .service-icon{left:18px;top:18px;width:55px;height:55px}
  .service-access{top:27px}
  .synergy-v9{
    min-height:620px;
    align-items:flex-end;
  }
  .synergy-bg-v9{object-position:58% center}
  .synergy-v9:before{
    background:
      linear-gradient(0deg,rgba(1,9,15,.96) 0%,rgba(1,10,16,.80) 39%,rgba(1,9,15,.24) 70%,rgba(1,9,15,.10) 100%);
  }
  .synergy-v9:after{right:12px;top:12px}
  .synergy-copy-v9{width:auto;margin:0 20px 18px;padding:24px 0}
  .synergy-copy-v9 h2{font-size:40px;letter-spacing:-1.5px}
  .synergy-metrics{grid-template-columns:1fr 1fr}
  .vrax-data{flex-direction:column;gap:12px}
}


/* COMMAND NETWORK CONNECTION SEQUENCE */
.command-card{
  width:min(620px,calc(100vw - 32px));
  overflow:hidden;
}
.command-link-visual{
  position:relative;
  height:92px;
  margin:18px 0 14px;
  border:1px solid rgba(73,221,255,.16);
  background:
    linear-gradient(90deg,rgba(21,127,160,.06),rgba(1,12,18,.22),rgba(21,127,160,.06));
}
.command-node{
  position:absolute;
  top:50%;
  width:18px;
  height:18px;
  margin-top:-9px;
  border:2px solid #58dbff;
  border-radius:50%;
  background:#041923;
  box-shadow:0 0 20px rgba(77,220,255,.35);
}
.command-node:after{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:50%;
  background:#68e7ff;
  box-shadow:0 0 10px #68e7ff;
}
.command-node.local{left:38px}
.command-node.remote{right:38px}
.command-beam{
  position:absolute;
  left:66px;
  right:66px;
  top:50%;
  height:2px;
  margin-top:-1px;
  overflow:hidden;
  background:rgba(73,221,255,.14);
}
.command-beam:after{
  content:"";
  position:absolute;
  top:0;
  left:-30%;
  width:30%;
  height:100%;
  background:linear-gradient(90deg,transparent,#61e2ff,transparent);
  box-shadow:0 0 12px rgba(97,226,255,.65);
  animation:commandBeam 1s linear infinite;
}
@keyframes commandBeam{
  to{left:110%}
}
.command-terminal{
  border:1px solid rgba(69,209,245,.15);
  background:rgba(1,11,17,.58);
}
.command-terminal-row{
  display:grid;
  grid-template-columns:115px 1fr;
  gap:15px;
  padding:9px 12px;
  border-bottom:1px solid rgba(69,209,245,.09);
  font-size:8px;
  letter-spacing:1.2px;
}
.command-terminal-row:last-child{border-bottom:0}
.command-terminal-row span{color:#517b88}
.command-terminal-row strong{color:#bfe9f3}
.command-progress{
  height:7px;
  margin-top:15px;
  border:1px solid rgba(68,210,246,.24);
  background:#01090e;
  overflow:hidden;
}
.command-progress-bar{
  width:8%;
  height:100%;
  background:linear-gradient(90deg,#168db0,#53dcff);
  box-shadow:0 0 14px rgba(77,220,255,.38);
  transition:width .48s ease;
}
.command-progress-label{
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-top:7px;
  font-size:7px;
  letter-spacing:1.35px;
  color:#618b98;
}
.command-progress-label b{color:#9edbe9}
.command-failure{
  margin-top:17px;
  padding:15px 16px;
  border:1px solid rgba(255,97,97,.36);
  background:rgba(67,8,10,.24);
  box-shadow:inset 0 0 30px rgba(255,50,50,.035);
}
.command-failure-code{
  margin-bottom:7px;
  font-size:7px;
  letter-spacing:1.45px;
  color:#d27575;
}
.command-failure strong{
  display:block;
  font-size:22px;
  letter-spacing:.2px;
  color:#ffd9d9;
}
.command-failure p{
  margin:7px 0 5px;
  font-size:11px;
  font-weight:800;
  letter-spacing:1px;
  color:#ff9c9c;
}
.command-failure small{
  font-size:7px;
  letter-spacing:1.25px;
  color:#b77a7a;
}
.command-actions{margin-top:15px}
.command-modal.failed .command-progress-bar{
  background:linear-gradient(90deg,#7d121a,#ff6262);
  box-shadow:0 0 14px rgba(255,78,78,.35);
}
.command-modal.failed .command-node{
  border-color:#ff666d;
  box-shadow:0 0 20px rgba(255,72,80,.30);
}
.command-modal.failed .command-node:after{
  background:#ff6970;
  box-shadow:0 0 10px #ff6970;
}
.command-link-visual.failed .command-beam:after{animation:none;left:35%;width:30%;background:#ff6068;box-shadow:0 0 12px rgba(255,75,83,.45)}
@media(max-width:520px){
  .command-terminal-row{grid-template-columns:88px 1fr}
  .command-node.local{left:22px}
  .command-node.remote{right:22px}
  .command-beam{left:50px;right:50px}
}