/* ============================================================
   トップページの配色（VIBE MAKER デザインシステム 2026-10-27 改訂に合わせる）
   正本：https://claude.ai/artifact/VahmBBm7NgMV3wmMWYLXNj （黒背景なし・赤1色）
   lp.css は /tanren/ など他のページとも共有しているので、トップだけこのファイルで上書きする
   1. 面を黒で塗るセクション・暗色テーマをなくす
   2. 赤は #c5171e の 1 色だけ（濃い赤・明るい赤・別の赤を使わない）
   色・書体・角・影のほかの決まりは、もとのデザインシステムのまま。
   ============================================================ */
:root, :root[data-theme="light"], :root[data-theme="dark"]{
  color-scheme:light;
  /* もとの Paper の値に固定（暗色テーマなし） */
  --bg:#f4f3ef; --paper:#f4f3ef; --paper-2:#ebeae6;
  --surface:#ffffff; --surface-2:#ebeae6; --surface-3:#e2e0d9; --stage:#e2e0d9;
  --line:#d8d6d0; --line-strong:#aaaaaa;
  --text:#090a0d; --text-2:#4f5057; --text-muted:#666870;
  --ink:#090a0d;              /* 黒は文字・枠・ボタン・硬い影だけに使う */
  --ink-2:#ffffff; --ink-3:#ebeae6;
  --text-inv:#ffffff; --text-inv-2:#ffffff; --text-inv-muted:#ffffff;
  --line-inv:rgba(255,255,255,.4); --line-inv-weak:rgba(255,255,255,.25);
  /* 赤は 1 色 */
  --brand:#c5171e; --brand-fill:#c5171e; --brand-ink:#ffffff;
  --brand-deep:#c5171e; --brand-soft:#c5171e; --negative:#c5171e; --type-lecture:#c5171e;
  --brand-weak:rgba(197,23,30,.10);
  --positive:#1d4ed8; --positive-weak:rgba(29,78,216,.12);
  --type-skill:#7c3aed; --type-sop:#0891b2; --type-asset:#b45309; --type-corpus:#4338ca; --type-inside:#090a0d;
  --shadow-pop:8px 8px 0 #1c1c20; --shadow-pop-hover:6px 6px 0 #1c1c20;
  --shadow-pop-inv:8px 8px 0 #090a0d;
  --paper-shadow:4px 4px 0 rgba(9,10,13,.08); --paper-shadow-hover:6px 6px 0 rgba(9,10,13,.14);
}

/* ---- 黒で塗っていたセクションを、明るい面に置き換える ---- */
/* 中の文字・線の変数を墨に切り替える */
.plans,.loginBlock,.weapons,.levelPanel,.flow div.active{
  --text-inv:#090a0d; --text-inv-2:#4f5057; --text-inv-muted:#666870;
  --line-inv:#aaaaaa; --line-inv-weak:#d8d6d0;
}
.plans{background:var(--surface-2);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.archive{background:var(--surface-2)}
.planCard{background:var(--surface);border:1px solid var(--ink)}
.planCard.featured{box-shadow:var(--shadow-pop);border-top:4px solid var(--brand)}
.price{border-color:var(--line)}
.ghostDark{border-color:var(--ink);color:var(--ink)}
.planCaveat,.includesNote{border-left-color:var(--line-strong)}
.plans .primary,.loginBlock .primary,.plans .ribbon{color:#ffffff!important}
.archivePick,.archiveDeckFrame,.archiveTiles .tPick{background:var(--surface)}
.archiveDeckFrame{box-shadow:var(--shadow-pop)}
.uiShots img,.uiOverview img{border-color:var(--line-strong)}
.weapons,.levelPanel{background:var(--surface);border:2px solid var(--ink)}
.flow div.active{background:var(--surface);border:2px solid var(--ink)}
.level{border-left-color:var(--line)}
.level b{color:var(--text-muted)}

/* 受講生ログインの箱：白い面＋黒い枠＋硬い影 */
.loginBlock{background:var(--surface);border:2px solid var(--ink);box-shadow:var(--shadow-pop)}

/* 流れるテーマの帯：黒をやめて赤（ブランドの赤 1 色） */
.ticker{background:var(--brand);color:#ffffff}
.ticker i{background:#ffffff}

/* 写真の上の札：黒い地をやめて白い札に */
.hud{background:rgba(255,255,255,.94);color:var(--text);border-left:3px solid var(--brand);backdrop-filter:none}
.hud b,.hud span,.hudBottom strong{color:var(--text)}
.hud b{color:var(--brand)}

/* 赤い帯の上の文字は白（もとはピンクがかった色） */
.finalCta p{color:#ffffff}
.light{color:#ffffff}
.principles p{color:#ffffff}

/* フォーム：別の濃い赤（#8B0000・#96070d）をブランドの赤に */
.vmForm__req{background:var(--brand);color:#ffffff}
.vmForm input:focus,.vmForm textarea:focus{outline-color:var(--brand);border-color:var(--brand)}
.vmForm__submit,.vmForm__submit:hover{background:var(--brand);color:#ffffff}
.newsletter .vmForm__submit,.newsletter .vmForm__submit:hover{background:var(--brand)}
.newsletter .vmForm__consent input{accent-color:var(--brand)}
.newsletter .vmForm__consent a{color:var(--brand)}
.newsletter .vmForm{color:var(--text);border-color:var(--ink)}
.newsletter .vmForm__consent{color:var(--text-2)}
.archivePickHero img{box-shadow:8px 8px 0 #090a0d}
.plans .label,.plans .label.light,.loginBlock .label{color:var(--brand)}
.manifesto .secNo,.onDark .secNo{color:#ffffff}

/* 6日間の進行バー：赤を薄めた色（別の赤に見える）をやめ、最初の段だけ赤、残りは黒の濃淡に */
.roadmap span{background:var(--text);opacity:1}
.roadmap span:nth-child(1){background:var(--brand)}
.roadmap span:nth-child(2){opacity:.8}
.roadmap span:nth-child(3){opacity:.55}
.roadmap span:nth-child(4){opacity:.3}

/* お問い合わせのフォーム：角丸とぼかし影をやめる（デザインシステムの決まり） */
.finalCta .vmForm{border-radius:0;box-shadow:8px 8px 0 var(--ink);border:1px solid var(--ink)}
.vmForm input,.vmForm textarea,.vmForm select,.vmForm__submit{border-radius:0}