/* ============================================================
 * themes-fable/minimal.css — Enjin テーマ「Minimal」(light) Fable改良版
 * enjin-base.css のトークン/語彙を上書きして着せ替える（HTMLは不変）。
 * 個性: 白地にコバルト / グロテスク見出し / ヘアライン罫 / 寛容な余白。
 * 磨き: 冷色ニュートラル階調・palt詰め見出し・全幅ヘアライン罫＋インクタブ・
 *       セクション連番(01/02…)・表組はインクの天罫＋ヘアライン行罫・
 *       接地したホバー（浮かせない、色だけ動く）。
 * 自動配色: --accent = var(--club-color, --theme-accent)（base側で解決）。
 *           濃淡(--accent-d/--accent-l)は --accent から導出し家系を保つ。
 * プレビュー: render.php?slug=…&preview=1&theme=minimal&tv=fable
 * ============================================================ */
:root{
  /* — 冷たく振ったニュートラル（コバルトと同族の灰） — */
  --paper:#ffffff;
  --paper2:#f6f7f9;
  --white:#ffffff;
  --card:#ffffff;
  --ink:#0f1116;
  --body:#464c58;
  --mute:#8b919d;
  --line:#e7e8ec;
  --line2:#d8dbe1;
  --theme-accent:#2b4de0;
  /* クラブ色が来ても濃淡が家系から外れないよう accent から導出 */
  --accent-d:color-mix(in srgb, var(--accent) 78%, #0c1230);
  --accent-l:color-mix(in srgb, var(--accent) 38%, #ffffff);
  --serif:"Noto Sans JP","Hiragino Kaku Gothic ProN",system-ui,sans-serif;
  --sans:"Noto Sans JP","Hiragino Kaku Gothic ProN",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,"Noto Sans JP",monospace;
}

/* ▼ 土台 — 余白のリズムと光学調整 */
section{padding:clamp(5.2rem,11.5vw,10rem) 0}
section[id]{scroll-margin-top:84px}
h1,h2,h3{font-weight:800;letter-spacing:-.022em;font-feature-settings:"palt" 1}
.alt{background:var(--paper2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.chip,.btn,.navcta,.crest,.form,.field input,.field select,.field textarea,
.seg label,.submit,.toast,.stag,.powered .badge{border-radius:0}

/* ▼ セクションヘッド — 連番 + 全幅ヘアライン罫（インクタブ） */
body{counter-reset:enjin-sec}
.eyebrow{font-size:11px;letter-spacing:.22em;font-weight:500}
.eyebrow i{letter-spacing:.22em}
.eyebrow i::after{color:var(--line2)}
section .eyebrow::before{
  counter-increment:enjin-sec;
  content:counter(enjin-sec,decimal-leading-zero);
  color:var(--mute);font-weight:500;letter-spacing:.12em;margin-right:1em;
}
.rule{width:100%;height:1px;margin:18px 0 28px;
  background:linear-gradient(90deg,var(--ink) 0 44px,var(--line) 44px)}
h2.sec{font-size:clamp(1.9rem,5vw,3.3rem);letter-spacing:-.03em;font-weight:800;margin-top:.35rem}
.lead{line-height:2.05}
.lead b,.lead strong{box-shadow:inset 0 -.42em 0 color-mix(in srgb,var(--accent) 15%,transparent)}
.note{font-family:var(--sans);font-size:.78rem;color:var(--mute);margin-top:1.6rem}

/* ▼ nav — 静かなリンク（コバルトはCTAに集中） */
nav{background:color-mix(in srgb,#fff 88%,transparent);border-bottom:1px solid var(--line)}
nav .wrap{height:68px}
.brand{font-weight:800;letter-spacing:-.01em;font-size:1.02rem;font-feature-settings:"palt" 1}
.crest{border-radius:50%;font-weight:800;font-size:.95rem}
.navlinks{font-size:13px;letter-spacing:.06em;font-weight:500;gap:1.9rem}
.navlinks a:hover{color:var(--ink)}
.navlinks a::after{height:1px;bottom:-6px;background:var(--ink);opacity:1}
.navcta{font-size:12.5px;letter-spacing:.1em;padding:.8em 1.5em}

/* ▼ hero — 余白で見せる。メッシュは淡く、裾をフェード */
.hero{padding:clamp(5.4rem,12vw,9.8rem) 0 clamp(4rem,8vw,6.6rem);border-bottom:1px solid var(--line)}
#mesh{opacity:.5;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 70%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 70%,transparent 100%)}
.hero .eyebrow{letter-spacing:.2em}
.htitle{font-weight:800;letter-spacing:-.035em;line-height:1.04;font-size:clamp(2.55rem,7.4vw,5.4rem)}
.hsub{font-family:var(--sans);font-size:clamp(.98rem,1.4vw,1.13rem);max-width:38ch;line-height:2;margin-top:1.8rem}
.hbtns{gap:.7rem;margin-top:2.4rem}

/* ▼ ボタン — 接地。浮かせず、色だけ確実に動く */
.btn{font-size:12px;letter-spacing:.14em;padding:1.05em 1.9em}
.btn-accent:hover{transform:none;background:var(--accent-d)}
.btn-line{border-width:1px}
.btn-line:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* ▼ chips — 輪郭だけの静かなメタ情報 */
.chips{gap:.55rem;margin-top:2.2rem}
.chip{font-size:.82rem;color:var(--mute);background:transparent;padding:.6em 1.1em}
.chip b{font-family:var(--sans);font-weight:700;margin-left:.15em}

/* ▼ team — ヘアライングリッド。ホバーは背景の囁きのみ */
.grid4{margin-top:2.4rem}
.person{padding:1.9rem 1.1rem;transition:background .22s ease}
.person:hover{transform:none;background:color-mix(in srgb,var(--accent) 3%,#fff)}
.avatar{border-radius:50%;background:var(--paper2);border:1px solid var(--line);color:var(--ink);font-weight:800;font-size:1.25rem}
.person b{font-family:var(--sans);font-weight:700;font-size:1rem;letter-spacing:-.01em}
.person span{font-size:9.5px;letter-spacing:.16em;display:inline-block;margin-top:.15rem}
.comp{gap:2.6rem;margin-top:2.2rem}
.comp div{font-family:var(--mono);font-size:.76rem;letter-spacing:.08em}
.comp b{font-family:var(--sans);font-size:2.1rem;font-weight:800;letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;line-height:1.15;margin-bottom:.15rem}

/* ▼ schedule — 天罫はインク、行罫はヘアライン（表の精度） */
.sched{margin-top:2.2rem;border-top:1px solid var(--ink)}
.srow{padding:1.3rem 0;transition:background .2s ease}
.srow:hover{background:color-mix(in srgb,var(--accent) 3%,transparent)}
.sdate b{font-family:var(--mono);font-weight:600;font-size:1.15rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.sdate span{font-size:9.5px}
.sbody b{font-family:var(--sans);font-weight:700;font-size:1.02rem;letter-spacing:-.01em}
.sbody p{font-size:.84rem;color:var(--mute);margin-top:.2rem}
.stag{font-size:9.5px;letter-spacing:.16em;padding:.5em 1em}
.stag.match{background:transparent;border:1px solid var(--accent);color:var(--accent)}
.stag.practice{border:1px solid var(--line2);color:var(--mute)}

/* ▼ news — 等幅の日付タブ + グロテスク見出し */
.newslist{margin-top:2.2rem;border-top:1px solid var(--ink)}
.nrow{grid-template-columns:8em 1fr;padding:1.6rem 0}
.nrow:hover{background:color-mix(in srgb,var(--accent) 3%,transparent)}
.nrow time{font-size:11.5px;letter-spacing:.08em;font-variant-numeric:tabular-nums}
.nbody .ncat{font-size:9.5px;letter-spacing:.2em;margin-bottom:.45rem}
.nbody h3{font-family:var(--sans);font-weight:700;font-size:1.1rem;letter-spacing:-.015em;line-height:1.6}
.nbody p{font-family:var(--sans);font-size:.88rem;line-height:1.9}
@media(max-width:600px){.nrow{grid-template-columns:1fr}}

/* ▼ gallery — キャプションを控えめに */
.gcap b{font-family:var(--sans);font-weight:700;font-size:.9rem;letter-spacing:-.01em}

/* ▼ 実績 — 年表の帳票精度 */
.ach{margin-top:2.2rem;border-bottom:1px solid var(--line)}
.ach .arow:first-child{border-top-color:var(--ink)}
.arow{padding:1.15rem 0}
.ayear{color:var(--mute);font-weight:500;font-size:.85rem;font-variant-numeric:tabular-nums}
.atitle b{font-family:var(--sans);font-weight:700;font-size:1rem;letter-spacing:-.01em}
.aresult{font-family:var(--mono);font-weight:600;font-size:.85rem;letter-spacing:.04em;color:var(--accent)}

/* ▼ 文武バンド — 単色コバルトのフラット面、左揃えで硬く */
.band{background:var(--accent);text-align:left}
.band .wrap{max-width:1120px}
.band h2{font-size:clamp(1.8rem,4.4vw,2.9rem);letter-spacing:-.03em;font-weight:800}
.band p{font-family:var(--sans);margin:1.4rem 0 2.2rem;max-width:46ch;color:rgba(255,255,255,.92);line-height:2}
.band .wm{font-family:var(--sans);font-weight:800;letter-spacing:-.05em;color:rgba(255,255,255,.08);
  left:auto;right:clamp(-30px,2vw,30px);top:auto;bottom:-20%}
.band .eyebrow,.band .eyebrow i{color:#fff}
section.band .eyebrow::before{color:rgba(255,255,255,.55)}

/* ▼ form — 帳票のような静けさ */
.form{padding:clamp(1.8rem,4.5vw,3rem);margin-top:2.4rem}
.field label{font-size:10px;letter-spacing:.16em;margin-bottom:.5rem}
.field input,.field select,.field textarea{background:#fff;padding:.8em 1em;font-size:.95rem;transition:border-color .18s ease}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.seg label{font-family:var(--sans);font-weight:700;font-size:.92rem;background:#fff;transition:border-color .18s,background .18s,color .18s}
.seg label:has(input:checked){background:color-mix(in srgb,var(--accent) 6%,#fff)}
.submit{font-size:.85rem;letter-spacing:.14em;padding:1.05em;transition:background .18s ease}
.toast{font-family:var(--sans);font-size:.88rem;background:color-mix(in srgb,var(--accent) 5%,#fff)}

/* ▼ footer — 白へ戻して静かに締める */
footer{background:var(--paper);border-top:1px solid var(--line);padding:4rem 0 2.2rem}
footer h4{font-family:var(--sans);font-weight:800;font-size:.92rem;letter-spacing:.02em}
footer p{font-family:var(--sans);font-size:.84rem}
footer a{font-size:.84rem}
footer a:hover{color:var(--ink)}
.powered{font-size:10.5px;letter-spacing:.08em;margin-top:2.6rem;padding-top:1.6rem}
.powered .badge{padding:.55em 1.1em}
