:root{--bg: #0f1419;--bg2: #161d27;--panel: #1a2332;--panel2: #222e42;--border: #2d3a4f;--text: #e8eef7;--muted: #8b9bb4;--accent: #d4a84b;--accent2: #6b9bd2;--danger: #d46b6b;--ok: #6bc48a;--sea: #1a3348;--land: #3d3428;--sc: #d4a84b;font-family:"Source Sans 3",system-ui,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%;background:var(--bg);color:var(--text)}body{display:flex;flex-direction:column}#app{flex:1;min-height:0;height:auto}button{font-family:inherit;cursor:pointer;border:1px solid var(--border);background:var(--panel2);color:var(--text);border-radius:6px;padding:.45rem .85rem;font-size:.9rem}button:hover{border-color:var(--accent);color:var(--accent)}button.primary{background:var(--accent);color:#1a1408;border-color:var(--accent);font-weight:700}button.primary:hover{filter:brightness(1.08);color:#1a1408}button:disabled{opacity:.45;cursor:not-allowed}button.danger{border-color:var(--danger);color:var(--danger)}input,select,textarea{font-family:inherit;background:var(--bg2);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:.45rem .6rem;font-size:.9rem}.lobby{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;padding:2rem;background:radial-gradient(ellipse at 30% 20%,#1c2a40 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,#2a2218 0%,transparent 45%),var(--bg)}.lobby h1{font-family:Cinzel,serif;font-size:2.6rem;letter-spacing:.06em;color:var(--accent);text-align:center}.lobby .sub{color:var(--muted);text-align:center;max-width:520px;line-height:1.5}.lobby-card{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:1.5rem;width:min(560px,100%);display:flex;flex-direction:column;gap:.85rem}.lobby-card h2{font-family:Cinzel,serif;font-size:1.15rem;color:var(--accent2)}.power-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.power-opt{display:flex;align-items:center;gap:.55rem;padding:.55rem .7rem;border:1px solid var(--border);border-radius:8px;cursor:pointer;background:var(--bg2)}.power-opt:hover,.power-opt.selected{border-color:var(--accent)}.power-opt .dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.power-opt .meta{font-size:.75rem;color:var(--muted)}.power-opt strong{display:block;font-size:.9rem}.lobby-actions{display:flex;gap:.5rem;flex-wrap:wrap}.lobby-join{display:flex;gap:.5rem}.lobby-join input{flex:1;min-width:0;background:var(--bg2);border:1px solid var(--border);border-radius:8px;color:inherit;padding:.45rem .7rem;font-size:.95rem;letter-spacing:.2em;text-transform:uppercase}.lobby-join input:focus{outline:none;border-color:var(--accent)}.room-code{font-family:Cinzel,serif;font-size:2rem;letter-spacing:.45em;text-align:center;color:var(--accent2);border:1px dashed var(--accent);border-radius:8px;padding:.4rem 0 .4rem .45em;background:#221c10;-webkit-user-select:all;user-select:all}.seat-list{display:flex;flex-direction:column;gap:.3rem}.seat-row{display:flex;align-items:center;gap:.55rem;padding:.4rem .6rem;border:1px solid var(--border);border-radius:8px;background:var(--bg2);font-size:.9rem}.seat-row.me{border-color:var(--accent)}.seat-row .dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.seat-row .seat-player{margin-left:auto;color:var(--muted);font-size:.8rem}.seat-row .seat-player em{color:var(--accent)}.game{display:grid;grid-template-columns:1fr 360px;grid-template-rows:auto 1fr auto;height:100%;gap:0}.topbar{grid-column:1 / -1;display:flex;align-items:center;gap:1rem;padding:.55rem 1rem;background:var(--panel);border-bottom:1px solid var(--border)}.topbar .title{font-family:Cinzel,serif;color:var(--accent);font-size:1.1rem}.topbar .phase{color:var(--accent2);font-weight:600}.topbar .spacer{flex:1}.topbar .badge{font-size:.8rem;padding:.25rem .55rem;border-radius:999px;background:var(--bg2);border:1px solid var(--border);color:var(--muted)}.map-wrap{grid-column:1;grid-row:2;overflow:hidden;background:var(--sea);position:relative;min-height:0}.map-wrap svg{width:100%;height:100%;display:block;cursor:default;background:#0a1825}.side{grid-column:2;grid-row:2 / 4;display:flex;flex-direction:column;min-height:0;background:var(--panel);border-left:1px solid var(--border)}.side-tabs{display:flex;border-bottom:1px solid var(--border)}.side-tabs button{flex:1;border:none;border-radius:0;background:transparent;padding:.7rem .4rem;color:var(--muted);border-bottom:2px solid transparent}.side-tabs button.active{color:var(--accent);border-bottom-color:var(--accent);background:var(--bg2)}.side-body{flex:1;overflow:auto;padding:.85rem;min-height:0}.bottom{grid-column:1;grid-row:3;background:var(--panel);border-top:1px solid var(--border);padding:.65rem 1rem;display:flex;align-items:center;gap:.75rem;min-height:58px}.bottom .orders-preview{flex:1;font-size:.85rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.province{transition:fill-opacity .15s,stroke .15s;stroke-linejoin:round}.province:hover{fill-opacity:.55!important}.province.selected{stroke:#f0d070!important;stroke-width:3!important;fill-opacity:.55!important}.province.legal{stroke:#6bc48a!important;stroke-width:2.5!important;fill-opacity:.5!important;cursor:pointer}.province.legal:hover{fill-opacity:.65!important}.province.source{stroke:#6b9bd2!important;stroke-width:3!important}.province-label{fill:#f5f0e0;font-size:10px;font-weight:700;font-family:"Source Sans 3",sans-serif;letter-spacing:.03em;pointer-events:none;text-anchor:middle;paint-order:stroke;stroke:#1a1408;stroke-width:2.2px;stroke-linejoin:round}.sc-marker{pointer-events:none;filter:drop-shadow(0 1px 2px #000)}.map-controls{position:absolute;top:10px;right:10px;display:flex;flex-direction:column;gap:4px;z-index:5}.map-controls button{width:30px;height:30px;padding:0;font-size:1rem;line-height:1;background:#101620d9}.map-wrap svg.panning{cursor:grabbing!important;-webkit-user-select:none;user-select:none}.results-box{border:1px solid var(--accent);background:#1c2418;border-radius:8px;padding:.55rem .7rem;margin-bottom:.75rem;font-size:.85rem}.results-box .ok{color:var(--ok)}.results-box .bad{color:var(--danger)}.results-box .warn{color:#ff8c42}.help-box{font-size:.78rem;color:var(--muted);line-height:1.45;background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:.55rem .7rem;margin-bottom:.75rem}.help-box strong{color:var(--text)}.unit-circle{stroke:#0a0e14;stroke-width:1.2;cursor:pointer}.unit-text{fill:#0a0e14;font-weight:700;font-size:10px;pointer-events:none;text-anchor:middle;dominant-baseline:central}.order-arrow{stroke:var(--accent);stroke-width:2;fill:none;marker-end:url(#arrow);pointer-events:none}.order-support{stroke:var(--ok);stroke-width:1.5;stroke-dasharray:3 2;fill:none;pointer-events:none}.panel-title{font-family:Cinzel,serif;color:var(--accent2);font-size:.95rem;margin-bottom:.55rem;letter-spacing:.03em}.order-list{display:flex;flex-direction:column;gap:.35rem}.order-row{display:flex;align-items:center;gap:.4rem;font-size:.85rem;padding:.35rem .5rem;background:var(--bg2);border-radius:6px;border:1px solid var(--border)}.order-row .x{margin-left:auto;background:transparent;border:none;color:var(--muted);padding:0 .3rem}.order-row .x:hover{color:var(--danger)}.hint{font-size:.8rem;color:var(--muted);line-height:1.4;margin-bottom:.6rem}.power-line{display:flex;align-items:center;gap:.45rem;padding:.35rem 0;font-size:.88rem}.power-line .dot{width:10px;height:10px;border-radius:50%}.power-line .sc{margin-left:auto;color:var(--muted);font-variant-numeric:tabular-nums}.chat-thread{display:flex;flex-direction:column;gap:.55rem;margin-bottom:.75rem}.chat-msg{padding:.55rem .7rem;border-radius:8px;background:var(--bg2);border:1px solid var(--border);font-size:.88rem;line-height:1.4}.chat-msg .who{font-size:.75rem;font-weight:700;margin-bottom:.2rem;display:flex;gap:.4rem;align-items:center}.chat-msg .who .tag{font-weight:600;color:var(--muted);text-transform:uppercase;font-size:.65rem;letter-spacing:.04em}.chat-msg.mine{border-color:#3a4a66;background:#1c2838}.chat-msg.private{border-style:dashed;border-color:var(--accent)}.chat-compose{display:flex;flex-direction:column;gap:.45rem;border-top:1px solid var(--border);padding-top:.65rem}.chat-compose .row{display:flex;gap:.4rem}.chat-compose .row select{flex:1}.chat-compose textarea{width:100%;min-height:58px;resize:vertical}.meter{height:6px;background:var(--bg2);border-radius:3px;overflow:hidden;margin-top:.15rem}.meter>i{display:block;height:100%;background:var(--accent2)}.private-box{border:1px dashed var(--accent);background:#221c10;border-radius:8px;padding:.55rem .7rem;font-size:.8rem;color:#e8d9a8;margin-bottom:.75rem;line-height:1.4}.proposal-card{border:1px solid var(--border);border-left:3px solid var(--accent2);background:var(--bg2);border-radius:8px;padding:.55rem .7rem;font-size:.82rem;line-height:1.4;margin-bottom:.55rem}.proposal-card .who{display:flex;gap:.45rem;align-items:baseline;font-weight:600;margin-bottom:.25rem}.proposal-card .who .tag{font-weight:600;color:var(--muted);text-transform:uppercase;font-size:.65rem;letter-spacing:.04em}.log-list{font-size:.82rem;color:var(--muted);display:flex;flex-direction:column;gap:.25rem}.log-list div{padding:.2rem 0;border-bottom:1px solid #243044}.waiting{color:var(--accent);font-size:.85rem}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000a6;display:flex;align-items:center;justify-content:center;z-index:50}.modal{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:1.5rem;width:min(420px,92vw);display:flex;flex-direction:column;gap:.75rem}.modal h2{font-family:Cinzel,serif;color:var(--accent)}@media(max-width:900px){.game{grid-template-columns:1fr;grid-template-rows:auto 45vh 1fr auto}.map-wrap{grid-column:1;grid-row:2}.side{grid-column:1;grid-row:3;border-left:none;border-top:1px solid var(--border)}.bottom{grid-column:1;grid-row:4}}#toasts{position:fixed;left:1rem;bottom:74px;display:flex;flex-direction:column;gap:.5rem;z-index:60;width:min(340px,calc(100vw - 2rem))}.toast{background:var(--panel2);border:1px solid var(--border);border-left:3px solid var(--accent2);border-radius:8px;padding:.55rem .7rem;font-size:.85rem;cursor:pointer;box-shadow:0 6px 18px #00000073;animation:toast-in .22s ease-out}.toast.private{border-left-color:var(--accent)}.toast.out{opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s}.toast-who{display:flex;align-items:center;gap:.4rem;margin-bottom:.2rem;font-size:.78rem}.toast-who .dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}.toast-who .tag{margin-left:auto;color:var(--muted);text-transform:uppercase;font-size:.62rem;letter-spacing:.04em}.toast-text{line-height:1.35;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}@keyframes toast-in{0%{opacity:0;transform:translate(-12px)}to{opacity:1;transform:translate(0)}}.side-tabs button{position:relative}.side-tabs .unread{position:absolute;top:4px;right:6px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--danger);color:#fff;font-size:.65rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.topbar .badge.clickable{cursor:pointer;outline:1px solid var(--accent2)}.update-banner{flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:.4rem .8rem;flex-wrap:wrap;padding:.4rem .75rem;background:linear-gradient(#3a2f12,#2a220d);border-bottom:1px solid var(--accent);color:var(--accent);font-weight:700;font-size:.9rem;text-align:center;animation:banner-slide .3s ease-out}.update-banner[hidden],.update-banner [hidden]{display:none}.update-banner .update-warn{color:var(--text);font-weight:400}.update-banner button{padding:.3rem .8rem}@keyframes banner-slide{0%{transform:translateY(-100%);opacity:0}}.whats-new{padding-left:1.2rem;line-height:1.45}.whats-new li+li{margin-top:.4rem}.version-line{text-align:center;font-size:.75rem;color:var(--muted)}.toast.notice{border-left-color:var(--accent)}.invite-panel{margin-top:.75rem;text-align:left;border-top:1px solid #ccc3;padding-top:.6rem}.invite-list{max-height:11rem;overflow:auto;margin:.4rem 0;display:flex;flex-direction:column;gap:.25rem}.invite-row{display:flex;align-items:center;gap:.5rem;cursor:pointer}