/* Miyora City gameplay, scoped to the new panels and café dialog. */
#cityGameOverview,#cityGameActivities,#cityCafeGame { --cg-ink:#fce3f0; --cg-muted:#c698b4; --cg-line:rgba(240,147,195,.19); --cg-panel:#281020; --cg-accent:#ffa6d2; --cg-gold:#f6d68c; color:var(--cg-ink); font-family:var(--font-body,sans-serif); }
#cityGameOverview [hidden],#cityGameActivities [hidden],#cityCafeGame [hidden] { display:none!important; }
.cg-city-progress-panel { display:grid; grid-template-columns:minmax(230px,1.25fr) minmax(185px,1fr) minmax(220px,1fr); gap:22px; padding:24px; margin:0 0 24px; border:1px solid var(--cg-line); border-radius:22px; background:radial-gradient(ellipse at 7% 0,rgba(191,74,146,.15),transparent 55%),linear-gradient(130deg,#2d1227,#20101f); box-shadow:0 12px 35px #12071140; }
.cg-city-rank { display:flex; gap:16px; align-items:center; }
.cg-city-level { position:relative; display:grid; place-items:center; flex-shrink:0; width:64px; height:72px; border:1px solid #ffb6d944; border-radius:20px 20px 26px 26px; color:#ffd2ea; background:linear-gradient(150deg,#723251,#3d203e); }
.cg-city-level i { position:absolute; top:10px; font-size:13px; opacity:.65; }
.cg-city-level strong { margin-top:14px; font:700 29px var(--font-display,sans-serif); }
.cg-city-rank > div:last-child { flex:1; }
.cg-city-rank span,.cg-city-eyebrow { color:var(--cg-accent); font-size:10px; letter-spacing:.11em; font-weight:800; }
.cg-city-rank h2 { margin:5px 0; font-size:21px; }
.cg-city-rank p { color:var(--cg-muted); font-size:11px; margin:5px 0 10px; }
.cg-city-xp { height:5px; overflow:hidden; border-radius:99px; background:#0e070f; }
.cg-city-xp > span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#bd75c9,#ffa6d2); transition:width .4s ease; }
.cg-city-supplies { display:flex; gap:12px; align-items:center; border-left:1px solid var(--cg-line); padding-left:22px; }
.cg-city-supplies > i { color:var(--cg-gold); font-size:29px; }
.cg-city-supplies small { font-size:10px; color:var(--cg-gold); font-weight:800; letter-spacing:.08em; }
.cg-city-supplies strong { display:block; font-size:29px; line-height:1.2; color:#fff0c5; font-variant-numeric:tabular-nums; }
.cg-city-supplies span { display:block; margin-top:5px; max-width:170px; color:var(--cg-muted); font-size:10px; line-height:1.5; }
.cg-city-stock { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; align-items:center; }
.cg-city-stock > div { display:grid; justify-items:center; gap:5px; padding:12px 5px; border:1px solid var(--cg-line); border-radius:13px; background:#1b0c1c99; }
.cg-city-stock i { color:#e9b8d7; font-size:17px; }.cg-city-stock strong { font-size:19px; font-variant-numeric:tabular-nums; }.cg-city-stock span { font-size:10px; color:var(--cg-muted); }
#cityGameActivities { margin-top:24px; }
.cg-city-feedback,.cg-city-connection { margin:12px 0; padding:14px 18px; border:1px solid var(--cg-line); border-radius:14px; color:var(--cg-ink); background:#301b31; font-size:13px; line-height:1.6; }
.cg-city-game-layout { display:grid; grid-template-columns:minmax(250px,.85fr) minmax(0,2fr); gap:24px; align-items:start; }
.cg-cafe-card,.cg-city-board { padding:24px; border:1px solid var(--cg-line); border-radius:22px; background:linear-gradient(150deg,#2c1528,#21101e); }
.cg-cafe-card { background:radial-gradient(ellipse at 70% 14%,#914d7430,transparent 52%),linear-gradient(150deg,#361929,#21101e); }
.cg-cafe-sign { position:relative; display:flex; align-items:center; gap:15px; margin:26px 0; padding:18px; border:1px solid #eabc9850; border-radius:18px; background:linear-gradient(135deg,#684148,#442933); color:#ffe4c7; transform:rotate(-2deg); box-shadow:0 9px 0 #12091250,0 12px 25px #08040830; }
.cg-cafe-sign > i { font-size:34px; }.cg-cafe-sign > span { font-size:13px; line-height:1.4; }.cg-cafe-sign strong { font:600 23px var(--font-display,sans-serif); }.cg-cafe-sign > b { position:absolute; right:12px; top:-8px; padding:4px 8px; border:1px solid #dbb993; border-radius:5px; background:#ece1c1; color:#644436; font-size:8px; letter-spacing:.12em; transform:rotate(5deg); }
.cg-cafe-card h2 { margin:10px 0; font:600 24px/1.2 var(--font-display,sans-serif); }
.cg-cafe-card p,.cg-city-board > p { color:var(--cg-muted); font-size:13px; line-height:1.7; }
.cg-cafe-host { display:flex; align-items:center; gap:11px; margin:18px 0; padding:12px; border:1px solid var(--cg-line); border-radius:13px; background:#160a1566; }
.cg-cafe-host > img { width:48px; height:58px; border-radius:9px; object-fit:cover; object-position:top; border:1px solid #ffb6d944; }.cg-cafe-host > i { font-size:25px; color:var(--cg-muted); }
.cg-cafe-host small { display:block; color:var(--cg-accent); font-size:8px; font-weight:800; letter-spacing:.08em; }.cg-cafe-host strong { display:block; margin:4px 0; font-size:12px; }.cg-cafe-host span { display:block; color:var(--cg-muted); font-size:10px; line-height:1.5; }
.cg-cafe-reward { padding:12px 0; font-size:12px; }.cg-cafe-reward i { color:var(--cg-gold); }.cg-cafe-reward small { display:block; margin-top:6px; font-size:10px; color:var(--cg-muted); line-height:1.5; }
#cityGameActivities .cg-city-play { display:flex; justify-content:center; width:100%; min-height:46px; margin:8px 0; }
.cg-city-practice { min-height:44px; padding:7px 2px; border:0; background:none; color:var(--cg-accent); font:700 12px var(--font-body,sans-serif); cursor:pointer; text-align:left; }
.cg-cafe-card .cg-city-small { font-size:10px; line-height:1.7; }
.cg-city-board > header { display:flex; align-items:center; justify-content:space-between; gap:10px; }.cg-city-board h2 { margin:5px 0; font:600 26px var(--font-display,sans-serif); }.cg-city-board-count { padding:8px 10px; border-radius:10px; background:#4a244233; border:1px solid var(--cg-line); font-size:11px; white-space:nowrap; }
.cg-city-requests { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; margin-top:20px; }
.cg-city-request { display:flex; flex-direction:column; min-width:0; padding:17px; border:1px solid var(--cg-line); border-radius:15px; background:linear-gradient(145deg,#3c2034,#2b1728); }.cg-city-request.is-done { background:#18352c55; border-color:#98d6b733; }.cg-city-request.is-locked { background:#20141f; }
.cg-city-request-heading { display:flex; gap:10px; align-items:center; }.cg-city-request-heading > span { display:grid; place-items:center; flex-shrink:0; width:29px; height:33px; color:#f0c4e0; background:#ae639524; border:1px solid var(--cg-line); border-radius:8px; }.is-done .cg-city-request-heading > span { color:#a6ddbd; }
.cg-city-request h3 { margin:0; font-size:14px; }.cg-city-request > p { min-height:36px; margin:10px 0; font-size:11px; line-height:1.6; color:var(--cg-muted); }
.cg-city-needs { display:flex; flex-wrap:wrap; gap:7px; padding:4px 0 15px; }.cg-city-needs > span { padding:7px 9px; border-radius:8px; border:1px solid #c184a333; color:#d2a7bc; background:#160b1680; font-size:10px; }.cg-city-needs small { display:block; margin-top:4px; font-size:9px; opacity:.8; }.cg-city-needs > .is-stocked { color:#bde5ca; border-color:#91c8a544; }
.cg-city-request-bottom { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; padding-top:12px; margin-top:auto; border-top:1px solid var(--cg-line); }.cg-city-request-bottom strong { font-size:11px; color:var(--cg-gold); }.cg-city-request-bottom small { display:block; margin-top:4px; font-size:10px; color:var(--cg-muted); }
#cityGameActivities .cg-city-request-bottom .btn { min-height:42px; font-size:11px; padding:9px 13px; }
.cg-city-board > footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; align-items:center; margin-top:17px; color:var(--cg-muted); font-size:10px; }
.cg-city-help { margin-top:20px; padding:16px 20px; border:1px solid var(--cg-line); border-radius:15px; background:#21101f; font-size:12px; color:var(--cg-muted); line-height:1.8; }.cg-city-help summary { min-height:30px; cursor:pointer; color:var(--cg-ink); font-weight:800; }.cg-city-help li { margin:8px 0; }
.cg-city-production { display:flex; gap:10px; align-items:center; padding:12px 17px; color:#c9a2b9; font-size:11px; border-bottom:1px solid #ffb2d512; background:#22101d; }.cg-city-production > i { color:#e4c890; font-size:18px; }.cg-city-production strong { color:#f3dbb0; }.cg-city-production small { display:block; margin-top:4px; font-size:9px; color:#b486a1; }
.cg-city-supply-upgrade { width:100%; min-height:42px; margin-top:5px; padding:9px; border:1px solid #e4c89044; border-radius:10px; background:#c99d5810; color:#f3dbb0; font:800 11px var(--font-body,sans-serif); cursor:pointer; }.cg-city-supply-upgrade:disabled { opacity:.45; cursor:default; }
#cityGameActivities button:disabled { opacity:.5; cursor:default; }
#cityGameActivities :focus-visible,#cityGameOverview :focus-visible,#cityCafeGame :focus-visible,.cg-city-supply-upgrade:focus-visible { outline:3px solid #ffd2ea; outline-offset:3px; }

#cityCafeGame { width:min(480px,calc(100% - 24px)); max-height:90vh; max-height:90dvh; padding:0; margin:auto; border:1px solid #b9709744; border-radius:24px; background:radial-gradient(ellipse at 50% 0,#56324866,transparent 65%),#24121f; box-shadow:0 25px 90px #080308aa; overflow:auto; }
#cityCafeGame::backdrop { background:#100811dc; }
.cg-cafe-game-header { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:18px 22px; border-bottom:1px solid var(--cg-line); }.cg-cafe-game-header span { color:var(--cg-gold); font-size:9px; letter-spacing:.14em; font-weight:800; }.cg-cafe-game-header h2 { margin:4px 0 0; font:600 24px var(--font-display,sans-serif); }.cg-cafe-game-header .btn { min-width:44px; min-height:44px; }
.cg-cafe-game-body { padding:22px; }.cg-cafe-round-heading { display:flex; justify-content:space-between; font-size:12px; font-weight:800; }.cg-cafe-round-heading i { color:var(--cg-accent); }
.cg-cafe-round-progress { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; margin:12px 0; }.cg-cafe-round-progress i { height:5px; border-radius:99px; background:#533447; }.cg-cafe-round-progress .is-done { background:#b0cdab; }.cg-cafe-round-progress .is-current { background:#f0b7d3; }
.cg-cafe-host-name { margin:10px 0 20px; color:var(--cg-muted); text-align:center; font-size:11px; }
.cg-cafe-order-intro { text-align:center; padding:16px 5px 12px; }.cg-cafe-order-intro > i { font-size:45px; color:var(--cg-gold); margin:16px 0; }.cg-cafe-order-intro h3 { font-size:20px; }.cg-cafe-order-intro p,.cg-cafe-order-input p { color:var(--cg-muted); font-size:13px; line-height:1.7; }.cg-cafe-order-intro .btn { min-height:48px; margin:12px 0; padding:12px 25px; }
.cg-cafe-order-preview { text-align:center; padding:20px 0; }.cg-cafe-order-preview > span { font-size:11px; letter-spacing:.08em; color:var(--cg-gold); font-weight:800; }.cg-cafe-order-preview > div { display:flex; justify-content:center; gap:12px; margin:22px 0; }.cg-cafe-order-preview > div > div { display:grid; gap:8px; padding:12px 9px; min-width:72px; border:1px solid #edb7d344; border-radius:15px; background:#553343; }.cg-cafe-order-preview small { font-size:10px; color:var(--cg-muted); }.cg-cafe-order-preview b { font-size:37px; }.cg-cafe-order-preview strong { font-size:11px; }.cg-cafe-order-preview p { font-size:12px; color:var(--cg-muted); }
.cg-cafe-order-input h3 { margin:20px 0 8px; text-align:center; font-size:21px; }.cg-cafe-order-input > p { text-align:center; }
.cg-cafe-tray { display:flex; gap:10px; justify-content:center; padding:14px 0 20px; }.cg-cafe-tray > span { display:grid; place-items:center; width:65px; height:65px; border-radius:14px; border:1px dashed #eab9d25c; background:#180b14; }.cg-cafe-tray b { font-size:32px; }.cg-cafe-tray small { color:#997084; font-size:15px; }
.cg-cafe-menu { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.cg-cafe-menu button { min-height:91px; display:grid; place-items:center; gap:5px; padding:12px; border:1px solid #e9b8cd33; border-radius:15px; background:linear-gradient(145deg,#593743,#3a2434); color:#ffe4ee; font:800 12px var(--font-body,sans-serif); cursor:pointer; touch-action:manipulation; }.cg-cafe-menu b { font-size:32px; }.cg-cafe-menu button:active:not(:disabled) { transform:scale(.97); background:#684052; }.cg-cafe-menu button:disabled { opacity:.45; }
.cg-cafe-serve { display:flex; gap:10px; margin-top:20px; }.cg-cafe-serve .btn { min-height:48px; }.cg-cafe-serve .btn-primary { flex:1; }
.cg-cafe-feedback { padding:10px; border-radius:10px; border:1px solid #dcaf7844; background:#76553022; color:#e6c6a0; font-size:11px; text-align:center; }.cg-cafe-feedback.is-correct { color:#c1e2be; border-color:#b6d79733; background:#67815c22; }
.cg-cafe-error { padding:10px; color:#ffd2dc; font-size:12px; line-height:1.6; border:1px solid #c6809655; border-radius:10px; }
.cg-cafe-result { text-align:center; padding:22px 0; }.cg-cafe-result > i { display:block; font-size:55px; color:var(--cg-gold); margin:10px 0 26px; }.cg-cafe-result > span { color:var(--cg-accent); font-size:11px; letter-spacing:.1em; font-weight:800; }.cg-cafe-result h3 { font:600 28px var(--font-display,sans-serif); }.cg-cafe-result p { font-size:13px; color:var(--cg-muted); line-height:1.7; }.cg-cafe-result .btn { margin-top:16px; min-height:48px; }
@media(max-width:1000px) { .cg-city-progress-panel { grid-template-columns:1fr 1fr; }.cg-city-stock { grid-column:1/-1; }.cg-city-stock > div { grid-template-columns:auto auto 1fr; gap:10px; padding:12px; }.cg-city-game-layout { grid-template-columns:minmax(230px,.8fr) minmax(0,1.2fr); gap:16px; }.cg-city-requests { grid-template-columns:1fr; } }
@media(max-width:680px) { .cg-city-progress-panel { gap:16px; padding:17px; border-radius:17px; grid-template-columns:1fr; }.cg-city-supplies { border-left:0; border-top:1px solid var(--cg-line); padding:15px 0 0; }.cg-city-supplies > div { display:grid; grid-template-columns:1fr auto; align-items:center; gap:3px 16px; width:100%; }.cg-city-supplies small { grid-column:1; }.cg-city-supplies strong { grid-column:2; grid-row:1/3; font-size:27px; }.cg-city-supplies span { max-width:none; font-size:10px; }.cg-city-stock > div { grid-template-columns:1fr; gap:5px; padding:12px 6px; }.cg-city-game-layout { grid-template-columns:1fr; }.cg-cafe-card,.cg-city-board { padding:20px; border-radius:18px; }.cg-cafe-card { display:block; }.cg-cafe-sign { max-width:300px; }.cg-city-board h2 { font-size:24px; }.cg-city-request > p { min-height:0; }.cg-city-production { font-size:11px; }.cg-city-production small { font-size:10px; } }
@media(prefers-reduced-motion:reduce) { .cg-city-xp > span { transition:none; }.cg-cafe-menu button:active:not(:disabled) { transform:none; } }

.cg-city-shortcuts { display:flex; gap:10px; margin:-10px 0 22px; }
.cg-city-shortcuts button { flex:1; min-height:44px; padding:10px; border:1px solid var(--cg-line); border-radius:12px; background:#2b1427; color:var(--cg-ink); font:800 12px var(--font-body,sans-serif); cursor:pointer; }
.cg-city-shortcuts i { margin-right:5px; color:var(--cg-accent); }
#cityCafePanel,#cityRequestBoardTitle,#cityMap { scroll-margin-top:95px; }
@media(max-width:430px) { .cg-city-shortcuts { gap:6px; }.cg-city-shortcuts button { padding:8px 5px; font-size:10px; }.cg-city-shortcuts i { display:block; margin:0 0 5px; font-size:13px; } }

.cg-cafe-menu svg,.cg-cafe-order-preview svg { display:block; width:48px; height:48px; margin:auto; }
.cg-cafe-tray svg { display:block; width:44px; height:44px; }

/* Clearer City overview and secondary upgrade controls. */
.cg-city-guide { display:flex; flex-wrap:wrap; gap:10px 24px; margin:0 0 18px; color:var(--cg-muted); font-size:12px; line-height:1.7; }
.cg-city-guide strong { color:var(--cg-ink); font-weight:600; }
#cityMap .city-building-economy { grid-template-columns:repeat(2,minmax(0,1fr)); }
.city-building-upgrades { margin-top:auto; border-top:1px solid #ffb2d51a; }
.city-building-upgrades summary { padding:15px 18px; cursor:pointer; color:#e9bfd4; font-size:12px; font-weight:700; min-height:44px; }
.city-building-upgrades summary:focus-visible { outline:2px solid #ffa6d2; outline-offset:-3px; }
#cityMap .city-building-footer { border-top:0; margin-top:0; }
.cg-city-request-heading { margin-bottom:14px; }
.cg-city-progress-panel,.cg-city-request,.cg-cafe-card,.cg-city-board { box-shadow:none; background:#281520; }
.cg-city-request { background:#301c29; }
@media(max-width:680px) { .cg-city-guide { display:grid; gap:4px; } }

/* Job goods are part of the payout, with a clear label and amount. */
#cityMap .cg-city-production { gap:14px; margin:12px 16px; padding:15px; border:1px solid #e6c48366; border-radius:13px; background:linear-gradient(120deg,#55402d80,#362332); }
#cityMap .cg-city-production > i { display:grid; place-items:center; flex:0 0 42px; height:42px; border:1px solid #f5d49333; border-radius:12px; background:#f5d49312; color:#ffe2a5; font-size:21px; }
.cg-city-production-copy { min-width:0; }
#cityMap .cg-city-production-label { display:block; margin-bottom:5px; color:#e9cfa4; font-size:9px; font-weight:800; letter-spacing:.08em; }
#cityMap .cg-city-production strong { display:block; color:#ffe4af; font-size:20px; font-weight:800; line-height:1.25; }
#cityMap .cg-city-production small { margin-top:6px; color:#d4b9c8; font-size:11px; line-height:1.5; }
@media(max-width:380px) { #cityMap .cg-city-production { margin:10px; padding:12px; gap:10px; } #cityMap .cg-city-production strong { font-size:18px; } }

/* Miyora neighbourhood facelift: warm shop signs and always-visible upgrades. */
#view-city { --city-paper:#ffe7c3; --city-soft:#cdaabd; }
#view-city .city-heading { align-items:center; gap:24px; padding:8px 0 12px; }
#view-city .city-heading h1 { letter-spacing:-.025em; }
#view-city .city-heading p { max-width:460px; color:var(--city-soft); line-height:1.7; }
#view-city .city-overview { border-color:#e0a6c12e; background:#2d1827; box-shadow:none; }
.cg-city-guide { gap:8px; margin-bottom:18px; }
.cg-city-guide > * { flex:1; min-width:160px; padding:12px 16px; border:1px solid #ebadc326; border-radius:12px; background:#34202d; font-size:12px; color:#dfbfd0; }
.cg-city-guide strong { font-weight:700; color:#ffe0ed; }
.cg-city-progress-panel { background:linear-gradient(125deg,#3e2535,#281923); border-color:#e0a6c12e; }
.cg-city-shortcuts button { background:#34202d; transition:background .18s,border-color .18s; }
.cg-city-shortcuts button:hover { background:#4b2d3e; border-color:#e0a6c16b; }
.cg-city-section-heading { display:flex; align-items:end; justify-content:space-between; gap:18px; margin:30px 0 18px; }
.cg-city-section-heading span { color:#c9a47f; font-size:9px; font-weight:800; letter-spacing:.14em; }
.cg-city-section-heading h2 { color:#ffe4ed; font:600 28px var(--font-display,sans-serif); margin:6px 0 0; }
.cg-city-section-heading p { color:#c7a4b6; font-size:12px; margin:0 0 4px; }
#view-city .city-map-shell { min-height:0; border:0; background:transparent; box-shadow:none; overflow:visible; isolation:auto; }
#view-city .city-map-shell::before,#view-city .city-skyline,#view-city .city-map-road { display:none; }
#view-city .city-map { gap:20px; padding:0; align-items:stretch; }
#view-city .city-building-card { display:flex; flex-direction:column; min-width:0; background:linear-gradient(155deg,#382332,#23151f); border-color:#b97f9d55; border-radius:22px; box-shadow:0 12px 30px #12081040; }
#view-city .city-building-card:hover { transform:none; border-color:#d3a1ba88; box-shadow:0 12px 30px #12081040; }
#view-city .city-building-header { align-items:center; min-height:96px; padding:18px 16px; }
#view-city .city-building-header h2 { font-family:var(--font-display,sans-serif); font-size:21px; line-height:1.2; }
#view-city .city-building-level { padding:7px 9px; border-radius:10px; background:#170e164d; }
#view-city .city-building-level strong { font-size:24px; }
#view-city .city-building-economy > span { padding:12px 16px; background:#261720; gap:3px 8px; }
#view-city .city-building-economy strong { font-size:13px; }
#view-city .city-building-economy small { font-size:9px; color:#c4a0b5; }
#view-city .city-vacant-lot,#view-city .city-assignment { flex:1; min-height:330px; padding:22px 18px 16px; }
#view-city .city-building-image-art { height:195px; width:100%; transform:none; }
#view-city .city-vacant-copy small { font-size:11px; color:#c6a0b6; line-height:1.6; }
#view-city .city-send-button { min-height:46px; border:1px solid #dca6c270; background:linear-gradient(135deg,#ac527f,#854365); box-shadow:0 4px 0 #190e1955; }
#view-city .city-send-button:hover { background:linear-gradient(135deg,#bb618e,#945274); }
#view-city .city-assignment-copy > span { font-size:9px; }
#view-city .city-assignment-copy > small { font-size:11px; }
#view-city .city-assignment-timer b { font-size:12px; }
#view-city .city-cancel-button { min-height:44px; font-size:11px; }
/* Same illustrated shop-sign treatment as Café Rush. */
#cityMap .cg-city-production,.cg-cafe-sign { position:relative; display:flex; align-items:center; gap:14px; margin:16px 20px 24px; padding:19px 17px; border:1px solid #eabc987d; border-radius:16px; background:linear-gradient(135deg,#684148,#442933); color:#ffe4c7; transform:rotate(-1.2deg); box-shadow:0 6px 0 #1a1018,0 12px 20px #10080e35,inset 0 0 0 4px #eabc9809; }
#cityMap .cg-city-production::before,.cg-cafe-sign::before { content:""; position:absolute; top:8px; left:9px; width:4px; height:4px; border-radius:50%; background:#d9b38d; box-shadow:0 1px 2px #0006; }
#cityMap .cg-city-production::after,.cg-cafe-sign::after { content:""; position:absolute; top:8px; right:9px; width:4px; height:4px; border-radius:50%; background:#d9b38d; box-shadow:0 1px 2px #0006; }
#cityMap .cg-city-production > i { flex:0 0 38px; height:auto; border:0; border-radius:0; background:none; color:#ffe0b1; font-size:29px; }
#cityMap .cg-city-production-label { font-size:12px; font-weight:500; letter-spacing:0; color:#efd0b9; margin-bottom:3px; }
#cityMap .cg-city-production strong { font:600 clamp(23px,2.2vw,29px)/1.15 var(--font-display,sans-serif); color:#ffe4c7; }
#cityMap .cg-city-production small { color:#dec0b7; font-size:10px; line-height:1.55; margin-top:7px; }
.cg-cafe-sign { margin:12px 0 30px; transform:rotate(-2deg); max-width:none; }
.cg-cafe-sign strong { font-size:29px; }
#view-city .city-building-upgrades { margin-top:0; padding:17px; border-top:1px solid #d6a2bc26; background:#190e1540; }
.city-upgrade-heading { display:flex; gap:10px; align-items:center; margin-bottom:13px; }
.city-upgrade-heading > i { display:grid; place-items:center; width:34px; height:34px; border:1px solid #d4a0bf38; border-radius:10px; background:#67425a33; color:#efb7d7; }
.city-upgrade-heading strong { display:block; font-size:13px; color:#f4d7e7; }
.city-upgrade-heading small { display:block; margin-top:3px; font-size:10px; color:#c29aaf; }
#cityMap .city-building-footer { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:0; background:none; }
#cityMap .city-building-footer > button { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:5px; width:100%; min-height:48px; margin:0; padding:10px 7px; border:1px solid #d6b7805c; border-radius:12px; background:linear-gradient(145deg,#57412d,#392b29); color:#ffe3aa; font:700 11px var(--font-body,sans-serif); cursor:pointer; box-shadow:0 3px 0 #100a1233; }
#cityMap .city-building-footer .cg-city-supply-upgrade { border-color:#c89fce66; background:linear-gradient(145deg,#51364e,#352536); color:#f0caeb; }
#cityMap .city-building-footer > button:only-child { grid-column:1/-1; }
#cityMap .city-building-footer > button:hover:not(:disabled) { filter:brightness(1.13); }
#cityMap .city-building-footer > button:disabled { opacity:.5; cursor:default; box-shadow:none; }
#cityMap .city-building-footer .coin-amount { font-size:12px; }
#cityMap .city-building-footer .coin-icon { width:16px; height:16px; }
#cityGameActivities { margin-top:34px; }
.cg-city-game-layout { gap:22px; align-items:start; }
.cg-cafe-card,.cg-city-board { background:linear-gradient(150deg,#382333,#261922); border-color:#d09ab535; }
.cg-city-request { background:#32212d; border-color:#ce9fb42e; }
.cg-city-request.is-done { background:#26382e; }
.cg-city-request h3 { font-size:15px; line-height:1.4; }
.cg-city-needs > span { font-size:11px; }
#view-city button:focus-visible { outline:3px solid #f7cfaa; outline-offset:3px; }
@media(min-width:721px) and (max-width:1050px) { #view-city .city-map { gap:16px; } #view-city .city-building-card:last-child { width:calc(50% - 8px); } }
@media(max-width:720px) {
 #view-city .city-section { width:calc(100% - 24px); max-width:540px; }
 #view-city .city-map { gap:24px; }
 #view-city .city-building-card:last-child { width:auto; }
 .cg-city-section-heading { display:block; margin-top:25px; }
 .cg-city-section-heading p { margin-top:8px; font-size:11px; }
 .cg-city-guide { display:grid; grid-template-columns:1fr; gap:6px; }
 .cg-city-guide > * { min-width:0; padding:10px 13px; }
 #view-city .city-building-header h2 { font-size:22px; }
 #view-city .city-vacant-lot,#view-city .city-assignment { min-height:300px; }
 #cityMap .cg-city-production { margin:12px 18px 24px; }
 #cityMap .cg-city-production strong { font-size:28px; }
 #cityMap .city-building-footer > button { min-height:48px; }
 .cg-cafe-card,.cg-city-board { padding:20px; }
}
@media(prefers-reduced-motion:reduce) { .cg-city-shortcuts button { transition:none; } }