/* =====================================================================
   SAD（short-video.net）全面刷新 第1版の見た目（2026-10-21・SADデザインの枠）
   - 地・文字・線・文字の形は MAV（xvideo-jp.com）の本番と同じ値（10/21 実測）
   - 選んでいる状態だけ SAD の赤 #FF3333。購入ボタンの青は仮（色・文言は⑧が決める）
   - 名前は sd- で始まるものだけ。Tailwind の作り直し（npm run build）は要らない
   - body.sd-v2 … 新しい見た目（トップ・検索）
     body.sd-v2.sd-dk … まだ作り替えていないページ（同じ部品を暗い地で出す）
   ===================================================================== */

body.sd-v2{
  --ac:#FF3333; --acs:#FFEDED; --acl:#E25A5A;
  --buy:#0B6FD9; --buyh:#095CB4;
  --face:#F5F5F7; --bg:#FFFFFF; --ink:#1D1D1F; --ink2:#6E6E73; --line:#D2D2D7; --press:#EBEBEF; --goline:#E5E5EA;
  --rs:8px; --rm:12px; --hd:44px; --bn:56px;
  --font:system-ui,"Hiragino Sans","Noto Sans JP",sans-serif;
  margin:0;
  background:var(--face);
  color:var(--ink);
  font-family:var(--font);
  letter-spacing:.02em;
  -webkit-text-size-adjust:100%;
  padding-bottom:calc(var(--bn) + env(safe-area-inset-bottom));
}
body.sd-v2.sd-dk{
  --face:#171F2A; --bg:#1F2937; --ink:#F3F4F6; --ink2:#9CA3AF; --line:#374151; --press:#2A3646; --acs:#3B2328; --acl:#FF7A7A;
}
.sd-v2 a{text-decoration:none}
.sd-v2 .sd-wrap{display:block;width:100%;max-width:1240px;margin:0 auto;min-height:60vh}

/* ===== ヘッダー（白・下に1pxの線。暗いページでも白のまま） ===== */
.sd-v2 .sd-hd{
  --bg:#FFFFFF; --face:#F5F5F7; --ink:#1D1D1F; --ink2:#6E6E73; --line:#D2D2D7; --press:#EBEBEF;
  position:sticky; top:0; z-index:10000;
  background:var(--bg); color:var(--ink);
  border-bottom:1px solid var(--line);
}
.sd-v2 .sd-hd__in{max-width:1240px;height:var(--hd);margin:0 auto;padding:0 2px;display:flex;align-items:center;gap:8px;position:relative}
.sd-v2 .sd-hd__b{flex:none;width:44px;height:44px;border:0;background:none;color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0}
.sd-v2 .sd-hd__b svg{width:24px;height:24px}
.sd-v2 .sd-hd__q{margin-left:auto}
.sd-v2 .sd-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;font-size:inherit;line-height:1}
/* ロゴ：MAV の .mv-lg と同じ作り（文字・21px・太さ800）。色をつけるのは「ショート」だけ */
.sd-v2 .sd-lg{display:block;font-size:21px;font-weight:800;line-height:1.4;color:var(--ink);white-space:nowrap;letter-spacing:.02em}
.sd-v2 .sd-lg i{font-style:normal;color:var(--ac)}
.sd-v2 .sd-hd__nav{display:none}

/* 検索（スマホは虫めがねで開く。PCは常に出す） */
.sd-v2 .sd-sf{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);padding:8px}
.sd-v2 .sd-sf.hidden{display:none}
.sd-v2 .sd-qf{display:flex;align-items:center;gap:8px;height:44px;border-radius:var(--rs);border:1px solid var(--line);background:var(--face);padding:0 4px 0 12px;color:var(--ink2)}
.sd-v2 .sd-qf svg{flex:none;width:20px;height:20px}
.sd-v2 .sd-qf input{flex:1;min-width:0;height:40px;border:0;outline:0;background:transparent;font:inherit;font-size:16px;color:var(--ink);padding:0}
.sd-v2 .sd-qf input::placeholder{color:var(--ink2)}
.sd-v2 .sd-qf button{flex:none;height:36px;padding:0 14px;border:0;border-radius:6px;background:var(--ink);color:var(--bg);font:inherit;font-size:14px;font-weight:600;cursor:pointer}

/* メニュー（左上の三本線） */
.sd-v2 .sd-hm{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:0 8px 20px rgba(0,0,0,.08);padding:6px 0;max-height:calc(100vh - var(--hd));overflow:auto}
.sd-v2 .sd-hm.hidden{display:none}
.sd-v2 .sd-hm ul{list-style:none;margin:0 auto;padding:0;max-width:1240px}
.sd-v2 .sd-hm a{display:flex;align-items:center;gap:12px;height:48px;padding:0 18px;font-size:15px;font-weight:600;color:var(--ink)}
.sd-v2 .sd-hm a svg{flex:none;width:22px;height:22px;color:var(--ink2)}
@media (hover:hover){.sd-v2 .sd-hm a:hover{background:var(--press)}}

/* ===== タグの列 ===== */
.sd-v2 .sd-tags{display:flex;gap:8px;overflow-x:auto;padding:10px 8px;scrollbar-width:none}
.sd-v2 .sd-tags::-webkit-scrollbar{display:none}
.sd-v2 .sd-tag{flex:none;display:inline-flex;align-items:center;height:34px;padding:0 14px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line);font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap}
.sd-v2 .sd-tag.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
@media (hover:hover){.sd-v2 .sd-tag:not(.on):hover{background:var(--press)}}

/* ===== 広告の入れ物（中身は本番のまま。位置と数は⑧が決める） ===== */
.sd-v2 .sd-adw{grid-column:1/-1;display:flex;justify-content:center;overflow:hidden;margin:8px 0}
.sd-v2 .sd-adw:empty{display:none}

