.board-viewport{width:100%;overflow:auto;padding:4px;border-radius:14px;min-width:0}
.board-grid{min-width:660px;grid-template-columns:13% repeat(9,minmax(0,1fr)) 13%;grid-template-rows:13% repeat(9,minmax(0,1fr)) 13%}
.game-help{background:#172337;border:1px solid #334155;border-radius:12px;padding:16px;font-size:13px;line-height:1.6}
#turn-status{font-weight:600;color:#fde68a;margin-bottom:10px;min-height:42px}
.game-help details{margin:14px 0;color:#cbd5e1}.game-help summary{cursor:pointer;font-weight:700;color:#fff}.game-help details p{margin:10px 0}.game-help a{color:#93c5fd}
.game-button{padding:12px 16px;border:1px solid #526580;border-radius:9px;background:#244264;color:#fff;font-weight:700;font-size:13px;cursor:pointer;min-height:44px;line-height:1.35}
.game-button:hover:not(:disabled){background:#315982}.game-button.gold{background:#fbbf24;color:#172337;border-color:#fbbf24}
button:disabled{opacity:.45;cursor:not-allowed}button[hidden],[hidden]{display:none!important}
button:focus-visible,a:focus-visible,summary:focus-visible,.cell:focus-visible{outline:3px solid #fbbf24;outline-offset:3px}
.local-mode{font-size:11px;color:#a5b4c8;margin-bottom:12px}
.estate-player{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 10px;background:#0f1b2e;border:1px solid #334155;border-left:4px solid var(--player);border-radius:10px;font-size:12px}
.estate-player.active{border-color:var(--player);background:#24334c}.estate-player small{display:block;font-size:10px;color:#b9c7d9;margin-top:5px}.estate-player b{color:#6ee7b7;white-space:nowrap}
.player-token{width:19px;height:19px;font-size:11px;color:white;display:grid;place-items:center;line-height:1;font-weight:bold}
.cell.current-space{outline:3px solid #fbbf24;outline-offset:-3px}.estate-badge{position:absolute;top:1px;left:2px;font-size:8px;background:#0f172a;color:white;border-radius:3px;padding:0 2px;pointer-events:none}.estate-badge:empty{display:none}
.card-slot{border:2px solid #d3b96e;background:repeating-linear-gradient(45deg,#183b65,#183b65 6px,#1e4778 6px,#1e4778 7px);color:#fff;width:120px;height:82px;box-shadow:3px 3px 0 #d3b96e,6px 6px 0 #183b65;gap:4px;text-align:center;padding:8px}
.card-slot small{font-size:9px;line-height:1.3}.card-slot:disabled{opacity:.85}.card-slot.deck-ready{outline:4px solid #fbbf24;outline-offset:5px;animation:deck-glow 1s ease-in-out infinite alternate}.slot-2{box-shadow:none;background:#102c50;border-style:dashed}
@keyframes deck-glow{to{filter:brightness(1.4);transform:rotate(-8deg) translateY(-4px)}}
#modal>div{max-width:460px;max-height:90dvh;overflow:auto}#modal-content{font-size:15px;line-height:1.65}#modal-actions{flex-wrap:wrap}#modal-actions .game-button{flex:1}
.chance-card{text-align:center;border:2px solid #d9bc70;padding:24px 18px;border-radius:12px;background:radial-gradient(ellipse at top,#215449,#102c2a);animation:card-reveal .35s ease-out}
.chance-card.unlucky{background:radial-gradient(ellipse at top,#74362d,#351e24);border-color:#f0a08c}.chance-card strong{font-size:24px;letter-spacing:5px;color:#f9dfa4;display:block}.chance-card p{margin:18px 0;color:#fff;font-size:18px}.chance-card small{color:#c9d4db;font-size:11px}.chance-symbol{display:block;font-size:45px;color:#f9dfa4}.chance-lucky{background:#16604b}.chance-unlucky{background:#8b3f31}
@keyframes card-reveal{from{opacity:0;transform:rotateY(70deg) scale(.94)}to{opacity:1;transform:rotateY(0) scale(1)}}
.property-facts p{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-bottom:1px solid #334155}.property-facts small{display:block;color:#bbc8d9;margin-top:14px;line-height:1.6}.insufficient{color:#fca5a5;margin-top:14px}
#game-log p{padding:5px 0;border-bottom:1px solid #334155}
.portfolios{width:100%;max-width:1152px;margin:40px auto 20px;min-width:0}
.portfolio-heading{display:flex;justify-content:space-between;gap:28px;align-items:center;margin-bottom:22px}.portfolio-eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:#e9c478}.portfolio-heading h2{font-family:Montserrat,sans-serif;font-size:27px;font-weight:800;margin:7px 0;color:#f2f5fa}.portfolio-heading p{font-size:13px;color:#a7b8ce;max-width:540px;line-height:1.7}
.audio-controls{display:grid;grid-template-columns:auto 130px;gap:8px 16px;padding:14px;border:1px solid #38506c;border-radius:12px;background:#152337;flex-shrink:0;font-size:11px;min-width:260px}.audio-controls button{grid-row:span 2;background:#203e4b;color:#a4efcf;border:1px solid #387a68;border-radius:8px;padding:8px;min-height:44px;font-weight:700}.audio-controls button[aria-pressed=false]{background:#253348;color:#bac5d8;border-color:#526580}.audio-controls label{display:flex;justify-content:space-between;color:#b8c8dd}.audio-controls input{width:130px;accent-color:#e7c782}.audio-controls small{grid-column:1/-1;color:#8fa5bf;font-size:10px}
.building-guide{display:flex;flex-wrap:wrap;gap:12px 30px;padding:17px 20px;margin-bottom:22px;border:1px solid #384456;background:#152132;border-radius:12px;font-size:12px;color:#e7c782}.building-guide b{color:#e1e8f2;margin-left:8px}.building-guide p{width:100%;color:#9eb1c9;font-size:11px}
.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.player-portfolio{min-width:0;border:1px solid #34465f;border-top:3px solid var(--player);border-radius:16px;background:#142034;padding:20px;box-shadow:0 12px 32px #0002}.player-portfolio.is-active{box-shadow:0 0 0 1px var(--player),0 12px 32px #0002}
.portfolio-player-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.player-number{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--player);color:#fff;font-family:Montserrat,sans-serif;font-weight:800}.portfolio-player-head h3{font-size:17px;font-weight:800}.portfolio-player-head div>span{font-size:10px;color:#9eb2cd}.portfolio-player-head>b{margin-left:auto;font-size:10px;color:#bccade}
.portfolio-metrics{display:grid;grid-template-columns:1fr 1fr;gap:14px;border-bottom:1px solid #314259;margin:18px 0;padding:0 0 18px}.portfolio-metrics dt{font-size:10px;color:#9bb0cb;margin-bottom:5px}.portfolio-metrics dd{font-size:19px;font-weight:700;letter-spacing:-.5px}.portfolio-metrics>div:first-child dd{color:#90e1c1}
.property-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.property-card{min-width:0;border:1px solid #c7cdd1;border-radius:10px;background:#f2eee5;color:#182a3e;overflow:hidden;display:flex;flex-direction:column}.property-stripe{height:9px;flex-shrink:0}.property-card-body{padding:14px;display:flex;flex-direction:column;flex:1}.property-category{font-size:8px;text-transform:uppercase;font-weight:800;letter-spacing:1px;color:#536272}.property-card h4{font-family:Montserrat,sans-serif;font-weight:800;font-size:14px;line-height:1.4;margin:9px 0 15px;min-height:40px}.property-card dl>div{display:flex;justify-content:space-between;gap:5px;margin:6px 0}.property-card dt{font-size:10px;color:#52606b}.property-card dd{font-size:11px;font-weight:800;white-space:nowrap}.house-slots{display:flex;gap:4px;align-items:center;margin:14px 0}.house-slots span{display:grid;place-items:center;width:23px;height:25px;border:1px dashed #b3b9b3;border-radius:4px;color:#8b9691;font-size:20px}.house-slots span.built{background:#176651;color:#fff;border:1px solid #176651}.house-slots b{font-size:9px;margin-left:auto;white-space:nowrap}.company-mark{display:flex;align-items:center;gap:8px;font-size:24px;color:#315f8c;margin:11px 0}.company-mark span{font-size:10px;font-weight:700}.property-actions{display:grid;gap:6px;margin-top:auto}.property-actions button{min-height:42px;border-radius:6px;font-size:11px;font-weight:800;padding:8px}.property-details{color:#263e55;border:1px solid #a5b2ba}.property-build{background:#176651;color:white;border:1px solid #176651}.property-build:disabled{background:#d8ddd7;color:#526159;border-color:#bac3ba;opacity:1}.property-actions button:focus-visible{outline-color:#176651}.build-note{font-size:10px;line-height:1.6;color:#596976;margin-top:9px}.build-note.can-build{color:#176651}.property-facts+.build-note{font-size:12px;color:#dfc583}
.portfolio-empty{grid-column:1/-1;text-align:center;padding:35px 20px;border:1px dashed #465d7a;border-radius:10px;background:#112033}.portfolio-empty>span{font-size:38px;color:#7999be}.portfolio-empty h4{font-size:13px;font-weight:700;margin:10px 0;color:#d3e2f4}.portfolio-empty p{font-size:12px;line-height:1.8;color:#94abc8;max-width:300px;margin:auto}
@media(max-width:1000px){.portfolio-grid{grid-template-columns:1fr}.portfolio-heading{align-items:flex-start}.property-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.portfolio-heading{flex-direction:column;gap:16px}.portfolio-heading h2{font-size:23px}.audio-controls{width:100%;grid-template-columns:1fr 140px}.audio-controls input{width:140px}.player-portfolio{padding:15px}.property-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.property-card-body{padding:10px}.property-card h4{font-size:12px}.property-card dl>div{display:block}.property-card dd{font-size:12px}.house-slots{flex-wrap:wrap}.house-slots b{width:100%;margin-top:4px}.portfolio-metrics dd{font-size:17px}.building-guide{gap:12px}.portfolio-player-head>b{width:100%;margin-left:54px}}
@media(max-width:350px){.property-card-grid{grid-template-columns:1fr}}
@media(max-width:700px){body{padding:8px!important}header{gap:12px}header>div:last-child{gap:10px!important;flex-wrap:wrap;margin:0!important}h1{font-size:17px!important}.board-grid{width:660px;max-width:none}.board-viewport{background:#142d50}.logo-banner{padding:12px 24px}.game-help{font-size:14px}#modal-content{font-size:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

.game-history summary { cursor: pointer; min-height: 44px; align-content: center; }
.game-history summary:focus-visible { outline: 2px solid #fbbf24; outline-offset: 4px; border-radius: 4px; }
.game-history summary span { float: right; color: #93c5fd; font-size: 11px; text-transform: none; letter-spacing: normal; }
.game-history .history-close, .game-history[open] .history-open { display: none; }
.game-history[open] .history-close { display: inline; }
.game-history #game-log { margin-top: 12px; }

/* ═══ NOVO PINO DO JOGO EM 3D ═══ */

/* Ajuste do container para alinhar os pinos na casa */
.tokens-container {
  position: absolute;
  bottom: 2px;
  left: 0;
  right: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  gap: 2px;
  z-index: 20;
  pointer-events: none;
}

/* Estrutura Tridimensional do Pino */
.pawn-token {
  position: relative;
  width: 14px;
  height: 22px;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  filter: drop-shadow(0px 2px 3px rgba(0, 0, 0, 0.6));
}

.pawn-token .pawn-head {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, var(--pawn-light), var(--pawn-color) 60%, var(--pawn-dark) 100%);
  z-index: 3;
}

.pawn-token .pawn-neck {
  width: 6px;
  height: 2px;
  margin-top: -1px;
  border-radius: 50%;
  background: linear-gradient(90deg, var(--pawn-dark), var(--pawn-light), var(--pawn-dark));
  z-index: 2;
}

.pawn-token .pawn-body {
  width: 8px;
  height: 11px;
  margin-top: -1px;
  background: linear-gradient(90deg, var(--pawn-dark) 0%, var(--pawn-color) 45%, var(--pawn-light) 55%, var(--pawn-dark) 100%);
  clip-path: polygon(30% 0%, 70% 0%, 95% 85%, 100% 100%, 0% 100%, 5% 85%);
  z-index: 1;
}

.pawn-token .pawn-base {
  width: 13px;
  height: 4px;
  margin-top: -1px;
  border-radius: 50%;
  background: linear-gradient(90deg, var(--pawn-dark), var(--pawn-light), var(--pawn-dark));
}

/* Paleta de Cores Dinâmicas dos Pinos por Jogador */
.pawn-p1, .pawn-token[data-player="1"] {
  --pawn-color: #3b82f6;
  --pawn-light: #93c5fd;
  --pawn-dark: #1d4ed8;
}

.pawn-p2, .pawn-token[data-player="2"] {
  --pawn-color: #ef4444;
  --pawn-light: #fca5a5;
  --pawn-dark: #b91c1c;
}

.pawn-p3, .pawn-token[data-player="3"] {
  --pawn-color: #22c55e;
  --pawn-light: #86efac;
  --pawn-dark: #15803d;
}

.pawn-p4, .pawn-token[data-player="4"] {
  --pawn-color: #eab308;
  --pawn-light: #fef08a;
  --pawn-dark: #a16207;
}
