:root{--ink:#f2f4f6;--muted:#a9b3bd;--panel:#12181ff0;--panel-edge:#ffffff1f;--accent:#6fb146;--accent-ink:#0f1a09;--danger:#ff8c7a;--sky:#9cc6e4;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--sky);height:100%;color:var(--ink);margin:0;font:15px/1.4 ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#app,.stage{position:fixed;inset:0}.stage{display:flex}.game{flex:1;min-width:0;position:relative;overflow:hidden}.chat{z-index:2;border-left:1px solid var(--panel-edge);background:#0e1218f0;flex-direction:column;width:clamp(220px,24vw,340px);display:flex}.chat .lines{overflow-wrap:anywhere;flex-direction:column;flex:1;gap:4px;min-height:0;margin:0;padding:10px 12px;font-size:14px;list-style:none;display:flex;overflow-y:auto}.chat .lines li:first-child{margin-top:auto}.chat .from{font-weight:600}.handle-tag{opacity:.6;font-weight:400}.name-row{align-items:center;gap:6px;display:flex}.name-row input{flex:1;min-width:0}.chat .line-event{color:var(--muted);font-style:italic}.chat .line-notice{color:#f2c94c}.chat .say{border-top:1px solid var(--panel-edge);padding:8px}.chat input{border:1px solid var(--panel-edge);width:100%;color:var(--ink);font:inherit;background:#ffffff0f;border-radius:6px;outline:none;padding:8px 10px}.chat input:focus,.join input[type=text]:focus{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);background:#ffffff1a}.view{cursor:crosshair;touch-action:none;display:block}.labels{z-index:1;pointer-events:none;position:absolute;inset:0}.nametag{color:#fff;white-space:nowrap;background:#00000073;border-radius:3px;justify-items:center;gap:2px;padding:1px 6px;font-size:14px;display:grid}.nametag .hp{background:#ffffff40;border-radius:2px;width:40px;height:4px;display:block;overflow:hidden}.nametag .hp[hidden]{display:none}.nametag .hp>span{background:#e5484d;height:100%;display:block}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline-offset:2px;outline:2px solid #fff}.join{border:1px solid var(--panel-edge);background:var(--panel);border-radius:10px;gap:14px;width:min(360px,100vw - 32px);max-height:calc(100vh - 32px);padding:24px;display:grid;position:fixed;top:50%;left:50%;overflow:auto;transform:translate(-50%,-50%)}.join[hidden]{display:none}.join .fields{gap:14px;display:grid}.signin{text-align:center;text-decoration:none;display:block}.join h1{margin:0;line-height:0}.wordmark{width:168px;height:auto;color:var(--ink);display:block}.join label{color:var(--muted);gap:4px;display:grid}.join input[type=text]{border:1px solid var(--panel-edge);width:100%;color:var(--ink);font:inherit;background:#ffffff0f;border-radius:6px;outline:none;padding:9px 10px}.skin{align-items:center;gap:16px;display:flex}.skin-preview{flex:none;width:64px;height:128px}.skin-preview canvas{image-rendering:pixelated;display:block}.skin-actions{gap:8px;display:grid}.secondary,.primary,.blocks-button{border:1px solid var(--panel-edge);background:#ffffff14;border-radius:6px;padding:8px 14px}.secondary[hidden]{display:none}.primary{background:var(--accent);color:var(--accent-ink);border-color:#0000;font-weight:600}.primary:disabled{opacity:.6;cursor:progress}.error{min-height:1.4em;color:var(--danger);margin:0}.online{color:var(--muted);margin:0}.controls{grid-template-columns:auto 1fr;gap:2px 14px;margin:0;font-size:14px;display:grid}.controls dt{color:var(--ink);white-space:nowrap}.controls dd{color:var(--muted);margin:0}.status{z-index:2;pointer-events:none;background:#0006;border-radius:6px;padding:6px 10px;font:14px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;position:absolute;top:12px;left:12px}.reconnecting{z-index:2;color:var(--ink);pointer-events:none;background:#0000008c;border-radius:999px;padding:6px 12px;font-size:14px;animation:1.6s ease-in-out infinite pulse;position:absolute;top:12px;left:50%;transform:translate(-50%)}@keyframes pulse{50%{opacity:.55}}@media (prefers-reduced-motion:reduce){.reconnecting{animation:none}}.bar{z-index:2;justify-items:start;gap:6px;display:grid;position:absolute;bottom:14px;left:50%;transform:translate(-50%)}.bar-row{align-items:center;gap:10px;display:flex}.hearts{gap:2px;padding:0 4px;display:flex}.heart{width:18px;height:18px;position:relative}.heart svg{width:18px;height:18px;position:absolute;inset:0}.heart .empty path{fill:#1e0a0a8c;stroke:#0009;stroke-width:1px}.heart .fill{position:absolute;inset:0 auto 0 0;overflow:hidden}.heart .full path{fill:#e5484d;stroke:#0009;stroke-width:1px}.count{color:#fff;text-shadow:0 1px 2px #000;pointer-events:none;font:600 14px/1 ui-monospace,SFMono-Regular,Menlo,monospace;position:absolute;bottom:1px;right:3px}.hotbar{background:#00000073;border-radius:8px;gap:4px;padding:4px;display:flex}.slot{background:#ffffff0f;border:2px solid #0000;border-radius:6px;place-items:center;width:48px;height:48px;padding:0;display:grid;position:relative}.slot.selected{background:#ffffff2e;border-color:#fff}.slot canvas,.panel canvas{image-rendering:pixelated;pointer-events:none}.slot .key{color:var(--muted);text-shadow:0 1px 2px #000;pointer-events:none;font-size:14px;line-height:1.2;position:absolute;top:1px;left:4px}.blocks-button{background:#00000073;border-color:#0000}.panel{z-index:3;border:1px solid var(--panel-edge);background:var(--panel);border-radius:10px;width:min(560px,100vw - 32px);max-height:calc(100vh - 140px);padding:12px 14px;position:absolute;bottom:110px;left:50%;overflow:auto;transform:translate(-50%)}.panel[hidden]{display:none}.panel h2{color:var(--muted);margin:4px 0 8px;font-size:14px;font-weight:600}.recipes{gap:4px;display:grid}.recipe{opacity:.5;background:#ffffff0a;border-radius:6px;grid-template-columns:120px auto auto 1fr auto;align-items:center;gap:8px;padding:3px 6px 3px 8px;display:grid}.recipe.ready{opacity:1;background:#ffffff17}.recipe .name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.craft{background:var(--accent);color:var(--accent-ink);border:0;border-radius:6px;padding:5px 12px;font-weight:600}.craft:disabled{color:var(--muted);cursor:default;background:#ffffff1a}.recipe .inputs{gap:2px;display:flex}.recipe .arrow{color:var(--muted)}.stack{place-items:center;width:34px;height:34px;display:grid;position:relative}.stack canvas{image-rendering:pixelated}.flash{z-index:4;pointer-events:none;opacity:0;background:radial-gradient(#0000 45%,#c800008c);position:absolute;inset:0}.flash.on{animation:.45s ease-out flash}@keyframes flash{0%{opacity:1}to{opacity:0}}.death{background:#5a0a0a8c}.death h2{margin:0;font-size:24px}.overlay[hidden]{display:none}.palette-grid{grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:6px;display:grid}.palette-grid button{background:#ffffff0f;border:1px solid #0000;border-radius:6px;place-items:center;height:52px;display:grid;position:relative}.palette-grid button:disabled{opacity:.5;cursor:default}.palette-grid button:hover:not(:disabled){border-color:var(--panel-edge);background:#ffffff24}.overlay{z-index:5;background:#0a0e1299;place-items:center;display:grid;position:fixed;inset:0}.dialog{border:1px solid var(--panel-edge);background:var(--panel);text-align:center;border-radius:10px;gap:14px;min-width:min(320px,100vw - 32px);padding:20px 24px;display:grid}.dialog p{margin:0}.menu .dialog{text-align:left;gap:10px;width:min(340px,100vw - 32px);max-height:calc(100vh - 32px);overflow:auto}.menu .spawn{color:var(--muted);font:14px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace}.menu .controls{border-top:1px solid var(--panel-edge);margin-top:6px;padding-top:10px}.danger{color:var(--danger);background:#ff8c7a14;border-color:#ff8c7a73}.danger:hover:not(:disabled){background:#ff8c7a2e}.menu .devices{border-top:1px solid var(--panel-edge);gap:8px;margin-top:6px;padding-top:10px;display:grid}.menu .devices h2{margin:0;font-size:15px;font-weight:600}.device-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.device-list li{align-items:center;gap:10px;display:flex}.device-list .about{flex:1;min-width:0;display:grid}.device-list .seen{color:var(--muted);font-size:14px}.secondary:disabled{opacity:.45;cursor:default}@media (width<=560px){.slot{width:34px;height:34px}.slot canvas{width:26px!important;height:26px!important}.slot .key{display:none}}
