:root{--bg:#14161b;--panel:#1d2027;--panel-2:#252932;--border:#323743;--text:#e8e9ec;--muted:#9097a5;--accent:#d8b56a;--accent-ink:#1a1408;--danger:#e5484d;--ok:#30a46c;--radius:10px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#app{min-height:100%}h1,h2,h3{margin:0 0 .5em;line-height:1.2}h2{letter-spacing:.01em;font-size:1.05rem}a{color:var(--accent)}.muted{color:var(--muted)}.small{font-size:.85rem}button,input,select{font:inherit;color:inherit}button{cursor:pointer;border:1px solid var(--border);background:var(--panel-2);border-radius:8px;padding:.5em .9em;transition:background .12s,border-color .12s}button:hover:not(:disabled){background:#2c313c;border-color:#4a5160}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}button.primary:hover:not(:disabled){background:#e6c47c;border-color:#e6c47c}button.danger{color:#ff9b9e;border-color:#5a2a2c}button.link{color:var(--accent);background:0 0;border:none;padding:0;text-decoration:underline}input[type=text],input[type=password]{background:var(--bg);border:1px solid var(--border);border-radius:8px;width:100%;padding:.55em .75em}input:focus,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.row{align-items:center;gap:.5rem;display:flex}.stack>*+*{margin-top:.75rem}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:1.1rem 1.2rem}.page{max-width:980px;margin:0 auto;padding:2rem 16px 3rem}.brand{align-items:baseline;gap:.75rem;margin-bottom:1.5rem;display:flex}.brand h1{letter-spacing:-.02em;margin:0;font-size:2rem}.brand h1 span{color:var(--accent)}.grid-2{grid-template-columns:1fr 1fr;gap:1rem;display:grid}@media (width<=720px){.grid-2{grid-template-columns:1fr}}.tabs{gap:.25rem;margin-bottom:.9rem;display:flex}.tabs button{flex:1}.tabs button.active{border-color:var(--accent);color:var(--accent)}.wallet{gap:1rem;display:flex}.wallet div{background:var(--panel-2);border-radius:8px;flex:1;padding:.6rem .8rem}.wallet b{font-size:1.3rem;display:block}.rules{color:var(--muted);margin:0;padding-left:1.1rem}.rules li+li{margin-top:.3rem}.rules b{color:var(--text)}.room-code{letter-spacing:.15em;color:var(--accent);font-variant-numeric:tabular-nums;font-size:2.2rem;font-weight:700}.players{margin:0;padding:0;list-style:none}.players li{border-bottom:1px solid var(--border);align-items:center;gap:.6rem;padding:.55rem 0;display:flex}.players li:last-child{border-bottom:none}.dot{border-radius:50%;flex:none;width:12px;height:12px}.tag{background:var(--panel-2);border:1px solid var(--border);color:var(--muted);border-radius:99px;padding:.1em .5em;font-size:.72rem}.tag.ok{color:#7ee2a8;border-color:#2a5a40}.races{grid-template-columns:repeat(2,1fr);gap:.6rem;display:grid}@media (width<=520px){.races{grid-template-columns:1fr}}.race{text-align:left;background:var(--panel-2);padding:.75rem .85rem}.race.selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.race b{display:block}.race ul{color:var(--muted);margin:.35rem 0 0;padding-left:1rem;font-size:.85rem}.game{grid-template-columns:1fr 330px;height:100dvh;display:grid}.board-wrap{min-width:0;min-height:0;position:relative;overflow:hidden}.board-wrap canvas{touch-action:none;width:100%;height:100%;position:absolute;inset:0}.overlay{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.overlay .count{color:var(--accent);text-shadow:0 4px 30px #0009;font-size:7rem;font-weight:800}.overlay .result{pointer-events:auto;border:1px solid var(--border);background:#14161bf5;border-radius:14px;max-width:min(760px,100% - 32px);max-height:calc(100% - 32px);padding:1.4rem 1.5rem;overflow:auto}.result table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:.88rem}.result th,.result td{text-align:right;border-bottom:1px solid var(--border);white-space:nowrap;padding:.35rem .5rem}.result th:first-child,.result td:first-child{text-align:left}.hud{background:var(--panel);border-left:1px solid var(--border);flex-direction:column;gap:.9rem;padding:.9rem;display:flex;overflow-y:auto}.hud section{background:var(--panel-2);border-radius:8px;padding:.7rem .75rem}.hud h3{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:.5rem;font-size:.72rem}.gold{font-variant-numeric:tabular-nums;color:var(--accent);font-size:1.9rem;font-weight:700;line-height:1.1}.bar{background:var(--bg);border-radius:3px;height:5px;margin-top:.4rem;overflow:hidden}.bar>div{background:var(--accent);height:100%}.kv{font-variant-numeric:tabular-nums;justify-content:space-between;font-size:.86rem;display:flex}.kv span:first-child{color:var(--muted)}.score{grid-template-columns:12px 1fr auto;align-items:center;gap:.15rem .5rem;font-size:.88rem;display:grid}.score+.score{margin-top:.55rem}.score .bar{grid-column:2/4;margin-top:0}.score .me{font-weight:700}.score .sub{color:var(--muted);grid-column:2/4;font-size:.75rem}.modes{grid-template-columns:1fr;gap:.4rem;display:grid}.modes button{text-align:left;justify-content:space-between;align-items:center;font-size:.88rem;display:flex}.modes button.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}kbd{border:1px solid var(--border);color:var(--muted);border-radius:4px;padding:0 .35em;font:.72rem ui-monospace,monospace}.tile-info{min-height:4.5em;font-size:.85rem}.tile-info .bad{color:#ff9b9e}.tile-info .good{color:#7ee2a8}.log{max-height:170px;margin:0;padding:0;font-size:.8rem;list-style:none;overflow-y:auto}.log li{border-bottom:1px solid #ffffff0a;padding:.2rem 0}.log li.alert{color:#ffb27a}@media (width<=760px){.game{grid-template-rows:58vh auto;grid-template-columns:1fr;height:auto}.hud{border-left:none;border-top:1px solid var(--border)}}#toasts{z-index:50;pointer-events:none;flex-direction:column;gap:.4rem;width:max-content;max-width:calc(100% - 32px);display:flex;position:fixed;bottom:1.2rem;left:50%;transform:translate(-50%)}.toast{color:#ffd1d2;background:#2c1d1f;border:1px solid #5a2a2c;border-radius:8px;padding:.5rem .9rem;font-size:.9rem;animation:.15s ease-out toast-in}.toast.info{color:#c9f2d8;background:#1d2a22;border-color:#2a5a40}@keyframes toast-in{0%{opacity:0;transform:translateY(6px)}}table.stats{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:.9rem}table.stats td,table.stats th{border-bottom:1px solid var(--border);text-align:left;padding:.35rem .4rem}table.stats td:last-child,table.stats th:last-child{text-align:right}.stat-tiles{grid-template-columns:repeat(4,1fr);gap:.6rem;display:grid}@media (width<=600px){.stat-tiles{grid-template-columns:repeat(2,1fr)}}.stat-tiles div{background:var(--panel-2);border-radius:8px;padding:.6rem .75rem}.stat-tiles b{font-variant-numeric:tabular-nums;font-size:1.35rem;display:block}.skill-tree{flex-direction:column;gap:.45rem;display:flex}.branch{grid-template-columns:repeat(2,1fr);gap:.3rem;display:grid}.branch-name{color:var(--muted);grid-column:1/-1;font-size:.72rem;font-weight:600}.skill{text-align:left;white-space:nowrap;text-overflow:ellipsis;color:var(--muted);padding:.3rem .3rem .3rem .35rem;font-size:.75rem;line-height:1.2;position:relative;overflow:hidden}.skill .tier{opacity:.7;margin-right:.35em;font-weight:700}.skill[aria-disabled=true]{cursor:default;opacity:.5}.skill.owned{opacity:1;border-color:var(--ok);color:#cfeedd;background:#1c2e24}.skill.available{border-color:var(--accent);color:var(--text)}.skill-detail{min-height:2.6em;margin:.55rem 0 0}.skills-panel.has-points{box-shadow:inset 0 0 0 1px var(--accent)}.settings{grid-template-columns:auto 1fr;align-items:center;gap:.5rem .75rem;display:grid}.settings select{background:var(--bg);border:1px solid var(--border);border-radius:8px;width:100%;padding:.4em .6em}.map-preview{background:var(--bg);border-radius:8px;justify-content:center;align-items:center;min-height:150px;padding:.5rem;display:flex}.map-preview canvas{max-width:100%;image-rendering:pixelated}
