/* 10-22 老闆新版首頁設計稿 design/ui-v4/home-city-mockup.png：
   城市大地圖當背景；左上頭像＋LV＋經驗／體力；上方資源列（每格右側＋）；右上四顆圓鈕＋紅色驚嘆；
   地圖左右直排圓鈕；底部白色圓角長條八分頁、選中金色光暈。淺底深字、不捲動、不用深墨綠。 */
body.home-v4{--v4-card:#fffffff2;--v4-ink:#1d2433;--v4-sub:#5b6474;--v4-line:#d9dee8;--v4-gold:#f2b51d;--v4-gold-soft:#fff3c4;--v4-red:#e5383b;--v4-blue:#2f8cf0}

/* ── 頂列 ── */
body.home-v4 .app-shell>.topbar{display:flex;align-items:center;gap:8px;height:auto;min-height:0;padding:6px 10px;background:transparent;border:0;box-shadow:none;pointer-events:none}
body.home-v4 .app-shell>.topbar>*{pointer-events:auto}
body.home-v4 .topbar>.brand{display:none}
body.home-v4:not(#v4a):not(#v4b) .game-hud{position:relative;flex:0 0 auto!important;display:flex!important;align-items:center;gap:6px;width:auto!important;min-width:0!important;max-width:none!important;height:auto;margin:0;padding:3px 10px 3px 3px;border:1px solid var(--v4-line);border-radius:30px;background:var(--v4-card);box-shadow:0 3px 10px #0003;color:var(--v4-ink)}
body.home-v4 .game-hud .hud-avatar{width:46px;height:46px;flex:0 0 46px;border:3px solid var(--v4-gold);border-radius:50%;box-shadow:0 0 0 2px #fff}
body.home-v4 .game-hud .hud-main{display:grid;gap:3px;width:150px;min-width:0}
body.home-v4 .game-hud .hud-name{display:flex;align-items:center;gap:5px;margin:0;font-size:12px;line-height:1.1;color:var(--v4-ink)}
body.home-v4 .game-hud .hud-level{position:absolute;left:0;bottom:-2px;min-width:30px;padding:1px 5px;border:2px solid #fff;border-radius:10px;background:#283246;color:#fff;font-size:11px;text-align:center}
body.home-v4 .game-hud .hud-nick{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:800}
body.home-v4 .game-hud .hud-xp,body.home-v4 .game-hud .hud-energy{position:relative;display:block;height:13px}
body.home-v4 .game-hud .hud-xp i,body.home-v4 .game-hud .hud-energy i{display:block;height:13px;border-radius:7px;background:#e5e9f0;overflow:hidden;box-shadow:inset 0 1px 2px #0002}
body.home-v4 .game-hud .hud-xp em{display:block;height:100%;background:linear-gradient(90deg,#ffcf3f,#f29b12)}
body.home-v4 .game-hud .hud-energy em{display:block;height:100%;background:linear-gradient(90deg,#5fc4ff,#2f8cf0)}
body.home-v4 .game-hud .hud-xp small,body.home-v4 .game-hud .hud-energy small{position:absolute;inset:0;display:grid;place-items:center;color:#1d2433;font:800 9.5px/13px sans-serif;text-shadow:0 0 2px #fff,0 0 2px #fff}
body.home-v4 .game-hud .hud-wallet{display:contents}
body.home-v4 .game-hud .hud-cash,body.home-v4 .game-hud .hud-s{display:none}
body.home-v4 .game-hud .hud-debt{position:absolute;left:54px;top:100%;margin-top:2px;padding:1px 6px;border-radius:8px;background:#fff;color:#b42318;font-size:10px;white-space:nowrap;box-shadow:0 1px 4px #0002}
body.home-v4 .game-hud .hud-debt[hidden]{display:none}

/* 資源列 */
.v4-res{flex:1 1 auto;display:flex;justify-content:center;gap:6px;min-width:0}
.v4-res-cell{position:relative;display:flex;align-items:center;gap:4px;min-width:88px;flex:0 1 128px;height:34px;padding:0 4px 0 3px;border:1px solid var(--v4-line);border-radius:18px;background:var(--v4-card);color:var(--v4-ink);box-shadow:0 2px 8px #0002;cursor:pointer}
.v4-res-ico{flex:0 0 26px;font-size:20px;line-height:26px;text-align:center}
.v4-res-cell b{flex:1 1 auto;min-width:0;overflow:hidden;font:800 14px/1 sans-serif;text-align:left;white-space:nowrap;text-overflow:ellipsis}
.v4-plus{flex:0 0 22px;height:22px;border-radius:50%;background:linear-gradient(180deg,#ffd75a,#f2a51d);color:#4a2a00;font:900 15px/22px sans-serif;font-style:normal;text-align:center}
.v4-res-cell:hover,.v4-res-cell:focus-visible{border-color:var(--v4-gold);outline:0;box-shadow:0 0 0 2px var(--v4-gold-soft),0 2px 8px #0002}

/* 右上四鈕（遊戲時鐘保留在左邊） */
body.home-v4 .top-actions{flex:0 0 auto;display:flex;align-items:center;gap:6px;margin-left:auto}
body.home-v4 .top-actions .game-clock{min-height:30px;padding:2px 8px;border:1px solid var(--v4-line);border-radius:15px;background:var(--v4-card);color:var(--v4-ink);font-size:12px;font-weight:800;box-shadow:0 2px 8px #0002}
body.home-v4 .top-actions>#mail-toggle{position:absolute!important;width:1px!important;min-width:0!important;height:1px!important;min-height:0!important;padding:0!important;overflow:hidden;clip-path:inset(50%);border:0!important}
.v4-top{display:flex;gap:6px}
.v4-round{position:relative;display:grid;place-items:center;width:42px;height:42px;padding:0;border:2px solid #fff;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#eef2f8);color:var(--v4-ink);font-size:22px;line-height:1;box-shadow:0 3px 8px #0003;cursor:pointer}
.v4-round img{width:34px;height:34px;object-fit:contain}
.v4-round:hover,.v4-round:focus-visible{outline:0;border-color:var(--v4-gold);box-shadow:0 0 0 3px var(--v4-gold-soft),0 0 12px #f2b51daa}
.v4-alert{position:absolute;top:-4px;right:-4px;width:17px;height:17px;border:2px solid #fff;border-radius:50%;background:var(--v4-red);color:#fff;font:900 11px/13px sans-serif;font-style:normal;text-align:center}
.v4-alert[hidden]{display:none}

/* 每日轉盤／簽到／每日・每週禮包：收進「禮物」鈕，點了才在右上展開 */
body.home-v4 .topbar>.daily-reward-entries{position:absolute;z-index:60;top:58px;right:120px;display:none;padding:6px;border:1px solid var(--v4-line);border-radius:16px;background:var(--v4-card);box-shadow:0 8px 22px #0004}
body.home-v4.v4-gift-open .topbar>.daily-reward-entries{display:flex}

/* ── 地圖左右直排 ── */
.v4-rail{position:absolute;z-index:24;top:76px;display:flex;flex-direction:column;gap:7px}
.v4-rail-left{left:10px}
.v4-rail-right{right:10px;align-items:flex-end}/* 10-31 老闆：任務追蹤卡較寬，圓鈕靠右對齊不被推歪 */
/* 10-22 狀態欄讓出右直排（提高權重蓋過舊版 right 規則） */
body.home-v4:not(#v4a):not(#v4b) .panel-home .mission-rail.status-rail{right:62px!important}

/* ── 底部白色圓角長條八分頁 ── */
body.home-v4 .panel-home .quick-bar{left:50%!important;right:auto!important;bottom:6px;width:min(1120px,calc(100% - 20px));min-height:0;padding:4px 8px!important;transform:translateX(-50%);border:1px solid var(--v4-line)!important;border-radius:26px!important;background:var(--v4-card)!important;box-shadow:0 6px 20px #0004!important;backdrop-filter:none}
body.home-v4 .panel-home .quick-bar .qb-track{display:grid;grid-template-columns:repeat(var(--qb-n,8),minmax(0,1fr));gap:2px;padding:0;overflow:hidden}
body.home-v4 .panel-home .quick-bar .qb-more-cue{display:none}
body.home-v4 .panel-home .quick-bar .qb-track .qb-page{position:relative}
body.home-v4 .panel-home .quick-bar .qb-page-icon{font:900 26px/1 sans-serif;color:var(--v4-gold)}

/* 10-25 老闆「兩排的icon比例要在放大」：圖 44→56、按鈕 66→80（矮螢幕另縮） */
body.home-v4 .panel-home .quick-bar .qb-track button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;width:auto;min-width:0;height:80px;min-height:0;padding:2px 0;border:0;border-radius:18px;background:transparent;box-shadow:none;transform:none;color:var(--v4-ink)}
body.home-v4 .panel-home .quick-bar .qb-art,body.home-v4 .panel-home .quick-bar .qb-art img{width:56px;height:56px}
body.home-v4 .panel-home .quick-bar .qb-art img{filter:drop-shadow(0 2px 2px #0003)}
body.home-v4 .panel-home .quick-bar .qb-emoji{font-size:42px;line-height:56px;text-align:center}
body.home-v4 .panel-home .quick-bar .qb-track button b{position:static!important;width:auto!important;height:auto!important;overflow:visible!important;clip:auto!important;clip-path:none!important;color:var(--v4-ink)!important;font:800 13px/1.1 sans-serif!important;text-shadow:none!important;white-space:nowrap;background:none!important;padding:0!important}
body.home-v4:not(#v4a):not(#v4b) .panel-home .quick-bar .qb-track button[aria-pressed=true]{background:radial-gradient(ellipse at 50% 60%,#fff3c4 0%,#ffe08a 55%,#fff6d6 80%)!important;box-shadow:inset 0 0 0 2px var(--v4-gold),0 0 14px #f2b51d99!important}
body.home-v4:not(#v4a):not(#v4b) .panel-home .quick-bar .qb-track button[aria-pressed=true] b{color:#7a4b00!important}
body.home-v4 .panel-home .quick-bar .qb-badge{top:2px;right:calc(50% - 30px)}
body.home-v4 .panel-home .quick-bar .qb-dot{top:4px;right:calc(50% - 26px);border-color:#fff}

/* ── 844×390 等矮螢幕：全部縮一號，地圖仍露出最多 ── */
@media (max-height:520px){
  body.home-v4 .app-shell>.topbar{padding:4px 8px;gap:6px}
  body.home-v4 .game-hud .hud-avatar{width:38px;height:38px;flex-basis:38px}
  body.home-v4 .game-hud .hud-main{width:112px}
  body.home-v4 .game-hud .hud-name{display:none}
  body.home-v4 .game-hud .hud-level{position:absolute}
  .v4-res{gap:3px}
  .v4-res-cell{flex-basis:78px;min-width:60px;height:30px}
  .v4-res-ico{flex-basis:18px;font-size:14px}
  .v4-res-cell{padding:0 4px 0 2px;justify-content:center}
  .v4-res-cell b{flex:0 0 auto;font-size:12px;overflow:visible;text-overflow:clip}
  /* 10-22 844 寬：拿掉＋號讓數字完整顯示（整格仍可點） */
  .v4-plus{display:none}
  body.home-v4 .top-actions .game-clock{font-size:11px;padding:1px 6px;min-height:26px}
  .v4-top{gap:4px}
  .v4-round{width:34px;height:34px;font-size:17px}
  .v4-round img{width:28px;height:28px}
  .v4-rail{top:54px;gap:4px}
  body.home-v4 .topbar>.daily-reward-entries{top:46px}
  /* 10-22 狀態欄讓出右直排（提高權重蓋過舊版 right 規則） */
  body.home-v4:not(#v4a):not(#v4b) .panel-home .mission-rail.status-rail{right:50px!important}
  body.home-v4 .panel-home .quick-bar{bottom:4px}
  body.home-v4 .panel-home .quick-bar .qb-track button{height:62px}
  body.home-v4 .panel-home .quick-bar .qb-art,body.home-v4 .panel-home .quick-bar .qb-art img{width:42px;height:42px}
  body.home-v4 .panel-home .quick-bar .qb-emoji{font-size:32px;line-height:42px}
  body.home-v4 .panel-home .quick-bar .qb-track button b{font-size:12px!important}
}

/* 10-22 乾淨無介面城市背景（assets/img/home-city-bg-v4.webp，16:9） */
body.home-v4 .panel-home .character-home-hero,
body.home-v4[data-ui-version="3"] .panel-home .character-home-hero{background-image:url('../img/home-city-bg-v4.webp')!important;background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important}

/* 10-22 城市大地圖第一階段：世界地圖層（隨拖曳縮放移動），HUD 固定；舊背景、舊標籤與車流層在 V4 隱藏 */
body.home-v4[data-ui-version="3"] .panel-home .character-home-hero{background-image:none!important;background-color:#cfe8f5!important}
body.home-v4 .panel-home .character-home-hero>.city-map-ui,body.home-v4 .panel-home .character-home-hero>.home-traffic-plane{display:none!important}
.v4-world{position:absolute;inset:0;z-index:0;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
.v4-world.is-dragging{cursor:grabbing}
.v4-world-plane{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.v4-world-plane>img{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;-webkit-user-drag:none}
body.home-v4:not(#v4a):not(#v4b) .v4-region{position:absolute;display:flex;align-items:center;justify-content:center;padding:0;border:2px solid transparent!important;border-radius:28px!important;background:transparent!important;box-shadow:none!important;min-height:0!important;cursor:pointer;transition:border-color .15s,box-shadow .15s,background .15s}
body.home-v4:not(#v4a):not(#v4b) .v4-region:hover,body.home-v4:not(#v4a):not(#v4b) .v4-region:focus-visible,body.home-v4:not(#v4a):not(#v4b) .v4-region.is-selected{outline:0;border-color:#f5d27a!important;background:#fff3c826!important;box-shadow:0 0 0 3px #ffe7a066,0 0 22px #ffd76a99!important}
body.home-v4:not(#v4a):not(#v4b) .v4-region-tag{display:inline-flex;align-items:center;gap:5px;padding:4px 12px 4px 6px;border:1px solid #ffffffd9;border-radius:999px;background:#fffffff0;color:#1f2a37;box-shadow:0 3px 10px #0003;white-space:nowrap;pointer-events:none}
body.home-v4:not(#v4a):not(#v4b) .v4-region-tag i{font-style:normal;font-size:18px;line-height:1}
body.home-v4:not(#v4a):not(#v4b) .v4-region-tag b{font:800 14px/1.2 sans-serif}
body.home-v4:not(#v4a):not(#v4b) .v4-region.is-selected .v4-region-tag{border-color:#f0c24f;box-shadow:0 0 0 2px #ffe08a,0 3px 10px #0003}
@media (max-height:520px){body.home-v4:not(#v4a):not(#v4b) .v4-region-tag{padding:3px 9px 3px 5px}body.home-v4:not(#v4a):not(#v4b) .v4-region-tag i{font-size:15px}body.home-v4:not(#v4a):not(#v4b) .v4-region-tag b{font-size:12px}}
/* 10-22 老闆：地圖不要再有白底標示——舊目的地標籤、老闆座車、九區名牌一律無底描邊字 */
html body:not(#nw1):not(#nw2) .city-destination,html body:not(#nw1):not(#nw2) .city-destination i,html body:not(#nw1):not(#nw2) .city-destination[aria-pressed=true]{background:none!important;border-color:transparent!important;box-shadow:none!important;filter:none!important}
html body:not(#nw1):not(#nw2) .city-destination b,html body:not(#nw1):not(#nw2) .city-destination i,html body:not(#nw1):not(#nw2) .boss-car-badge,html body:not(#nw1):not(#nw2) .v4-region-tag{color:#fff!important;text-shadow:0 0 2px #1b2633,0 0 3px #1b2633,0 1px 3px #000c!important}
html body:not(#nw1):not(#nw2) .city-destination[aria-pressed=true] b{color:#ffe08a!important}
html body:not(#nw1):not(#nw2) .boss-car-badge{background:none!important;border-color:transparent!important;box-shadow:none!important}
html body:not(#nw1):not(#nw2) .boss-car-badge img{background:none!important;filter:drop-shadow(0 1px 2px #000a)}
html body:not(#nw1):not(#nw2) .v4-region-tag{background:none!important;border-color:transparent!important;box-shadow:none!important;padding:0!important}
html body:not(#nw1):not(#nw2) .v4-region-tag b{font-size:12px!important;color:#fff!important}
html body:not(#nw1):not(#nw2) .v4-region-tag i{font-size:14px!important;filter:drop-shadow(0 1px 2px #000a)}
html body:not(#nw1):not(#nw2) .v4-region.is-selected .v4-region-tag b{color:#ffe08a!important}
/* 10-22 老闆樣板圖：右側只留四顆白圓鈕（指南針／日夜／相機／地形），舊右側狀態欄整個拿掉 */
body.home-v4:not(#v4a):not(#v4b) .panel-home .mission-rail.status-rail{display:none!important}
/* 10-23 老闆：無底圖示會被大地圖底色吃掉看不見 → 改回白色圓底＋白框 */
body.home-v4:not(#v4a):not(#v4b) .v4-rail-left .v4-round span{font-size:24px}
/* 九區名牌平常不顯示，點到的那一區才短暫顯示描邊字 */
body.home-v4:not(#v4a):not(#v4b) .v4-region-tag{opacity:0;transition:opacity .2s}
body.home-v4:not(#v4a):not(#v4b) .v4-region.is-selected .v4-region-tag,body.home-v4:not(#v4a):not(#v4b) .v4-region:hover .v4-region-tag{opacity:1}
/* 日夜切換、拍照模式 */
/* 10-22 夜晚：只把地圖淡藍暗化（不轉色相、HUD 不受影響） */
/* 10-22 地圖第2批：老闆定案正常探索時城市底圖不准壓暗（原夜間 brightness .62＋藍色 multiply 遮罩已移除）；夜間只留極淡冷色，不降亮度 */
body.home-v4.v4-night .v4-world-plane>img{filter:saturate(.95) hue-rotate(-4deg)}
body.home-v4.v4-photo .app-shell>.topbar,body.home-v4.v4-photo .panel-home .quick-bar,body.home-v4.v4-photo .v4-rail-left{visibility:hidden}
@media (max-height:520px){body.home-v4:not(#v4a):not(#v4b) .v4-rail-left .v4-round span{font-size:24px}}
/* 10-22 地圖上的車子、建築、標示圖都不能被單獨拖走 */
.character-home-hero img,.home-traffic-plane,.home-traffic-plane *,.boss-car-badge,.v4-world-plane{-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
@media (max-height:520px){body.home-v4:not(#v4a):not(#v4b) .v4-rail-left{top:66px}}
/* 10-22 幣種圓章：G 高登幣金色、T 黑金幣黑底金字（正式幣種圖示未生，先用字母圓章） */
.v4-coin{display:grid;place-items:center;width:22px;height:22px;flex:0 0 22px!important;border-radius:50%;font:900 13px/1 sans-serif!important;box-shadow:inset 0 -2px 0 #0003}
.v4-coin-cash{background:linear-gradient(180deg,#ffe27a,#f2a51d);color:#5a3500;border:1px solid #c98a10}
.v4-coin-t{background:linear-gradient(180deg,#3a3a3a,#111);color:#f5c84a;border:1px solid #c9a23a}

/* 10-22 右側地形鈕：顯示九區名稱 */
body.home-v4.v4-terrain:not(#v4a):not(#v4b) .v4-region-tag{opacity:1}
/* 10-22 T 幣格只顯示數量不接面板：disabled 不要灰掉（全域 button:disabled 會壓成 0.45 看不清） */
body.home-v4 .v4-res-cell:disabled{opacity:1!important;cursor:default!important;filter:none!important}
/* 10-22 v4 圖示總圖：HUD 圖示改圖片＋T 幣說明卡 */
.v4-res-ico img{width:26px;height:26px;object-fit:contain;display:block;filter:drop-shadow(0 1px 1px #0003)}
.v4-round img{filter:drop-shadow(0 1px 2px #0003)}
body.home-v4:not(#v4a):not(#v4b) .v4-region-tag i img{width:26px;height:26px;object-fit:contain;display:block}
.v4-tip{position:absolute;left:50%;top:calc(100% + 6px);z-index:60;transform:translateX(-50%);width:220px;padding:8px 10px;border:1px solid #e7c25a;border-radius:10px;background:#fffdf4;color:#1f2a37;font:700 13px/1.45 sans-serif;text-align:left;white-space:normal;box-shadow:0 4px 14px #0003}
@media (max-height:500px){.v4-res-ico img{width:18px;height:18px}body.home-v4:not(#v4a):not(#v4b) .v4-region-tag i img{width:20px;height:20px}.v4-tip{width:190px;font-size:12px}}
/* 10-22 地圖四層第1批：層級選單、即將開放卡；淺底深字、選中金色、不捲動 */
/* 10-23 老闆：麵包屑不單獨放首頁左上，改放進地圖層級選單（標題下方一條） */
.v4-map-crumbs{display:flex;align-items:center;gap:4px;margin:0 0 8px;padding:5px 10px;border-radius:999px;background:#f3f6fb;color:#2a2f3a;font-size:13px;overflow:hidden;white-space:nowrap}
.v4-map-crumbs button{border:0;background:none;color:#2563c9;font:inherit;font-weight:700;padding:2px 4px;cursor:pointer}
.v4-map-crumbs button:disabled{color:#9aa0aa;cursor:default}
.v4-map-crumbs b{color:#7a4f00;background:#ffd76a;border-radius:999px;padding:2px 8px}
.v4-map-crumbs i{font-style:normal;color:#8a8f99}
.v4-map-layer-menu{position:absolute;z-index:30;left:84px;top:50%;transform:translateY(-50%);width:min(340px,calc(100% - 100px));padding:10px 12px 12px;border-radius:16px;background:#fffdf6;color:#2a2f3a;box-shadow:0 8px 24px #0004;overflow:hidden}
.v4-map-layer-menu[hidden],.v4-map-soon[hidden]{display:none}
.v4-map-layer-menu header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:16px}
.v4-map-menu-x{border:0;background:#eef1f6;color:#2a2f3a;width:30px;height:30px;border-radius:50%;font-size:18px;cursor:pointer}
.v4-map-layer-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.v4-map-layer{display:grid;justify-items:center;gap:2px;padding:8px 6px;border:2px solid #dfe5ee;border-radius:12px;background:#fff;color:#2a2f3a;cursor:pointer;font:inherit}
.v4-map-layer img{width:52px;height:52px;object-fit:contain}
.v4-map-layer b{font-size:15px}
.v4-map-layer small{font-size:12px;color:#5b6472}
.v4-map-layer.is-current{border-color:#e0a400;background:#fff3c4;box-shadow:0 0 0 2px #ffd76a inset}
.v4-map-layer.is-current small{color:#7a4f00;font-weight:700}
.v4-map-layer.is-locked{cursor:not-allowed;background:#f1f2f4}
.v4-map-layer.is-locked img{filter:grayscale(1);opacity:.55}
.v4-map-layer.is-locked b,.v4-map-layer.is-locked small{color:#8a8f99}
.v4-map-legacy{display:block;width:100%;margin-top:10px;padding:8px;border:0;border-radius:10px;background:#3b82f6;color:#fff;font:inherit;font-weight:700;cursor:pointer}
.v4-map-soon{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;padding:24px;text-align:center;background:linear-gradient(180deg,#e9f4ff,#fdf8ea);color:#2a2f3a;cursor:default;overflow:hidden}
.v4-map-soon img{width:120px;height:120px;object-fit:contain}
.v4-map-soon h3{margin:0;font-size:22px;color:#7a4f00}
.v4-map-soon p{margin:0;font-size:15px;color:#3d4452}
.v4-map-soon.has-pic{display:block;padding:0;background:#cfe6f7}
.v4-layer-pic{position:absolute;left:0;top:0}
.v4-layer-pic>img{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;-webkit-user-drag:none}
.v4-layer-spot{position:absolute;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:1px;padding:3px 10px;border:2px solid #fff;border-radius:999px;background:#fffdf6;color:#2a2f3a;font:inherit;font-size:14px;box-shadow:0 2px 6px #0003;cursor:pointer;white-space:nowrap}
.v4-layer-spot:hover{border-color:#e0a400;background:#fff3c4}
.v4-layer-spot.is-selected{border-color:#df9e11;background:#fff0b7;box-shadow:0 0 0 3px #e9b63066,0 3px 10px #0004}
.v4-layer-spot.is-locked{background:#eef0f3;color:#8a8f99;cursor:default}
.v4-layer-spot small{font-size:11px}
.v4-layer-card{position:absolute;left:96px;bottom:84px;width:min(390px,calc(100% - 120px));max-height:min(58vh,520px);padding:10px 14px;border-radius:14px;background:#fffdf6f2;color:#2a2f3a;box-shadow:0 4px 12px #0003;text-align:left;display:flex;flex-direction:column}
.v4-layer-card b{font-size:17px;color:#7a4f00}
.v4-layer-card p{margin:4px 0 6px;font-size:13px;color:#3d4452}
.v4-district-merchants{display:grid;gap:7px;min-height:0;overflow:auto;font-size:12px}
.v4-district-merchants .v4-merchant-card{display:grid;grid-template-columns:1fr auto;gap:2px 9px;padding:8px 10px;border:1px solid #c7a665;border-radius:9px;background:#fff9e9;color:#3e321d;text-align:left;font:inherit;cursor:pointer}
.v4-merchant-card b{font-size:13px!important;color:#3e321d!important}
.v4-merchant-card small{grid-column:1;color:#6d6253;line-height:1.35}
.v4-merchant-card span{grid-column:2;grid-row:1/3;align-self:center;color:#946002;font-weight:700}
.v4-district-merchants .v4-merchant-card:hover{background:#ffe2a0}
.v4-merchant-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:stretch}
.v4-merchant-row .v4-merchant-card{min-width:0}
.v4-district-merchants .v4-merchant-walk,.v4-region-details .v4-merchant-walk{padding:4px 9px;border:1px solid #c7a665;border-radius:9px;background:#f8d66b;color:#3e321d;font:inherit;font-size:12px;font-weight:700;line-height:1.25;cursor:pointer}
body[data-ui-version="3"] :is(#app,dialog,.mail-dlg) .v4-merchant-row button.v4-merchant-walk{background-color:#f8d66b!important;color:#3e321d!important;border-color:#c7a665!important}
body[data-ui-version="3"] :is(#app,dialog,.mail-dlg) .v4-merchant-row button.v4-merchant-walk:hover{background-color:#ffe2a0!important}
.v4-district-merchants span{color:#5d6470}
.v4-merchant-map-nav{display:flex;gap:6px;margin-top:7px}
.v4-merchant-map-nav button{flex:1;padding:7px 9px;border:1px solid #c7a665;border-radius:8px;background:#fff9e9;color:#563c11;font:inherit;font-weight:700;cursor:pointer}
.v4-merchant-map-nav button:hover{background:#ffe2a0}
/* 區域圖直達商家時，保留內部店家功能但不露出舊四區生活商圈。 */
body.home-v4 .life-map-screen.region-shop-route > :not(#merchant-scene){display:none!important}
.v4-map-soon-back{margin-top:6px;padding:8px 18px;border:0;border-radius:999px;background:#ffc93c;color:#4a3200;font:inherit;font-weight:800;cursor:pointer}
.xiaowulai-venue{width:min(820px,calc(100vw - 28px));max-height:min(90vh,900px);padding:0;border:1px solid #a78a58;border-radius:20px;background:#f8f3e9;color:#203229;box-shadow:0 22px 80px #0008;overflow:auto}
.xiaowulai-venue::backdrop{background:#0e201cbb}
.xiaowulai-venue>img{display:block;width:100%;max-height:440px;object-fit:cover}
.xiaowulai-close{position:absolute;right:14px;top:14px;width:40px;height:40px;border:0;border-radius:50%;background:#fffdf0e9;color:#243a2c;font-size:26px;cursor:pointer}
.xiaowulai-body{padding:20px 24px 24px}.xiaowulai-body small{color:#8a6b37;letter-spacing:.12em}.xiaowulai-body h2{margin:4px 0;font-size:28px}.xiaowulai-body p{margin:8px 0 16px;line-height:1.55}
.xiaowulai-services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.xiaowulai-services button{padding:12px 6px;border:1px solid #b69b69;border-radius:10px;background:#eaf0e5;color:#264233;font:inherit;font-weight:700;cursor:pointer}.xiaowulai-services button:hover,.xiaowulai-services button:focus-visible{background:#d8e9d3;border-color:#5d875d}.xiaowulai-body .xiaowulai-detail{margin-bottom:0;padding:12px;border-radius:10px;background:#fff;border:1px solid #e2d8bd}
@media(max-width:600px){.xiaowulai-venue>img{max-height:300px}.xiaowulai-body{padding:16px}.xiaowulai-services{grid-template-columns:repeat(2,minmax(0,1fr))}}
body.home-v4.v4-photo .v4-map-crumbs,body.home-v4.v4-photo .v4-map-layer-menu{display:none}
body.home-v4 .v4-map-layer-menu .v4-map-legacy{background:#3b82f6!important;color:#fff!important;border:0!important}
body.home-v4 .v4-map-layer-menu .v4-map-layer{background:#fff!important;border:2px solid #dfe5ee!important}
body.home-v4 .v4-map-layer-menu .v4-map-layer.is-current{background:#fff3c4!important;border-color:#e0a400!important}
body.home-v4 .v4-map-layer-menu .v4-map-layer.is-locked{background:#f1f2f4!important}
body.home-v4 .v4-map-soon .v4-map-soon-back{background:#ffc93c!important;color:#4a3200!important;border:0!important}
@media (max-height:520px){
  .v4-map-layer-menu{top:64px;transform:none;width:min(460px,calc(100% - 100px));padding:8px 10px}
  .v4-map-layer-menu header{margin-bottom:6px;font-size:14px}
  .v4-map-menu-x{width:26px;height:26px;font-size:16px}
  .v4-map-layer-list{grid-template-columns:repeat(4,1fr);gap:6px}
  .v4-map-layer{padding:5px 4px}
  .v4-map-layer img{width:36px;height:36px}
  .v4-map-layer b{font-size:13px}
  .v4-map-layer small{font-size:11px}
  .v4-map-legacy{margin-top:6px;padding:6px}
  .v4-map-soon img{width:72px;height:72px}
  .v4-map-soon h3{font-size:18px}
}
/* 10-24 公會盾徽 SVG 放進下排 */
body.home-v4 .panel-home .quick-bar .qb-svg{display:grid;place-items:center}body.home-v4 .panel-home .quick-bar .qb-svg svg{width:40px;height:40px}
@media (max-height:520px){body.home-v4 .panel-home .quick-bar .qb-svg svg{width:30px;height:30px}}
/* 10-24 街道全螢幕（商業街等）本來就會藏頂列，但上面 .game-hud 的 display:flex!important 權重更高把它蓋掉 → 「← 回大地圖」被頭像擋住按不到；條件照 interface-layers／ui-v3 的全螢幕條件 */
@media (orientation:landscape) and (min-width:900px),(min-width:900px) and (max-height:700px),(orientation:landscape) and (max-height:520px) and (max-width:899px){
body.home-v4:not(#v4a):not(#v4b):not(#v4c):has(.life-map-screen.street-full:not([hidden])) :is(.game-hud,.v4-res,.v4-top,.brand,.top-actions){display:none!important}
}
/* 10-24 街道全螢幕時提示（例如「本街商家 LV10 開放」）原本浮在畫面中下方蓋住商家卡片 → 貼到最底下的空白處 */
body.home-v4:has(.life-map-screen.street-full:not([hidden]))>.toast[role="status"]{bottom:calc(10px + env(safe-area-inset-bottom,0px))!important}

/* 10-24 老闆「採集區有兩個路口 礦區/材料區」：下排採集區選單（id 選擇器壓過 v654 的 dialog button 配色） */
dialog#qb-gather.qb-gather{padding:18px 20px 20px;border:2px solid #c99a2e;border-radius:18px;background:#fff8e6;color:#3a2a12;width:min(460px,calc(100% - 32px))}
dialog#qb-gather.qb-gather::backdrop{background:#0008}
dialog#qb-gather.qb-gather h2{margin:0 0 12px;font-size:18px;text-align:center;color:#3a2a12}
dialog#qb-gather.qb-gather .qb-gather-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
/* 10-26 三路口版：橫放三顆，窄螢幕自動換行 */
dialog#qb-gather.qb-gather .qb-gather-row.qb-gather-three{grid-template-columns:repeat(auto-fit,minmax(118px,1fr))}
dialog#qb-gather.qb-gather .qb-gather-row button{display:grid;justify-items:center;gap:4px;padding:14px 8px;border:2px solid #c99a2e!important;border-radius:14px;background:#fff!important;color:#3a2a12!important;font-weight:800;cursor:pointer}
dialog#qb-gather.qb-gather .qb-gather-row button b{font-size:34px;line-height:1}
dialog#qb-gather.qb-gather .qb-gather-row .qb-gather-icon{display:block;width:72px;height:72px;max-width:100%;object-fit:contain}
dialog#qb-gather.qb-gather .qb-gather-row button small{font-size:12px;font-weight:700;color:#7a6440!important}
dialog#qb-gather.qb-gather .qb-gather-row button.is-locked{cursor:not-allowed;opacity:.7;background:#ece7dc!important}
dialog#qb-gather.qb-gather .qb-gather-x{position:absolute;top:8px;right:10px;border:0!important;background:none!important;color:#3a2a12!important;font-size:18px;cursor:pointer}

/* Keep the two original reward/task icons directly under the player HUD. */
body.home-v4:not(#v4a):not(#v4b) .game-hud{overflow:visible!important}
body.home-v4 .game-hud .v4-player-shortcuts{position:absolute;left:0;top:calc(100% + 6px);display:flex;gap:5px;padding:4px;border:1px solid var(--v4-line);border-radius:12px;background:var(--v4-card);pointer-events:auto;z-index:65}
/* 10-30 老闆：員工待辦移到右側、只顯示標題鈕（點了前往） */body.home-v4 .v4-staff-reminders{position:absolute;top:calc(100% + 8px);right:0;left:auto;width:auto;max-height:none;overflow:visible;padding:0;border:0;background:none;box-shadow:none;z-index:66}
body.home-v4 .v4-staff-reminders[hidden]{display:none}
body.home-v4 .v4-staff-reminders>strong{display:block;padding:2px 5px 6px;font:800 12px/1.3 sans-serif}
body.home-v4 .v4-staff-reminders .v4-staff-reminder{display:block;width:auto;min-height:0;margin:0;padding:8px 12px;border:1px solid #bf9440;border-radius:10px;background:#fffaf0;color:#453012;text-align:left;white-space:nowrap;font:800 12px/1.3 sans-serif;box-shadow:0 3px 10px #0003}
body.home-v4 .v4-staff-reminders .v4-staff-reminder.is-urgent{border-color:#c74b35;background:#fff0e9;color:#8a251b}
body.home-v4 .v4-player-shortcuts button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:74px;min-height:58px;padding:3px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--v4-ink);font:700 11px/1.2 sans-serif;cursor:pointer}
body.home-v4 .v4-player-shortcuts img{display:block;width:32px;height:32px;object-fit:contain}
body.home-v4 .v4-player-shortcuts [data-pet-lineup-count]{position:absolute;top:2px;right:2px;min-width:22px;padding:1px 3px;border-radius:9px;background:#163958;color:#fff;font:700 10px/1.3 sans-serif}
body.home-v4 .v4-player-shortcuts button:hover,body.home-v4 .v4-player-shortcuts button:focus-visible,body.home-v4 .v4-player-shortcuts button:active{background:#ffe086;border-color:#b58a25;color:#3a2a08}
.v4-player-reward-dot{display:none;position:absolute;right:9px;top:4px;width:7px;height:7px;background:#d33;border-radius:50%;border:1px solid white}
body.v4-gift-dot .v4-player-reward-dot{display:block}
body.home-v4 .game-hud:has(.hud-debt:not([hidden])) .v4-player-shortcuts{top:calc(100% + 24px)}
@media(max-width:600px){body.home-v4 .v4-player-shortcuts button{width:clamp(45px,calc((100vw - 40px)/6),65px);min-height:52px;font-size:10px}body.home-v4 .v4-player-shortcuts img{width:28px;height:28px}}
/* 10-30 桃園／台灣／世界地圖不顯示首頁寵物（原本疊在商家卡上擋住進店／外縣市按鈕） */
.character-home-hero.is-region-map .avatar-3d-stage{display:none!important}
/* 10-30 大地圖任務追蹤（主線／每日＋寵物進階） */
body.home-v4 .v4-quest-track{display:flex;flex-direction:column;gap:4px;margin-top:6px;padding:6px 8px;max-width:210px;border:1px solid #bf9440;border-radius:12px;background:#fffaf0f2;box-shadow:0 3px 10px #0003;color:#453012}
body.home-v4 .v4-quest-track>b{font:900 12px/1.2 sans-serif;color:#7a4d0a}
body.home-v4 .v4-quest-track button{display:block;width:100%;min-height:0;margin:0;padding:4px 6px;border:1px solid #e6cf9a;border-radius:8px;background:#fff;color:#2f2410;text-align:left;font:800 12px/1.3 sans-serif;white-space:normal}
body.home-v4 .v4-quest-track button small{display:block;color:#2f6fb0;font:800 11px/1.2 sans-serif}
body.home-v4 .v4-quest-track button.is-ready{border-color:#d9a520;background:#fff3c4}

/* 地圖縣市／海外市場：選單留在卡內，不讓整張地圖上下捲動。 */
.v4-region-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;max-height:112px;min-height:0;overflow:auto;padding:2px;margin:4px 0 7px}
.v4-region-choices button,.v4-region-details>button{min-width:0;padding:6px 4px;border:1px solid #c7a665;border-radius:8px;background:#fff9e9;color:#49330f;font:600 12px/1.25 system-ui,sans-serif;cursor:pointer}
.v4-region-choices button[aria-pressed="true"]{background:#f8d66b;border-color:#ab741d}
.v4-region-choices button:disabled{color:#72767c;background:#e9e9e9;border-color:#c9c9c9;cursor:not-allowed}
.v4-region-details{display:grid;gap:6px;min-height:0;overflow:auto;font-size:12px}
.v4-region-details .v4-merchant-card{display:grid;grid-template-columns:1fr auto;gap:2px 9px;padding:8px 10px;border:1px solid #c7a665;border-radius:9px;background:#fff9e9;color:#3e321d;text-align:left;font:inherit;cursor:pointer}
.v4-region-details .v4-merchant-card:hover{background:#ffe2a0}
@media(max-width:600px){.v4-layer-card{left:10px;width:min(390px,calc(100% - 20px));bottom:68px}.v4-region-choices{grid-template-columns:repeat(2,minmax(0,1fr));max-height:96px}}