:root{
  --cyan:#39e1ff;
  --cyan-soft:#bdf5ff;
  --cyan-deep:#087aa0;
  --gold:#f0c86d;
  --gold-hot:#ffe49a;
  --white:#edf8ff;
  --quiet:#72b9c8;
  --panel:#03111e;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#02070e;color:var(--white);font-family:Rajdhani,'Segoe UI',sans-serif}
#viewport{position:fixed;inset:0;overflow:hidden;background:radial-gradient(circle at 50% 45%,#0c1825 0%,#030810 75%)}
#hud{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;overflow:hidden;background:#030a12;isolation:isolate}
.hud-shell{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block;user-select:none;pointer-events:none;z-index:0}
.zone{position:absolute;z-index:4;overflow:hidden}

@font-face{
  font-family:'ScienceWeise';
  src:url('../assets/fonts/ScienceWeiseBold-Bold.otf') format('opentype');
  font-display:swap;
}

/* Header */
.brand-zone{left:62px;top:45px;width:515px;height:82px}
.brand-kicker{font-family:Orbitron,sans-serif;font-size:12px;font-weight:700;letter-spacing:2.2px;color:#83c9d9;line-height:1;margin-bottom:8px}
.brand-name{font-family:'ScienceWeise',Orbitron,sans-serif;font-size:42px;line-height:1;color:var(--gold);letter-spacing:1px;white-space:nowrap;font-feature-settings:"liga" 0,"calt" 0;font-variant-ligatures:none;text-shadow:0 0 10px rgba(240,200,109,.14)}
.brand-name span{color:var(--cyan)}
.date-zone{left:614px;top:46px;width:705px;height:75px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:700;font-size:47px;line-height:1;color:#f0f9ff;white-space:nowrap;text-shadow:0 2px 3px rgba(0,0,0,.9),0 0 12px rgba(86,221,255,.18);background:linear-gradient(90deg,transparent 0%,rgba(2,9,16,.10) 10%,rgba(2,9,16,.22) 72%,rgba(2,9,16,.10) 92%,transparent 100%)}
.clock-zone{left:1335px;top:46px;width:430px;height:86px;text-align:right}
.clock{font-family:'Share Tech Mono',Consolas,monospace;font-size:54px;line-height:1;color:#c8f7ff;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:.5px;text-shadow:0 0 11px rgba(57,225,255,.18)}
.clock-kicker{margin-top:7px;font-family:Orbitron,sans-serif;color:var(--cyan);font-size:11px;font-weight:700;letter-spacing:1.7px;white-space:nowrap}

/* Calendar is intentionally fully code-rendered. The opaque surface hides the old baked calendar. */
.calendar-zone{left:39px;top:166px;width:516px;height:342px;overflow:visible}
.calendar-surface{position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,12,22,.99),rgba(4,16,28,.985));border:1px solid rgba(58,219,255,.42);box-shadow:inset 0 0 25px rgba(19,111,145,.13),0 0 12px rgba(16,154,199,.06);overflow:hidden}
.calendar-surface::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(56,220,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(56,220,255,.025) 1px,transparent 1px);background-size:24px 24px;pointer-events:none}
.calendar-month{position:relative;z-index:2;height:58px;display:flex;align-items:center;justify-content:center;font-family:'ScienceWeise',Orbitron,sans-serif;font-size:42px;color:#dff8ff;letter-spacing:1px;border-bottom:1px solid rgba(57,225,255,.52);font-feature-settings:"liga" 0,"calt" 0;font-variant-ligatures:none}
.calendar-weekdays,.calendar-days{position:relative;z-index:2;display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
.calendar-weekdays{height:38px;align-items:center;color:#9ff4ff;font-family:Orbitron,sans-serif;font-size:18px;font-weight:800;border-bottom:1px solid rgba(57,225,255,.58)}
.calendar-weekdays span:not(:last-child){border-right:1px solid rgba(57,225,255,.42)}
.calendar-days{height:246px;grid-template-rows:repeat(6,41px)}
.cal-cell{position:relative;display:grid;place-items:center;font-family:'Share Tech Mono',Consolas,monospace;font-size:26px;color:#edf8ff;font-variant-numeric:tabular-nums;border-right:1px solid rgba(57,225,255,.38);border-bottom:1px solid rgba(57,225,255,.38);text-shadow:0 0 7px rgba(125,226,255,.12)}
.cal-cell:nth-child(7n){border-right:0}
.cal-cell:nth-last-child(-n+7){border-bottom:0}
.cal-cell.empty{color:transparent}
.cal-cell.weekend:not(.empty){color:#9cb7c8}
.cal-cell.today{background:linear-gradient(180deg,rgba(171,244,255,.97),rgba(108,226,244,.91));color:#02121f;font-weight:700;text-shadow:none;box-shadow:inset 0 0 0 1px #d8ffff,0 0 18px rgba(87,226,255,.54)}
.cal-cell.today::after{content:"";position:absolute;inset:3px;border:1px solid rgba(2,32,48,.36);pointer-events:none}

/* Expanded left-column mode area */
.mode-zone{left:137px;top:716px;width:424px;height:84px;padding-top:0}
.mode-code-label{display:none}
.mode-main{margin-top:27px;font-family:'ScienceWeise',Orbitron,sans-serif;font-size:34px;line-height:1;color:#f2fbff;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-feature-settings:"liga" 0,"calt" 0;font-variant-ligatures:none;text-shadow:0 0 10px rgba(57,225,255,.12)}
.mode-sub{margin-top:6px;font-family:Orbitron,sans-serif;font-size:13px;line-height:1;color:#6fe9ff;text-transform:uppercase;letter-spacing:1.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mode-sub:empty{display:none}

/* Central dynamic copy uses the blank fields in the illustrated shell. */
.directive-zone{left:620px;top:207px;width:680px;height:145px}
.lesson-title{margin:0;font-family:'ScienceWeise',Orbitron,sans-serif;font-size:50px;line-height:1.03;letter-spacing:.2px;text-transform:uppercase;color:var(--gold);max-width:670px;max-height:138px;overflow:hidden;overflow-wrap:anywhere;font-feature-settings:"liga" 0,"calt" 0;font-variant-ligatures:none;text-shadow:0 0 11px rgba(240,200,109,.09)}
.objective-zone{left:622px;top:466px;width:650px;height:282px;padding-top:0}
.objective-text{width:620px;max-height:226px;overflow:hidden;font-family:Rajdhani,'Segoe UI',sans-serif;font-size:45px;line-height:1.08;font-weight:600;color:#eef9ff;overflow-wrap:anywhere;text-shadow:0 0 8px rgba(65,185,225,.08)}
.objective-text::before{content:'› ';color:var(--cyan);font-weight:700}
.objective-footer{position:absolute;left:2px;bottom:2px;font-family:Orbitron,sans-serif;font-size:10px;color:#3cb7cf;letter-spacing:1.3px;white-space:nowrap;opacity:.82}

/* Dynamic right-column panels. The surfaces hide baked placeholder graphics while preserving outer frame geometry. */
.counter-zone{width:304px;overflow:hidden}
.counter-surface{position:absolute;inset:0;background:radial-gradient(circle at 28% 60%,rgba(10,43,62,.68),rgba(2,12,21,.97) 62%),linear-gradient(180deg,rgba(2,12,22,.97),rgba(3,14,25,.99));border:1px solid rgba(45,202,239,.22);box-shadow:inset 0 0 28px rgba(14,97,128,.13)}
.counter-surface::after{content:"";position:absolute;left:16px;right:16px;top:50px;height:1px;background:linear-gradient(90deg,rgba(57,225,255,.7),rgba(57,225,255,.12),transparent)}
.full-zone{left:1572px;top:166px;height:194px}
.marking-zone{left:1572px;top:397px;height:190px}
.seniors-zone{left:1572px;top:618px;height:164px}
.counter-label{position:absolute;left:19px;top:15px;z-index:2;font-family:'ScienceWeise',Orbitron,sans-serif;font-size:17px;line-height:1;color:var(--gold);text-transform:uppercase;white-space:nowrap;font-feature-settings:"liga" 0,"calt" 0;font-variant-ligatures:none}
.count-number{position:absolute;z-index:3;right:18px;bottom:31px;width:112px;font-family:'ScienceWeise',Orbitron,sans-serif;font-size:75px;line-height:.92;color:var(--gold-hot);text-align:right;font-variant-numeric:tabular-nums;font-feature-settings:"liga" 0,"calt" 0;font-variant-ligatures:none;letter-spacing:.2px;text-shadow:0 0 12px rgba(240,200,109,.16)}
.count-sub{position:absolute;z-index:3;right:18px;bottom:14px;width:140px;text-align:right;font-family:Orbitron,sans-serif;font-size:11.5px;font-weight:700;line-height:1;color:#96efff;letter-spacing:.82px;text-transform:uppercase;white-space:nowrap;text-shadow:0 0 5px rgba(57,225,255,.14)}
.radar-svg{position:absolute;z-index:2;left:11px;bottom:13px;width:119px;height:119px;opacity:.66;overflow:visible}
.radar-svg circle,.radar-svg path{fill:none;stroke:rgba(54,220,255,.5);stroke-width:1}
.radar-svg circle:nth-child(2){stroke-dasharray:4 5}.radar-svg circle:nth-child(3){stroke-dasharray:2 5}
.counter-radar-sweep{position:absolute;z-index:2;left:22px;bottom:24px;width:97px;height:97px;border-radius:50%;background:conic-gradient(from 10deg,transparent 0deg,transparent 304deg,rgba(57,225,255,.03) 315deg,rgba(57,225,255,.32) 350deg,transparent 360deg);mix-blend-mode:screen;animation:radarSpin 12s linear infinite}
.quarter-badge{position:absolute;z-index:3;left:19px;top:57px;font-family:'Share Tech Mono',monospace;font-size:19px;color:#93f0ff;letter-spacing:1px}
.marking-zone .count-number{right:18px;top:53px;bottom:auto;font-size:65px}
.marking-zone .count-sub{right:18px;top:115px;bottom:auto;font-size:11px}
.quarter-graph{position:absolute;z-index:2;left:12px;right:12px;bottom:8px;width:280px;height:70px;overflow:visible;opacity:.9}
.graph-grid path{stroke:rgba(57,225,255,.10);stroke-width:1;vector-effect:non-scaling-stroke}
.graph-trace{fill:none;vector-effect:non-scaling-stroke}
.graph-trace.ghost{stroke:rgba(53,199,236,.18);stroke-width:4;filter:drop-shadow(0 0 7px rgba(57,225,255,.25))}
.graph-trace.live{stroke:#43dcff;stroke-width:1.6;stroke-dasharray:12 7;animation:graphFlow 10s linear infinite;filter:drop-shadow(0 0 4px rgba(57,225,255,.38))}
.quarter-progress-line{stroke:rgba(255,224,128,.78);stroke-width:1.2;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 4px rgba(255,224,128,.34))}
.senior-top-mask{position:absolute;left:0;right:0;top:0;height:94px;background:linear-gradient(180deg,rgba(2,12,22,.985),rgba(2,12,22,.92) 76%,rgba(2,12,22,0));z-index:1}
.seniors-zone .counter-label{z-index:3}
.seniors-zone .count-number{top:45px;right:18px;bottom:auto;font-size:66px}
.seniors-zone .count-sub{top:112px;right:18px;bottom:auto;font-size:11px}

/* Communication area */
.communication-zone{left:236px;top:860px;width:1080px;height:70px}
.comm-text{max-height:66px;overflow:hidden;font-family:Rajdhani,'Segoe UI',sans-serif;font-weight:600;font-size:29px;line-height:1.08;color:#f3f8fb;white-space:normal;overflow-wrap:anywhere;text-shadow:0 0 7px rgba(66,182,219,.08)}

/* System status, countdown timer and progress are entirely live code. */
.status-zone{left:132px;top:965px;width:1290px;height:89px;overflow:visible}
.status-surface{position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,11,20,.985),rgba(2,13,23,.985));box-shadow:inset 0 0 30px rgba(9,78,104,.11)}
.status-copy{position:absolute;left:15px;top:15px;width:300px}
.status-title{font-family:'ScienceWeise',Orbitron,sans-serif;font-size:21px;line-height:1;color:var(--gold);text-transform:uppercase;white-space:nowrap;font-feature-settings:"liga" 0,"calt" 0;font-variant-ligatures:none}
.status-title span{color:var(--cyan);font-family:Orbitron,sans-serif;font-size:15px}
.status-subline{margin-top:10px;font-family:Orbitron,sans-serif;font-size:9px;line-height:1.15;color:#59cfe5;letter-spacing:.75px;white-space:nowrap}
.timer-stack{position:absolute;left:320px;top:10px;width:160px;text-align:right}
.timer-value{font-family:'Share Tech Mono',Consolas,monospace;font-size:42px;line-height:1;color:var(--gold-hot);white-space:nowrap;font-variant-numeric:tabular-nums;text-shadow:0 0 9px rgba(240,200,109,.12)}
.timer-label{margin-top:4px;font-family:Orbitron,sans-serif;font-size:8px;color:#64d9eb;letter-spacing:1.05px;text-transform:uppercase;white-space:nowrap}
.progress-wrap{position:absolute;left:500px;top:19px;width:548px;height:50px;overflow:visible}
.progress-svg{position:absolute;inset:0;width:100%;height:100%}
.progress-track{fill:rgba(0,14,25,.9);stroke:rgba(70,223,255,.74);stroke-width:1}
.progress-bar{fill:url(#progressGold);filter:drop-shadow(0 0 6px rgba(240,200,109,.25));transition:width .7s linear}
.progress-ticks path{stroke-width:1;vector-effect:non-scaling-stroke}
.progress-ticks.major path{stroke:rgba(4,22,31,.48)}
.progress-ticks.minor path{stroke:rgba(58,188,219,.18)}
.progress-scan{position:absolute;top:10px;bottom:10px;width:84px;left:-120px;background:linear-gradient(90deg,transparent,rgba(255,243,188,.18),transparent);transform:skewX(-18deg);animation:progressScan 12s ease-in-out infinite;pointer-events:none}
.progress-endpoint{position:absolute;top:22px;left:4px;width:14px;height:14px;border-radius:50%;background:#ffe59a;box-shadow:0 0 9px rgba(255,229,154,.78),0 0 18px rgba(240,200,109,.35);transform:translate(-50%,-50%);transition:left .7s linear,opacity .25s linear;opacity:0;pointer-events:none}
.percent-cap{position:absolute;left:1085px;top:10px;width:118px;height:57px;background:linear-gradient(180deg,rgba(5,18,30,.98),rgba(3,13,23,.98));border:1px solid rgba(70,223,255,.52);clip-path:polygon(12px 0,100% 0,100% 43px,104px 57px,0 57px,0 12px);box-shadow:inset 0 0 18px rgba(11,87,116,.14),0 0 10px rgba(19,123,160,.07)}
.percent-cap::before{content:"";position:absolute;left:-37px;top:27px;width:37px;height:1px;background:linear-gradient(90deg,rgba(70,223,255,.26),rgba(70,223,255,.92));box-shadow:-7px 0 0 -0.25px rgba(240,200,109,.55)}
.percent-cap::after{content:"";position:absolute;inset:3px;border:1px solid rgba(57,225,255,.14);clip-path:polygon(10px 0,100% 0,100% 40px,101px 51px,0 51px,0 10px);pointer-events:none}
.percent-zone{position:absolute;left:0;top:8px;width:100%;padding-right:11px;text-align:right;font-family:Orbitron,sans-serif;font-size:27px;font-weight:800;line-height:1;color:#b5f5ff;font-variant-numeric:tabular-nums}
.percent-label{position:absolute;left:0;top:40px;width:100%;padding-right:11px;text-align:right;font-family:Orbitron,sans-serif;font-size:8px;font-weight:700;line-height:1;color:#68dbe9;letter-spacing:1px;text-transform:uppercase;white-space:nowrap}
.cap-divider{position:absolute;left:1248px;top:17px;width:18px;height:42px;font-size:0;opacity:.88}
.cap-divider::before{content:"";position:absolute;left:8px;top:3px;width:1px;height:34px;background:linear-gradient(180deg,transparent,rgba(73,224,250,.92) 18%,rgba(73,224,250,.92) 82%,transparent);box-shadow:0 0 7px rgba(57,225,255,.25)}
.cap-divider::after{content:"";position:absolute;left:3px;top:19px;width:11px;height:3px;background:linear-gradient(90deg,rgba(240,200,109,.15),rgba(240,200,109,.82),rgba(57,225,255,.22));clip-path:polygon(2px 0,100% 0,9px 100%,0 100%)}
.status-zone[data-state="standby"] .timer-value{color:#bfefff}
.status-zone[data-state="standby"] .status-subline{color:#8fe7f8}
.status-zone[data-state="transition"] .percent-cap{border-color:rgba(70,223,255,.62)}
.status-zone[data-state="transition"] .progress-scan{animation-duration:8s}
.status-zone[data-state="active"] .percent-cap{border-color:rgba(70,223,255,.5)}
.status-zone[data-state="ending"] .progress-bar{filter:drop-shadow(0 0 8px rgba(240,200,109,.42))}
.status-zone[data-state="ending"] .progress-endpoint{box-shadow:0 0 10px rgba(255,229,154,.85),0 0 22px rgba(240,200,109,.48);animation:endPulse 1.6s ease-in-out infinite}
.status-zone[data-state="complete"] .timer-value{color:#c5f6ff;font-size:32px;letter-spacing:.8px}
.status-zone[data-state="complete"] .percent-cap{border-color:rgba(95,225,246,.28);background:linear-gradient(180deg,rgba(4,16,26,.9),rgba(3,12,21,.93));opacity:.58}
.status-zone[data-state="complete"] .progress-scan{opacity:.16}
.status-zone[data-state="complete"] .progress-track{stroke:rgba(70,223,255,.42)}


.directive-zone.missing-data::after,.objective-zone.missing-data::after{content:attr(data-missing-label);position:absolute;right:14px;top:12px;padding:4px 8px 3px;border:1px solid rgba(240,200,109,.38);background:rgba(5,18,30,.72);font-family:Orbitron,sans-serif;font-size:8px;font-weight:700;line-height:1;color:#f0c86d;letter-spacing:.9px;text-transform:uppercase;white-space:nowrap;box-shadow:0 0 8px rgba(240,200,109,.08)}
.objective-zone.missing-data::after{top:13px}

.icon-bank-overlay{position:absolute;z-index:5;left:1418px;top:975px;width:333px;height:60px;display:grid;grid-template-columns:repeat(5,1fr);column-gap:10px;pointer-events:none}
.icon-bank-overlay span{position:relative;height:60px;border-radius:7px;opacity:1;background:rgba(1,7,13,.12);box-shadow:inset 0 0 12px rgba(1,7,13,.18);transition:background .25s ease,transform .25s ease,box-shadow .25s ease}
.icon-bank-overlay span::after{content:"";position:absolute;left:7px;right:7px;bottom:6px;height:3px;border-radius:3px;background:rgba(57,225,255,.10);box-shadow:0 0 5px rgba(57,225,255,.06)}
.icon-bank-overlay span.active{background:rgba(0,0,0,0);transform:translateY(-1px);box-shadow:none}
.icon-bank-overlay span.active::before{content:"";position:absolute;inset:4px;border:1px solid rgba(57,225,255,.42);border-radius:7px;box-shadow:inset 0 0 11px rgba(57,225,255,.08),0 0 10px rgba(57,225,255,.10)}
.icon-bank-overlay span.active::after{background:linear-gradient(90deg,rgba(240,200,109,.48),rgba(57,225,255,.66));box-shadow:0 0 8px rgba(57,225,255,.28)}
.icon-bank-overlay span.dim{background:rgba(1,7,13,.22);box-shadow:inset 0 0 14px rgba(1,7,13,.30)}


/* Globe overlays add subtle faux rotation over the baked-in planet artwork. */
.globe-overlay{position:absolute;z-index:2;pointer-events:none;overflow:hidden;isolation:isolate}
.globe-overlay span{position:absolute;inset:0;display:block}
.globe-overlay .globe-grid{
  background:
    repeating-linear-gradient(90deg,transparent 0 12px,rgba(104,236,255,.18) 12px 13px,transparent 13px 26px),
    repeating-linear-gradient(0deg,transparent 0 15px,rgba(70,216,255,.12) 15px 16px,transparent 16px 31px);
  mix-blend-mode:screen;
  opacity:.34;
  transform:scaleX(.88);
  transform-origin:center;
  filter:blur(.15px);
  animation:globeGridShift var(--spin,60s) linear infinite;
}
.globe-overlay .globe-sheen{
  background:linear-gradient(105deg,transparent 12%,rgba(158,237,255,.03) 30%,rgba(158,237,255,.16) 46%,rgba(255,255,255,.06) 50%,rgba(146,233,255,.12) 56%,transparent 74%);
  mix-blend-mode:screen;
  opacity:.75;
  transform:translateX(-120%) skewX(-14deg);
  animation:globeSheen var(--sheen,24s) ease-in-out infinite;
}
.globe-overlay .globe-terminator{
  background:radial-gradient(ellipse at 14% 50%,rgba(0,0,0,.48) 0%,rgba(0,0,0,.3) 26%,rgba(0,0,0,.08) 48%,transparent 60%);
  mix-blend-mode:multiply;
  opacity:.7;
  transform:translateX(-6%);
  animation:globeTerminator var(--terminator,38s) ease-in-out infinite;
}
.globe-overlay .globe-rim{
  background:radial-gradient(circle at 34% 32%,rgba(146,241,255,.12),transparent 38%),radial-gradient(circle at 52% 52%,transparent 58%,rgba(58,215,255,.22) 74%,rgba(39,131,177,.12) 86%,transparent 100%);
  mix-blend-mode:screen;
  opacity:.8;
}
.calendar-globe{left:160px;top:566px;width:136px;height:136px;border-radius:50%;--spin:54s;--sheen:20s;--terminator:34s;opacity:.78;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 0 62%,transparent 78%);mask-image:radial-gradient(circle at 50% 50%,#000 0 62%,transparent 78%)}
.calendar-globe .globe-grid{opacity:.42;transform:scaleX(.8)}
.calendar-globe .globe-rim{opacity:.92}
.header-globe{left:1198px;top:-8px;width:408px;height:170px;--spin:88s;--sheen:34s;--terminator:64s;opacity:.44;clip-path:ellipse(48% 63% at 50% 70%)}
.header-globe .globe-grid{opacity:.22;transform:scaleX(.94)}
.header-globe .globe-terminator{background:radial-gradient(ellipse at 16% 56%,rgba(0,0,0,.38) 0%,rgba(0,0,0,.22) 28%,rgba(0,0,0,.06) 50%,transparent 62%)}
.seniors-globe{left:1568px;top:695px;width:196px;height:90px;--spin:76s;--sheen:28s;--terminator:54s;opacity:.5;clip-path:ellipse(51% 82% at 42% 100%)}
.seniors-globe .globe-grid{opacity:.2;transform:scaleX(.92)}
.seniors-globe .globe-rim{background:radial-gradient(circle at 28% 18%,rgba(141,240,255,.08),transparent 40%),radial-gradient(circle at 50% 125%,transparent 48%,rgba(58,215,255,.24) 73%,rgba(39,131,177,.1) 88%,transparent 100%)}

/* Ambient motion */
.ambient-light-sweep{position:absolute;z-index:1;top:-160px;left:-390px;width:340px;height:1450px;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(61,220,255,.038),rgba(255,221,126,.028),transparent);filter:blur(1px);mix-blend-mode:screen;pointer-events:none;animation:lightSweep 28s ease-in-out infinite}
.top-radar{position:absolute;z-index:2;left:1798px;top:38px;width:92px;height:92px;border-radius:50%;overflow:hidden;opacity:.34;pointer-events:none}
.top-radar span{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 306deg,rgba(57,225,255,.05) 316deg,rgba(57,225,255,.55) 354deg,transparent 360deg);animation:radarSpin 14s linear infinite}
.planet-orbit{position:absolute;z-index:2;left:81px;top:547px;width:332px;height:130px;border:1px solid rgba(240,185,68,.23);border-radius:50%;transform:rotate(-8deg);pointer-events:none}
.planet-orbit span{position:absolute;right:26px;top:12px;width:7px;height:7px;border-radius:50%;background:#ffe17d;box-shadow:0 0 9px rgba(255,221,126,.82)}
@supports (offset-path:ellipse(46% 42% at 50% 50%)){.planet-orbit span{left:0;right:auto;top:0;offset-path:ellipse(46% 42% at 50% 50%);offset-rotate:0deg;animation:orbitDot 16s linear infinite}}
.molecule-pulses{position:absolute;z-index:2;left:1262px;top:430px;width:230px;height:170px;pointer-events:none}
.molecule-pulses i{position:absolute;left:var(--x);top:var(--y);width:7px;height:7px;margin:-3px 0 0 -3px;border-radius:50%;background:#67eaff;box-shadow:0 0 7px rgba(73,220,255,.75);animation:moleculePulse 5.5s ease-in-out infinite;animation-delay:var(--delay)}

.data-status{position:absolute;z-index:8;right:48px;bottom:8px;font-family:Orbitron,sans-serif;font-size:9px;line-height:1;color:#65cfc9;letter-spacing:.9px;text-transform:uppercase;white-space:nowrap;opacity:.82}
.data-status::before{content:'';display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;vertical-align:1px;background:#56dfbd;box-shadow:0 0 6px rgba(86,223,189,.65)}
.data-status.syncing::before{background:#62d9ff;box-shadow:0 0 6px rgba(98,217,255,.65)}
.data-status.cached::before,.data-status.partial::before,.data-status.preview::before{background:var(--gold);box-shadow:0 0 6px rgba(240,200,109,.6)}
.data-status.offline::before{background:#ffb46a;box-shadow:0 0 6px rgba(255,180,106,.6)}
.data-status.warning{color:var(--gold)}
.preview-badge{position:absolute;z-index:9;left:50%;bottom:8px;transform:translateX(-50%);font:10px Orbitron,sans-serif;color:#f0c86d;letter-spacing:1.2px;opacity:.88;white-space:nowrap}
.value-flash{animation:valueFlash .55s ease-out}

@keyframes radarSpin{to{transform:rotate(360deg)}}
@keyframes graphFlow{to{stroke-dashoffset:-38}}
@keyframes progressScan{0%,28%{left:-120px;opacity:0}38%{opacity:.72}53%{left:700px;opacity:.4}65%,100%{left:700px;opacity:0}}
@keyframes lightSweep{0%,12%{left:-390px;opacity:0}25%{opacity:.9}58%{left:2020px;opacity:.65}72%,100%{left:2020px;opacity:0}}
@keyframes orbitDot{from{offset-distance:0%}to{offset-distance:100%}}
@keyframes moleculePulse{0%,78%,100%{opacity:.25;transform:scale(.72)}84%{opacity:1;transform:scale(1.34)}91%{opacity:.52;transform:scale(.9)}}
@keyframes globeGridShift{0%{background-position:0 0,0 0}100%{background-position:52px 0,0 30px}}
@keyframes globeSheen{0%,14%{transform:translateX(-130%) skewX(-14deg);opacity:0}28%{opacity:.72}58%{transform:translateX(96%) skewX(-14deg);opacity:.4}70%,100%{transform:translateX(96%) skewX(-14deg);opacity:0}}
@keyframes globeTerminator{0%,100%{transform:translateX(-8%)}50%{transform:translateX(12%)}}
@keyframes valueFlash{0%{filter:brightness(1.8);text-shadow:0 0 20px rgba(255,232,158,.72)}100%{filter:none}}
@keyframes endPulse{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.18)}}

/* Optional calibration guide: ?preview=1&guides=1 */
.guides .zone{outline:1px dashed rgba(255,0,180,.45);outline-offset:-1px}
.guides .calendar-surface,.guides .counter-surface,.guides .status-surface{outline:1px solid rgba(255,220,0,.35)}

@media (prefers-reduced-motion:reduce){
  .ambient-light-sweep,.top-radar span,.planet-orbit span,.molecule-pulses i,.counter-radar-sweep,.graph-trace.live,.progress-scan,.globe-overlay .globe-grid,.globe-overlay .globe-sheen,.globe-overlay .globe-terminator{animation:none!important}
  .progress-bar{transition:none}
}

/* Last-resort overflow protection after automatic font fitting. */
.is-clamped{display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:var(--clamp-lines,2);overflow:hidden!important}