/* ══════════════════════════════════════════════════════════════
   RUVO 手机外壳（T22 · 样张 M3「コレクターズ・ルーム」，主席 10/12 定）
   只在 ≤767 生效：顶栏（56 高，滚动前透明、过 24px 淡入玻璃）、浮动图标导航 dock（距底 20 + safe-area，74% 玻璃）、
   底部 96px 渐隐、子导航改横滑胶囊、通用底部弹层 RuvoSheet（搜索层、⋯ 菜单、游戏选择都用它）。
   ≥768 的桌面与平板：app.js 根本不挂这些 DOM，本文件的外壳规则也都在 @media (max-width: 767px) 里，所以一像素都不变；
   挂过以后再变宽（转屏、分屏），第 4 节末尾的 min-width: 768px 规则把外壳整块藏起。
   例外：.rs-*（RuvoSheet）不限宽度——只有调用 RuvoSheet.open() 时才有 DOM。
   颜色只用 ruvo-c.css 第 1 节的 token（--glass-bar／--glass-dock 是 T22 加的两枚）。
   加载顺序：每页最后一个样式表（在 ruvo-c.css 与页内 ruvo-c-*.css 之后）。动效与弹层逻辑在 ruvo-c-mobile.js。
   ══════════════════════════════════════════════════════════════ */

/* ───────────── 1. 给正文的边距变量（T23–T25 用） ─────────────
   --m-top-h：顶栏占位高（含刘海安全区），--m-dock-space：页面底部要留出的高度（dock + 渐隐，页脚因此能完整滚出来） */
:root {
  --m-top-h: calc(56px + env(safe-area-inset-top, 0px));
  --m-dock-space: calc(124px + env(safe-area-inset-bottom, 0px));
  --m-gutter: 16px;
}

