: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}#weather{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}#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%)}#reconnect{color:var(--accent);text-align:center;padding:14px 20px;font-size:16px;top:40%;left:50%;transform:translate(-50%,-50%)}#open-join{pointer-events:auto;width:100%;font:inherit;cursor:pointer;background:var(--accent);color:#1b1b24;border:none;border-radius:6px;margin-top:8px;padding:7px 16px;font-weight:700;display:block;box-shadow:0 2px 8px #0006}#open-join:hover{filter:brightness(1.1)}#drought{pointer-events:none;mix-blend-mode:multiply;background:radial-gradient(#ffbe5a14,#be782838);position:absolute;inset:0}#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}.icon{width:32px;height:32px;image-rendering:pixelated;background-repeat:no-repeat;flex:none;display:inline-block}#shop-sell{max-height:40vh;overflow-y:auto}#shop-sell .label{color:var(--panel-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:8px;font-size:11px}#bag{pointer-events:auto;width:268px;top:230px;right:224px}#bag-close{pointer-events:auto;font:inherit;cursor:pointer;color:var(--panel-muted);background:0 0;border:1px solid #fff3;border-radius:4px;padding:0 6px}#bag-worn{gap:6px;margin:8px 0;display:flex}#bag-slots{grid-template-columns:repeat(5,44px);gap:4px;margin-bottom:8px;display:grid}#bag .slot{cursor:pointer;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:6px;place-items:center;width:44px;height:44px;display:grid;position:relative}#bag .slot:hover{border-color:var(--accent)}#bag .slot.empty{cursor:default}#bag .slot.empty:hover{border-color:#ffffff1a}#bag .slot.worn{background:#f0c86014;flex:1;width:auto;height:52px}#bag .slot .n{text-shadow:0 0 2px #000,0 0 2px #000;font-size:11px;font-weight:700;position:absolute;bottom:1px;right:3px}#bag .slot .lbl{text-align:center;color:var(--panel-muted);font-size:9px;position:absolute;bottom:1px;left:0;right:0}#bag .slot.worn .icon{margin-bottom:8px}#bag-skills{grid-template-columns:1fr 1fr;gap:2px 12px;margin:8px 0;font-size:11px;display:grid}#bag-skills .skill{grid-template-columns:1fr auto;align-items:center;display:grid}#bag-skills .skill b{color:var(--accent)}#bag-skills .xp{background:#ffffff1a;border-radius:2px;grid-column:1/3;height:3px;overflow:hidden}#bag-skills .xp div{background:var(--accent);height:100%}.working{color:var(--accent)}@media (width<=720px){#bag{top:50%;right:50%;transform:translate(50%,-50%)}}.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}#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}#join .card h1{font-size:20px}#login-card h1{font-size:24px}#chars-list{text-align:left;flex-direction:column;gap:6px;margin:10px 0;display:flex}#chars-list .char{background:#ffffff0d;border-radius:6px;align-items:center;gap:8px;padding:6px;display:flex}#chars-list canvas{width:48px;height:48px;image-rendering:pixelated;flex:none}#chars-list .info{text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}#chars-list button{flex:none;padding:6px 10px}#create-peoples{margin:6px 0}#create-peoples button{padding:8px 4px}#create-blurb{min-height:3.2em;margin:6px 0}#create-looks{justify-content:center;align-items:center;gap:12px;display:flex}#create-looks canvas{width:96px;height:96px;image-rendering:pixelated;background:#ffffff0a;border-radius:8px}#create-looks button{flex:none;width:40px}#create-tints{justify-content:center;gap:6px;min-height:0;margin-top:8px;display:flex}#create-tints .swatch{border:2px solid #0000;border-radius:50%;flex:none;width:22px;height:22px;padding:0}#create-tints .swatch.on{border-color:var(--accent)}.invisible{visibility:hidden}.error{color:var(--danger)!important}.title-row{justify-content:space-between;align-items:center;gap:8px;display:flex}#switch-char{pointer-events:auto;font:inherit;cursor:pointer;color:var(--panel-muted);background:0 0;border:1px solid #fff3;border-radius:4px;padding:2px 6px;font-size:11px}#switch-char:hover{color:var(--panel-fg)}@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}}#tour .doing{color:var(--panel-fg);text-align:center;white-space:normal;max-width:60vw;font-size:12px}#tile-info .doing{color:var(--panel-fg);font-style:italic}#admin{pointer-events:auto;width:236px;font-size:12px;top:50%;left:12px;transform:translateY(-50%)}#admin .head{color:var(--accent);cursor:pointer;-webkit-user-select:none;user-select:none;font-weight:700}#admin.collapsed #admin-body{display:none}#admin .label{color:var(--panel-muted);text-transform:uppercase;letter-spacing:.05em;margin:8px 0 3px;font-size:11px}#admin .row{flex-wrap:wrap;gap:4px;display:flex}#admin button{font:inherit;cursor:pointer;color:var(--panel-fg);background:#ffffff12;border:1px solid #ffffff1f;border-radius:4px;padding:3px 6px;font-size:11px}#admin button:hover{border-color:var(--accent);background:#f0c86040}@media (width<=700px){#admin{width:min(236px,100vw - 24px);top:auto;bottom:30vh;transform:none}}