:root {
  color-scheme: light;
  --bg:#fff; --card:#fff; --ink:#1f1a17; --muted:#6a5f58; --line:#ecd9c6;
  --brand:#E60012; --brand-d:#b3000e; --brand-l:#FFEFE0; --warm:#FFF3D6; --warn:#b3261e;
  --shadow:0 1px 2px rgba(60,30,10,.07), 0 6px 18px rgba(60,30,10,.06);
  --c0:#f4e6d8; --c1:#f6c9b8; --c2:#f0968a; --c3:#e85a58; --c4:#E60012;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.8 system-ui,-apple-system,"Hiragino Sans","Yu Gothic UI","Yu Gothic",sans-serif; }
a { color:var(--brand); }
img, svg { max-width:100%; }
.wrap { max-width:960px; margin:0 auto; padding:0 16px; }
main.wrap { padding-top:20px; padding-bottom:56px; }
.preview { background:#fff3cd; color:#5c4400; text-align:center; padding:6px 12px; font-size:.85rem; }

header.site { background:#fff; border-bottom:3px solid var(--brand); }
header.site .wrap { display:flex; flex-wrap:wrap; align-items:center; gap:4px 20px; padding-top:10px; padding-bottom:10px; }
.brand { display:flex; align-items:center; font-size:0; color:var(--ink); text-decoration:none; }
.logo { display:inline-block; line-height:0; }
.logo img { height:44px; width:auto; display:block; }
header.site nav { display:flex; flex-wrap:wrap; gap:2px 4px; margin-left:auto; }
header.site nav a { padding:6px 10px; border-radius:8px; text-decoration:none; color:var(--muted); font-size:.92rem; white-space:nowrap; }
header.site nav a[aria-current="page"] { background:var(--brand-l); color:var(--brand-d); font-weight:700; }

.crumbs { font-size:.82rem; color:var(--muted); margin:2px 0 8px; overflow-wrap:anywhere; }
.crumbs a { color:var(--muted); }
h1 { font-size:1.6rem; line-height:1.4; margin:.3em 0 .5em; overflow-wrap:anywhere; }
h2 { font-size:1.25rem; line-height:1.5; margin:2em 0 .6em; padding-bottom:.2em; border-bottom:2px solid var(--line); overflow-wrap:anywhere; }
p, li { overflow-wrap:anywhere; }
.answer { font-size:1.08rem; background:var(--card); border:1px solid var(--line); border-left:5px solid var(--brand); border-radius:12px; padding:12px 16px; margin:0 0 1.2em; box-shadow:var(--shadow); }
.notice { font-size:.88rem; color:var(--muted); }
.stamp { font-size:.85rem; color:var(--muted); }
ul.links { padding-left:1.2em; }
ul.links li { margin:.25em 0; }

.tablewrap { overflow-x:auto; border:1px solid var(--line); border-radius:14px; background:var(--card); box-shadow:var(--shadow); margin:.8em 0 1.2em; }
table { border-collapse:collapse; width:100%; font-size:.93rem; }
caption { text-align:left; padding:10px 12px 4px; font-weight:700; color:var(--muted); }
th, td { padding:8px 12px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }
th { background:var(--brand-l); color:var(--brand-d); font-weight:700; }
td.num, th.num { text-align:right; font-variant-numeric:tabular-nums; }
tr:last-child td { border-bottom:0; }

svg.chart { width:100%; height:auto; display:block; background:var(--card); border:1px solid var(--line); border-radius:14px; margin:.8em 0 1.2em; }
svg.chart text { font-size:11px; fill:var(--ink); }
svg.chart .bar { fill:var(--brand); }
svg.chart .axis { stroke:var(--line); stroke-width:1; }
svg.chart .line { fill:none; stroke:var(--brand); stroke-width:2.5; stroke-linejoin:round; }
svg.chart .dot { fill:var(--brand); }
.tilemap-box { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:12px; box-shadow:var(--shadow); margin:.8em 0 1.2em; }
svg.tilemap { width:100%; height:auto; display:block; max-width:520px; margin:0 auto; }
svg.tilemap .tile { stroke:var(--card); stroke-width:2; }
svg.tilemap text { font-size:11px; font-weight:800; text-anchor:middle; dominant-baseline:central; pointer-events:none; fill:#fff; }
svg.tilemap .t0 { fill:var(--c0); } svg.tilemap .t0 + text, svg.tilemap .na + text { fill:var(--muted); }
svg.tilemap .t1 { fill:var(--c1); } svg.tilemap .t1 + text { fill:#0f3a41; }
svg.tilemap .t2 { fill:var(--c2); } svg.tilemap .t2 + text { fill:#0b2a2f; }
svg.tilemap .t3 { fill:var(--c3); }
svg.tilemap .t4 { fill:var(--c4); }
svg.tilemap .na { fill:none; stroke:var(--line); stroke-dasharray:3 3; }
.tile-legend { font-size:.82rem; color:var(--muted); text-align:center; margin-top:6px; }

dl.info { display:grid; grid-template-columns:minmax(0,9em) minmax(0,1fr); gap:6px 14px; }
dl.info dt { font-weight:700; color:var(--muted); }
dl.info dd { margin:0; overflow-wrap:anywhere; }
.btn { display:inline-block; padding:.55em 1.2em; border-radius:999px; background:var(--brand); color:#fff; text-decoration:none; font-weight:700; }

footer.site { border-top:1px solid var(--line); background:var(--card); font-size:.85rem; color:var(--muted); }
footer.site .wrap { padding-top:14px; padding-bottom:22px; }
footer.site .legal { display:flex; flex-wrap:wrap; gap:4px 16px; }
footer.site a { color:var(--muted); }
@media (max-width:520px) {
  h1 { font-size:1.35rem; }
  dl.info { grid-template-columns:1fr; }
  dl.info dt { margin-top:6px; }
}

/* trend-sokuho.com */
.eyecatch { margin:0 0 1.2em; } .eyecatch img { width:100%; height:auto; display:block; border-radius:12px; }
figure.pic { margin:1em 0; } figure.pic img { width:100%; height:auto; display:block; border-radius:12px; border:1px solid var(--line); }
.answer { background:var(--warm); border-color:#f0dcae; border-left-color:var(--brand); }
h2 { border-bottom-color:var(--brand); }
.more { margin:.2em 0 1.2em; } .more a { font-weight:700; }
aside.hack { background:var(--warm); border:1px solid #f0dcae; border-radius:12px; padding:12px 16px; margin:1em 0; }
aside.hack strong { display:block; color:var(--brand-d); margin-bottom:2px; }
.checklist { background:var(--brand-l); border:1px solid var(--line); border-radius:14px; padding:12px 16px; margin:.8em 0 1.2em; }
.checklist ul { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:4px 16px; }
.checklist label { display:flex; align-items:center; gap:8px; padding:6px 0; cursor:pointer; }
.checklist input { width:20px; height:20px; accent-color:var(--brand); }
.checklist .tally { margin:8px 0 0; font-weight:700; }
.lead-card { background:var(--card); border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:var(--shadow); margin:.6em 0 1.2em; }
.lead-card a { display:block; text-decoration:none; color:var(--ink); }
.lead-card img { width:100%; height:auto; display:block; }
.lead-card .lead-title { display:block; font-size:1.3rem; font-weight:800; line-height:1.4; padding:12px 16px 0; }
.lead-card p { margin:.4em 16px 14px; color:var(--muted); }
th { background:var(--brand-l); color:var(--brand-d); }
footer.site .fcats { margin-right:16px; }
footer.site .legal span { font-size:0; }
footer.site .legal span::after { content:"© 2026 今日の話題"; font-size:.85rem; }

/* product shelves (sokuhou/mallshelf.js) */
.shelf { background:var(--warm); border:1px solid #f0dcae; border-radius:14px; padding:12px 14px; margin:1em 0 1.4em; }
.shelf[hidden] { display:none; }
.shelf-pr { margin:0 0 8px; font-size:.82rem; font-weight:700; color:var(--brand-d); }
.shelf-list { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; }
.shelf-card { display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; background:#fff; border:1px solid var(--line); border-radius:12px; padding:10px; }
.shelf-img { display:block; width:100%; aspect-ratio:1/1; }
.shelf-img img { width:100%; height:100%; object-fit:contain; display:block; }
.shelf-word { font-weight:700; font-size:.92rem; }
.shelf-price { font-size:.85rem; color:var(--muted); }
.shelf-btn { margin-top:4px; }
.shelf-btn > a { display:block; color:#fff; text-decoration:none; padding:.4em 1em; }
.shelf-note { margin:8px 0 0; font-size:.8rem; color:var(--muted); }