@media (max-width: 767px) {
  /* ───────────── 2. 桌面版头让位 ─────────────
     只有外壳真的挂上了（app.js 给 <html> 加 .m-shell）才藏：脚本没跑起来时旧版头照样能用 */
  html.m-shell .c-masthead { z-index: 20; }
  html.m-shell .c-masthead .c-hdr { display: none !important; }
  html.m-shell .c-masthead .c-hdr-wrap { width: auto; margin: 0; padding: 0; }
  html.m-shell body { padding-bottom: var(--m-dock-space) !important; }
  /* 锚点跳转、键盘聚焦滚动时不落在顶栏下面、不被 dock 盖住 */
  html.m-shell { scroll-padding-top: calc(var(--m-top-h) + 8px); scroll-padding-bottom: var(--m-dock-space); }
  /* 正文里吸顶的东西（BOX 详情的目录条）挪到顶栏下面 */
  html.m-shell .bx-toc-wrap { top: calc(var(--m-top-h) + 8px); }
  /* 相場／BOX 分析组的子导航：顶栏下面一条可横滑的胶囊（当前项由 ruvo-c.js 滚到看得见） */
  html.m-shell .c-subnav {
    display: flex !important; width: auto; max-width: none;
    margin: 4px var(--m-gutter) 4px !important; padding: 4px;
    scroll-padding-inline: 16px; overscroll-behavior-x: contain;
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 24px), transparent);
            mask-image: linear-gradient(90deg, #000 calc(100% - 24px), transparent);
  }
  html.m-shell .c-subnav a { flex: none; height: 44px; padding: 0 16px; font-size: 14px; }
  html.m-shell .c-subnav a:last-child { margin-right: 20px; }
  /* 只给桌面的 ⌘K 层：手机上不出（搜索走底部弹层） */
  html.m-shell #cmd { display: none !important; }
  /* 「準備中」提示别压在 dock 上 */
  html.m-shell #game-soon-toast { bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important; max-width: calc(100vw - 32px); white-space: normal; text-align: center; }

  /* ───────────── 3. 顶栏（M3 A14：透明 → 滚过 24px 淡入玻璃与底线；字标淡出、页名淡入） ───────────── */
  .m-top {
    position: fixed; top: 0; left: 0; right: 0; z-index: 80;
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    height: var(--m-top-h); padding: env(safe-area-inset-top, 0px) 12px 0 10px; box-sizing: border-box;
    background: transparent; border-bottom: 1px solid transparent;
    transition: background-color .25s ease, border-color .25s ease, -webkit-backdrop-filter .25s ease, backdrop-filter .25s ease;
  }
  .m-top.is-scrolled {
    background: var(--glass-bar);
    -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4);
    border-bottom-color: var(--line);
  }
  .m-top-space { height: var(--m-top-h); }
  .m-brand { position: relative; display: inline-flex; align-items: center; gap: 2px; min-width: 44px; min-height: 44px; flex: none; text-decoration: none; border-radius: 14px; }
  .m-brand .c-mark { width: 44px; height: 44px; flex: none; }
  .m-brand .c-word { width: 86px; height: 25px; transition: opacity .2s ease; }
  .m-top.is-scrolled .m-brand .c-word { opacity: 0; }
  .m-title {
    position: absolute; left: 60px; top: calc(50% + env(safe-area-inset-top, 0px) / 2); transform: translateY(-50%);
    max-width: calc(100% - 60px - 220px); margin: 0;
    font: 800 17px/1.2 var(--f-jp); color: var(--text-1); letter-spacing: .01em;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    opacity: 0; pointer-events: none; transition: opacity .2s ease;
  }
  .m-top.is-scrolled .m-title { opacity: 1; }
  .m-acts { display: flex; align-items: center; gap: 6px; flex: none; }

  /* 圆钮（44）与游戏小牌：透明顶栏上也站得住——自带面板底和一圈细线 */
  .m-ibtn, .m-gamechip {
    position: relative; display: inline-grid; place-items: center; flex: none;
    height: 44px; padding: 0; border: 0; border-radius: 999px; cursor: pointer;
    background: var(--glass-dock); color: var(--text-1);
    -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4);
    box-shadow: 0 0 0 1px var(--line), var(--shadow-1);
    -webkit-tap-highlight-color: transparent;
  }
  .m-ibtn { width: 44px; }
  .m-ibtn .ic { width: 22px; height: 22px; }
  .m-gamechip { min-width: 64px; padding: 0 8px; }
  .m-gamechip img { display: block; max-width: 84px; max-height: 22px; object-fit: contain; }
  /* ポケモン的官方 logo 下面带一行「トレーナーズウェブサイト」副标，缩到小牌里只剩色块：跟首页四作托盘一样裁掉副标只留主标（r1 M2） */
  /* 尺寸照 M3 样张 .game-chip .pkm-crop（宽 84，574:84 → 高 12）；r2 M1 嫌 72×10 读不出，回到样张的 84×12 */
  .m-gamechip[data-g="pokemon"] img { width: 84px; height: 12px; max-width: none; max-height: none; object-fit: cover; object-position: 50% 0; }
  /* 游戏 logo 跟桌面四作托盘一样：只用浅底版 logo，深色里垫 --logo-plate-on 白衬块（C3 A12） */
  .m-gamechip img.th-dark { display: none; }
  body[data-theme="dark"] .m-gamechip { background: var(--logo-plate-on); }
  .m-ibtn[aria-expanded="true"], .m-gamechip[aria-expanded="true"] { background: var(--plate); color: var(--plate-ink); box-shadow: var(--shadow-plate); }
  /* プロ表示中：⋯ 钮右上一枚柠檬小点（菜单关着也看得出当前视图，r1 M6；读屏靠 aria-label 里的「プロ表示中」） */
  body[data-view="pro"] .m-ibtn[data-m-menu]::after {
    content: ""; position: absolute; top: 7px; right: 7px; width: 9px; height: 9px; border-radius: 50%;
    background: var(--lemon); box-shadow: 0 0 0 1.5px var(--lemon-deep);
  }

  /* 首页：顶栏下一行小字时钟徽标（M3 asof）＋件数 */
  .m-asof {
    display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px;
    margin: 0 var(--m-gutter) 4px; font: 700 12px/1.3 var(--f-jp); color: var(--text-3);
  }
  .m-asof-pill {
    display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 12px 0 9px; border-radius: 999px;
    background: var(--panel); box-shadow: 0 0 0 1px var(--line), var(--shadow-1);
    font: 800 13px/1 var(--f-jp); color: var(--text-2); white-space: nowrap;
  }
  .m-asof-pill .ic { width: 16px; height: 16px; color: var(--text-2); }
  .m-asof-pill time { font-family: var(--f-num); font-variant-numeric: tabular-nums; color: var(--text-1); }
  .m-asof-n { white-space: nowrap; }

  /* ───────────── 4. 浮动图标导航 dock（BEUI-dock：选中底板 size 44、SPRING_LAYOUT 360/32/0.6） ───────────── */
  .m-dock {
    position: fixed; left: 50%; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 90;
    transform: translateX(-50%);
    display: flex; align-items: center; gap: 2px; padding: 6px; border-radius: 999px;
    max-width: calc(100vw - 24px); box-sizing: border-box;
    background: var(--glass-dock);
    -webkit-backdrop-filter: blur(22px) saturate(1.5); backdrop-filter: blur(22px) saturate(1.5);
    box-shadow: 0 0 0 1px var(--line), var(--shadow-3);
    isolation: isolate;
  }
  .m-dock a {
    position: relative; z-index: 1; flex: none;
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-width: 44px; height: 44px; padding: 0 10px; box-sizing: border-box; border-radius: 999px;
    color: var(--text-2); text-decoration: none; -webkit-tap-highlight-color: transparent;
    transition: color .2s ease;
  }
  .m-dock a:not(.is-on) { width: 44px; padding: 0; }
  .m-dock a .ic { width: 22px; height: 22px; flex: none; }
  .m-dock-lab { display: none; font: 800 14px/1 var(--f-jp); white-space: nowrap; letter-spacing: .01em; }
  .m-dock a.is-on { color: var(--plate-ink); padding: 0 16px 0 12px; }
  .m-dock a.is-on .m-dock-lab { display: inline; }
  .m-dock a.is-on .ic { --ic-fill: var(--lemon); }
  .m-dock-plate {
    position: absolute; left: 0; top: 6px; z-index: 0; width: 0; height: 44px; border-radius: 999px;
    background: var(--plate); box-shadow: var(--shadow-plate); opacity: 0; pointer-events: none;
  }
  .m-dock.ready .m-dock-plate { opacity: 1; }
  /* 脚本没跑起来：当前项自己画底板 */
  .m-dock:not(.ready) a.is-on { background: var(--plate); }
  /* 底部 96px 渐隐遮罩（M3 A15）：dock 之下、内容之上 */
  .m-fade {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 85; pointer-events: none;
    height: calc(96px + env(safe-area-inset-bottom, 0px));
    background: linear-gradient(to bottom, transparent, var(--bg) 78%);
  }

  @media (max-width: 370px) {
    .m-top { padding-left: 6px; padding-right: 8px; }
    .m-brand .c-word { width: 74px; height: 22px; }
    .m-acts { gap: 4px; }
    .m-gamechip { min-width: 56px; padding: 0 6px; }
    .m-gamechip img { max-width: 72px; }
    .m-gamechip[data-g="pokemon"] img { width: 72px; height: 10px; }
    .m-title { left: 54px; max-width: calc(100% - 54px - 196px); }
    .m-dock a.is-on { padding: 0 12px 0 10px; }
  }
  /* 320 这类老机型：字标与右侧三件之间只剩十几 px，小牌退回 60 宽 */
  @media (max-width: 340px) {
    .m-gamechip img { max-width: 60px; }
    .m-gamechip[data-g="pokemon"] img { width: 60px; height: 9px; }
  }
}

