:root{color-scheme:dark;--paper:#969a98;--muted:#5d615e;--line:rgba(193,199,194,.25);--inset:15px;--control-inset:42px}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#030303}body{font-family:'Courier New',monospace;color:var(--paper);overflow:hidden;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:1px solid #c0c4c0;outline-offset:6px}button:disabled{cursor:wait}.splash{position:relative;width:100%;height:100svh;min-height:0;isolation:isolate;overflow:hidden;background:#030303}.atmosphere{position:absolute;inset:0;background:radial-gradient(ellipse 32% 64% at 50% 31%,#141618 0%,#08090a 40%,transparent 80%),linear-gradient(90deg,transparent 27%,#11121418 28%,transparent 29%,transparent 81%,#1213121a 82%,transparent 84%);opacity:.75;pointer-events:none;z-index:-2}.film-grain{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 220'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23ffffff' filter='url(%23g)' opacity='.65' d='M0 0h220v220H0z'/%3E%3C/svg%3E");mix-blend-mode:soft-light;opacity:.17;pointer-events:none;z-index:8}.hairlines{position:absolute;inset:0;pointer-events:none;z-index:7;background:linear-gradient(90deg,transparent 25.95%,#a9b1ab06 26%,transparent 26.12%,transparent 83.2%,#a9b1ab08 83.26%,transparent 83.37%)}.border-frame{position:absolute;inset:var(--inset);border:1px solid var(--line);pointer-events:none;z-index:10}.border-frame i{position:absolute;width:7px;height:7px;opacity:.65}.border-frame i::before,.border-frame i::after{content:'';position:absolute;background:#969f98}.border-frame i::before{width:7px;height:1px;top:3px;left:0}.border-frame i::after{height:7px;width:1px;top:0;left:3px}.border-frame i:nth-child(1){left:-4px;top:-4px}.border-frame i:nth-child(2){right:-4px;top:-4px}.border-frame i:nth-child(3){left:-4px;bottom:-4px}.border-frame i:nth-child(4){right:-4px;bottom:-4px}.masthead{position:absolute;top:37px;left:var(--control-inset);z-index:12}.wordmark{display:block;color:#969b98;text-decoration:none;font-family:'Arial Narrow','Courier New',monospace;font-size:8px;font-weight:600;letter-spacing:5px;line-height:1.4}.wordmark:hover{color:#d6dad5}.artwork{position:absolute;inset:0;display:grid;place-items:center;z-index:1;pointer-events:none}#emblem{position:absolute;inset:0;width:100%;height:100%;z-index:1}.emblem-fallback{position:absolute;left:50%;top:50%;width:min(57vw,82svh);height:auto;transform:translate(-50%,-50%);opacity:.75;filter:drop-shadow(16px 18px 15px #000);z-index:0}.year{position:absolute;left:50%;top:49.4%;transform:translate(-50%,-50%);width:min(31vw,52svh);height:auto;overflow:visible;z-index:2;opacity:.94;filter:drop-shadow(0 1px 0 #d4d9d02b) drop-shadow(0 3px 16px #0007)}.corner-controls{position:absolute;bottom:54px;left:var(--control-inset);right:var(--control-inset);display:flex;justify-content:space-between;align-items:center;z-index:12}.outline-button{height:36px;min-width:143px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#06070724;border:1px solid #6e767360;color:#909794;font-family:'Arial Narrow','Courier New',monospace;font-size:8px;font-weight:600;letter-spacing:3.2px;line-height:1;transition:color .2s,border-color .2s,background .2s}.outline-button:hover{color:#d4d9d5;border-color:#b4bcb4a1;background:#9faaa20a}.sound-toggle{min-width:141px;gap:16px;padding-right:11px}.sound-bars{display:flex;gap:1.5px;align-items:center;height:17px;flex-shrink:0}.sound-bars i{display:block;background:currentColor;width:1px;height:5px}.sound-bars i:nth-child(2),.sound-bars i:nth-child(6){height:9px}.sound-bars i:nth-child(3),.sound-bars i:nth-child(5){height:13px}.sound-bars i:nth-child(4){height:17px}.is-playing .sound-bars i{animation:levels .7s ease-in-out infinite alternate}.is-playing .sound-bars i:nth-child(2n){animation-delay:-.35s}.is-playing .sound-bars i:nth-child(3n){animation-delay:-.15s}.enter-button svg{width:18px;height:12px;fill:none;stroke:currentColor;stroke-width:1;flex-shrink:0;transition:transform .2s}.enter-button:hover svg{transform:translateX(3px)}.enter-button{padding-left:21px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.enter-dialog{position:fixed;color:#bcc1bb;background:#080909ed;border:1px solid #575d565c;padding:60px 50px 40px;width:min(480px,calc(100% - 48px));max-height:calc(100svh - 48px);box-shadow:0 0 160px #000;overflow:auto}.enter-dialog::backdrop{background:#000b;backdrop-filter:blur(10px)}.close-dialog{position:absolute;right:19px;top:15px;border:0;padding:0;background:none;font:26px Arial,sans-serif;color:#7d857d;line-height:1}.close-dialog:hover{color:#eee}.dialog-kicker{font-size:9px;letter-spacing:4px;color:#6e786e}.enter-dialog h2{font:500 54px/.96 'Arial Narrow',Arial,sans-serif;letter-spacing:-3px;margin:42px 0 24px}.enter-dialog p{font-size:11px;line-height:1.8;letter-spacing:1px}.enter-dialog .dialog-note{color:#687366;font-size:10px;margin-bottom:35px}.dialog-sound{width:100%;height:43px}.toast{position:fixed;bottom:100px;left:50%;transform:translate(-50%,10px);margin:0;padding:12px 18px;background:#101210;border:1px solid #48504466;color:#a6afa1;opacity:0;pointer-events:none;z-index:30;font-size:11px;line-height:1.7;text-align:center;max-width:calc(100% - 60px);transition:.2s}.toast.visible{opacity:1;transform:translate(-50%,0)}[hidden]{display:none!important}@keyframes levels{to{height:3px}}
@media(min-width:1700px){:root{--inset:22px;--control-inset:58px}.masthead{top:48px}.wordmark{font-size:10px}.corner-controls{bottom:66px}.outline-button{height:43px;min-width:175px;font-size:9px}.sound-toggle{min-width:172px}}
@media(max-width:700px){:root{--inset:12px;--control-inset:27px}.masthead{top:max(33px,calc(env(safe-area-inset-top) + 20px))}.wordmark{font-size:8px;letter-spacing:4px}.year{width:min(75vw,48svh);top:49%}.emblem-fallback{width:91vw}.corner-controls{bottom:max(37px,calc(env(safe-area-inset-bottom) + 25px))}.outline-button{height:36px;min-width:128px;padding:0 12px;font-size:7px;letter-spacing:2.2px;gap:12px}.sound-toggle{min-width:129px;gap:12px}.enter-button{min-width:127px;padding-left:16px}.enter-button svg{width:16px}.sound-bars{gap:1px}.sound-bars i{width:1px}.atmosphere{background:radial-gradient(ellipse 70% 47% at 50% 44%,#141618 0%,#08090a 40%,transparent 80%);opacity:.65}.enter-dialog{padding:55px 30px 30px}.enter-dialog h2{font-size:44px;letter-spacing:-2px}.toast{bottom:90px;font-size:10px}.hairlines{opacity:.7}}
@media(max-width:350px){:root{--control-inset:23px}.outline-button{min-width:113px;font-size:6px;letter-spacing:1.8px}.sound-toggle{min-width:115px}.enter-button{min-width:114px}.year{width:min(76vw,48svh)}}
@media(max-height:500px) and (min-width:701px){.masthead{top:30px}.corner-controls{bottom:32px}.year{width:46svh}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.menu-toggle{position:absolute;right:var(--control-inset);top:31px;z-index:12;width:48px;height:36px;border:1px solid #6e767360;background:#06070724;color:#929a94;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:0;transition:border-color .2s,background .2s}.menu-toggle span{width:21px;height:1px;background:currentColor;display:block}.menu-toggle:hover{border-color:#a5afa399;background:#9faaa20a}.menu-dialog{margin:0 0 0 auto;inset:0 0 0 auto;width:min(360px,calc(100% - 24px));height:100svh;max-height:100svh;border:0;border-left:1px solid #6e767342;background:#070909f5;color:#aeb7ad;padding:72px 35px 34px;box-shadow:-30px 0 150px #0009}.menu-dialog::backdrop{background:#0008;backdrop-filter:blur(7px)}.menu-dialog h2{font:500 25px Arial,sans-serif;letter-spacing:7px;margin:30px 0 60px}.menu-dialog nav{display:flex;flex-direction:column}.menu-dialog nav button{display:flex;align-items:center;gap:20px;border:0;border-top:1px solid #6972633b;background:none;color:inherit;font:10px 'Courier New',monospace;letter-spacing:3px;text-align:left;padding:25px 0}.menu-dialog nav button:last-child{border-bottom:1px solid #6972633b}.menu-dialog nav button>span:first-child{font-size:8px;letter-spacing:0;color:#616d5f}.menu-dialog nav button:hover{color:#e0e6dd}.menu-foot{position:absolute;bottom:36px;font-size:8px;letter-spacing:1.5px;color:#596654}.menu-dialog .close-dialog{right:28px;top:32px;font-size:27px}@media(max-width:700px){.menu-toggle{top:max(28px,calc(env(safe-area-inset-top) + 15px));width:44px;height:33px}.menu-toggle span{width:20px}.menu-dialog{padding:72px 29px 30px}.menu-dialog h2{font-size:22px;letter-spacing:6px}.menu-dialog .close-dialog{right:26px;top:30px}}@media(min-width:1700px){.menu-toggle{top:41px;width:52px;height:40px}}
.year{filter:none}

.atmosphere{background:#030303;opacity:1}.film-grain,.hairlines{display:none}

.year-image{width:min(42.5vw,71.5svh);height:auto;opacity:1;filter:none;mix-blend-mode:normal}@media(max-width:700px){.year-image{width:min(100vw,66svh)}}


/* Independent foreground, metal and background layers. Broken visibility
   dissolves the circular outline without stretching the original emblem. */
#emblem{opacity:.75;mask-image:linear-gradient(to bottom,#000 0%,#000 48%,#0009 68%,#0002 85%,transparent 97%),radial-gradient(ellipse 11% 19% at 29% 51%,transparent 20%,#000 100%);mask-composite:intersect}
.emblem-fallback{opacity:.24}
.year-image{width:min(49vw,82svh);z-index:3}
@media(max-width:700px){.year-image{width:min(110vw,74svh)}#emblem{opacity:.68}}
#emblem{opacity:1;mask-image:none;mask-composite:add}.emblem-fallback{opacity:1}@media(max-width:700px){#emblem{opacity:1}}


@font-face{font-family:Oswald;src:url("assets/oswald-variable.ttf") format("truetype");font-style:normal;font-weight:200 700;font-display:swap}
body,button,a,input,textarea,select,h1,h2,h3,p,span,.wordmark,.outline-button,.enter-dialog h2,.menu-dialog h2,.menu-dialog nav button,.close-dialog{font-family:Oswald,sans-serif;text-transform:uppercase}
.sound-toggle{justify-content:flex-start;gap:9px}.sound-toggle .sound-bars{transform:scale(1.18);transform-origin:center; margin-right:2px}@media(max-width:700px){.sound-toggle{gap:9px}}

.year-image{width:min(46vw,77svh)}@media(max-width:700px){.year-image{width:min(104vw,69.5svh)}}
@media(max-width:700px){.year-image{width:min(90vw,61svh)}}
.atmosphere{background:linear-gradient(#0007,#0007),url("assets/background.png") center/cover no-repeat}

/* Matte framing bands around the textured stage. */
.atmosphere{inset:72px 0 91px}
.artwork{inset:72px 0 91px;overflow:hidden;border-top:1px solid #83877d32;border-bottom:1px solid #83877d32}
.year-outline{width:70vw;height:calc(100% + 36px);top:50%;opacity:.65;color:#92968a;filter:none;z-index:0;overflow:visible}
#emblem{z-index:2;transform:scale(.98)}.emblem-fallback{z-index:1}
.corner-controls{bottom:28px}.masthead{top:30px}.menu-toggle{top:22px}
@media(max-width:700px){.atmosphere{inset:78px 0 100px}.artwork{inset:78px 0 100px}.year-outline{width:105vw;height:calc(100% + 24px);opacity:.55}.corner-controls{bottom:33px}#emblem{transform:scale(1.04)}}
:root{--band-size:82px}.atmosphere,.artwork{inset:var(--band-size) 0}.masthead{top:calc((var(--inset) + var(--band-size))/2);transform:translateY(-50%)}.menu-toggle{top:calc((var(--inset) + var(--band-size))/2);transform:translateY(-50%)}.corner-controls{bottom:calc((var(--inset) + var(--band-size))/2);transform:translateY(50%)}@media(max-width:700px){:root{--band-size:82px}.atmosphere,.artwork{inset:var(--band-size) 0}.masthead,.menu-toggle{top:calc((var(--inset) + var(--band-size))/2)}.corner-controls{bottom:calc((var(--inset) + var(--band-size))/2)}}
.year-outline{height:90%}@media(max-width:700px){.year-outline{height:88%}}
@media(max-width:700px){.year-outline{height:72%;width:92vw}}

.site-loader{position:fixed;inset:0;z-index:1000;background:#030404;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#929b9e;opacity:1;transition:opacity .6s ease,visibility .6s;visibility:visible}
.site-loader::before{content:"";position:absolute;inset:15px;border:1px solid #626e6d25;pointer-events:none}
.loader-mark{font:600 64px/1 Oswald,sans-serif;letter-spacing:-5px;padding-right:5px;color:#aeb8ba;text-shadow:0 0 25px #8babb71c;animation:loader-pulse 2s ease-in-out infinite}
.loader-name{font:400 11px Oswald,sans-serif;letter-spacing:6px;margin:23px 0 30px;padding-left:6px}
.loader-track{width:130px;height:1px;overflow:hidden;background:#58626135}.loader-track span{display:block;height:100%;width:40%;background:#c2cdcf;animation:loader-scan 1.4s ease-in-out infinite}
.loader-caption{font:300 8px Oswald,sans-serif;letter-spacing:3px;color:#5c696b;margin-top:17px}
.is-loading .splash{visibility:hidden}.site-loader.is-ready{opacity:0;visibility:hidden;pointer-events:none}
@keyframes loader-scan{from{transform:translateX(-110%)}to{transform:translateX(360%)}}@keyframes loader-pulse{50%{opacity:.35;filter:blur(.5px)}}
@media(prefers-reduced-motion:reduce){.loader-mark,.loader-track span{animation:none}.loader-track span{width:100%}}
