:root {
    --bg-gradient: linear-gradient(135deg, #f5efe8 0%, #ede8f5 100%);
    --panel-bg: rgba(255, 255, 255, 0.75);
    --text-main: #50443a;
    --text-muted: #968b7e;
    --theme-orange: #dbaba5; 
    --btn-gradient: linear-gradient(135deg, #dbaba5 0%, #c48e86 100%);
    --radius-lg: 24px;
    --radius-md: 16px;
    --shadow-sm: 0 8px 32px 0 rgba(31, 38, 135, 0.04);
    --shadow-md: 0 12px 40px 0 rgba(31, 38, 135, 0.1);
  }
  
  /* ==========================================================================
   物體歸類：橘色莫蘭迪背景 + 全元件防放大鎖定
   ========================================================================== */
html, body {
    margin: 0; padding: 0; width: 100%; height: 100dvh;
    overflow: hidden; position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(135deg, #f5efe8 0%, #ede8f5 100%) !important; /* 恢復傳送帶溫暖橘 */
    -webkit-user-select: none; user-select: none;
    -webkit-tap-highlight-color: transparent;
  }
  
  /* 核心關鍵：強制畫面上所有文字、格子、按鈕全部停用 iOS 縮放手勢 */
  *, *::before, *::after {
    box-sizing: border-box;
    touch-action: none !important; /* 釘死每一個元件，徹底阻止 iPhone 雙擊放大 */
  }
  
  .container {
    width: 100%; height: 100dvh; display: flex;
    justify-content: center; align-items: center; padding: 16px; box-sizing: border-box;
  }
  
  /* 完美與其他遊戲統一 max-width: 400px */
  .game-dashboard {
    background: var(--panel-bg); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.5); padding: 25px; border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md); width: 100%; max-width: 400px; box-sizing: border-box; text-align: center;
  }
  
  .back-lobby-wrapper { text-align: left; margin-bottom: 16px; }
  .back-lobby-btn {
    display: inline-block; text-decoration: none; font-size: 13px; font-weight: 600;
    color: var(--text-muted); background: rgba(0, 0, 0, 0.04); padding: 6px 14px; border-radius: 20px;
  }
  
  /* 模式切換器（完美綠化/橘化膠囊版） */
  .mode-selector {
    background: rgba(0, 0, 0, 0.05); padding: 3px; border-radius: 30px; display: flex; gap: 2px; margin-bottom: 20px;
  }
  .mode-btn {
    flex: 1; background: transparent; border: none; padding: 8px 0; border-radius: 30px;
    font-size: 13px; font-weight: 600; color: var(--text-muted); cursor: pointer;
    transition: all 0.2s ease; -webkit-tap-highlight-color: transparent;
  }
  .mode-btn.active {
    background: var(--theme-orange); color: white;
    box-shadow: 0 3px 8px rgba(219, 171, 165, 0.25);
  }
  
  .meta-header { display: flex; justify-content: space-between; margin-bottom: 14px; }
  .stat-box {
    background: rgba(255, 255, 255, 0.6); padding: 12px 10px; border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm); flex: 1; margin: 0 5px; display: flex; flex-direction: column;
  }
  .stat-box .label { font-size: 12px; color: var(--text-muted); margin-bottom: 2px; }
  .stat-box .value { font-size: 24px; font-weight: 700; color: var(--text-main); font-variant-numeric: tabular-nums; }
  
  .progress-container { height: 6px; background: rgba(0, 0, 0, 0.04); border-radius: 3px; margin: 0 5px 24px 5px; overflow: hidden; }
  .progress-bar { height: 100%; background: var(--theme-orange); transition: width 0.1s linear; }
  
  /* 出題大字區 */
  .display-wrapper {
    height: 120px; display: flex; flex-direction: column; justify-content: center; align-items: center;
    margin-bottom: 24px; background: rgba(255, 255, 255, 0.4); border-radius: var(--radius-md);
  }
  .object-emoji { font-size: 48px; margin: 0; transition: transform 0.1s ease; }
  .target-label-text { font-size: 15px; color: var(--text-muted); font-weight: 600; margin-top: 4px; }
  
  /* 下方分類按鈕網格 */
  .category-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-bottom: 12px; height: 142px; }
  .cat-btn {
    border: none; height: 64px; border-radius: var(--radius-md); background: white;
    font-size: 16px; font-weight: 700; color: var(--text-main);
    box-shadow: 0 4px 12px rgba(0,0,0,0.04); cursor: pointer;
    transition: transform 0.1s; -webkit-tap-highlight-color: transparent;
  }
  .cat-btn:active { transform: scale(0.94); }
  
  /* 開始挑戰按鈕（精緻尺寸） */
  .start-action-block { height: 142px; display: flex; align-items: center; justify-content: center; padding: 0 5px; }
  .premium-start-btn {
    background: var(--btn-gradient); color: white; border: none; height: 50px; width: 170px;
    font-size: 15px; font-weight: 600; border-radius: 25px; cursor: pointer;
    box-shadow: 0 6px 16px rgba(219, 171, 165, 0.3); transition: transform 0.1s;
    -webkit-tap-highlight-color: transparent;
  }
  .premium-start-btn:active { transform: scale(0.97); }
  
  /* 高級結算彈窗樣式 - 修正完全螢幕中央居中 */
.overlay {
    position: fixed; 
    top: 0; left: 0; right: 0; bottom: 0; /* 改用四向撐滿，避開 100vh 的瀏覽器邊界 Bug */
    background: rgba(50, 44, 40, 0.5); 
    backdrop-filter: blur(15px); 
    -webkit-backdrop-filter: blur(15px);
    z-index: 999999;
  }
  
  .modal {
    background: white; 
    padding: 26px 20px; 
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15); 
    width: 82%; 
    max-width: 280px; 
    text-align: center; 
    box-sizing: border-box;
    
    /* 採用絕對坐標居中法，完美解決行動裝置導覽列導致的偏下問題 */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .modal h2 { font-size: 18px; color: var(--text-main); margin: 6px 0 14px 0; font-weight: 700; }
  .trophy-icon { font-size: 54px; margin-bottom: 10px; }
  .score-relative-wrapper { position: relative; display: inline-block; width: 100%; }
  .result-score-box { background: rgba(0, 0, 0, 0.02); padding: 12px 10px; border-radius: 16px; margin-bottom: 14px; }
  .result-score-box p { margin: 0; font-size: 15px; color: var(--text-main); }
  .result-score-box span { font-weight: 700; font-size: 20px; }
  
  .new-badge {
    position: absolute; top: -15px; right: -2px; background: #ff6b6b !important; color: white !important;
    font-weight: 800; font-size: 11px !important; padding: 1px 6px !important; border-radius: 4px;
    box-shadow: 0 2px 6px rgba(255, 107, 107, 0.2); white-space: nowrap;
    transform: rotate(12deg) scale(0.8) !important; transform-origin: center; display: inline-block;
  }
  .best-record-line { color: #c48e86 !important; font-size: 13px; font-weight: 600; margin: 0 0 18px 0; }
  .restart-btn { background: var(--btn-gradient); color: white; border: none; padding: 11px 0; width: 100%; font-size: 15px; font-weight: 600; border-radius: 30px; cursor: pointer; }
  
  .hidden { display: none !important; }