@font-face{font-family:"NeuzeitSLT";src:url("/fonts/NeuzeitSLT-Book.woff2") format("woff2"),url("/fonts/NeuzeitSLT-Book.woff") format("woff");font-weight:400;font-style:normal;}
@font-face{font-family:"NeuzeitSLT";src:url("/fonts/NeuzeitSLT-BookHeavy.woff2") format("woff2"),url("/fonts/NeuzeitSLT-BookHeavy.woff") format("woff");font-weight:700;font-style:normal;}
@font-face{font-family:"HoeflerText";src:url("/fonts/HoeflerText-Roman.woff2") format("woff2"),url("/fonts/HoeflerText-Roman.woff") format("woff");font-weight:500;font-style:normal;}
@font-face{font-family:'RobotoBlack';src:url('/fonts/Roboto-Black.woff') format('woff');font-weight:900;font-style:normal;}
:root{--navHeight:4rem;--c-bg:#b6c9c9;--c-text:#484a5b;--c-accent:#00c58f;}
*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;background:var(--c-bg);color:var(--c-text);font-family:"NeuzeitSLT",monospace;-webkit-font-smoothing:antialiased;cursor:auto!important;padding-top:calc(var(--navHeight) + 0.75rem)!important;}
h1,h2{font-family:"HoeflerText",serif;}
a{color:inherit;text-decoration:none;}img{display:block;max-width:100%;}
:root{--navHeight:4rem;--c-bg:#b6c9c9;--c-text:#484a5b;--c-accent:#00c58f;}
*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;background:var(--c-bg);color:var(--c-text);font-family:"Neuzeit",monospace;-webkit-font-smoothing:antialiased;cursor:auto!important;padding-top:calc(var(--navHeight) + 1.5rem);}
h1,h2{font-family:"HoeflerText",serif;}
a{color:inherit;text-decoration:none;}img{display:block;max-width:100%;}
.grid{display:grid;grid-template-columns:repeat(10,1fr);grid-column-gap:4rem;}
.pad{padding-left:5rem;padding-right:5rem;}
nav{position:fixed;top:0;left:0;width:100%;background:#f5f5f5;height:var(--navHeight);padding-block:1rem;z-index:1000;transition:transform .3s cubic-bezier(.645,.045,.355,1);box-shadow:0 0 6px rgb(0 0 0 / .08);display:grid;grid-template-columns:repeat(10,1fr);grid-column-gap:4rem;}
nav .logo{width:3.4vw;min-width:110px;max-width:160px;height:auto;transform:translateY(2px);}
.nav-links{grid-column:3/span 6;display:flex;gap:2rem;align-items:center;flex-wrap:nowrap;white-space:nowrap;overflow-x:auto;font-family:"NeuzeitSLT",monospace;font-size:1.13vw;line-height:1.37;letter-spacing:.032em;}
.nav-links a{text-decoration:none;}
.nav-links a:hover,.nav-links .router-link-active{color:var(--c-accent);}
section{width:95%;max-width:800px;margin:2rem auto;padding:2rem;background:var(--c-bg);border:2px solid var(--c-text);image-rendering:pixelated;}
h1,h2{margin-block:0 1.5rem;letter-spacing:1px;font-size:1.5rem;}
.pixel-text{font-size:.9rem;line-height:1.4;}
#gameCanvas{display:block;margin:2rem auto;width:320px;height:400px;border:2px solid var(--c-text);background:var(--c-bg);image-rendering:pixelated;}
.start-button{display:inline-block;margin:0 auto;padding:.5rem 1.5rem;border:2px solid var(--c-text);background:var(--c-bg);font-family:"Neuzeit",monospace;font-size:.75rem;text-transform:uppercase;letter-spacing:1px;cursor:pointer;}
.start-button:hover{background:#a5b5b5;}
.pod-drop{margin-top:1.5rem;border:1px solid #484a5b;border-radius:6px;overflow:hidden;}
.pod-drop summary{padding:.75rem 1.25rem;font-size:.9rem;cursor:pointer;list-style:none;position:relative;}
.pod-drop summary::marker,.pod-drop summary::-webkit-details-marker{display:none;}
.pod-drop summary::after{content:"▶";position:absolute;right:1rem;transition:transform .45s cubic-bezier(.25,.8,.25,1);}
.pod-drop[open] summary::after{transform:rotate(90deg);}
.pod-content{max-height:0;opacity:0;transform:translateY(-0.5rem);overflow:hidden;transition:max-height .65s cubic-bezier(.25,.8,.25,1),opacity .45s ease,transform .45s ease;}
.pod-drop[open] .pod-content{max-height:1000px;opacity:1;transform:translateY(0);transition:max-height .85s cubic-bezier(.25,.8,.25,1) .05s,opacity .45s ease .05s,transform .45s ease .05s;}
.pod-content iframe{width:100%;height:352px;border:0;margin:1rem 0 0;border-radius:12px;}
.pod-drop[open]>*:not(summary){animation:slideDown .35s ease both;}
@keyframes slideDown{from{opacity:0;transform:translateY(-.5rem);}to{opacity:1;transform:translateY(0);}}
body::before{content:"";position:fixed;inset:0;background:#000;opacity:0;transition:opacity .4s ease;pointer-events:none;z-index:9;}
body.dimming::before{opacity:.55;}
.pod-drop[open]{position:relative;z-index:10;}
.pod-drop[open] > summary{position:relative;z-index:11;}
.snake-box{width:100vw;max-width:none;margin:0;padding:0;border:none;display:flex;justify-content:center;align-items:center;}
.snake-box iframe,.snake-box img,.snake-box object{width:100%;height:auto;display:block;border:0;}
.touch-controls{display:none;margin-top:1rem;justify-content:center;gap:1.5rem;}
.touch-controls button{width:60px;height:60px;border:2px solid var(--c-text);background:var(--c-bg);font-size:1.5rem;border-radius:50%;cursor:pointer;user-select:none;}
@media(max-width:620px){.touch-controls{display:flex;}}
nav{overflow:hidden;}
nav .logo{width:clamp(72px,3.2vw,160px);}
nav.top.unpinned{transform:translate3d(0,-100%,0);}
@media(max-width:900px){nav .logo{width:24vw;min-width:90px;max-width:140px;}nav{grid-column-gap:2rem;}.nav-links{gap:1rem;font-size:clamp(10px,1.5vw,16px);}}
@media(max-width:780px){nav{grid-column-gap:1.5rem;}.nav-links{gap:.8rem;font-size:clamp(9px,2vw,14px);}}
@media(max-width:620px){nav{position:fixed;top:0;left:0;width:100%;display:flex!important;flex-wrap:nowrap;align-items:center;padding:1rem;gap:1rem;background:#f5f5f5;z-index:1000;}nav .logo{flex-shrink:0;}body{padding-top:calc(var(--navHeight) + 1rem)}.nav-links{flex:1 1 auto;display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:.8rem;font-size:clamp(10px,3.2vw,14px);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-right:0}.nav-links::-webkit-scrollbar{display:none}nav::after{content:"❯";position:absolute;top:50%;right:1rem;transform:translateY(-50%);font-size:1.2rem;pointer-events:none;background:linear-gradient(to left,#f5f5f5,rgba(245,245,245,0));padding-left:.5rem;opacity:0;transition:opacity .3s ease,transform .3s ease}nav.can-scroll::after{opacity:1;transform:translateY(-50%)rotate(0)}nav.scrolled-end::after{opacity:1;transform:translateY(-50%)rotate(180deg)}body.game-open nav{display:none!important}body.game-open{overflow:hidden}}
@media(max-width:620px)and(orientation:landscape){nav{width:100vw;padding:0!important;}}
