:root { --bg:#f6f5f1; --fg:#1d2320; --muted:#6a726d; --card:#fff; --line:#dcdad2; --accent:#2f5d3a; --warn:#b3541e; --good:#2f7d46; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --bg:#161a17; --fg:#e8ebe6; --muted:#98a39b; --card:#1f2521; --line:#323a34; --accent:#7fc08f; --warn:#e08a55; --good:#6fcf8a; color-scheme:dark; }
}
:root[data-theme="dark"] { --bg:#161a17; --fg:#e8ebe6; --muted:#98a39b; --card:#1f2521; --line:#323a34; --accent:#7fc08f; --warn:#e08a55; --good:#6fcf8a; color-scheme:dark; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:15px/1.45 system-ui,-apple-system,sans-serif; }
header { display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center; padding:10px 16px 8px; border-bottom:1px solid var(--line); background:var(--card); position:sticky; top:0; z-index:5; }
/* row 1: logo left, data date + version + theme right; row 2: the pages */
header nav { order:9; flex-basis:100%; display:flex; flex-wrap:wrap; gap:4px; margin:0 -8px; }
header h1 { font-size:18px; margin:0; color:var(--accent); }
header a { color:var(--fg); text-decoration:none; padding:4px 8px; border-radius:6px; }
header a.on { background:var(--accent); color:var(--bg); }
header .day { margin-left:auto; color:var(--muted); font-size:13px; }
main { max-width:1100px; margin:0 auto; padding:16px; }
.panel { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin-bottom:12px; }
.panel h2 { font-size:13px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); margin:0 0 8px; }
.chips { display:flex; flex-wrap:wrap; gap:6px; }
.chip { border:1px solid var(--line); background:var(--bg); color:var(--fg); border-radius:999px; padding:4px 11px; cursor:pointer; font:inherit; }
.chip.on { background:var(--accent); color:var(--bg); border-color:var(--accent); }
.stores { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:4px 12px; margin-top:8px; }
.stores label { display:flex; gap:6px; align-items:center; font-size:14px; }
.stores small { color:var(--muted); }
.row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
input[type=search], select { font:inherit; padding:7px 10px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--fg); min-width:0; }
input[type=search] { flex:1 1 220px; }
.count { color:var(--muted); font-size:13px; margin:6px 2px 8px; }
table { width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
th, td { padding:7px 10px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; }
th { font-size:12px; text-transform:uppercase; color:var(--muted); letter-spacing:.04em; }
td.num, th.num { text-align:right; white-space:nowrap; }
td a { color:var(--fg); text-decoration:none; } td a:hover { text-decoration:underline; }
.sub { color:var(--muted); font-size:12px; }
.in { color:var(--good); } .out { color:var(--warn); } .unk { color:var(--muted); }
.old { text-decoration:line-through; color:var(--muted); font-size:12px; }
.pager { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin:12px 0; }
button.more { margin:0; padding:8px 20px; border-radius:8px; border:1px solid var(--line); background:var(--card); color:var(--fg); cursor:pointer; font:inherit; }
details { margin:4px 0; } summary { cursor:pointer; }
details ul { margin:6px 0 6px 18px; padding:0; font-size:13px; }
@media (max-width:640px) {
  th.hide-s, td.hide-s { display:none; }
  header { padding:8px 10px 6px; gap:6px 8px; }
  header nav { gap:0; margin:0 -6px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
  header nav a { padding:4px 5px; font-size:13px; white-space:nowrap; }
  header .day { font-size:12px; }
  main { padding:12px 8px; }
  th, td { padding:6px 6px; } th.num { white-space:normal; } th { letter-spacing:0; font-size:11px; } summary { font-size:13px; }
}
th[data-k] { cursor:pointer; user-select:none; } th[data-k]:hover { color:var(--fg); } th[data-k]::after { content:attr(data-arrow); }
.deal { color:var(--good); font-weight:600; white-space:nowrap; }
button.link { background:none; border:0; padding:0; color:var(--accent); font:inherit; cursor:pointer; text-decoration:underline; }
tr.hist td { background:var(--bg); }
tr.hist svg { display:block; max-width:100%; height:auto; margin:4px 0; }
tr.hist path { fill:none; stroke:var(--accent); stroke-width:2; }
tr.hist circle { fill:var(--accent); }
@media (min-width:641px) { .hide-l { display:none; } }
tr.report td { background:var(--bg); }
button.flag { color:var(--muted); }
a.tel { color:inherit; white-space:nowrap; }
.intro { color:var(--muted); font-size:14px; margin:0 2px 12px; max-width:75ch; }
th.sorted { background:color-mix(in srgb, var(--accent) 16%, var(--card)); color:var(--fg); }
th[data-k]:not(.sorted)::after { content:" ⇅"; opacity:.5; }
button.theme { background:none; border:1px solid var(--line); color:var(--fg); border-radius:6px; padding:2px 8px; font:inherit; cursor:pointer; line-height:1.4; }
[hidden] { display:none !important; }
.ver { color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
/* ♥ my list */
button.heart { background:none; border:0; padding:0 4px 0 0; margin:0; font:inherit; font-size:18px; line-height:1; color:var(--muted); cursor:pointer; vertical-align:-1px; }
button.heart.on { color:#c8324b; }
header a#mylist { border:1px solid var(--line); padding:2px 9px; border-radius:999px; font-size:14px; white-space:nowrap; }
header a#mylist b { font-variant-numeric:tabular-nums; }
header a#mylist.on { background:var(--accent); color:var(--bg); border-color:var(--accent); }
tr.done td { opacity:.5; } tr.done td a { text-decoration:line-through; }
tr.shop td { background:var(--bg); font-weight:600; }
td.ck, th.ck { width:1%; text-align:center; } td.ck input { width:18px; height:18px; }
.share { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.note { background:color-mix(in srgb, var(--accent) 12%, var(--card)); border:1px solid var(--accent); border-radius:10px; padding:10px 14px; margin-bottom:12px; }
@media print {
  header, .panel, .pager, .noprint, button.heart, td.x, th.x, tr.skip { display:none !important; }
  body { background:#fff; color:#000; } table { border:0; } main { padding:0; max-width:none; }
  .hide-s { display:table-cell !important; } .hide-l { display:none !important; }
  a[href^="http"]::after { content:" " attr(href); font-size:9px; color:#555; word-break:break-all; }
}
.price-range { display:inline-flex; align-items:center; gap:4px; color:var(--muted); }
input.price { font:inherit; width:78px; padding:7px 8px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--fg); }