:root{--panel-bg:#12161ecc;--panel-fg:#e9e4d4;--panel-muted:#a9a391;--accent:#f0c860;--danger:#ff7a6b;--crier:#ffd88a;--death:#c9a0ff;--disease:#9be07a;--quest:#7ac8ff}*{box-sizing:border-box}html,body{height:100%;color:var(--panel-fg);background:#1d3b6e;margin:0;font:13px/1.4 ui-monospace,Cascadia Mono,Consolas,monospace;overflow:hidden}#game,#game canvas{width:100%;height:100%;position:absolute;inset:0}#game canvas{image-rendering:pixelated}#night,#weather{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}#night{opacity:0;mix-blend-mode:multiply;background:#0b1030;transition:opacity 2s linear}#hud{pointer-events:none;position:absolute;inset:0}.hidden{display:none!important}.muted{color:var(--panel-muted)}.small{font-size:11px}.panel{background:var(--panel-bg);border:1px solid #ffffff14;border-radius:6px;padding:8px 10px;position:absolute}.title{color:var(--accent);letter-spacing:.06em;font-weight:700}#status{min-width:230px;max-width:320px;top:12px;left:12px}#status .title{text-transform:uppercase}#tile-info:empty{display:none}#right{pointer-events:auto;flex-direction:column;gap:8px;width:200px;display:flex;position:absolute;top:12px;right:12px}#minimap{cursor:crosshair;width:200px;height:200px;image-rendering:pixelated;background:#10203d;border:1px solid #ffffff26;border-radius:6px}#villages{max-height:40vh;position:static;overflow-y:auto}#villages .head{color:var(--accent);margin-bottom:4px;font-weight:700}.village{cursor:pointer;border-top:1px solid #ffffff0f;padding:4px 0}.village:hover .vname{color:var(--accent)}.vname{font-weight:700}.alarm{color:var(--danger)}.sick{color:var(--disease)}#log{pointer-events:auto;width:min(460px,100vw - 24px);max-height:24vh;font-size:12px;bottom:12px;left:12px;overflow-y:auto}#log:empty{display:none}#log .ev{padding:1px 0}#log .ev[data-x]{cursor:pointer}#log .ev[data-x]:hover{text-decoration:underline}#log .danger{color:var(--danger)}#log .crier{color:var(--crier)}#log .death{color:var(--death)}#log .disease{color:var(--disease)}#log .quest{color:var(--quest)}#player{pointer-events:auto;width:260px;bottom:12px;right:12px}.bar{background:#3a1414;border-radius:3px;height:14px;margin:6px 0;position:relative;overflow:hidden}#hp-fill{background:linear-gradient(#6ad46a,#3c9a3c);width:100%;height:100%;transition:width .2s}#hp-text{text-align:center;font-size:10px;line-height:14px;position:absolute;inset:0}#quests .q{cursor:pointer;color:var(--quest);border-top:1px solid #ffffff14;margin-top:6px;padding-top:6px}#help{color:var(--panel-muted);white-space:nowrap;font-size:11px;bottom:12px;left:50%;transform:translate(-50%)}#tour{color:var(--accent);white-space:nowrap;font-size:12px;top:12px;left:50%;transform:translate(-50%)}#talk{pointer-events:auto;width:min(560px,100vw - 24px);bottom:70px;left:50%;transform:translate(-50%)}#talk ul{margin:8px 0;padding-left:18px}#talk li{margin:3px 0}#shop{pointer-events:auto;width:min(420px,100vw - 24px);top:50%;left:50%;transform:translate(-50%,-50%)}#shop-items{margin:10px 0}.shop-item{border-top:1px solid #ffffff14;align-items:center;gap:10px;padding:6px 0;display:flex}.shop-item .info{flex:1}.shop-item button{font:inherit;cursor:pointer;background:var(--accent);color:#1b1b24;border:none;border-radius:5px;padding:6px 10px;font-weight:700}.shop-item button:disabled{opacity:.4;cursor:default}.error{color:var(--danger)}#dead{color:var(--danger);text-align:center;text-shadow:0 2px 8px #000;font-size:28px;position:absolute;top:40%;left:50%;transform:translate(-50%,-50%)}#dead span{color:var(--panel-fg);font-size:14px}#chat{pointer-events:auto;background:var(--panel-bg);width:min(480px,100vw - 24px);color:var(--panel-fg);border:1px solid var(--accent);font:inherit;border-radius:6px;padding:8px 10px;position:absolute;bottom:46px;left:50%;transform:translate(-50%)}#join{background:radial-gradient(#0a10208c,#0a1020d9);place-items:center;display:grid;position:absolute;inset:0}#join .card{background:var(--panel-bg);text-align:center;border:1px solid #ffffff1f;border-radius:10px;width:min(380px,100vw - 32px);padding:24px 28px}#join h1{color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin:0 0 6px;font-size:24px}#join input{width:100%;font:inherit;color:var(--panel-fg);background:#0e1320;border:1px solid #fff3;border-radius:6px;margin:12px 0;padding:10px}#join .buttons{gap:8px;display:flex}#join button{font:inherit;cursor:pointer;background:var(--accent);color:#1b1b24;border:none;border-radius:6px;flex:1;padding:10px;font-weight:700}#join button.secondary{color:var(--panel-fg);background:0 0;border:1px solid #ffffff40}#join button:disabled{opacity:.5;cursor:default}@media (width<=720px){#right{width:140px}#minimap{width:140px;height:140px}#villages,#help{display:none}#player{width:180px}#log{width:calc(100vw - 214px);max-height:20vh}}