/* 首页最终设计稿专用样式。单独置于 styles.css 之后，防止旧版首页规则覆盖。 */
.home-screen{
  min-height:100svh;padding:max(10px,env(safe-area-inset-top)) 17px max(96px,calc(env(safe-area-inset-bottom) + 88px));
  overflow-y:auto;background:radial-gradient(circle at 78% 2%,rgba(209,235,253,.72),transparent 27%),linear-gradient(180deg,#eef8ff 0,#fffdfa 35%,#fffdfa 100%);
}
.home-screen .home-topbar{min-height:59px;padding:0 2px;gap:8px}
.home-screen .profile-chip{width:min(270px,75%);height:59px;min-height:59px;flex:none;padding:0;background:transparent;border:0;outline:0;border-radius:0;box-shadow:none;overflow:visible}
.home-screen .profile-chip .mascot-button,.home-screen .profile-chip .profile-copy{display:none}
.home-screen .brand-reference{display:block;width:100%;height:100%;overflow:hidden;pointer-events:none}
.home-screen .home-topbar>.round-button{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.9);border:2px solid rgba(255,255,255,.96);outline:0;color:#222943;font-size:23px;line-height:1;box-shadow:0 7px 18px rgba(67,77,106,.12)}
.home-screen .hero-banner{position:relative;width:100%;aspect-ratio:875/399;min-height:0;margin:7px 0 0;padding:0;border:0;outline:0;border-radius:24px;background:none;box-shadow:0 10px 24px rgba(71,92,116,.13);overflow:hidden}
.home-screen .hero-banner::before,.home-screen .hero-banner::after{display:none}
.home-screen .hero-copy,.home-screen .hero-illustration{display:none}
.home-screen .hero-reference{display:block;width:100%;height:100%}
.home-screen .featured-case{position:relative;margin:13px 0 0;padding:13px 14px 14px;border:1px solid rgba(255,255,255,.95);outline:0;border-radius:27px;background:rgba(255,255,255,.97);box-shadow:0 10px 26px rgba(76,82,109,.10),0 3px 8px rgba(87,96,124,.06);overflow:visible}
.home-screen .case-header-row{display:flex;margin:0 0 7px;min-height:28px}
.home-screen .case-stamp{position:static;display:inline-flex;align-items:center;height:28px;padding:0 15px;border:0;border-radius:15px;outline:0;background:linear-gradient(100deg,#ff6f98,#ff5e91);box-shadow:none;color:#fff;font-size:13px;letter-spacing:.4px;font-weight:900}
.home-screen .case-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 1px 9px}
.home-screen .case-heading h2{margin:0;padding:0;color:#18213f;font-size:25px;line-height:1.2;font-weight:900;letter-spacing:1px}
.home-screen .case-hint-text{color:#8783a8;font-size:11px;font-weight:600;white-space:nowrap}
.home-screen .case-subline{display:none}
.home-screen .featured-cover{position:relative;display:block;width:100%;height:auto;aspect-ratio:814/263;padding:0;border:0;border-radius:13px;background:#dcebea;box-shadow:none;overflow:hidden}
.home-screen .featured-cover::before,.home-screen .featured-cover::after{display:none}
.home-screen .preview-half{display:block;position:relative;width:100%;height:100%;min-width:0;overflow:hidden}
.home-screen .preview-half:first-child{border-right:0}
.home-screen .featured-cover img{display:block;width:100%;height:100%;object-fit:cover;transform:none!important;transition:none}
.home-screen .case-meta{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:10px 1px}
.home-screen .case-meta .meta-pill{min-width:0;height:48px;padding:5px 10px;display:grid;grid-template-columns:34px 1fr;grid-template-rows:1fr 1fr;align-items:center;border:0;border-radius:15px;background:#fff8ef;box-shadow:none}
.home-screen .case-meta .meta-clues{background:#eefaff}
.home-screen .case-meta .meta-pill i{grid-row:1/3;width:30px;height:30px;display:grid;place-items:center;border-radius:11px;background:#fff;color:#ff5f8e;font-size:20px;font-style:normal;font-weight:900}
.home-screen .case-meta .meta-clues i{color:#54a8e8;font-size:16px}
.home-screen .case-meta .meta-pill div{display:grid;align-content:center;line-height:1.05}
.home-screen .case-meta .meta-pill small{font-size:9px;color:#9c93a6;font-weight:600}
.home-screen .case-meta .meta-pill b{font-size:15px;color:#202947;font-weight:900}
.home-screen .primary-start{width:100%;height:52px;padding:0 9px 0 22px;display:flex;align-items:center;justify-content:center;position:relative;border:0;outline:0;border-radius:27px;background:linear-gradient(100deg,#ff9a93 0%,#ff6f93 48%,#f53882 100%);box-shadow:0 5px 0 rgba(225,68,115,.25),0 8px 18px rgba(233,76,127,.18);color:#fff;font-size:19px;font-weight:900;letter-spacing:1px;text-shadow:none}
.home-screen .primary-start i{position:absolute;right:9px;top:8px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.88);color:#ef4e83;font-size:21px;font-style:normal;box-shadow:none}
.home-screen .home-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0 0}
.home-screen .home-action{position:relative;min-width:0;min-height:80px;height:80px;padding:11px 12px;display:grid;grid-template-columns:46px 1fr 12px;grid-template-rows:1fr;align-items:center;gap:9px;border:1px solid rgba(255,255,255,.98);outline:0;border-radius:23px;box-shadow:0 8px 18px rgba(68,95,116,.09);text-align:left}
.home-screen .archive-action{background:linear-gradient(135deg,#e2fbf7,#d9f7f4)}
.home-screen .rank-action{background:linear-gradient(135deg,#f0ebff,#e8e2ff)}
.home-screen .home-action>span{width:44px;height:44px;margin:0;border-radius:14px;display:grid;place-items:center;background:#68d2c7;color:#fff;font-size:25px;font-weight:900;box-shadow:none}
.home-screen .rank-action>span{background:#a68aee}
.home-screen .home-action>div{display:grid;gap:2px;min-width:0}
.home-screen .home-action b{display:block;margin:0;color:#173858;font-size:15px;line-height:1.15;font-weight:900}
.home-screen .home-action small{display:block;margin:0;color:#6f86a0;font-size:10px;line-height:1.2;font-weight:600;white-space:nowrap}
.home-screen .home-action>i{position:static;color:#4c9ca1;font-size:24px;font-style:normal;font-weight:600}
.home-screen .rank-action>i{color:#8974cf}
.home-screen .home-action.is-coming-soon::after{content:"待开放";position:absolute;right:11px;top:8px;padding:2px 6px;border-radius:8px;background:rgba(255,255,255,.72);color:#70a9a3;font-size:7px;font-weight:800}
.home-screen .bottom-nav{position:absolute;z-index:10;left:0;right:0;bottom:0;height:88px;display:grid;grid-template-columns:repeat(3,1fr);align-items:center;padding:7px 10px max(7px,env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border:0;border-radius:34px 34px 0 0;box-shadow:0 -8px 24px rgba(72,79,104,.10);backdrop-filter:blur(12px)}
.home-screen .bottom-nav button,.home-screen .bottom-nav .nav-home{width:100%;height:70px;padding:0;background:transparent;border:0;outline:0;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;color:#747488;box-shadow:none}
.home-screen .bottom-nav button span{width:39px;height:36px;border-radius:13px;display:grid;place-items:center;background:transparent;color:inherit;font-family:"Arial Unicode MS","Segoe UI Symbol",sans-serif;font-size:28px;line-height:1;font-weight:700;box-shadow:none}
.nav-icon{display:block;width:31px;height:31px;color:inherit}
.home-screen .bottom-nav button b{font-size:12px;font-weight:800}
.home-screen .bottom-nav button.is-selected{color:#f35082}
.home-screen .bottom-nav button.is-selected span{background:transparent;color:#f35082;box-shadow:none}

/* 关卡页只展示已经通关的关卡，并沿用设计稿底部导航。 */
.collection-screen{padding-bottom:max(98px,calc(env(safe-area-inset-bottom) + 90px));background:linear-gradient(180deg,#eef8ff 0,#fffdfa 34%,#fffdfa 100%)}
.collection-screen.is-active{animation:none!important;transform:none!important}
.collection-screen .bottom-nav{position:fixed;z-index:10;left:50%;right:auto;bottom:0;width:min(100vw,480px);height:88px;transform:translateX(-50%);display:grid;grid-template-columns:repeat(3,1fr);align-items:center;padding:7px 10px max(7px,env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border:0;border-radius:34px 34px 0 0;box-shadow:0 -8px 24px rgba(72,79,104,.10);backdrop-filter:blur(12px)}
.collection-screen .bottom-nav button,.collection-screen .bottom-nav .nav-home{width:100%;height:70px;padding:0;background:transparent;border:0;outline:0;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;color:#747488;box-shadow:none}
.collection-screen .bottom-nav button span{width:39px;height:36px;display:grid;place-items:center;background:transparent;color:inherit;box-shadow:none}
.collection-screen .bottom-nav button b{font-size:12px;font-weight:800}
.collection-screen .bottom-nav button.is-selected,.collection-screen .bottom-nav button.is-selected span{color:#f35082;background:transparent;box-shadow:none}
.collection-screen .archive-grid{padding-bottom:8px}
.collection-screen .archive-card{filter:none}
.archive-empty{grid-column:1/-1;min-height:250px;padding:36px 24px;display:grid;place-items:center;align-content:center;gap:8px;text-align:center;border-radius:26px;background:rgba(255,255,255,.86);box-shadow:0 8px 22px rgba(76,82,109,.08);color:#7a7890}
.archive-empty span{width:62px;height:62px;display:grid;place-items:center;border-radius:22px;background:#e8f8f6;color:#5fc7bc;font-size:35px;font-weight:900}
.archive-empty b{font-size:18px;color:#2f3b5a}.archive-empty small{font-size:11px;line-height:1.6}
@media (max-height:790px){
  .home-screen{padding-top:max(7px,env(safe-area-inset-top));padding-left:14px;padding-right:14px}
  .home-screen .home-topbar{min-height:52px}.home-screen .profile-chip{height:52px;min-height:52px;width:min(245px,73%)}
  .home-screen .home-topbar>.round-button{width:43px;height:43px}.home-screen .hero-banner{margin-top:4px}
  .home-screen .featured-case{margin-top:9px;padding:10px 11px 11px}.home-screen .case-header-row{margin-bottom:4px;min-height:24px}
  .home-screen .case-stamp{height:24px;font-size:12px}.home-screen .case-heading{margin-bottom:6px}.home-screen .case-heading h2{font-size:22px}
  .home-screen .case-meta{margin:7px 1px}.home-screen .case-meta .meta-pill{height:43px}
  .home-screen .primary-start{height:47px}.home-screen .primary-start i{top:6px;width:35px;height:35px}
  .home-screen .home-actions{margin-top:9px}.home-screen .home-action{height:68px;min-height:68px;padding:8px 10px;grid-template-columns:38px 1fr 10px}
  .home-screen .home-action>span{width:38px;height:38px;font-size:21px}.home-screen .home-action b{font-size:14px}
  .home-screen .bottom-nav{height:78px}.home-screen .bottom-nav button,.home-screen .bottom-nav .nav-home{height:62px}
}
@media (max-width:400px){
  .home-screen{padding-left:13px;padding-right:13px}.home-screen .profile-chip{width:225px}
  .home-screen .case-heading h2{font-size:22px}.home-screen .case-hint-text{font-size:9px}
  .home-screen .home-action{grid-template-columns:39px 1fr 9px;padding-left:9px;padding-right:9px}
  .home-screen .home-action>span{width:38px;height:38px;font-size:21px}.home-screen .home-action b{font-size:13px}.home-screen .home-action small{font-size:8px}
}

/* 关卡内：沙漏暂停与同步放大 */
.game-header .pause-tool{
  position:relative;width:56px;height:48px;padding:4px;border-radius:16px;
  display:grid;grid-template-columns:24px 1fr;align-items:center;
  background:rgba(255,255,255,.96);color:#3c4563;
}
.pause-tool>span{font-size:18px;line-height:1;font-weight:900}
.pause-tool>small{font-size:9px;line-height:1;font-weight:900}
.time-freeze-tool{background:linear-gradient(145deg,#eefaff,#dff5ff)!important;outline-color:#75b9dd!important}
.time-freeze-tool .tool-icon{font-size:23px}
.time-freeze-tool.is-active{background:linear-gradient(145deg,#dffcff,#bcefff)!important;outline-color:#38a9d4!important;box-shadow:0 0 0 4px rgba(89,203,231,.16),0 4px 0 rgba(65,145,181,.2)!important}
.time-freeze-tool.is-active small{color:#1684b7;font-weight:900}
.status-pill.timer.is-frozen{background:#e1f8ff!important;outline-color:#65c3e8!important;animation:timer-frozen-pulse 1.2s ease-in-out infinite}
.status-pill.timer.is-frozen span{filter:none}
@keyframes timer-frozen-pulse{50%{box-shadow:0 0 0 5px rgba(94,196,232,.15)}}
.modal-backdrop.is-pause{background:linear-gradient(160deg,#dcebf7,#f9eef4);backdrop-filter:none}
.game-modal.is-pause{max-width:315px}
.game-modal.is-pause .modal-badge{background:#77cbd5}
.zoom-viewer.is-inline .zoom-viewer-header{display:none}
.zoom-viewer.is-inline .zoom-scroll{
  inset:0;padding:0;overflow:hidden;border:3px solid #7bd4cf;border-radius:18px;
  background:#7bd4cf;touch-action:none;cursor:grab;
}
.zoom-sync-pair{width:100%;height:100%;display:grid;grid-template-rows:repeat(2,minmax(0,1fr));gap:3px;background:#7bd4cf;overflow:hidden}
.zoom-pane{position:relative;width:100%;height:100%;overflow:hidden;scrollbar-width:none;-ms-overflow-style:none;touch-action:none;background:#dfc9aa}
.zoom-pane::-webkit-scrollbar{display:none}
.zoom-pane-content{position:relative;min-width:100%;height:auto;will-change:width}
.zoom-pane-content .picture-frame{width:100%;height:auto;aspect-ratio:3/2;border:0;border-radius:0;overflow:hidden;cursor:crosshair}
.zoom-pane-content .picture-frame+.picture-frame{border:0}
.zoom-viewer.is-inline .zoom-scroll.is-dragging,.zoom-viewer.is-inline .zoom-scroll.is-dragging .picture-frame{cursor:grabbing}

/* ═══════════════════════════════════════════════════════
   UI POLISH V2 · 统一首页 / 关卡 / 道具 / 弹窗视觉
   方向：天空蓝 + 奶油白 + 暖橙强调，减少“模板小游戏感”
   ═══════════════════════════════════════════════════════ */
:root{
  --ui-navy:#17233d;
  --ui-text:#33445e;
  --ui-muted:#7d8da3;
  --ui-blue:#68bff2;
  --ui-blue-soft:#edf8ff;
  --ui-orange:#ffa51f;
  --ui-orange-deep:#f58b12;
  --ui-orange-soft:#fff5df;
  --ui-green:#73cf9f;
  --ui-green-soft:#ecfbf3;
  --ui-line:#dce8f0;
  --ui-card:#ffffff;
  --ui-shadow:0 10px 28px rgba(54,87,111,.11);
  --ico-search:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  --ico-settings:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.7 1.7 0 0 0 .3 1.9l.1.1-2.8 2.8-.1-.1a1.7 1.7 0 0 0-1.9-.3 1.7 1.7 0 0 0-1 1.6v.2h-4V21a1.7 1.7 0 0 0-1-1.6 1.7 1.7 0 0 0-1.9.3l-.1.1L4.2 17l.1-.1a1.7 1.7 0 0 0 .3-1.9A1.7 1.7 0 0 0 3 14H2.8v-4H3a1.7 1.7 0 0 0 1.6-1 1.7 1.7 0 0 0-.3-1.9L4.2 7 7 4.2l.1.1a1.7 1.7 0 0 0 1.9.3A1.7 1.7 0 0 0 10 3V2.8h4V3a1.7 1.7 0 0 0 1 1.6 1.7 1.7 0 0 0 1.9-.3l.1-.1L19.8 7l-.1.1a1.7 1.7 0 0 0-.3 1.9A1.7 1.7 0 0 0 21 10h.2v4H21a1.7 1.7 0 0 0-1.6 1Z'/%3E%3C/svg%3E");
  --ico-clock:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
  --ico-clock-plus:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='12' r='8'/%3E%3Cpath d='M11 8v4l2.5 1.5M19 5v6M16 8h6'/%3E%3C/svg%3E");
  --ico-bulb:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 22h4'/%3E%3Cpath d='M8.5 15.5A7 7 0 1 1 15.5 15.5c-.9.7-1.5 1.5-1.5 2.5h-4c0-1-.6-1.8-1.5-2.5Z'/%3E%3C/svg%3E");
  --ico-snow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 2v20M4.2 6.5l15.6 11M19.8 6.5l-15.6 11M8.7 4 12 6l3.3-2M8.7 20l3.3-2 3.3 2M3.5 10 7 10.2 7.8 7M20.5 14 17 13.8 16.2 17M20.5 10 17 10.2 16.2 7M3.5 14 7 13.8 7.8 17'/%3E%3C/svg%3E");
  --ico-zoom:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='10' r='6'/%3E%3Cpath d='m15 15 6 6M10 7v6M7 10h6'/%3E%3C/svg%3E");
  --ico-grid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1'/%3E%3C/svg%3E");
  --ico-pause:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Crect x='6' y='4' width='4' height='16' rx='2'/%3E%3Crect x='14' y='4' width='4' height='16' rx='2'/%3E%3C/svg%3E");
  --ico-back:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 18-6-6 6-6'/%3E%3C/svg%3E");
  --ico-calendar:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='3'/%3E%3Cpath d='M8 3v4M16 3v4M3 10h18M8 14h3M8 17h5'/%3E%3C/svg%3E");
  --ico-trophy:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 4h8v5a4 4 0 0 1-8 0V4ZM9 20h6M12 13v7M7 6H4v2a4 4 0 0 0 4 4M17 6h3v2a4 4 0 0 1-4 4'/%3E%3C/svg%3E");
}

html,body{background:#dfeff8}
.app-shell{background:linear-gradient(180deg,#eaf7ff 0%,#f8fcff 34%,#fffdf8 100%);box-shadow:0 0 44px rgba(42,80,106,.13)}

/* 首页：把视觉重心从粉色模板感拉回“清爽轻游戏” */
.home-screen{background:radial-gradient(circle at 80% 0,rgba(177,225,250,.55),transparent 28%),linear-gradient(180deg,#eaf7ff 0,#fffdf8 39%,#fffdf8 100%)}
.home-screen .featured-case{border:1px solid rgba(214,230,240,.9);box-shadow:var(--ui-shadow)}
.home-screen .case-stamp{background:linear-gradient(135deg,var(--ui-orange),#ffbc47);color:#fff;box-shadow:0 3px 8px rgba(245,139,18,.18)}
.home-screen .case-heading h2{color:var(--ui-navy)}
.home-screen .case-hint-text{color:var(--ui-muted)}
.home-screen .case-meta .meta-time{background:var(--ui-orange-soft)}
.home-screen .case-meta .meta-clues{background:var(--ui-blue-soft)}
.home-screen .case-meta .meta-pill i{color:var(--ui-orange-deep)}
.home-screen .case-meta .meta-clues i{color:#3d9ed8}
.home-screen .primary-start{background:linear-gradient(135deg,#ffb329 0%,#ff9418 62%,#f47f0b 100%);box-shadow:0 5px 0 rgba(215,113,7,.20),0 10px 22px rgba(241,139,17,.22);text-shadow:0 1px 2px rgba(155,78,0,.12)}
.home-screen .primary-start i{background:rgba(255,255,255,.92);color:var(--ui-orange-deep)}
.home-screen .home-action{border:1px solid rgba(214,230,240,.9);box-shadow:0 8px 20px rgba(62,94,116,.09)}
.home-screen .archive-action{background:linear-gradient(145deg,#e8f8ff,#dff4ff)}
.home-screen .rank-action{background:linear-gradient(145deg,#f0fbf5,#e2f7ec)}
.home-screen .home-action>span{background:#62b9eb}
.home-screen .rank-action>span{background:#78cfa1}
.home-screen .home-action b{color:var(--ui-navy)}
.home-screen .home-action small{color:var(--ui-muted)}
.home-screen .bottom-nav,.collection-screen .bottom-nav{border-radius:28px 28px 0 0;box-shadow:0 -7px 22px rgba(57,85,107,.08)}
.home-screen .bottom-nav button.is-selected,.collection-screen .bottom-nav button.is-selected,.collection-screen .bottom-nav button.is-selected span{color:var(--ui-orange-deep)}

/* 首页图标：去掉 Emoji / 字符混搭 */
.home-screen .home-topbar>.round-button{font-size:0;color:#54667b}
.home-screen .home-topbar>.round-button::before{content:"";width:22px;height:22px;background:currentColor;-webkit-mask:var(--ico-settings) center/contain no-repeat;mask:var(--ico-settings) center/contain no-repeat}
.home-screen .meta-clues i{font-size:0!important}
.home-screen .meta-clues i::before{content:"";width:18px;height:18px;background:#3d9ed8;-webkit-mask:var(--ico-search) center/contain no-repeat;mask:var(--ico-search) center/contain no-repeat}
.home-screen .archive-action>span,.home-screen .rank-action>span{font-size:0}
.home-screen .archive-action>span::before,.home-screen .rank-action>span::before{content:"";width:24px;height:24px;background:#fff}
.home-screen .archive-action>span::before{-webkit-mask:var(--ico-calendar) center/contain no-repeat;mask:var(--ico-calendar) center/contain no-repeat}
.home-screen .rank-action>span::before{-webkit-mask:var(--ico-trophy) center/contain no-repeat;mask:var(--ico-trophy) center/contain no-repeat}

/* 关卡页：让图片成为主角，控制区降低噪音 */
.game-screen{padding:max(12px,env(safe-area-inset-top)) 12px max(24px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#eaf7ff 0,#f8fcff 26%,#fffdf8 100%)}
.game-header{margin:0 2px 9px;min-height:50px;gap:8px}
.game-header .round-button{width:46px;height:46px;border:1px solid rgba(214,230,240,.95);outline:0;border-radius:16px;background:rgba(255,255,255,.96);box-shadow:0 7px 18px rgba(62,91,111,.09);color:var(--ui-navy)}
.game-header .back-button{font-size:0;background:#fff;color:#40556f}
.game-header .back-button::before{content:"";width:24px;height:24px;background:currentColor;-webkit-mask:var(--ico-back) center/contain no-repeat;mask:var(--ico-back) center/contain no-repeat}
.case-title{min-width:0;flex:1;text-align:center}
.case-title small{display:block;color:#6795b4;font-size:9px;letter-spacing:1.2px;font-weight:800}
.case-title h2{margin:2px 0 0;color:var(--ui-navy);font-size:19px;line-height:1.15;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game-header .pause-tool{width:52px;height:46px;padding:4px;grid-template-columns:20px 1fr;border-radius:16px;background:#fff;color:#4a5d73}
.pause-tool>span{font-size:0;display:grid;place-items:center}
.pause-tool>span::before{content:"";width:16px;height:16px;background:#52677e;-webkit-mask:var(--ico-pause) center/contain no-repeat;mask:var(--ico-pause) center/contain no-repeat}
.pause-tool>small{font-size:9px;color:#65788d}

.status-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:7px 0 8px;padding:7px;border-radius:20px;background:rgba(255,255,255,.84);border:1px solid rgba(214,230,240,.9);box-shadow:0 7px 18px rgba(62,91,111,.07)}
.status-pill{min-width:0;height:40px;border:0!important;outline:0!important;border-radius:14px;box-shadow:none!important;background:#f7fbfe;gap:5px}
.status-pill.hearts{background:#fff2f1}
.status-pill.timer{background:#fff7e6}
.status-pill.clues{background:#edf8ff}
.status-pill b{font-size:15px;color:var(--ui-navy)}
.status-pill small{font-size:9px;color:var(--ui-muted)}
.status-pill span{font-size:0;width:20px;height:20px;display:grid;place-items:center}
.status-pill.hearts span::before{content:"♥";font-size:19px;line-height:1;color:#ef6767}
.status-pill.timer span::before{content:"";width:18px;height:18px;background:#e79720;-webkit-mask:var(--ico-clock) center/contain no-repeat;mask:var(--ico-clock) center/contain no-repeat}
.status-pill.clues span::before{content:"";width:18px;height:18px;background:#3d9ed8;-webkit-mask:var(--ico-search) center/contain no-repeat;mask:var(--ico-search) center/contain no-repeat}
.status-pill.timer.is-frozen{background:#e8f8ff!important;outline:1px solid #8ed4f4!important}

.progress-dots{gap:6px;margin:0 0 9px}
.progress-dots i{width:18px;height:7px;border:0;border-radius:999px;background:#d6e3eb;box-shadow:none}
.progress-dots i.is-found{background:linear-gradient(90deg,#6fd19c,#4bbd83);box-shadow:none}

.picture-pair{border:4px solid #fff;outline:1px solid rgba(187,210,225,.95);border-radius:18px;background:#fff;box-shadow:0 12px 30px rgba(46,76,98,.13);overflow:hidden}
.picture-frame{background:#e6eef2}
.picture-frame+.picture-frame{border-top:3px solid #fff}
.picture-pair.feedback-correct{box-shadow:0 0 0 3px rgba(85,190,132,.68),0 12px 30px rgba(46,76,98,.13)}
.picture-pair.feedback-error{box-shadow:0 0 0 3px rgba(239,103,103,.70),0 12px 30px rgba(46,76,98,.13)}

.observation-tip{margin:8px 0 7px!important;color:#7d8da3!important;background:transparent!important;border:0!important;box-shadow:none!important;font-size:10px!important}
.observation-tip i{color:#9ec6dd!important}
.last-three-callout{border:0;background:linear-gradient(90deg,#fff4d9,#ffedc4);color:#855b28;box-shadow:none}

/* 道具栏：三项主道具 + 两项观察工具，一套图标语言 */
.game-toolbar{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr)) 48px 48px;gap:7px;align-items:stretch;margin-top:7px;padding:0;background:transparent!important;border:0!important;box-shadow:none!important}
.game-toolbar .toolbar-spacer{display:none!important}
.tool-button{min-width:0;min-height:72px;padding:8px 5px 7px!important;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:31px auto auto!important;place-items:center;border:1px solid rgba(214,230,240,.95)!important;outline:0!important;border-radius:17px!important;background:#fff!important;box-shadow:0 7px 18px rgba(61,92,115,.08)!important;color:var(--ui-navy)!important}
.tool-button b{font-size:11px!important;line-height:1.15!important;color:var(--ui-navy)!important}
.tool-button small{font-size:8px!important;line-height:1.15!important;color:#8998aa!important;text-align:center!important;white-space:nowrap}
.tool-icon{width:30px;height:30px;display:grid!important;place-items:center;font-size:0!important;border-radius:10px;background:var(--ui-orange-soft)}
.tool-icon::before{content:"";width:19px;height:19px;background:var(--ui-orange-deep)}
.tool-button[data-action="hint"] .tool-icon::before{-webkit-mask:var(--ico-bulb) center/contain no-repeat;mask:var(--ico-bulb) center/contain no-repeat}
.tool-button[data-action="add-time"] .tool-icon{background:var(--ui-green-soft)}
.tool-button[data-action="add-time"] .tool-icon::before{background:#45aa78;-webkit-mask:var(--ico-clock-plus) center/contain no-repeat;mask:var(--ico-clock-plus) center/contain no-repeat}
.time-freeze-tool{background:#fff!important;outline:0!important}
.time-freeze-tool .tool-icon{background:var(--ui-blue-soft)!important}
.time-freeze-tool .tool-icon::before{background:#3d9ed8;-webkit-mask:var(--ico-snow) center/contain no-repeat;mask:var(--ico-snow) center/contain no-repeat}
.time-freeze-tool.is-active{background:#effaff!important;box-shadow:0 0 0 2px rgba(82,178,224,.28),0 7px 18px rgba(61,92,115,.08)!important}
.square-tool{width:48px!important;min-width:48px!important;min-height:72px!important;height:72px!important;padding:0!important;border:1px solid rgba(214,230,240,.95)!important;outline:0!important;border-radius:17px!important;background:#fff!important;box-shadow:0 7px 18px rgba(61,92,115,.08)!important;color:#5d7187!important;font-size:0!important;display:grid!important;place-items:center!important}
.square-tool::before{content:"";width:23px;height:23px;background:currentColor}
.square-tool[data-action="zoom"]::before{-webkit-mask:var(--ico-zoom) center/contain no-repeat;mask:var(--ico-zoom) center/contain no-repeat}
.square-tool[data-action="grid"]::before{-webkit-mask:var(--ico-grid) center/contain no-repeat;mask:var(--ico-grid) center/contain no-repeat}

/* 开场播报：去掉粉紫感，和游戏主视觉统一 */
.case-intro{background:rgba(28,45,64,.42);backdrop-filter:blur(8px)}
.case-intro-card{background:linear-gradient(180deg,#fff,#fffaf0);border:3px solid #fff;outline:1px solid #d7e6ef;box-shadow:0 18px 45px rgba(29,52,70,.24)}
.intro-ribbon{color:#5e88a5}
.intro-ribbon span{color:var(--ui-orange)}
.intro-compass{background:linear-gradient(145deg,#ffc95b,#ff9b20);border:4px solid #fff;outline:1px solid #e8bd6d;box-shadow:0 7px 16px rgba(221,132,20,.20);color:#fff;text-shadow:none}
.case-intro-card>small{color:#6290ad}
.case-intro-card h2{color:var(--ui-navy)}
.case-intro-card>p{color:var(--ui-muted)}
.intro-meta span{background:var(--ui-orange-soft);color:#8d6a3f}
.intro-meta span+span{background:var(--ui-blue-soft);color:#557b96}
.intro-meta b{color:var(--ui-navy)}
.case-intro-card>strong{background:linear-gradient(135deg,#ffb329,#ff9418);box-shadow:0 4px 0 rgba(208,109,11,.18)}

/* 关卡列表 */
.collection-screen{background:linear-gradient(180deg,#eaf7ff 0,#f8fcff 30%,#fffdf8 100%)}
.collection-header{align-items:center!important}
.collection-header .round-button{border:1px solid rgba(214,230,240,.95)!important;outline:0!important;background:#fff!important;color:#50677f!important;box-shadow:0 7px 18px rgba(61,92,115,.08)!important}
.collection-header>div small{color:#6d9ab6!important}
.collection-header>div h2{color:var(--ui-navy)!important}
.collection-summary{border:1px solid rgba(214,230,240,.95)!important;background:#fff!important;box-shadow:var(--ui-shadow)!important}
.collection-summary b{color:var(--ui-orange-deep)!important}
.collection-summary div{background:#e8f1f6!important}
.collection-summary div i{background:linear-gradient(90deg,#ffb329,#ff9418)!important}
.archive-card{border:1px solid rgba(214,230,240,.95)!important;background:#fff!important;box-shadow:0 9px 22px rgba(61,92,115,.08)!important}

/* 结算 / 暂停弹窗 */
.modal-backdrop{background:rgba(28,45,64,.44)!important;backdrop-filter:blur(8px)}
.game-modal{border:0!important;outline:1px solid rgba(214,230,240,.95)!important;background:linear-gradient(180deg,#fff,#fffaf3)!important;box-shadow:0 22px 54px rgba(28,49,66,.28)!important}
.game-modal h2{color:var(--ui-navy)!important}
.game-modal p{color:var(--ui-muted)!important}
.game-modal .modal-badge{background:linear-gradient(145deg,#ffbd46,#ff991b)!important;color:#fff!important;box-shadow:0 6px 14px rgba(224,133,21,.20)!important}
.game-modal.is-pause .modal-badge{background:linear-gradient(145deg,#7fd3f5,#54addf)!important}
.modal-actions button{border-radius:16px!important}
.modal-actions .primary,.modal-actions button:first-child{background:linear-gradient(135deg,#ffb329,#ff9418)!important;color:#fff!important}

/* 小屏适配 */
@media (max-width:390px){
  .game-screen{padding-left:9px;padding-right:9px}
  .status-row{gap:5px;padding:6px}
  .status-pill{height:37px;gap:3px}.status-pill b{font-size:13px}.status-pill span{width:17px;height:17px}
  .game-toolbar{grid-template-columns:repeat(3,minmax(0,1fr)) 43px 43px;gap:5px}
  .square-tool{width:43px!important;min-width:43px!important}
  .tool-button b{font-size:10px!important}.tool-button small{font-size:7px!important}
}