/* ===== 見出し・並び替え・連続再生の入口 ===== */
.sd-v2 .sd-sh{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;padding:12px 8px 4px}
.sd-v2 .sd-sh h1,.sd-v2 .sd-sh .sd-sh__t{font-size:17px;font-weight:700;line-height:1.4;margin:0;color:var(--ink)}
.sd-v2 .sd-sh small{font-size:13px;color:var(--ink2);font-weight:400}
.sd-v2 .sd-lead{margin:0;padding:0 8px 8px;font-size:13px;line-height:1.6;color:var(--ink2)}
.sd-v2 .sd-xl{display:inline-flex;align-items:center;gap:4px;margin:0 8px 8px;font-size:13.5px;font-weight:600;color:var(--ink)}
.sd-v2 .sd-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:4px 8px 0}
.sd-v2 .sd-tab{height:44px;border-radius:var(--rm);border:1px solid var(--line);background:var(--bg);color:var(--ink2);font-size:15px;font-weight:600;display:grid;place-items:center;white-space:nowrap}
.sd-v2 .sd-tab.on{background:var(--ac);border-color:var(--ac);color:#fff}
@media (hover:hover){.sd-v2 .sd-tab:not(.on):hover{background:var(--press)}}

.sd-v2 .sd-go{display:flex;align-items:center;gap:10px;margin:8px 8px 0;height:46px;padding:0 10px 0 9px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--goline);box-shadow:0 1px 3px rgba(0,0,0,.07);color:var(--ink)}
.sd-v2.sd-dk .sd-go{box-shadow:none;border-color:var(--line)}
@media (hover:hover){.sd-v2 .sd-go:hover{background:var(--press)}}
.sd-v2 .sd-go__ic{flex:none;width:30px;height:30px;border-radius:8px;background:var(--acs);color:var(--acl);display:grid;place-items:center}
.sd-v2 .sd-go__ic svg{width:20px;height:20px}
.sd-v2 .sd-go__tx{display:flex;flex-direction:column;min-width:0}
.sd-v2 .sd-go__t{font-size:15px;font-weight:600;line-height:1.3}
.sd-v2 .sd-go__s{font-size:12.5px;color:var(--ink2);font-weight:400;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-v2 .sd-go__s.pc{display:none}
.sd-v2 .sd-go__ar{margin-left:auto;flex:none;color:var(--ink2)}
.sd-v2 .sd-go__ar svg{width:16px;height:16px}

/* 表示の設定（表示件数・自動再生）。押したときだけ開く */
.sd-v2 .sd-setd{margin:6px 8px 0}
.sd-v2 .sd-setd summary{list-style:none;display:inline-flex;align-items:center;gap:4px;height:32px;padding:0 4px;font-size:13px;font-weight:600;color:var(--ink2);cursor:pointer}
.sd-v2 .sd-setd summary::-webkit-details-marker{display:none}
.sd-v2 .sd-setd summary svg{width:18px;height:18px}
.sd-v2 .sd-setd[open] summary{color:var(--ink)}
.sd-v2 .sd-setd__in{margin-top:4px;padding:12px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line)}
.sd-v2 .sd-setd h3{margin:0 0 8px;font-size:13px;font-weight:600;color:var(--ink2)}
.sd-v2 .sd-seg{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.sd-v2 .sd-seg:last-child{margin-bottom:0}
.sd-v2 .sd-seg button{height:38px;min-width:56px;padding:0 12px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.sd-v2 .sd-seg button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.sd-v2 .sd-range{padding:12px 8px 0;font-size:12.5px;color:var(--ink2)}

/* ===== 一覧のカード ===== */
.sd-v2 .sd-list{display:grid;grid-template-columns:minmax(0,1fr);margin-top:6px}
.sd-v2 .sd-card{position:relative;min-width:0;padding:12px 8px;border-bottom:1px solid var(--line)}
.sd-v2 .sd-pin{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-size:12.5px;font-weight:600;color:var(--ac)}
.sd-v2 .sd-pin svg{width:16px;height:16px}
.sd-v2 .sd-pin span{color:var(--ink2);font-weight:400}
.sd-v2 .sd-th{position:relative;aspect-ratio:16/9;border-radius:var(--rs);overflow:hidden;background:#000}
.sd-v2 .sd-th video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000;cursor:pointer}
.sd-v2 .sd-cover{position:absolute;inset:0;z-index:2;display:block;background-color:#000;background-position:center;background-repeat:no-repeat;background-size:contain}
.sd-v2 .sd-cover.hidden{display:none}
.sd-v2 .sd-th__mute{position:absolute;right:8px;top:8px;z-index:3;width:36px;height:36px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;display:grid;place-items:center;cursor:pointer}
.sd-v2 .sd-th__mute.hidden{display:none}
.sd-v2 .sd-th__mute svg{width:22px;height:22px}
.sd-v2 .sd-th__dur{position:absolute;right:8px;bottom:8px;z-index:3;height:22px;padding:0 7px;border-radius:6px;background:rgba(0,0,0,.66);color:#fff;font-size:12px;font-weight:600;line-height:22px;pointer-events:none}
.sd-v2 .sd-th__dur:empty{display:none}
.sd-v2 .sd-cb{min-width:0}
.sd-v2 .sd-ti{margin:9px 0 3px;font-size:16px;font-weight:400;line-height:1.4}
.sd-v2 .sd-ti a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--ink)}
.sd-v2 .sd-cd{color:var(--ink2);font-size:13px}
.sd-v2 .sd-meta{display:flex;align-items:center;gap:6px;min-width:0;min-height:20px;font-size:12px;color:var(--ink2)}
.sd-v2 .sd-meta a{max-width:12em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--ink);font-weight:600}
.sd-v2 .sd-meta i{font-style:normal;opacity:.6}
.sd-v2 .sd-acts{display:flex;align-items:center;gap:6px;margin-top:6px}
.sd-v2 .sd-ib{flex:none;display:inline-flex;align-items:center;gap:5px;height:36px;padding:0 10px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);color:var(--ink);font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer;user-select:none;-webkit-user-select:none}
.sd-v2 .sd-ib svg{width:18px;height:18px}
@media (hover:hover){.sd-v2 .sd-ib:hover{background:var(--press)}}
/* いいね：good_count_up_down.js が svg の fill を white / none で切り替える。白い地で見えるよう赤に置き換える
   （作り替えていない暗いページ＝.sd-dk の記事・ランキングは今までの白・オレンジのまま） */
