:root{--accent: #c8ff00;--ink: #101010;--paper: #d4d6d2;--mono: "SF Mono", "IBM Plex Mono", "Roboto Mono", Menlo, monospace;--disp: "Helvetica Neue", "Arial Narrow", Arial, sans-serif}*{margin:0;padding:0;box-sizing:border-box}html,body,#app{height:100%;overflow:hidden;background:#000}#app{position:relative;font-family:var(--disp)}#gl{position:absolute;inset:0;width:100%;height:100%;display:block}#chrome{position:absolute;inset:0;pointer-events:none;z-index:5;color:var(--ink);transition:color .6s ease}.mega-title-wrap{position:absolute;top:-2vw;left:0;right:0;height:24vw;overflow:hidden;text-align:left}.mega-title{display:inline-block;font-size:24vw;line-height:.8;font-weight:900;letter-spacing:-.05em;color:var(--ink);opacity:.55;white-space:nowrap;transform-origin:0 0;transition:color .6s ease}.mega-sub{position:absolute;top:19.6vw;left:1.6vw;right:1.6vw;display:flex;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;opacity:.75;white-space:nowrap;overflow:hidden}.corner{position:absolute;font-family:var(--mono);font-size:11px;letter-spacing:.08em;opacity:.85}.code-tl{top:14px;left:18px}.code-tr{top:14px;right:18px;text-align:right}.code-bl{bottom:14px;left:18px}.code-br{bottom:14px;right:18px;text-align:right}.edge-left,.edge-right{position:absolute;top:52%;font-weight:900;font-size:clamp(30px,3.6vw,64px);letter-spacing:.01em;line-height:.9;white-space:nowrap;opacity:.92}.edge-left{left:.4vw;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg)}.edge-right{right:.4vw;writing-mode:vertical-rl;transform:translateY(-50%)}.ghost-index{position:absolute;right:10vw;bottom:14vh;font-weight:900;font-size:clamp(120px,20vw,360px);line-height:.8;color:transparent;-webkit-text-stroke:1.5px var(--ink);opacity:.5;letter-spacing:-.04em}.brand-block{position:absolute;top:21vh;right:2.4vw;text-align:right}.brand-lines{font-size:clamp(44px,6.4vw,108px);font-weight:900;line-height:.88;letter-spacing:-.035em;white-space:pre-line}.brand-copy{font-size:clamp(20px,2vw,32px);margin-top:.6vh;font-weight:700}.side-left{position:absolute;top:26vh;left:2.4vw;max-width:280px}.name-tag{display:inline-block;background:var(--ink);color:var(--paper);font-weight:900;font-size:clamp(22px,2.4vw,38px);letter-spacing:.01em;padding:12px 22px 12px 14px;clip-path:polygon(0 0,100% 0,92% 100%,0 100%);margin-bottom:16px}.chips{display:flex;flex-direction:column;gap:7px;align-items:flex-start}.chip{font-family:var(--mono);font-size:11px;letter-spacing:.14em;background:var(--ink);color:var(--paper);padding:5px 12px}.chip:nth-child(2n){transform:translate(12px)}.info-card{position:absolute;left:2.2vw;bottom:12.5vh;width:clamp(230px,21vw,320px);background:var(--accent);color:#0c0c0c;padding:16px 16px 13px;clip-path:polygon(0 0,84% 0,100% 12%,100% 100%,0 100%)}.info-code{font-family:var(--mono);font-size:10px;letter-spacing:.16em;margin-bottom:8px}.info-tagline{font-weight:900;font-size:clamp(26px,2.6vw,40px);line-height:.92;letter-spacing:-.025em;white-space:pre-line}.info-stats{margin-top:12px;display:flex;flex-direction:column;gap:3px}.stat{display:flex;align-items:flex-end;font-family:var(--mono);font-size:9.5px;letter-spacing:.08em}.stat .dots{flex:1;border-bottom:1px dotted #0c0c0c;margin:0 5px 3px}.info-barcode{margin-top:11px;height:26px;background:repeating-linear-gradient(90deg,#0c0c0c 0 2px,transparent 2px 5px,#0c0c0c 5px 6px,transparent 6px 11px)}.info-serial{font-family:var(--mono);font-size:10px;margin-top:6px;letter-spacing:.22em}.para-block{position:absolute;right:2.4vw;bottom:27vh;width:215px;text-align:left;border-top:2px solid var(--ink);padding-top:8px}.para-head{font-weight:900;font-size:12px;letter-spacing:.18em;margin-bottom:6px}.para-body{font-family:var(--mono);font-size:8.5px;line-height:1.55;letter-spacing:.03em;text-align:justify;opacity:.85}.para-foot{font-family:var(--mono);font-size:8px;letter-spacing:.2em;margin-top:7px;opacity:.55}.side-right{position:absolute;right:2.4vw;bottom:15vh;text-align:right}.big-index{font-family:var(--mono);font-size:24px;letter-spacing:.1em}.glyph-stack{font-size:14px;line-height:2;opacity:.8}.strand{position:absolute}.strand-1{top:27vw;left:2.4vw;font-family:var(--mono);font-size:10px;letter-spacing:.3em;opacity:.7}.strand-2{top:34vh;right:1.8vw;font-weight:900;font-size:clamp(15px,1.5vw,24px);letter-spacing:-.01em;background:var(--ink);color:var(--paper);padding:4px 10px;transform:rotate(-2deg)}.strand-3{bottom:36vh;left:2.6vw;font-family:var(--mono);font-size:9px;letter-spacing:.18em;opacity:.8;writing-mode:vertical-rl;transform:rotate(180deg)}.strand-4{bottom:11.5vh;right:22vw;font-weight:900;font-size:13px;letter-spacing:.35em;opacity:.75}.mark{position:absolute;width:18px;height:18px;opacity:.75}.mark-cross{top:21vw;left:50%;transform:translate(-50%)}.mark-reg{bottom:9vh;left:2.6vw}.mark-tri{top:36vh;left:2.7vw;color:var(--accent);width:20px;height:20px}.mark-arrow{bottom:30vh;right:26vw;width:15px;height:15px;opacity:.6}.mark-grid{top:23vh;right:13vw;width:44px;height:18px;opacity:.5}.micro{position:absolute;font-family:var(--mono);font-size:7.5px;letter-spacing:.24em;opacity:.5}.micro-1{top:22.5vw;right:1.8vw}.micro-2{bottom:8.5vh;left:50%;transform:translate(-50%)}.micro-3{top:55vh;left:1.2vw;writing-mode:vertical-rl}.micro-4{bottom:6.8vh;right:1.8vw;opacity:.65}.ticker{position:absolute;bottom:6.8vh;left:0;right:0;overflow:hidden;white-space:nowrap;font-family:var(--mono);font-size:10px;letter-spacing:.35em;opacity:.55}.ticker-inner{display:inline-block;padding-left:100%;animation:tick 38s linear infinite}@keyframes tick{to{transform:translate(-100%)}}#chrome.exit .mega-title{animation:title-out .42s steps(4) forwards}#chrome.exit .corner,#chrome.exit .side-left,#chrome.exit .side-right,#chrome.exit .info-card,#chrome.exit .brand-block,#chrome.exit .edge-left,#chrome.exit .edge-right,#chrome.exit .ghost-index,#chrome.exit .para-block,#chrome.exit .strand,#chrome.exit .mega-sub,#chrome.exit .micro,#chrome.exit .mark{animation:glitch-out .4s steps(3) forwards}#chrome.enter .mega-title{animation:title-in .55s steps(5) both}#chrome.enter .corner{animation:glitch-in .5s steps(4) both .08s}#chrome.enter .mega-sub{animation:glitch-in .5s steps(4) both .1s}#chrome.enter .edge-left{animation:glitch-in .5s steps(4) both .14s}#chrome.enter .edge-right{animation:glitch-in .5s steps(4) both .18s}#chrome.enter .side-left{animation:glitch-in .5s steps(4) both .16s}#chrome.enter .brand-block{animation:glitch-in .5s steps(4) both .22s}#chrome.enter .ghost-index{animation:glitch-in .5s steps(4) both .26s}#chrome.enter .info-card{animation:glitch-in .5s steps(4) both .3s}#chrome.enter .para-block{animation:glitch-in .5s steps(4) both .34s}#chrome.enter .side-right{animation:glitch-in .5s steps(4) both .36s}#chrome.enter .strand{animation:glitch-in .5s steps(4) both .4s}#chrome.enter .micro,#chrome.enter .mark{animation:glitch-in .5s steps(4) both .44s}@keyframes glitch-out{0%{opacity:1;clip-path:inset(0 0 0 0)}40%{opacity:1;margin-top:2px;clip-path:inset(18% 0 32% 0)}70%{opacity:.6;margin-top:-2px;clip-path:inset(52% 0 8% 0)}to{opacity:0;margin-top:0;clip-path:inset(0 0 100% 0)}}@keyframes glitch-in{0%{opacity:0;margin-top:-3px;clip-path:inset(0 0 100% 0)}35%{opacity:.7;margin-top:2px;clip-path:inset(38% 0 22% 0)}65%{opacity:1;margin-top:0;clip-path:inset(8% 0 55% 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}@keyframes title-out{0%{opacity:.55;clip-path:inset(0 0 0 0)}50%{opacity:.3;clip-path:inset(30% 0 30% 0)}to{opacity:0;clip-path:inset(50% 0 50% 0)}}@keyframes title-in{0%{opacity:0;clip-path:inset(50% 0 50% 0)}55%{opacity:.35;clip-path:inset(12% 0 26% 0)}to{opacity:.55;clip-path:inset(0 0 0 0)}}#rail{position:absolute;left:50%;bottom:16px;transform:translate(-50%);z-index:10;display:flex;align-items:center;gap:14px}#thumbs{display:flex;gap:10px}.thumb{position:relative;width:84px;height:108px;border:1px solid rgba(255,255,255,.28);background:#101012;padding:0;cursor:pointer;overflow:hidden;outline:none;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.thumb canvas,.thumb img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9)}.thumb .t-label{position:absolute;left:5px;bottom:4px;font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.8)}.thumb .t-index{position:absolute;top:4px;right:5px;font-family:var(--mono);font-size:8.5px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.8)}.thumb .t-scan{position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,rgba(255,255,255,.14) 50%,transparent 100%);background-size:100% 300%;opacity:0;transition:opacity .2s}.thumb:hover{transform:translateY(-4px);border-color:#ffffffb3}.thumb:hover .t-scan{opacity:1;animation:scan 1.1s linear infinite}@keyframes scan{0%{background-position:0 130%}to{background-position:0 -130%}}.thumb.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 6px 24px -6px var(--accent);transform:translateY(-6px)}.thumb.active .t-index{color:var(--accent)}#sound-toggle{font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:#fff;background:#0a0a0c8c;border:1px solid rgba(255,255,255,.3);padding:8px 9px;cursor:pointer;display:flex;flex-direction:column;gap:2px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#sound-toggle .snd-state{color:var(--accent)}#sound-toggle:hover{border-color:#fff}#auto-meter{width:3px;height:108px;background:#ffffff26;position:relative}#auto-fill{position:absolute;bottom:0;left:0;width:100%;height:0%;background:var(--accent)}#loader{position:absolute;inset:0;z-index:50;background:#08090a;color:#e8e8e4;display:flex;align-items:center;justify-content:center;transition:opacity .7s ease,visibility .7s}#loader.done{opacity:0;visibility:hidden}.loader-box{width:min(420px,80vw)}.loader-title{font-weight:800;font-size:44px;letter-spacing:-.03em}.loader-title sup{font-size:14px}.loader-sub{font-family:var(--mono);font-size:10px;letter-spacing:.3em;margin:10px 0 22px;opacity:.6}.loader-bar{height:3px;background:#ffffff1f}#loader-fill{height:100%;width:0%;background:#c8ff00;transition:width .3s ease}#loader-log{font-family:var(--mono);font-size:10px;margin-top:12px;opacity:.5;letter-spacing:.12em;min-height:14px}@media(max-width:720px){.side-left,.brand-block,.para-block,.mega-sub,.micro,.mark-grid,.strand-2,.strand-3{display:none}.edge-left,.edge-right{font-size:22px}.ghost-index{font-size:110px;right:4vw}.info-card{bottom:20vh;width:180px}.thumb{width:62px;height:82px}}