:root{--bg:#07090c;--text:#f3f4ef;--muted:#9ba3af;--lime:#b8f45d;--blue:#748dff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 Inter,sans-serif}header{position:fixed;inset:0 0 auto;z-index:20;display:flex;justify-content:space-between;align-items:center;height:64px;padding:0 30px;border-bottom:1px solid #2a3039;background:#07090cdd;backdrop-filter:blur(12px);font-size:9px;letter-spacing:.12em}header a{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}header img{width:31px}.story{position:relative}.stage{position:sticky;top:0;height:100vh;overflow:hidden;background:radial-gradient(circle at center,#15213a,#07090c 60%)}.stage:after{content:'';position:absolute;inset:0;background-image:linear-gradient(#748dff0b 1px,transparent 1px),linear-gradient(90deg,#748dff0b 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(circle,#000,transparent 80%)}.counter{position:absolute;right:28px;top:50%;z-index:5;display:grid;gap:8px;justify-items:center;color:#737c88;font-size:9px}.counter b{color:var(--lime)}.counter i{width:1px;height:70px;background:linear-gradient(var(--lime) var(--progress,0%),#303743 0)}.world{--scene:0;position:absolute;inset:0;z-index:2;transition:filter .7s}.world>svg{position:absolute;inset:0;width:100%;height:100%}.path{fill:none;stroke:#748dff;stroke-width:1.5;stroke-dasharray:9 8;opacity:calc(.08 + var(--scene)*.08);animation:dash 1.2s linear infinite}.file,.core,.review,.output{position:absolute;display:grid;place-items:center;border:1px solid #4b5665;background:#141a22;transition:1s cubic-bezier(.2,.8,.2,1);box-shadow:0 25px 70px #0009}.file{left:12%;width:125px;height:70px}.file b{font-size:10px}.file span{color:#818a96;font-size:8px}.f1{top:22%;transform:translateX(calc(max(0,2 - var(--scene))*-120vw))}.f2{top:44%;transform:translateX(calc(max(0,2 - var(--scene))*-120vw))}.f3{top:66%;transform:translateX(calc(max(0,2 - var(--scene))*-120vw))}.core{left:50%;top:50%;width:170px;height:170px;border-color:var(--blue);border-radius:50%;transform:translate(-50%,-50%) scale(calc(.55 + min(var(--scene),2)*.22));background:radial-gradient(circle,#2b3b6a,#101722)}.core i{position:absolute;inset:14px;border:1px dashed var(--blue);border-radius:50%;animation:spin 12s linear infinite}.core strong{color:var(--lime);font:700 45px Manrope}.core span{color:#9aa8c3;font-size:8px}.review{left:68%;top:20%;width:130px;height:85px;opacity:clamp(0,calc(var(--scene) - 2),1);transform:translateY(calc((3 - var(--scene))*80px))}.review b{color:#ff9c62;font-size:25px}.review span{font-size:8px}.output{right:10%;top:50%;width:180px;height:120px;border-color:#4b9c6f;background:#10281c;opacity:clamp(0,calc(var(--scene) - 3),1);transform:translate(110vw,-50%)}.world[data-scene="4"] .output{transform:translate(0,-50%)}.output>b{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--lime);color:#111}.output strong{font-size:11px}.output span{color:#78ad8e;font-size:7px}.chapter{position:relative;z-index:5;display:flex;align-items:center;min-height:100vh;padding:100px 8vw;pointer-events:none}.chapter.right{justify-content:flex-end}.chapter>div{max-width:520px;padding:28px;background:#080b0fbb;border-left:1px solid #4a5462;backdrop-filter:blur(12px);pointer-events:auto}.chapter.intro{justify-content:center;text-align:center}.chapter.intro>div{max-width:980px;border:0;background:transparent}.chapter p,.ending p{color:var(--lime);font-size:9px;letter-spacing:.14em;text-transform:uppercase}.chapter h1{margin:20px 0;font:600 clamp(55px,7vw,105px)/.98 Manrope;letter-spacing:-.055em}.chapter h2,.ending h2{margin:14px 0;font:600 clamp(40px,5vw,72px)/1.02 Manrope;letter-spacing:-.05em}.chapter span{color:var(--muted);font-size:17px}.chapter a,.ending a{display:inline-block;margin-top:25px;color:var(--lime);font-size:11px;text-decoration:none}.ending{min-height:100vh;padding:14vh 8vw;background:#efefe9;color:#101214}.ending p{color:#5168d5}.ending h2{max-width:1000px;font-size:clamp(55px,8vw,120px)}.ending a{color:#101214;border-bottom:2px solid #101214}@keyframes dash{to{stroke-dashoffset:-34}}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:700px){header>span{display:none}.chapter{padding:80px 18px;align-items:flex-end}.chapter h1{font-size:49px}.chapter h2{font-size:39px}.file{left:5%;width:85px}.core{width:110px;height:110px}.output{right:5%;width:115px}.review{left:auto;right:5%;top:12%}.chapter>div{background:#080b0fee}.counter{right:8px}}@media(prefers-reduced-motion:reduce){.path,.core i{animation:none}.world>*{transition:none!important}}

/* Refined output and conversion ending */
.output-chapter{justify-content:flex-start}.output-chapter>div{max-width:470px}.ending{display:grid;grid-template-columns:.85fr 1fr;gap:8vw;align-items:center;min-height:100vh;padding:12vh 8vw;background:radial-gradient(circle at 75% 40%,#193d38,#0d1d20 58%,#091315);color:#eaf4ee}.ending p{color:#9ed9b4}.ending h2{max-width:720px;font-size:clamp(48px,6vw,90px)}.ending>div>span{display:block;max-width:520px;color:#9db2aa}.ending form{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:28px;border:1px solid #42645b;background:#0a1719cc;box-shadow:20px 24px 0 #102b28}.ending label{display:grid;gap:7px;color:#acc2ba;font-size:10px}.ending .wide{grid-column:1/-1}.ending input,.ending textarea{width:100%;padding:13px;border:1px solid #3d5b54;background:#071214;color:#fff;font:14px Inter}.ending button{min-height:48px;border:0;background:#a8e7b9;color:#0a1712;font-weight:700}.form-status{min-height:18px;margin:0;color:#a8e7b9;font-size:10px}@media(max-width:700px){.output{top:34%}.ending{grid-template-columns:1fr;padding:80px 18px}.ending form{grid-template-columns:1fr;box-shadow:8px 10px 0 #102b28}.ending label{grid-column:1/-1}}

/* More readable display leading */
.chapter h1{line-height:1.06}.chapter h2,.ending h2{line-height:1.1}

/* Cursor-reactive workflow field */
#reactive-field{position:absolute;inset:0;z-index:1;width:100%;height:100%;opacity:.7;pointer-events:auto;mask-image:radial-gradient(circle at center,#000 0,#000 58%,transparent 92%)}.world{pointer-events:none}.counter{pointer-events:none}.stage:after{pointer-events:none}
.stage:before{content:'';position:absolute;z-index:1;left:var(--spot-x,50%);top:var(--spot-y,50%);width:440px;height:440px;border-radius:50%;background:radial-gradient(circle,rgba(116,141,255,.15),rgba(116,141,255,.045) 46%,transparent 72%);filter:blur(5px);transform:translate(-50%,-50%);pointer-events:none;transition:left .06s linear,top .06s linear}

/* Living aurora for the green conversion scene */
.ending{position:relative;isolation:isolate;overflow:hidden;background:#081517}.ending>*{position:relative;z-index:3}.ending:before{content:'';position:absolute;z-index:0;inset:-45%;background:conic-gradient(from 210deg at 50% 50%,transparent 0 14%,rgba(54,162,111,.34) 20%,rgba(150,232,174,.2) 28%,transparent 36% 57%,rgba(31,111,95,.4) 67%,rgba(142,222,161,.16) 76%,transparent 84%);filter:blur(55px) saturate(1.25);animation:auroraTurn 22s linear infinite;transform-origin:center}.ending:after{content:'';position:absolute;z-index:1;left:var(--green-x,70%);top:var(--green-y,45%);width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(184,244,93,.2),rgba(61,181,124,.1) 32%,rgba(24,90,79,.05) 55%,transparent 72%);filter:blur(10px);transform:translate(-50%,-50%);transition:left .08s linear,top .08s linear;pointer-events:none}.ending form:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(105deg,transparent 0 22px,rgba(168,231,185,.025) 23px 24px);animation:auroraScan 7s linear infinite;pointer-events:none}.ending form{position:relative;overflow:hidden}.ending form>*{position:relative;z-index:1}@keyframes auroraTurn{to{transform:rotate(360deg) scale(1.08)}}@keyframes auroraScan{to{background-position:180px 0}}@media(prefers-reduced-motion:reduce){.ending:before,.ending form:before{animation:none}}

/* 2026 mesh/lumen field: organic depth without rotation */
.chapter h1{word-spacing:.07em}.ending{background:#071416}.ending:before{inset:-12%;background:radial-gradient(ellipse 48% 58% at 16% 25%,rgba(27,112,96,.55),transparent 72%),radial-gradient(ellipse 44% 52% at 84% 18%,rgba(86,171,112,.42),transparent 70%),radial-gradient(ellipse 55% 46% at 72% 88%,rgba(18,91,83,.58),transparent 74%),radial-gradient(ellipse 42% 55% at 23% 82%,rgba(107,155,89,.25),transparent 72%),linear-gradient(135deg,#061113,#0d2524 55%,#071416);filter:blur(30px) saturate(1.15);animation:meshBreathe 10s ease-in-out infinite alternate;transform:none}.ending:after{width:560px;height:560px;background:radial-gradient(circle,rgba(211,255,181,.28) 0,rgba(137,232,161,.15) 18%,rgba(42,153,116,.08) 44%,transparent 70%);filter:blur(7px);mix-blend-mode:screen}.ending form{background:rgba(5,20,21,.7);backdrop-filter:blur(18px)}@keyframes meshBreathe{0%{transform:translate3d(-1.5%,-1%,0) scale(1)}100%{transform:translate3d(1.5%,1%,0) scale(1.045)}}@media(prefers-reduced-motion:reduce){.ending:before{animation:none}}

/* Final palette: near-black, muted cobalt, icy blue */
:root{--bg:#07090d;--text:#f1f4f8;--muted:#98a1af;--lime:#a8dcff;--blue:#596fff}.stage{background:radial-gradient(circle at center,#16213b,#07090d 62%)}.output{border-color:#669bc7;background:#101d2b;box-shadow:0 0 55px rgba(89,111,255,.2)}.output>b{background:#a8dcff;color:#0a1119}.output span{color:#88a8c2}.ending{background:#080c16}.ending:before{background:radial-gradient(ellipse 48% 58% at 16% 25%,rgba(52,71,145,.55),transparent 72%),radial-gradient(ellipse 44% 52% at 84% 18%,rgba(95,128,211,.42),transparent 70%),radial-gradient(ellipse 55% 46% at 72% 88%,rgba(39,58,120,.58),transparent 74%),radial-gradient(ellipse 42% 55% at 23% 82%,rgba(99,139,183,.24),transparent 72%),linear-gradient(135deg,#070a12,#111a33 55%,#080c16)}.ending:after{background:radial-gradient(circle,rgba(190,229,255,.28) 0,rgba(124,174,255,.15) 18%,rgba(72,91,193,.08) 44%,transparent 70%)}.ending p{color:#9fbef5}.ending>div>span{color:#9caabd}.ending form{border-color:#3c4d78;background:rgba(8,13,28,.72);box-shadow:20px 24px 0 #10182e}.ending label{color:#adb9cc}.ending input,.ending textarea{border-color:#374766;background:#070b16}.ending button{background:#a8dcff;color:#09111c}.form-status{color:#a8dcff}.ending form:before{background:repeating-linear-gradient(105deg,transparent 0 22px,rgba(168,220,255,.025) 23px 24px)}@media(max-width:700px){.ending form{box-shadow:8px 10px 0 #10182e}}

/* A-specific violet identity mark */
header img{content:url('assets/hds-purple.svg');filter:drop-shadow(0 0 10px rgba(151,72,255,.32))}
header a:first-child{font-size:0;letter-spacing:0}
header a:first-child img{content:url('assets/hds-print-web.svg');width:275px;height:58px;object-fit:contain;filter:none}
@media(max-width:700px){header a:first-child img{width:220px;height:48px}}

/* Irregular twinkling star field */
.twinkle-layer{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;mask-image:radial-gradient(ellipse at center,#000 0,#000 68%,transparent 96%)}.twinkle-layer i{position:absolute;width:var(--s);height:var(--s);left:var(--x);top:var(--y);border-radius:50%;background:#d9ecff;box-shadow:0 0 calc(var(--s)*4) rgba(156,202,255,.8);opacity:.12;animation:starTwinkle var(--d) ease-in-out var(--delay) infinite}.twinkle-layer i:nth-child(5n){background:#b99cff;box-shadow:0 0 calc(var(--s)*5) rgba(126,78,255,.8)}@keyframes starTwinkle{0%,100%{opacity:.08;transform:scale(.65)}45%{opacity:.85;transform:scale(1.35)}65%{opacity:.22;transform:scale(.85)}}@media(prefers-reduced-motion:reduce){.twinkle-layer i{animation:none;opacity:.35}}

/* Star continuation in the final conversion panel */
.ending>.twinkle-layer{z-index:2;mask-image:linear-gradient(to bottom,transparent,#000 15%,#000 90%,transparent)}.ending>.twinkle-layer i{background:#d8eaff;box-shadow:0 0 calc(var(--s)*5) rgba(131,174,255,.75)}.ending>.twinkle-layer i:nth-child(5n){background:#b58cff;box-shadow:0 0 calc(var(--s)*5) rgba(123,67,220,.75)}

/* Structural opening: fixed stage, chapters begin at document position zero */
.stage{position:fixed;inset:0;top:0;height:100vh}.story{position:relative}.ending{z-index:10}

/* Flat open-source workflow icons and approved Excel state */
.file{padding-left:46px}.file:before{content:'';position:absolute;left:14px;top:50%;width:22px;height:22px;background:#c7d4e8;transform:translateY(-50%);mask:center/contain no-repeat}.f1:before{mask-image:url('assets/pdf.svg');background:#f08a8a}.f2:before{mask-image:url('assets/email.svg');background:#8bbcff}.f3:before{mask-image:url('assets/excel.svg');background:#82cfa4}.output{border-color:#4ea873;background:#0e281a;box-shadow:0 0 58px rgba(76,190,123,.27)}.output:after{content:'';position:absolute;right:12px;top:12px;width:22px;height:22px;background:#7ed49f;mask:url('assets/excel.svg') center/contain no-repeat}.output>b{background:#9ee6b7;color:#0a2415}.output strong{color:#e4f7eb}.output span{color:#77b48d}.output-path{stroke:#63c38a!important}
