/* =========================================================================
   案3 ライムは信号だけ（2026-09-26 ユーザー承認）
   「クールなのに、急にこの黄緑出てるの嫌いやな」を受けた配色の上書き。
   style.css / motif.css / type.css の後に読み込み、色だけを差し替える（形・動きは変えない）。

   黒 #0A0A0A（地）／チャコール #1A1B1E（面）／紙 #F2EFE8（地・主役の文字）／グレー #8C8F96（補足・弱い見出し）
   ライム #B9FF29 ＝ 信号だけ：小さな点・3px以下の細い線・カーソルの輪・進行線・フォーカス枠・テキスト選択。
     大きな文字・色の面・ボタンの塗り・文字そのものの色には使わない。強調は白黒反転・明るさ（グレー⇔紙）・太さで。
     紙の地の上ではライムが見えないので、紙の上の線は黒にする（または黒の縁取りの上に置く）。
   青・赤は UI で使わない（写真の中の光は写真のまま）。赤は予備として定義だけ残す。
   ========================================================================= */

:root {
  --charcoal: #1A1B1E;
  --gray: #8C8F96;
  --red: #E5332A; /* 予備。UIでは未使用 */
}

/* ---------- 共通（選択・フォーカスはライムのまま。紙の地の上だけ黒い枠） ---------- */
.paper :focus-visible { outline-color: var(--black); }
.skip { background: var(--paper); color: var(--black); }

/* ボタン：紙の塗り＋黒文字＋下端にライムの3px線。ホバーで黒地・紙文字（斜めに差し込む動きは既存のまま）
   ※ クラス名 btn--lime は既存HTMLとの互換のため据え置き */
.btn--lime { background: var(--paper); color: var(--black); }
.btn--lime::after { background: var(--black); transform-origin: left top; } /* 中心基準の斜めだと左上に三角の隙間が残り、白黒だと目立つため上端基準に */
.btn--lime:hover { color: var(--paper); }
/* 黒い面が差し込む速さと、文字色が変わる速さをそろえる（途中で紙色の文字が紙の地に消えないように） */
.btn--lime { transition: color 0.45s var(--ease-cut); }
.btn--lime::before {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
  background: var(--lime); pointer-events: none;
}

/* 丸矢印リンク：紙の文字と輪。ホバーで紙の塗り */
.circle-link { color: var(--paper); }
.circle-link:hover .circle-link__icon { background: var(--paper); color: var(--black); }

/* メニュー：文字は紙。ホバーは明るさの差、ENTRY は前にライムの点 */
.drawer a:hover { color: var(--gray); }
.drawer__entry { color: var(--paper); }
.drawer__entry::before {
  content: ''; display: inline-block; width: 12px; height: 12px; border-radius: 50%;
  background: var(--lime); margin-right: 0.22em; vertical-align: middle;
}

/* カーソルの輪：反転合成だと紙の上で青紫に化けるため通常合成に。紙の上でも見えるよう外側に黒の髪線 */
.cursor { mix-blend-mode: normal; box-shadow: 0 0 0 1px var(--black); }

/* 版ズレ（青の影）は使わない */
.misreg { text-shadow: none; }

/* =========================================================================
   HERO
   ========================================================================= */
.hero__typeInner { text-shadow: none; }
.hero__eyebrow { color: var(--paper); }
.hero__eyebrow .ln > span::before {
  content: ''; display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  background: var(--lime); margin-right: 12px; vertical-align: middle; transform: translateY(-1px);
}
/* 欄外の単語：ふだんはグレー、現在地だけ紙＋ライムの短い線（::before は既存） */
.hero__words { color: var(--gray); }
.hero__words li.is-on { color: var(--paper); }
/* イントロの一閃：ライムの細い線だけ（半透明の尾は消す。要素の位置・動きは既存のまま） */
.hero__edge { background: linear-gradient(90deg, transparent calc(100% - 3px), var(--lime) 0); }

/* =========================================================================
   MISSION：EVOLVE. は黒の色面＋紙色の文字（白黒反転）
   ========================================================================= */
.mission__hl { background: var(--black); }
.mission__title em { color: var(--paper); }
/* 文字を紙色に反転したので、色面は字面（キャップ上端〜ベースライン）を上下左右とも約0.07emの余白で包む。
   旧ライムの帯は字面より上下5pxほど小さく、反転すると字の上下が紙に溶け、左の余白が「I」に見えたため */
