:root{--bg: #0f1a12;--panel: #182a1d;--panel-2: #21361f;--ink: #e8ecdf;--muted: #9fae94;--border: #3a5236;--input-bg: #10200f;--accent: #e8a33d;--accent-ink: #2a1c05;--danger: #d64545;--ok: #4caf50;--highlight: #3d4f24;--space-1: .25rem;--space-2: .5rem;--space-3: .8rem;--space-4: 1rem;--space-5: 1.5rem;--radius: 10px;--radius-sm: 8px;--font: system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;font-size:16px}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}#app,.app{min-height:100vh;display:flex;flex-direction:column}a{color:var(--accent)}.mono{font-family:var(--font-mono)}button,.btn{font:inherit;color:var(--ink);background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.45rem .8rem;cursor:pointer;text-decoration:none;display:inline-block}button:disabled,.btn:disabled{opacity:.45;cursor:default}button.primary,.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff;font-weight:600}.btn.small{padding:.25rem .55rem;font-size:.85rem}.btn.wide{width:100%}button.armed,.choice-btn.armed{outline:2px solid var(--accent);background:var(--highlight)}.icon-btn{padding:.3rem .55rem;font-size:1.1rem}input,select,textarea{font:inherit;color:var(--ink);background:var(--input-bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.45rem .6rem;width:100%}textarea{min-height:4rem;font-family:var(--font-mono)}input.mono{font-family:var(--font-mono)}label,.field{display:block;margin:var(--space-2) 0;font-size:.9rem}.muted{color:var(--muted)}.form-error{color:var(--danger);font-size:.9rem;margin:var(--space-2) 0}.row{display:flex;gap:var(--space-2);align-items:center}.row input{flex:1}.sep{border:none;border-top:1px solid var(--border);margin:var(--space-4) 0}.nav{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap;position:sticky;top:0;z-index:20}.nav-brand{font-weight:700;letter-spacing:.02em}.nav-links{display:flex;gap:var(--space-1);flex-wrap:wrap;flex:1}.nav-link{color:var(--muted);text-decoration:none;padding:.3rem .6rem;border-radius:var(--radius-sm)}.nav-link:hover{color:var(--ink);background:var(--panel-2)}.nav-link.active{color:var(--accent-ink);background:var(--accent);font-weight:600}.nav-user{color:var(--muted);font-size:.85rem}.page,.home{max-width:560px;width:100%;margin:0 auto;padding:var(--space-4)}.page-wide{max-width:760px}.home-header{display:flex;justify-content:space-between;align-items:center}.home-header h1{margin:.4rem 0}.card{background:var(--panel);border-radius:var(--radius);padding:var(--space-3);margin:var(--space-3) 0}.card h2{margin:0 0 var(--space-2);font-size:1.05rem}.card-danger{border:1px solid var(--danger)}.game-row{display:flex;justify-content:space-between;align-items:center;gap:var(--space-2);padding:.4rem 0;border-bottom:1px solid var(--highlight);flex-wrap:wrap}.game-row:last-child{border-bottom:none}.auth-page{max-width:420px;margin-top:6vh}.auth-title{text-align:center;margin:0 0 var(--space-2)}.auth-alt{margin:var(--space-3) 0 0;font-size:.88rem}.key-reveal{text-align:center}.key-box{font-size:1.15rem;word-break:break-all;background:var(--input-bg);border:1px dashed var(--accent);border-radius:var(--radius-sm);padding:var(--space-3);margin:var(--space-3) 0;user-select:all}.key-warning{color:var(--accent);font-weight:600;margin:var(--space-3) 0}.avatar{border-radius:50%;object-fit:cover;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}.avatar-sm{width:1.8rem;height:1.8rem}.avatar-lg{width:4.5rem;height:4.5rem;font-size:1.8rem}.avatar-ph{background:var(--panel-2);border:1px solid var(--border);color:var(--muted);font-weight:700}.avatar-picker{display:flex;align-items:center;gap:var(--space-3);margin:var(--space-2) 0}.avatar-picker-controls{flex:1}.profile-card{display:flex;align-items:center;gap:var(--space-4)}.profile-name{margin:0}.table-wrap{overflow-x:auto}.table{width:100%;border-collapse:collapse;font-size:.92rem}.table th,.table td{text-align:left;padding:.4rem .5rem;border-bottom:1px solid var(--highlight)}.table th{color:var(--muted);font-weight:600;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em}.table .num{text-align:right;font-variant-numeric:tabular-nums}.table tr:last-child td{border-bottom:none}.table .row-me td{background:var(--highlight)}.stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--space-2)}.stat{background:var(--panel-2);border-radius:var(--radius-sm);padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-1)}.stat-value{font-size:1.4rem;font-weight:700;font-variant-numeric:tabular-nums}.stat-label{color:var(--muted);font-size:.82rem}.badge{display:inline-block;padding:.1rem .5rem;border-radius:999px;font-size:.78rem;font-weight:600;background:var(--panel-2);border:1px solid var(--border)}.badge-gold{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.badge-dim{color:var(--muted)}.replay-info{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}.replay-date{min-width:6.5rem}.roster{list-style:none;padding:0;margin:var(--space-2) 0}.roster li{padding:.3rem 0;display:flex;align-items:center;gap:var(--space-2)}.color-dot{display:inline-block;width:.85rem;height:.85rem;border-radius:50%;border:1px solid #0006;flex-shrink:0}.conn-banner{background:var(--danger);color:#fff;text-align:center;padding:.35rem;font-size:.9rem;position:sticky;top:0;z-index:30}.toasts{position:fixed;bottom:var(--space-3);left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:.4rem;z-index:50;width:min(92vw,420px)}.toast{background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);box-shadow:0 4px 14px #0008}.toast-error{border-color:var(--danger);background:#3a1717}.game-room{display:flex;flex-direction:column;flex:1;min-height:100vh}.game-header{display:flex;align-items:center;gap:var(--space-3);padding:.4rem .7rem;background:var(--panel)}.game-code{font-weight:700;letter-spacing:.08em}.phase{flex:1;font-size:.9rem;color:var(--muted);text-transform:capitalize}.dice{font-size:.95rem}.game-layout{display:flex;flex-direction:column;flex:1;min-height:0}.board-wrap{flex:1 1 auto;min-height:44vh;display:flex}.board{width:100%;height:100%;max-height:62vh;touch-action:manipulation}.side-panel{background:var(--panel);padding:.6rem;display:flex;flex-direction:column;gap:.6rem;overflow-y:auto}@media(min-width:900px){.game-layout{flex-direction:row}.board-wrap{flex:1}.board{max-height:calc(100vh - 3rem)}.side-panel{width:360px;flex-shrink:0;max-height:calc(100vh - 3rem)}}.hex{stroke:#10200f;stroke-width:2.5}.num-token{fill:#f2e8c9;stroke:#6b5b32}.num-text{text-anchor:middle;font-size:15px;font-weight:700;fill:#333}.num-hot{fill:#c0392b}.port-circle{fill:#f2e8c9;stroke:#6b5b32}.port-text{text-anchor:middle;font-size:10px;font-weight:700;fill:#333;text-transform:uppercase}.port-tie{stroke:#6b5b32;stroke-width:2;stroke-dasharray:3 3}.road{stroke-width:7;stroke-linecap:round}.settlement,.city{stroke:#10200f;stroke-width:1.5}.city-wall{fill:none;stroke:#d8d3c0;stroke-width:3}.metropolis{text-anchor:middle;font-size:16px;fill:gold;stroke:#6b5b32;stroke-width:.5}.knight{stroke:#10200f;stroke-width:1.5}.knight-active{stroke:#fff;stroke-width:2.5}.knight-pip{fill:#10200f}.knight-active-dot{fill:var(--ok);stroke:#10200f;stroke-width:1}.robber{fill:#222;stroke:#eee;stroke-width:1.5}.robber-text{text-anchor:middle;font-size:12px;font-weight:700;fill:#eee}.merchant{fill:var(--accent);stroke:#6b5b32}.merchant-text{text-anchor:middle;font-size:11px;font-weight:700;fill:#2a1c05}.pick-node{fill:#fff5;stroke:var(--accent);stroke-width:2.5;pointer-events:none;animation:pulse 1.2s ease-in-out infinite}.pick-selected{fill:var(--accent)}.hit-node{fill:transparent;cursor:pointer}.pick-edge{stroke:var(--accent);stroke-width:8;stroke-linecap:round;opacity:.85;pointer-events:none;animation:pulse 1.2s ease-in-out infinite}.hit-edge{stroke:transparent;stroke-width:24;stroke-linecap:round;cursor:pointer}.pick-hex{fill:#ffffff2e;stroke:var(--accent);stroke-width:3;cursor:pointer;animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.55}50%{opacity:1}}.players-strip{display:flex;flex-direction:column;gap:var(--space-1)}.player-row{display:flex;align-items:center;gap:.45rem;padding:.3rem .45rem;border-radius:var(--radius-sm);background:var(--panel-2);font-size:.88rem}.player-current{outline:2px solid var(--accent)}.player-name{font-weight:600}.player-stats{flex:1;text-align:right;color:var(--muted);font-size:.82rem}.player-clock{font-variant-numeric:tabular-nums;color:var(--accent);font-weight:700}.conn-dot{width:.5rem;height:.5rem;border-radius:50%;background:#666;flex-shrink:0}.conn-on{background:var(--ok)}.hand-panel .chips,.chips{display:flex;flex-wrap:wrap;gap:.35rem}.chip{padding:.2rem .5rem;border-radius:999px;font-size:.8rem;font-weight:600;color:#10200f;border:1px solid #0005}.cards-line{font-size:.82rem;color:var(--muted);margin-top:.3rem}.action-bar{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.action-btn{font-size:.88rem}.action-btn.cancel{border-color:var(--danger)}.action-group{display:inline-flex;flex-wrap:wrap;gap:.3rem;align-items:center;background:var(--panel-2);border-radius:var(--radius-sm);padding:.2rem .35rem}.action-label{font-size:.82rem;color:var(--muted)}.choice-btn{font-size:.82rem;padding:.25rem .55rem}.inline-choices{display:inline-flex;gap:.3rem}.trade-panel h3{margin:0 0 .4rem;font-size:.95rem}.trade-card{background:var(--panel-2);border-radius:var(--radius-sm);padding:var(--space-2);margin-bottom:.4rem;font-size:.86rem}.trade-responses{display:flex;gap:.6rem;margin:var(--space-1) 0;font-size:.8rem}.resp-yes{color:var(--ok)}.resp-no{color:var(--danger)}.trade-actions{display:flex;flex-wrap:wrap;gap:.3rem}.event-log{font-size:.8rem;color:var(--muted);max-height:30vh;overflow-y:auto;border-top:1px solid var(--highlight);padding-top:.4rem}.log-line{padding:.12rem 0}.dialog-overlay{position:fixed;inset:0;background:#000a;display:flex;align-items:center;justify-content:center;z-index:40;padding:var(--space-4)}.dialog-overlay.minimized{pointer-events:none;opacity:.15}.dialog-box{background:var(--panel);border-radius:var(--radius);padding:var(--space-4);width:min(94vw,460px);max-height:86vh;overflow-y:auto;position:relative}.dialog-close{position:absolute;top:.4rem;right:.4rem;padding:.15rem .5rem}.dialog h3{margin:0 0 .6rem}.dialog-actions{display:flex;gap:var(--space-2);margin-top:var(--space-3)}.stepper{display:flex;align-items:center;gap:var(--space-2);padding:.15rem 0}.stepper-label{flex:1;text-transform:capitalize}.stepper-value{min-width:1.4rem;text-align:center;font-variant-numeric:tabular-nums}.stepper button{padding:.1rem .6rem}.trade-columns{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.trade-columns h4{margin:.2rem 0}.param-form label{margin:.4rem 0}.standings{font-size:1.05rem;line-height:1.7}.checkbox-row{flex-direction:row;align-items:center;gap:var(--space-2)}.checkbox-row input[type=checkbox]{width:auto}.devtools-toggle{align-self:flex-start;opacity:.6;font-size:.8rem}.devtools-toggle:hover{opacity:1}.devtools{border:1px dashed var(--accent);display:flex;flex-direction:column;gap:var(--space-2)}.devtools-head{justify-content:space-between}.row.wrap{flex-wrap:wrap}