:root{--bg:#07111f;--panel:rgba(12,27,46,.88);--line:rgba(255,255,255,.09);--text:#f5f7fb;--muted:#8fa0b7;--green:#39d98a;--green2:#1fbf75;--red:#ff6b6b;--gold:#f7c85e}
*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{font-family:Inter,system-ui,sans-serif;color:var(--text);background:radial-gradient(circle at 15% 15%,rgba(35,111,190,.18),transparent 30%),radial-gradient(circle at 80% 30%,rgba(28,188,122,.10),transparent 28%),linear-gradient(160deg,#071324,#112238 55%,#0d1a2b);min-height:100vh}button,input{font:inherit}button{cursor:pointer}.hidden{display:none!important}
.app-shell{width:min(1580px,calc(100% - 28px));margin:auto;padding:18px 0 34px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.brand{display:flex;gap:12px;align-items:center}.brand-mark{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,var(--green),#158d5a);color:#04140d;font-weight:900}.brand-title{font-weight:900;letter-spacing:.08em;font-size:15px}.brand-subtitle{font-size:11px;color:var(--muted);margin-top:3px}.top-actions{display:flex;align-items:center;gap:8px}.connection-dot{width:8px;height:8px;border-radius:50%;background:#6b7787;box-shadow:0 0 0 4px rgba(255,255,255,.03)}.connection-dot.online{background:var(--green);box-shadow:0 0 0 4px rgba(57,217,138,.09)}.room-code-btn,.ghost-btn,.icon-btn{border:1px solid var(--line);background:rgba(255,255,255,.055);color:var(--text);border-radius:11px}.room-code-btn,.ghost-btn{padding:9px 12px;font-size:11px}.room-code-btn{font-weight:800;letter-spacing:.1em}.icon-btn{width:38px;height:38px}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:16px;align-items:start}.board-panel{min-width:0;background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:25px;padding:16px;box-shadow:0 24px 70px rgba(0,0,0,.28)}.board-wrap{position:relative;width:100%;aspect-ratio:1/1;max-height:calc(100vh - 112px);margin:auto}.board{width:100%;height:100%;display:grid;grid-template-columns:1.45fr repeat(9,1fr) 1.45fr;grid-template-rows:1.45fr repeat(9,1fr) 1.45fr;gap:2px;background:#15243a;padding:2px;border-radius:20px;overflow:hidden}.tile{position:relative;min-width:0;min-height:0;background:#f3f0e7;color:#18202b;overflow:hidden;user-select:none}.tile.corner{display:flex;align-items:center;justify-content:center;text-align:center;font-weight:900;padding:7px;font-size:clamp(8px,.9vw,13px)}.tile-icon{font-size:clamp(18px,2vw,34px);display:block;margin-bottom:4px}.tile-inner{width:100%;height:100%;display:flex;flex-direction:column}.color-bar{height:24%;flex:0 0 auto;border-bottom:1px solid rgba(0,0,0,.15)}.tile-content{padding:5px 3px;text-align:center;display:flex;flex-direction:column;justify-content:space-between;flex:1;gap:2px}.tile-name{font-size:clamp(7px,.7vw,10.5px);line-height:1.05;font-weight:800;text-transform:uppercase;overflow-wrap:anywhere}.tile-price{font-size:clamp(7px,.62vw,9px);font-weight:700;opacity:.65}.owner-dot{position:absolute;right:4px;bottom:4px;width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.85)}
.pawn-stack{position:absolute;right:4px;bottom:4px;display:flex;gap:3px;z-index:4;flex-wrap:wrap;justify-content:flex-end;max-width:96%}.pawn{width:clamp(24px,2.2vw,34px);height:clamp(24px,2.2vw,34px);border-radius:50%;border:2px solid white;display:grid;place-items:center;font-size:clamp(13px,1.35vw,19px);box-shadow:0 4px 12px rgba(0,0,0,.38);background:#fff}
.board-center{position:absolute;left:13.7%;right:13.7%;top:13.7%;bottom:13.7%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none}.center-badge{width:min(220px,36%);aspect-ratio:2.6/1;display:grid;place-items:center;background:rgba(57,217,138,.09);border:1px solid rgba(57,217,138,.25);color:var(--green);font-weight:900;letter-spacing:.14em;font-size:clamp(10px,1.35vw,20px);transform:rotate(-8deg);border-radius:12px;margin-bottom:clamp(10px,2vw,28px)}.turn-label{color:var(--muted);font-size:clamp(8px,.85vw,12px)}.turn-player{font-weight:900;font-size:clamp(16px,2vw,30px);margin-top:3px}.center-hint{color:var(--muted);margin-top:8px;font-size:clamp(8px,.75vw,11px);max-width:260px}
.dice-surface{position:relative;width:190px;height:92px;margin:8px 0 10px;perspective:500px;pointer-events:none;background:radial-gradient(ellipse at center,rgba(255,255,255,.055),transparent 67%);border-bottom:1px solid rgba(255,255,255,.06)}.real-die{position:absolute;top:25px;width:54px;height:54px;border-radius:12px;background:linear-gradient(145deg,#fff,#dfe4ea);color:#101827;display:grid;place-items:center;box-shadow:inset -5px -7px 10px rgba(20,28,40,.13),inset 3px 3px 7px rgba(255,255,255,.8),0 12px 18px rgba(0,0,0,.3);transform-style:preserve-3d;will-change:transform}#die1{left:33px;transform:rotateX(12deg) rotateY(-12deg)}#die2{right:33px;transform:rotateX(-8deg) rotateY(15deg)}.die-glyph{font-size:42px;line-height:1}.dice-shadow{position:absolute;width:47px;height:14px;border-radius:50%;background:rgba(0,0,0,.25);filter:blur(6px);top:70px}.shadow-one{left:36px}.shadow-two{right:36px}
.roll-btn,.primary-btn,.secondary-btn{border:0;border-radius:12px;padding:11px 13px}.roll-btn,.primary-btn{background:linear-gradient(135deg,var(--green),var(--green2));color:#052015;font-weight:900}.roll-btn{pointer-events:auto;padding:11px 17px;box-shadow:0 10px 28px rgba(57,217,138,.2)}.roll-btn:disabled{opacity:.38;cursor:not-allowed}.secondary-btn{background:rgba(255,255,255,.055);color:var(--text);border:1px solid var(--line)}
.side-panel{display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 92px);overflow:auto;padding-right:2px}.card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:15px;box-shadow:0 16px 45px rgba(0,0,0,.16);backdrop-filter:blur(14px)}.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.section-kicker{color:var(--green);font-weight:800;font-size:8px;letter-spacing:.18em}h2{margin:4px 0 0;font-size:18px}.turn-chip,.online-count{padding:6px 8px;border-radius:8px;background:rgba(255,255,255,.055);color:var(--muted);font-size:9px}
.avatar{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:21px;background:rgba(255,255,255,.07);border:1px solid var(--line)}.small-avatar{width:42px;height:42px}.cabinet-money{display:flex;align-items:end;justify-content:space-between;padding:12px;border-radius:14px;background:linear-gradient(135deg,rgba(57,217,138,.1),rgba(255,255,255,.025));border:1px solid rgba(57,217,138,.14)}.cabinet-money span{color:var(--muted);font-size:10px}.cabinet-money strong{font-size:24px}.asset-title{margin:11px 0 7px;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.12em}.asset-list,.player-assets{display:flex;gap:5px;flex-wrap:wrap}.asset-chip{font-size:8px;padding:5px 7px;border-radius:7px;background:rgba(255,255,255,.055);border:1px solid var(--line)}.empty-assets{font-size:9px;color:#65758b}
.players-list{display:flex;flex-direction:column;gap:7px}.player-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:9px;align-items:center;padding:9px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid transparent}.player-row.active{background:rgba(57,217,138,.07);border-color:rgba(57,217,138,.26)}.player-row.me{box-shadow:inset 3px 0 0 var(--green)}.player-row.bankrupt{opacity:.45}.player-info{min-width:0}.player-name{font-size:12px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-meta{font-size:9px;color:var(--muted);margin-top:2px}.player-money{font-size:12px;font-weight:900}.player-assets{grid-column:2/4;margin-top:-2px}
.media-tabs{display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:11px;background:rgba(255,255,255,.035);margin-bottom:12px}.media-tab{border:0;border-radius:8px;padding:8px;background:transparent;color:var(--muted);font-size:10px;font-weight:700}.media-tab.active{background:rgba(255,255,255,.08);color:var(--text)}.radio-now,.voice-status{display:flex;gap:10px;align-items:center}.radio-icon,.voice-orb{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(57,217,138,.1);color:var(--green);font-weight:900}.radio-now strong,.voice-status strong{display:block;font-size:11px}.radio-now span,.voice-status span{display:block;color:var(--muted);font-size:9px;margin-top:3px}.radio-search-row{display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:10px}.radio-search-row input,.chat-compose input,.name-input{min-width:0;background:#07111f;border:1px solid var(--line);color:var(--text);border-radius:10px;padding:9px 10px;outline:none}.radio-search-row button{border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--text);border-radius:10px;font-size:10px;padding:0 10px}.radio-results{max-height:160px;overflow:auto;margin-top:6px;border:1px solid var(--line);border-radius:11px}.radio-result{padding:8px 10px;border-bottom:1px solid var(--line);cursor:pointer}.radio-result:last-child{border-bottom:0}.radio-result strong{display:block;font-size:10px}.radio-result span{display:block;color:var(--muted);font-size:8px;margin-top:2px}.radio-controls{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;margin-top:9px}.radio-controls input{width:100%}.voice-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:11px}.voice-actions .primary-btn,.voice-actions .secondary-btn{font-size:10px;padding:9px}
.event-box{display:flex;gap:10px;padding:11px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.04)}.event-icon{font-size:21px}.event-title{font-size:11px;font-weight:800}.event-text{font-size:9px;line-height:1.45;color:var(--muted);margin-top:3px}.property-action{margin-top:10px}.property-preview{display:flex;gap:9px;align-items:center;margin-bottom:9px}.property-color{width:7px;height:36px;border-radius:5px}.property-preview div:last-child{display:flex;flex-direction:column;gap:2px}.property-preview strong{font-size:11px}.property-preview span{font-size:9px;color:var(--muted)}.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.chat-card{min-height:340px}.chat-messages{height:320px;overflow:auto;display:flex;flex-direction:column;gap:10px;padding-right:3px;scroll-behavior:smooth}.chat-empty{margin:auto;color:#65758b;font-size:13px}.chat-message{display:grid;grid-template-columns:36px 1fr;gap:9px}.chat-message.mine .chat-bubble{background:rgba(57,217,138,.1);border-color:rgba(57,217,138,.18)}.chat-avatar{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.06);font-size:19px}.chat-head{display:flex;justify-content:space-between;gap:8px;margin-bottom:4px}.chat-head strong{font-size:12px}.chat-head span{font-size:9px;color:#637185}.chat-bubble{border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:8px 14px 14px 14px;padding:9px 10px;font-size:13px;line-height:1.5;overflow:hidden}.chat-photo{display:block;max-width:100%;max-height:220px;border-radius:8px;margin-top:7px;cursor:pointer}.chat-compose{display:grid;grid-template-columns:34px 34px minmax(0,1fr) 38px;gap:6px;margin-top:12px}.compose-icon,.send-btn{border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.055);color:var(--text)}.send-btn{background:var(--green);color:#052015;border:0;font-weight:900}.emoji-panel{display:flex;flex-wrap:wrap;gap:4px;padding:8px;background:#091524;border:1px solid var(--line);border-radius:10px;margin-top:7px}.emoji-panel button{width:32px;height:32px;border:0;background:transparent;font-size:17px;border-radius:7px}.emoji-panel button:hover{background:rgba(255,255,255,.07)}
.modal{border:0;padding:0;background:transparent;color:var(--text);width:min(650px,calc(100% - 24px))}.modal::backdrop{background:rgba(0,5,12,.78);backdrop-filter:blur(7px)}.modal-card{background:#0d1a2b;border:1px solid var(--line);border-radius:23px;padding:20px;box-shadow:0 30px 90px rgba(0,0,0,.5)}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.modal-head p{color:var(--muted);font-size:10px;line-height:1.5;margin:6px 0 0}.field-label{display:block;color:var(--muted);font-size:9px;margin-top:11px}.field-label input{display:block;width:100%;margin-top:6px}.join-avatars{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;margin-top:6px}.join-avatar{height:42px;border-radius:11px;border:1px solid var(--line);background:rgba(255,255,255,.04);font-size:20px}.join-avatar.selected{border-color:var(--green);background:rgba(57,217,138,.1)}.code-input{text-transform:uppercase;letter-spacing:.16em;font-weight:800}.join-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}.join-error{min-height:14px;color:#ff8d8d;font-size:9px;margin-top:7px}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.rule-item{display:flex;gap:9px;padding:11px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.03)}.rule-item p{font-size:9px;color:var(--muted);line-height:1.5;margin:3px 0 0}.rule-item strong{font-size:11px}
@media(max-width:1120px){.layout{grid-template-columns:1fr}.side-panel{max-height:none;display:grid;grid-template-columns:1fr 1fr}.chat-card{grid-column:1/-1}.board-wrap{max-height:none}}
@media(max-width:700px){.app-shell{width:calc(100% - 12px);padding-top:8px}.brand-subtitle{font-size:9px}.room-code-btn{font-size:9px;padding:8px 9px}.board-panel{padding:5px;border-radius:15px}.board{gap:1px;padding:1px;border-radius:12px}.board-wrap{min-height:calc(100vw - 22px)}.tile-content{padding:2px 1px}.tile-name{font-size:5.2px}.tile-price{font-size:4.8px}.pawn{width:20px;height:20px;font-size:11px;border-width:1px}.center-badge{margin-bottom:5px}.turn-player{font-size:14px}.dice-surface{width:128px;height:61px;margin:4px 0}.real-die{width:37px;height:37px;top:15px;border-radius:8px}#die1{left:23px}#die2{right:23px}.die-glyph{font-size:29px}.dice-shadow{top:48px;width:32px;height:9px}.shadow-one{left:25px}.shadow-two{right:25px}.roll-btn{padding:8px 9px;font-size:9px}.center-hint{margin-top:4px;font-size:6.5px}.side-panel{grid-template-columns:1fr}.chat-card{grid-column:auto}.join-avatars{grid-template-columns:repeat(4,1fr)}.rules-grid{grid-template-columns:1fr}}


.compact-icon{width:34px;height:34px;font-size:15px}
.cabinet-actions{display:flex;align-items:center;gap:8px}
.media-card.collapsed .media-body{display:none}
.media-head{margin-bottom:0}
.media-card.collapsed{padding-bottom:12px}
.media-body{margin-top:12px}
.radio-quick-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.quick-tag{border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--text);border-radius:999px;padding:6px 10px;font-size:10px}
.secondary-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}
.trade-offer{margin-top:10px;padding:10px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}
.trade-offer-title{font-size:11px;font-weight:800;margin-bottom:5px}
.trade-offer-text{font-size:10px;color:var(--muted);line-height:1.5;margin-bottom:8px}
.build-list{display:flex;flex-direction:column;gap:10px}
.build-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}
.build-row strong{display:block;font-size:13px}
.build-row small{display:block;color:var(--muted);font-size:10px;margin-top:4px;line-height:1.45}
.build-badges{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}
.build-badge{padding:3px 6px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--line);font-size:9px}
.trade-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.name-input select,.name-input option{color:#fff}
select.name-input{appearance:none}
.building-strip{position:absolute;left:6px;right:6px;bottom:6px;display:flex;gap:4px;flex-wrap:wrap;z-index:3}
.building-chip{min-width:14px;height:14px;border-radius:4px;display:grid;place-items:center;font-size:10px;line-height:1;background:#31cc7a;color:#08321e;box-shadow:0 1px 4px rgba(0,0,0,.35)}
.building-chip.hotel{background:#ff9f5a;color:#311404}
.real-die{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:8px}
.die-pip{width:8px;height:8px;border-radius:50%;background:#111827;align-self:center;justify-self:center;box-shadow:inset 0 1px 1px rgba(255,255,255,.25)}
.pip-tl{grid-area:1/1}.pip-tr{grid-area:1/3}.pip-ml{grid-area:2/1}.pip-mr{grid-area:2/3}.pip-bl{grid-area:3/1}.pip-br{grid-area:3/3}.pip-cc{grid-area:2/2}
.tile.corner .corner-art{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.corner-symbol{font-size:clamp(18px,2vw,30px);line-height:1}
.pawn{width:clamp(28px,2.4vw,38px);height:clamp(28px,2.4vw,38px);font-size:clamp(15px,1.45vw,21px)}
.radio-result{display:flex;flex-direction:column;gap:3px}
.radio-result:hover{background:rgba(255,255,255,.05)}
.action-grid button,.secondary-actions button,.build-row button,.join-actions button{min-height:42px}
@media(max-width:1120px){.trade-grid{grid-template-columns:1fr}.chat-card{grid-column:1/-1}}
@media(max-width:700px){.compact-icon{width:32px;height:32px}.chat-messages{height:260px}.trade-grid{grid-template-columns:1fr}.build-row{grid-template-columns:1fr}.real-die{padding:6px}.die-pip{width:6px;height:6px}}

.board-center{background:radial-gradient(circle at center,rgba(24,61,98,.52),rgba(10,25,44,.28) 70%,transparent 72%);border-radius:24px}

.board-event{pointer-events:none;display:flex;gap:9px;align-items:center;width:min(360px,76%);margin-top:10px;padding:9px 11px;border:1px solid rgba(255,255,255,.09);border-radius:13px;background:rgba(8,25,43,.72);box-shadow:0 8px 22px rgba(0,0,0,.14);text-align:left}.board-event .event-icon{font-size:19px}.board-event .event-title{font-size:10px}.board-event .event-text{font-size:9px}.action-card>.section-head{margin-bottom:8px}
@media(max-width:700px){.board-event{width:82%;padding:6px 7px;margin-top:5px}.board-event .event-icon{font-size:14px}.board-event .event-title{font-size:7px}.board-event .event-text{font-size:6px}}