.mission__hl { inset: 0.035em 0 -0.045em 0; }
/* 文字が紙色になったので、JSが無い時も色面を出しておく（出ないと紙の上で文字が消える） */
html:not(.js) .mission__hl { clip-path: none; }

/* =========================================================================
   DO / DO / DO：語は紙（段階3の紙の地では既存どおり黒）。青だった面はチャコール
   ========================================================================= */
.dos__panel--2 { background: var(--charcoal); }
.dos__words span { color: var(--paper); }
/* .dos__blade（ワイプの切り口の3px線）はライムのまま */

/* =========================================================================
   RECRUIT ROLES：カードごとの --ac は使わない。名前は紙のまま、下の線だけライム
   ========================================================================= */
.role__line { background: var(--lime); height: 3px; }
.role.is-active .role__name { color: var(--paper); }

/* =========================================================================
   TEAM SYSTEM（紙の地）：線・バーは黒。カード内の番号は紙
   ========================================================================= */
.team__bar i { background: var(--black); }
/* カード上端の線は消す：線はカードの内側＝暗い写真の上に乗るため、黒では見えない（コントラスト約1.04〜1.6:1）。
   SPでは全カードに出て信号にもならない。アクティブの表示は紙の上の .team__hl（黒線）とカードの伸びで足りる */
.tcard::before,
.tcard.is-active::before { content: none; background: var(--black); } /* 背景は戻した時に青が出ないための保険 */
.team__hl { background: var(--black); }
.tcard__no { color: var(--paper); }

/* =========================================================================
   MEMBERS：巨大な名前は --giant（地より一段だけ明るい／暗い無彩色）。
   役割タグは fg の塗り＋bg の文字（白黒反転）＋ライムの点。ライムは点と番号の線だけ。
   点と線は黒の縁取りの上に置く（紙の地・紙の塗りの上でも信号が見えるように）
   ========================================================================= */
.mslide__giant { color: var(--giant, var(--fg)); }
.mslide__role { background: var(--fg); color: var(--bg); }
.mslide__role::before {
  content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--ac); box-shadow: 0 0 0 1.5px var(--black);
  margin-right: 9px; vertical-align: middle; transform: translateY(-1px);
}
.mslide__no::after { box-shadow: 0 0 0 1px var(--black); }
.mslide__chip div::after { content: none; } /* 手元チップへの色かぶせはやめる */

/* =========================================================================
   JOIN FLOW / FAQ：見出しは明るさで強調（前半グレー、STARTS HERE. は紙）
   ========================================================================= */
.flow__title { color: var(--gray); }
.flow__title > span:not(.ch) { color: var(--paper); }
.step:last-child h3 { color: var(--paper); }
/* .flow__line i と .step.is-on::before（進行線・点）はライムのまま */
.faq__q[aria-expanded='true'] { color: var(--paper); }
.faq__q[aria-expanded='true'] i::before,
.faq__q[aria-expanded='true'] i::after { background: var(--lime); } /* 開いた印の「−」だけライム */

/* =========================================================================
   FINAL ENTRY：「JOIN THE」はグレー、「NEXT STAGE.」は紙。最後の「.」（.fdo--dot）はライムの点のまま
   ========================================================================= */
.final__l1 { color: var(--gray); }
.final__l2 { color: var(--paper); }
.final__title em { color: inherit; }
.final__btn { color: var(--paper); }
.final__btnIcon { border-color: var(--paper); }
.final__btn:hover .final__btnIcon { background: var(--paper); color: var(--black); }
.final__links a:hover { color: var(--paper); border-bottom-color: var(--lime); }

/* =========================================================================
   現在の v2 の DOM には無い旧装飾（筆・引っかき・マーカー等）。
   戻した時にライム・青・赤の面や文字が出ないよう、無彩色にしておく
   ========================================================================= */
.stroke, .mk, .band, .team__brush { background: var(--black); }
.hero__slash i, .hero__flick i, .hero__scratch, .hero__edgeBlue,
.flow__stroke, .final__underline, .final__scratch { background: var(--charcoal); }
.role__mk, .step__mk, .step__circle, .mslide__brush, .mslide__qmk { background: currentColor; }
.hero__script { color: var(--paper); }
.mission__script { color: var(--black); }

/* 応募ダイアログの枠：ライムの飾り枠をやめ、控えめな紙色の線に */
.entry-dialog { border-color: rgba(242, 239, 232, 0.28); }
