:root{--accent:#ffb15c;--ink:#fff4dc;--paper:#dce2dc;--muted:#8f9e9f;--night:#09121f;--panel:#101e2b;--line:rgba(255,244,220,.14);--ease:cubic-bezier(.16,1,.3,1);--roll-time:76s}
*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden;background:var(--night);color:var(--ink)}
body{font-family:"Aptos","Segoe UI",sans-serif;letter-spacing:.025em}.stage{position:relative;height:100%;isolation:isolate}.world{position:fixed;inset:0;overflow:hidden;background:linear-gradient(180deg,#07101d 0%,#102335 52%,#b06b3e 140%);pointer-events:none}.stars{position:absolute;inset:0;background-image:radial-gradient(circle,#fff 0 1px,transparent 1.2px),radial-gradient(circle,var(--accent) 0 1px,transparent 1.2px);background-position:0 0,36px 54px;background-size:88px 88px,137px 137px;opacity:.18}.horizon{position:absolute;left:-10%;right:-10%;bottom:-19%;height:52%;background:linear-gradient(145deg,transparent 0 28%,rgba(7,16,29,.94) 28.2% 55%,transparent 55.2%),linear-gradient(215deg,transparent 0 35%,rgba(10,22,34,.88) 35.2% 63%,transparent 63.2%);filter:drop-shadow(0 -30px 70px rgba(255,177,92,.12))}.world-grid{position:absolute;inset:50% -15% -30%;opacity:.12;background-image:linear-gradient(var(--accent) 1px,transparent 1px),linear-gradient(90deg,var(--accent) 1px,transparent 1px);background-size:72px 72px;transform:perspective(420px) rotateX(62deg);transform-origin:top}.ember{position:absolute;top:-4vh;width:4px;height:9px;border-radius:80% 0 80% 0;background:var(--accent);opacity:.6;animation:ember 12s linear infinite}.e1{left:8%;animation-delay:-2s}.e2{left:29%;animation-delay:-8s}.e3{left:52%;animation-delay:-5s}.e4{left:75%;animation-delay:-10s}.e5{left:91%;animation-delay:-4s}@keyframes ember{to{transform:translate(8vw,112vh) rotate(540deg);opacity:.05}}
.grain{position:fixed;z-index:8;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.hud{position:fixed;z-index:6;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:24px clamp(20px,4vw,58px);pointer-events:none}.brand{pointer-events:auto;display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font:800 11px/1 "Aptos Mono","Consolas",monospace;letter-spacing:.18em}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--accent);border-radius:50%;color:var(--accent);font-size:10px;box-shadow:0 0 0 5px rgba(255,177,92,.07)}.chapter{text-align:right;font:700 9px/1.4 "Aptos Mono","Consolas",monospace;letter-spacing:.18em}.chapter span{display:block;color:var(--muted);font-size:8px}.chapter strong{color:var(--accent);font-weight:700}.progress{position:fixed;z-index:7;inset:0 0 auto;height:3px;background:rgba(255,255,255,.06)}.progress span{display:block;width:0;height:100%;background:var(--accent);box-shadow:0 0 16px rgba(255,177,92,.65)}
.viewport{height:100%;overflow:hidden;mask-image:linear-gradient(transparent 0,#000 10%,#000 86%,transparent 100%)}.roll{width:min(880px,88vw);margin:auto;text-align:center;transform:translateY(7vh);animation:credits var(--roll-time) linear forwards}.paused{animation-play-state:paused}.scene{position:relative;min-height:86vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14vh 0}.scene.compact{min-height:64vh}.scene-no{position:absolute;top:12vh;left:0;color:rgba(255,244,220,.32);font:700 10px/1 "Aptos Mono","Consolas",monospace;letter-spacing:.2em}.eyebrow{color:var(--accent);font:800 11px/1 "Aptos Mono","Consolas",monospace;letter-spacing:.28em;text-transform:uppercase;margin-bottom:1.2rem}.hero h1,.scene h2{font-family:"Iowan Old Style","Palatino Linotype",Georgia,serif;font-weight:500;text-wrap:balance}.hero h1{font-size:clamp(3.8rem,11vw,8.4rem);line-height:.82;margin:0;text-shadow:0 8px 0 rgba(0,0,0,.14)}.scene h2{font-size:clamp(2.25rem,6vw,4.5rem);line-height:.96;margin:.25rem 0 2.2rem}.subtitle{font-family:"Iowan Old Style","Palatino Linotype",Georgia,serif;font-style:italic;font-size:clamp(1rem,2.5vw,1.42rem);color:var(--paper);max-width:39rem;line-height:1.6}.sigil{position:relative;display:grid;place-items:center;width:82px;height:82px;margin-bottom:2rem;border:1px solid rgba(255,177,92,.58);border-radius:50%;color:var(--accent);font:800 16px/1 "Aptos Mono","Consolas",monospace;letter-spacing:.18em;box-shadow:0 0 0 10px rgba(255,177,92,.05),0 24px 80px rgba(255,177,92,.12)}.sigil:before,.sigil:after{content:"";position:absolute;background:var(--accent);opacity:.65}.sigil:before{width:118px;height:1px}.sigil:after{width:1px;height:118px}.hero-note{margin-top:2.3rem;color:var(--muted);font:700 9px/1 "Aptos Mono","Consolas",monospace;letter-spacing:.2em}
.status-shell{width:100%;display:grid;grid-template-columns:.78fr 1.22fr;gap:16px;text-align:left}.rank-panel,.power-panel{position:relative;overflow:hidden;border:1px solid var(--line);background:rgba(8,18,29,.7);box-shadow:0 24px 80px rgba(0,0,0,.16);padding:clamp(22px,4vw,38px)}.rank-panel:after,.power-panel:after{content:"";position:absolute;inset:0;border-top:2px solid var(--accent);opacity:.7;pointer-events:none}.rank-label,.power-label,.metric-label{color:var(--muted);font:700 9px/1 "Aptos Mono","Consolas",monospace;letter-spacing:.2em}.rank{display:block;margin:.35rem 0 .7rem;color:var(--accent);font:500 clamp(5.5rem,14vw,9rem)/.9 "Iowan Old Style",Georgia,serif}.class-name{font-family:"Iowan Old Style",Georgia,serif;font-size:1.45rem}.class-copy{color:var(--muted);font-size:.82rem;line-height:1.6}.power{display:flex;align-items:baseline;gap:8px;margin:1.1rem 0;color:var(--ink);font:500 clamp(3.4rem,9vw,6.2rem)/.9 "Iowan Old Style",Georgia,serif;letter-spacing:-.045em}.power small{color:var(--accent);font:800 10px/1 "Aptos Mono",Consolas,monospace;letter-spacing:.16em}.xp{margin-top:1.8rem}.xp-head{display:flex;justify-content:space-between;margin-bottom:9px;color:var(--muted);font:700 9px/1 "Aptos Mono",Consolas,monospace;letter-spacing:.15em}.xp-track{height:5px;background:rgba(255,255,255,.08);overflow:hidden}.xp-track i{display:block;width:var(--xp);height:100%;background:var(--accent);box-shadow:0 0 18px rgba(255,177,92,.55)}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:16px;background:var(--line);border:1px solid var(--line)}.metric{background:rgba(8,18,29,.88);padding:20px}.metric strong{display:block;margin-top:9px;font:500 1.6rem/1 "Iowan Old Style",Georgia,serif}
.rows{width:100%;display:grid;gap:0}.row{display:grid;grid-template-columns:140px 1fr;align-items:baseline;gap:2rem;border-bottom:1px solid var(--line);padding:1rem .25rem;text-align:left}.role{color:var(--muted);text-transform:uppercase;font:700 9px/1.4 "Aptos Mono",Consolas,monospace;letter-spacing:.16em}.name{font-family:"Iowan Old Style",Georgia,serif;font-size:1.15rem}.chips{display:flex;justify-content:center;flex-wrap:wrap;gap:.7rem}.chip{border:1px solid rgba(255,177,92,.38);background:rgba(8,18,29,.52);padding:.72rem 1rem;border-radius:999px;font:700 .72rem/1 "Aptos Mono",Consolas,monospace;letter-spacing:.06em}.achievement-grid{width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:12px;text-align:left}.achievement{position:relative;min-height:132px;padding:24px;border:1px solid var(--line);background:rgba(8,18,29,.68);transition:transform 180ms var(--ease),border-color 180ms var(--ease),background 180ms var(--ease)}.achievement:hover{transform:translateY(-4px);border-color:rgba(255,177,92,.55);background:rgba(14,29,43,.86)}.achievement.locked{opacity:.38;filter:saturate(.2)}.achievement-no{position:absolute;right:18px;top:17px;color:rgba(255,244,220,.28);font:700 10px/1 "Aptos Mono",Consolas,monospace;letter-spacing:.14em}.achievement-state{display:inline-block;margin-bottom:18px;color:var(--accent);font:800 9px/1 "Aptos Mono",Consolas,monospace;letter-spacing:.17em}.achievement h3{margin:0 0 8px;font:500 1.35rem/1 "Iowan Old Style",Georgia,serif}.achievement p{margin:0;color:var(--muted);font-size:.78rem;line-height:1.5}.disclaimer{margin-top:1.4rem;color:var(--muted);font:700 8px/1.5 "Aptos Mono",Consolas,monospace;letter-spacing:.13em}.quote{font-family:"Iowan Old Style",Georgia,serif;font-size:clamp(1.45rem,4vw,2.55rem);line-height:1.35}.label{color:var(--muted);font:700 9px/1 "Aptos Mono",Consolas,monospace;letter-spacing:.2em}.final h2{font-size:clamp(3.5rem,10vw,7.4rem);line-height:.86;margin:0 0 1.5rem}.final small{color:var(--accent);font:800 9px/1 "Aptos Mono",Consolas,monospace;letter-spacing:.22em}.footer-note{margin-top:7rem;color:var(--muted);font:700 8px/1 "Aptos Mono",Consolas,monospace;letter-spacing:.18em}
.controls{position:fixed;z-index:6;inset:auto 0 0;display:flex;align-items:center;gap:.5rem;padding:18px clamp(20px,4vw,58px);background:linear-gradient(transparent,rgba(4,10,18,.86));pointer-events:none}.controls button,.controls a{pointer-events:auto;border:1px solid rgba(255,255,255,.2);color:var(--ink);background:rgba(8,18,29,.62);backdrop-filter:blur(10px);border-radius:999px;padding:.7rem 1rem;font:800 9px/1 "Aptos Mono",Consolas,monospace;letter-spacing:.12em;text-decoration:none;cursor:pointer;transition:transform 160ms var(--ease),border-color 160ms var(--ease),background 160ms var(--ease)}.controls button:hover,.controls a:hover{transform:translateY(-2px);border-color:var(--accent);background:rgba(20,37,51,.9)}.controls button:active,.controls a:active{transform:translateY(0) scale(.97)}.controls button:focus-visible,.controls a:focus-visible,.brand:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.controls a{margin-left:auto}.hint{color:rgba(255,244,220,.36);font:700 8px/1 "Aptos Mono",Consolas,monospace;letter-spacing:.12em}.no-script{position:fixed;z-index:20;inset:auto 20px 80px;background:#101e2b;border:1px solid var(--accent);padding:16px}
@keyframes credits{to{transform:translateY(calc(-100% + 93vh))}}
@media(max-width:720px){.hud{padding:18px}.chapter,.hint{display:none}.roll{width:min(92vw,880px)}.scene-no{left:6px}.status-shell{grid-template-columns:1fr}.rank-panel{display:grid;grid-template-columns:auto 1fr;column-gap:22px;align-items:center}.rank{grid-row:1/4;margin:0}.metric-grid{grid-template-columns:repeat(3,1fr)}.metric{padding:15px 10px}.achievement-grid{grid-template-columns:1fr}.row{grid-template-columns:100px 1fr;gap:1rem}.controls{padding:14px 16px}.controls a{display:none}}
@media(max-width:430px){.brand>span:last-child{display:none}.scene{padding-left:4px;padding-right:4px}.metric strong{font-size:1.2rem}.rank-panel,.power-panel{padding:20px}.rank{font-size:5rem}.class-name{font-size:1.1rem}}
@media(prefers-reduced-motion:reduce){html,body{overflow:auto}.ember{animation:none}.viewport{height:auto;overflow:visible;mask-image:none}.roll{animation:none;transform:none}.scene,.scene.compact{min-height:auto;padding:7rem 0}.achievement,.controls button,.controls a{transition:none}.progress{display:none}}