/* Shared board markings: set strips, square owner badges, round playing pieces. */
.ownership-edge,.owner-marker,.development-marker,.mortgage-slash{pointer-events:none}
.tile-name{font-weight:750}
.mortgage-slash{fill:none;stroke:#47574f;stroke-width:3;opacity:.45}
.owner-muted{opacity:.25}
.owner-selected .tile-bg{stroke:#173d32;stroke-width:3}
.space-focus .tile-bg{stroke:#173d32;stroke-width:3;stroke-dasharray:6 3}
.board-space:focus{outline:none}
.board-space:focus .tile-bg{stroke:#9b5219;stroke-width:4;stroke-dasharray:none}
.board-tab .board-center{inset:24%;overflow:auto;justify-content:center;gap:5px}
.board-tab .board-center .event-card,.board-tab .board-center .center-note,.board-tab .center-property>span{display:none}
.board-tab .board-center h2{font-size:clamp(.8rem,3.2vw,1.1rem)}
.board-tab .center-property{padding:0}
.board-tab .center-property h3{font-size:.8rem;margin-top:0}
.board-tab .center-property p{font-size:.7rem}
.board-tab .board-center .dice-row{font-size:1.6rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[hidden]{display:none!important}

/* The playing display uses almost the full viewport height. No site navigation
   or large title block takes space away from the board during a game. */
.tv-mode #site-header{display:none}
.tv-mode{background:#e6eadf}
.tv-shell{--screen-height:100vh;--rail:clamp(300px,25vw,440px);--board:min(calc(var(--screen-height) - 82px),calc(100vw - var(--rail) - 52px));padding:10px 16px 12px;max-width:none;margin:0 auto}
@supports(height:100dvh){.tv-shell{--screen-height:100dvh}}
.tv-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;margin-bottom:10px;max-width:calc(var(--board) + var(--rail) + 20px);margin-left:auto;margin-right:auto}
.tv-title{display:flex;align-items:center;gap:10px;min-width:0}
.tv-title>a{display:flex;flex:none}
.tv-title h1{font:750 clamp(1rem,1.4vw,1.45rem)/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:-.035em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:370px}
.tv-room{font:750 .9rem/1.2 ui-monospace,monospace;letter-spacing:.08em;padding:6px 8px;background:#f6f6eb;border:1px solid #c5d2bf;border-radius:6px}
.tv-title .connection{font-size:.75rem;white-space:nowrap}
.tv-toolbar-actions{display:flex;align-items:center;gap:8px;flex:none}
.tv-button{border:1px solid #b8c9b7;border-radius:8px;background:#f8f8ee;color:#173d32;padding:8px 12px;min-height:38px;font-size:.85rem;font-weight:650;line-height:1.25;text-decoration:none;white-space:nowrap}
.tv-button:hover{background:#d8e5cd}
.tv-button.danger{color:#a34432}
.tv-live{background:#173d32;color:#fffce9;border-color:#173d32}
.tv-live:hover{background:#275d49}
.tv-controls{position:relative}
.tv-controls summary{cursor:pointer;list-style:none}
.tv-controls summary::-webkit-details-marker{display:none}
.tv-controls[open]>div{position:absolute;right:0;top:calc(100% + 7px);z-index:50;min-width:190px;display:grid;gap:8px;padding:12px;background:#fffef8;box-shadow:0 6px 30px #18332430;border:1px solid #b8c9b7;border-radius:12px}
.tv-layout{display:grid;grid-template-columns:var(--board) var(--rail);gap:20px;justify-content:center;align-items:start}
.tv-board{width:var(--board);height:var(--board);position:relative;container-type:inline-size;border-radius:24px;box-shadow:0 8px 28px #183b3015}
.tv-center{position:absolute;inset:24%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:clamp(7px,1.1cqw,13px);text-align:center;color:var(--tile-text);overflow:auto;scrollbar-width:thin;padding:4px;overflow-wrap:anywhere}
.tv-center>*{flex-shrink:0}
.tv-center>:first-child{margin-top:auto}
.tv-center>:last-child{margin-bottom:auto}
.theme-midnight .tv-center{color:#f4f4e8}
.tv-caption{font-size:clamp(11px,1.4cqw,16px);letter-spacing:.09em;font-weight:750;line-height:1.35}
.tv-announcement{font-size:clamp(26px,3.6cqw,44px);font-weight:750;line-height:1.17;letter-spacing:-.025em}
.tv-announcement.long-announcement{font-size:clamp(20px,2.8cqw,34px)}
.tv-dice{display:flex;align-items:center;gap:7px;justify-content:center;flex-wrap:wrap;color:#1a4236}
.tv-dice>span{font-size:clamp(28px,5.3cqw,60px);line-height:1;background:#fff8e6;border-radius:8px;padding:3px 6px;box-shadow:0 2px 0 #17352825}
.tv-dice>strong{font-size:clamp(20px,3.3cqw,36px);margin-left:3px;color:var(--tile-text)}
.theme-midnight .tv-dice>strong{color:#fff9e9}
.tv-dice>small{font-size:clamp(9px,1cqw,12px);font-weight:750;letter-spacing:.06em;color:inherit;max-width:36px;line-height:1.2}
.theme-midnight .tv-dice>small{color:#cad7cd}
.tv-property,.tv-auction,.tv-debt{width:100%;background:#fffcf1;border:1px solid #c4ceba;border-radius:14px;padding:clamp(10px,1.5cqw,18px);color:#183b31}
.tv-property{border-top:6px solid var(--set)}
.tv-property>.tv-caption{display:block;color:#546658;font-size:clamp(10px,1.2cqw,14px);margin-bottom:5px}
.tv-property h2,.tv-auction h2,.tv-debt h2{font-size:clamp(24px,3.6cqw,42px);line-height:1.15;font-weight:700;overflow-wrap:anywhere}
.tv-owner{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:10px;font-size:clamp(14px,2cqw,24px)}
.tv-owner>span:last-child{min-width:0;text-align:left;line-height:1.25}
.tv-owner strong{font-weight:750}
.tv-badge{display:inline-grid;place-items:center;flex:none;width:32px;height:32px;background:var(--player);border:2px solid #173d32;border-radius:6px;color:#102c29;font-weight:850;font-size:20px;line-height:1}
.tv-rent{display:flex;align-items:baseline;justify-content:center;gap:7px 12px;flex-wrap:wrap;margin-top:10px}
.tv-rent>span{font-size:clamp(13px,1.8cqw,21px)}
.tv-rent>strong{font-size:clamp(22px,3.2cqw,38px);font-weight:800;line-height:1.15}
.tv-buildings{display:block;margin-top:7px;font-size:clamp(13px,1.8cqw,21px);font-weight:750}
.tv-auction{background:#f6f0ff;border-color:#bdb0d1}
.tv-auction>.tv-caption{display:block;margin-bottom:7px;color:#655577}
.tv-bid{display:grid;gap:6px;margin:12px 0}
.tv-bid>span{font-size:clamp(15px,2cqw,23px)}
.tv-bid>strong{font-size:clamp(29px,5cqw,58px);line-height:1.1}
.tv-next-bid{display:flex;align-items:center;justify-content:center;gap:8px;border-top:1px solid #ccbdd8;padding-top:10px;font-size:clamp(14px,1.9cqw,22px);line-height:1.4}
.tv-next-bid>span:last-child{min-width:0}
.tv-debt{background:#fff0db;border-color:#d6b591}
.tv-debt>strong{display:block;margin:8px 0;font-size:clamp(20px,3cqw,34px);color:#924328}
.tv-debt p{font-size:clamp(14px,1.8cqw,21px);line-height:1.35;color:#67543e;margin-top:8px}
.tv-card{width:100%;background:#fff8e5;color:#324e3f;border:1px solid #cebe99;border-radius:14px;padding:clamp(12px,2cqw,24px)}
.tv-card p{color:inherit;font-size:clamp(14px,2.25cqw,26px);line-height:1.4}
.tv-center.has-card .tv-dice,.tv-center.has-card .tv-instruction{display:none}
.tv-card>span{display:block;margin-top:12px;font-size:clamp(12px,1.7cqw,19px);font-weight:650;color:#685c45}
.tv-event-detail{color:inherit;font-size:clamp(13px,1.7cqw,20px);line-height:1.35;max-width:100%}
.tv-instruction{color:inherit;opacity:.8;font-size:clamp(11px,1.4cqw,16px);line-height:1.35}
.tv-sidebar{height:var(--board);display:flex;flex-direction:column;gap:12px;min-width:0;overflow:auto;scrollbar-width:thin}
.tv-table{background:#fffdf4;border:1px solid #c7d2bf;border-radius:14px;overflow:hidden;flex:none}
.tv-panel-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;background:#f3f5e8}
.tv-panel-heading h2{font-size:clamp(17px,1.5vw,22px)}
.tv-panel-heading>span{font-size:14px;color:#53685a;white-space:nowrap}
.tv-player{width:100%;display:flex;align-items:center;gap:10px;min-height:clamp(47px,7.5vh,78px);padding:clamp(5px,1vh,10px) 12px;border:0;border-bottom:1px solid #dfe4d6;background:transparent;text-align:left;color:#173d32}
.tv-player:hover{background:#eef3e1}
.tv-player.is-current{background:#e0edcb;box-shadow:inset 4px 0 #164d40}
.tv-player.is-selected{outline:3px solid #173d32;outline-offset:-3px}
.tv-player.is-out{opacity:.55}
.tv-player-info{flex:1;min-width:0}
.tv-player-info>strong{display:block;font-size:clamp(17px,1.35vw,23px);font-weight:750;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tv-player-info>small{display:block;margin-top:4px;font-size:clamp(11px,.9vw,14px);color:#53685a;line-height:1.15}
.tv-player-money{text-align:right;flex:none;max-width:56%}
.tv-player-money>strong{display:block;font-size:clamp(19px,1.6vw,29px);font-variant-numeric:tabular-nums;line-height:1.15;letter-spacing:-.035em;overflow-wrap:anywhere}
.tv-player-money>small{display:block;margin-top:3px;font-size:clamp(10px,.8vw,13px);color:#53685a}
.tv-cash-change{display:inline-block;font-size:clamp(15px,1.2vw,20px);font-weight:800;line-height:1.2;padding:2px 5px;border-radius:4px;margin-top:3px}
.tv-cash-change.gain{color:#145632;background:#d6edca}
.tv-cash-change.loss{color:#943b28;background:#fae0d3}
.tv-ownership-key{display:grid;grid-template-columns:1fr;gap:6px;padding:12px 14px 8px;font-size:clamp(11px,.9vw,14px);color:#405c4c;line-height:1.3}
.tv-ownership-key>span{display:flex;align-items:center;gap:7px}
.key-set{display:inline-block;width:20px;height:7px;background:#a07eb4;border-radius:2px}
.key-owner,.key-piece{display:inline-grid;place-items:center;width:20px;height:20px;background:#e6b05f;border:1px solid #173d32;border-radius:3px;color:#173d32;font-style:normal;font-weight:800}
.key-piece{border-radius:50%;background:#86c8b3}
.tv-highlight-help{padding:2px 14px 10px;color:#53685a;font-size:clamp(11px,.9vw,14px);line-height:1.4}
.tv-highlight-help button{border:0;padding:0;background:none;text-decoration:underline;color:#173d32;font:inherit}
.tv-history{border:1px solid #c7d2bf;border-radius:12px;background:#fffdf4;overflow:hidden;flex-shrink:0}
.tv-history-toggle{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:12px 14px;border:0;background:transparent;color:#173d32;font-weight:750;font-size:16px;text-align:left}
.tv-history-toggle>span{font-size:22px;line-height:1}
.tv-log{max-height:250px;overflow:auto;padding:0 14px 10px;scrollbar-width:thin}
.tv-log p{font-size:clamp(14px,1.1vw,18px);color:#405c4c;line-height:1.4;padding:10px 0;border-top:1px solid #dfe4d6;overflow-wrap:anywhere}
.tv-log .tv-log-debt{color:#943b28}
.tv-log .tv-log-purchase,.tv-log .tv-log-trade{font-weight:700}
@media(max-height:800px) and (min-width:1001px){
  .tv-center.has-card .tv-event-detail{display:none}
  .tv-ownership-key{grid-template-columns:1fr 1fr;gap:5px 10px;padding:8px 12px 6px;font-size:11px}
  .tv-panel-heading{padding:9px 12px}
  .tv-highlight-help{font-size:11px;padding-bottom:8px}
}
@media(max-width:1100px){
  .tv-title .connection{display:none}
  .tv-title h1{max-width:180px}
  .tv-toolbar{gap:8px}
  .tv-toolbar-actions{gap:5px}
  .tv-button{padding:8px;font-size:.78rem}
}
@media(max-width:1000px){
  .tv-shell{--board:min(calc(100vw - 24px),850px);padding:10px 12px 20px}
  .tv-toolbar{max-width:850px;flex-wrap:wrap}
  .tv-title{flex:1}
  .tv-title h1{max-width:none;white-space:normal;font-size:1.1rem}
  .tv-toolbar-actions{flex-wrap:wrap}
  .tv-layout{grid-template-columns:var(--board);gap:14px}
  .tv-sidebar{height:auto;overflow:visible}
  .tv-player{min-height:62px}
  .tv-player-info>strong{font-size:19px}
  .tv-player-money>strong{font-size:23px}
  .tv-ownership-key{grid-template-columns:1fr 1fr}
}
@media(max-width:500px){
  .tv-room{font-size:.75rem}
  .tv-toolbar-actions{width:100%}
  .tv-center{inset:23%;gap:5px;justify-content:flex-start}
  .tv-announcement,.tv-announcement.long-announcement{font-size:15px}
  .tv-caption{font-size:9px}
  .tv-dice>span{font-size:24px}
  .tv-dice>strong{font-size:17px}
  .tv-dice>small{font-size:8px}
  .tv-property,.tv-auction,.tv-debt{padding:7px;border-radius:8px}
  .tv-property h2,.tv-auction h2,.tv-debt h2{font-size:15px}
  .tv-property>.tv-caption{font-size:9px}
  .tv-owner{font-size:12px;margin-top:5px}
  .tv-owner .tv-badge,.tv-next-bid .tv-badge{width:22px;height:22px;font-size:14px}
  .tv-rent{margin-top:5px;gap:3px 6px}
  .tv-rent>strong{font-size:17px}
  .tv-rent>span,.tv-buildings,.tv-next-bid,.tv-bid>span,.tv-debt p{font-size:11px}
  .tv-bid{gap:4px;margin:6px 0}
  .tv-bid>strong{font-size:24px}
  .tv-card{padding:8px}
  .tv-card p{font-size:12px}
  .tv-card>span{font-size:10px;margin-top:5px}
  .tv-instruction,.tv-event-detail{font-size:10px}
}

/* Prices and current rent share the board's accessible, inspectable space. */
.board-value{pointer-events:none;font-family:ui-sans-serif,system-ui,sans-serif}
.board-value rect{fill:#fff5db;stroke:#b19457;stroke-width:1}
.board-value text{fill:#674a1d}
.board-value .value-caption{font-weight:750;letter-spacing:.25px}
.board-value .value-amount{font-weight:800;font-variant-numeric:tabular-nums}
.value-rent rect{fill:#e1eee2;stroke:#6c9276}
.value-rent text{fill:#224e34}
.value-mortgaged rect{fill:#e8e9e3;stroke:#93998c}
.value-mortgaged text{fill:#586252}
.value-connector{fill:none;stroke:#8d9a7c;stroke-width:1.5}
.space-focus .board-value rect,.board-space:focus .board-value rect{stroke:#9b5219;stroke-width:2}
.owner-selected .board-value rect{stroke:#173d32;stroke-width:2}
.theme-midnight .board-value rect{fill:#493f2d;stroke:#b39862}
.theme-midnight .board-value text{fill:#ffedbf}
.theme-midnight .value-rent rect{fill:#273f38;stroke:#719b85}
.theme-midnight .value-rent text{fill:#dcf4dd}
.theme-midnight .value-mortgaged rect{fill:#363c3b;stroke:#88928d}
.theme-midnight .value-mortgaged text{fill:#ccd2ca}
.theme-midnight .value-connector{stroke:#96a892}
.tv-board .board-svg.price-rails+.tv-center,.board-wrap .board-svg.price-rails+.board-center{inset:30%}
.tv-board .board-svg.price-rails+.tv-center .tv-announcement{font-size:clamp(21px,3.2cqw,38px)}
.key-price{font-size:9px;padding:3px;border:1px solid #b19457;background:#fff5db;border-radius:3px;color:#674a1d}