.sd-v2:not(.sd-dk) .goodbtn svg[fill="white"]{fill:var(--ac);color:var(--ac)}
/* 後で見る：atd_count_up_down.js が文字色を style で白 / #ec8b00 にする。白い地で見えるよう上書きする */
.sd-v2:not(.sd-dk) .atdbtn{color:var(--ink)!important}
.sd-v2:not(.sd-dk) .atdbtn[data-is_atd="true"]{color:var(--ac)!important;border-color:var(--ac)}
.sd-v2:not(.sd-dk) .atdbtn[data-is_atd="true"] svg{fill:var(--acs)}
.sd-v2 .sd-buy{flex:none;margin-left:auto;display:inline-flex;align-items:center;gap:5px;height:36px;padding:0 13px;border-radius:var(--rs);background:var(--buy);color:#fff;font-size:13.5px;font-weight:600;white-space:nowrap}
@media (hover:hover){.sd-v2 .sd-buy:hover{background:var(--buyh)}}

/* ===== ページ送り ===== */
.sd-v2 .sd-pg{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:20px 8px 8px}
.sd-v2 .sd-pg li{display:block}
.sd-v2 .sd-pg li.hidden{display:none}
.sd-v2 .sd-pg a,.sd-v2 .sd-pg span{min-width:44px;height:44px;padding:0 8px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);color:var(--ink);display:grid;place-items:center;font-size:15px;font-weight:600}
.sd-v2 .sd-pg .on span{background:var(--ink);color:var(--bg);border-color:var(--ink)}
@media (hover:hover){.sd-v2 .sd-pg a:hover{background:var(--press)}}

/* ===== フッター・下のメニュー・上へ戻る ===== */
.sd-v2 .sd-ft{padding:28px 16px 28px;text-align:center;font-size:13px;color:var(--ink2)}
.sd-v2 .sd-ft nav{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 18px;margin-bottom:10px}
.sd-v2 .sd-ft nav a{color:var(--ink);font-weight:600}
.sd-v2 .sd-ft small{font-size:12px}
.sd-v2 .sd-bn{position:fixed;left:0;right:0;bottom:0;z-index:150;height:calc(var(--bn) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--bg);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr)}
.sd-v2 .sd-bn a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;font-weight:600;color:var(--ink2)}
.sd-v2 .sd-bn a svg{width:24px;height:24px}
.sd-v2 .sd-bn a.on{color:var(--ac)}
.sd-v2 .sd-bn a.on svg{fill:currentColor}
.sd-v2 .go-to-top{right:12px;bottom:calc(var(--bn) + 14px + env(safe-area-inset-bottom));width:44px;height:44px;background:rgba(29,29,31,.6);box-shadow:none;display:grid;place-items:center;z-index:140}
.sd-v2 .go-to-top svg{width:26px;height:26px;fill:#fff}
/* まだ作り替えていないページの追従メニュー（ランキング）と左のメニュー（PC）を、ヘッダーの下に出す */
.sd-v2 .header--sub.-fix{top:var(--hd);margin-top:0!important}
.sd-v2.sd-dk aside.sticky{top:calc(var(--hd) + 8px)!important}

/* ===== タブレット ===== */
@media (min-width:768px){
  /* 途中の広告は1行全部を使うので、その手前に空きマスができないよう後ろのカードで埋める（広告の位置はカード数枚ぶん後ろへずれる） */
  .sd-v2 .sd-list{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense;gap:14px;padding:4px 8px 0}
  .sd-v2 .sd-card{background:var(--bg);border:1px solid var(--line);border-radius:var(--rm);padding:0;overflow:hidden}
  .sd-v2 .sd-pin{margin:10px 12px 0}
  .sd-v2 .sd-th{border-radius:0}
  .sd-v2 .sd-cb{padding:2px 12px 12px}
}

/* ===== PC ===== */
@media (min-width:1024px){
  body.sd-v2{--hd:64px;--bn:0px;padding-bottom:0}
  .sd-v2 .sd-bn{display:none}
  .sd-v2 .go-to-top{bottom:24px;right:24px}
  .sd-v2 .sd-hd__in{padding:0 24px;gap:20px}
  .sd-v2 .sd-hd__menu,.sd-v2 .sd-hd__q{display:none}
  .sd-v2 .sd-logo{position:static;transform:none;flex:none}
  .sd-v2 .sd-lg{font-size:19px}
  /* 本番の Tailwind は .hidden が !important なので、PCで検索を常に出すには !important が要る */
  .sd-v2 .sd-sf,.sd-v2 .sd-sf.hidden{position:static;display:block!important;flex:1;max-width:440px;padding:0;border:0;background:none}
  .sd-v2 .sd-qf{height:40px}
  .sd-v2 .sd-qf input{font-size:15px}
  .sd-v2 .sd-hd__nav{display:flex;margin-left:auto;gap:4px}
  .sd-v2 .sd-hd__nav a{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:64px;padding:6px 4px;border-radius:var(--rs);color:var(--ink);font-size:11.5px;font-weight:600}
  .sd-v2 .sd-hd__nav a svg{width:22px;height:22px}
  .sd-v2 .sd-hd__nav a.on{color:var(--ac)}
  .sd-v2 .sd-hd__nav a.on svg{fill:currentColor}
  .sd-v2 .sd-hd__nav a:hover{background:var(--press)}
  .sd-v2 .sd-hm{display:none}
  .sd-v2 .sd-wrap{padding:0 24px}
  .sd-v2 .sd-tags{padding:14px 0 6px;flex-wrap:wrap;overflow:visible}
  .sd-v2 .sd-sh{padding:14px 0 4px}
  .sd-v2 .sd-sh h1,.sd-v2 .sd-sh .sd-sh__t{font-size:22px}
  .sd-v2 .sd-lead{padding:0 0 8px}
  .sd-v2 .sd-xl{margin:0 0 8px}
  .sd-v2 .sd-tabs{padding:4px 0 0;grid-template-columns:repeat(3,minmax(0,220px))}
  .sd-v2 .sd-go{margin:10px 0 0;max-width:672px}
  .sd-v2 .sd-go__s.sp{display:none}
  .sd-v2 .sd-go__s.pc{display:block}
  .sd-v2 .sd-setd{margin:6px 0 0;max-width:672px}
  .sd-v2 .sd-range{padding:12px 0 0}
  .sd-v2 .sd-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:6px 0 0;margin-top:10px}
  /* 10/22：一覧の「この動画を購入」を外したので、PCでも「後で見る」の文字を出す（今までは購入ボタンの場所を空けるため時計だけ） */
  .sd-v2 .sd-pg{padding:28px 0 8px}
}

