/* owarai.ai 海外版 — 画面の共通 CSS（段 C・2026-10-02）
   方針：スマホ優先・紅白黒・角 0〜4px・グラデ無し・押す所は 44px 以上・写真の上の文字は箱に乗せる・JS なしで本文が読める。
   色の約束：赤 #c2271c は 1 面に 1 か所（ON AIR の札／今週の帯／Funny! を押した状態）。#ed3b2f はロゴ SVG の中だけ。
   書体：見出し Barlow Condensed（OFL・自前配信）／本文 DM Sans（OFL・自前配信）／CJK は端末の書体に任せる（外部 link なし）。 */
@font-face{font-family:"Barlow Condensed";src:url("fonts/display.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"DM Sans";src:url("fonts/body.ttf") format("truetype");font-weight:400 700;font-style:normal;font-display:swap}
:root{--deep:#0b0b0c;--paper:#ffffff;--ink:#202121;--muted:#5f5f66;--line:#202121;--mist:#f2f2f4;--gray:#d9d9dc;--red:#c2271c;--yel:#ffd400;
  --body:"DM Sans","Noto Sans JP","Noto Sans KR","Noto Sans TC","Apple SD Gothic Neo","PingFang TC","Hiragino Sans",system-ui,sans-serif;
  --disp:"Barlow Condensed","DM Sans","Noto Sans JP","Noto Sans KR","Noto Sans TC","Apple SD Gothic Neo","PingFang TC","Hiragino Sans",system-ui,sans-serif;
  --ja:"Hiragino Sans","Noto Sans JP",sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45;overflow-x:hidden}
body.dark{background:var(--deep);color:#fff}
img,video,svg{max-width:100%}
a{color:inherit}
a:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid currentColor;outline-offset:2px}
h1,h2,h3{margin:0;font-family:var(--disp);font-weight:700;line-height:1.02;letter-spacing:-0.01em;overflow-wrap:anywhere}
p{margin:0;overflow-wrap:anywhere}
.ja{font-family:var(--ja);font-weight:900}
.eye{display:block;font-size:11px;font-weight:700;line-height:1;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.dark .eye,.onstage .eye,.band .eye{color:var(--gray)}
.muted{color:var(--muted)}
.dark .muted{color:#e6e6e9}
.wrap{max-width:1280px;margin:0 auto;padding:0 16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ---- ヘッダ ----
   スマホ＝1 行目にロゴと言語選択（選択は右寄せ）・2 行目にナビ。DOM の順は ロゴ→言語→ナビ（Web は order で ロゴ→ナビ→言語）。
   Feed／ショート（body.feedpage）のスマホだけ、ヘッダは動画の上に重ねる（下の「段 1 Feed」）。 */
.h{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 16px 0;position:relative;z-index:2}
.logo{display:flex;align-items:center;min-height:44px;flex:none;text-decoration:none}
.logo img{display:block;width:155px;height:26px}
.h .sel{height:44px;flex:1 1 0;min-width:96px;max-width:150px;margin-left:auto;border:1px solid var(--line);background:#fff;color:var(--ink);padding:0 10px;font-size:13px;font-weight:600;font-family:inherit}
.dark .h .sel{border-color:#fff;background:rgba(11,11,12,.6);color:#fff}
.nav{display:flex;align-items:center;gap:6px;width:100%}
.nav .chip{flex:none}
@media (min-width:960px){.h{padding:14px 40px 10px;border-bottom:1px solid var(--line);flex-wrap:nowrap;gap:16px}.dark .h{border-bottom-color:rgba(255,255,255,.3)}
  .nav{width:auto;margin-left:16px;gap:4px;order:2}.nav .chip{border:0;border-bottom:2px solid transparent;height:44px;line-height:44px;padding:0 14px;font-size:15px;background:transparent}
  .nav .chip[aria-current="page"]{border-bottom-color:currentColor}.h .sel{order:3;flex:0 0 auto;margin-left:auto}}

/* ---- 押す所（全部 44px 以上） ---- */
.chip{display:inline-flex;align-items:center;gap:4px;height:44px;line-height:42px;padding:0 12px;border:1px solid var(--line);background:#fff;color:var(--ink);text-decoration:none;font-size:13px;font-weight:700;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.dark .chip,.chip.d{border-color:#fff;background:rgba(11,11,12,.6);color:#fff}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 16px;background:var(--ink);color:#fff;text-decoration:none;font-size:15px;font-weight:700;border:0;font-family:inherit;cursor:pointer;text-align:center}
.dark .btn,.btn.d{background:#fff;color:var(--ink)}
.btn2{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 16px;border:1px solid var(--line);background:#fff;color:var(--ink);text-decoration:none;font-size:14px;font-weight:700;text-align:center;line-height:1.2;font-family:inherit;cursor:pointer}
.dark .btn2,.btn2.d{border-color:#fff;background:transparent;color:#fff}
.tl{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0 6px;color:inherit;text-decoration:underline;text-underline-offset:3px;font-size:13px;font-weight:700}
.sq{width:52px;height:52px;flex:none;display:flex;align-items:center;justify-content:center;border:2px solid #fff;background:rgba(11,11,12,.6);color:#fff;text-decoration:none;cursor:pointer;font-family:inherit}
.sq.w{background:#fff;color:var(--ink)}
.back{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line);color:var(--ink);text-decoration:none;flex:none}
.dark .back{border-color:#fff;color:#fff;background:rgba(11,11,12,.6)}
.ic{width:20px;height:20px;flex:none}
.ic.s{width:16px;height:16px}
.ic.l{width:26px;height:26px}

/* ---- 赤（1 面 1 か所） ---- */
.onair{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 12px;background:var(--red);color:#fff;text-decoration:none;flex:none;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.dot{width:8px;height:8px;border-radius:50%;background:#fff;flex:none;animation:onair 1.6s ease-in-out infinite}
@keyframes onair{0%,100%{opacity:1}50%{opacity:.35}}
.funny{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 16px;border:2px solid var(--ink);background:#fff;color:var(--ink);font-family:var(--disp);font-size:18px;font-weight:700;cursor:pointer;flex:1}
.funny[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}
.funny .n{font-family:var(--body);font-size:12px;font-weight:600;opacity:.9}
.dark .funny{border-color:#fff;background:rgba(11,11,12,.55);color:#fff;min-height:52px}
.dark .funny[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}   /* 暗い面（Feed／ショート）でも押した状態が赤になる（上の .dark .funny が後勝ちで消していた） */
.band{background:var(--red);color:#fff}

/* ---- 写真・動画と、その上の箱 ---- */
.box{background:rgba(11,11,12,.72);color:#fff;padding:7px 10px}
.media{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--deep)}
.media img,.media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.media .play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border:2px solid #fff;background:rgba(11,11,12,.55);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:inherit}
.media .full{position:absolute;right:8px;top:8px;width:44px;height:44px;border:1px solid #fff;background:rgba(11,11,12,.55);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:inherit}
.media .dur{position:absolute;left:8px;top:8px;font-size:11px;font-weight:700;color:#fff;background:rgba(11,11,12,.7);padding:6px 8px}
.thumb{position:relative;display:block;width:144px;height:81px;overflow:hidden;background:var(--deep);flex:none}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb.sm{width:72px;height:40px}
.kanji{position:absolute;right:0;top:0;font-family:var(--ja);font-weight:900;line-height:1;color:rgba(32,33,33,.12);pointer-events:none;user-select:none}
.dark .kanji{color:rgba(255,255,255,.14)}
.clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---- 見る動機（①国の人数 ②なぜ笑えるか） ---- */
.why{display:flex;flex-direction:column;gap:3px}
.why .r1{font-size:15px;font-weight:700;line-height:1.35}
.why .r2{font-size:13px;font-weight:500;line-height:1.35;color:var(--muted)}
.dark .why .r2,.box .r2,.band .r2{color:#e6e6e9}

/* ---- 舞台の札（センターマイク） ---- */
.stage{display:inline-flex;align-items:center;gap:8px;min-height:56px;padding:6px 10px;border:1px solid #fff;background:rgba(11,11,12,.72);color:#fff;text-decoration:none}
.stage .mic{width:22px;height:34px;flex:none}
.stage .nm{display:flex;flex-direction:column;gap:3px}
.stage .nm b{font-size:13px;font-weight:800;line-height:1}
.stage .nm .ja{font-size:14px;line-height:1}
.onstage{display:flex;flex-direction:column;align-items:center;gap:0;padding:0 16px 22px;background:var(--deep);color:#fff;text-align:center}
.onstage .micbig{width:132px;height:220px}
.onstage h1{margin-top:8px;font-size:40px;line-height:.95;letter-spacing:.01em}
.onstage .ja{margin-top:8px;font-size:32px;line-height:1.1}
.onstage .blurb{margin-top:12px;font-size:14px;font-weight:600;color:var(--gray)}
@media (min-width:960px){.onstage{margin:16px 40px 0;padding:0 40px 40px}.onstage .micbig{width:168px;height:280px}.onstage h1{font-size:64px}.onstage .ja{font-size:40px}.onstage .blurb{font-size:16px;max-width:560px}}
.actcell{display:flex;align-items:flex-start;gap:8px;text-decoration:none;color:inherit;min-height:44px;min-width:0}
.actcell .mic{width:24px;height:36px;flex:none}
.actcell .nm{display:flex;flex-direction:column;gap:2px;min-width:0}
.actcell .nm b{font-size:13px;font-weight:800;line-height:1.2}
.actcell .nm .ja{font-size:13px;line-height:1.2;color:var(--muted)}
.actcell .nm .bl{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;font-weight:500;line-height:1.3;color:var(--muted);overflow:hidden}

/* ---- 段 1 Feed／段 5 Shorts（縦・全画面・CSS の scroll-snap＝JS なしでも次へ送れる） ----
   スマホ（10/3 の実機確認で直した所）：
   ① ヘッダは動画の上に重ねる（.feedpage .h＝ロゴと言語だけ・ナビは下段の文字リンク）。1 項目＝100svh。
   ② 動画に焼き込んだテロップは、棚の縦ショート 175 本・3,162 枚の実測で、画面の高さの 66.5〜79.7%（影まで・1531/1920）の帯にある。
      下段ブロックは「その帯より下だけ」を使う＝高さの上限 --blk（内訳 --bk-*）を (1 − --cap-bottom) × 画面の高さ以下にする（check_site.py が CSS の値で検査）。
   ②b テロップの横は実測で動画の幅の 6.9〜87.4%（影まで・75〜944/1080）。375px の端末では cover で左右が 9% ずつ切れるので、切り取りの窓を左へ寄せる（object-position:38%＝窓が 24〜32px 左へ・左端の「W」が欠けない）。
   ③ 画面が低い端末（Safari のバーで 100svh が 660px 前後など）では、動画の箱を (100svh − --blk) ÷ --cap-bottom に縮める＝帯が下段の上端に必ず収まる（動画は 9:16 のまま中央・左右は黒）。
   Web（960px 以上）は左に縦動画・右に情報の 2 列（下の @media）。 */
:root{--cap-bottom:.798;--hdr:58px;
  --bk-pt:8px;--bk-stat:16px;--bk-why:38px;--bk-gap:6px;--bk-acts:48px;--bk-links:44px;
  --blk:calc(var(--bk-pt) + var(--bk-stat) + var(--bk-why) + var(--bk-gap) + var(--bk-acts) + var(--bk-links) + env(safe-area-inset-bottom,0px));
  --vh:min(100vh,calc((100vh - var(--blk)) / var(--cap-bottom)))}
@supports (height:100svh){:root{--vh:min(100svh,calc((100svh - var(--blk)) / var(--cap-bottom)))}}
.feed{height:100vh;height:100svh;overflow-y:auto;scroll-snap-type:y mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}
.fi{position:relative;height:100vh;height:100svh;scroll-snap-align:start;overflow:hidden;background:var(--deep);color:#fff}
.fi video,.fi .fv{position:absolute;top:0;left:0;right:0;margin:0 auto;width:min(100%,calc(var(--vh) * 9 / 16));height:var(--vh);object-fit:cover;object-position:38% 50%;background:var(--deep)}
.fi .top{position:absolute;top:var(--hdr);left:0;right:0;display:flex;flex-direction:column}
.fi .tags{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:8px 16px 0}
.fi .tags>*{min-width:0}
.fi .tags .chip{flex:0 1 auto}
.ell{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fi .bot{position:absolute;left:0;right:0;bottom:0;padding:var(--bk-pt) 16px env(safe-area-inset-bottom,0px);display:flex;flex-direction:column;gap:var(--bk-gap);background:var(--deep)}
.fi .tt{display:none;font-size:13px;font-weight:600;line-height:1.3}
.fi .acts{display:flex;gap:8px;align-items:stretch}
.fi .watch{flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 8px;background:#fff;color:var(--ink);text-decoration:none;font-size:13px;font-weight:700;line-height:1.2;text-align:center}
.fi .links{display:flex;align-items:center;justify-content:space-between;gap:4px}
.fi .pos{font-size:12px;font-weight:700;line-height:1;white-space:nowrap;color:#d9d9dc}
.fi .bar{height:3px;background:rgba(255,255,255,.22)}
.fi .bar i{display:block;height:3px;background:#fff}
.fi .bar.dots{display:flex;gap:4px;background:none}
.fi .bar.dots i{flex:1;background:rgba(255,255,255,.25)}
.fi .bar.dots i.on{background:#fff}
@media (max-width:959.98px){
  .feedpage .h{position:absolute;top:0;left:0;right:0;z-index:5;flex-wrap:nowrap;padding:8px 16px 6px;background:rgba(11,11,12,.62)}
  .feedpage .nav{display:none}
  .fi .eye{height:var(--bk-stat);margin-bottom:calc(var(--bk-gap) * -1);line-height:var(--bk-stat);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .fi .eye.no-m{display:none}
  .fi .why{gap:0}
  .fi .why .r1:not(:only-child){height:var(--bk-stat);font-size:12px;line-height:var(--bk-stat);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .fi .why p:last-child{max-height:var(--bk-why);font-size:15px;font-weight:700;line-height:calc(var(--bk-why) / 2);color:#fff;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .fi .acts{height:var(--bk-acts)}
  .fi .acts .funny{flex:0 0 auto;min-width:92px;min-height:44px;padding:0 12px}
  .fi .sq{width:var(--bk-acts);height:var(--bk-acts)}
  .fi .links{height:var(--bk-links);margin-top:calc(var(--bk-gap) * -1)}
  .fi .links .tl{padding:0 6px;font-size:12px;white-space:nowrap}
  .fi .links .ic{display:none}
  .fi .bar{position:absolute;top:0;left:0;right:0}
  .fi .watch:focus-visible,.fi .sq.w:focus-visible{outline-color:#fff}   /* 白いボタンの輪郭線は暗い下段の上では白で描く（currentColor＝墨だと見えない） */
}
@media (min-width:960px){.feed{height:auto;overflow:visible;scroll-snap-type:none}.fi{height:auto;min-height:0;display:grid;grid-template-columns:460px minmax(0,1fr);gap:48px;padding:24px 40px 40px;background:var(--paper);color:var(--ink);overflow:visible}
  .fi video,.fi .fv{position:relative;inset:auto;width:405px;height:720px;margin:20px auto 0;display:block}
  .fi .vwrap{background:var(--deep);padding:0 0 20px;display:flex;flex-direction:column;align-items:center;gap:12px;grid-column:1;grid-row:1/3}
  .fi .top{position:static;grid-column:2;grid-row:1}.fi .tags{padding:0;justify-content:flex-start;gap:16px}
  .fi .bot{position:static;grid-column:2;grid-row:2;align-self:start;background:transparent;padding:8px 0 0;gap:18px}
  .fi .eye{color:var(--muted)}.fi .tt{display:block;color:var(--muted)}
  .fi .why .r1{font-family:var(--disp);font-size:44px;line-height:.98;letter-spacing:-0.02em}.fi .why .r2{font-size:18px}
  .fi .acts{gap:12px}
  .fi .funny{min-height:52px;border-color:var(--ink);background:#fff;color:var(--ink)}.fi .funny[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}
  .fi .watch{min-height:52px;background:var(--ink);color:#fff;font-size:14px}
  .fi .links{flex-wrap:wrap;justify-content:flex-start;gap:8px 24px}
  .fi .links .go{flex:1 1 100%;justify-content:center;min-height:48px;padding:0 16px;border:1px solid var(--ink);text-decoration:none}
  .fi .pos{color:var(--muted)}
  .fi .bar{display:none}.fi .bar.dots{display:flex}.fi .bar.dots i{background:var(--gray)}.fi .bar.dots i.on{background:var(--ink)}}

/* ---- 段 2 種類の棚 ---- */
.kinds{display:flex;flex-direction:column;gap:28px;padding:0 16px 24px}
.kc{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:14px;min-width:0}
.kc .media{min-height:44px}
.kc .nm{position:relative;display:flex;flex-direction:column;gap:6px;min-height:44px;text-decoration:none;color:inherit;padding-right:84px}
.kc .nm .kanji{font-size:84px}
.kc .nm b{font-family:var(--disp);font-size:26px;font-weight:700;line-height:1.05}
.kc .nm .what{font-size:14px;font-weight:500;color:var(--muted)}
.kc .nm .cnt{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;line-height:1;padding-top:2px}
@media (min-width:960px){.kinds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 32px;padding:8px 40px 40px}.kc .nm b{font-size:28px}.kc .nm .kanji{font-size:96px;top:-8px}.kc .nm{padding-right:96px}}
.kshelf{display:flex;flex-direction:column;padding:0 16px 24px}
.kshelf a{position:relative;display:grid;grid-template-columns:144px minmax(0,1fr);grid-template-areas:"m n" "m c";column-gap:12px;row-gap:4px;align-content:center;min-height:101px;padding:10px 0;text-decoration:none;color:inherit;min-width:0;border-top:1px solid var(--line)}
.kshelf .media{grid-area:m;align-self:center;width:144px}
.kshelf .nm{grid-area:n;align-self:end;position:relative;display:block;padding-right:48px;min-height:28px;font-family:var(--disp);font-size:22px;font-weight:700;line-height:1.1}
.kshelf .nm .kanji{font-size:44px;top:-6px}
.kshelf .cnt{grid-area:c;align-self:start;font-size:13px;font-weight:600;color:var(--muted)}
.dark .kshelf a{border-top-color:rgba(255,255,255,.3)}
.dark .kshelf .cnt{color:var(--gray)}
@media (min-width:960px){.kshelf{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:16px;padding:0 40px 40px}
  .kshelf a{display:flex;flex-direction:column;gap:8px;min-height:44px;padding:10px 0 0}.kshelf .media{width:100%}
  .kshelf .nm{padding-right:36px;min-height:44px;font-size:15px;line-height:1.15}.kshelf .nm .kanji{font-size:40px;top:-4px}.kshelf .cnt{font-size:12px}}

/* ---- 段 3 種類のページ／順位の行 ---- */
.khead{position:relative;display:flex;flex-direction:column;gap:8px;padding:20px 16px 14px}
.khead .kanji{font-size:96px;right:12px;top:8px}
.khead h1{font-size:32px;padding-right:72px}
.khead .what{font-size:14px;font-weight:500;color:var(--muted)}
.khead .nums{font-size:13px;font-weight:700;margin-top:2px}
.rows{display:flex;flex-direction:column;padding:0 16px 16px}
.row{display:flex;gap:10px;align-items:center;min-height:96px;padding:10px 0;border-top:1px solid var(--line);text-decoration:none;color:inherit}
.row .n{font-family:var(--disp);font-size:18px;font-weight:700;width:22px;flex:none}
.row .tx{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.row .tt{font-size:13px;font-weight:700;line-height:1.25}
.row .r1{font-size:11px;font-weight:700;line-height:1.3}
.row .r2{font-size:12px;font-weight:500;line-height:1.3;color:var(--muted)}
.row .dur{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;line-height:1;color:var(--muted)}
.dark .row{border-top:0;border:1px solid #fff;background:rgba(255,255,255,.06);padding:10px;min-height:81px;margin-bottom:8px}
.dark .row .r2,.dark .row .dur{color:#e6e6e9}
.more{display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:1px solid var(--line)}
@media (min-width:960px){.kind2{display:grid;grid-template-columns:400px minmax(0,1fr);gap:48px;padding:28px 40px 40px}.khead{padding:0}.khead .kanji{font-size:120px;top:-8px;right:0}.khead h1{font-size:44px;padding-right:0;padding-top:100px}.rows{padding:0}}

/* ---- 作品ページ ---- */
.work{display:flex;flex-direction:column;gap:16px;padding:14px 16px 20px}
.work h1{font-size:26px;line-height:1.1}
.meta{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.meta .cell{display:flex;flex-direction:column;gap:3px;min-width:0}
.meta .v{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;line-height:1.2;min-height:32px}
.meta .chip{height:auto;min-height:44px;line-height:1.25;padding:6px 12px;white-space:normal;overflow:visible;text-overflow:clip}
.meta .chip .clamp2{min-width:0}
.voice{display:flex;flex-direction:column;gap:6px}
.voice .opts{display:flex;gap:6px}
.vbtn{flex:1;min-height:44px;border:1px solid var(--ink);background:#fff;color:var(--ink);font-size:13px;font-weight:700;padding:6px 10px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;font-family:inherit}
.vbtn[aria-pressed="true"]{background:var(--ink);color:#fff}
.voice .note{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--muted)}
.first{display:flex;flex-direction:column;gap:6px;padding:12px;background:var(--mist)}
.first p{font-size:14px;font-weight:600;line-height:1.4}
.first .rest{font-size:11px;font-weight:500;color:var(--muted)}
.ainote{font-size:12px;font-weight:500;color:var(--muted);line-height:1.4}
.nextcard{display:flex;align-items:center;gap:10px;min-height:56px;padding:10px 12px;border:1px solid var(--line);text-decoration:none;color:inherit}
.nextcard .tx{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.nextcard .cap{font-size:13px;font-weight:700;line-height:1.3}
.nextcard .sub{font-size:12px;font-weight:500;line-height:1.35;color:var(--muted)}
.ending{display:flex;flex-direction:column;gap:16px;padding:18px 16px 20px;background:var(--deep);color:#fff}
.ending .et{font-family:var(--disp);font-size:30px;font-weight:700;line-height:1}
.ending .acts{display:flex;gap:10px}
.ending .kname{font-family:var(--disp);font-size:20px;font-weight:700;line-height:1.1}
.ending .sub{display:flex;flex-direction:column;gap:8px}
@media (min-width:960px){.work2{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:40px;padding:24px 40px 40px}.work{padding:0}.work h1{font-size:34px}.meta{grid-template-columns:1fr}.ending{margin:0 40px 40px}}

/* ---- 今週 ---- */
.band{display:flex;flex-direction:column;gap:12px;padding:18px 16px 20px;margin-top:12px}
.band .wk{display:flex;align-items:center;gap:8px}
.band h1{font-size:40px;line-height:.95}
.band .sub{font-size:13px;font-weight:500;color:rgba(255,255,255,.88)}
.band .hero{display:block;min-height:44px;text-decoration:none;color:#fff}
.band .hero .tt{display:block;padding-top:8px;font-size:15px;font-weight:700}
.adds{display:flex;flex-direction:column;padding:18px 16px 18px}
.adds a{display:flex;align-items:center;gap:10px;min-height:48px;border-top:1px solid var(--line);text-decoration:none;color:inherit}
.adds a .nm{font-size:14px;font-weight:700;flex:1}
.adds a .pl{display:inline-flex;align-items:center;gap:2px;font-family:var(--disp);font-size:18px;font-weight:700}
.dubs{display:flex;flex-direction:column;gap:8px;padding:0 16px 20px}
.dubs .row{border:1px solid var(--line);border-top:1px solid var(--line);padding:8px;min-height:81px}
@media (min-width:960px){.band{padding:32px 40px 36px;margin-top:16px}.band h1{font-size:72px;line-height:.92}.band .herogrid{display:grid;grid-template-columns:640px minmax(0,1fr);gap:48px;align-items:start}.week2{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:32px 40px 40px}.adds,.dubs{padding:0}}

/* ---- Guide・記事・用途 ---- */
.tips{display:flex;flex-direction:column;gap:12px;padding:0 16px 20px}
.tip{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--line)}
.tip .hl{font-family:var(--disp);font-size:20px;font-weight:700;line-height:1.15}
.tip .bd{font-size:13px;font-weight:500;color:var(--muted)}
.tip .one{display:flex;gap:10px;align-items:center;min-height:81px;text-decoration:none;color:inherit}
.words{display:flex;flex-direction:column;gap:6px;padding:14px;background:var(--mist);margin:0 16px 20px}
.words p{font-size:13px;font-weight:500}
.art{padding:0 16px 24px;max-width:720px}
.art h1{font-size:30px;line-height:1.05}
.art h2{font-size:22px;margin-top:24px}
.art p{margin-top:10px;font-size:16px;line-height:1.6}
.art .lead{font-size:16px;color:var(--muted);margin-top:8px}
.art .rel{margin-top:20px;display:flex;flex-direction:column;gap:8px}
.ptitle{display:flex;flex-direction:column;gap:8px;padding:20px 16px 16px}
.ptitle h1{font-size:30px}
.ptitle .sub{font-size:14px;font-weight:500;color:var(--muted)}
@media (min-width:960px){.ptitle{padding:28px 40px 20px}.ptitle h1{font-size:44px}.tips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:8px 40px 24px}.words{margin:0 40px 40px}.art{padding:0 40px 40px}}

/* ---- 芸人の出演 ---- */
.wl{display:flex;flex-direction:column;gap:16px;padding:0 16px 20px}
.wc{display:flex;flex-direction:column;gap:8px;min-height:44px;text-decoration:none;color:inherit;border-top:1px solid var(--line);padding-top:14px;min-width:0}
.wc .tt{font-size:15px;font-weight:700;line-height:1.25}
.wc .sub{font-size:11px;font-weight:600;color:var(--muted)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
@media (min-width:960px){.wl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:8px 40px 24px}}

/* ---- Web だけ／スマホだけに出す塊・文字 ----
   .sec／.stack（後ろで display:flex）に負けないよう .sec.web-only の形で詳しさを上げる（以前は .sec{display:flex} が後勝ちで、スマホにも見出しだけが出ていた） */
.web-only,.sec.web-only,.stack.web-only{display:none}
.d-only{display:none}
@media (min-width:960px){.web-only{display:block}.sec.web-only,.stack.web-only{display:flex}.d-only{display:inline}.m-only{display:none}}

/* ---- 共通の塊 ---- */
.sec{display:flex;flex-direction:column;gap:8px;padding:16px 16px 14px}
.stack{display:flex;flex-direction:column;gap:8px}
.foot{padding:20px 16px 28px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:6px}
.dark .foot{border-top-color:rgba(255,255,255,.3);color:#d9d9dc}
.foot a{color:inherit;display:inline-flex;align-items:center;min-height:44px}
.p404{padding:40px 16px}
.p404 h1{font-size:40px}
@media (min-width:960px){.sec{padding:16px 40px 14px}.foot{padding:20px 40px 28px}.p404{padding:60px 40px}}

/* 埋め込み専用面（/e/<mid>）：ヘッダ・フッタなし・画面いっぱいの 1 本 */
body.embed{margin:0;background:var(--deep)}
body.embed .media{aspect-ratio:auto;height:100vh;height:100dvh}
body.embed .media video{object-fit:contain}

/* ---- すべりにくい話・読み物の入口（2026-10-04） ----
   話の面：読む前の前提＝灰の箱（編集部の声）／本人の語り＝左の墨の線と一段大きい字（芸人の声）／語りの終わりに赤い ■（この面の赤 1 か所）／
   元イラスト＝墨のコマ（オチの後・影はぼかさない）。カード：絵はオチを見せない物だけ。無い話は「話」の一字の札（連載の印）。 */
.story .shead{position:relative;display:flex;flex-direction:column;gap:8px;padding:20px 0 0}
.story .shead .seye,.story .shead h1{padding-right:72px}
.story .shead .kanji{font-size:72px;top:14px}
.seye{display:flex;align-items:center;min-height:44px;margin:-10px 0 -6px;text-decoration:none}
.seye:hover{text-decoration:underline;text-underline-offset:3px}
.story .ctx{margin-top:22px;padding:14px 16px;background:var(--mist)}
.story .ctx h2{margin:0;font-family:var(--body);font-size:12px;font-weight:700;line-height:1.3;letter-spacing:.06em;color:var(--muted)}
.story .ctx p{margin-top:6px;font-size:15px;line-height:1.55}
.story .voice{margin-top:26px;padding-left:14px;border-left:3px solid var(--ink)}
.story .voice h2{margin:0;font-size:24px}
.story .voice p{margin-top:12px;font-size:17px;line-height:1.72}
.fin{display:inline-block;width:.6em;height:.6em;margin-left:.35em;background:var(--red);vertical-align:baseline}
.panel{margin:30px 6px 0 0}
.panel img{display:block;width:100%;height:auto;border:2px solid var(--ink);box-shadow:6px 6px 0 var(--ink);background:#fff}
.panel figcaption{display:flex;flex-direction:column;gap:6px;margin-top:16px}
.panel .it{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;line-height:1.4}
.panel .iw [lang="ja"]{font-family:var(--ja);font-weight:600}
.panel .credit{font-size:12px;color:var(--muted)}
.story .note{margin-top:26px;padding-top:12px;border-top:1px solid var(--line)}
.story .note h2{margin:0;font-family:var(--body);font-size:14px;font-weight:700}
.story .note p{font-size:15px;line-height:1.55}
.story .src{margin-top:26px;font-size:13px;line-height:1.5;color:var(--muted)}
.story .src a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--ink);text-underline-offset:3px}
.story .ainote{margin-top:26px}   /* 2026-10-06：出典の行（.src）を外した＝注記の上に間を取る */
.art p.ainote{font-size:12px;font-weight:500;line-height:1.45;color:var(--muted)}   /* .art p（16px）に負けていた＝記事・話の注記を小さい字に戻す */
.snext,.smore{margin-top:28px;display:flex;flex-direction:column;gap:6px}
.scard{display:grid;grid-template-columns:112px minmax(0,1fr);gap:12px;align-items:start;min-height:44px;padding:12px 0;border-top:1px solid var(--line);text-decoration:none;color:inherit}
.scard .sim{display:block;aspect-ratio:753/463;border:2px solid var(--ink);background:#fff;overflow:hidden}
.scard .sim img{display:block;width:100%;height:100%;object-fit:cover}
.scard .sim.none{display:flex;align-items:center;justify-content:center;background:var(--mist)}
.scard .sim.none span{font-family:var(--ja);font-weight:900;font-size:30px;line-height:1;color:rgba(32,33,33,.3)}
.scard .stx{display:flex;flex-direction:column;gap:4px;min-width:0}
.scard .stt{font-size:15px;font-weight:700;line-height:1.3}
.scard .sds{font-size:13px;line-height:1.4;color:var(--muted)}
.scard:hover .stt{text-decoration:underline;text-underline-offset:3px}
.dark .scard{border-top-color:rgba(255,255,255,.3)}
.dark .scard .sim{border-color:#fff}
.dark .scard .sds{color:var(--gray)}
.dark .scard .sim.none{background:rgba(255,255,255,.08)}
.dark .scard .sim.none span{color:rgba(255,255,255,.4)}
.sgrid,.sshelf{display:flex;flex-direction:column;padding:0 16px}
.hub{padding:4px 0 20px}
.hubh{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px 84px 12px 16px}
.hubh h2{font-size:28px}
.hubh .kanji{font-size:64px;top:8px;right:16px}
.hubh .sub{font-size:14px;line-height:1.45;color:var(--muted)}
.rlist{display:flex;flex-direction:column;padding:0 16px}
.rrow{display:flex;flex-direction:column;gap:4px;min-height:44px;padding:12px 0;border-top:1px solid var(--line);text-decoration:none;color:inherit}
.rrow .rt{font-size:15px;font-weight:700;line-height:1.3}
.rrow .rd{font-size:13px;line-height:1.4;color:var(--muted)}
.rrow:hover .rt{text-decoration:underline;text-underline-offset:3px}
@media (min-width:960px){
  .story .shead{padding-top:28px}.story .voice p{font-size:18px;line-height:1.75}
  .sgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 24px;padding:4px 40px 0}
  .sshelf{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;padding:0 40px}
  .sgrid .scard,.sshelf .scard{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:0;border-top:0}
  .sgrid .scard .sim.none span{font-size:56px}
  .hubh{padding:24px 128px 14px 40px}.hubh h2{font-size:36px}.hubh .kanji{right:40px;font-size:80px}
  .rlist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px;padding:0 40px}}

/* 文脈記事の出典（2026-10-04） */
.art .refs{margin-top:22px;padding-top:12px;border-top:1px solid var(--line)}
.art .refs ul{margin:8px 0 0;padding-left:18px}
.art .refs li{font-size:14px;line-height:1.5}
.art .refs a{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:3px}