/* Cinematic edition: deep-space studio, luminous 3D agent world. */
:root{--ink:#edf4ff;--ink2:#9baecc;--muted:#7c91b5;--line:#2c4065;--bg:#071226;--blue:#4aa7ff;--blueSoft:#142c50;--purple:#a37cff;--purpleSoft:#24194b;--green:#4de8b6;--teal:#4ee5dc}
html,body{background:radial-gradient(circle at 50% 20%,#203a68,#030711 75%);color:var(--ink)}
#stage{background:radial-gradient(ellipse at 35% 30%,#142b50 0,#081326 60%,#050b19);box-shadow:0 35px 100px #000b,inset 0 0 90px #3468a00c;border:1px solid #5075ad50}
#stage:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 24%,#8dceff09 25%,transparent 26%),radial-gradient(circle at 75% 35%,#663ddd18,transparent 35%);background-size:130px 130px,auto;z-index:0}
.eyebrow{color:#4ee5dc;text-shadow:0 0 15px #4ee5dc80}.title{color:#f7faff;text-shadow:0 3px 18px #0008}
#floor{background:linear-gradient(145deg,#152d50dd,#09142cdd 60%,#081024),radial-gradient(#5f8ec5 1px,transparent 1px);border:1px solid #5185c77a;box-shadow:inset 0 0 70px #163963aa,0 14px 38px #0008;perspective:850px;transform-style:preserve-3d}
#floor:after{content:"";position:absolute;inset:18px;border:1px solid #4894e21c;border-radius:16px;pointer-events:none;box-shadow:inset 0 0 35px #3bc5fe15}
.floorLabel{color:#7fe5ff}.legend{color:#a9c2e7}.legend .fnote{color:#789cc9}
.station{background:linear-gradient(155deg,#263e68,#132440 65%,#0a172e);border:1px solid #5378ad;border-bottom:5px solid #091224;box-shadow:0 12px 0 #050b17,0 18px 20px #0009,inset 0 1px 1px #d8edff3b;transform:perspective(600px) rotateX(7deg) translateY(0);transition:transform .35s,box-shadow .35s,background .35s,border-color .35s}
.station:before{content:"";position:absolute;inset:5px;border-radius:11px;border:1px solid #a5dfff18;pointer-events:none}
.station .lbl,.station.active .lbl{color:#eff8ff;text-shadow:0 2px 7px #000}.station .ico{font-size:24px;opacity:1;filter:drop-shadow(0 0 10px #77e6ff)}
.station.active{background:linear-gradient(145deg,#244d75,#182d5e 65%,#101d42);border-color:#65eeff;box-shadow:0 12px 0 #061928,0 0 0 2px #5cecff3a,0 0 38px #5cecff8a,inset 0 1px 18px #70e6ff32;transform:perspective(600px) rotateX(3deg) translateY(-9px) scale(1.04);z-index:8;animation:stationRadiance 1.8s ease-in-out infinite}
@keyframes stationRadiance{50%{box-shadow:0 12px 0 #061928,0 0 0 4px #5cecff50,0 0 55px #5cecffaa,inset 0 1px 22px #70e6ff55}}
.tag{background:#263d64;color:#b4d2f6}.tag.mcp{background:#093f54;color:#5be6e0}.tag.con{background:#45301e;color:#ffd18c}.tag.wf{background:#173963;color:#80baff}.tag.kn{background:#39245c;color:#ca9bff}
.chip.s{color:#94d8ff}.chip.g{background:#784cf0}.trail{stroke:#65ecff;stroke-width:5;filter:drop-shadow(0 0 7px #2cffff);stroke-dasharray:10 12;animation:trailFlow .55s linear infinite}.trail.old{stroke:#375c8b;filter:none}
@keyframes trailFlow{to{stroke-dashoffset:-22}}
#agent{filter:drop-shadow(0 0 15px #76e8ffbb);transform-style:preserve-3d}#agent .body{filter:drop-shadow(0 12px 8px #000b) drop-shadow(0 0 12px #39dfff77)}#agent .shadow{background:#38f4ff55;filter:blur(6px);height:12px}
#agent:before{content:"";position:absolute;inset:-15px;border:1px solid #66eaffaa;border-radius:50%;box-shadow:0 0 15px #36e0ff55,inset 0 0 15px #36e0ff22;animation:orbit 5s linear infinite;pointer-events:none}#agent:after{content:"✦";position:absolute;left:-17px;top:-19px;color:#6efbff;font-size:20px;text-shadow:0 0 12px cyan;animation:twinkle 1.1s infinite}
@keyframes orbit{to{transform:rotate(360deg)}}@keyframes twinkle{50%{opacity:.3;transform:scale(.7)}}
#agent .bubble{background:#102747;border-color:#4bdffe;color:#edfbff;box-shadow:0 0 18px #48dfff88}
#notes{background:linear-gradient(140deg,#132746ee,#0a1933ee);border-color:#4785c1;color:#bdd1ee;box-shadow:0 12px 25px #0005}#notes .h{color:#82aacc}#notes .right{border-color:#365077}#notes .body div{color:#d5e4fb}#notes .ok{color:#6ff4bd}.bag{background:#251d56;border-color:#a88aff}
#register{background:linear-gradient(135deg,#101f3d,#080f24);border:1px solid #5277ae;box-shadow:0 0 28px #3678ff22,0 15px 30px #0008}#register .h{color:#83a5d1}.row.s .k{color:#7bc8ff}.row.g .k{color:#c7a0ff}.row .usd{color:#70f6c0}
#chat{background:#0b1830;border-color:#426392;box-shadow:0 15px 40px #0007}#chatHead{border-color:#355075;background:#132744}#chatHead .name{color:#eef7ff}#status{color:#89aacd}#msgs{background:radial-gradient(circle at center,#122442,#0a1730)}.msg.user{background:#244977;color:white}.msg.bot{background:#1e3150;color:#eaf2ff}.ticket{background:#362c35;border-color:#986c57;color:#f4e9e9}.ticket.hire{background:#2d2347;border-color:#7658ba}#inputBar{border-color:#385071;background:#0c1830}#input{background:#172b49;border-color:#416187;color:#eff7ff}#send{background:#6552d7}
#caption{background:linear-gradient(110deg,#142b4c,#101c38);border-color:#4a74a8;box-shadow:0 -8px 35px #0005}#cNum{background:linear-gradient(135deg,#3bb4ee,#8350e9);box-shadow:0 0 20px #4aaeff75}#cTitle{color:#fff}#cNarr{color:#b8cdec}#cSub{color:#f0faff}#dots b{background:#345478}#dots b.on{background:#6deaff}
#lesson{background:radial-gradient(circle at 20% 40%,#254775 0,transparent 42%),radial-gradient(circle at 88% 76%,#302767,transparent 44%),#09152b}#lesson .lh{color:#60e4f1}#lesson .lt{color:#f5faff;text-shadow:0 5px 18px #000a}#slide{background:linear-gradient(145deg,#1a2e50,#101e37);color:#f1f6ff;border-color:#5977a3;box-shadow:0 20px 45px #0008}#host .rl{color:#a4badb}#guest{background:#233958;border-color:#597db1}
#start{background:radial-gradient(circle at 50% 30%,#274a7bee,#071326f7 68%);backdrop-filter:blur(12px)}#start:before{content:"";position:absolute;inset:25px;border:1px solid #60ccff23;border-radius:30px;pointer-events:none}#start h1{font-size:42px;max-width:1100px;color:#fff;text-shadow:0 0 35px #5c9fffa0}#start h1:before{content:"THE AGENT ADVENTURE";display:block;font-size:13px;letter-spacing:.32em;color:#78eaff;margin-bottom:14px}#start p{color:#c4d8f5}#start .cast span{filter:drop-shadow(0 12px 16px #000a) drop-shadow(0 0 20px #59caff66);animation:heroHover 3s ease-in-out infinite}#start .cast div:nth-child(2) span{animation-delay:.6s}#start .cast div:nth-child(3) span{animation-delay:1.2s}#start .cast small{color:#93b4df}
@keyframes heroHover{50%{transform:translateY(-9px) rotate(3deg)}}.bigBtn{background:linear-gradient(120deg,#12a6cb,#8460ed);box-shadow:0 10px 32px #599cff80}.bigBtn.alt{background:#172744;color:#abceff;border-color:#68a7ff}
#bill,#endcard,#calc{background:linear-gradient(130deg,#17294b,#0c1830);color:#f1f7ff;border-color:#506e9c}#endcard p,.src,.cp .q,.formula,.cfn,#calc .sub{color:#a7bedf}.box.s{background:#143253}.box.g{background:#332653}.cp.s{background:#173653}.cp.g{background:#302450}.cres{background:#0d1a31}.ci input{background:#203859;color:white;border-color:#57759d}.verdict{background:#09152a}
/* A floating mission camera/HUD that makes retrieval steps readable. */
#cinematicHud{position:absolute;left:57px;top:116px;z-index:12;pointer-events:none;display:flex;align-items:center;gap:8px;opacity:0;transform:translateY(-10px);transition:.3s}
#cinematicHud.visible{opacity:1;transform:none}#cinematicHud .liveDot{width:8px;height:8px;background:#61ffcf;border-radius:50%;box-shadow:0 0 12px #61ffcf;animation:pulse 1s infinite}#cinematicHud .hudText{font-size:10px;letter-spacing:.16em;font-weight:900;color:#8beeff;text-shadow:0 0 9px #4fe3ff}
.dataShard{position:absolute;z-index:28;pointer-events:none;width:34px;height:34px;border:1px solid #8defff;border-radius:10px;background:linear-gradient(145deg,#7be8ff,#4664d4 55%,#2e2879);box-shadow:0 0 25px #34dfffaa,inset 0 0 9px #fff9;display:flex;align-items:center;justify-content:center;color:white;font-size:18px;animation:shardFly var(--dur,1.1s) cubic-bezier(.15,.7,.3,1) forwards}
@keyframes shardFly{0%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(.15) rotate(-160deg)}15%{opacity:1}55%{transform:translate(var(--mx),var(--my)) scale(1.2) rotate(30deg);opacity:1}100%{transform:translate(var(--ex),var(--ey)) scale(.15) rotate(270deg);opacity:0}}
.impactRing{position:absolute;z-index:25;pointer-events:none;width:25px;height:25px;border:2px solid #6dffff;border-radius:50%;box-shadow:0 0 20px #6dffff;animation:impact .75s ease-out forwards}@keyframes impact{to{opacity:0;transform:scale(6);border-width:1px}}
.cinemaBeam{position:absolute;z-index:2;pointer-events:none;left:30px;top:72px;width:730px;height:540px;background:linear-gradient(110deg,transparent 35%,#68dfff18 48%,transparent 58%);transform:translateX(-100%);animation:beamSweep 5s ease-in-out infinite}@keyframes beamSweep{to{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.dataShard,.impactRing,.cinemaBeam,#agent:before,#agent:after,.station.active{animation:none!important}}

/* Legibility pass: the lesson's original slides contain many pale cards.
   Restore their intended dark type palette rather than placing pale type on white. */
#slide{
  --ink:#17253d;--ink2:#334865;--muted:#566b88;--line:#cbd6e5;
  --blue:#1856b8;--blueSoft:#e8f0ff;--purple:#6530c0;
  --purpleSoft:#f1eaff;--green:#137843;
  background:#fff;color:#17253d;border-color:#cbd6e5;
}
#slide .pane,#slide .tile,#slide .gcard,#slide .mt,#slide .lc,#slide .ms,#slide .whoP,#slide .fbox,#slide .agentPill,#slide .math,#slide .abub{
  color:#192b46;
}
#slide .pane p,#slide .tile p,#slide .note,#slide .fn,#slide .sub,#slide .gcard p,#slide .bpc,#slide .xleg{color:#374b67}
#slide .tk,#slide .mchip,#slide .fbx,#slide .cmp div,#slide .pick,#slide .qc,#slide .rrow,#slide .qrow{color:#182942}
#slide .sh,#slide .qhd,#slide .mrow .mn small,#slide .bbTot span,#slide .fn{color:#536681}
#slide .poolBox,#slide .banner,#slide .gbig,#slide .mx2,#slide .vrd,#slide .xtot,#slide .qban,#slide .ub{background:#1a2a48;color:#fff}
#slide .poolBox *,#slide .banner *,#slide .gbig *,#slide .mx2 *,#slide .vrd *,#slide .xtot *,#slide .qban *,#slide .ub *{color:inherit}
#slide .poolBox b,#slide .banner b,#slide .gbig b,#slide .mx2 b,#slide .vrd b,#slide .xtot b,#slide .qban b{color:#ffdc72}

/* Bottom caption: opaque light panel, strong dark type, generous subtitle size. */
#caption{background:#f8fbff;border:2px solid #aabbd3;box-shadow:0 -10px 32px #020b1b77}
#cTitle{color:#14243b;font-size:17px;font-weight:900}
#cTitle span{color:#455a78}
#cNarr{color:#273c59;font-size:16px!important;font-weight:600;font-style:normal;line-height:1.34}
#cSub{color:#10213b;font-size:27px;font-weight:800;line-height:1.23;text-shadow:none}
body.live.ccOn #cTitle,body.live.ccOn #cTitle span{color:#1c3554}
#cNum{color:#fff}
#dots b{background:#c0cfdf}#dots b.done{background:#708cac}#dots b.on{background:#235cba}
#subDock{background:#fff;color:#10213b;border:2px solid #8da6c6;font-weight:800;font-size:19px;box-shadow:0 8px 30px #0006}

/* The controls bar is white: it must never inherit the dark-theme light ink. */
#bar{background:#fff;color:#17253d;border-color:#bdcadc}
#bar button,#chap{background:#fff;color:#162944;border-color:#aebed3;font-weight:750}
#bar button.primary{background:#1e4f9a;border-color:#1e4f9a;color:white}
#bar button.off{color:#5c6880}
#rotTip{background:#172942;color:#fff}

/* Light informational panels elsewhere also receive explicit contrast. */
#calc .ci label{color:#edf4ff}
#calc .cres{color:#eff7ff}
#endcard .box.s{color:#dcecff}#endcard .box.g{color:#eee1ff}
#notes .pl,#notes .pl b{color:#dce9ff}
#chat .receipt{color:#a9bedf}
