:root{--ink:#0b0f1c;--panel:#0e1224db;--panel-solid:#121833;--edge:#3a3560;--gold:#e7c46a;--gold-dim:#9c8243;--text:#efe7d2;--dim:#a59fb8;--accent:#7fd6e6;--danger:#e2737a;--font:"Pixelify Sans", ui-monospace, "Cascadia Mono", Consolas, monospace}*{box-sizing:border-box}html,body{background:var(--ink);height:100%;color:var(--text);font-family:var(--font);-webkit-font-smoothing:none;margin:0;font-size:15px;overflow:hidden}#game,#game canvas{width:100%;height:100%;image-rendering:pixelated;position:fixed;inset:0}#ui{pointer-events:none;z-index:2;position:fixed;inset:0}#ui>*{pointer-events:auto}.hidden{display:none!important}button,input{font-family:var(--font);color:var(--text);font-size:14px}button{border:2px solid var(--edge);cursor:pointer;background:linear-gradient(#2a2c52,#1d1e3c);border-radius:3px;padding:6px 12px;box-shadow:inset 0 1px #ffffff14}button:hover:not(:disabled){border-color:var(--gold-dim);color:#fff}button:disabled{opacity:.4;cursor:not-allowed}button.primary{color:#24160a;text-shadow:0 1px #fff0c880;background:linear-gradient(#e9c86e,#b98d3c);border-color:#f6e2a4;font-weight:700}button.primary:hover:not(:disabled){filter:brightness(1.08);color:#24160a}button.ghost{background:0 0}button.mini{padding:2px 8px;font-size:13px}button.danger{color:var(--danger)}input[type=text],input:not([type]),input[type=number]{border:2px solid var(--edge);background:#0a0d1c;border-radius:3px;outline:none;width:100%;padding:6px 8px}input:focus{border-color:var(--gold-dim)}input[type=range]{width:100%;accent-color:var(--gold)}input[type=checkbox]{accent-color:var(--gold);width:16px;height:16px}.card,.panel,#debug{background:var(--panel);border:2px solid var(--gold-dim);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:4px;box-shadow:0 0 0 2px #06081a,inset 0 0 0 2px #1d2244,0 12px 30px #0000008c}#lobby{background:radial-gradient(#080a1826,#080a18bf);flex-direction:column;justify-content:center;align-items:center;gap:22px;padding:24px 16px;display:flex;position:absolute;inset:0;overflow-y:auto}#lobby.busy{cursor:progress}#lobby.busy button{pointer-events:none;opacity:.6}.title{text-align:center;text-shadow:0 3px #06081a,0 0 24px #e7c46a59}.title h1{letter-spacing:4px;color:var(--gold);margin:0;font-size:64px;line-height:1}.title h1 span{color:var(--text)}.title p{color:var(--dim);letter-spacing:2px;margin:6px 0 0}.lobby-grid{grid-template-columns:240px minmax(320px,440px) 280px;align-items:start;gap:16px;max-width:100%;display:grid}.panel{flex-direction:column;gap:10px;padding:14px 16px 16px;display:flex}.panel h2{color:var(--gold);letter-spacing:1px;justify-content:space-between;align-items:baseline;margin:0 0 2px;font-size:17px;display:flex}.panel h2 small{color:var(--dim);font-size:12px;font-weight:400}.panel label{color:var(--dim);flex-direction:column;gap:4px;font-size:13px;display:flex}.panel label.check{flex-direction:row;align-items:center;gap:8px}.row{align-items:center;gap:8px;display:flex}.row>*{flex:1}.inline{gap:6px;display:flex}.inline input{flex:1}#l-preview{width:96px;height:144px;image-rendering:pixelated;border:2px solid var(--edge);background:radial-gradient(at 50% 88%,#00000059 0 18%,#0000 19%),linear-gradient(#1a2044,#0f1430);border-radius:3px;align-self:center}.look{flex-direction:column;gap:4px;display:flex}.look-row{text-align:center;color:var(--dim);grid-template-columns:30px 1fr 30px;align-items:center;font-size:13px;display:grid}.look-row .arrow{padding:2px 0;font-size:11px}#l-rooms{flex-direction:column;gap:6px;min-height:120px;max-height:280px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}#l-rooms li{border:1px solid var(--edge);background:#ffffff0a;border-radius:3px;grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:8px 10px;display:grid}#l-rooms li.empty{color:var(--dim);text-align:center;border-style:dashed;padding:28px 10px;display:block}.r-main{flex-direction:column;min-width:0;display:flex}.r-main small{color:var(--dim);font-size:12px}.r-meta{color:var(--dim);flex-direction:column;align-items:end;font-size:12px;display:flex}.r-meta code{color:var(--accent);font-family:var(--font)}.hint{color:var(--dim);text-align:center;text-shadow:0 2px #06081a;margin:0;font-size:13px}.lobby-error{border:2px solid var(--danger);opacity:0;pointer-events:none;background:#3a1520;border-radius:3px;padding:8px 14px;transition:opacity .2s;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.lobby-error.show{opacity:1}#hud{pointer-events:none;position:absolute;inset:0}#hud>*{pointer-events:auto}.loc{min-width:200px;padding:10px 14px;position:absolute;top:14px;left:14px}.loc-region{color:var(--gold);letter-spacing:1px;font-size:20px}.loc-sub{color:var(--dim);font-size:13px}.loc-village{color:var(--accent);margin-top:2px;font-size:13px}.clock{text-align:center;min-width:140px;padding:6px 16px 8px;position:absolute;top:14px;left:50%;transform:translate(-50%)}.clock-time{letter-spacing:2px;font-size:20px}.coords{color:var(--dim);font-size:11px}.sun{border-bottom:1px dashed var(--edge);height:16px;margin:0 6px 2px;position:relative}.sun:after{content:"";width:8px;height:8px;left:calc(var(--x,50%) - 4px);bottom:calc(var(--y,0%) * .12 - 4px);background:#ffd76a;border-radius:50%;position:absolute;box-shadow:0 0 8px #ffb84a}.sun.moon:after{background:#cfd8ff;box-shadow:0 0 8px #8fa4ff}.party{width:230px;padding:10px 12px;position:absolute;top:14px;right:14px}.party header{color:var(--gold);justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.party ul{flex-direction:column;gap:3px;margin:0;padding:0;list-style:none;display:flex}.party li{align-items:center;gap:7px;font-size:14px;display:flex}.party li i{border:1px solid #000;width:9px;height:9px;display:inline-block}.party li small{color:var(--dim);margin-left:auto;font-size:11px}.party li.you{color:#ffe9a8}.crown{color:var(--gold)}.party footer{justify-content:space-between;gap:6px;margin-top:10px;display:flex}.chat{flex-direction:column;gap:6px;width:min(380px,100vw - 28px);display:flex;position:absolute;bottom:14px;left:14px}.chat-log{text-shadow:0 1px #000,0 0 3px #000;flex-direction:column;gap:2px;max-height:160px;padding:4px;font-size:14px;display:flex;overflow-y:auto;-webkit-mask-image:linear-gradient(#0000,#000 24px);mask-image:linear-gradient(#0000,#000 24px)}.chat-log b{color:var(--gold)}.chat-log .sys{color:var(--accent);font-style:italic}.chat input{background:#0a0d1ccc}.emote-keys{color:var(--dim);text-shadow:0 1px #000;flex-wrap:wrap;gap:8px;font-size:11px;display:flex}.emote-keys b{color:var(--gold);margin-right:3px}.stats{border:1px solid var(--edge);font-family:var(--font);color:var(--dim);background:#080a16b3;border-radius:3px;margin:0;padding:6px 10px;font-size:12px;line-height:1.35;position:absolute;bottom:14px;right:14px}.banner{text-align:center;pointer-events:none;opacity:0;text-shadow:0 3px #06081a,0 0 20px #0009;position:absolute;top:22%;left:50%;transform:translate(-50%)}.banner .b-title{color:var(--gold);letter-spacing:3px;font-size:38px}.banner .b-sub{color:var(--text);letter-spacing:4px;text-transform:uppercase;font-size:15px}.banner .b-title:before,.banner .b-title:after{content:" ✦ ";color:var(--gold-dim);vertical-align:middle;font-size:20px}.banner.show{animation:3.2s forwards banner}@keyframes banner{0%{opacity:0;transform:translate(-50%,8px)}12%{opacity:1;transform:translate(-50%)}80%{opacity:1}to{opacity:0}}.toast{background:var(--panel-solid);border:2px solid var(--gold-dim);opacity:0;pointer-events:none;border-radius:3px;padding:6px 14px;transition:opacity .2s,transform .2s;position:absolute;bottom:80px;left:50%;transform:translate(-50%,10px)}.toast.show{opacity:1;transform:translate(-50%)}#debug{z-index:5;flex-direction:column;width:330px;display:flex;position:absolute;top:14px;bottom:14px;left:14px}#debug header{justify-content:space-between;align-items:center;padding:10px 12px 4px;display:flex}#debug h3{color:var(--gold);letter-spacing:1px;margin:0}#debug nav{border-bottom:1px solid var(--edge);flex-wrap:wrap;gap:4px;padding:6px 12px 8px;display:flex}#debug nav button{padding:3px 8px;font-size:12px}#debug nav button.on{border-color:var(--gold);color:var(--gold)}.d-body{flex:1;padding:8px 12px 14px;overflow-y:auto}.tab{flex-direction:column;gap:6px;display:none}.tab.on{display:flex}.tab details{border-bottom:1px solid #ffffff0f;padding:4px 0}.tab summary{cursor:pointer;color:var(--gold-dim);letter-spacing:1px;text-transform:uppercase;padding:4px 0;font-size:13px}.ctl{flex-direction:column;gap:2px;padding:3px 0;display:flex}.ctl label{color:var(--dim);justify-content:space-between;font-size:13px;display:flex}.ctl label span{color:var(--text)}.ctl.check{flex-direction:row;justify-content:space-between;align-items:center}.note{color:var(--accent);margin:2px 0 4px;font-size:12px}@media (max-width:1000px){.lobby-grid{grid-template-columns:1fr;width:min(460px,100%)}.title h1{font-size:44px}.clock{display:none}.party{width:180px}}