@font-face{font-family:PS;src:url(fonts/PressStart2P-Regular.ttf);font-display:swap}@font-face{font-family:VT;src:url(fonts/VT323-Regular.ttf);font-display:swap}
*{box-sizing:border-box;cursor:crosshair}html{scrollbar-width:thin;scrollbar-color:#ffb35c transparent}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-thumb{background:#ffb35c}::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:transparent}
body{margin:0;font:19px/1.25 VT,monospace;color:#cfe9e2;background:#061416;position:relative;min-height:100vh}
body.room{background:radial-gradient(ellipse at 70% 0%,#3a2612 0,#120c08 35%,#050708 70%)}
.wrap{max-width:1098px;margin:0 auto;padding:14px;position:relative}
a{color:#ffb35c}a:hover{background:#ffb35c;color:#061416;text-decoration:none}b{color:#ffc67a;font-weight:normal}
code{font-family:VT;color:#8ff0d8;background:#031012;padding:0 3px}
pre{background:#031012;color:#8ff0d8;padding:10px;overflow:scroll;font:17px/1.2 VT;margin:8px 0}
.win{border:2px solid #0b2a2c;background:rgba(8,34,38,.9);box-shadow:0 0 0 2px #000,4px 4px 0 2px #000;margin-bottom:14px}
.tb{font:9px/1 PS;padding:6px 8px;display:flex;justify-content:space-between;gap:8px;background:linear-gradient(90deg,#0f3b3e,#174f4f 70%,#5a3c1e);color:#ffd9a0}
.sc{overflow:scroll;padding:8px 12px}.sc p:first-child{margin-top:4px}
canvas{display:block;width:100%;image-rendering:pixelated}
.logo{font:26px/1.1 PS;color:#8ff0d8;text-shadow:3px 3px 0 #0b3a3c,6px 6px 0 #000;text-decoration:none;display:inline-block}a.logo:hover{background:none;color:#8ff0d8}
.ic{display:inline-block;width:24px;height:24px;background:url(sprite.png) 0 0/240px 24px no-repeat;image-rendering:pixelated;vertical-align:-6px;margin-right:6px}
.i-fish{background-position:0 0}.i-shrimp{background-position:-24px 0}.i-leaf{background-position:-48px 0}.i-book{background-position:-72px 0}.i-eye{background-position:-96px 0}.i-bubble{background-position:-120px 0}
.swim{background-position:-144px 0;animation:sw .6s steps(4) infinite}@keyframes sw{to{background-position:-240px 0}}
nav.top{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font:9px PS}
nav.top a{color:#8ff0d8;text-decoration:none;padding:5px 7px;border:2px solid #1d5a58;background:#04191b;display:flex;align-items:center}
nav.top a .ic{transform:scale(.75);margin:-6px 2px -6px -4px}nav.top a[aria-current]{background:#ffb35c;color:#061416;border-color:#ffb35c}
nav.top a:hover{background:#174f4f;color:#ffd9a0}
.head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:4px 2px 14px;flex-wrap:wrap}
.ver{font:9px/1.7 PS;color:#ffb35c}
.chip{font:8px PS;border:2px solid #1d5a58;background:#04191b;color:#8ff0d8;padding:3px 6px}
button.chip:hover{background:#ffb35c;color:#061416}
footer{font:8px/1.8 PS;color:#5f9a8e;padding:14px 2px;border-top:2px dashed #12393a;margin-top:6px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
footer a{color:#8ff0d8}
.blink{animation:bl 1s steps(1) infinite}@keyframes bl{50%{opacity:0}}
table{border-collapse:collapse;width:100%;font:17px/1.2 VT;margin:6px 0}td,th{border:1px solid #12393a;padding:3px 6px;text-align:left;vertical-align:top}th{font:8px PS;color:#ffc67a;background:#0b2a2c}
h1{font:16px/1.4 PS;color:#ffc67a;margin:6px 0 12px}h2{font:11px/1.5 PS;color:#8ff0d8;margin:22px 0 8px}h3{font:9px/1.5 PS;color:#ffc67a;margin:16px 0 6px}
.tag{font:8px PS;padding:2px 5px;margin-left:6px;vertical-align:2px}.t-live{background:#2f8a4a;color:#e8fff0}.t-held{background:#8a6a2a;color:#fff2d0}.t-next{background:#2a4a8a;color:#e0ecff}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;z-index:9;background:#ffb35c;color:#000;padding:4px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (max-width:760px){.room-grid,.floor,.lay,.g2{grid-template-columns:1fr!important}.logo{font-size:20px}}
.wrap *{min-width:0}.tb span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}pre,table{max-width:100%}td,th{overflow-wrap:anywhere}
@media (max-width:980px){.lay{grid-template-columns:180px 1fr!important}.lay>:last-child{grid-column:1/-1}}
@media (max-width:760px){.lay{grid-template-columns:1fr!important}.stand{flex-direction:column}}
@media (pointer:coarse){nav.top a{min-height:40px;padding:8px 10px}.wrap .navl a,.wrap .toc a{padding:11px 0}footer a,footer button,.chip{min-height:40px;display:inline-flex;align-items:center;padding:0 10px}footer,.chip,.tag,th,.ver,.tb,nav.top,.bar{font-size:10px}h3,.note,.side .note{font-size:10px}}
