/* Warm cream, emerald and gold: the playable 3D presentation. */
:root{--green:#07685d;--orange:#efb937;color:#183f3b;background:#fff9eb}body{background:#fff9eb}.workspace{background:#fff9eb}.topbar{background:#fffbee;border-color:#e8ddbb}.brand{background:linear-gradient(140deg,#099b85,#005e58);box-shadow:0 3px 0 #c4b26d}.brand-word{color:#087d70}.sidebar{background:#fffbed;border-color:#e9dfbf}.nav-item.active{background:linear-gradient(150deg,#0baf98,#00766d);color:#fff5d4;box-shadow:inset 0 0 0 1px #31bfaa}.nav-item.active:before{background:#dbb557}.wordmark{color:#08685d}.coin-symbol{background:#ffe09a;border-color:#eabb50;color:#bd8a2d}.wallet strong{color:#173c39}.level-medal{background:#0b8b7b;color:#ffefb5}.xp-bar i{background:linear-gradient(90deg,#00a990,#7edbbc)}.avatar{overflow:hidden;background:#039b89;border-color:#eed48c;position:relative}.avatar>img{height:170px;width:170px;position:absolute;max-width:none;top:-20px;left:-65px}.music-button{width:34px;height:34px;min-width:34px;border:1px solid #e4d09b;background:#fff4cc;border-radius:50%;color:#0a796c;font-size:19px}.primary{background:linear-gradient(#ffdc58,#ffc231 50%,#f2ae22);color:#27514a;border:1px solid #e8b02b;box-shadow:inset 0 2px 0 #fff4ae,0 4px 0 #bd842d33,0 6px 16px #ca8c231c;text-shadow:0 1px #ffe8a8}.primary:hover:not(:disabled){background:linear-gradient(#ffe47b,#ffcb3e 50%,#f5b830)}.secondary{background:#fff9e7;color:#13766b;border-color:#cfdfc7}.modal{background:#fffaee;border-color:#f4dfaa;box-shadow:0 30px 120px #17382c66}.modal-header h2{color:#154b43}.modal-backdrop{background:#052f34a1}.property-modal-top{gap:15px}.large-building{width:150px;height:150px;background:radial-gradient(#fff2ce,#dfeccb);border-radius:18px}.building-render{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 7px 6px #23372615)}.turn-content>.building-render{height:120px;width:170px;margin:-12px auto 10px}.portfolio-banner>.building-render,.collection-intro>.building-render{height:150px;width:175px;flex-shrink:0}.property-art{background:radial-gradient(ellipse at 50% 65%,#c4dac3,#f1ecd3);height:180px}.property-art>.building-render{height:175px;width:190px}.property-art>span{background:#fff8e8dc;color:#26766a}.property-info h3{color:#0b675b}.property-card{background:#fffcf0;border-color:#eadfbc}.portfolio-banner,.collection-intro{background:linear-gradient(120deg,#d6e7cd,#f3edcc);border-color:#dfdcb8}.story-cover{height:185px;background:#00594f;overflow:hidden}.story-cover>img{width:100%;height:100%;object-fit:cover}.story-cover>span{color:#fff3d4;background:#006d61d9;padding:5px 10px;border-radius:7px;font-size:15px}.story-scene-art{height:240px;background:#075647;overflow:hidden;border-radius:14px}.story-scene-art>img{width:100%;height:100%;object-fit:cover}.story-scene-art>span{background:#07594bba;color:#ffebba;padding:5px 10px;border-radius:5px}.story-dialogue .section-kicker{color:#558c79}.speaker>span{color:#fff5d4;background:#118e7d;border:2px solid #e6bd65}.speaker>b{color:#085e51}.dialogue-text{color:#375d4b}.story-choices>.secondary{background:#edf6e9;border:1px solid #54ab92;color:#176454}.audio-slider{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid #e8e3cc;gap:15px;font-size:12px;color:#557966}.audio-slider input{accent-color:#078c79;width:170px;max-width:50%}body[data-screen=city] .workspace main{padding:0;max-width:none}body[data-screen=city] .page-title{display:none}body[data-screen=city] .game-layout{position:relative;display:block}body[data-screen=city] .city-card{border:0;border-radius:0;background:#c0d9d5;overflow:hidden;position:relative}body[data-screen=city] .map-wrap{height:calc(100dvh - 105px);min-height:720px;margin:0;padding:0;background:#b4d2d4;display:block;overflow:hidden}#city-3d{display:block!important;width:100%;height:100%;touch-action:none;outline:none}body[data-screen=city] .map-toolbar{position:absolute;left:24px;top:20px;z-index:2;padding:12px 17px;background:#fffbebeb;border:1px solid #fff5d1;border-radius:15px;box-shadow:0 4px 18px #19443520;gap:25px;backdrop-filter:blur(8px)}body[data-screen=city] .map-title>.icon{background:#0d907e;color:#fff0ba}body[data-screen=city] .map-title b{color:#0a6259;font-size:15px}body[data-screen=city] .map-title span{color:#68937c}body[data-screen=city] .weather{color:#396e5d}body[data-screen=city] .weather i{color:#81936b}body[data-screen=city] .play-panel{position:absolute;right:23px;top:20px;width:285px;gap:12px;display:flex;z-index:3}body[data-screen=city] .turn-card{background:#fffbedea;border:1px solid #f2e2b9;backdrop-filter:blur(12px);box-shadow:0 8px 30px #214c3a25}body[data-screen=city] .turn-top{padding:17px 19px 10px;color:#37705b}body[data-screen=city] .turn-top>span{color:#6c8b6a}body[data-screen=city] .turn-content{padding:15px 19px 19px}body[data-screen=city] .turn-content h2{font-size:18px;color:#195d4d}body[data-screen=city] .turn-content p{font-size:11px;color:#77916e}body[data-screen=city] .turn-illustration{height:50px;margin:5px auto 14px}body[data-screen=city] .turn-illustration>.icon:first-child{height:47px;width:47px;background:#fff8df;color:#687b63}body[data-screen=city] .roll-button{font-size:17px;min-height:53px;border-radius:15px}body[data-screen=city] .focus-row{padding:10px 19px;background:#f8f1d8;border-color:#ede2bd}body[data-screen=city] .idle-card{background:#0c7e6beF;color:#fff6cd;border-color:#69b69a;box-shadow:0 4px 17px #174e3d20;backdrop-filter:blur(10px)}body[data-screen=city] .idle-card b{font-size:10px}body[data-screen=city] .idle-card small{color:#b6dabb}body[data-screen=city] .idle-card strong small{color:#e2d695}body[data-screen=city] .idle-icon{background:#1e9278;color:#f4d579}body[data-screen=city] .next-quest{background:#fff9e8ed;border-color:#f4dfad;backdrop-filter:blur(10px)}body[data-screen=city] .next-quest h3{color:#155f51}body[data-screen=city] .next-quest p{color:#7a936e}body[data-screen=city] .session-label{color:#f6f5d0;background:#285e4ac9;padding:7px 10px;border-radius:9px;backdrop-filter:blur(10px);font-size:9px}body[data-screen=city] .city-metrics{position:absolute;bottom:23px;left:23px;max-width:570px;width:calc(100% - 350px);border:1px solid #ffedbe;background:#fff9e8e8;border-radius:15px;backdrop-filter:blur(10px);box-shadow:0 5px 15px #164a3820}body[data-screen=city] .city-metrics b{color:#096d5b}body[data-screen=city] .map-bottom{position:absolute;left:24px;bottom:120px;z-index:2;background:#fffae5d9;padding:8px 13px;border-radius:10px;backdrop-filter:blur(10px)}body[data-screen=city] footer{display:none}.world-controls{position:absolute;left:22px;top:104px;z-index:2;display:flex;flex-direction:column;gap:7px}.world-controls button{width:37px;height:37px;border-radius:10px;border:1px solid #ffe4a6;background:#fffae7e8;color:#0a7768;font-size:21px;box-shadow:0 4px 10px #183c3020;backdrop-filter:blur(8px)}.world-loader{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);background:#fff9e5eF;padding:20px 30px;border:1px solid #e9d4a1;border-radius:15px;color:#087b68;z-index:2;font-size:14px;box-shadow:0 10px 35px #183c3020}.tile-access-list{position:absolute;left:75px;top:110px;z-index:5;max-width:200px}.tile-access{width:1px;height:1px;position:absolute;overflow:hidden;clip-path:inset(50%);padding:0;border:0;opacity:0}.tile-access:focus-visible{width:50px;height:42px;position:relative;clip-path:none;opacity:1;border:2px solid #e1b34b;background:#fff6dc;border-radius:10px;font-size:12px}.dice-options{gap:9px}.die-choice{background:#f7f0d7;border-color:#ddd7ab}.die-choice b{color:#2e6e5a}.die{background:#fffaf0;border-color:#c6b489;box-shadow:0 4px 0 #c4b58b}.die i.dot{background:#366957}.price-box{background:#f6efd9;border-color:#e8d9b1}.type-tab.selected{background:#0c947d;border-color:#58b697;color:#fff2c6}.type-tab.selected small{color:#c6e6c5}.notice{background:#fff0ce!important;color:#b08b35!important}#toast{background:#086c5d;color:#fff2c9;border-color:#64b497}.quest-row{background:#fffcf1;border-color:#e9ddbd}.quest-num{background:#fff0c5;color:#b99233}.completed .quest-num{background:#058573;color:#fff3c9}.contracts{background:#e9f0d9;border-color:#c6d9b8}.contract-progress i{background:linear-gradient(90deg,#009985,#6ccbb1)}.contract-card .pill{background:#cde6cd;color:#24765d}.quest-row .reward{color:#ac8528}.quiet{color:#7c9574}@media(min-width:1600px){body[data-screen=city] .play-panel{width:320px;right:30px}body[data-screen=city] .turn-content{padding:22px}body[data-screen=city] .turn-content p{font-size:12px}body[data-screen=city] .turn-illustration{height:70px}}
@media(max-width:1150px) and (min-width:901px){body[data-screen=city] .map-wrap{min-height:850px}body[data-screen=city] .play-panel{width:265px}body[data-screen=city] .map-toolbar{gap:12px;left:15px}body[data-screen=city] .map-title span{font-size:8px}body[data-screen=city] .map-toolbar .weather i{display:none}body[data-screen=city] .city-metrics{width:calc(100% - 330px);left:15px}.top-stats{gap:16px}}
@media(max-width:900px){.workspace main{padding:22px 15px 15px}.topbar{height:76px;padding:0 12px;gap:7px}.top-stats{gap:8px}.wordmark{font-size:19px}.wordmark span{font-size:6px}.wallet strong{font-size:20px}.avatar{width:34px;height:34px}.avatar>img{width:140px;height:140px;left:-53px;top:-17px}.music-button{width:30px;height:30px;min-width:30px}.sidebar{height:72px;background:#fff9e9ed;border-top:1px solid #e5d4a1}.nav-item.active{box-shadow:inset 0 2px 0 #49c6ac,0 2px 0 #c2a24e33}.nav-item span{font-weight:600}.workspace{padding-bottom:72px}body[data-screen=city] .workspace{padding-bottom:72px}body[data-screen=city] .map-wrap{height:calc(100svh - 148px);min-height:620px}body[data-screen=city] .map-toolbar{left:12px;right:12px;top:12px;padding:10px 12px;border-radius:12px;gap:5px;justify-content:space-between}body[data-screen=city] .map-title b{font-size:13px}body[data-screen=city] .map-title span{font-size:8px}body[data-screen=city] .weather{font-size:10px}body[data-screen=city] .weather i{font-size:7px}body[data-screen=city] .world-controls{left:auto;right:12px;top:87px;gap:6px}body[data-screen=city] .world-controls button{width:32px;height:32px;font-size:19px}body[data-screen=city] .play-panel{position:absolute;right:12px;left:12px;top:auto;bottom:14px;width:auto;gap:0;display:block}body[data-screen=city] .turn-card{border-radius:18px;background:#fff9e9eb;box-shadow:0 5px 25px #133c3d44}body[data-screen=city] .turn-top{padding:10px 15px 7px;font-size:10px}body[data-screen=city] .turn-top b{font-size:10px}body[data-screen=city] .turn-dots{padding:0 15px;gap:4px}body[data-screen=city] .turn-dots i{height:3px}body[data-screen=city] .turn-content{padding:10px 15px 10px}body[data-screen=city] .turn-content .turn-illustration{display:none}body[data-screen=city] .turn-content h2{font-size:14px;margin:0 0 7px}body[data-screen=city] .turn-content p{font-size:10px;margin-bottom:10px;line-height:1.7}body[data-screen=city] .turn-content:has(.roll-button) h2,body[data-screen=city] .turn-content:has(.roll-button) p{display:none}body[data-screen=city] .roll-button{font-size:22px;min-height:54px;padding:8px;border-radius:13px;margin:0}body[data-screen=city] .roll-button .icon{height:25px;width:25px}body[data-screen=city] .focus-row{padding:6px 15px;font-size:9px}body[data-screen=city] .focus-row b{font-size:12px}body[data-screen=city] .idle-card,body[data-screen=city] .next-quest{display:none}body[data-screen=city] .session-label{font-size:7px;border-radius:0 0 7px 7px;width:fit-content;margin:0 auto;padding:3px 10px;line-height:1.5}body[data-screen=city] .city-metrics{bottom:auto;top:88px;left:12px;width:calc(100% - 68px);max-width:none;background:#fff7e5c9;border-color:#fff3d1;gap:0;padding:8px 3px;border-radius:10px}body[data-screen=city] .city-metrics span{font-size:7px}body[data-screen=city] .city-metrics b{font-size:13px;margin:0}body[data-screen=city] .city-metrics b small{font-size:7px}body[data-screen=city] .city-metrics .icon{display:none}body[data-screen=city] .map-bottom{display:none}body[data-screen=city] .turn-content>.building-render{display:none}body[data-screen=city] .turn-content:has(.building-render){display:grid;grid-template-columns:1fr 1fr;gap:6px 8px;align-items:center}body[data-screen=city] .turn-content:has(.building-render) h2,body[data-screen=city] .turn-content:has(.building-render) p{grid-column:span 2}body[data-screen=city] .turn-content:has(.building-render)>.primary,body[data-screen=city] .turn-content:has(.building-render)>.secondary{margin:0;font-size:11px;min-height:40px;padding:8px 5px}body[data-screen=city] .turn-content>.text-button{display:none}body[data-screen=city] .event-symbol{font-size:30px;line-height:1;margin-bottom:8px}body[data-screen=city] .summary-stats{margin-bottom:12px}body[data-screen=city] .summary-stats>span{font-size:9px;padding:6px}body[data-screen=city] .summary-stats b{font-size:14px}body[data-screen=city] .die-choice{padding:9px 5px}.die-choice b{font-size:10px}.die-choice small{font-size:9px}.die{height:43px;width:43px;padding:8px;gap:3px;margin-bottom:9px}.dice-options{gap:10px;margin-bottom:6px}body[data-screen=city] .route-row{margin-top:9px}.route-row .chip{padding:6px 12px;font-size:10px}.ability-hint{font-size:8px;margin:5px 0 9px}.modal{padding:20px 17px}.large-building{height:130px;width:130px}.story-scene-art{height:230px}.story-dialogue>.section-kicker{font-size:10px}.dialogue-text{font-size:14px;min-height:75px}.property-art{height:145px}.property-art>.building-render{height:145px;width:160px}.portfolio-banner>.building-render,.collection-intro>.building-render{display:none}.story-cover{height:135px}.audio-slider{font-size:11px}#toast{bottom:85px}.world-loader{font-size:12px;white-space:nowrap}.tile-access-list{left:10px;top:150px}}

.avatar>img{width:100%;height:100%;left:0;top:0;object-fit:cover}.speaker>span{overflow:hidden}.speaker>span>img{width:100%;height:100%;object-fit:cover}

.reward-burst{position:fixed;left:50%;top:62%;z-index:150;pointer-events:none}.reward-burst i{position:absolute;display:block;width:9px;height:13px;border-radius:2px;background:var(--c);animation:reward-fly 1.25s ease-out forwards}@keyframes reward-fly{0%{transform:translate(0,0) rotate(0);opacity:1}80%{opacity:1}100%{transform:translate(var(--x),var(--y)) rotate(var(--r));opacity:0}}.dice-options .die{animation:die-arrive .5s ease-out}@keyframes die-arrive{0%{transform:translateY(-10px) rotate(-25deg);opacity:.3}60%{transform:translateY(2px) rotate(8deg)}100%{transform:none;opacity:1}}
/* v0.5: larger, tactile emerald and gold controls over the riverside diorama. */
body[data-screen=city] .topbar{background:linear-gradient(110deg,#fff9e6f5,#fffdf3f5);box-shadow:0 2px 22px #143f3620;border-bottom:1px solid #e8cf8b}
.topbar .avatar{width:57px;height:57px;box-shadow:0 0 0 3px #e0bf6a,0 4px 12px #0a6c5b33;border:3px solid #fff2d1}.wallet{background:#fffdf5;border:1px solid #efdfb8;padding:8px 17px;border-radius:16px}.coin-symbol{box-shadow:inset 0 0 0 3px #ffe8a2,0 2px 4px #9b691b22}.level-medal{border:2px solid #d6b251;box-shadow:inset 0 0 0 2px #ffffff35}.nav-item{transition:background .2s,transform .2s}.nav-item.active{border:1px solid #00a792;box-shadow:inset 0 2px 0 #8aead477,0 4px 10px #00685426}
body[data-screen=city] .map-toolbar{border:1px solid #fff1c1;border-radius:25px;padding:11px 20px;box-shadow:0 5px 20px #164b3a24,inset 0 1px #fff}.world-controls button{border-radius:50%;width:40px;height:40px;border:2px solid #e9d6a1;box-shadow:0 3px 9px #14432d26,inset 0 1px #fff}
body[data-screen=city] .play-panel{top:auto;bottom:26px;width:280px;gap:12px}body[data-screen=city] .turn-card{border-radius:23px;border:2px solid #e8cb82;background:linear-gradient(150deg,#fffdf3f2,#fff3dbeF);box-shadow:0 8px 25px #153c3c30,inset 0 1px #fff}body[data-screen=city] .turn-top{font-size:12px}body[data-screen=city] .turn-content p{font-size:12px;line-height:1.8}body[data-screen=city] .turn-content h2{font-size:20px}body[data-screen=city] .turn-illustration{display:none}body[data-screen=city] .turn-content:has(.roll-button){padding-top:4px}body[data-screen=city] .roll-button{font-size:24px;min-height:70px;border-radius:23px;color:#fff9d9;text-shadow:0 2px #03594c;background:radial-gradient(ellipse at 50% 0%,#43e1b5 0%,#04aa8c 38%,#007d70 80%);border:3px solid #ebd38c;box-shadow:inset 0 3px 2px #a1fff4b0,inset 0 -5px 8px #004b4d55,0 5px 0 #a58642,0 9px 20px #003c3b30}body[data-screen=city] .roll-button:hover:not(:disabled){background:radial-gradient(ellipse at 50% 0%,#79ffdb,#12b99a 45%,#008c78)}body[data-screen=city] .roll-button .icon{width:32px;height:32px}body[data-screen=city] .next-quest{border-radius:18px;border:1px solid #f5e3b3;box-shadow:0 5px 16px #123a2f20}body[data-screen=city] .next-quest h3{font-size:15px}body[data-screen=city] .next-quest p{font-size:11px;line-height:1.7}body[data-screen=city] .idle-card{border-radius:18px;border:1px solid #d7c582}body[data-screen=city] .idle-card b{font-size:11px}body[data-screen=city] .city-metrics{border-radius:19px;box-shadow:0 5px 20px #204b3526;bottom:26px}body[data-screen=city] .map-bottom{bottom:115px}body[data-screen=city] .city-metrics span{font-size:10px}
@media(min-width:1160px){body[data-screen=city] .play-panel .next-quest{order:-2}body[data-screen=city] .play-panel .idle-card{order:-1}body[data-screen=city] .play-panel .session-label{display:none}body[data-screen=city] .map-wrap{min-height:690px}body[data-screen=city] .turn-content:has(.roll-button)>p{margin-bottom:12px}}
@media(max-width:900px){.topbar .avatar{height:42px;width:42px;min-width:42px;border-width:2px;box-shadow:0 0 0 2px #d5ba72}.wallet{padding:4px 9px;border-radius:13px}.wallet strong{font-size:18px}.wordmark{font-size:17px}.level-block{gap:5px}.top-stats{gap:9px}.topbar{padding:0 10px}body[data-screen=city] .map-toolbar{padding:9px 13px;border-radius:20px}body[data-screen=city] .play-panel{left:10px;right:10px;bottom:12px;width:auto}body[data-screen=city] .turn-content{padding:8px 12px 10px}body[data-screen=city] .turn-content h2{font-size:16px}body[data-screen=city] .turn-content p{font-size:11px}body[data-screen=city] .turn-top{font-size:10px;padding:8px 14px 6px}body[data-screen=city] .roll-button{font-size:26px;min-height:64px;border-radius:21px}body[data-screen=city] .city-metrics{bottom:auto;padding:7px 2px;border-radius:13px}body[data-screen=city] .city-metrics span{font-size:7px}.world-controls button{width:32px;height:32px}.music-button{min-width:28px;width:28px}body[data-screen=city] .map-wrap{min-height:610px}}
@media(prefers-reduced-motion:reduce){.nav-item{transition:none}}
/* Keep the board visible while choosing a die, and fully reveal it during movement. */
body[data-screen=city] .play-panel{bottom:18px;right:18px;width:290px}
body[data-screen=city] .play-panel>.idle-card,body[data-screen=city] .play-panel>.session-label{display:none}
body[data-screen=city] .play-panel>.next-quest{position:fixed;top:196px;left:118px;width:260px;padding:12px 15px;background:#fff8e8e8}
body[data-screen=city] .play-panel>.next-quest .section-kicker,body[data-screen=city] .play-panel>.next-quest p,body[data-screen=city] .play-panel>.next-quest .reward{display:none}
body[data-screen=city] .play-panel>.next-quest h3{font-size:13px;margin:0 0 5px}
body[data-screen=city] .play-panel>.next-quest .quest-bottom{margin:0;justify-content:flex-end}
body[data-screen=city] .turn-content:has(.roll-button)>h2,body[data-screen=city] .turn-content:has(.roll-button)>p{display:none}
body[data-screen=city] .turn-content:has(.roll-button){padding:10px 12px 15px}
body[data-screen=city] .turn-top{padding:10px 14px 8px;font-size:11px}
body[data-screen=city] .turn-content>p{line-height:1.65;margin-bottom:9px}
body[data-screen=city][data-turn=CHOOSE_DIE] .turn-card{background:#fff9eaf0}
body[data-screen=city][data-turn=CHOOSE_DIE] .turn-content{padding:8px 12px 12px}
body[data-screen=city][data-turn=CHOOSE_DIE] .turn-content>h2{font-size:14px;margin-bottom:8px}
body[data-screen=city][data-turn=CHOOSE_DIE] .turn-content>p,body[data-screen=city][data-turn=CHOOSE_DIE] .ability-hint{display:none}
body[data-screen=city][data-turn=CHOOSE_DIE] .die-choice{display:grid;grid-template-columns:44px 1fr;align-items:center;gap:3px 6px;text-align:left;padding:9px 7px;border-radius:14px}
body[data-screen=city][data-turn=CHOOSE_DIE] .die-choice .die{grid-row:span 2;width:40px;height:40px;margin:0;padding:7px;gap:3px}
body[data-screen=city][data-turn=CHOOSE_DIE] .die-choice b{font-size:11px}
body[data-screen=city][data-turn=CHOOSE_DIE] .die-choice small{font-size:9px}
body[data-screen=city][data-turn=CHOOSE_DIE] .dice-options{gap:7px;margin:0}
body[data-screen=city][data-turn=TILE_DECISION] .turn-content>.building-render{float:left;width:90px;height:90px;margin:-8px 9px 0 -8px}
body[data-screen=city][data-turn=TILE_DECISION] .turn-content h2{font-size:16px}
body[data-screen=city][data-turn=TILE_DECISION] .turn-content>.primary,body[data-screen=city][data-turn=TILE_DECISION] .turn-content>.secondary{min-height:42px;padding:8px 12px;font-size:13px;clear:both}
.movement-status,.roll-status{display:none;position:absolute;z-index:8;left:50%;top:24px;transform:translateX(-50%);padding:10px 25px;border:1px solid #a6e9ca;border-radius:25px;color:#fff8d8;background:#086858ed;box-shadow:0 5px 25px #003a3c35;font-size:15px;pointer-events:none}
body.is-moving .movement-status,body.is-rolling .roll-status{display:block}
body.is-moving .play-panel,body.is-rolling .play-panel,body.is-moving .city-metrics,body.is-rolling .city-metrics,body.is-moving .map-bottom,body.is-rolling .map-bottom,body.is-moving .map-toolbar,body.is-rolling .map-toolbar,body.is-moving .world-controls,body.is-rolling .world-controls{visibility:hidden;pointer-events:none!important}
@media(min-width:901px){body[data-screen=city][data-turn=CHOOSE_DIE] .play-panel{width:355px}body[data-screen=city] .city-metrics{max-width:440px;width:calc(100% - 360px)}}
@media(max-width:900px){body[data-screen=city] .play-panel{left:10px;right:10px;bottom:12px;width:auto}body[data-screen=city] .play-panel>.next-quest{display:none}body[data-screen=city] .turn-content:has(.roll-button){padding:8px 10px 12px}body[data-screen=city][data-turn=CHOOSE_DIE] .turn-content>h2{display:none}body[data-screen=city][data-turn=CHOOSE_DIE] .die-choice{grid-template-columns:44px 1fr;padding:8px}body[data-screen=city][data-turn=CHOOSE_DIE] .die-choice b{font-size:12px}body[data-screen=city][data-turn=CHOOSE_DIE] .route-row{margin-top:7px}body[data-screen=city][data-turn=CHOOSE_DIE] .turn-content>.secondary{font-size:10px;margin-top:6px;padding:7px;min-height:30px}body[data-screen=city][data-turn=TILE_DECISION] .turn-content>.building-render{display:none}body[data-screen=city][data-turn=TILE_DECISION] .turn-content{padding:10px 12px}body[data-screen=city][data-turn=TILE_DECISION] .turn-content h2{font-size:15px}body[data-screen=city][data-turn=TILE_DECISION] .turn-content>p{font-size:11px}body[data-screen=city] .city-metrics{top:84px;padding:6px 2px}.movement-status,.roll-status{top:16px;font-size:13px;padding:9px 20px;white-space:nowrap}}
@media(min-width:901px){body[data-screen=city] .play-panel>.next-quest{left:174px;width:220px}body[data-screen=city]:not([data-turn=READY]) .play-panel>.next-quest{display:none}}
/* The game viewport fits the actual app panel, including short desktop windows. */
body[data-screen=city] .map-wrap{min-height:0!important;height:calc(100dvh - 105px)}
@media(max-width:900px){body[data-screen=city] .map-wrap{min-height:0!important;height:calc(100svh - 148px)}}
@media(min-width:901px) and (max-height:760px){body[data-screen=city] .play-panel{width:265px;bottom:12px;right:12px}body[data-screen=city] .turn-content{padding:10px 13px 13px}body[data-screen=city] .turn-content h2{font-size:16px}body[data-screen=city] .city-metrics{bottom:12px;padding:12px;max-width:410px}body[data-screen=city] .map-bottom{bottom:100px}body[data-screen=city][data-turn=CHOOSE_DIE] .play-panel{width:340px}}
@media(max-width:900px) and (max-height:700px){body[data-screen=city] .city-metrics{display:none}body[data-screen=city] .turn-top{padding:6px 12px;font-size:9px}body[data-screen=city] .focus-row{padding:4px 12px;font-size:8px}body[data-screen=city][data-turn=TILE_DECISION] .turn-content:has(.building-render){padding:7px 12px;gap:5px 8px}body[data-screen=city][data-turn=TILE_DECISION] .turn-content:has(.building-render)>p{display:none}body[data-screen=city][data-turn=TILE_DECISION] .turn-content:has(.building-render)>h2{font-size:14px;margin:0 0 3px}body[data-screen=city][data-turn=TILE_DECISION] .turn-content:has(.building-render)>.primary,body[data-screen=city][data-turn=TILE_DECISION] .turn-content:has(.building-render)>.secondary{min-height:36px;padding:6px 10px;font-size:12px}}

/* Regional journeys */
.city-switch{border:1px solid #e9dbb6;border-radius:20px;background:#fff8e7;color:#125e59;padding:7px 12px;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap}
.journey-intro{padding:20px 0}.journey-intro h2{font-size:32px;color:#144e4b;margin:8px 0}.journey-intro p{color:#66756a}.journey-progress{background:#e6f3ea;border:1px solid #bed8c9;border-radius:14px;padding:12px;color:#246357;margin:12px 0;font-size:14px}
.destination-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;padding-bottom:35px}.destination{border-radius:24px;overflow:hidden;background:#fffaf0;border:1px solid #e6d8bb;box-shadow:0 12px 30px #264f3a12}.destination-art{height:230px;background:linear-gradient(145deg,#77ada7,#193e51);position:relative;overflow:hidden}.destination.phuket .destination-art{background:linear-gradient(145deg,#43d7de,#e9d39c)}.destination.ayutthaya .destination-art{background:linear-gradient(145deg,#a9b88b,#ae7755)}.destination-art img{width:100%;height:100%;object-fit:cover}.destination-art:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#153a39c9)}.destination-art span,.destination-art b{position:absolute;z-index:1;color:#fff7df;left:20px}.destination-art span{top:16px;letter-spacing:2px;font-size:11px}.destination-art b{bottom:16px;font-size:32px}.destination-copy{padding:22px}.destination-copy h3{margin:9px 0;color:#145e58}.destination-copy p{font-size:14px;line-height:1.8}.destination-copy small{display:block;color:#648477;margin:10px 0}.unlock-goal{background:#f1ead8;padding:12px;border-radius:12px}.destination-copy button{margin-top:9px}.preview-notice{padding:8px}.preview-notice h2{font-size:20px}.preview-notice p{font-size:13px}.preview-notice button{margin-top:6px}.buff-status{color:#087668;background:#e0f3df;padding:12px;border-radius:12px}
body[data-city=phuket] .weather{color:#126b86}body[data-city=ayutthaya] .weather{color:#8c633d}
@media(max-width:1000px){.destination-grid{grid-template-columns:1fr}.destination{display:grid;grid-template-columns:40% 60%}.destination-art{height:100%;min-height:260px}.map-toolbar{gap:5px}.city-switch{padding:6px 8px;font-size:11px}.weather i{display:none}}
@media(max-width:550px){.destination{display:block}.destination-art{height:190px;min-height:0}.journey-intro h2{font-size:26px}.map-toolbar .weather{display:none}.map-title span{font-size:10px}.destination-copy{padding:18px}}
.rivals-hud{position:absolute;z-index:3;left:170px;top:96px;display:flex;align-items:center;gap:9px;padding:8px 14px;background:#fff9e9ee;border:1px solid #f6deb0;border-radius:18px;color:#215c56;box-shadow:0 4px 14px #244c4114;cursor:pointer;text-align:left}.rivals-hud b{display:block;font-size:12px}.rivals-hud small{display:block;font-size:10px;margin-top:3px;color:#6c8068}.rival-faces{display:flex;padding-left:6px}.rival-faces img{width:30px;height:30px;object-fit:cover;object-position:center 20%;border-radius:50%;border:2px solid;margin-left:-6px;background:#e3f0de}.rival-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid #e4ddc4;padding:13px 0}.rival-row>img{width:42px;height:42px;object-fit:cover;object-position:center 20%;border:2px solid;border-radius:50%;background:#e3f0de}.rival-row>div{flex:1}.rival-row small{display:block;font-size:10px;color:#7a8a75;line-height:1.6}.rival-row>span{font-weight:700;text-align:right}.branch-options{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;margin:7px 0}.branch-options .chip{font-size:10px;padding:6px 8px;min-height:32px}.is-moving .rivals-hud,.is-rolling .rivals-hud{visibility:hidden}
@media(max-width:900px){.rivals-hud{left:70px;top:82px;padding:6px 10px;border-radius:12px}.rivals-hud b{font-size:11px}.rivals-hud small{font-size:9px}.rival-faces img{width:25px;height:25px}.rival-row{gap:6px}.rival-row>img{width:32px;height:32px}.rival-row>span{font-size:13px}body[data-screen=city][data-turn=CHOOSE_DIE] .play-panel{max-height:48svh;overflow:auto}.branch-options{margin:4px 0}}

body[data-screen=city] .next-quest{display:none!important}.rivals-hud{z-index:8}

.preview-notice{background:#fff9ecef;border:1px solid #f2e0b3;border-radius:18px;padding:15px;color:#245b53;box-shadow:0 6px 18px #102d3020}.preview-notice h2{color:#145d56}.preview-notice p{color:#557b6d;line-height:1.6}

body[data-screen=travel] .page-title{display:none}.city-map-comparison{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.city-map-comparison button{padding:0 0 12px;overflow:hidden;border:1px solid #d8d8b8;border-radius:16px;background:#fffbef;cursor:pointer;color:#175f58;text-align:left;box-shadow:0 5px 15px #265c4310}.city-map-comparison img{width:100%;height:190px;object-fit:cover;display:block}.city-map-comparison b,.city-map-comparison small{display:block;margin:8px 12px 0}.city-map-comparison small{font-size:11px;color:#738471}.city-map-comparison button:hover{border-color:#009c88;transform:translateY(-2px)}
@media(max-width:900px){.city-map-comparison{gap:7px;margin:12px 0}.city-map-comparison img{height:130px}.city-map-comparison b{font-size:14px}.city-map-comparison small{font-size:9px;margin:6px 8px 0}.journey-intro{padding-top:8px}.journey-intro h2{font-size:24px}.journey-intro>p{font-size:12px}.city-map-comparison button{border-radius:12px}}
@media(max-width:500px){.city-map-comparison img{height:92px}.city-map-comparison b{font-size:12px;margin:7px 7px 0}.city-map-comparison small{display:none}}

#quality-setting{max-width:58%;padding:9px 10px;border:1px solid #b7d2bf;border-radius:10px;background:#fffaf0;color:#175d55;font:inherit;}
