html,body{margin:0;height:100%;background:#0b0a12;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;font-family:"Press Start 2P",Courier New,monospace}#game{position:fixed;inset:0;display:block;image-rendering:pixelated;image-rendering:crisp-edges}#hud{position:fixed;inset:0;pointer-events:none}#zone{position:absolute;top:18px;left:0;right:0;text-align:center;color:#f3e3b3;font-size:14px;letter-spacing:.18em;text-transform:uppercase;text-shadow:0 2px 0 #000,0 0 12px rgba(0,0,0,.8);opacity:0;transition:opacity .6s}#zone.on{opacity:1}#hint{position:absolute;bottom:14px;left:0;right:0;text-align:center;color:#f3e3b38c;font-size:9px;letter-spacing:.08em;text-shadow:0 1px 0 #000}.screen{position:fixed;inset:0;display:grid;place-items:center;align-content:center;gap:12px;padding:20px;background:#0b0a12eb;color:#f3e3b3;text-align:center;z-index:10;overflow-y:auto;opacity:0;transition:opacity .5s}.screen.in{opacity:1}.screen[hidden]{display:none}.logo{font-size:40px;letter-spacing:.3em;text-shadow:4px 4px 0 #3a1f1f,0 0 24px rgba(255,200,120,.35)}.logo.small{font-size:22px}.sub{font-size:10px;letter-spacing:.2em;opacity:.7}.card{display:grid;gap:10px;width:min(92vw,340px);padding:18px;background:#ffffff0d;border:2px solid rgba(243,227,179,.25);box-shadow:6px 6px #0006}.card.wide{width:min(92vw,420px)}.card label{display:grid;gap:6px;font-size:9px;letter-spacing:.15em;text-align:left}.card input{font:inherit;font-size:12px;padding:10px;color:#f3e3b3;background:#0b0a12;border:2px solid rgba(243,227,179,.35);outline:none}.card input:focus{border-color:#f3e3b3}.tabs{display:flex;gap:6px}.tab{flex:1;font:inherit;font-size:8px;letter-spacing:.1em;padding:8px 4px;color:#f3e3b3;background:transparent;border:2px solid rgba(243,227,179,.25);cursor:pointer}.tab.on{background:#f3e3b329;border-color:#f3e3b3}.btn{font:inherit;font-size:11px;letter-spacing:.2em;color:#0b0a12;background:#f3e3b3;border:0;padding:12px 22px;box-shadow:4px 4px #6b4a2a;cursor:pointer}.btn:active{transform:translate(2px,2px);box-shadow:2px 2px #6b4a2a}.btn:disabled{opacity:.5;cursor:wait}.ghost{font:inherit;font-size:8px;letter-spacing:.15em;color:#f3e3b3b3;background:transparent;border:2px solid rgba(243,227,179,.25);padding:9px 12px;cursor:pointer}.ghost:hover{color:#f3e3b3;border-color:#f3e3b3}.err{margin:0;font-size:8px;line-height:1.6;color:#ff8a80}.err[hidden]{display:none}.row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;align-items:center}.cards{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;max-width:720px}.pk{position:relative;font:inherit;color:#f3e3b3;background:#ffffff0f;border:2px solid rgba(243,227,179,.25);padding:12px 14px 10px;cursor:pointer;display:grid;justify-items:center;gap:6px;min-width:150px}.pk:hover{border-color:#f3e3b3;background:#f3e3b31f}.pk i,.preview i{display:block;width:96px;height:144px;background-repeat:no-repeat;background-size:288px 576px;background-position:-96px 0;image-rendering:pixelated}.pk b{font-size:10px;letter-spacing:.12em}.pk small{font-size:7px;opacity:.65;letter-spacing:.08em;line-height:1.6}.pk .del{position:absolute;top:4px;right:8px;font-size:12px;opacity:.4}.pk .del:hover{opacity:1;color:#ff8a80}.preview{display:grid;place-items:center;height:150px}.opts{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.opts span{font-size:8px;letter-spacing:.15em;opacity:.7;margin-right:6px}.opt{font:inherit;font-size:8px;letter-spacing:.1em;padding:8px 10px;color:#f3e3b3;background:transparent;border:2px solid rgba(243,227,179,.25);cursor:pointer}.opt.on{background:#f3e3b329;border-color:#f3e3b3}.desc{margin:0;font-size:8px;line-height:1.7;opacity:.8;min-height:2.5em}.story{width:min(92vw,560px);padding:26px 24px 20px;background:#14101ef5;border:2px solid rgba(243,227,179,.3);box-shadow:8px 8px #00000080;display:grid;gap:16px}.story-title{font-size:14px;letter-spacing:.3em;color:#ffcf7a;text-shadow:2px 2px 0 #3a1f1f}#story-text{margin:0;text-align:left;font-size:9px;line-height:2.1;white-space:pre-wrap;min-height:200px}#leave{position:absolute;top:12px;left:12px;pointer-events:auto}#leave[hidden]{display:none}@media (max-width: 640px){.logo{font-size:28px}#hint{display:none}.pk{min-width:120px;padding:8px}.pk i,.preview i{width:64px;height:96px;background-size:192px 384px;background-position:-64px 0}.preview{height:100px}#story-text{font-size:8px;line-height:2;min-height:160px}}