/* Original client structure: a clear map, thin funds strip, and a physical card rail. */
body[data-client=richman8-subset]{--ink:#493d31;--muted:#82725d;--paper:#fff7e4;--line:#ddc9a0;--green:#b87736;--shadow:0 8px 24px #674e2420;background:#ead9ad}
body[data-client] button,body[data-client] select,body[data-client] input{border-radius:7px}
body[data-client] button:hover:not(:disabled){background:#f8e8c7;border-color:#b58b4f}
body[data-client] button.primary-button,body[data-client] .roll-button{background:#bb773b;border:1px solid #92592a;box-shadow:inset 0 1px #ffffff70,0 3px #80532c;color:#fff9eb}
body[data-client] button.primary-button:hover:not(:disabled),body[data-client] .roll-button:hover:not(:disabled){background:#a96731}
body[data-client] .r8-header{inset:18px 24px auto;min-height:40px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;pointer-events:none}
body[data-client] .r8-header>*{pointer-events:auto}
body[data-client] .r8-brand{background:#fff6dfed;padding:7px 14px;border:1px solid #e0c99b;border-radius:7px;box-shadow:0 2px 0 #b6a27a55;font-size:17px;letter-spacing:.1em}
body[data-client] .brand-emblem{color:#b67c3e;font-size:23px}
body[data-client] .r8-header>span{display:none}
body[data-client] .r8-header nav{padding:3px 5px;background:#fff6dfed;border:1px solid #e0c99b;border-radius:7px;gap:4px}
body[data-client] .r8-header nav button{border:0;border-radius:5px}
body[data-client] .r8-header select{min-height:28px;max-width:130px;font-size:12px}
body[data-client] .r8-setup{inset:78px 24px 26px;width:auto;display:block;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;animation:none;pointer-events:none}
body[data-client] .setup-console{position:absolute;right:0;top:12px;bottom:0;width:380px;max-height:570px;padding:23px 22px 17px;display:flex;flex-direction:column;pointer-events:auto;background:linear-gradient(145deg,#fff9e9,#f7e6bf);border:2px solid #bc9661;border-radius:14px;box-shadow:inset 0 0 0 3px #fff7e2,0 8px 0 #80613626,0 18px 36px #6e563329;overflow:hidden}
body[data-client] .setup-heading{padding:0 0 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #d3b780;flex:none}
body[data-client] .setup-heading h1{font-size:25px;margin:0;letter-spacing:.03em}
body[data-client] .setup-heading select{min-height:34px;font-size:13px;padding:4px 7px;border-color:#d1b783;background:#fff9eb}
body[data-client] .setup-scroll{flex:1;display:flex;flex-direction:column;justify-content:center;overflow:auto;padding:0 1px}
body[data-client] #seat-picker{width:100%}
body[data-client] .seat-row{grid-template-columns:65px minmax(0,1fr) 76px;gap:12px;padding:13px 0;border-bottom:1px solid #ddcba5}
body[data-client] .seat-row:last-child{border:0}
body[data-client] .seat-avatar{width:65px;height:74px;border-radius:7px;background:linear-gradient(#ffffff88,#ffffff00),var(--player-color);border:1px solid #e0cda8;object-fit:contain}
body[data-client] .seat-fields{grid-template-columns:1fr;gap:4px}
body[data-client] .seat-fields input{min-height:29px;padding:2px 5px;font-size:15px;background:transparent;border:0;border-radius:0;border-bottom:1px solid #d5c49e;font-weight:650}
body[data-client] .seat-fields select{min-height:27px;padding:2px 3px;font-size:12px;background:transparent;border:0}
body[data-client] .seat-row>select{width:76px;min-height:31px;padding:4px;font-size:12px;background:#fff7e3;border-color:#d8c198}
body[data-client] .setup-actions{padding-top:17px;border-top:1px solid #d3b780;grid-template-columns:1fr;gap:9px;flex:none}
body[data-client] .start-button{min-height:47px;border-radius:7px;font-size:18px}
body[data-client] .setup-actions>.text-button{font-size:13px;min-height:24px;padding:2px}
body[data-client] .boot-status{margin:6px 0 0;font-size:12px}
body[data-client] .city-selection{position:absolute;left:7px;right:414px;top:0;bottom:0;pointer-events:none}
body[data-client] .city-heading{position:absolute;left:0;top:4px;display:flex;align-items:baseline;gap:12px;color:#6d542f;text-shadow:0 1px #fff7df;pointer-events:none}
body[data-client] .city-heading-label{font-size:13px;letter-spacing:.16em}
body[data-client] .city-heading strong{font-size:43px;letter-spacing:.08em;font-weight:800}
body[data-client] .city-picker{position:absolute;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:620px;pointer-events:auto}
body[data-client] .city-card{min-height:48px;padding:7px 9px;display:flex;flex-direction:row;gap:9px;background:#fff6dfe8;border:1px solid #d5be8d;box-shadow:0 2px #8c744f28;border-radius:7px;font-size:14px;white-space:nowrap}
body[data-client] .city-card>span{font-size:21px;width:22px;color:#a16e37}
body[data-client] .city-card[aria-pressed=true]{background:#c18442;color:#fff9e8;border-color:#96632e;box-shadow:inset 0 0 0 2px #f4d99c,0 2px #8c744f28}
body[data-client] .city-card[aria-pressed=true]>span{color:#ffedba}
body[data-client] .scene-caption{display:none}
/* During play, the top and bottom edges hold controls; the city stays open. */
body[data-client]:has(#hud:not([hidden])) .r8-header{left:auto;right:14px;top:12px;min-height:32px}
body[data-client]:has(#hud:not([hidden])) .r8-brand{display:none}
body[data-client]:has(#hud:not([hidden])) .r8-header nav{padding:1px 3px}
body[data-client]:has(#hud:not([hidden])) .r8-header select{max-width:103px;font-size:11px}
body[data-client]:has(#hud:not([hidden])) .r8-header .icon-button{width:27px;height:27px;min-height:27px;font-size:13px}
body[data-client] .r8-hud{position:fixed;inset:12px auto auto 16px;width:auto;max-width:calc(100vw - 266px);max-height:70px;overflow:visible;padding:0;display:flex;align-items:center;gap:20px;background:#fff5dbe8;border:1px solid #c7a571;border-radius:8px;box-shadow:inset 0 1px #fff,0 3px #b18d5730;backdrop-filter:none}
body[data-client] #date-status{font-size:14px;padding-left:13px;white-space:nowrap}
body[data-client] #self-player{padding:6px 0;background:none;border:0;border-radius:0}
body[data-client] .self-title{display:none}
body[data-client] .asset-pair{display:flex;gap:23px}
body[data-client] .asset-pair>div{display:flex;flex-direction:row;align-items:center;gap:8px;white-space:nowrap}
body[data-client] .asset-pair span{font-size:12px;color:#8a6e46}
body[data-client] .asset-pair strong{font-size:22px;color:#584329}
body[data-client] .player-list{display:flex;gap:5px;margin:0;padding:0 5px 0 0}
body[data-client] .player-chip{padding:0;width:47px;height:55px;border:0;border-radius:4px;min-height:0;background:none;display:flex!important;flex-direction:column}
body[data-client] .player-chip img{width:39px;height:39px;border:1px solid #d9bd8b;border-radius:6px;background:var(--player-color);object-fit:contain}
body[data-client] .player-chip.active{background:none;box-shadow:none;outline:2px solid #be8644;outline-offset:1px}
body[data-client] .player-chip.active:after{display:none}
body[data-client] .player-chip .player-chip-name{font-size:10px;max-width:45px;line-height:1.1}
body[data-client] .player-chip .player-seat-number{width:16px;height:16px;font-size:10px;left:0;top:0;border-width:1px}
body[data-client] .play-dock{position:fixed;z-index:27;left:0;right:0;bottom:0;height:116px;display:flex;align-items:stretch;gap:16px;padding:10px 17px 8px;background:linear-gradient(#f8dda1,#f1cb77);border-top:2px solid #bc9554;box-shadow:inset 0 3px #fff1c2,0 -3px 16px #7654261a}
body[data-client] #current-player{width:160px;flex:none;display:flex;align-items:center;gap:10px;min-width:0}
body[data-client] .dock-portrait{width:72px;height:87px;object-fit:contain;border:2px solid #fff0be;outline:1px solid #b98b46;border-radius:8px;background:var(--player-color);box-shadow:0 3px #b3844730;flex:none}
body[data-client] .turn-caption{margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0}
body[data-client] .turn-caption strong{font-size:14px;max-width:82px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:none}
body[data-client] .turn-caption>span{font-size:12px;line-height:1.3;color:#836238;flex:none;text-align:left}
body[data-client] .turn-caption .shield-badge{font-size:11px;text-align:left}
body[data-client] .bomb-badge{color:#ae4c35!important;font-weight:700}
body[data-client] .hand-dock{position:static;transform:none;inset:auto;flex:1;min-width:0;max-width:none;width:auto;display:flex;align-items:center;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;animation:none;overflow:visible}
body[data-client] .hand-row{display:flex;gap:8px;align-items:center;width:100%;padding:4px 4px 5px;overflow:auto;scrollbar-width:thin}
body[data-client] .hand-card.art-card{width:64px;min-width:64px;max-width:64px;height:85px;min-height:85px;padding:4px;background:#fff8e7;border:1px solid #ba9a67;border-radius:5px;box-shadow:2px 3px #9f783838;transform:rotate(-3deg);transition:transform .15s,box-shadow .15s}
body[data-client] .hand-card.art-card:nth-child(even){transform:rotate(2deg)}
body[data-client] .hand-card.art-card:hover:not(:disabled),body[data-client] .hand-card.art-card:focus-visible{transform:translateY(-6px) rotate(0);box-shadow:2px 7px #9f783838}
body[data-client] .hand-card .card-face{display:block;position:relative;width:100%;height:100%;text-align:center}
body[data-client] .hand-card .card-art-frame{padding:0;border:0;background:none;border-radius:0;box-shadow:none;height:55px}
body[data-client] .hand-card .card-art-svg{height:55px;max-height:55px;width:100%}
body[data-client] .hand-card .card-name{display:block;font-size:10px;line-height:1.3;margin-top:3px;white-space:nowrap}
body[data-client] .hand-card .card-quantity{top:-4px;right:-5px;border-radius:4px;background:#b67135;color:white;font-size:10px;padding:2px 4px}
body[data-client] .empty-hand{font-size:13px;color:#9c7845;padding:14px}
body[data-client] .dock-controls{flex:none;align-self:center;width:186px;display:flex;flex-direction:column;gap:8px}
body[data-client] .turn-actions{margin:0;min-height:45px;display:flex!important;flex-direction:column}
body[data-client] .turn-actions .roll-button,body[data-client] .turn-actions>.primary-button,body[data-client] .turn-actions>button{min-height:43px;border-radius:7px;padding:8px 12px;font-size:16px;display:flex;align-items:center;justify-content:space-between}
body[data-client] .roll-button span{font-size:25px;animation:none}
body[data-client] .hud-tools{display:flex;margin:0;gap:2px;justify-content:space-between}
body[data-client] .hud-tools button{font-size:12px;padding:3px 5px;min-height:28px;border:1px solid #bc965d;border-radius:5px;background:#fff0c4;box-shadow:inset 0 1px #fff7db}
body[data-client] .hand-count{font-size:11px;color:#8b602c}
body[data-client] .hud-status{flex:none;width:57px;display:flex;flex-direction:column;justify-content:center;gap:7px;margin:0;padding:0 0 0 9px;border:0;border-left:1px solid #caa15e}
body[data-client] .hud-status select,body[data-client] .hud-status button{min-height:27px;padding:3px 1px;font-size:12px;max-width:49px;background:none;border:0}
body[data-client] .standby{padding:0;font-size:13px}
body[data-client] .standby>button{width:100%;min-height:43px;background:#fff0c4;border-color:#bc965d;font-size:15px}
body[data-client] .r8-camera{bottom:129px;left:auto;right:15px;transform:none;padding:3px;background:#fff5dde6;border:1px solid #d0b17c;border-radius:6px;box-shadow:0 2px 0 #b9976133}
body[data-client] .r8-camera button{font-size:12px;min-height:27px;padding:3px 8px}
body[data-client]:has(#setup:not([hidden])) .r8-camera{bottom:145px;right:429px}
body[data-client] .route-panel,body[data-client] .target-panel,body[data-client] .decision-panel{left:auto;right:18px;top:auto;bottom:173px;width:350px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 250px);border:1px solid #c5a36c;border-radius:9px;background:#fff8e8f7;box-shadow:inset 0 1px #fff,0 8px 20px #74593424;backdrop-filter:none}
body[data-client] .route-choice{border-radius:6px;min-height:60px;background:#fff7e5}
body[data-client] .route-choice strong{font-size:13px}
body[data-client] .route-choice small{font-size:12px;color:#826e51}
body[data-client] .route-risk{display:block;color:#ac573b;font-size:12px;margin-top:5px}
body[data-client] .target-preview{border-color:#ddc9a0}
body[data-client] .decision-heading h2{font-size:17px}
body[data-client] .decision-meta{font-size:13px;color:#867152}
body[data-client] .target-controls{background:#f8ecd0;border-color:#ddc9a0}
body[data-client] .r8-dialog{background:#fff7e5;border:2px solid #bc9661;border-radius:12px;box-shadow:inset 0 0 0 3px #fffdf0,0 20px 70px #4e35163d}
body[data-client] .dialog-heading{border-color:#ddc9a0}
body[data-client] .card-collection{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
body[data-client] .card-collection .art-card{display:block;text-align:center;padding:9px;border:1px solid #c6a46b;border-radius:6px;background:#fff9e9}
body[data-client] .card-collection .card-art-svg{height:110px}
body[data-client] .card-collection .card-name{font-size:14px;display:block}
body[data-client] .project-risk{font-size:13px;color:#a56938;margin:12px 0}
body[data-client] .project-ready{color:#ad6e2f}
body[data-client] .project-race .project-track{background:#e7d7b8}
body[data-client] .action-receipt{left:50%;right:auto;top:87px;bottom:auto;transform:translateX(-50%);width:auto;max-width:min(350px,calc(100vw - 30px));padding:10px 27px 10px 12px;border:1px solid #cbaa73;border-radius:9px;background:#fff8e9f5;box-shadow:0 5px 17px #64461a20}
body[data-client] .compact-receipt{display:flex;align-items:center;gap:12px;min-width:130px}
body[data-client] .compact-receipt-art{width:53px;height:60px;flex:none}
body[data-client] .compact-receipt-art svg{width:100%;height:100%}
body[data-client] .compact-receipt-icon{font-size:31px;color:#b57f3c;flex:none}
body[data-client] .compact-receipt-content{display:flex;flex-direction:column;gap:4px}
body[data-client] .compact-receipt-actor{font-size:12px;color:#8c7858}
body[data-client] .compact-receipt-title{font-size:19px;line-height:1.25;font-weight:750}
body[data-client] .compact-receipt-value{font-size:17px;font-variant-numeric:tabular-nums}
body[data-client] .character-reaction{display:none!important}
body[data-client] .scene-cutin{border-radius:7px;background:#fff7e6e8;border:1px solid #d2b581;left:18px;top:87px;padding:8px 13px}
body[data-client] .r8-toast{background:#fff6df;color:#695234;border:1px solid #c5a368;border-radius:7px;bottom:137px}
@media(max-height:700px) and (min-width:861px){body[data-client] .r8-setup{top:68px;bottom:18px}body[data-client] .setup-console{top:4px;padding:16px 20px 12px}body[data-client] .setup-heading{padding-bottom:12px}body[data-client] .seat-row{padding:8px 0;grid-template-columns:57px minmax(0,1fr) 76px}body[data-client] .seat-avatar{width:57px;height:61px}body[data-client] .setup-actions{padding-top:12px;gap:6px}}
@media(max-width:1000px){body[data-client] .setup-console{width:342px;padding-left:18px;padding-right:18px}body[data-client] .city-selection{right:366px}body[data-client] .r8-hud{gap:12px;max-width:calc(100vw - 238px)}body[data-client] .asset-pair{gap:13px}body[data-client] .asset-pair strong{font-size:18px}body[data-client] .asset-pair>div{gap:5px}body[data-client] .player-chip{width:37px}body[data-client] .player-chip img{width:33px;height:37px}body[data-client] .play-dock{gap:10px;padding-left:12px;padding-right:12px}body[data-client] #current-player{width:140px;gap:8px}body[data-client] .dock-portrait{width:61px;height:80px}body[data-client] .dock-controls{width:168px}body[data-client] .hand-row{gap:6px}body[data-client] .hand-card.art-card{width:59px;min-width:59px}body[data-client]:has(#setup:not([hidden])) .r8-camera{right:390px}}
@media(max-width:860px){body[data-client] .r8-setup{inset:66px 16px 16px}body[data-client] .setup-console{width:324px;top:0;padding:14px 17px 10px}body[data-client] .city-selection{right:344px}body[data-client] .city-picker{grid-template-columns:1fr 1fr;gap:6px}body[data-client] .city-card{min-height:41px;font-size:12px;gap:5px;padding:5px}body[data-client] .city-heading strong{font-size:30px}body[data-client] .city-heading-label{display:none}body[data-client] .seat-row{padding:7px 0;grid-template-columns:53px minmax(0,1fr) 72px;gap:8px}body[data-client] .seat-avatar{width:53px;height:59px}body[data-client] .setup-heading h1{font-size:21px}body[data-client] .setup-heading{padding-bottom:11px}body[data-client] .setup-actions{padding-top:12px;gap:7px}body[data-client] .start-button{min-height:40px}body[data-client] .r8-hud{gap:10px;max-width:calc(100vw - 190px);left:10px;top:9px}body[data-client] #date-status{font-size:12px;padding-left:9px}body[data-client] .asset-pair{gap:10px}body[data-client] .asset-pair span{font-size:10px}body[data-client] .asset-pair strong{font-size:16px}body[data-client] .player-list{gap:2px}body[data-client] .player-chip{width:31px;height:48px}body[data-client] .player-chip img{width:29px;height:33px}body[data-client] .player-chip .player-chip-name{max-width:29px;font-size:9px}body[data-client]:has(#hud:not([hidden])) .r8-header{top:9px;right:9px}body[data-client]:has(#hud:not([hidden])) .r8-header select{max-width:74px;font-size:10px}body[data-client]:has(#hud:not([hidden])) .r8-header .icon-button{width:23px}body[data-client] #current-player{width:116px;gap:6px}body[data-client] .dock-portrait{width:49px;height:70px}body[data-client] .turn-caption strong{font-size:12px;max-width:60px}body[data-client] .turn-caption>span{font-size:10px}body[data-client] .play-dock{height:104px;gap:9px;padding:8px 10px 6px}body[data-client] .hand-card.art-card{width:54px;min-width:54px;height:78px;min-height:78px}body[data-client] .hand-card .card-art-frame,body[data-client] .hand-card .card-art-svg{height:49px}body[data-client] .hand-card .card-name{font-size:9px}body[data-client] .dock-controls{width:148px;gap:5px}body[data-client] .turn-actions .roll-button,body[data-client] .turn-actions>.primary-button{min-height:39px;font-size:14px}body[data-client] .hud-tools button{font-size:10px;padding:2px 4px;min-height:25px}body[data-client] .hud-status{width:44px;padding-left:5px}body[data-client] .hud-status select,body[data-client] .hud-status button{font-size:10px}body[data-client] .r8-camera{bottom:115px}body[data-client] .route-panel,body[data-client] .target-panel,body[data-client] .decision-panel{bottom:154px;max-height:calc(100dvh - 220px);width:315px}body[data-client]:has(#setup:not([hidden])) .r8-camera{right:360px;bottom:199px}body[data-client] .action-receipt{top:75px}body[data-client] .r8-toast{bottom:122px}}
@media(max-width:600px){body[data-client] .r8-header{inset:10px 12px auto}body[data-client] .r8-brand{font-size:14px;padding:5px 8px}body[data-client] .r8-header nav{gap:0}body[data-client] .r8-header select{max-width:80px}body[data-client] .r8-setup{inset:60px 12px 12px}body[data-client] .setup-console{top:56px;width:100%;bottom:94px;max-height:none}body[data-client] .city-selection{inset:0;display:contents}body[data-client] .city-heading{left:3px;top:0}body[data-client] .city-heading strong{font-size:30px}body[data-client] .city-picker{grid-template-columns:repeat(4,1fr);gap:5px}body[data-client] .city-card{min-height:38px;font-size:11px;gap:3px}body[data-client] .city-card>span{font-size:16px;width:17px}body[data-client] .seat-row{padding:5px 0}body[data-client] .seat-avatar{height:53px}body[data-client] .setup-scroll{justify-content:flex-start}body[data-client]:has(#setup:not([hidden])) .r8-camera{display:none}body[data-client] .r8-hud{max-width:calc(100vw - 20px);right:10px;gap:12px}body[data-client] .player-list{display:none}body[data-client]:has(#hud:not([hidden])) .r8-header{top:68px}body[data-client]:has(#hud:not([hidden])) .r8-header nav{opacity:.93}body[data-client] .asset-pair strong{font-size:18px}body[data-client] .play-dock{height:166px;display:grid;grid-template-columns:101px minmax(0,1fr) 40px;gap:4px 9px;padding:7px 10px}body[data-client] #current-player{grid-column:1;grid-row:1;width:101px}body[data-client] .dock-portrait{width:40px;height:56px}body[data-client] .hand-dock{grid-column:1/-1;grid-row:2;height:83px;min-height:0}body[data-client] .dock-controls{grid-column:2;grid-row:1;flex-direction:row;width:auto;gap:6px;align-items:center}body[data-client] .turn-actions{min-width:95px;flex:1;min-height:36px}body[data-client] .turn-actions .roll-button,body[data-client] .turn-actions>.primary-button{font-size:12px;min-height:37px;padding:6px}body[data-client] .roll-button span{font-size:20px}body[data-client] .hud-tools{display:grid;grid-template-columns:1fr 1fr;gap:2px}body[data-client] .hud-tools button{min-height:24px;font-size:10px;padding:2px 3px}body[data-client] .hud-status{grid-column:3;grid-row:1;width:40px;padding-left:4px;gap:1px}body[data-client] .r8-camera{bottom:176px}body[data-client] .route-panel,body[data-client] .target-panel,body[data-client] .decision-panel{bottom:216px;max-height:calc(100dvh - 330px);right:10px;max-width:calc(100vw - 20px)}body[data-client] .card-collection{grid-template-columns:repeat(3,minmax(0,1fr))}body[data-client] .action-receipt{top:113px}body[data-client] .r8-toast{bottom:185px}}
body[data-client] #self-player{display:flex;align-items:center;gap:12px}
body[data-client] .funds-owner{font-size:12px;font-weight:650;max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:1000px){body[data-client] .funds-owner{max-width:42px;font-size:11px}body[data-client] #self-player{gap:8px}}
@media(max-width:860px){body[data-client] .funds-owner{display:none}}
/* A short landscape window scrolls seats, never underneath fixed form controls. */
body[data-client] .setup-console>.setup-scroll{display:block;flex:1 1 0;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#bfa16d #eedfbd;scrollbar-width:thin}
body[data-client] .setup-console #seat-picker{flex:none}
@media(min-width:861px) and (max-width:1050px){body[data-client] .city-card{font-size:12px;gap:5px;padding:6px 5px}body[data-client] .city-card>span{font-size:18px;width:18px}}
@media(max-height:450px) and (min-width:601px){body[data-client] .r8-setup{top:57px;bottom:12px}body[data-client] .setup-console{padding:10px 14px 9px}body[data-client] .setup-heading{padding-bottom:8px}body[data-client] .setup-heading h1{font-size:19px}body[data-client] .setup-heading select{min-height:29px;font-size:12px}body[data-client] .setup-actions{padding-top:8px;gap:4px}body[data-client] .start-button{min-height:36px;font-size:15px}body[data-client] .setup-actions>.text-button{font-size:12px;min-height:20px}body[data-client] .seat-row{padding:7px 0;grid-template-columns:45px minmax(0,1fr) 72px}body[data-client] .seat-avatar{width:45px;height:53px}body[data-client] .city-heading{top:0}body[data-client] .city-picker{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}body[data-client] .city-card{min-height:36px;display:block;font-size:11px;padding:4px 2px;white-space:normal;line-height:1.2}body[data-client] .city-card>span{display:none}body[data-client]:has(#setup:not([hidden])) .r8-camera{display:none}}
body[data-client] .target-scroll{flex:1 1 auto;min-height:0;overflow-y:auto}
body[data-client] .route-panel{display:flex;flex-direction:column;overflow:hidden}
body[data-client] .route-panel .route-heading,body[data-client] .route-panel #route-confirm{flex:none}
body[data-client] .route-options{min-height:0;overflow-y:auto;flex:1 1 auto}
@media(max-height:450px) and (min-width:601px){
 body[data-client] .route-panel,body[data-client] .target-panel,body[data-client] .decision-panel{bottom:116px;max-height:calc(100dvh - 182px)}
 body[data-client]:has(#target-panel:not([hidden])) .r8-camera,body[data-client]:has(#route-panel:not([hidden])) .r8-camera,body[data-client]:has(#decision-panel:not([hidden])) .r8-camera{display:none}
 body[data-client] .target-panel{width:420px}
 body[data-client] .target-scroll{display:grid;grid-template-columns:92px minmax(0,1fr);grid-template-rows:auto auto;align-content:start;gap:6px 12px;padding:12px}
 body[data-client] .target-heading{grid-column:1;grid-row:1 / span 2;display:block}
 body[data-client] .target-art{width:32px}
 body[data-client] .target-art .card-art-svg{height:35px!important}
 body[data-client] .target-heading h2{font-size:14px;margin:4px 0}
 body[data-client] .target-heading p{font-size:11px;line-height:1.4;margin:0}
 body[data-client] .target-panel .target-grid{grid-column:2;grid-row:1;grid-template-columns:repeat(3,minmax(0,1fr));max-height:94px;margin:0;gap:5px;overflow-y:auto}
 body[data-client] .target-choice:has(.die-choice){min-height:36px;height:36px;padding:3px}
 body[data-client] .target-panel .die-choice{width:28px;height:28px}
 body[data-client] .target-preview{grid-column:2;grid-row:2;margin:0;padding:4px 0 0;max-height:52px;overflow-y:auto}
 body[data-client] .target-preview>strong{display:none}
 body[data-client] .card-effect-preview{margin:0}
 body[data-client] .card-effect-preview>p{font-size:11px;margin:2px 0}
 body[data-client] .target-controls{padding:8px 12px;gap:8px}
 body[data-client] .target-controls button{min-height:34px;font-size:12px;padding:6px}
 body[data-client] .route-panel{padding:12px}
 body[data-client] .route-choice{min-height:49px;padding:7px 10px}
 body[data-client] .route-choice strong{font-size:12px}
 body[data-client] .route-choice small{font-size:11px}
 body[data-client] .route-panel #route-confirm{min-height:34px;margin-top:8px;padding:6px;font-size:13px}
 body[data-client] .route-options{margin-top:8px;gap:5px}
}
@media(min-width:861px) and (min-height:701px){body[data-client] .setup-console{max-height:620px}}
@media(max-height:450px) and (min-width:601px){body[data-client] .target-panel:not(:has(.target-grid)) .target-scroll{display:block}body[data-client] .target-panel:not(:has(.target-grid)) .target-heading{display:flex;gap:12px}body[data-client] .target-panel:not(:has(.target-grid)) .target-art{flex:none}}
@media(max-width:600px){body[data-client] .setup-console{height:auto;bottom:auto;max-height:calc(100dvh - 222px)}body[data-client] .setup-console>.setup-scroll{flex:0 1 auto}}
@media(max-height:450px) and (min-width:601px){
 body[data-client] .r8-dialog[data-kind=project]{width:min(720px,calc(100vw - 24px))}
 body[data-client] .project-visit{gap:20px}
 body[data-client] .project-total{margin-bottom:8px;gap:5px}
 body[data-client] .project-total>strong{font-size:20px}
 body[data-client] .project-contributors{margin-top:12px;gap:8px}
 body[data-client] .project-risk{margin:10px 0;font-size:12px}
 body[data-client] .project-fee{font-size:13px}
 body[data-client] #project-order-form label{gap:5px;font-size:12px}
 body[data-client] #project-amount{height:38px;font-size:21px}
 body[data-client] #project-order-form .amount-shortcuts{display:none}
 body[data-client] #project-preview .balance-preview{gap:4px;margin-top:9px}
 body[data-client] #project-order-form .dialog-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:8px}
 body[data-client] #project-order-form .dialog-actions button{min-height:37px;font-size:12px;padding:6px 5px}
}
/* A character's coat/headwear colour also identifies their buildings. */
body[data-client] .seat-avatar{background:color-mix(in srgb,var(--player-color) 20%,#fff7e4);border-color:var(--player-color);border-bottom-width:3px}
body[data-client] .player-chip img,body[data-client] .dock-portrait{background:color-mix(in srgb,var(--player-color) 20%,#fff7e4)}
body[data-client] .dock-portrait{outline-color:var(--player-color)}
body[data-client] .player-chip.active{outline-color:var(--player-color)}
body[data-client] .player-chip .player-seat-number{color:var(--player-ink,#fff9ec)}
body[data-client] .parcel-owner{color:var(--owner-ink,#fff9ec)}
body[data-client] .route-choice.is-preview{border-color:var(--route-color);box-shadow:inset 0 0 0 1px var(--route-color);background:#f6e9cb}
body[data-client] .cash-shop-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0}
body[data-client] .shop-wallet{display:flex;justify-content:space-between;align-items:center;gap:14px;color:#846c47;font-size:13px}
body[data-client] .shop-wallet strong{color:#654923;font-size:17px;white-space:nowrap}
body[data-client] .cash-shop-card{padding:10px;border:1px solid #d8be8c;border-radius:8px;background:#fffbef;min-width:0}
body[data-client] .shop-card-art{height:170px;display:flex;justify-content:center}
body[data-client] .shop-card-art .card-face{display:flex;flex-direction:column;align-items:center;width:100%}
body[data-client] .shop-card-art .card-art-frame{min-height:0;flex:1;background:none;border:0;box-shadow:none;padding:0}
body[data-client] .shop-card-art .card-art-svg{height:135px;max-width:100%}
body[data-client] .shop-card-art .card-name{margin:3px 0 11px;font-size:15px;text-align:center;line-height:1.2}
body[data-client] .cash-shop-card>button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:40px;padding:8px;font-size:13px}
body[data-client] .cash-shop-card>button strong{white-space:nowrap}
body[data-client] .cash-shop-card.is-sold .shop-card-art{opacity:.46}
body[data-client] .shop-actions{display:flex;justify-content:flex-end}
body[data-client] .shop-actions button{min-width:160px}
body[data-client] .hotel-stay-roll{display:flex;align-items:center;gap:13px;margin-top:14px;padding-top:12px;border-top:1px solid #ddc79f}
body[data-client] .hotel-stay-roll .die-choice{width:42px;height:42px;flex:none}
body[data-client] .hotel-stay-roll strong{font-size:15px;color:#765731}
body[data-client] .hotel-payment-summary{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px}
body[data-client] .hotel-payment-summary .payment-line{display:block;margin:0;min-width:0}
body[data-client] .hotel-payment-summary .payment-line strong{display:block;font-size:27px;line-height:1.15}
body[data-client] .hotel-payment-summary .payment-line>span{display:block;font-size:12px;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:5px}
body[data-client] .hotel-inline-die{display:flex;align-items:center;gap:9px}
body[data-client] .hotel-inline-die .die-choice{width:34px;height:34px;flex:none}
body[data-client] .hotel-inline-die strong{font-size:12px;max-width:123px;line-height:1.5;color:#765731}
body[data-client] .turn-caption .spirit-badge{font-size:11px;font-weight:700;color:#987127}
body[data-client] .turn-caption .spirit-badge.is-poverty{color:#786289}
@media(max-width:620px){
 body[data-client] .cash-shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:12px 0}
 body[data-client] .shop-wallet{font-size:11px;gap:8px}
 body[data-client] .shop-wallet strong{font-size:14px}
 body[data-client] .cash-shop-card{padding:7px}
 body[data-client] .shop-card-art{height:126px}
 body[data-client] .shop-card-art .card-art-svg{height:96px}
 body[data-client] .shop-card-art .card-name{font-size:13px;margin-bottom:7px}
 body[data-client] .cash-shop-card>button{font-size:12px;min-height:37px}
}
@media(max-height:500px) and (min-width:621px){
 body[data-client] #dialog[data-kind="shop"] #dialog-body{padding:10px 16px}
 body[data-client] .cash-shop-grid{gap:9px;margin:7px 0}
 body[data-client] .cash-shop-card{padding:6px}
 body[data-client] .shop-card-art{height:83px}
 body[data-client] .shop-card-art .card-art-svg{height:60px}
 body[data-client] .shop-card-art .card-name{font-size:12px;margin:2px 0 4px}
 body[data-client] .cash-shop-card>button{min-height:33px;padding:5px 7px;font-size:12px}
 body[data-client] .shop-actions{margin-top:6px}
 body[data-client] .shop-actions button{min-height:34px;padding:6px 10px}
}

@media(max-width:600px){body[data-client] .turn-caption{gap:3px}body[data-client] .turn-caption>span{font-size:10px;line-height:1.2;white-space:nowrap}body[data-client] .turn-caption .spirit-badge,body[data-client] .turn-caption .bomb-badge{font-size:10px}}