:root {

    --otter: url("/otter.png");

    --paper:     #ffffff;
    --card:      #ffffff;
    --line:      rgba(24,36,32,.09);
    --line-soft: #eef3f0;

    --bg-0: #ffffff;
    --bg-1: #f5f8f6;
    --bg-2: #f1f6f3;

    --line-2:    var(--bg-1);
    --surface-2: var(--bg-2);
    --ink:     #182420;
    --ink-2:   #44564f;
    --sub:     #71827a;
    --sub-2:   #a2b0a9;

    --bar:      #ffffff;
    --bar-ink:  #182420;
    --bar-sub:  #71827a;
    --nav:      #117954;
    --nav-2:    #0d6244;
    --nav-ink:  #ffffff;
    --gold:     #b8860b;
    --gold-2:   #e3c883;

    --gold-ink:  #8a6508;
    --gold-fill: #976e09;
    --on-gold:   #ffffff;

    --rank-2: #65778b;
    --rank-3: #936d4d;
    --rank-n: #677970;

    --up:      #cf3a2b;
    --down:    #1666b0;
    --link:    #0e6b4a;

    --shadow:  0 1px 2px rgba(24,36,32,.05),
               0 4px 10px rgba(24,36,32,.05),
               0 16px 32px rgba(24,36,32,.05);
  }

  :root[data-theme="dark"] {
    --paper:#0f1714; --card:#161f1c; --line:rgba(255,255,255,.10); --line-soft:#202b27;
    --bg-0:#161f1c; --bg-1:#1b2521; --bg-2:#131c19;
    --line-2:var(--bg-1); --surface-2:var(--bg-2);
    --ink:#e8efeb; --ink-2:#b9c7c0; --sub:#8a9a92; --sub-2:#5e6d66;
    --bar:#141d1a; --bar-ink:#e8efeb; --bar-sub:#8a9a92;
    --nav:#0f6446; --nav-2:#0b5138; --nav-ink:#ffffff;
    --gold:#e0b755; --gold-2:#8f7330;
    --gold-ink:#e0b755;
    --up:#e97060; --down:#6bb0ee; --link:#5fc79a;
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 3px 10px rgba(0,0,0,.4);
  }

  :root {
    --r-card: 14px;
    --r-ctl:  8px;
    --r-sm:   6px;
    --r-pill: 999px;
  }

  :root {
    --mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;
    --sans: system-ui, -apple-system, "Segoe UI", "Hiragino Sans",
            "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  }

  * { box-sizing: border-box; }
  body {
    margin: 0; background: var(--paper); color: var(--ink);
    font-family: var(--sans); font-size: 16px; line-height: 1.75;
  }
  a { color: var(--link); }
  .in { max-width: 1180px; margin: 0 auto; padding: 0 18px; }

  .hdr { background: var(--bar); color: var(--bar-ink); border-bottom: 1px solid var(--line); }
  .hdr .in {
    display: flex; align-items: center; gap: 20px;
    padding-top: 11px; padding-bottom: 11px; flex-wrap: wrap;
  }
  .logo {
    display: flex; align-items: baseline; gap: 9px;
    text-decoration: none; color: var(--bar-ink);
  }
  .logo .mark {

    font-family: var(--sans); font-size: 21px; font-weight: 700;
    letter-spacing: .04em;
  }

  .logo .mark em {
    font-style: normal; font-size: .76em; font-weight: 600;
    color: var(--sub); letter-spacing: 0;
  }
  .logo .tag {
    font-size: 13px; color: var(--bar-sub); letter-spacing: .02em;
    white-space: nowrap;
  }
  .search {
    flex: 1 1 280px; display: flex; min-width: 0;
    border: 1px solid var(--line); border-radius: var(--r-pill);
    overflow: hidden; background: var(--line-2);
  }
  .search input {
    flex: 1; min-width: 0; border: 0; background: transparent;
    color: var(--bar-ink); font: inherit; padding: 7px 16px;
  }
  .search input::placeholder { color: var(--sub-2); }
  .search input:focus { outline: none; }
  .search button {
    border: 0; background: var(--nav); color: var(--nav-ink);
    font: inherit; font-weight: 700; padding: 0 20px; cursor: pointer;
  }
  .hdr .util { display: flex; gap: 16px; font-size: 14px; }
  .hdr .util a { color: var(--sub); text-decoration: none; white-space: nowrap; }
  .hdr .util a:hover { color: var(--link); }

  .logomark {
    width: 40px; height: 40px; flex: none; border-radius: 50%;
    background: var(--bg-1) var(--otter) center / 112% no-repeat;
    box-shadow: inset 0 0 0 1px var(--line);
    text-indent: -9999px; overflow: hidden;
  }
  .logo .sub2 { display: block; font-size: 12.5px; color: var(--bar-sub); margin-top: -2px; }

  .hdr .stat {
    display: flex; align-items: baseline; gap: 6px; font-size: 13.5px;
    color: var(--sub); white-space: nowrap;
  }
  .hdr .stat b {
    font-family: var(--mono); font-variant-numeric: tabular-nums;
    font-size: 15px; color: var(--ink); font-weight: 700;
  }
  .btn-alert {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 14.5px; font-weight: 700; white-space: nowrap;
    padding: 6px 15px; border-radius: var(--r-pill);
    background: var(--nav); color: #fff; text-decoration: none;
  }
  .btn-alert:hover { filter: brightness(1.1); }
  .btn-ghost {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 14.5px; white-space: nowrap;
    padding: 6px 14px; border-radius: var(--r-pill);
    border: 1px solid var(--line); color: var(--ink-2); text-decoration: none;
  }
  .btn-ghost:hover { border-color: var(--nav); color: var(--nav); }

  .ticker {

    background: var(--surface-2); border-bottom: 1px solid var(--line);
    overflow: hidden; position: relative;
  }
  .ticker .in { display: flex; align-items: center; gap: 14px; padding-top: 0; padding-bottom: 0; }
  .ticker .tlabel {
    font-size: 12.5px; font-weight: 700; letter-spacing: .1em; color: #fff;
    background: var(--nav); padding: 3px 11px; border-radius: var(--r-pill);
    white-space: nowrap; flex: none; margin: 6px 0;
  }
  .tstream { overflow: hidden; flex: 1; min-width: 0; }
  .trow { display: flex; gap: 26px; white-space: nowrap; animation: slide 46s linear infinite; }
  .ticker:hover .trow { animation-play-state: paused; }
  @keyframes slide { from { transform: translateX(0); } to { transform: translateX(-50%); } }
  .titem {
    display: inline-flex; align-items: baseline; gap: 7px;
    font-size: 14.5px; padding: 7px 0; color: var(--ink-2); text-decoration: none;
  }
  .titem b { font-family: var(--mono); font-weight: 700; font-size: 15px; }
  .titem .pc { font-family: var(--mono); font-variant-numeric: tabular-nums; font-weight: 700; }
  .titem .pc.u { color: var(--up); } .titem .pc.d { color: var(--down); }
  .titem:hover b { text-decoration: underline; }

  .subnav { background: var(--card); border-bottom: 1px solid var(--line); }
  .subnav .in {
    display: flex; align-items: center; gap: 10px; flex-wrap: nowrap;
    overflow-x: auto; padding-top: 8px; padding-bottom: 8px;
  }
  .subnav .k {
    font-size: 13px; color: var(--sub); white-space: nowrap; flex: none;
  }
  .subnav a {
    font-size: 14.5px; color: var(--ink-2); text-decoration: none; white-space: nowrap;
    padding: 3px 12px; border-radius: var(--r-pill); border: 1px solid var(--line);
    background: var(--card);
  }
  .subnav a:hover { border-color: var(--nav); color: var(--nav); background: var(--line-2); }

  .gnav { background: var(--nav); position: relative; }
  .gnav .in { display: flex; gap: 0; overflow-x: auto; align-items: stretch; }
  .gnav .item { position: relative; flex: none; }
  .gnav a.top {
    display: flex; align-items: center; gap: 8px;
    color: rgba(255,255,255,.9); text-decoration: none;
    font-size: 15.5px; font-weight: 600; white-space: nowrap;
    padding: 11px 18px; border-bottom: 3px solid transparent;
  }

  .gnav a.top .ic {
    width: 16px; height: 16px; flex: none;
    fill: none; stroke: currentColor;
    stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
  }

  .gnav .item:nth-child(1) a.top .ic { stroke: var(--cat-watch); }
  .gnav .item:nth-child(2) a.top .ic { stroke: var(--cat-tcg);   }
  .gnav .item:nth-child(3) a.top .ic { stroke: var(--cat-game);  }
  .gnav a.top .cnt {
    font-family: var(--mono); font-variant-numeric: tabular-nums;
    font-size: 13px; font-weight: 700; color: rgba(255,255,255,.75);
    background: rgba(0,0,0,.22); border-radius: var(--r-pill); padding: 1px 8px;
  }
  .gnav .item:hover a.top { color: #fff; background: rgba(0,0,0,.14); }
  .gnav a.top:focus-visible { outline: 2px solid #ffd97a; outline-offset: -3px; }
  .gnav a.top[aria-current] {
    color: #fff; border-bottom-color: #ffd97a; background: rgba(0,0,0,.18);
  }
  .gnav a.top[aria-current] .cnt { color: #fff; }

  .gnav .divider { width: 1px; background: rgba(255,255,255,.24); margin: 9px 10px; flex: none; }
  .gnav a.top.plain { font-weight: 500; font-size: 15px; padding: 11px 15px; }

  .mega {
    position: absolute; top: 100%; left: 0; z-index: 40;
    min-width: 620px; background: var(--card);
    border: 1px solid var(--line); border-top: 0;
    border-radius: 0 0 var(--r-card) var(--r-card);
    box-shadow: 0 12px 28px rgba(24,36,32,.14);
    padding: 16px 18px; display: none;
  }
  .gnav .item:hover .mega, .gnav .item:focus-within .mega { display: block; }
  .mega h4 {
    margin: 0 0 8px; font-size: 13px; letter-spacing: .08em; color: var(--sub);
    font-weight: 700;
  }
  .mega h4 + .mgrid { margin-bottom: 14px; }
  .mgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(148px,1fr)); gap: 2px 10px; }
  .mgrid a {
    display: flex; justify-content: space-between; gap: 8px; align-items: baseline;
    font-size: 15px; color: var(--ink-2); text-decoration: none;
    padding: 4px 8px; border-radius: var(--r-sm);
  }
  .mgrid a:hover { background: var(--line-2); color: var(--nav); }
  .mgrid a .c {
    font-family: var(--mono); font-variant-numeric: tabular-nums;
    font-size: 13px; color: var(--sub-2);
  }
  .mfoot {
    margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line);
    display: flex; gap: 14px; flex-wrap: wrap; font-size: 14.5px;
  }
  .mfoot a { color: var(--nav); text-decoration: none; font-weight: 600; }
  .mfoot a:hover { text-decoration: underline; }

  :root {

    --cat-watch: #187ac5;
    --cat-tcg:   #9659cb;
    --cat-game:  #e52417;
  }

  :root[data-theme="dark"] {
    --cat-watch: #3f92d8; --cat-tcg: #b184e0; --cat-game: #f0614f;
  }

  [data-nav="b"] .gnav { background: var(--card); border-bottom: 1px solid var(--line); }
  [data-nav="b"] .gnav a.top { color: var(--ink-2); }
  [data-nav="b"] .gnav a.top .cnt {
    color: var(--sub); background: var(--line-2);
  }
  [data-nav="b"] .gnav .item:hover a.top { background: var(--line-2); color: var(--ink); }

  [data-nav="b"] .gnav a.top[aria-current] {
    color: var(--nav); background: transparent;
    border-bottom-color: var(--nav); font-weight: 700;
  }
  [data-nav="b"] .gnav a.top[aria-current] .cnt {
    color: var(--nav-ink); background: var(--nav);
  }
  [data-nav="b"] .gnav .item:nth-child(2) a.top:hover { color: var(--cat-tcg); }
  [data-nav="b"] .gnav .item:nth-child(3) a.top:hover { color: var(--cat-game); }
  [data-nav="b"] .gnav .divider { background: var(--line); }
  [data-nav="b"] .gnav a.top.plain { color: var(--sub); }

  [data-nav="d"] .gnav { background: var(--card); border-bottom: 1px solid var(--line); }
  [data-nav="d"] .gnav .item:nth-child(-n+3) { display: none; }
  [data-nav="d"] .gnav .divider { display: none; }
  [data-nav="d"] .gnav a.top.plain { color: var(--ink-2); font-size: 15px; }
  [data-nav="d"] .gnav a.top.plain:hover { background: var(--line-2); color: var(--nav); }
  .catcards { display: none; }
  [data-nav="d"] .catcards {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr));
    gap: 12px; padding: 16px 0 4px;
  }
  .catcard {
    display: block; padding: 14px 16px; border-radius: var(--r-card);
    border: 1px solid var(--line); background: var(--card);
    text-decoration: none; color: inherit; box-shadow: var(--shadow);
    border-top: 3px solid var(--c, var(--nav));
  }
  .catcard:hover { border-color: var(--c, var(--nav)); }
  .catcard .ci { font-size: 21px; line-height: 1; }
  .catcard .cn { font-size: 16px; font-weight: 700; margin-top: 5px; }
  .catcard .cc {
    font-family: var(--mono); font-variant-numeric: tabular-nums;
    font-size: 14px; color: var(--c, var(--nav)); font-weight: 700;
  }
  .catcard .cd { font-size: 13.5px; color: var(--sub); margin-top: 3px; }

  .crumbbar { background: var(--card); border-bottom: 1px solid var(--line); }
  .crumbbar .in {
    display: flex; align-items: center; gap: 7px;
    font-size: 14px; color: var(--sub);
    padding-top: 7px; padding-bottom: 7px; overflow-x: auto; white-space: nowrap;
  }
  .crumbbar a { color: var(--sub); text-decoration: none; }
  .crumbbar a:hover { color: var(--link); text-decoration: underline; }
  .crumbbar .sep { color: var(--sub-2); }
  .crumbbar strong { color: var(--ink-2); font-weight: 600; }

  .cols {
    display: grid; grid-template-columns: minmax(0,1fr) 296px;
    gap: 26px; align-items: start; padding: 24px 0 56px;
  }

  .box {
    background: var(--card); border: 1px solid var(--line);
    border-radius: var(--r-card); box-shadow: var(--shadow); overflow: hidden;
  }

  .box + .box { margin-top: 26px; }
  .box > h2, .box > h3 {

    margin: 0; padding: 16px 18px 13px; font-size: 19px; font-weight: 700;
    letter-spacing: .01em;
    background: var(--card); border-bottom: 1px solid var(--line-soft);
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  }
  .box > h2::before, .box > h3::before {
    content: ""; width: 5px; height: 22px; background: var(--gold);
    border-radius: var(--r-pill); flex: none;
  }
  .box > h2 .note, .box > h3 .note {
    margin-left: auto; font-weight: 400; font-size: 14px; color: var(--sub);
    flex: none;
  }
  .pad { padding: 18px; }

  .prod { display: flex; gap: 18px; padding: 16px; flex-wrap: wrap; }
  .thumb {
    width: 132px; height: 132px; flex: none; border-radius: var(--r-card);
    background:
      radial-gradient(circle at 50% 46%, var(--bg-2) 0 34%, transparent 35%),
      radial-gradient(circle at 50% 46%, var(--sub-2) 0 36%, transparent 37%),
      var(--bg-2);
    border: 1px solid var(--line);
    display: grid; place-items: center;
    font-size: 12.5px; color: var(--sub-2); text-align: center; line-height: 1.5;
  }
  .pinfo { flex: 1 1 260px; min-width: 0; }
  .brandline { font-size: 14.5px; color: var(--sub); }
  .brandline a { color: var(--link); text-decoration: none; }
  h1.ref {
    font-family: var(--mono); font-size: clamp(24px, 3.4vw, 31px);
    font-weight: 700; letter-spacing: -.015em; margin: 3px 0 4px; line-height: 1.15;
  }
  .mname { font-size: 17px; color: var(--ink-2); margin-bottom: 10px; }
  .chips { display: flex; gap: 7px; flex-wrap: wrap; }
  .chip {
    font-size: 13px; padding: 2px 11px; border-radius: var(--r-pill);
    border: 1px solid var(--line); color: var(--sub); background: var(--line-2);
  }
  .chip.gold { color: var(--gold-ink); border-color: var(--gold-2); background: transparent; }

  .src {
    display: flex; gap: 6px 26px; flex-wrap: wrap;
    padding: 9px 16px; background: var(--line-2);
    border-top: 1px solid var(--line); font-size: 14px; color: var(--sub);
  }
  .src b { color: var(--ink-2); font-weight: 600; }

  .kpis {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1px; background: var(--line);
  }
  .kpi { background: var(--card); padding: 13px 16px 12px; }
  .kpi .k { font-size: 13px; color: var(--sub); letter-spacing: .02em; }
  .kpi .v {
    font-family: var(--mono); font-variant-numeric: tabular-nums;
    font-size: 23px; font-weight: 700; letter-spacing: -.02em; line-height: 1.25;
  }

  .kpi.lead .v { font-size: 36px; }

  .kpi:nth-child(2) .v { font-size: 28px; }

  .kpi .s { font-size: 13.5px; color: var(--sub); }
  .kpi.lead .v { color: var(--gold); }
  .v.up { color: var(--up); } .v.down { color: var(--down); }

  .tabs { display: flex; gap: 0; border-bottom: 1px solid var(--line); background: var(--line-2); }
  .tabs button {
    font: inherit; font-size: 15px; color: var(--sub); background: transparent;
    border: 0; border-bottom: 3px solid transparent; padding: 9px 18px; cursor: pointer;
  }
  .tabs button[aria-selected="true"] {
    color: var(--ink); font-weight: 700; background: var(--card);
    border-bottom-color: var(--gold);
  }
  .tabs button:focus-visible { outline: 2px solid var(--link); outline-offset: -2px; }

  .rangebar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 11px; }
  .ranges { display: flex; border: 1px solid var(--line); border-radius: var(--r-pill); overflow: hidden; }
  .ranges button {
    font: inherit; font-size: 14px; color: var(--sub); background: var(--card);
    border: 0; border-right: 1px solid var(--line); padding: 5px 15px; cursor: pointer;
  }
  .ranges button:last-child { border-right: 0; }
  .ranges button[aria-pressed="true"] { color: #fff; background: var(--link); }
  .ranges button:focus-visible { outline: 2px solid var(--link); outline-offset: -2px; }
  .trend { font-size: 14.5px; color: var(--sub); font-variant-numeric: tabular-nums; }
  .trend b { font-family: var(--mono); font-size: 16px; font-weight: 700; }
  .trend b.up { color: var(--up); } .trend b.down { color: var(--down); }
  .chart { width: 100%; height: 236px; display: block; }
  .legend { display: flex; gap: 18px; flex-wrap: wrap; font-size: 13.5px; color: var(--sub); margin-top: 9px; }
  .legend i { display: inline-block; width: 15px; height: 2px; margin-right: 6px; vertical-align: middle; }
  .caveat {
    margin: 12px 0 0; padding: 9px 12px; border-left: 3px solid var(--gold-2);
    background: var(--line-2); font-size: 14px; color: var(--ink-2);
    border-radius: 0 var(--r-ctl) var(--r-ctl) 0;
  }

  .tw { overflow-x: auto; }
  table { border-collapse: collapse; width: 100%; min-width: 580px; }
  thead th {
    font-size: 13.5px; font-weight: 700; color: var(--sub); text-align: left;
    padding: 8px 14px; background: var(--line-2); border-bottom: 1px solid var(--line);
    white-space: nowrap;
  }
  thead th.num { text-align: right; }
  tbody td { padding: 10px 14px; border-bottom: 1px solid var(--line-soft); vertical-align: middle; }
  tbody tr:hover td { background: var(--line-2); }
  td.price {
    font-family: var(--mono); font-variant-numeric: tabular-nums; text-align: right;
    font-size: 17px; font-weight: 700; white-space: nowrap;
  }
  td.gap {
    font-family: var(--mono); font-variant-numeric: tabular-nums; text-align: right;
    font-size: 14.5px; color: var(--sub); white-space: nowrap;
  }
  tr.best td.price { color: var(--gold-ink); }
  .rank {
    display: inline-grid; place-items: center; width: 22px; height: 22px;
    border-radius: var(--r-pill); font-size: 13px; font-weight: 700;
    background: var(--line-2); color: var(--sub);
  }
  tr.best .rank { background: var(--gold-fill); color: var(--on-gold); }

  .cond { font-size: 12.5px; padding: 1px 10px; border-radius: var(--r-pill);
          border: 1px solid var(--line); color: var(--sub);
          white-space: nowrap; display: inline-block; }
  .cond.new { color: var(--down); border-color: currentColor; }

  .go {
    display: inline-block; font-size: 14.5px; color: var(--ink-2);
    text-decoration: underline; text-underline-offset: 2px; white-space: nowrap;
  }
  .go:hover { color: var(--link); }

  .dist { display: grid; gap: 6px; }
  .drow { display: grid; grid-template-columns: 112px 1fr 40px; align-items: center; gap: 10px; }
  .drow .lab { font-variant-numeric: tabular-nums; font-size: 14px; color: var(--sub); text-align: right; }
  .bar { height: 15px; background: var(--bg-2); border-radius: var(--r-pill); overflow: hidden; }
  .bar i { display: block; height: 100%; background: var(--sub-2); border-radius: var(--r-pill); }
  .drow.hot .bar i { background: var(--gold); }
  .drow .n { font-family: var(--mono); font-size: 13.5px; color: var(--sub); }

  .side .box > h3 { font-size: 17px; }
  .rank-list { list-style: none; margin: 0; padding: 0; }
  .rank-list li { border-bottom: 1px solid var(--line-soft); }
  .rank-list li:last-child { border-bottom: 0; }
  .rank-list a {
    display: grid; grid-template-columns: 24px 1fr auto; gap: 10px;
    align-items: center; padding: 9px 14px; text-decoration: none; color: inherit;
  }
  .rank-list a:hover { background: var(--line-2); }
  .rank-list .no {
    font-family: var(--mono); font-size: 14px; font-weight: 700;
    color: var(--on-gold); background: var(--rank-n); border-radius: var(--r-pill);
    text-align: center; line-height: 22px; height: 22px;
  }
  .rank-list li:nth-child(1) .no { background: var(--gold-fill); }
  .rank-list li:nth-child(2) .no { background: var(--rank-2); }
  .rank-list li:nth-child(3) .no { background: var(--rank-3); }
  .rank-list .nm { min-width: 0; }
  .rank-list .nm b { display: block; font-family: var(--mono); font-size: 15px; font-weight: 700; }
  .rank-list .nm span { font-size: 13px; color: var(--sub); }
  .rank-list .ch { font-family: var(--mono); font-size: 14.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .ch.u { color: var(--up); } .ch.d { color: var(--down); }

  .catlist { list-style: none; margin: 0; padding: 6px 0; }
  .catlist li a {
    display: flex; justify-content: space-between; gap: 10px;
    padding: 6px 15px; text-decoration: none; color: var(--ink-2); font-size: 15px;
  }
  .catlist li a:hover { background: var(--line-2); color: var(--link); }
  .catlist .c { color: var(--sub); font-family: var(--mono); font-size: 13.5px; }

  .promo {
    padding: 15px; font-size: 14.5px; color: var(--ink-2); line-height: 1.8;
  }
  .promo b { color: var(--ink); }

  .rel { display: grid; grid-template-columns: repeat(auto-fill, minmax(196px,1fr)); gap: 1px; background: var(--line); }
  .rcard { background: var(--card); padding: 12px 14px; text-decoration: none; color: inherit; display: grid; gap: 2px; }
  .rcard:hover { background: var(--line-2); }
  .rcard .rr { font-family: var(--mono); font-size: 16px; font-weight: 700; }
  .rcard .rn { font-size: 13.5px; color: var(--sub); }
  .rcard .rp { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 15px; margin-top: 3px; }
  .rcard .rm { font-size: 13px; color: var(--sub); font-variant-numeric: tabular-nums; }
  .rm .d { color: var(--down); } .rm .u { color: var(--up); }

  .ftr { background: var(--surface-2); color: var(--ink-2); margin-top: 10px;
         border-top: 1px solid var(--line); }
  .ftr .in { padding-top: 26px; padding-bottom: 24px; }
  .fgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(168px,1fr)); gap: 22px 30px; }
  .fgrid h4 {
    margin: 0 0 8px; font-size: 14px; color: var(--ink); font-weight: 700;
    letter-spacing: .04em; padding-left: 9px; border-left: 4px solid var(--gold);
  }
  .fgrid ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
  .fgrid a { color: var(--ink-2); text-decoration: none; font-size: 14.5px; }
  .fgrid a:hover { color: var(--link); text-decoration: underline; }
  .fbot {
    margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--line);
    display: flex; gap: 12px 26px; flex-wrap: wrap; align-items: baseline;
    font-size: 13.5px; color: var(--sub);
  }
  .fbot .op { color: var(--ink); font-weight: 600; }
  .fbot p { margin: 0; max-width: 70ch; line-height: 1.8; }

  .ad {
    background: var(--surface-2); border: 1px dashed var(--line);
    border-radius: var(--r-card); display: grid; place-items: center;
    color: var(--sub-2); font-size: 13.5px; text-align: center; line-height: 1.6;
  }
  .ad .adlabel {
    font-size: 11.5px; letter-spacing: .14em; color: var(--sub-2);
    border: 1px solid var(--line); border-radius: var(--r-pill); padding: 1px 9px;
    display: inline-block; margin-bottom: 5px; background: var(--card);
  }
  .ad.rect { min-height: 112px; margin: 16px 0; }
  .ad.side { min-height: 232px; }

  .arts { list-style: none; margin: 0; padding: 0; }
  .arts li { border-bottom: 1px solid var(--line-soft); }
  .arts li:last-child { border-bottom: 0; }
  .arts a {
    display: grid; grid-template-columns: 62px 1fr; gap: 12px;
    padding: 12px 16px; text-decoration: none; color: inherit; align-items: start;
  }
  .arts a:hover { background: var(--line-2); }
  .arts .ph {
    width: 62px; height: 46px; border-radius: var(--r-sm); background: var(--bg-2);
    border: 1px solid var(--line); display: grid; place-items: center;
    font-size: 11px; color: var(--sub-2);
  }
  .arts .ttl { font-size: 15px; font-weight: 600; line-height: 1.5; color: var(--ink); }
  .arts .meta { font-size: 13px; color: var(--sub); margin-top: 2px; }
  .arts .cat {
    font-size: 12px; color: var(--link); border: 1px solid var(--line);
    border-radius: var(--r-pill); padding: 0 8px; margin-right: 6px;
  }

  .alltime {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    padding: 11px 16px; border-top: 1px solid var(--line);
    background: linear-gradient(90deg, rgba(184,134,11,.10), rgba(184,134,11,0) 62%);
    font-size: 15px;
  }
  .alltime .badge {
    font-size: 12.5px; font-weight: 700; letter-spacing: .06em;
    color: var(--on-gold); background: var(--gold-fill); border-radius: var(--r-pill);
    padding: 2px 11px; white-space: nowrap;
  }
  .alltime .val {
    font-family: var(--mono); font-variant-numeric: tabular-nums;
    font-weight: 700; font-size: 16px; color: var(--gold-ink);
  }
  .alltime .when { color: var(--sub); font-size: 14px; }
  .alltime .now { margin-left: auto; color: var(--ink-2); font-size: 14.5px; }
  .alltime .now b { font-family: var(--mono); font-variant-numeric: tabular-nums; }

  .badges { display: flex; gap: 8px; flex-wrap: wrap; padding: 13px 16px 0; }
  .bdg {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 13.5px; padding: 3px 12px 3px 9px; border-radius: var(--r-pill);
    border: 1px solid var(--line); background: var(--line-2); color: var(--ink-2);
  }

  .bdg::before {
    content: ""; width: 6px; height: 6px; flex: none;
    border-radius: var(--r-pill); background: currentColor; opacity: .75;
  }
  .bdg.hot   { border-color: #f0c39a; background: #fff3e8; color: #a2522a; }

  .bdg.cool  { border-color: var(--cool-bd, #a8cbe8);
               background: var(--cool-bg, #eaf3fb);
               color: var(--cool-ink, #14568f); }
  .bdg.rare  { border-color: var(--gold-2); background: #fdf6e6; color: #8a6508; }

  .streak { padding: 14px 16px; }
  .streakhead {
    display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
    font-size: 14.5px; color: var(--sub); margin-bottom: 9px;
  }
  .streakhead b {
    font-family: var(--mono); font-variant-numeric: tabular-nums;
    font-size: 19px; color: var(--ink); font-weight: 700;
  }
  .grass { display: grid; grid-auto-flow: column; grid-template-rows: repeat(7, 11px); gap: 3px; overflow-x: auto; padding-bottom: 3px; }
  .grass i { width: 11px; height: 11px; border-radius: 3px; background: var(--bg-2); display: block; }

  .grass i.l1, .grasslegend i.l1 { background: var(--grass-1, #cde7da); }
  .grass i.l2, .grasslegend i.l2 { background: var(--grass-2, #7cc6a4); }
  .grass i.l3, .grasslegend i.l3 { background: var(--grass-3, #2f9670); }
  .grass i.l4, .grasslegend i.l4 { background: var(--grass-4, #117954); }
  .grass i.fail, .grasslegend i.fail { background: #f2c9c3; }

  .grasslegend { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--sub); margin-top: 8px; }
  .grasslegend i { width: 10px; height: 10px; border-radius: 2px; display: inline-block;
    background: var(--bg-2); }

  .live {
    display: flex; align-items: center; gap: 8px; margin-left: auto;
    font-size: 14px; color: var(--sub);
  }
  .live .dot {

    width: 7px; height: 7px; border-radius: 50%; background: var(--nav);
    box-shadow: 0 0 0 0 rgba(17,121,84,.5); animation: pulse 2s infinite;
  }
  @keyframes pulse {
    0%   { box-shadow: 0 0 0 0 rgba(17,121,84,.45); }
    70%  { box-shadow: 0 0 0 7px rgba(17,121,84,0); }
    100% { box-shadow: 0 0 0 0 rgba(17,121,84,0); }
  }
  .live b { font-family: var(--mono); font-variant-numeric: tabular-nums; color: var(--ink-2); }

  .spark { width: 62px; height: 22px; display: block; }

  .memo {
    display: grid; grid-template-columns: 34px 1fr; gap: 11px;
    padding: 14px 16px; border-top: 1px solid var(--line); background: var(--line-2);
  }

  .memo .face {
    width: 34px; height: 34px; flex: none; border-radius: 50%;
    background: var(--bg-1) var(--otter) center / 112% no-repeat;
    box-shadow: inset 0 0 0 1px var(--line);
    text-indent: -9999px; overflow: hidden;
  }
  .memo .say { font-size: 15px; color: var(--ink-2); line-height: 1.75; }
  .memo .say .who { font-size: 13px; color: var(--sub); display: block; margin-top: 4px; }

  :root { --num: var(--sans); }

  .kpi .v, td.price, td.gap, .alltime .val, .alltime .now b,
  .titem .pc, .rank-list .ch, .rank-list .no, .rcard .rp,
  .trend b, .hdr .stat b, .streakhead b, .live b,
  .gnav a.top .cnt, .mgrid a .c, .catlist .c {
    font-family: var(--num);
    font-variant-numeric: tabular-nums;
  }

  .drow .n,
  .catcard .cc,
  .rcard .rm {
    font-family: var(--sans);
    font-variant-numeric: tabular-nums;
  }

  h1.ref, .rank-list .nm b, .rcard .rr, .titem b {
    font-family: var(--mono);
    font-variant-numeric: tabular-nums;
  }

  .fbot, .fbot p, .ad .adlabel { color: var(--ink-2); }

  [data-sticky="on"] { scroll-padding-top: calc(var(--stick-h, 56px) + 10px); }
  [data-sticky="on"] .hdr {
    position: sticky; top: 0; z-index: 40;
    background: var(--bar);
  }

  [data-sticky="on"] .hdr.stuck {
    box-shadow: 0 1px 0 var(--line), 0 6px 18px rgba(24,36,32,.07);
  }

  [data-sticky="on"] thead th {
    position: sticky; top: var(--stick-h, 56px); z-index: 20;
    background: var(--bg-1);
    box-shadow: inset 0 -1px 0 var(--line);
  }

  [data-motion="on"] {
    --t:  .14s cubic-bezier(.2,.7,.3,1);
    --t2: .2s  cubic-bezier(.2,.7,.3,1);
  }
  [data-motion="on"] :is(
    .gnav a.top, .subnav a, .hdr .util a, .search button, .go,
    tbody tr td, .rank-list a, .rcard, .arts a, .catlist li a,
    .mgrid a, .chip, .crumbbar a,
    [role="tab"], button[data-days]
  ) {
    transition: background-color var(--t), color var(--t),
                border-color var(--t), box-shadow var(--t),
                transform .1s ease-out;
  }
  [data-motion="on"] .box { transition: box-shadow var(--t2); }

  [data-motion="on"] .gnav a.top .ic { transition: stroke var(--t); }

  [data-motion="on"] :is(.go, .search button):active {
    transform: translateY(1px);
  }
  [data-motion="on"] :is(.rank-list a, .rcard, .arts a, .mgrid a):active {
    transform: scale(.994);
  }

  [data-motion="on"] .ticker .trow { animation-duration: 64s; }

  [data-hue="green"] {
    --grass-1:#cbe6dd; --grass-2:#7cc5ab; --grass-3:#309772; --grass-4:#117854;
    --cool-bg:#eff5fb; --cool-bd:#b3cde6; --cool-ink:#0f69bd;
    --nav:#117954; --nav-2:#0d5f42; --nav-ink:#ffffff;
    --link:#0e6b4a;
    --ink:#182420; --ink-2:#44564f; --sub:#71827a; --sub-2:#a2b0a9;
    --line:rgba(24,36,32,.09); --line-soft:#eef3f0;
    --bg-1:#f5f8f6; --bg-2:#f1f6f3;
    --line-2:var(--bg-1); --surface-2:var(--bg-2);
    --up:#cf3a2b; --down:#1666b0;
    --shadow:0 1px 2px rgba(24,36,32,.05), 0 4px 10px rgba(24,36,32,.05), 0 16px 32px rgba(24,36,32,.05);
  }

  [data-hue="teal"] {
    --grass-1:#cbe3e6; --grass-2:#7cbec5; --grass-3:#308c97; --grass-4:#116e78;
    --cool-bg:#eff2fa; --cool-bd:#b3c1e6; --cool-ink:#2549a7;
    --nav:#12808d; --nav-2:#0d6771; --nav-ink:#ffffff;
    --link:#0f7280;
    --ink:#16242a; --ink-2:#3f555c; --sub:#6c8189; --sub-2:#9fb0b6;
    --line:rgba(22,36,42,.09); --line-soft:#ebf2f4;
    --bg-1:#f4f8f9; --bg-2:#eff6f8;
    --line-2:var(--bg-1); --surface-2:var(--bg-2);
    --up:#cf3a2b; --down:#3a5fc0;
    --shadow:0 1px 2px rgba(22,36,42,.05), 0 4px 10px rgba(22,36,42,.05), 0 16px 32px rgba(22,36,42,.05);
  }

  [data-hue="blue"] {
    --grass-1:#cbdbe6; --grass-2:#7ca6c5; --grass-3:#306a97; --grass-4:#114c78;
    --cool-bg:#effbf6; --cool-bd:#b3e6d2; --cool-ink:#0a8154;
    --nav:#187ac5; --nav-2:#1264a5; --nav-ink:#ffffff;
    --link:#1269ab;
    --ink:#18212c; --ink-2:#44505f; --sub:#717e8c; --sub-2:#a3abb7;
    --line:rgba(24,33,44,.10); --line-soft:#edf1f7;
    --bg-1:#f5f7fa; --bg-2:#f0f4fa;
    --line-2:var(--bg-1); --surface-2:var(--bg-2);
    --up:#cf3a2b; --down:#0f8457;
    --shadow:0 1px 2px rgba(24,33,44,.05), 0 4px 10px rgba(24,33,44,.05), 0 16px 32px rgba(24,33,44,.05);
  }

  [data-theme="dark"][data-hue="green"] {
    --grass-1:#1c3b30; --grass-2:#27624d; --grass-3:#2f8969; --grass-4:#46b48d;
    --cool-bg:#121f2b; --cool-bd:#274968; --cool-ink:#90b9df;
    --nav:#0f6446; --nav-2:#0b5138; --link:#5fc79a;
    --down:#6bb0ee;
  }
  [data-theme="dark"][data-hue="teal"] {
    --grass-1:#1c383b; --grass-2:#275c62; --grass-3:#2f7f89; --grass-4:#46a8b4;
    --cool-bg:#12192b; --cool-bd:#273968; --cool-ink:#90a6df;
    --nav:#0f6d78; --nav-2:#0b565f; --link:#54c7d4;
    --down:#7f9ff0;
  }
  [data-theme="dark"][data-hue="blue"] {
    --grass-1:#1c2d3b; --grass-2:#274962; --grass-3:#2f6289; --grass-4:#4684b4;
    --cool-bg:#122b21; --cool-bd:#27684f; --cool-ink:#90dfc1;
    --nav:#3f92d8; --nav-2:#2a7ac0; --link:#7dc0f2;
    --down:#4cc79a;
  }

  [data-cat="watch"] {
    --nav:#187ac5; --nav-2:#1264a5; --nav-ink:#ffffff;
    --link:#1269ab;
    --ink:#18212c; --ink-2:#44505f; --sub:#717e8c; --sub-2:#a3abb7;
    --line:rgba(24,33,44,.10); --line-soft:#edf1f7;
    --bg-1:#f5f7fa; --bg-2:#f0f4fa;
    --line-2:var(--bg-1); --surface-2:var(--bg-2);
    --grass-1:#cbdbe6; --grass-2:#7ca6c5; --grass-3:#306a97; --grass-4:#114c78;
  }

  [data-cat="game"] {
    --nav:#e52417; --nav-2:#bb1e13; --nav-ink:#ffffff;
    --link:#c81f12;
    --ink:#2b1d1c; --ink-2:#5c4744; --sub:#8c7472; --sub-2:#b7a4a2;
    --line:rgba(44,29,28,.10); --line-soft:#f7edec;
    --bg-1:#fdf6f5; --bg-2:#fbf1ef;
    --line-2:var(--bg-1); --surface-2:var(--bg-2);
    --grass-1:#e6cfcb; --grass-2:#c58a7c; --grass-3:#97402f; --grass-4:#781f11;
  }

  [data-cat="tcg"] {
    --nav:#9659cb; --nav-2:#7a42ad; --nav-ink:#ffffff;
    --link:#7c45b0;
    --ink:#241c2c; --ink-2:#4f445c; --sub:#7f7589; --sub-2:#aea4b7;
    --line:rgba(36,28,44,.10); --line-soft:#f2eef7;
    --bg-1:#f8f5fb; --bg-2:#f5f0fa;
    --line-2:var(--bg-1); --surface-2:var(--bg-2);
    --grass-1:#ddcbe6; --grass-2:#a97cc5; --grass-3:#6f3097; --grass-4:#4f1178;
  }

  html, body { overflow-x: hidden; }
  .tw, table { max-width: 100%; }

  .in, .cols, .cols > *, main, .side,
  .box, .pad, .tw, .three > *, .grid4 > *, .cats > *, .map > * { min-width: 0; }

  .prep { position: static !important; }

  .hero { background: var(--card); border-bottom: 1px solid var(--line); }
  .hero .in { padding-top: 34px; padding-bottom: 30px; }
  .hero2 { display: grid; grid-template-columns: 1.08fr .92fr; gap: 40px; align-items: center; }

  .hero h1 {
    margin: 0 0 10px; font-size: clamp(23px, 3vw, 33px); line-height: 1.45;
    letter-spacing: .01em; text-wrap: balance;
  }
  .hero h1 b { color: var(--nav); font-weight: 700; }
  .hero .lead { margin: 0 0 20px; color: var(--ink-2); font-size: 15px; }
  .bigsearch {
    display: flex; border: 1px solid var(--line); border-radius: var(--r-pill);
    overflow: hidden; background: var(--bg-1); box-shadow: var(--shadow);
  }
  .bigsearch input {
    flex: 1; min-width: 0; border: 0; background: transparent; font: inherit;
    font-size: 16px; padding: 12px 22px; color: var(--ink);
  }
  .bigsearch input:focus { outline: none; }
  .bigsearch button {
    border: 0; background: var(--nav); color: var(--nav-ink);
    font: inherit; font-weight: 700; padding: 0 28px; cursor: pointer;
  }
  .hero .eg { margin-top: 10px; font-size: 13.5px; color: var(--sub); }
  .hero .eg a { color: var(--link); text-decoration: none; margin-right: 11px; }
  .hero .eg a:hover { text-decoration: underline; }

  .map { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

  .mapcol { min-width: 0; }
  .mapcol .h {
    display: flex; align-items: baseline; gap: 8px; margin-bottom: 7px;
    padding-bottom: 6px; border-bottom: 2px solid var(--c);
  }
  .mapcol .h b { font-size: 15px; }
  .mapcol .h span { font-size: 13px; color: var(--sub); font-variant-numeric: tabular-nums; }
  .mapcol .h span.u { margin-left: auto; }
  .tree { position: relative; width: 100%; aspect-ratio: 4 / 3; }
  .tree a {
    position: absolute; overflow: hidden; text-decoration: none;
    border: 1.5px solid var(--card); border-radius: 3px;
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: 5px 6px; color: var(--ink); font-size: 12.5px; line-height: 1.25;
  }
  .tree a .t { font-weight: 700; white-space: nowrap; overflow: hidden;
               text-overflow: ellipsis; }
  .tree a .v { font-size: 11.5px; opacity: .75; font-variant-numeric: tabular-nums; }
  .tree a.sm .v { display: none; }
  .tree a.xs .t { display: none; }
  .tree a:hover { outline: 2px solid var(--ink); outline-offset: -2px; z-index: 2; }
  .maplg {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    margin-top: 14px; font-size: 13px; color: var(--sub);
  }
  .maplg .bar {
    display: flex; height: 11px; border-radius: 3px; overflow: hidden; width: 168px;
  }
  .maplg .bar i { flex: 1; }

  .sum {
    background: var(--card); border: 1px solid var(--line);
    border-radius: var(--r-card); box-shadow: var(--shadow); padding: 18px 20px;
  }
  .sum h2 { margin: 0 0 2px; font-size: 15px; background: none; border: 0; padding: 0; }
  .sum .sub { font-size: 13px; color: var(--sub); }
  .sum .row { display: flex; gap: 22px; margin-top: 14px; flex-wrap: wrap; }
  .sum .row div { line-height: 1.25; }
  .sum .row b { display: block; font-size: 25px; font-variant-numeric: tabular-nums; }
  .sum .row span { font-size: 13px; color: var(--sub); }
  .sum .row i {
    display: inline-block; width: 9px; height: 9px; border-radius: 2px;
    margin-right: 5px; vertical-align: -1px;
  }

  .facts { display: flex; gap: 28px; flex-wrap: wrap; margin-top: 22px; }
  .facts b {
    display: block; font-size: 21px; font-weight: 700;
    font-variant-numeric: tabular-nums; letter-spacing: -.01em;
  }
  .facts span { font-size: 13px; color: var(--sub); }

  .grid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }

  .prod {
    display: block; text-decoration: none; color: inherit; background: var(--card);
    border: 1px solid var(--line); border-radius: var(--r-card);
    box-shadow: var(--shadow); overflow: hidden;
  }
  .prod .ph {
    aspect-ratio: 4 / 3; background-color: var(--bg-2);
    background-size: 62% auto; background-position: center; background-repeat: no-repeat;
    border-bottom: 1px solid var(--line-soft); position: relative;
  }

  .prod .ph::after {
    content: "仮"; position: absolute; right: 7px; top: 7px;
    font-size: 11.5px; color: var(--sub); background: var(--card);
    border: 1px solid var(--line); border-radius: var(--r-pill); padding: 0 6px;
  }
  .prod .tx { padding: 11px 13px 13px; }
  .prod .ref { font-family: var(--mono); font-weight: 700; font-size: 14.5px; }
  .prod .nm {
    font-size: 13px; color: var(--sub); margin-top: 2px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .prod .p {
    margin-top: 7px; display: flex; align-items: baseline; gap: 8px;
    justify-content: space-between;
  }
  .prod .p b { font-size: 16px; font-variant-numeric: tabular-nums; }
  .prod .p .pc { font-size: 14.5px; font-weight: 700; }
  .prod .st { margin-top: 4px; font-size: 12.5px; color: var(--sub); }

  .prod { border-top: 3px solid var(--c, var(--line)); }
  .prod.w { --c: var(--cat-watch); }
  .prod.t { --c: var(--cat-tcg); }
  .prod.g { --c: var(--cat-game); }

  .cats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }

  .cat {
    display: block; text-decoration: none; color: inherit; background: var(--card);
    border: 1px solid var(--line); border-radius: var(--r-card);
    box-shadow: var(--shadow); overflow: hidden;
  }
  .cat .bn {
    height: 124px; background-color: var(--bg-1);
    background-size: auto 96%; background-position: center; background-repeat: no-repeat;
    border-bottom: 1px solid var(--line-soft);
  }
  .cat .hd { padding: 14px 18px 12px; }
  .cat h3 { margin: 0; font-size: 18px; letter-spacing: .01em; }
  .cat .n { font-size: 13.5px; color: var(--sub); font-variant-numeric: tabular-nums; }
  .cat .n b { color: var(--c); font-size: 16px; }
  .cat ul { list-style: none; margin: 0; padding: 0 18px 14px; }
  .cat li {
    display: flex; justify-content: space-between; gap: 10px;
    font-size: 14px; padding: 5px 0; border-top: 1px solid var(--line-soft);
  }
  .cat li span { color: var(--sub); font-variant-numeric: tabular-nums; }
  .cat .more {
    display: block; padding: 10px 18px; background: var(--bg-1);
    font-size: 14px; color: var(--link); border-top: 1px solid var(--line);
  }
  .cat:hover .more { background: var(--bg-2); }

  .about { display: grid; grid-template-columns: 52px 1fr; gap: 16px; align-items: start; }
  .about .face {
    width: 52px; height: 52px; border-radius: 50%;
    background: var(--bg-1) var(--otter) center / 112% no-repeat;
    box-shadow: inset 0 0 0 1px var(--line);
  }
  .about p { margin: 0 0 9px; font-size: 15.5px; line-height: 1.85; color: var(--ink-2); }
  .about p:last-child { margin-bottom: 0; }

  .sechead {
    display: flex; align-items: baseline; gap: 12px;
    margin: 34px 0 15px; flex-wrap: wrap;
  }
  .sechead h2 {
    margin: 0; font-size: 20px; letter-spacing: .01em;
    background: none; border: 0; padding: 0;
  }
  .sechead .note { font-size: 13.5px; color: var(--sub); }
  .sechead a { margin-left: auto; font-size: 14px; color: var(--link); text-decoration: none; }
  .sechead a:hover { text-decoration: underline; }

  .three > .box + .box, .cats > * + *, .grid4 > * + * { margin-top: 0; }

  .doc h2 {
    margin: 30px 0 10px; font-size: 18px; letter-spacing: .01em;
    padding-left: 11px; border-left: 4px solid var(--nav);
  }
  .doc h2:first-of-type { margin-top: 0; }
  .doc p { margin: 0 0 12px; font-size: 15px; line-height: 1.95; color: var(--ink-2); }
  .doc ul { margin: 0 0 14px; padding-left: 1.3em; }
  .doc li { font-size: 15px; line-height: 1.9; color: var(--ink-2); margin-bottom: 6px; }
  .doc b { color: var(--ink); font-weight: 700; }
  .doc table.doc { width: 100%; margin: 0 0 14px; font-size: 15px; }
  .doc table.doc th { background: var(--bg-1); text-align: left; padding: 8px 12px;
    border-bottom: 1px solid var(--line); font-weight: 700; }
  .doc table.doc td { padding: 8px 12px; border-bottom: 1px solid var(--line-soft);
    color: var(--ink-2); }
  .doc .upd { margin-top: 26px; padding-top: 14px; border-top: 1px solid var(--line-soft);
    font-size: 13.5px; color: var(--sub); }

  .prep {
    background: #8a3d12; color: #fff; font-size: 15px; line-height: 1.6;
    text-align: center; padding: 9px 16px;
  }
  .prep b { font-weight: 700; }

  h1.pname {
    margin: 4px 0 6px; font-size: clamp(19px, 2.4vw, 25px);
    line-height: 1.45; letter-spacing: .01em; font-weight: 700;
    text-wrap: balance;
  }
  .mcode {
    font-family: var(--mono); font-size: 14px; color: var(--sub);
    font-variant-numeric: tabular-nums; letter-spacing: .02em;
  }

  .ilist { list-style: none; margin: 0; padding: 0; }
  .ilist .li { border-top: 1px solid var(--line-soft); }
  .ilist .li:first-child { border-top: 0; }
  .ilist a {
    display: grid; grid-template-columns: minmax(0,1fr) auto;
    gap: 2px 12px; padding: 11px 16px; text-decoration: none; color: inherit;
  }
  .ilist a:hover { background: var(--bg-1); }
  .ilist .nm {
    grid-area: 1/1; font-size: 15.5px; font-weight: 700;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .ilist .sub2 {
    grid-area: 2/1; font-size: 13px; color: var(--sub);
    font-family: var(--mono); font-variant-numeric: tabular-nums;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .ilist .pr {
    grid-area: 1/2/3/3; align-self: center; text-align: right;
    font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  .ilist .pr .n {
    display: block; font-size: 12.5px; color: var(--sub); font-weight: 400;
  }
  .pager {
    display: flex; align-items: center; justify-content: center; gap: 16px;
    padding: 14px 16px; border-top: 1px solid var(--line);
    background: var(--bg-1); font-size: 14.5px;
  }
  .pager a { color: var(--link); text-decoration: none; }
  .pager a:hover { text-decoration: underline; }
  .pager .cur { color: var(--sub); font-variant-numeric: tabular-nums; }

  .gmap { display: flex; flex-wrap: wrap; gap: 4px; }
  .gtile {
    display: flex; flex-direction: column; justify-content: flex-end;
    min-height: 74px; padding: 12px 14px; gap: 3px; border-radius: var(--r-sm);
    background: var(--bg-1); border: 1px solid var(--line);
    text-decoration: none; color: var(--ink); overflow: hidden;
  }
  .gtile:hover { background: var(--bg-2); border-color: var(--nav); }

  .gtile .t { font-size: 15px; font-weight: 700; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis; }
  .gtile .v { font-size: 14.5px; color: var(--sub);
    font-variant-numeric: tabular-nums; }
  .gnote { margin: 16px 0 0; font-size: 15px; color: var(--sub); line-height: 1.7; }

  .prod .ref { font-family: inherit; line-height: 1.55; }
  .prod .ref.mono { font-family: var(--mono); }

  .ph {
    background: var(--bg-2); position: relative;
    display: grid; place-items: center; overflow: hidden;
  }
  .ph svg { width: 46%; height: 46%; opacity: .3; }

  .ph.w { color: var(--cat-watch, #2563eb); }
  .ph.g { color: var(--cat-game,  #dc2626); }
  .ph.t { color: var(--cat-tcg,   #7c3aed); }

  .prod .ph { aspect-ratio: 4/3; border-bottom: 1px solid var(--line-soft); }

  .headrow { display: flex; gap: 18px; align-items: flex-start; }
  .headrow .headinfo { min-width: 0; flex: 1; }
  .ph.big {
    width: 148px; height: 148px; flex: none; border-radius: 10px;
    border: 1px solid var(--line-soft);
  }
  .ph.big svg { width: 52%; height: 52%; }
  .ph.shot { background: #fff; text-decoration: none; }
  .ph.shot img { width: 100%; height: 100%; object-fit: contain; }

  .ph .adpr {
    position: absolute; left: 0; bottom: 0;
    background: rgba(17,24,39,.78); color: #fff;
    font-size: 11.5px; letter-spacing: .04em;
    padding: 2px 6px; border-radius: 0 6px 0 9px;
  }

  .go.off, .go.off:hover {
    background: none !important; color: var(--sub-2) !important;
    border: 0; box-shadow: none; padding: 4px 0; filter: none;
    cursor: default; font-size: 15px;
  }

  [data-sticky="on"] thead th,
  thead th {
    position: static !important; top: auto !important; z-index: auto !important;
    box-shadow: none !important;
    background: var(--line-2);
    border-bottom: 1px solid var(--line);
  }

  .prep {
    background: #1f2937; color: #e5e7eb;
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  .prep b { color: #fff; }

  .gtile.c-w { background: color-mix(in srgb, var(--cat-watch) 9%, var(--bg-1));
               border-color: color-mix(in srgb, var(--cat-watch) 26%, var(--line)); }
  .gtile.c-t { background: color-mix(in srgb, var(--cat-tcg)   7%, var(--bg-1));
               border-color: color-mix(in srgb, var(--cat-tcg)   24%, var(--line)); }
  .gtile.c-g { background: color-mix(in srgb, var(--cat-game)  4%, var(--bg-1));
               border-color: color-mix(in srgb, var(--cat-game)  18%, var(--line)); }
  .gtile.c-w .t { color: color-mix(in srgb, var(--cat-watch) 72%, var(--ink)); }
  .gtile.c-t .t { color: color-mix(in srgb, var(--cat-tcg)   72%, var(--ink)); }
  .gtile.c-g .t { color: color-mix(in srgb, var(--cat-game)  72%, var(--ink)); }
  .gtile.c-w:hover { background: color-mix(in srgb, var(--cat-watch) 14%, var(--bg-1)); }
  .gtile.c-t:hover { background: color-mix(in srgb, var(--cat-tcg)   14%, var(--bg-1)); }
  .gtile.c-g:hover { background: color-mix(in srgb, var(--cat-game)  14%, var(--bg-1)); }

  .note2.thin {
    background: #fff8e6; border: 1px solid #f0d9a0; color: #6b5520;
    border-radius: var(--r-sm); padding: 9px 13px; font-size: 14px;
    margin: 0;
  }

  .li { position: relative; }
  .li::before {
    content: ""; position: absolute; left: 0; top: 8px; bottom: 8px;
    width: 3px; border-radius: 2px; background: transparent;
  }
  .li.c-w::before { background: var(--cat-watch); }
  .li.c-t::before { background: var(--cat-tcg); }
  .li.c-g::before { background: var(--cat-game); }

  :root {
    --sub:   #62716a;
    --sub-2: #6f7974;
  }

  .note2.why {
    background: #f2f6fb; border: 1px solid #cfdcec; color: #2c4459;
    border-radius: var(--r-sm); padding: 10px 14px; font-size: 14.5px;
    line-height: 1.7; margin: 0;
  }

  .search:focus-within, .bigsearch:focus-within {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--link) 30%, transparent);
    border-color: var(--link);
  }

  a:focus-visible,
  button:focus-visible,
  input:focus-visible,
  select:focus-visible,
  [tabindex]:focus-visible {
    outline: 3px solid var(--link);
    outline-offset: 2px;
    border-radius: 3px;
  }

  .prep a:focus-visible, .hdr .util a:focus-visible {
    outline-color: #fff;
  }

  .cbtn:focus-visible { outline-color: currentColor; }

  .skip {
    position: absolute; left: -9999px; top: 0; z-index: 999;
    background: var(--nav); color: var(--nav-ink);
    padding: 10px 18px; border-radius: 0 0 var(--r-sm) 0;
    font-size: 15px; font-weight: 700; text-decoration: none;
  }
  .skip:focus { left: 0; }

  .gnav .item:nth-child(1) a.top .ic,
  .gnav .item:nth-child(2) a.top .ic,
  .gnav .item:nth-child(3) a.top .ic { stroke: var(--sub); }
  .gnav .item.c-w a.top .ic { stroke: var(--cat-watch) !important; }
  .gnav .item.c-g a.top .ic { stroke: var(--cat-game)  !important; }
  .gnav .item.c-t a.top .ic { stroke: var(--cat-tcg)   !important; }

  [data-nav="b"] .gnav .item:nth-child(1) a.top:hover,
  [data-nav="b"] .gnav .item:nth-child(2) a.top:hover,
  [data-nav="b"] .gnav .item:nth-child(3) a.top:hover { color: inherit; }
  [data-nav="b"] .gnav .item.c-w a.top:hover { color: var(--cat-watch) !important; }
  [data-nav="b"] .gnav .item.c-g a.top:hover { color: var(--cat-game)  !important; }
  [data-nav="b"] .gnav .item.c-t a.top:hover { color: var(--cat-tcg)   !important; }

  .shp {
    display: inline-block; font-size: 13px; line-height: 1.5;
    padding: 0 5px; border-radius: 3px; font-weight: 600;
    letter-spacing: .01em; white-space: nowrap;
  }
  .shp.free { color: #0b6b3a; background: #e3f5ea; }
  .shp.cond { color: #7a5200; background: #fdf1d8; }
  .shp.paid { color: var(--sub);  background: var(--line-2); }

  .shp.sm { font-size: 12px; margin-left: 6px; vertical-align: 2px; }

  .adpr.inline {
    position: static; display: inline-block; font-size: 12.5px;
    font-weight: 700; color: #7a5200; background: #fdf1d8;
    padding: 1px 6px; border-radius: 3px; margin-left: 6px;
    vertical-align: 2px;
  }

  .reads { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
  .read {
    display: flex; flex-direction: column; gap: 7px;
    padding: 17px 19px; border-radius: var(--r-card);
    background: var(--bg-1); border: 1px solid var(--line);
    text-decoration: none; color: inherit;
    border-left: 3px solid var(--nav);
    transition: background var(--t), border-color var(--t);
  }
  .read:hover { background: var(--bg-2); border-color: var(--nav); }
  .read .t { font-size: 16.5px; font-weight: 700; line-height: 1.5; }
  .read .l { font-size: 15px; color: var(--sub); line-height: 1.7; }

  .cat { transition: transform var(--t), box-shadow var(--t);
    border-top: 3px solid var(--c); }
  .cat:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(24,36,32,.13); }

  .cat .bn {
    display: flex; gap: 8px; height: 108px; padding: 14px;
    background: color-mix(in srgb, var(--c) 9%, var(--bg-1));
    border-bottom: 1px solid var(--line-soft);
  }

  .cat .bn .s {
    flex: 1 1 0; min-width: 0; display: block; overflow: hidden;
    background: #fff; border: 1px solid rgba(0,0,0,.10);
    border-radius: 8px; padding: 7px;
    box-shadow: 0 1px 3px rgba(24,36,32,.10);
  }
  .cat .bn .s img { width: 100%; height: 100%; object-fit: contain; display: block; }
  .cat .hd { padding: 15px 18px 13px !important; }
  .cat h3 { font-size: 22px !important; font-weight: 800; }
  .cat .n { font-size: 15.5px !important; margin-top: 3px; }
  .cat .n b { font-size: 21px !important; }
  .cat .more { font-size: 15px !important; padding: 12px 18px !important; }

  .gmap .gtile.even { flex: 1 1 0 !important; min-width: 0 !important; }

  .gmap .gtile.even { min-height: 88px; padding: 16px 18px; }
  .gmap .gtile.even .t { font-size: 18px; }
  .gmap .gtile.even .v { font-size: 15px; }

  .gmap.grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(152px, 1fr));
  }
  .gmap.grid .gtile { min-width: 0 !important; }

  .ilist a { grid-template-columns: auto minmax(0,1fr) auto; }

  .ilist .li.has-img a { grid-template-columns: 55px minmax(0,1fr) auto; }
  .ilist .ph { grid-area: 1/1/3/2; align-self: center; }
  .ilist .nm { grid-area: 1/2; }
  .ilist .sub2 { grid-area: 2/2; }
  .ilist .pr { grid-area: 1/3/3/4; }
  .ilist .ph {
    width: 44px; height: 44px; flex: none; border-radius: 7px;
    margin-right: 11px; overflow: hidden;
  }
  .ilist .ph.shot { background: #fff; border: 1px solid var(--line); }
  .ilist .ph img { width: 100%; height: 100%; object-fit: contain; display: block; }

  .prod .ph.shot::after { content: none; }
  .prod .ph.shot { background-color: #fff; }
  .prod .ph.shot img { width: 100%; height: 100%; object-fit: contain; display: block; }

  .pack {
    display: inline-block; font-size: 12.5px; font-weight: 600;
    color: #7a5200; background: #fdf1d8; padding: 0 5px;
    border-radius: 3px; white-space: nowrap; margin-top: 3px;
  }

  .empty { text-align: center; padding: 40px 22px 46px; }
  .empty .emo { border-radius: 50%; margin: 0 auto 14px; display: block; }
  .empty h2 { font-size: 19px; margin: 0 0 8px; }
  .empty .lead { color: var(--sub); font-size: 15.5px; margin: 0 0 22px; }
  .empty .bigsearch { max-width: 560px; margin: 0 auto 20px; }
  .empty .tips { list-style: none; padding: 0; margin: 0 auto 22px;
    max-width: 520px; text-align: left; font-size: 15px; color: var(--sub); }
  .empty .tips li { padding: 5px 0 5px 18px; position: relative; }
  .empty .tips li::before { content: "・"; position: absolute; left: 0; }
  .empty .tiny { font-size: 13.5px; color: var(--sub-2); margin: 20px 0 0; }
  .cta3 { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
  .cbtn {
    display: inline-block; padding: 9px 18px; border-radius: var(--r-pill);
    font-size: 15px; font-weight: 700; text-decoration: none;
    border: 1px solid currentColor; background: none;
  }
  .cbtn.c-w { color: var(--cat-watch); }
  .cbtn.c-t { color: var(--cat-tcg); }
  .cbtn.c-g { color: var(--cat-game); }
  .cbtn:hover { background: color-mix(in srgb, currentColor 9%, transparent); }

  .mgrid a, .fgrid li a { overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; display: block; }

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      --paper:#0f1714; --card:#161f1c; --line:rgba(255,255,255,.10); --line-soft:#202b27;
      --bg-0:#161f1c; --bg-1:#1b2521; --bg-2:#131c19;
      --line-2:var(--bg-1); --surface-2:var(--bg-2);
      --ink:#e8efeb; --ink-2:#b9c7c0; --sub:#8a9a92; --sub-2:#5e6d66;
      --bar:#141d1a; --bar-ink:#e8efeb; --bar-sub:#8a9a92;
      --nav:#0f6446; --nav-2:#0b5138; --nav-ink:#ffffff;
      --gold:#e0b755; --gold-2:#8f7330;
      --gold-ink:#e0b755;
      --up:#e97060; --down:#6bb0ee; --link:#5fc79a;
      --shadow:0 1px 2px rgba(0,0,0,.5), 0 3px 10px rgba(0,0,0,.4);
    }
  }

@media (max-width: 900px) { .mega { display: none !important; } }

@media (min-width: 901px) { .gnav .in { overflow: visible; } }

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      --cat-watch: #3f92d8; --cat-tcg: #b184e0; --cat-game: #f0614f;
    }
  }

@media (max-width: 900px) { .cols { grid-template-columns: 1fr; } }

@media (min-width: 901px) {
    .kpis { grid-template-columns: 2.2fr 1fr 1fr 1fr; }
  }

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .bdg.hot  { background:#2e1f14; border-color:#6b4526; color:#f0b184; }
    :root:not([data-theme="light"]) .bdg.cool { background:var(--cool-bg,#122a24); border-color:var(--cool-bd,#286152); color:var(--cool-ink,#6fd9be); }
    :root:not([data-theme="light"]) .bdg.rare { background:#2b2415; border-color:#6f5a25; color:#e8c76d; }
  }

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) :is(.grass,.grasslegend) i.l1 { background:var(--grass-1,#1c3b2c); }
    :root:not([data-theme="light"]) :is(.grass,.grasslegend) i.l2 { background:var(--grass-2,#276144); }
    :root:not([data-theme="light"]) :is(.grass,.grasslegend) i.l3 { background:var(--grass-3,#2f8a5e); }
    :root:not([data-theme="light"]) :is(.grass,.grasslegend) i.l4 { background:var(--grass-4,#46b57e); }
    :root:not([data-theme="light"]) :is(.grass,.grasslegend) i.fail { background:#5a2a26; }
  }

@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }

@media (any-hover: hover) {
    [data-motion="on"] :is(.rcard, .arts a):hover {
      box-shadow: 0 2px 8px rgba(24,36,32,.07);
    }
  }

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"])[data-hue="green"] {
      --grass-1:#1c3b30; --grass-2:#27624d; --grass-3:#2f8969; --grass-4:#46b48d;
      --cool-bg:#121f2b; --cool-bd:#274968; --cool-ink:#90b9df;
      --nav:#0f6446; --nav-2:#0b5138; --link:#5fc79a;
      --down:#6bb0ee;
    }
    :root:not([data-theme="light"])[data-hue="teal"] {
      --grass-1:#1c383b; --grass-2:#275c62; --grass-3:#2f7f89; --grass-4:#46a8b4;
      --cool-bg:#12192b; --cool-bd:#273968; --cool-ink:#90a6df;
      --nav:#0f6d78; --nav-2:#0b565f; --link:#54c7d4;
      --down:#7f9ff0;
    }
    :root:not([data-theme="light"])[data-hue="blue"] {
      --grass-1:#1c2d3b; --grass-2:#274962; --grass-3:#2f6289; --grass-4:#4684b4;
      --cool-bg:#122b21; --cool-bd:#27684f; --cool-ink:#90dfc1;
      --nav:#3f92d8; --nav-2:#2a7ac0; --link:#7dc0f2;
      --down:#4cc79a;
    }
  }

@media (max-width: 700px) {

    .hdr .in { gap: 10px; padding-top: 9px; padding-bottom: 9px; }
    .hdr .search { display: none; }
    .hdr .stat { display: none; }
    .hdr .util { font-size: 13px; gap: 10px; }
    .logo .mark { font-size: 18px; }
    .logo .tag { display: none; }
    .logomark { width: 34px; height: 34px; }

    .hdr .btn { font-size: 13.5px; padding: 6px 11px; }
    .hdr .btn-ghost { display: none; }

    .gnav .in { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .gnav .in::-webkit-scrollbar { display: none; }
    .gnav a.top { font-size: 14.5px; padding-left: 10px; padding-right: 10px; }
    .gnav a.top .cnt { font-size: 12px; }
    .gnav .item:nth-child(n+4) { display: none; }
    .gnav .divider { display: none; }

    .subnav .in { overflow-x: auto; white-space: nowrap; }
    .crumbbar .in { overflow-x: auto; white-space: nowrap; font-size: 13px; }

    .hero .in { padding-top: 20px; padding-bottom: 20px; }
    .hero h1 { font-size: 21px; line-height: 1.5; }
    .hero h1 br { display: none; }
    .hero .lead { font-size: 15px; }
    .hero .lead br { display: none; }
    .bigsearch input { font-size: 15px; padding: 10px 14px; }
    .bigsearch button { padding: 0 16px; font-size: 15px; }
    .hero .eg { line-height: 2; }

    .facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 14px; }
    .facts b { font-size: 18px; }

    .grid4 { gap: 12px; }
    .prod .tx { padding: 9px 10px 11px; }
    .prod .p b { font-size: 15.5px; }

    .map { grid-template-columns: 1fr; gap: 18px; }
    .tree { aspect-ratio: 16 / 9; }
    .maplg { font-size: 12.5px; }
    .maplg span:last-child { flex-basis: 100%; }

    .sechead { margin: 24px 0 12px; }
    .sechead h2 { font-size: 20px; }
    .sechead a { margin-left: 0; flex-basis: 100%; }

    .cols { gap: 18px; }

    .kpis { grid-template-columns: repeat(2, 1fr) !important; }
    .kpi .v { font-size: 20px !important; }
    .kpi.lead .v { font-size: 26px !important; }
    h1.ref { font-size: 26px; }
    .prod .sub, .prod .chips { font-size: 13.5px; }

    .tw { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    table { min-width: 520px; }
    .alltime { flex-wrap: wrap; gap: 6px; }
    .src { flex-wrap: wrap; gap: 6px 14px; font-size: 13px; }
    .grass { overflow-x: auto; }
    .box > h2, .box > h3 { font-size: 17px; }
    .pad { padding: 14px; }
    .memo { flex-wrap: nowrap; }

    .fgrid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  }

@media (max-width: 400px) {
    .grid4 { grid-template-columns: 1fr; }
    .facts { grid-template-columns: 1fr 1fr; }
    .hero h1 { font-size: 19px; }
  }

@media (max-width: 900px) {

    [data-sticky="on"] thead th {
      position: static !important;
      box-shadow: none !important;
      border-bottom: 1px solid var(--line);
    }

    [data-sticky="on"] .hdr { position: static !important; box-shadow: none !important; }
  }

@media (max-width: 700px) {
    .tw { overflow-x: visible; }
    table { min-width: 0; width: 100%; }
    thead { display: none; }
    tbody, tbody tr, tbody td { display: block; }
    tbody tr {
      display: grid;
      grid-template-columns: 30px minmax(0, 1fr) auto;
      gap: 3px 10px; align-items: center;
      padding: 11px 14px; border-bottom: 1px solid var(--line-soft);
    }
    tbody td { border: 0 !important; padding: 0 !important; }
    .c-no    { grid-area: 1 / 1 / 3 / 2; align-self: center; }
    .c-price { grid-area: 1 / 2; text-align: left !important; font-size: 17px; }
    .c-cond  { grid-area: 1 / 3; text-align: right; }
    .c-shop  { grid-area: 2 / 2; font-size: 13.5px; color: var(--sub);
               overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .c-go    { grid-area: 2 / 3; text-align: right; }
    .c-gap   { display: none; }
    .c-go .go { font-size: 13.5px; }
    tbody tr:hover td { background: transparent; }
  }

@media (max-width: 900px) { .hero2 { grid-template-columns: 1fr; gap: 26px; } }

@media (max-width: 900px) { .map { grid-template-columns: 1fr; } }

@media (max-width: 900px) { .grid4 { grid-template-columns: repeat(2, 1fr); } }

@media (max-width: 900px) { .cats { grid-template-columns: 1fr; } }

@media (max-width: 700px) {
    .doc table.doc { min-width: 0; }
    .doc table.doc th, .doc table.doc td { padding: 7px 8px; font-size: 14px; }
  }

@media (max-width: 700px) { .prep { font-size: 13.5px; } }

@media (max-width: 640px) {
    .headrow { gap: 13px; }
    .ph.big { width: 96px; height: 96px; }
  }

@media (max-width: 900px) { .reads { grid-template-columns: 1fr; } }

@media (max-width: 900px) {
    .cat .bn { height: 132px; }
    .cat h3 { font-size: 20px !important; }
  }

@media (max-width: 700px) {
    .gmap { gap: 7px; }
    .gmap .gtile.even { padding: 11px 10px; }
  }

@media (max-width: 700px) {
    .ilist .ph { width: 38px; height: 38px; margin-right: 9px; }
    .ilist .li.has-img a { grid-template-columns: 47px minmax(0,1fr) auto; }
  }

@media (max-width: 700px) {
    .gnav { position: relative; }
    .gnav::after {
      content: ""; position: absolute; top: 0; right: 0; bottom: 0;
      width: 34px; pointer-events: none;
      background: linear-gradient(to right,
        rgba(255,255,255,0), var(--card) 78%);
    }

    .gnav .in { padding-right: 30px; }
  }

@media (max-width: 700px) {
    .gtile { min-width: 30% !important; }

    .gmap.grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }

@media print` が**1つも無かった**（★ 2026-09-13 に気づいた）。
     ⭐ 出すのは「何の型番か」と「どこがいくらか」だけ。
     ⚠️ ナビ・検索・フッタ・準備中の帯は**紙では邪魔**。★ 全部落とす。 */
  @media print {
    .prep, .hdr, .gnav, .ftr, .crumbbar, .bigsearch, .search,
    .cta3, aside, .pager { display: none !important; }
    body { background: #fff !important; color: #000 !important; font-size: 11pt; }
    .box { border: 0 !important; box-shadow: none !important; break-inside: auto; }
    .in, .cols, main { display: block !important; max-width: none !important;
      padding: 0 !important; margin: 0 !important; }

    table { width: 100% !important; font-size: 10pt; }
    thead { display: table-header-group !important; }
    tr { break-inside: avoid; }
    tbody td { padding: 4px 6px !important; }
    .ph, .go { display: none !important; }

    .src { display: block !important; font-size: 9pt; color: #444 !important;
      border-top: 1px solid #999; padding-top: 6px; margin-top: 10px; }
    a { color: #000 !important; text-decoration: none; }
    h1 { font-size: 16pt; }
    .kpis { display: flex !important; gap: 18px; }
  }