/* 外壳挂上后窗口又拉宽到 ≥768（手机横屏、iPad 分屏、桌面窗口拖宽）：外壳 DOM 还在但整块藏起来，旧版头照常（r1 B1）。
   app.js 同时摘掉 <html>.m-shell，ruvo-c-mobile.js 收掉外壳开的弹层；再变窄时原样回来。 */
@media (min-width: 768px) {
  .m-top, .m-top-space, .m-asof, .m-dock, .m-fade { display: none !important; }
}

/* ───────────── 5. 通用底部弹层 RuvoSheet（BEUI-morphing-modal placement bottom，SPRING_PANEL 420/40/0.5） ─────────────
   结构：.rs-host > .rs-scrim + .rs-sheet[role=dialog] > .rs-handle(44 高按钮) + .rs-head + .rs-body(滚动) + .rs-foot?
   高度与位移由 ruvo-c-mobile.js 每帧写：style.height（中档／全开之间跟手长高）＋ translateY（低于最低一档时往下走） */
.rs-host { position: fixed; inset: 0; z-index: 1000; }
.rs-scrim {
  position: absolute; inset: 0; background: var(--scrim);
  -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);
}
.rs-sheet {
  position: absolute; left: 0; right: 0; bottom: 0; box-sizing: border-box;
  display: flex; flex-direction: column; max-width: 720px; margin: 0 auto;
  background: var(--overlay); color: var(--text-1);
  border-radius: 32px 32px 0 0;
  box-shadow: inset 0 1px 0 var(--hi), 0 0 0 1px var(--line-strong), var(--shadow-3);
  overflow: hidden; will-change: transform, height; transform-origin: 50% 100%;
}
.rs-handle {
  flex: none; display: grid; place-items: center; width: 100%; height: 44px; padding: 0; border: 0; margin: 0;
  background: transparent; cursor: grab; touch-action: none; -webkit-tap-highlight-color: transparent;
}
.rs-handle::before { content: ""; width: 40px; height: 5px; border-radius: 9px; background: var(--line-strong); }
.rs-handle:active { cursor: grabbing; }
.rs-head {
  flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 0 14px 10px 20px; touch-action: none;
}
.rs-title { margin: 0; font: 800 24px/1.25 var(--f-jp); color: var(--text-1); letter-spacing: .01em; }
.rs-close, .rs-ibtn {
  position: relative; display: inline-grid; place-items: center; flex: none;
  width: 44px; height: 44px; padding: 0; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--tray); color: var(--text-1); box-shadow: inset 0 0 0 1px var(--ring);
  -webkit-tap-highlight-color: transparent;
}
.rs-close .ic, .rs-ibtn .ic { width: 22px; height: 22px; }
.rs-body {
  flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain;
  padding: 4px 20px calc(20px + env(safe-area-inset-bottom, 0px)); -webkit-overflow-scrolling: touch;
}
.rs-foot {
  flex: none; padding: 12px 20px calc(16px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--line); background: var(--overlay);
}
.rs-sheet.has-foot .rs-body { padding-bottom: 20px; }
html.rs-lock, html.rs-lock body { overflow: hidden !important; }

