:root{--blue:#9bdcff;--edge:#467c9a;--panel:#101013;--ink:#bab6bf}*{box-sizing:border-box}body{margin:0;background:#28211e;color:var(--ink);font:700 14px "Courier New",monospace}a,button,input{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}button,a{touch-action:manipulation}:focus-visible{outline:3px solid var(--blue);outline-offset:5px}[hidden]{display:none!important}.rail{position:fixed;inset:0 auto 0 0;width:74px;background:#171415;border-right:3px solid #37596c;display:flex;align-items:center;flex-direction:column;z-index:5;padding:22px 10px}.brand{display:block;margin-bottom:36px}.brand img{width:37px;height:37px;object-fit:contain}.rail nav{display:grid;gap:22px}.rail-button{width:40px;height:40px;display:grid;place-items:center;background:#151517;color:var(--blue);border:2px solid var(--edge);box-shadow:0 0 0 2px #08080a,inset 0 0 0 3px #1b2c38;border-radius:3px;font-size:24px}.rail-button.selected{background:#2a4758;border-color:var(--blue)}.rail-button:hover,.boxed:hover{background:#203849;transform:translateY(-1px)}.settings{margin-top:auto}header{height:68px;margin-left:74px;padding:15px 28px;background:#1c1817;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #322a26}.wordmark{letter-spacing:1px;font-size:14px;color:var(--blue)}.badge{background:#111113;border:2px solid var(--edge);box-shadow:0 0 0 2px #09090a;border-radius:3px;padding:9px 13px;font-size:12px;display:flex;gap:10px;align-items:center}.dot{height:6px;width:6px;background:var(--blue);box-shadow:0 0 9px #9bdcff99;border-radius:50%}main{position:relative;margin-left:74px;min-height:calc(100dvh - 68px);display:grid;place-items:center;overflow:hidden;padding:40px 24px}.backdrop{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;filter:blur(13px);opacity:.12;overflow:hidden}.back-logo{font-size:clamp(200px,40vw,600px);color:#7899a5;letter-spacing:-35px;line-height:.8;transform:rotate(-9deg)}.back-pixels{font-size:clamp(100px,22vw,350px);color:#538099;letter-spacing:30px;line-height:1.4}.home-content{position:relative;width:min(100%,490px);text-align:center;margin-top:-16px}.mascot{height:164px;display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:16px}.mascot img{width:166px;height:146px;object-fit:contain;filter:drop-shadow(0 8px 10px #0006)}.mascot-shadow{position:absolute;bottom:0;width:30px;height:5px;background:#6f8d9a;box-shadow:3px 3px 0 #100e0f;opacity:.55}h1{color:var(--blue);font-size:23px;letter-spacing:2px;margin:0 0 8px}.byline{font-size:12px;color:#9d969b;margin:0 0 27px}.web-search{display:flex;align-items:center;gap:12px;background:#101013;border:2px solid var(--edge);box-shadow:0 0 0 3px #090809,inset 0 0 0 4px #1d303c;border-radius:3px;padding:12px 16px;height:56px}.search-icon{color:var(--blue);font-size:30px;font-family:system-ui}.web-search input{min-width:0;flex:1;background:transparent;color:#d3d7df;border:0;outline:none;padding:0;font-size:14px}.web-search:focus-within{border-color:var(--blue)}.web-search input::placeholder{color:#777482}.web-search button{width:27px;height:30px;flex-shrink:0;background:#17232c;border:2px solid var(--edge);color:var(--blue);font-size:20px;padding:0;line-height:20px}.shortcuts{display:flex;justify-content:center;gap:12px;margin:28px 0 32px}.boxed{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 16px;color:#c3bfc8;background:#111113;border:2px solid var(--edge);box-shadow:0 0 0 2px #08080a,inset 0 0 0 2px #1e303a;border-radius:3px;font-size:13px;transition:background .15s,transform .15s}.boxed span{font-size:20px;color:var(--blue)}.home-panels{display:grid;grid-template-columns:1fr 1fr;gap:22px;text-align:left}.panel{background:#101013dd;border:2px solid var(--edge);border-radius:3px;box-shadow:0 0 0 3px #080809,inset 0 0 16px #9bdcff14;min-height:128px;padding:19px 17px}.panel h2{font-size:15px;color:var(--blue);margin:0 0 9px}.panel p{font-size:12px;line-height:1.6;margin:3px 0;color:#aaa5ae}.jukebox{display:flex;align-items:center;gap:15px}.jukebox-info{flex:1}.jukebox h2{font-size:12px;color:var(--ink);margin-bottom:2px}.jukebox .boxed{width:100%;margin-top:7px;padding:7px 14px;color:var(--blue)}.record{flex-shrink:0;height:51px;width:51px;background:repeating-radial-gradient(circle,#292a2e 0px,#292a2e 2px,#121318 3px,#121318 5px);border:5px solid #060607;outline:1px solid #373842;display:grid;place-items:center}.record span{width:12px;height:12px;background:var(--blue);border:3px solid #437e9b}.playing .record{animation:spin 4s linear infinite}.gif-credit{display:inline-block;margin-top:24px;color:#817c83;font-size:10px}.gif-credit:hover{color:var(--blue)}dialog{width:min(440px,90vw);padding:24px;background:#1c1817;color:var(--ink);border:2px solid var(--blue);border-radius:3px}dialog::backdrop{background:#000a}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:24px}.dialog-top h2{font-size:18px;color:var(--blue);margin:0}dialog label{display:flex;align-items:center;gap:10px;line-height:1.5}dialog input{accent-color:var(--blue)}.volume-label{margin-top:22px}.volume-label input{min-width:0;flex:1}.settings-note{color:#938b92;font-size:11px;margin-top:24px}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:550px){.rail{width:55px;padding:18px 8px}.brand img{width:30px;height:30px}.rail-button{width:33px;height:35px;font-size:20px}.rail nav{gap:20px}.brand{margin-bottom:28px}header{margin-left:55px;padding:14px;height:60px}.wordmark{font-size:11px}.badge{display:none}main{margin-left:55px;min-height:calc(100dvh - 60px);padding:26px 19px}.home-content{margin-top:0}.mascot{height:135px}.mascot img{width:143px;height:126px}h1{font-size:18px}.byline{font-size:11px}.shortcuts{gap:9px;flex-wrap:wrap;margin:24px 0}.boxed{padding:9px 12px;font-size:11px}.home-panels{grid-template-columns:1fr;gap:18px}.panel{min-height:105px}.web-search{padding:10px;height:53px;gap:8px}.web-search input{font-size:12px}.gif-credit{margin-top:20px}}@media(prefers-reduced-motion:reduce){.record{animation:none!important}.boxed{transition:none}}
