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{box-sizing:border-box;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}.pk canvas,.preview canvas{display:block;width:96px;height:144px;image-rendering:pixelated}.pk canvas{width:64px;height:96px}.picks{display:grid;gap:6px}.pick{display:flex;align-items:center;gap:8px}.pick>span{flex:0 0 46px;font-size:8px;letter-spacing:.12em;opacity:.7;text-align:left}.pick b{flex:1;min-width:0;font-size:8px;letter-spacing:.1em;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pick .dot{flex:0 0 12px;height:12px;border:2px solid rgba(243,227,179,.35)}.nudge{font:inherit;font-size:13px;line-height:1;color:#f3e3b3;background:#f3e3b314;border:2px solid rgba(243,227,179,.25);width:38px;height:34px;padding:0;cursor:pointer;touch-action:manipulation}.nudge:hover{border-color:#f3e3b3;background:#f3e3b333}.nudge:active{transform:translate(1px,1px)}.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{box-sizing:border-box;width:min(92vw,560px);max-height:86vh;overflow-y:auto;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:116px}.pk canvas{width:48px;height:72px}.preview canvas{width:72px;height:108px}.card{padding:14px}#story-text{font-size:8px;line-height:2;min-height:120px}.story{padding:18px 14px 14px}}@media (max-width: 380px){.pick>span{flex-basis:38px;letter-spacing:.04em}.nudge{width:34px}.opt{padding:8px 7px;letter-spacing:.04em}.opts{gap:4px}.opts span{margin-right:2px}}#inv{position:fixed;inset:0;z-index:5;display:grid;place-items:center;pointer-events:none;--cell: 48px;--eq: 34px}#inv[hidden]{display:none}.inv-box{pointer-events:auto;box-sizing:border-box;width:min(92vw,580px);max-height:88vh;overflow-y:auto;overflow-x:hidden;padding:14px;color:#f3e3b3;background:#0b0a12f0;border:2px solid rgba(243,227,179,.35);box-shadow:6px 6px #00000080;display:grid;gap:10px}.inv-head{display:flex;align-items:center;gap:10px}.inv-head b{font-size:11px;letter-spacing:.2em;color:#ffcf7a}.inv-hint{flex:1;font-size:7px;opacity:.55;letter-spacing:.05em}.inv-head .ghost{padding:6px 10px}.inv-tabs{display:none;gap:6px}.inv-tabs[hidden]{display:none!important}.itab{flex:1;font:inherit;font-size:8px;letter-spacing:.1em;padding:9px 4px;color:#f3e3b3;background:transparent;border:2px solid rgba(243,227,179,.25);cursor:pointer}.itab.on{background:#f3e3b329;border-color:#f3e3b3}.inv-body{display:grid;gap:12px;align-items:start;grid-template-columns:max-content minmax(0,1fr);grid-template-areas:"bag char" "bag stats"}#inv-bag-col{grid-area:bag}#inv-bau-col{grid-area:bau}#inv-char-col{grid-area:char}#inv-stats-col{grid-area:stats}.inv-col{display:grid;gap:8px;align-content:start}.inv-col[hidden]{display:none!important}.inv-sub{font-size:8px;letter-spacing:.15em;opacity:.7}.inv-grid{display:grid;grid-template-columns:repeat(4,var(--cell));gap:4px}.inv-grid.bau{--cell: 32px;grid-template-columns:repeat(8,var(--cell))}.slot{position:relative;box-sizing:border-box;width:var(--cell);height:var(--cell);padding:0;background:#ffffff0d;border:2px solid rgba(243,227,179,.25);cursor:pointer;display:grid;place-items:center;font:inherit;color:inherit}.slot:hover{background:#f3e3b31f}.slot.on{background:#f3e3b338;outline:2px solid #f3e3b3;outline-offset:-2px}.slot small{position:absolute;right:2px;bottom:1px;font-size:7px;text-shadow:1px 1px 0 #000,-1px 0 0 #000}.ic{display:block;width:var(--cell);height:var(--cell);image-rendering:pixelated;background-repeat:no-repeat;background-size:calc(var(--cell) * 8) auto;background-position:calc(var(--cell) * -1 * var(--c, 0)) calc(var(--cell) * -1 * var(--r, 0))}.ic.items{background-image:url(/tex/items.png)}.ic.weapons{background-image:url(/tex/weapons.png)}.ic.armor{background-image:url(/tex/armor.png)}.ic.acess{background-image:url(/tex/acess.png)}.inv-info{display:flex;gap:10px;align-items:flex-start;text-align:left;padding:8px;background:#ffffff0a;border:2px solid rgba(243,227,179,.15)}.inv-info[hidden]{display:none}.inv-info b{font-size:9px;letter-spacing:.08em}.inv-info p{margin:5px 0 0;font-size:7px;line-height:1.7;opacity:.8}.inv-actions{display:flex;gap:8px;flex-wrap:wrap}.inv-actions .btn{font-size:8px;padding:9px 12px}.inv-actions .ghost{padding:8px 10px}.inv-char{justify-items:center}.char-box{display:flex;gap:6px;align-items:center;justify-content:center}#inv-char{width:132px;height:144px;image-rendering:pixelated;background:radial-gradient(ellipse at 50% 80%,rgba(217,178,95,.18),transparent 60%);border:1px solid rgba(217,178,95,.25)}.eq-col{display:grid;gap:6px}.eq-slot{position:relative;box-sizing:border-box;width:var(--eq);height:var(--eq);padding:0;background:#ffffff0d;border:2px solid rgba(243,227,179,.22);cursor:pointer;font:inherit;color:inherit}.eq-slot:before{content:"";position:absolute;inset:0;image-rendering:pixelated;background-image:url(/tex/slots.png);background-repeat:no-repeat;background-size:calc((var(--eq) - 4px) * 8) auto;background-position:calc((var(--eq) - 4px) * -1 * var(--si, 0)) center;opacity:.45}.eq-slot[data-eq=cabeca]{--si: 0}.eq-slot[data-eq=peito]{--si: 1}.eq-slot[data-eq=bracos]{--si: 2}.eq-slot[data-eq=anel]{--si: 3}.eq-slot[data-eq=arma]{--si: 4}.eq-slot[data-eq=pernas]{--si: 5}.eq-slot[data-eq=botas]{--si: 6}.eq-slot[data-eq=bracelete]{--si: 7}.eq-slot:hover{background:#f3e3b31f}.eq-slot.on{border-color:#d9b25f;background:#d9b25f1a}.eq-slot.on:before{opacity:.12}.eq-slot.sel{background:#f3e3b338;outline:2px solid #f3e3b3;outline-offset:-2px}.eq-slot i{position:absolute;left:50%;top:50%;width:24px;height:24px;margin:-12px 0 0 -12px;background-repeat:no-repeat;background-size:192px auto;image-rendering:pixelated}.inv-stats{display:grid;gap:4px 10px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));font-size:8px;line-height:1.7;color:#f3e3b3}.st{display:flex;align-items:baseline;justify-content:space-between;gap:6px;min-width:0}.st span{flex:0 0 auto;opacity:.6;letter-spacing:.04em}.st b{min-width:0;text-align:right;overflow-wrap:anywhere}@media (min-width: 901px){.inv-box.bau{width:min(92vw,820px)}.inv-body.bau{grid-template-columns:max-content max-content minmax(0,1fr);grid-template-areas:"bag bau char" "bag bau stats"}}@media (max-width: 900px){.inv-tabs{display:flex}.inv-body.bau{grid-template-areas:"bag char" "bag stats"}.inv-body.bau #inv-bau-col{grid-area:bag}.inv-body.bau[data-tab=inv] #inv-bau-col,.inv-body.bau[data-tab=bau] #inv-bag-col{display:none!important}.inv-grid.bau{--cell: 40px;grid-template-columns:repeat(5,var(--cell))}}@media (max-width: 640px){#inv{--cell: 36px;--eq: 30px}.inv-box{width:min(94vw,560px);padding:10px;gap:8px}.inv-hint{display:none}.inv-body,.inv-body.bau{gap:8px;grid-template-areas:"bag char" "stats stats"}.inv-grid.bau{--cell: 34px;grid-template-columns:repeat(4,var(--cell))}#inv-char{width:88px;height:96px}.char-box,.eq-col{gap:4px}}@media (max-width: 380px){#inv{--cell: 34px;--eq: 28px}.inv-stats{grid-template-columns:repeat(auto-fit,minmax(104px,1fr));font-size:7px}}
