:root{--bg: #0b1020;--bg-2: #121a33;--panel: rgba(23, 32, 60, .72);--panel-solid: #16203c;--border: rgba(120, 140, 210, .18);--border-strong: rgba(120, 140, 210, .4);--text: #e8ecff;--text-dim: #9aa6d6;--accent: #ffd66b;--accent-2: #6ea8fe;--good: #35c07f;--bad: #f0616d;--radius: 14px;--shadow: 0 10px 30px rgba(0, 0, 0, .45);color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--text);background:radial-gradient(1200px 800px at 20% -10%,#1b2b57 0%,transparent 60%),radial-gradient(1000px 700px at 110% 10%,#2a1c47 0%,transparent 55%),var(--bg);overflow:hidden}button{font:inherit;cursor:pointer;color:var(--text);border:1px solid var(--border-strong);background:linear-gradient(180deg,#6ea8fe29,#6ea8fe0d);border-radius:10px;padding:10px 16px;transition:transform .08s ease,background .15s ease,border-color .15s ease,opacity .15s}button:hover:not(:disabled){background:#6ea8fe47;border-color:var(--accent-2)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:linear-gradient(180deg,#ffe08a,#f6b73c);color:#2a1c05;border-color:#f6b73c;font-weight:700}button.primary:hover:not(:disabled){background:linear-gradient(180deg,#ffe8a5,#ffc659)}button.danger{border-color:var(--bad);background:#f0616d26}button.ghost{background:transparent}input,select{font:inherit;color:var(--text);background:#0a0f2099;border:1px solid var(--border-strong);border-radius:9px;padding:9px 12px;outline:none}input:focus,select:focus{border-color:var(--accent-2)}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow)}.scroll{overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}.scroll::-webkit-scrollbar{width:8px}.scroll::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:8px}.center-screen{height:100%;display:grid;place-items:center;padding:24px}.card{width:min(920px,96vw);padding:28px}.brand{font-family:Unbounded,Georgia,serif;font-weight:800;letter-spacing:.3px;background:linear-gradient(180deg,#ffe9ad,#f4b23e);-webkit-background-clip:text;background-clip:text;color:transparent}.muted{color:var(--text-dim)}.join-code-box{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;padding:14px 18px;border-radius:12px;background:#6ea8fe1a;border:1px solid var(--border-strong)}.join-code{font-family:Unbounded,Georgia,serif;font-weight:800;font-size:34px;letter-spacing:8px;color:var(--accent);line-height:1.1}.game-grid{height:100%;display:grid;grid-template-columns:300px 1fr 320px;grid-template-rows:1fr;gap:12px;padding:12px}.col{min-height:0;display:flex;flex-direction:column;gap:12px}.board-col{position:relative;min-width:0}.board-host{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius);overflow:hidden}.board-host canvas{display:block;width:100%;height:100%;touch-action:none}.board-controls{position:absolute;right:12px;bottom:74px;display:flex;flex-direction:column;gap:6px;z-index:12}.board-controls button{width:38px;height:38px;padding:0;font-size:18px;line-height:1;border-radius:10px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hud-bar{position:absolute;left:12px;right:12px;bottom:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px 12px}.hud-top{position:absolute;left:12px;top:12px;display:flex;gap:10px;align-items:center;padding:8px 14px}.player-card{padding:12px 14px;display:flex;flex-direction:column;gap:6px;position:relative}.player-card.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset,var(--shadow)}.player-card.bankrupt{opacity:.45}.pc-head{display:flex;align-items:center;gap:8px}.dot{width:14px;height:14px;border-radius:50%;box-shadow:0 0 0 2px #ffffff4d}.pc-cash{font-variant-numeric:tabular-nums;font-weight:700}.chips{display:flex;flex-wrap:wrap;gap:4px}.chip{font-size:11px;padding:2px 8px;border-radius:999px;border:2px solid var(--border-strong);cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:5px}.chip-dot{width:11px;height:11px;border-radius:50%;flex:none;box-shadow:0 0 0 1.5px #ffffff80,0 1px 2px #0006}.chip.mortgaged{opacity:.5;text-decoration:line-through}.log{flex:1;padding:12px;font-size:13px;line-height:1.5}.log-entry{color:var(--text-dim);padding:2px 0}.chat-input{display:flex;gap:8px;padding:10px}.chat-input input{flex:1}.tabbar{display:none}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#0508128c;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:20}.modal{width:min(460px,92vw);padding:22px;text-align:center}.modal h2{margin:0 0 6px}.row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.dice-face{width:40px;height:40px;border-radius:9px;display:grid;place-items:center;background:#fff;color:#1a1a1a;font-weight:800;font-size:20px}.badge{font-size:12px;padding:3px 9px;border-radius:999px;background:#6ea8fe2e;border:1px solid var(--border-strong)}.marker-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5;overflow:hidden}.marker3d{position:absolute;transform:translate(-50%,-100%);pointer-events:none;will-change:left,top;text-align:center}.marker3d.mortgaged{opacity:.45;filter:grayscale(.7)}.marker3d:after{content:"";position:absolute;left:50%;bottom:-3px;transform:translate(-50%);width:calc(var(--sz, 30px) * .8);height:calc(var(--sz, 30px) * .28);border-radius:50%;background:radial-gradient(ellipse,var(--own, #fff) 0%,transparent 72%);opacity:.8}.marker3d-fig{display:block;width:var(--sz, 30px);height:calc(var(--sz, 30px) * 1.3);filter:drop-shadow(0 3px 3px rgba(0,0,0,.55))}.fig-svg{display:block}.marker3d-badge{position:absolute;top:-8px;left:50%;transform:translate(-50%);font-size:10px;font-weight:800;line-height:1;white-space:nowrap;padding:2px 5px;border-radius:999px;background:#0a0f20e6;color:#fff;border:1.5px solid var(--own, #fff)}.token-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:6;overflow:hidden}.token3d{position:absolute;transform:translate(-50%,-100%);pointer-events:none;will-change:left,top;text-align:center;line-height:1}.token3d-piece{display:inline-block;font-size:var(--sz, 34px);line-height:1;filter:drop-shadow(0 0 5px var(--tok-color)) drop-shadow(0 calc(var(--sz, 34px) * .12) 4px rgba(0,0,0,.55));transform-origin:bottom center;animation:tokenBob 2.4s ease-in-out infinite}@keyframes tokenBob{50%{transform:translateY(calc(var(--sz, 34px) * -.06))}}.pc-token{font-size:18px;line-height:1;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}button.timed{position:relative;overflow:hidden}button.timed .wt-secs{margin-left:8px;font-variant-numeric:tabular-nums;opacity:.8;font-weight:700}button.timed .wt-bar{position:absolute;left:0;bottom:0;height:4px;width:calc(var(--frac, 1) * 100%);background:#0006;transition:width 1s linear}button.timed.warn .wt-bar{background:var(--bad);box-shadow:0 0 8px var(--bad)}button.build-cta{border-color:var(--good);background:#35c07f29;animation:ctaPulse 1.8s ease-in-out infinite}button.build-cta:hover:not(:disabled){background:#35c07f4d}@keyframes ctaPulse{50%{box-shadow:0 0 0 3px #35c07f40}}.build-modal,.trade-modal{width:min(560px,94vw);max-height:86vh;overflow-y:auto}.build-group{margin:10px 0;padding:10px;border:1px solid var(--border);border-radius:10px}.build-group-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}.build-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:4px 0}.build-name{font-size:14px}.build-level{font-size:12px;white-space:nowrap}.build-btn{padding:6px 12px;font-size:13px}.trade-partners{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:12px}.chip.on,.trade-chip.on{background:#6ea8fe47;border-color:var(--accent-2)}.trade-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}.trade-col{border:1px solid var(--border);border-radius:10px;padding:10px}.trade-col-head{font-weight:700;text-align:center;margin-bottom:8px}.trade-cash{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.trade-cash input{width:110px}.trade-chips{display:flex;flex-direction:column;gap:6px;max-height:200px;overflow-y:auto;padding-right:4px}.trade-chips::-webkit-scrollbar{width:8px}.trade-chips::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:8px}.trade-chip{text-align:left;font-size:12px;padding:5px 8px;border-radius:8px;border:1px solid var(--border-strong);background:#ffffff08}@media (max-width: 560px){.trade-cols{grid-template-columns:1fr}}.dice-roll-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;align-content:center;gap:12px;pointer-events:none;z-index:25}.dice-roll{display:flex;gap:18px;animation:diceDrop .25s ease-out}@keyframes diceDrop{0%{opacity:0;transform:translateY(-24px) scale(.7)}to{opacity:1;transform:none}}.die{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:62px;height:62px;padding:8px;box-sizing:border-box;background:linear-gradient(150deg,#fff,#dfe4f2);border-radius:14px;box-shadow:0 12px 24px #00000080,inset 0 2px 3px #ffffffe6,inset 0 -3px 4px #00000026}.die.rolling{animation:diceTumble .28s linear infinite}.die.landed{animation:diceLand .35s cubic-bezier(.2,1.4,.4,1)}@keyframes diceTumble{0%{transform:rotate(-14deg) scale(.94)}50%{transform:rotate(12deg) scale(1.06)}to{transform:rotate(-14deg) scale(.94)}}@keyframes diceLand{0%{transform:scale(1.25) rotate(6deg)}to{transform:scale(1) rotate(0)}}.die-cell{display:grid;place-items:center}.pip{width:11px;height:11px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#4a5170,#14172a)}.dice-total{font-family:Unbounded,Georgia,serif;font-weight:800;font-size:20px;color:var(--accent);text-shadow:0 2px 10px rgba(0,0,0,.6);animation:diceDrop .3s ease-out}.center-card-wrap{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none;z-index:15}.center-card{pointer-events:auto;width:min(320px,74%);padding:20px 22px 22px;text-align:center;border-radius:18px;background:linear-gradient(180deg,#1c2646f5,#10172cf5);border:1px solid var(--card-accent, var(--accent-2));box-shadow:0 24px 60px #0009,0 0 0 1px #ffffff0a inset,0 0 30px color-mix(in srgb,var(--card-accent, var(--accent-2)) 35%,transparent);animation:cardIn .42s cubic-bezier(.2,.9,.25,1.1)}@keyframes cardIn{0%{opacity:0;transform:translateY(10px) rotateX(35deg) scale(.9)}to{opacity:1;transform:none}}.center-card-deck{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;padding:4px 12px;border-radius:999px;color:var(--card-accent, var(--accent-2));background:color-mix(in srgb,var(--card-accent, var(--accent-2)) 16%,transparent);border:1px solid color-mix(in srgb,var(--card-accent, var(--accent-2)) 45%,transparent)}.center-card-icon{font-size:40px;margin:10px 0 6px}.center-card-text{margin:6px 0 12px;font-size:15px;line-height:1.5}.center-card-who{font-size:12px;color:var(--text-dim);margin-bottom:14px}.deed{position:relative;padding-top:30px;text-align:left}.deed-bar{position:absolute;top:0;left:0;right:0;height:16px;border-radius:14px 14px 0 0;box-shadow:inset 0 -1px #00000040}.deed h2{text-align:center}.deed-rows{display:flex;flex-direction:column;gap:2px}.deed-row{display:flex;justify-content:space-between;gap:12px;padding:4px 10px;border-radius:7px;font-size:13px}.deed-row:nth-child(odd){background:#ffffff0a}.deed-row b{font-variant-numeric:tabular-nums}.deed-owed{margin-top:10px;padding:8px 10px;border-radius:9px;text-align:center;background:#f0616d29;border:1px solid rgba(240,97,109,.4)}.timer{display:inline-flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums}.timer .ring{width:10px;height:10px;border-radius:50%;background:var(--good)}.timer.warn{color:var(--bad)}.timer.warn .ring{background:var(--bad);animation:pulse 1s ease-in-out infinite}@keyframes pulse{50%{opacity:.35}}.turn-indicator{display:flex;align-items:center;gap:8px}.spin{width:12px;height:12px;border:2px solid var(--accent-2);border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 960px){.game-grid{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr) auto}.side-col{max-height:26vh}.board-col{min-height:40vh}}
