@font-face{font-family:'Host Grotesk';src:url('./assets/fonts/HostGrotesk-Variable.ttf') format('truetype');font-weight:300 800;font-style:normal;font-display:swap}
@font-face{font-family:'Space Mono';src:url('./assets/fonts/SpaceMono-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:GrandmasterClash;src:url('./assets/fonts/grandmasterclash.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
:root{color-scheme:dark;--ink:#000000;--red:#890000;--paper:#c5c2bb;--muted:#9b9a95;--menu-top:clamp(88px,12.5vh,130px);--gutter:clamp(22px,3.3vw,64px);font-family:'Host Grotesk',Arial,sans-serif;font-size:16px}
*{box-sizing:border-box}html,body{margin:0;background:var(--ink);color:var(--paper);width:100%;height:100%;overflow:hidden}button,a{font:inherit}p{font-size:12pt}p,h1,h2,h3,h4,h5,h6{font-family:'Host Grotesk',Arial,sans-serif;text-transform:none}button,.index-link,.nav-signal{font-family:'Space Mono',monospace;text-transform:uppercase}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button{color:inherit;background:none;border:0;padding:0}a{color:inherit;text-decoration:none}button:hover,a:hover{color:#f4f1eb}button:focus-visible,a:focus-visible{outline:1px solid var(--paper);outline-offset:7px}button,a{transition:color .2s}main{height:100%;width:100%;position:relative;isolation:isolate}#scene{position:absolute;inset:0;outline:none;touch-action:none;cursor:default}#scene:focus-visible{outline:1px solid #686d6d;outline-offset:-5px}canvas{display:block}
.cobra-title{position:absolute;inset:0;z-index:2;display:grid;place-items:center;pointer-events:none;margin:0;padding:0 20px;font-family:GrandmasterClash,Impact,sans-serif;font-size:min(clamp(64px,9vw,145px),calc((100vw - 40px)/3.3));font-weight:400;line-height:1;letter-spacing:0;color:var(--red);text-align:center;user-select:none}
.cobra-title>span{display:block;width:max-content;max-width:min(480px,calc(100vw - 40px));white-space:nowrap;transform:translateY(.115em)}
.site-header,.site-footer{position:absolute;z-index:3;left:var(--gutter);right:var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:24px;pointer-events:none}.site-header{top:clamp(26px,4.3vh,50px)}.site-header>* , .site-footer>*{pointer-events:auto}.index-link{display:inline-flex;align-items:center;min-height:44px;color:var(--red);font-size:13px;line-height:1;letter-spacing:0;white-space:pre}.index-link:hover,.index-link:focus-visible{color:var(--red)}.ascii-mark [data-ascii]{display:flex;perspective:220px}.ascii-char{display:inline-block;white-space:pre;width:1ch;transform-origin:50% 55%;backface-visibility:hidden}.ascii-mark:focus-visible{outline-color:var(--red)}
.menu-toggle{text-transform:uppercase;display:flex;align-items:center;gap:20px;font-size:13px;min-height:44px}.menu-toggle:hover .menu-sign{color:var(--red)}.menu-sign{font-size:20px;font-weight:300;line-height:1;transition:transform .35s}.menu-toggle[aria-expanded=true] .menu-sign{transform:rotate(45deg)}.site-footer{bottom:clamp(27px,4.6vh,54px);align-items:flex-end;font-size:14px;line-height:1.5}.site-footer p{margin:0}.site-footer p span{color:var(--muted)}.project-link{display:flex;align-items:center;gap:20px;text-align:left;min-height:44px}.project-link{text-transform:uppercase;font-size:12px;letter-spacing:.015em}.project-link>span{font-size:15px;transition:transform .25s}.project-link:hover>span{transform:translate(2px,-2px)}
#site-menu{position:absolute;z-index:4;right:var(--gutter);top:var(--menu-top);width:min(400px,calc(100vw - var(--gutter)*2));max-height:calc(100dvh - var(--menu-top) - 100px);padding:0;background-color:rgba(0,0,0,.94);isolation:isolate;transform-origin:100% 0;background-repeat:no-repeat;background-image:linear-gradient(rgba(255,255,255,.4),rgba(255,255,255,.4)),linear-gradient(rgba(255,255,255,.4),rgba(255,255,255,.4)),linear-gradient(rgba(255,255,255,.4),rgba(255,255,255,.4)),linear-gradient(rgba(255,255,255,.4),rgba(255,255,255,.4));background-size:100% .5px,.5px 100%,100% .5px,.5px 100%;background-position:left 14px,left top,left bottom,right top}
.menu-scroll{max-height:inherit;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#77756f #080808;padding:30px 28px 28px}
.nav-signal{position:absolute;z-index:1;top:8px;left:28px;padding:0 9px;background:#000;color:var(--red);pointer-events:none;white-space:pre;letter-spacing:.04em;font-size:10px;line-height:12px;min-width:4ch;text-align:center;font-weight:400;text-transform:uppercase}
#site-menu[hidden],.menu-content[hidden]{display:none}#site-menu nav{display:flex;flex-direction:column;align-items:stretch;margin:0 0 24px;padding:0 0 18px;border-bottom:1px solid #24211e}#site-menu nav button{position:relative;display:flex;align-items:center;justify-content:space-between;text-align:left;font-size:24px;font-weight:400;letter-spacing:-.045em;color:var(--muted);min-height:48px;text-transform:uppercase;transition:color .2s,transform .25s}#site-menu nav button::after{display:none}#site-menu nav button:hover,#site-menu nav button:focus-visible{color:#f4f1eb;transform:translateX(2px)}#site-menu nav button[aria-current=page]{color:#e7e1d6}
.menu-statement{font-size:28px;font-weight:400;line-height:1.25;letter-spacing:-.025em;color:#ddd9d1;margin:0 0 22px}.menu-content>p{font-size:12pt;line-height:1.6;color:var(--muted);max-width:36ch;margin:0 0 20px}.text-action{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;padding:14px 0;text-align:left;min-height:48px;font-size:12px}.text-action>.action-icon{font-size:16px;transition:transform .25s}.text-action:hover>.action-icon,.text-action:focus-visible>.action-icon{transform:translate(2px,-2px)}.text-action{position:relative;text-transform:uppercase;font-size:12px}.text-action::after{content:"";position:absolute;left:0;bottom:-6px;width:100%;height:1px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .28s}.text-action:hover::after,.text-action:focus-visible::after{transform:scaleX(1)}.process-list{list-style:decimal-leading-zero;padding-left:24px;margin:0;color:var(--muted)}.process-list li{padding-left:12px;margin:0 0 23px}.process-list h3{font-size:18px;font-weight:500;color:var(--paper);margin:0 0 7px}.process-list li::marker{font-family:'Space Mono',monospace;font-size:12px;text-transform:uppercase}.process-list p{font-size:12pt;line-height:1.6;margin:0;color:var(--muted)}
#status{position:absolute;inset:0;z-index:5;display:grid;place-items:center;pointer-events:none;background:#000;transition:opacity 1.6s}#status span{height:1px;width:40px;background:#6e7476;animation:load 1.3s infinite alternate}#error{position:absolute;inset:0;z-index:5;background:#000;display:grid;place-content:center;text-align:center;padding:25px}#error[hidden]{display:none}#error h2{font-size:26px;font-weight:400}#error p{max-width:340px;font-size:12pt;color:var(--muted);line-height:1.8}#error button{margin:15px auto}body.embed .site-header,body.embed .site-footer,body.embed #site-menu{display:none!important}::selection{background:var(--red);color:#fff}@keyframes load{from{opacity:.2;transform:scaleX(.3)}to{opacity:1;transform:scaleX(1)}}
@media(max-width:600px){.index-link{font-size:12px}.menu-toggle{font-size:12px;gap:18px}.site-footer{font-size:12px;gap:16px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end}.project-link{max-width:145px;font-size:11px;gap:12px;line-height:1.6}#site-menu{--menu-top:86px}.menu-scroll{padding:30px 22px 24px}#site-menu nav{margin-bottom:22px;padding-bottom:16px}#site-menu nav button{font-size:22px;min-height:48px}.menu-statement{font-size:26px;margin-bottom:20px}.menu-content>p{font-size:12pt}.text-action{font-size:12px}}
@media(max-height:500px){.site-header{top:14px}.site-footer{bottom:15px}#site-menu{--menu-top:63px;max-height:calc(100dvh - var(--menu-top) - 72px)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

#site-menu nav .nav-note{font-size:12px;line-height:1.5;letter-spacing:.02em;color:var(--muted);margin-left:18px;white-space:nowrap}

.nav-word{display:inline-flex;letter-spacing:0;white-space:pre}
.nav-char{display:inline-block;flex:none;width:calc(1ch - .045em);white-space:pre;text-align:left;letter-spacing:0}
#site-menu nav .nav-char.is-glitch{color:var(--red)}

.ascii-action{display:inline-flex;perspective:180px;white-space:pre;letter-spacing:0}
.action-token{display:inline-block;flex:none;width:1ch;white-space:pre;backface-visibility:hidden;transform-origin:50% 55%;letter-spacing:0}
.action-token.is-token{color:var(--red)}

.brief-action{font-family:'Space Mono',monospace;text-transform:uppercase;display:inline-flex;align-items:center;justify-content:space-between;gap:20px;width:auto;min-height:44px;padding:10px 0;border-bottom:1px solid currentColor;font-size:12px;line-height:1.5}
.brief-action::after{display:none}

.mobile-menu-header,.mobile-menu-footer{display:none}
@media(max-width:600px),(max-width:900px) and (max-height:500px){
 #site-menu{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;max-height:none;display:flex;flex-direction:column;background:#000;padding:0;overflow:hidden}
 #site-menu[hidden]{display:none}
 #site-menu .nav-signal{display:none}
 .mobile-menu-header{display:flex;flex:none;align-items:center;justify-content:space-between;gap:20px;padding:calc(16px + env(safe-area-inset-top,0px)) 22px 16px;font-family:'Space Mono',monospace;font-size:12px;line-height:1.5}
 .mobile-menu-header>span{color:var(--red)}
 .mobile-menu-close{display:inline-flex;align-items:center;justify-content:space-between;gap:14px;min-height:44px;min-width:90px;font-size:13px;color:var(--paper)}
 .mobile-menu-close>span{font-size:26px;line-height:1}
 #site-menu .menu-scroll{flex:1;min-height:0;max-height:none;overflow:auto;padding:20px 22px 24px}
 #site-menu nav button{font-size:clamp(26px,7vw,34px);min-height:56px}
 #site-menu .menu-content .brief-action{display:none}
 .mobile-menu-footer{display:block;flex:none;padding:16px 22px calc(20px + env(safe-area-inset-bottom,0px));background:#000;border-top:1px solid #24211e}
 .mobile-menu-footer .brief-action{display:flex;width:100%;font-size:14px;min-height:48px}
 .mobile-menu-footer .action-icon{font-size:20px}
}