/* ===== 記事ページ（/article/番号） ===== */
.sd-v2 .sd-art{display:block;padding-bottom:8px}
.sd-v2 .sd-artg{display:block}
.sd-v2 .sd-bc{display:flex;gap:6px;align-items:center;padding:10px 8px 4px;font-size:13px;color:var(--ink2);white-space:nowrap;overflow:hidden}
.sd-v2 .sd-bc a{color:var(--ink2);flex:none}
.sd-v2 .sd-bc b{color:var(--ink);font-weight:600;overflow:hidden;text-overflow:ellipsis;min-width:0}
.sd-v2 .sd-bc i{font-style:normal;flex:none;opacity:.6}
.sd-v2 .sd-h1{font-size:17px;line-height:1.45;font-weight:700;margin:4px 8px 10px;color:var(--ink)}
.sd-v2 .sd-h1 small{display:block;font-size:12.5px;font-weight:400;color:var(--ink2);margin-top:3px}
.sd-v2 .sd-player{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden}
.sd-v2 .sd-player #videoContainer,.sd-v2 .sd-player #videoWrapper{position:absolute;inset:0;width:100%;height:100%}
/* 最初の動画は本番のまま class に h-auto（Tailwind で !important）が付いているので、高さは !important で上書きする */
.sd-v2 .sd-player video{width:100%;height:100%!important;object-fit:contain;background:#000;display:block}
.sd-v2 .sd-ctl{display:flex;align-items:center;gap:6px;padding:8px 8px 0;flex-wrap:wrap}
.sd-v2 .sd-ctl button,.sd-v2 .sd-ctl .sd-ib{height:36px;padding:0 12px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
@media (hover:hover){.sd-v2 .sd-ctl button:hover{background:var(--press)}}
.sd-v2 .sd-rep{margin:6px 8px 0}
.sd-v2 .sd-rep summary{list-style:none;display:inline-flex;align-items:center;gap:4px;height:32px;padding:0 4px;font-size:13px;font-weight:600;color:var(--ink2);cursor:pointer}
.sd-v2 .sd-rep summary::-webkit-details-marker{display:none}
.sd-v2 .sd-rep summary svg{width:18px;height:18px}
.sd-v2 .sd-rep[open] summary{color:var(--ink)}
.sd-v2 .sd-rep__in{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px;padding:12px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line);font-size:13px;color:var(--ink2)}
.sd-v2 .sd-rep__in button{height:34px;padding:0 10px;border-radius:var(--rs);border:1px solid var(--line);background:var(--face);color:var(--ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.sd-v2 .sd-rep__in input{width:56px;height:34px;border-radius:6px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:14px;padding:0 6px;text-align:right}
.sd-v2 .sd-rep__in span.hidden{display:none}
.sd-v2 .sd-rep__in span{display:inline-flex;align-items:center;gap:4px}
.sd-v2 .sd-sec{margin-top:16px}
.sd-v2 .sd-sec--sc{margin-top:12px}
.sd-v2 .sd-sec>h2,.sd-v2 .sd-sec>.sd-sec__t{display:flex;align-items:baseline;gap:8px;font-size:16px;font-weight:600;margin:0 8px 8px;color:var(--ink)}
.sd-v2 .sd-sec>h2 small,.sd-v2 .sd-sec>.sd-sec__t small{font-size:12.5px;color:var(--ink2);font-weight:400}
.sd-v2 .sd-scenes{display:flex;gap:8px;overflow-x:auto;padding:0 8px 4px;scrollbar-width:none}
.sd-v2 .sd-scenes::-webkit-scrollbar{display:none}
.sd-v2 .related-post{flex:none;width:150px;cursor:pointer;min-width:0}
.sd-v2 .related-post img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--rs);background:#000;border:2px solid transparent;box-sizing:border-box}
/* 選んでいるシーン：switch_video.js が img の style に border を入れる。色だけ赤に */
.sd-v2 .related-post img[style*="border"]{border-color:var(--ac)!important}
.sd-v2 .related-post span{display:block;font-size:12px;line-height:1.4;margin:4px 0 0;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-v2 .sd-arow{display:flex;align-items:center;gap:6px;padding:10px 8px 0;flex-wrap:wrap}
.sd-v2 .sd-arow .sd-ago{font-size:12.5px;color:var(--ink2);margin-left:2px}
.sd-v2 .sd-arow .sd-x{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.sd-v2 .sd-arow .sd-x svg{width:18px;height:18px;fill:currentColor}
.sd-v2 .sd-bigbuy{display:flex;align-items:center;justify-content:center;gap:6px;height:50px;margin:12px 8px 0;border-radius:var(--rs);background:var(--buy);color:#fff;font-size:16px;font-weight:600}
@media (hover:hover){.sd-v2 .sd-bigbuy:hover{background:var(--buyh)}}
.sd-v2 .sd-kw{display:flex;flex-wrap:wrap;gap:8px;padding:0 8px}
.sd-v2 .sd-kw a{height:32px;display:inline-flex;align-items:center;padding:0 12px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line);font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap}
.sd-v2 .sd-kw a.sd-kw--a{background:var(--acs);border-color:var(--acs);color:var(--acl)}
@media (hover:hover){.sd-v2 .sd-kw a:hover{background:var(--press)}}
.sd-v2 .sd-prod{margin:16px 8px 0;padding:14px 12px 16px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line)}
.sd-v2 .sd-prod h2{font-size:15px;line-height:1.5;font-weight:600;margin:0 0 10px;color:var(--ink)}
.sd-v2 .sd-prod h3{font-size:13px;font-weight:600;margin:14px 0 8px;color:var(--ink2)}
.sd-v2 .sd-prod p{font-size:14.5px;line-height:1.75;margin:10px 0 0;color:var(--ink)}
.sd-v2 .sd-prod .sd-pl{display:block;margin:0 0 12px}
.sd-v2 .sd-prod .sd-pl img{width:100%;height:auto;border-radius:var(--rs);display:block}
.sd-v2 .sd-prod .sd-bigbuy{margin:14px 0 0}
.sd-v2 .sd-prod #sample_movie{background:#000;border-radius:var(--rs);overflow:hidden;margin:0 0 12px}
.sd-v2 .sd-prod #sample_movie video{display:block;width:100%;aspect-ratio:16/9}
.sd-v2 .sd-sale{display:flex;align-items:center;gap:10px;margin:0 0 12px}
.sd-v2 .sd-sale .sd-sale__tag{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:6px;background:#CC0D39;color:#fff;font-size:13px;font-weight:600}
.sd-v2 .sd-sale .sale-percentage{font-size:24px;font-weight:700;color:#EC1717}
.sd-v2 .sd-salei{margin:0 0 12px;border-radius:var(--rs);border:1px solid var(--line);overflow:hidden;font-size:13.5px}
.sd-v2 .sd-salei .sd-salei__h{background:#E1400F;color:#fff;text-align:center;padding:6px;font-weight:600}
.sd-v2 .sd-salei .sd-salei__r{padding:8px 10px;border-top:1px solid var(--line)}
.sd-v2 .sd-salei .sd-salei__r b{display:block;font-size:12.5px;color:var(--ink2);font-weight:600;margin-bottom:2px}
.sd-v2 .sd-salei s{color:var(--ink2)}
.sd-v2 .sd-salei em{font-style:normal;margin-left:6px;padding:1px 6px;border-radius:4px;background:#E1400F;color:#fff;font-size:12px;font-weight:600}
.sd-v2 .sd-ctl .sd-buy--sp{margin-left:auto}
.sd-v2 .sd-more{display:flex;align-items:center;justify-content:center;gap:4px;height:44px;margin:12px 8px 0;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);font-size:14px;font-weight:600;color:var(--ink)}
@media (hover:hover){.sd-v2 .sd-more:hover{background:var(--press)}}
/* 記事の並び（10/24 運営「右サイドバーは売上が減ることがわかっている。出演・シリーズ・タグの前に FANZA の紹介をメインで」）：
   スマホもPCも1列。上の部分 → 商品情報（sd-prod）→ 出演・シリーズ・タグ → 関連動画 → 連続再生の入口・別シーン一覧（sd-tail）。
   10/22〜10/24 の記事テンプレート（aside.sd-side.sd-side--tail の中に 入口・商品情報・別シーン一覧）と組み合わさっても1列になり、
   入口と別シーン一覧は sd-tail の分だけが見える（上げる順がずれても入口が消えず、2つにもならない） */
.sd-v2 .sd-tail .sd-go{margin:12px 8px 0}
.sd-v2 .sd-side--tail>.sd-go,.sd-v2 .sd-side--tail>.sd-more{display:none}

@media (min-width:1024px){
  /* PC：本番の記事と同じく1列を真ん中に寄せる。幅 880px（本番の別シーンの列 760px より少し広く、16:9 の動画が 495px の高さ） */
  .sd-v2 .sd-artg{max-width:880px;margin:0 auto;padding-top:8px}
  .sd-v2 .sd-bc,.sd-v2 .sd-h1,.sd-v2 .sd-arow,.sd-v2 .sd-sec>h2,.sd-v2 .sd-sec>.sd-sec__t,.sd-v2 .sd-kw,.sd-v2 .sd-scenes,.sd-v2 .sd-ctl,.sd-v2 .sd-rep{padding-left:0;padding-right:0;margin-left:0;margin-right:0}
  .sd-v2 .sd-h1{font-size:22px}
  .sd-v2 .sd-player{border-radius:var(--rm)}
  .sd-v2 .related-post{width:184px}
  .sd-v2 .sd-bigbuy{margin-left:0;margin-right:0}
  .sd-v2 .sd-tail .sd-go{margin:20px 0 0;max-width:none}
  .sd-v2 .sd-more{margin:12px 0 0}
  .sd-v2 .sd-ctl .sd-buy--sp{display:none}
  .sd-v2 .sd-art .sd-adw{margin:8px 0}
  /* 商品情報（FANZA の紹介）を本文の主役に：枠を広く・題名と購入ボタンを大きく */
  .sd-v2 .sd-prod{margin:20px 0 0;padding:18px 22px 22px}
  .sd-v2 .sd-prod h2{font-size:18px}
  .sd-v2 .sd-prod .sd-bigbuy{height:56px;font-size:17px}
  /* 商品の画像があるとき：サンプル動画までは幅いっぱい。その下で 画像（左 320px）と 題名・セール・購入・説明（右）を横に並べる。
     商品の画像は素人ものだと 300×300 なので、幅いっぱいに広げず 320px にとどめる。
     行は 1 商品情報 / 2 「サンプル動画」の文字 / 3 サンプル動画 / 4 題名 / 5 セールの札 / 6 セールの値段 / 7 購入 / 8 説明 / 9 余り。
     セールの札と値段は sale_info.js が出すまで .hidden（display:none）なので、その行は高さ0になる */
  .sd-v2 .sd-prod--pl{display:grid;grid-template-columns:320px minmax(0,1fr);grid-template-rows:repeat(8,auto) 1fr;column-gap:24px;align-items:start}
  .sd-v2 .sd-prod--pl>*{grid-column:1 / -1}
  .sd-v2 .sd-prod--pl>h3{grid-row:1}
  .sd-v2 .sd-prod--pl>h3+div:not(#sample_movie){grid-row:2}
  /* サンプル動画の部品（本番の components/sample_movie）は class に my-2 があり、Tailwind の important で !important になるので、こちらも !important */
  .sd-v2 .sd-prod--pl>#sample_movie{grid-row:3;margin-bottom:16px!important}
  .sd-v2 .sd-prod--pl>.sd-pl{grid-column:1;grid-row:4 / span 6;margin:0}
  .sd-v2 .sd-prod--pl>h2{grid-column:2;grid-row:4}
  .sd-v2 .sd-prod--pl>#saleLabel{grid-column:2;grid-row:5}
  .sd-v2 .sd-prod--pl>#saleInfo{grid-column:2;grid-row:6}
  .sd-v2 .sd-prod--pl>.sd-bigbuy{grid-column:2;grid-row:7;margin:6px 0 0}
  .sd-v2 .sd-prod--pl>p{grid-column:2;grid-row:8;margin:14px 0 0}
  /* 上げる間のつなぎ：CSS が先に届き、記事テンプレートがまだ 10/22〜10/24 の形（aside の中の sd-prod・sd-prod--pl なし）のとき、
     商品の画像が1列の幅いっぱい（約834px）に伸びないよう 320px にとどめる。新しい記事テンプレートだけになったら消してよい */
  .sd-v2 .sd-side--tail .sd-prod .sd-pl img{max-width:320px}
}

/* ===== ジャンル・女優・説明のページ ===== */
.sd-v2 .sd-ph{padding:14px 8px 4px}
.sd-v2 .sd-ph h1{font-size:17px;font-weight:700;line-height:1.4;margin:0;color:var(--ink)}
.sd-v2 .sd-ph small{display:block;font-size:13px;line-height:1.55;color:var(--ink2);margin-top:3px}
.sd-v2 .sd-gh{font-size:16px;font-weight:600;margin:18px 8px 8px;color:var(--ink)}
.sd-v2 .sd-gg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0 8px;list-style:none;margin:0}
.sd-v2 .sd-gg a{min-height:46px;display:flex;align-items:center;padding:8px 14px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line);font-size:15px;font-weight:600;color:var(--ink);line-height:1.3}
@media (hover:hover){.sd-v2 .sd-gg a:hover{background:var(--press)}}
.sd-v2 .sd-ag{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 8px;padding:12px 8px 0;list-style:none;margin:0}
.sd-v2 .sd-ag li{min-width:0;padding:0}
.sd-v2 .sd-ag a{display:block;color:var(--ink)}
.sd-v2 .sd-ag .im{position:relative;aspect-ratio:1;border-radius:var(--rm);overflow:hidden;background:var(--press)}
.sd-v2 .sd-ag img{width:100%;height:100%;object-fit:cover;display:block}
.sd-v2 .sd-ag .rk{position:absolute;left:6px;top:6px;min-width:24px;height:24px;padding:0 6px;border-radius:6px;background:rgba(17,24,39,.78);color:#fff;font-size:12.5px;font-weight:600;display:grid;place-items:center}
.sd-v2 .sd-ag p{font-size:13.5px;font-weight:600;margin:6px 0 0;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-v2 .sd-ag small{display:block;font-size:12px;color:var(--ink2);text-align:center}
/* うろ覚え検索：#results の中は actress_search.js が作る（Tailwind の印つき） */
.sd-v2 .sd-ag--js .act_link{display:flex!important;flex-direction:column;align-items:stretch!important;color:var(--ink)}
.sd-v2 .sd-ag--js .act_thumb{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--rm);background:var(--press)!important}
.sd-v2 .sd-ag--js .act_name{font-size:13.5px;font-weight:600;margin-top:6px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-v2 .sd-ag--js .act_post_count{font-size:12px;color:var(--ink2);text-align:center}
.sd-v2 .sd-ag--js li[class*="col-span"]{grid-column:1/-1!important;color:var(--ink2);text-align:center}
.sd-v2 .sd-asq{padding:12px 8px 0}
.sd-v2 .sd-asq input#df_actress_lists_text{width:100%;height:46px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:16px;padding:0 12px;outline:0}
.sd-v2 .sd-asq input#df_actress_lists_text:focus{border-color:var(--ink2)}
.sd-v2 .sd-asq__mode{display:flex;gap:16px;margin:10px 0 0;font-size:14px;color:var(--ink)}
.sd-v2 .sd-asq__mode label{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.sd-v2 .sd-asq__mode input{accent-color:var(--ac);width:18px;height:18px}
.sd-v2 .sd-asq__msg{min-height:20px;margin-top:6px;font-size:13px;color:var(--ink2)}
/* あいうえお順の50音 */
.sd-v2 .sd-kana{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding:12px 8px 0}
.sd-v2 .sd-kana__row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.sd-v2 .sd-kana a{height:40px;display:grid;place-items:center;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);font-size:16px;font-weight:600;color:var(--ink)}
.sd-v2 .sd-kana a.on{background:var(--ac);border-color:var(--ac);color:#fff}
@media (hover:hover){.sd-v2 .sd-kana a:not(.on):hover{background:var(--press)}}
.sd-v2 .sd-doc{margin:8px 8px 0;padding:4px 14px 14px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line)}
.sd-v2 .sd-doc ul{margin:0;padding-left:1.3em;font-size:14.5px;line-height:1.8;color:var(--ink);list-style:disc}
.sd-v2 .sd-doc li{padding:8px 0;border-bottom:1px solid var(--line)}
.sd-v2 .sd-doc li:last-child{border-bottom:0}
.sd-v2 .sd-doc img{display:block;width:100%;max-width:460px;height:auto;margin:8px auto 0;border-radius:var(--rs);border:1px solid var(--line)}
/* 女優の3つの切り替え：tracking_menu.js が下へ動かすと -fix を付ける（app.css では fixed・top:24px）。ずれないよう、いつも画面の上に貼り付く形にする */
.sd-v2 .sd-tabs.header--sub{position:sticky;top:var(--hd);z-index:100;background:var(--face);padding-top:8px;padding-bottom:8px}
.sd-v2 .sd-tabs.header--sub.-fix{position:sticky;top:var(--hd);height:auto;margin-top:0!important}

@media (min-width:1024px){
  .sd-v2 .sd-ph{padding:18px 0 6px}
  .sd-v2 .sd-ph h1{font-size:22px}
  .sd-v2 .sd-gh{margin:22px 0 10px}
  .sd-v2 .sd-gg{grid-template-columns:repeat(6,minmax(0,1fr));padding:0}
  .sd-v2 .sd-ag{grid-template-columns:repeat(8,minmax(0,1fr));gap:16px 12px;padding:14px 0 0}
  .sd-v2 .sd-asq{padding:12px 0 0;max-width:672px}
  .sd-v2 .sd-kana{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px 16px;padding:12px 0 0}
  .sd-v2 .sd-doc{margin:8px 0 0;max-width:880px}
}

/* ===== MAVから取り込んだ動き（public/js/sad-v2.js・2026-10-22） ===== */
/* 連続再生から一覧に戻ったら、見ていたカードを2秒光らせる */
.sd-v2 .sd-card.sd-glow{box-shadow:0 0 0 3px var(--ac);transition:box-shadow .4s}
.sd-v2 .sd-card{transition:box-shadow .6s}
/* 記事の下の関連動画 */
/* 空のあいだも消さない（display:none だと画面に入ったことを検知できず、読み込みが始まらない） */
.sd-v2 #sd-rel{min-height:1px}
.sd-v2 .sd-rel__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 8px;padding:0 8px}
.sd-v2 .sd-rc{display:block;min-width:0;color:var(--ink)}
.sd-v2 .sd-rc .im{position:relative;aspect-ratio:16/9;border-radius:var(--rs);overflow:hidden;background:#000}
.sd-v2 .sd-rc img{width:100%;height:100%;object-fit:cover;display:block}
.sd-v2 .sd-rc__s{position:absolute;left:6px;bottom:6px;height:20px;padding:0 6px;border-radius:5px;background:rgba(0,0,0,.66);color:#fff;font-size:11px;font-weight:600;line-height:20px}
.sd-v2 .sd-rc p{margin:6px 0 0;font-size:13.5px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sd-v2 .sd-rc small{display:block;margin-top:2px;font-size:12px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover:hover){.sd-v2 .sd-rc:hover p{text-decoration:underline}}
.sd-v2 .sd-rel__row{display:flex;gap:8px;padding:10px 8px 0}
.sd-v2 .sd-rel__more,.sd-v2 .sd-rel__go{flex:1;display:flex;align-items:center;justify-content:center;height:40px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);color:var(--ink);font-size:13.5px;font-weight:600;white-space:nowrap}
.sd-v2 .sd-rel__go{border-color:var(--acs);background:var(--acs);color:var(--acl)}
@media (hover:hover){.sd-v2 .sd-rel__more:hover{background:var(--press)}}
/* 検索した語が女優名のときの札 */
.sd-v2 #sd-actcard:empty{display:none}
.sd-v2 .sd-acard{display:flex;align-items:center;gap:12px;margin:4px 8px 8px;padding:10px 12px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line)}
.sd-v2 .sd-acard img{flex:none;width:56px;height:56px;border-radius:50%;object-fit:cover;background:var(--press)}
.sd-v2 .sd-acard__tx{min-width:0;flex:1}
.sd-v2 .sd-acard__tx b{display:block;font-size:16px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-v2 .sd-acard__tx small{font-size:12.5px;color:var(--ink2)}
.sd-v2 .sd-acard__go{flex:none;height:38px;padding:0 12px;border-radius:var(--rs);background:var(--acs);color:var(--acl);font-size:13px;font-weight:700;display:flex;align-items:center;white-space:nowrap}
/* 女優の一覧：この女優で連続再生（写真の右下の丸いボタン） */
.sd-v2 .sd-ag li{position:relative}
.sd-v2 .sd-ag__play{position:absolute;right:6px;top:6px;width:32px;height:32px;border-radius:50%;z-index:2;background-color:rgba(0,0,0,.62);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 5.5v13l10-6.5z' fill='%23fff'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:55% 50%;background-size:18px 18px}
@media (hover:hover){.sd-v2 .sd-ag__play:hover{background-color:var(--ac)}}

@media (min-width:1024px){
  .sd-v2 .sd-rel__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 12px;padding:0}
  .sd-v2 .sd-rel__row{padding:12px 0 0;max-width:520px}
  .sd-v2 .sd-acard{margin:4px 0 10px;max-width:672px}
}

/* ===== MAVから取り込んだ動き その2（2026-10-22） ===== */
/* 検索の一覧：この検索を保存／女優名の検索で出演1人の作品に「主演」 */
.sd-v2 .sd-sh .sd-save{margin-left:auto;align-self:center;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.sd-v2 .sd-sh .sd-save.on{border-color:var(--ac);color:var(--ac)}
.sd-v2 .sd-shuen{flex:none;height:18px;padding:0 6px;border-radius:4px;background:var(--acs);color:var(--acl);font-size:11px;font-weight:700;line-height:18px}
/* 一覧に動画が無いときの連続再生の入口（押せない） */
.sd-v2 .sd-go.is-off{opacity:.55;box-shadow:none;cursor:default}
.sd-v2 .sd-go.is-off .sd-go__ic{background:var(--press);color:var(--ink2)}
/* ヘッダーの検索欄の下：保存した検索・うろ覚え検索の案内（スマホだけ） */
.sd-v2 .sd-saved:empty{display:none}
.sd-v2 .sd-saved{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px}
.sd-v2 .sd-saved__t{font-size:12px;color:var(--ink2);margin-right:2px}
.sd-v2 .sd-saved a{height:28px;display:inline-flex;align-items:center;padding:0 10px;border-radius:999px;border:1px solid var(--line);background:var(--bg);font-size:12.5px;font-weight:600;color:var(--ink)}
.sd-v2 .sd-sf__hint{margin:8px 2px 0;font-size:12.5px;color:var(--ink2)}
.sd-v2 .sd-sf__hint a{color:var(--ink);font-weight:600;text-decoration:underline}
/* 女優：ほかの探し方・ページを選んで移る */
.sd-v2 .sd-ways{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding:0 8px}
.sd-v2 .sd-way{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line);color:var(--ink)}
.sd-v2 .sd-way b{font-size:15px;font-weight:600}
.sd-v2 .sd-way small{font-size:12.5px;color:var(--ink2)}
@media (hover:hover){.sd-v2 .sd-way:hover{background:var(--press)}}
.sd-v2 .sd-jump{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px 8px 0;font-size:13px;color:var(--ink2)}
.sd-v2 .sd-jump select{height:38px;padding:0 10px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:14px}
/* 視聴履歴のページ */
.sd-v2 .sd-hist-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sd-v2 .sd-hist-head .sd-gh{flex:1;min-width:6em}
.sd-v2 .sd-hist-sw{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ink);cursor:pointer}
.sd-v2 .sd-hist-sw input{accent-color:var(--ac);width:18px;height:18px}
.sd-v2 .sd-hist-clear{height:32px;margin-right:8px;padding:0 12px;border-radius:var(--rs);border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.sd-v2 .sd-wchip{display:inline-flex;align-items:center;height:32px;border-radius:var(--rm);border:1px solid var(--line);background:var(--bg);overflow:hidden}
.sd-v2 .sd-wchip a{padding:0 4px 0 12px;font-size:13.5px;font-weight:600;color:var(--ink);border:0!important;height:auto!important;background:none!important}
.sd-v2 .sd-wchip button{width:30px;height:30px;border:0;background:none;color:var(--ink2);font-size:15px;cursor:pointer}
/* いいね・後で見るを押したときの知らせ・下のメニューのアイコンが1回光る */
#sd-toast{position:fixed;left:50%;bottom:calc(72px + env(safe-area-inset-bottom));transform:translate(-50%,12px);z-index:10050;max-width:min(92vw,520px);padding:10px 14px;border-radius:10px;background:#1D1D1F;color:#fff;font-size:13px;font-weight:600;line-height:1.5;text-align:center;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;font-family:system-ui,"Hiragino Sans","Noto Sans JP",sans-serif}
#sd-toast.on{opacity:1;transform:translate(-50%,0)}
.sd-v2 .sd-pulse svg{animation:sd-pulse .9s ease-out 1}
@keyframes sd-pulse{0%{transform:scale(1)}30%{transform:scale(1.35);color:var(--ac)}100%{transform:scale(1)}}
/* うろ覚え検索：100人で打ち切ったときの案内 */
.sd-v2 .sd-asq__cap{margin:8px 8px 0;padding:8px 12px;border-radius:var(--rs);background:var(--acs);color:var(--acl);font-size:13px;font-weight:600}
/* ジャンルの目次（押すとその見出しへ・画面の上に貼り付く） */
.sd-v2 .sd-toc{position:sticky;top:var(--hd);z-index:100;display:flex;gap:6px;overflow-x:auto;padding:8px;background:var(--face);scrollbar-width:none}
.sd-v2 .sd-toc::-webkit-scrollbar{display:none}
.sd-v2 .sd-toc a{flex:none;height:34px;display:inline-flex;align-items:center;padding:0 12px;border-radius:var(--rm);border:1px solid var(--line);background:var(--bg);font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap}
.sd-v2 .sd-toc a.on{background:var(--ac);border-color:var(--ac);color:#fff}
.sd-v2 .sd-gsec{scroll-margin-top:calc(var(--hd) + 56px)}
/* 記事の下の人気の動画：急上昇／人気のタブ */
.sd-v2 .sd-rel__tabs{display:flex;gap:6px;padding:0 8px 10px}
.sd-v2 .sd-rel__tab{height:32px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--ink2);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.sd-v2 .sd-rel__tab.on{background:var(--ac);border-color:var(--ac);color:#fff}

@media (min-width:1024px){
  .sd-v2 .sd-saved,.sd-v2 .sd-sf__hint{display:none}
  .sd-v2 .sd-ways{grid-template-columns:repeat(2,minmax(0,1fr));padding:0;max-width:880px}
  .sd-v2 .sd-jump{justify-content:flex-start;padding:16px 0 0}
  .sd-v2 .sd-asq__cap{margin:8px 0 0;max-width:672px}
  .sd-v2 .sd-toc{padding:8px 0}
  .sd-v2 .sd-rel__tabs{padding:0 0 10px}
  #sd-toast{bottom:32px}
}
@media (orientation:landscape) and (max-height:520px){
  .sd-v2 .sd-toc{top:0}
}

/* ===== 一覧の1作品1枚（画面側の仮の形）・いいね/後で見るのページ（2026-10-22） ===== */
.sd-v2 .sd-card.sd-dup{display:none!important}
.sd-v2 .sd-scb{position:absolute;left:8px;bottom:8px;z-index:3;display:inline-flex;align-items:center;height:26px;padding:0 9px;border-radius:6px;background:rgba(0,0,0,.66);color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.02em}
.sd-v2 .sd-range__n{display:block;margin-top:2px;font-size:12px;color:var(--ink2)}
.sd-v2 .sd-ml{margin-top:4px}
.sd-v2 .sd-ml__bar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:8px 8px 0;font-size:12.5px;color:var(--ink2)}
.sd-v2 .sd-ml__seg{margin:0;gap:6px}
.sd-v2 .sd-ml__seg button{height:32px;min-width:0;padding:0 10px;font-size:13px}
.sd-v2 .sd-ml__empty{margin:16px 8px 0;padding:14px;border-radius:var(--rm);background:var(--bg);border:1px solid var(--line);font-size:14px;line-height:1.7;color:var(--ink)}
.sd-v2 .sd-ml__empty a{color:var(--ink);font-weight:600;text-decoration:underline}
.sd-v2 .sd-ml .sd-go{margin:10px 8px 0}
.sd-v2 .sd-ml__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 8px;padding:12px 8px 0}
.sd-v2 .sd-mlc{padding:0;border-bottom:0;min-width:0}
.sd-v2 .sd-mlc .sd-th{display:block;background:var(--press)}
.sd-v2 .sd-mlc .sd-th img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sd-v2 .sd-mlc .sd-ti{font-size:14px;margin:8px 0 2px}
.sd-v2 .sd-mlc .sd-acts{gap:6px;flex-wrap:wrap}
.sd-v2 .sd-mlc .sd-ib{height:32px;padding:0 10px;font-size:12.5px}
.sd-v2 .sd-ib--off{color:var(--ink2)}
.sd-v2 .sd-ml .sd-pg{padding-top:16px}

@media (min-width:1024px){
  .sd-v2 .sd-ml__bar{padding:8px 0 0}
  .sd-v2 .sd-ml .sd-go{margin:10px 0 0;max-width:672px}
  .sd-v2 .sd-ml__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:12px 0 0}
  .sd-v2 .sd-ml__empty{margin:16px 0 0;max-width:672px}
}

/* スマホを横にしたとき（高さが足りない）はヘッダーを流す */
@media (orientation:landscape) and (max-height:520px){
  .sd-v2 .sd-hd{position:relative}
  .sd-v2 .sd-tabs.header--sub,.sd-v2 .sd-tabs.header--sub.-fix{top:0}
}