/* ───────────── 6. 搜索层（M3 ⑤ 検索；A26 打开即聚焦、A27 无标题、44 关闭圆钮、有字才出清除钮） ───────────── */
.ms-bar { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 8px; padding: 0 0 12px; background: var(--overlay); }
.ms-field {
  position: relative; flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 8px;
  height: 48px; padding: 0 4px 0 14px; border-radius: 999px; box-sizing: border-box;
  background: var(--tray); box-shadow: inset 0 0 0 1px var(--line-strong);
}
.ms-field > .ic { width: 22px; height: 22px; color: var(--text-2); flex: none; }
.ms-field input[type="search"] {
  flex: 1 1 auto; min-width: 0; height: 44px !important; min-height: 44px !important; padding: 0 !important; margin: 0;
  border: 0 !important; box-shadow: none !important; background: transparent !important; border-radius: 0 !important;
  font: 700 16px/1.2 var(--f-jp); color: var(--text-1); outline-offset: 4px;
}
.ms-field:focus-within { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.ms-field input[type="search"]:focus-visible { outline: none !important; }
.ms-field input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; display: none; }
.ms-clear {
  position: relative; flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0;
  background: transparent; cursor: pointer; border-radius: 999px; color: var(--overlay);
}
.ms-clear i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--text-3); }
.ms-clear .ic { width: 14px; height: 14px; --ic-sw: 2.6; }
.ms-clear[hidden] { display: none; }
.ms-hint { margin: 0 0 4px; font: 700 13px/1.5 var(--f-jp); color: var(--text-3); }
.ms-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 18px 0 8px; font: 800 13px/1.4 var(--f-jp); color: var(--text-3); letter-spacing: .04em; }
.ms-h:first-child { margin-top: 4px; }
.ms-h .ms-h-n { font-family: var(--f-num); font-variant-numeric: tabular-nums; letter-spacing: 0; }
.ms-h button { min-height: 44px; padding: 0 4px; border: 0; background: transparent; color: var(--sky-text); font: 800 13px/1 var(--f-jp); cursor: pointer; }
.ms-recent { display: flex; flex-wrap: wrap; gap: 8px; }
.ms-chip {
  display: inline-flex; align-items: center; gap: 6px; height: 44px; max-width: 100%; padding: 0 16px 0 12px; border: 0; border-radius: 999px; box-sizing: border-box;
  background: var(--tray); box-shadow: inset 0 0 0 1px var(--ring); color: var(--text-1);
  font: 700 14px/1 var(--f-jp); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ms-chip .ic { width: 16px; height: 16px; color: var(--text-3); flex: none; }
.ms-kinds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ms-kind {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 76px; padding: 8px 4px;
  border-radius: 20px; background: var(--panel); box-shadow: 0 0 0 1px var(--line), var(--shadow-1);
  color: var(--text-1); text-decoration: none; font: 800 14px/1.2 var(--f-jp); text-align: center;
}
.ms-kind .ic { width: 28px; height: 28px; color: var(--sky-text); --ic-fill: var(--lemon); }
.ms-kind small { font: 700 11px/1.2 var(--f-jp); color: var(--text-3); }
.ms-games, .mg-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ms-game, .mg-opt {
  position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 56px; padding: 6px 10px;
  border: 0; border-radius: 18px; cursor: pointer; box-sizing: border-box;
  background: var(--panel); box-shadow: 0 0 0 1px var(--line), var(--shadow-1); color: var(--text-1);
}
.ms-game img, .mg-opt img { display: block; max-width: 96px; max-height: 26px; object-fit: contain; }
.ms-game[aria-current="true"], .mg-opt[aria-checked="true"] { box-shadow: 0 0 0 3px var(--lemon), var(--shadow-1); }
.ms-game .ic, .mg-opt .ic { position: absolute; right: 8px; top: 8px; width: 18px; height: 18px; color: var(--text-1); }
.mg-opt { flex-direction: column; min-height: 88px; }
.mg-opt span { font: 800 13px/1.2 var(--f-jp); color: var(--text-1); }
.mg-opt small { font: 700 11px/1.2 var(--f-jp); color: var(--text-3); }
.ms-game img.th-dark, .mg-opt img.th-dark { display: none; }
/* 深色：logo 都是浅底设计，垫 --logo-plate 衬块；名字另起一行放在衬块外 */
body[data-theme="dark"] .ms-game img, body[data-theme="dark"] .mg-opt img { box-sizing: content-box; padding: 5px 10px; border-radius: 10px; background: var(--logo-plate); }
.ms-total { margin: 2px 0 4px; font: 800 13px/1.4 var(--f-jp); color: var(--text-3); }
.ms-total b { font-family: var(--f-num); font-variant-numeric: tabular-nums; color: var(--text-1); }
.ms-row {
  display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 6px 2px; box-sizing: border-box;
  border-bottom: 1px solid var(--line); color: var(--text-1); text-decoration: none;
}
.ms-row:last-of-type { border-bottom: 0; }
.ms-row .thumb-card { flex: none; width: 40px !important; height: 56px !important; object-fit: cover; border-radius: 4px; box-shadow: 0 0 0 1px var(--line); }
.ms-row .thumb.tbox { flex: none; width: 56px !important; height: 56px !important; display: grid; place-items: center; border-radius: 10px; background: var(--tray); overflow: hidden; }
.ms-row .thumb.tbox img { width: 100%; height: 100%; object-fit: contain; }
.ms-row .is-empty { background: var(--tray); }
.ms-row-b { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ms-row-n { font: 800 15px/1.3 var(--f-jp); color: var(--text-1); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ms-row-m { font: 700 12px/1.3 var(--f-jp); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ms-row-p { flex: none; font: 900 16px/1 var(--f-num); font-variant-numeric: tabular-nums; color: var(--text-1); }
.ms-more {
  display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; margin: 16px 0 4px; border-radius: 999px;
  background: var(--lemon); color: var(--sticker-ink); box-shadow: 0 2px 0 var(--ledge-lemon);
  font: 800 15px/1 var(--f-jp); text-decoration: none;
}
.ms-more .ic { width: 18px; height: 18px; }
.ms-empty { margin: 28px 0; text-align: center; font: 700 14px/1.6 var(--f-jp); color: var(--text-2); }

/* ───────────── 7. ⋯ 菜单 ───────────── */
.mm-stamp {
  display: grid; gap: 4px; margin: 0 0 8px; padding: 14px 16px; border-radius: 20px;
  background: var(--tray); box-shadow: inset 0 0 0 1px var(--ring);
}
.mm-stamp-t { display: flex; align-items: center; gap: 8px; font: 800 15px/1.3 var(--f-jp); color: var(--text-1); }
.mm-stamp-t time { font-family: var(--f-num); font-variant-numeric: tabular-nums; }
.mm-stamp-t .c-live { flex: none; }
.mm-stamp-n { padding-left: 16px; font: 700 13px/1.4 var(--f-jp); color: var(--text-2); }
.mm-live { width: 8px; height: 8px; border-radius: 50%; background: var(--down-mark); box-shadow: 0 0 0 3px var(--down-wash); flex: none; }
.mm-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; border-bottom: 1px solid var(--line); }
.mm-row:last-child { border-bottom: 0; }
.mm-lab { display: grid; gap: 2px; font: 800 15px/1.3 var(--f-jp); color: var(--text-1); }
.mm-lab small { font: 700 12px/1.4 var(--f-jp); color: var(--text-3); }
.mm-row .c-prosw { height: 44px; }
.rs-sheet .c-tsw::after, .rs-sheet .c-prosw::after, .rs-sheet [data-tip]::after { content: none !important; }
.mm-row .c-tsw { width: 80px; height: 44px; }
.mm-row .c-tsw-thumb { width: 36px; height: 36px; }
.mm-row .c-tsw[aria-checked="true"] .c-tsw-thumb { transform: translateX(36px); }
.mm-pal { padding: 12px 0 12px; border-bottom: 1px solid var(--line); }
/* 配色三项横排成三块（色票在上、名字在下、选中打勾）：竖排三行 212 高，菜单在中档放不下「ダークモード」（r1 S1）；横排 84 高，360×740 中档也全露 */
.mm-pal .c-pal-opts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.mm-pal .c-pal-opt {
  position: relative; grid-template-columns: none; justify-items: center; align-content: center; gap: 8px;
  height: auto; min-height: 84px; padding: 10px 4px; text-align: center; font-size: 13px;
  box-shadow: inset 0 0 0 1px var(--line);
}
.mm-pal .c-pal-opt[aria-checked="true"] { box-shadow: inset 0 0 0 1.5px var(--line-strong); }
.mm-pal .c-pal-opt .c-sw { width: 56px; height: 28px; }
.mm-pal .c-pal-opt .ic { position: absolute; top: 6px; right: 6px; width: 18px; height: 18px; }

/* ───────────── 7b. 悬停反馈（r1 S2）：只给有悬停能力的指针（≤767 的桌面窄窗、iPad 外接鼠标），触屏不出粘住的悬停态。
   子导航胶囊和配色项沿用 ruvo-c.css 已有的悬停。外壳件只在 ≤767 存在；弹层件（.rs-* / .ms-* / .mm-*）只在弹层打开时存在，所以桌面版头不受影响。只用现有 token。 ───────────── */
@media (hover: hover) and (pointer: fine) {
  .m-ibtn:not([aria-expanded="true"]):hover, .m-gamechip:not([aria-expanded="true"]):hover { box-shadow: 0 0 0 1px var(--line-strong), var(--shadow-2); }
  .m-dock a:not(.is-on):hover { background: var(--tray); color: var(--text-1); }
  .rs-close:hover, .rs-ibtn:hover, .ms-chip:hover { background: var(--panel); box-shadow: inset 0 0 0 1px var(--line-strong); }
  .rs-handle:hover::before { background: var(--text-3); }
  .ms-h button:hover { text-decoration: underline; text-underline-offset: 3px; }
  .ms-kind:hover, .ms-game:not([aria-current="true"]):hover, .mg-opt:not([aria-checked="true"]):hover { box-shadow: 0 0 0 1px var(--line-strong), var(--shadow-2); }
  .ms-row:hover { background: var(--tray); }
  .ms-more:hover { filter: brightness(1.04); }
}

/* ───────────── 8. 无障碍偏好（M3：减少透明 → 去玻璃；高对比 → 加深线条；减少动效 / ?still → 全停） ───────────── */
@supports not (background: color-mix(in srgb, red 50%, transparent)) {
  .m-top.is-scrolled { background: var(--bg); }
  .m-dock, .m-ibtn, .m-gamechip { background: var(--panel); }
}
@media (prefers-reduced-transparency: reduce) {
  .m-top.is-scrolled { background: var(--bg); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .m-dock, .m-ibtn, .m-gamechip { background: var(--panel); -webkit-backdrop-filter: none; backdrop-filter: none; }
  body[data-theme="dark"] .m-gamechip { background: var(--logo-plate-on); }
  .rs-scrim { -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (prefers-contrast: more) {
  .m-top.is-scrolled { border-bottom-color: var(--text-2); }
  .m-dock, .m-ibtn, .m-gamechip, .m-asof-pill { box-shadow: 0 0 0 1.5px var(--text-2), var(--shadow-1); }
  .m-dock a, .m-title { color: var(--text-1); }
  .m-dock a.is-on { color: var(--plate-ink); }
  .rs-handle::before { background: var(--text-2); }
  .rs-sheet { box-shadow: 0 0 0 1.5px var(--text-2), var(--shadow-3); }
  .ms-field, .ms-chip, .rs-close, .rs-ibtn { box-shadow: inset 0 0 0 1.5px var(--text-2); }
  .ms-row, .mm-row, .mm-pal { border-color: var(--line-strong); }
}
@media (prefers-reduced-motion: reduce) {
  .m-top, .m-title, .m-brand .c-word, .m-dock a { transition: none !important; }
}
html.c-still .m-top, html.c-still .m-title, html.c-still .m-brand .c-word, html.c-still .m-dock a { transition: none !important; }