@import"https://fonts.googleapis.com/css2?family=Bangers&family=Nunito:ital,wght@0,400;0,600;0,700;0,800;0,900;1,500&family=Courier+Prime:wght@400;700&display=swap";:root{--ink: #050308;--paper: #fffde8;--p-pink: #ff3cac;--p-cyan: #00f5d4;--p-gold: #f9c74f;--p-blue: #1a6bcc;--p-navy: #0d1840;--p-white: #f0f4ff;--font-display: "Bangers", "Impact", cursive;--font-body: "Nunito", sans-serif;--font-mono: "Courier Prime", "Courier New", monospace;--shadow-card: 6px 6px 0 var(--ink);--shadow-glow: 0 0 30px rgba(255, 60, 172, .5);--ui-scale: clamp(.75rem, 2vw, 1rem)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden;background:#0d1840;font-family:var(--font-body);-webkit-tap-highlight-color:transparent;touch-action:none}canvas{display:block;position:fixed;inset:0;width:100%!important;height:100%!important}.hud{position:fixed;inset:0;pointer-events:none;z-index:10}.ui-corner{position:absolute;display:flex;align-items:center;gap:8px}.ui-corner.tl{top:16px;left:16px}.ui-corner.tr{top:16px;right:16px;flex-direction:row-reverse}.corner-bracket{width:22px;height:22px;border-top:3px solid var(--p-pink);border-left:3px solid var(--p-pink)}.ui-corner.tr .corner-bracket{border-left:none;border-right:3px solid var(--p-pink)}.corner-text{font-family:var(--font-mono);font-size:clamp(.6rem,1.5vw,.75rem);color:var(--p-pink);letter-spacing:.25em;opacity:.8}.chapter-label{position:absolute;top:20px;left:50%;transform:translate(-50%);font-family:var(--font-mono);font-size:clamp(.6rem,1.8vw,.8rem);color:#f0f4ffb3;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;padding:4px 14px;border:1px solid rgba(255,60,172,.25);background:#05030866;backdrop-filter:blur(4px);transition:opacity .2s}.chapter-label.change{opacity:0}.scroll-track{position:absolute;bottom:clamp(16px,3vh,28px);left:50%;transform:translate(-50%);width:min(55vw,400px);height:10px;background:#fffde814;border:2px solid rgba(255,60,172,.4);box-shadow:0 0 12px #ff3cac33,inset 0 0 8px #0000004d}.sb-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--p-pink),var(--p-cyan));box-shadow:0 0 10px var(--p-pink);transition:width .12s linear;position:relative}.sb-fill:after{content:"";position:absolute;right:-3px;top:-4px;width:8px;height:14px;background:var(--p-white);border:2px solid var(--ink);border-radius:1px}.hint{position:absolute;bottom:clamp(36px,6vh,52px);left:50%;transform:translate(-50%);font-family:var(--font-mono);font-size:clamp(.6rem,1.6vw,.78rem);color:var(--p-cyan);letter-spacing:.28em;opacity:0;white-space:nowrap;transition:opacity .6s ease;animation:hint-pulse 2s ease-in-out infinite;text-shadow:0 0 12px var(--p-cyan)}.hint.visible{opacity:1}@keyframes hint-pulse{0%,to{opacity:.6}50%{opacity:1}}.panel-nav{position:absolute;right:clamp(12px,2.5vw,24px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:clamp(8px,1.5vw,12px);pointer-events:all}.panel-dot{width:clamp(10px,1.5vw,14px);height:clamp(10px,1.5vw,14px);border-radius:50%;border:2.5px solid var(--color, #fff);background:transparent;cursor:pointer;transition:background .2s ease,transform .2s ease,box-shadow .2s ease;padding:0;appearance:none}.panel-dot.active{background:var(--color, #fff);transform:scale(1.5);box-shadow:0 0 10px var(--color, #fff)}.panel-dot:hover{transform:scale(1.3);background:color-mix(in srgb,var(--color, #fff) 40%,transparent)}@media (max-width: 480px){.scroll-track{width:72vw}.ui-corner.tr{display:none}.chapter-label{font-size:.58rem;padding:3px 10px}}
