@charset "utf-8";
/* =========================================================
   SAPIO SPRINT CLUB / "100M" EDITION
   サイト全体を1本の100m走に見立てたレイアウト
   ========================================================= */

:root{
  --void:      #0f274c;
  --surface:   #daeaf8;
  --surface-2: #cce0f3;
  --hair:      rgba(170, 214, 255, .20);
  --hair-soft: rgba(170, 214, 255, .11);

  --blue:   #2d55ff;
  --blue-2: #4a72ff;
  --cyan:   #00a6dc;
  --hud:    #5cf3ff;
  --orange: #ff7f00;
  --amber:  #ffb300;

  --lane1: #e8892a;
  --lane2: #00a6dc;
  --lane3: #3a9a42;

  --paper:  #f5f2ea;
  --paper-2:#ebe6d9;
  --ink:    #0a3d9e;

  --w:  #f3f8ff;
  --w7: rgba(243, 248, 255, .86);
  --w5: rgba(243, 248, 255, .64);
  --w3: rgba(243, 248, 255, .40);

  --rail: 120px;
  --head: 62px;
  --mbar: 60px;
  --max:  1180px;

  --sans: "Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic Medium","Yu Gothic",Meiryo,system-ui,sans-serif;
  --mono: ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Roboto Mono","Courier New",monospace;
}

*,*::before,*::after{ box-sizing:border-box; }

html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--head) + 20px);
  -webkit-text-size-adjust:100%;
  overflow-x:hidden;
}

body{
  margin:0; background:var(--void); color:var(--w);
  font-family:var(--sans); font-size:16.5px; line-height:2.0; letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; height:auto; vertical-align:middle; }
a{ color:var(--cyan); }
h1,h2,h3,h4{ margin:0; line-height:1.35; }

.mono{ font-family:var(--mono); font-variant-numeric:tabular-nums; letter-spacing:.06em; }
.sr-only{ position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap; }

.wrap{ width:100%; max-width:var(--max); margin-inline:auto; padding-inline:26px; }

/* カード面は薄いパネル＋暗い文字。キャプションと罫線も背景に溶けない色へ */
.cell, .axis, .lane, .fee, .method, .spec, .mitem, .bib, .mhow-card, .mback-card,
.formula, .classlink, .coach-roster, .cdet, .cdet-main, .cdet-side, .calbox, .cmp{
  --w:  #14203c;
  --w7: rgba(20, 32, 60, .86);
  --w5: rgba(20, 32, 60, .64);
  --w3: rgba(20, 32, 60, .42);
  --hud: var(--ink);
  --hair:      rgba(20, 32, 60, .28);
  --hair-soft: rgba(20, 32, 60, .16);
  color: var(--w);
}

/* =========================================================
   ヘッダー
   ========================================================= */
.head{
  position:fixed; inset:0 0 auto 0; z-index:80; height:var(--head);
  display:flex; align-items:center; gap:20px;
  padding:0 32px 0 24px;
  background:linear-gradient(180deg, rgba(15,39,76,.96), rgba(15,39,76,.55) 70%, transparent);
  backdrop-filter:blur(6px);
}
.head.is-solid{ background:rgba(15,39,76,.97); border-bottom:1px solid var(--hair); }
.head-logo{ display:flex; align-items:center; text-decoration:none; color:var(--w); flex:0 1 auto; min-width:0; }
.head-logo img{ display:block; height:28px; width:auto; }
.head-nav{ margin-left:auto; display:flex; align-items:center; gap:22px; flex:0 0 auto; }
.head-nav a:not(.head-cta){
  font-family:var(--mono); font-size:14px; letter-spacing:.16em;
  color:var(--w7); text-decoration:none; text-transform:uppercase; transition:color .2s;
}
.head-nav a:not(.head-cta):hover,.head-nav a[aria-current]{ color:var(--cyan); }
.head-cta{
  font-family:var(--sans); font-size:14.5px; font-weight:800; letter-spacing:.08em;
  color:#fff; padding:11px 20px; border-radius:8px;
  background-image:linear-gradient(to right, #ff7f00 0%, #ffff00 40%, #ffff00 100%);
  background-size:200% auto; background-position:left center;
  text-shadow:1px 1px 1px #f00, -1px 1px 1px #f00, -1px -1px 0 #f00, 1px -1px 0 #f00;
  text-decoration:none; white-space:nowrap;
  transition:background-position .5s, opacity .5s, transform .15s;
}
.head-cta:hover, .head-cta:focus-visible{
  background-position:right center; opacity:.82; color:#fff;
}
.head-cta:active{ opacity:.7; transform:translateY(1px); }
.head-burger{
  display:none; margin-left:auto; width:40px; height:40px; padding:0;
  background:none; border:1px solid var(--hair); border-radius:2px; cursor:pointer;
}
.head-burger span{ display:block; width:16px; height:1px; margin:4px auto; background:var(--w); transition:.25s; }
.head-burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(5px) rotate(45deg); }
.head-burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.head-burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-5px) rotate(-45deg); }

@media (max-width:1400px){
  .head-nav{ gap:14px; }
  .head-nav a:not(.head-cta){ letter-spacing:.08em; font-size:13.5px; }
  .head-cta{ padding:10px 14px; }
}
@media (max-width:1099px){
  .head-burger{ display:block; }
  .head-nav{
    position:fixed; inset:var(--head) 0 auto 0; display:none;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--void); border-bottom:1px solid var(--hair); padding:8px 24px 22px;
  }
  .head-nav.is-open{ display:flex; }
  .head-nav a:not(.head-cta){ font-size:16px; padding:15px 0; border-bottom:1px solid var(--hair-soft); letter-spacing:.1em; }
  .head-cta{ margin-top:16px; text-align:center; padding:16px; font-size:16.5px; }
  .start-actions{ justify-content:center; }
}

/* =========================================================
   左のトラック（レール）
   ========================================================= */
.rail{
  position:fixed; left:0; top:var(--head); bottom:0; width:var(--rail); z-index:60;
  border-right:1px solid var(--hair-soft);
  display:none;
}
@media (min-width:1100px){
  .rail{ display:block; }
  body:has(.rail){ padding-left:var(--rail); }
}

.rail::before,.rail::after{
  content:""; position:absolute; top:148px; bottom:22px; width:1px; background:var(--hair);
}
.rail::before{ left:42px; }
.rail::after{ left:78px; }

.rail-track{
  position:absolute; left:0; right:0; top:148px; bottom:22px;
}
.rail-ticks{ position:absolute; inset:0; }
.rail-tick{
  position:absolute; left:0; right:0; display:flex; align-items:center; gap:8px;
  padding-left:8px; text-decoration:none; transform:translateY(-50%);
}
.rail-tick i{
  display:block; width:22px; height:1px; margin-left:34px;
  background:var(--w3); transition:background .25s, width .25s;
}
.rail-tick span{
  position:absolute; left:90px; white-space:nowrap;
  font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--hud); opacity:0; transform:translateX(-6px); transition:.25s; pointer-events:none;
}
.rail-tick:hover i{ background:var(--hud); width:30px; }
.rail-tick:hover span{ opacity:1; transform:translateX(0); }
.rail-tick.is-on i{ background:var(--w); }

.rail-runner{
  position:absolute; left:53px; width:14px; height:14px;
  transform:translateY(-50%);
  border-radius:50%; background:var(--hud); box-shadow:0 0 0 4px rgba(92,243,255,.16), 0 0 14px rgba(92,243,255,.28);
}
.rail-fill{
  position:absolute; left:59px; top:0; width:2px; height:0;
  background:linear-gradient(180deg,var(--blue),var(--hud));
  opacity:.7;
}
.rail-readout{
  position:absolute; left:0; right:0; top:10px; height:126px;
  text-align:center;
  font-family:var(--mono); color:var(--hud);
}
.rail-readout span{
  display:block; font-size:10px; letter-spacing:.22em; color:var(--w5);
}
.rail-readout b{
  display:block; margin-top:4px;
  font-size:52px; font-weight:600; line-height:1;
  letter-spacing:.02em; font-variant-numeric:tabular-nums;
}
.rail-readout em{
  display:block; margin-top:4px;
  font-style:normal; font-size:22px; font-weight:600; line-height:1;
  letter-spacing:.1em; color:var(--hud);
}

/* モバイル用の距離バー */
.mbar{
  position:fixed; top:var(--head); left:0; right:0; z-index:59; height:var(--mbar);
  display:flex; align-items:center; gap:10px; padding:0 18px;
  background:rgba(15,39,76,.97); border-bottom:1px solid var(--hair);
  font-family:var(--mono); color:var(--w5);
}
.mbar-now{
  flex:0 0 auto;
  font-size:24px; font-weight:600; letter-spacing:.08em; color:var(--hud);
}
.mbar-now b{
  font-size:36px; font-weight:600; line-height:1; letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
}
.mbar-goal{ font-size:12px; letter-spacing:.12em; }
.mbar-track{ flex:1; height:4px; background:rgba(92,243,255,.22); position:relative; border-radius:2px; }
.mbar-fill{
  position:absolute; left:0; top:0; height:4px; width:0; border-radius:2px;
  background:linear-gradient(90deg, var(--blue), var(--hud));
  opacity:.7;
}
.mbar-dot{
  position:absolute; top:-4px; width:12px; height:12px; border-radius:50%;
  background:var(--hud);
  box-shadow:0 0 0 4px rgba(92,243,255,.16), 0 0 14px rgba(92,243,255,.28);
}
@media (min-width:1100px){ .mbar{ display:none; } }
@media (max-width:1099px){
  html{ scroll-padding-top:calc(var(--head) + var(--mbar) + 12px); }
}

/* =========================================================
   ヒーロー ＝ スタートライン
   ========================================================= */
.start{
  position:relative; min-height:100svh; display:grid; align-items:center;
  overflow:hidden; padding:calc(var(--head) + 60px) 0 90px;
}
@media (max-width:1099px){
  .start{
    align-items:start;
    min-height:0;
    padding:calc(var(--head) + var(--mbar) + 18px) 0 28px;
  }
}
.start-bg{ position:absolute; inset:0; z-index:0; }
.start-photo{
  position:absolute; inset:0; background-size:cover; background-position:center 30%;
  opacity:.4; filter:grayscale(.18) contrast(1.05) brightness(.95);
}
.start-bg::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:radial-gradient(125% 82% at 50% 0%, rgba(0,166,220,.12), rgba(15,39,76,.64) 56%, var(--void) 100%);
}
/* 奥へ伸びるレーンは 0m 線から上へ */
.start-inner{ position:relative; z-index:2; }

.start-cluster{
  position:relative; z-index:2; width:100%; min-width:0;
}
.start-zero{
  position:relative; display:flex; align-items:center; width:100%; margin:0;
}
.start-zero .phase-dist{
  position:relative; z-index:1; background:none; flex:0 0 auto; padding:0 18px 0 0;
}
.start-zero-line{
  position:relative; z-index:1;
  display:block; height:2px; background:var(--w); min-width:0;
}
.start-zero-line.is-left{
  flex:0 0 auto;
  width:max(26px, calc((100% - min(var(--max), 100%)) / 2 + 26px));
}
.start-zero-line.is-right{ flex:1 1 auto; }
.start-lanes{
  position:absolute; z-index:0; left:50%; bottom:50%;
  width:230%; height:min(52vh, 560px);
  transform:translateX(-50%) perspective(560px) rotateX(66deg);
  transform-origin:bottom center;
  pointer-events:none;
  background:
    repeating-linear-gradient(90deg,
      transparent 0 calc(12.5% - 1px), rgba(45,85,255,.28) calc(12.5% - 1px) 12.5%);
  -webkit-mask-image:linear-gradient(to top, #000 0%, rgba(0,0,0,.32) 50%, transparent 92%);
          mask-image:linear-gradient(to top, #000 0%, rgba(0,0,0,.32) 50%, transparent 92%);
}
.start-zero-hint{
  margin:14px 0 0;
  font-family:var(--mono); font-size:11.5px; letter-spacing:.1em;
  color:var(--w5); line-height:1.85;
}
.start-title{
  margin:22px 0 0; line-height:.94;
}
.start-wordmark{
  display:block; width:min(100%, 28rem); height:auto;
}
.start-title .thin{
  display:block; margin-top:10px;
  font-size:clamp(28px,6.2vw,80px); font-weight:800; letter-spacing:-.01em;
  color:var(--w);
}
@media (max-width:1099px){
  .start-wordmark{ width:min(76%, 20rem); }
  .start-title .thin{ font-size:clamp(36px, 9vw, 72px); }
}
.start-sub{
  margin:30px 0 0; max-width:30em; font-size:16.5px; line-height:2.1; color:var(--w7);
}
.start-sub b{ color:var(--w); font-weight:700; }

.start-actions{ margin-top:40px; display:flex; flex-wrap:wrap; gap:14px; }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:18px 34px; border-radius:2px; text-decoration:none;
  font-size:15.5px; font-weight:800; letter-spacing:.08em; transition:.25s;
}
.btn-go{
  background-image:linear-gradient(to right, #ff7f00 0%, #ffff00 40%, #ffff00 100%);
  background-size:200% auto; background-position:left center;
  color:#fff; border-radius:8px;
  text-shadow:1px 1px 1px #f00, -1px 1px 1px #f00, -1px -1px 0 #f00, 1px -1px 0 #f00;
  transition:background-position .5s, opacity .5s, transform .15s;
}
.btn-go:hover, .btn-go:focus-visible{
  background-position:right center; opacity:.82; color:#fff;
}
.btn-go:active{ opacity:.7; transform:translateY(1px); }
.btn-line{
  background-image:linear-gradient(to right, #00bfff 0%, #7fffd4 45%, #fffacd 100%);
  background-size:200% auto; background-position:left center;
  color:#fff; border-radius:8px;
  text-shadow:1px 1px 1px #191970, -1px 1px 1px #191970, -1px -1px 0 #191970, 1px -1px 0 #191970;
  transition:background-position .5s, opacity .5s, transform .15s;
}
.btn-line:hover, .btn-line:focus-visible{
  background-position:right center; opacity:.82; color:#fff;
}
.btn-line:active{ opacity:.7; transform:translateY(1px); }
.btn-ghost{
  border:1.5px solid color-mix(in srgb, var(--w) 58%, transparent);
  background:color-mix(in srgb, var(--w) 10%, transparent);
  color:var(--w); border-radius:8px;
}
.btn-ghost:hover{
  border-color:var(--cyan);
  background:color-mix(in srgb, var(--cyan) 14%, transparent);
  color:var(--cyan);
}
.btn-sm{ padding:13px 24px; font-size:13.5px; }
.join-cta{
  margin:36px 0 0;
  text-align:center;
}
.btn-paper{ background:var(--ink); color:#fff; }
/* セクション内の二次ボタン（測定会など）。無料体験CTAとは別デザイン */
.btn-feature{
  background:transparent; border:1.5px solid var(--cyan); color:var(--cyan);
  padding:16px 30px; font-size:14.5px; letter-spacing:.1em; gap:14px;
}
.btn-feature .arw{ font-family:var(--mono); transition:transform .3s; }
.btn-feature:hover{ background:var(--cyan); color:#fff; }
.btn-feature:hover .arw{ transform:translateX(4px); }
.btn-paper:hover{ background:var(--blue); }

/* =========================================================
   速報ボード
   ========================================================= */
.board{
  border-bottom:1px solid var(--hair);
  padding-bottom:72px;
}
.board .note:last-child{ border-bottom:0; }

/* =========================================================
   局面セクション
   ========================================================= */
.phase{ position:relative; padding:120px 0 176px; }
#log.phase{ padding-bottom:140px; }
.phase::before{
  content:""; position:absolute; top:0; left:0; right:0; height:1.5px;
  background:var(--hair-soft); pointer-events:none;
}
.phase-mark{
  position:absolute; top:0; left:0; right:0;
  transform:translateY(-50%);
  z-index:2;
}
.phase-dist{
  display:inline-block; margin:0; padding:0 18px 0 0;
  background:var(--void);
  font-family:var(--mono); font-weight:500;
  font-size:clamp(40px,7vw,88px); line-height:.82;
  color:transparent; -webkit-text-stroke:1px rgba(170,210,255,.42);
}
.phase-dist em{ font-style:normal; font-size:.3em; -webkit-text-stroke:0; color:var(--w3); margin-left:.15em; }
.phase-head{ margin-bottom:96px; }
#log .phase-head{ margin-bottom:72px; }
.phase-en{
  margin:0;
  font-family:var(--mono); font-size:12px; letter-spacing:.24em; color:var(--hud);
}
.phase-ja{
  margin:10px 0 0; font-size:clamp(23px,3.6vw,38px); font-weight:800; letter-spacing:.02em;
}
.phase-note{
  margin:20px 0 0; max-width:38em; font-size:15.5px; color:var(--w7); line-height:2.05; line-break:strict;
}
#log .phase-note{ max-width:46em; }

.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1); }
.reveal.is-in{ opacity:1; transform:none; }

/* ---- ABOUT：3つの軸 ---- */
.axes{ display:grid; gap:1px; background:var(--hair-soft); border:1px solid var(--hair-soft); }
@media (min-width:800px){ .axes{ grid-template-columns:repeat(3,1fr); } }
.axis{ background:var(--surface); padding:38px 32px 42px; position:relative; }
.axis + .axis::before{
  content:"→"; position:absolute; z-index:3;
  font-family:var(--mono); font-size:15px; color:var(--cyan);
  width:34px; height:34px; display:grid; place-items:center;
  background:var(--void); border:1px solid rgba(170, 214, 255, .35); border-radius:50%;
}
@media (min-width:800px){
  .axis + .axis::before{ left:-1px; top:50%; transform:translate(-50%,-50%); }
}
@media (max-width:799px){
  .axis + .axis::before{ content:"↓"; top:-1px; left:50%; transform:translate(-50%,-50%); }
}
.axes{ overflow:visible; }
.axis p.axis-no{ font-family:var(--mono); font-size:11.5px; letter-spacing:.18em; color:var(--hud); }
.axis h3{ margin:18px 0 14px; font-size:21px; font-weight:800; letter-spacing:.02em; }
.axis p{ margin:0; font-size:14.5px; line-height:2.05; color:var(--w7); }
.axis::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:var(--blue); transform:scaleX(0); transform-origin:left; transition:transform .6s;
}
.axis.is-in::after{ transform:scaleX(1); }

.goal{
  margin-top:34px; border:1px solid var(--hair); padding:34px 32px; text-align:center;
  background:linear-gradient(180deg, rgba(0,166,220,.16), rgba(45,85,255,.06));
}
.goal p{ margin:0; font-size:clamp(17px,2.6vw,25px); font-weight:800; letter-spacing:.04em; }
.goal small{ display:block; margin-top:14px; font-family:var(--mono); font-size:11.5px; letter-spacing:.2em; color:var(--w5); }

/* ---- METHOD：計測パネル ---- */
.cell-scene{
  position:relative;
  height:clamp(180px,17vw,220px);
  margin:calc(-1 * var(--cell-pad)) calc(-1 * var(--cell-pad)) 28px;
  overflow:hidden;
  border-bottom:1px solid var(--hair);
  background:#bdcfe0;
}
.cell-scene img{
  display:block; width:100%; height:100%;
  object-fit:cover;
  filter:contrast(.98) saturate(.88);
}
.cell-scene.is-policy img{ object-position:center 48%; }
.cell-scene.is-measurement img{ object-position:center 55%; }
.cell-scene::after{
  content:""; position:absolute; inset:0;
  background:rgba(15,39,76,.08);
  pointer-events:none;
}
@media (max-width:640px){
  .cell-scene{ height:180px; margin-bottom:24px; }
}
.formula{
  border:1px solid var(--hair); background:var(--surface);
  padding:clamp(28px,4vw,52px); text-align:center;
}
.formula-cap{
  margin:0 0 26px; font-size:11.5px; letter-spacing:.18em; color:var(--w5);
}
.formula-row{
  display:flex; align-items:center; justify-content:center; gap:clamp(10px,2.4vw,28px);
  flex-wrap:wrap;
}
.f-term{ text-align:center; }
.f-term b{
  display:block; font-family:var(--mono); font-size:clamp(15px,2.4vw,22px);
  letter-spacing:.14em; color:var(--cyan);
}
.f-term span{ display:block; margin-top:8px; font-size:14px; color:var(--w7); }
.f-op{ font-family:var(--mono); font-size:clamp(18px,3vw,30px); color:var(--w3); }
.formula-note{ margin:34px auto 0; max-width:40em; font-size:15px; color:var(--w7); line-height:2.05; }

.method-grid{ display:grid; gap:1px; background:var(--hair-soft); margin-top:34px; border:1px solid var(--hair-soft); }
@media (min-width:760px){ .method-grid{ grid-template-columns:repeat(3,1fr); } }
.method{ background:var(--surface); padding:40px 32px 44px; }
.method .m-no{
  display:block; font-family:var(--mono); font-size:40px; line-height:1; font-weight:500;
  color:transparent; -webkit-text-stroke:1px rgba(170,210,255,.42); margin-bottom:16px;
}
.method b{ display:block; font-family:var(--mono); font-size:11px; letter-spacing:.22em; color:var(--hud); }
.method h4{ margin:12px 0 14px; font-size:22px; font-weight:800; letter-spacing:.03em; }
.method p{ margin:0; font-size:14.5px; line-height:2.05; color:var(--w7); }
.linkline{ margin-top:30px; }
.linkline a{
  display:inline-flex; align-items:center; gap:10px; color:var(--w); text-decoration:none;
  font-size:15px; border-bottom:1px solid var(--hair); padding-bottom:6px; transition:.25s;
}
.linkline a:hover{ color:var(--cyan); border-color:var(--cyan); }
.linkline a::after{ content:"→"; font-family:var(--mono); color:var(--cyan); }

/* ---- 特徴ブロック（測定会） ---- */
.feature{
  position:relative; overflow:hidden;
  background:linear-gradient(135deg, rgba(0,143,212,.08), rgba(45,85,255,.08) 60%, rgba(45,85,255,.04));
  border:1px solid rgba(0,143,212,.28);
  padding:clamp(30px,4vw,52px);
}
.feature::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(180deg,var(--cyan),var(--blue));
}
.feature-tag{
  display:inline-block; font-size:11px; letter-spacing:.18em; font-weight:700;
  color:#fff; background:var(--cyan); padding:5px 14px; margin-bottom:28px;
}
.feature-body{ display:grid; gap:clamp(28px,4vw,54px); }
@media (min-width:900px){ .feature-body{ grid-template-columns:1.05fr .95fr; } }
.feature-title{
  font-size:clamp(24px,3.4vw,34px); font-weight:800; line-height:1.45; letter-spacing:.02em;
}
.feature-lead{ margin:22px 0 30px; font-size:15.5px; line-height:2.05; color:var(--w7); }
.feature-lead strong{ color:var(--cyan); font-weight:700; }
.feature-sub{ margin:0 0 14px; font-size:11px; letter-spacing:.2em; color:var(--hud); }
.ticks{ list-style:none; margin:0; padding:0; }
.ticks li{
  position:relative; padding:10px 0 10px 24px; font-size:14.5px; color:var(--w7);
  border-bottom:1px solid var(--hair-soft);
}
.ticks li:first-child{ border-top:1px solid var(--hair-soft); }
.ticks li::before{ content:"—"; position:absolute; left:0; color:var(--cyan); font-family:var(--mono); }

/* ---- 要素チップ ---- */
.chips{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:20px 0 0; padding:0; }
.chips li{
  font-size:13px; letter-spacing:.04em; color:var(--w7);
  border:1px solid var(--hair); padding:7px 13px; white-space:nowrap;
}

/* ---- ブロック見出し ---- */
.block-label{
  margin:0 0 22px; font-size:11.5px; letter-spacing:.2em; color:var(--hud);
}

/* ---- 測定項目のグリッド ---- */
.specs{
  display:grid; gap:1px; background:var(--hair-soft);
  border:1px solid var(--hair-soft);
  grid-template-columns:1fr;
}
@media (min-width:620px){ .specs{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .specs{ grid-template-columns:repeat(3,1fr); } }
.spec{ background:var(--surface); padding:26px 24px 30px; }
.spec b{ display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:.22em; color:var(--hud); }
.spec h4{
  margin:12px 0 10px; font-size:19px; font-weight:800; letter-spacing:.02em;
  display:flex; align-items:baseline; gap:8px;
}
.spec .unit{
  font-size:11.5px; font-weight:400; letter-spacing:.08em; color:var(--w5);
  border:1px solid var(--hair); padding:1px 7px;
}
.spec p{ margin:0; font-size:13.5px; line-height:1.95; color:var(--w5); }
.specs-note{ margin:16px 0 0; font-size:13px; line-height:1.95; color:var(--w5); max-width:52em; }

/* ---- 測定会：記録 → 算出 ---- */
.mhow{ margin-top:8px; }
.mhow-fig{
  margin:0 0 22px; padding:8px 4px 0;
  overflow:visible;
}
.mhow-time{
  display:flex; align-items:center; gap:12px;
  margin:0 0 16px;
}
.mhow-clock{
  flex:0 0 auto; width:28px; height:28px; color:var(--amber);
}
.mhow-clock svg{ display:block; width:100%; height:100%; }
.mhow-time-bar{
  flex:1 1 auto; height:1px;
  background:linear-gradient(90deg, rgba(255,179,0,.55), rgba(255,179,0,.18));
}
.mhow-time-lab{
  flex:0 0 auto; font-size:12px; letter-spacing:.16em; color:var(--amber);
}
.mhow-lane-bar{
  position:relative; height:14px;
  background:rgba(170, 214, 255, .14);
}
.mhow-lane-full{
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(92,243,255,.18), rgba(45,85,255,.22));
}
.mhow-lane-clip{
  position:absolute; top:-4px; bottom:-4px; left:40%; width:20%;
  background:var(--cyan);
  box-shadow:0 0 0 1px rgba(92,243,255,.35), 0 0 18px rgba(0,166,220,.35);
}
.mhow-lane-marks{
  position:relative; height:28px; margin-top:10px;
  font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:var(--w5);
}
.mhow-lane-marks span{ position:absolute; top:0; transform:translateX(-50%); }
.mhow-lane-marks span:first-child{ left:0; transform:none; }
.mhow-lane-marks .is-end{ left:auto; right:0; transform:none; }
.mhow-lane-marks .is-clip{ color:var(--hud); }
.mhow-lane-marks .at-20{ left:40%; }
.mhow-lane-marks .at-30{ left:60%; }
.mhow-cam{
  position:relative; height:92px; margin-top:2px;
}
.mhow-cam-lines{
  display:block; width:100%; height:44px;
}
.mhow-cam-lines line{
  stroke:var(--hud); stroke-width:1.6;
  vector-effect:non-scaling-stroke;
}
.mhow-cam-icon{
  position:absolute; left:50%; top:32px;
  transform:translateX(-50%);
  width:48px; height:40px; color:var(--hud);
}
.mhow-cam-icon svg{ display:block; width:100%; height:100%; }
.mhow-cam p{
  position:absolute; left:50%; top:74px;
  transform:translateX(-50%);
  margin:0; white-space:nowrap;
  font-size:11px; letter-spacing:.14em; color:var(--hud);
}
@media (max-width:520px){
  .mhow-fig{ padding:4px 0 0; }
  .mhow-lane-marks{ font-size:10px; }
  .mhow-time-lab{ letter-spacing:.1em; }
  .mhow-cam{ height:86px; }
}
.mhow-pair{
  display:grid; gap:1px; background:var(--hair-soft);
  border:1px solid var(--hair-soft);
  grid-template-columns:1fr;
  overflow:visible;
}
@media (min-width:720px){ .mhow-pair{ grid-template-columns:1fr 1fr; } }
.mhow-card{
  background:var(--surface); padding:28px 26px 32px;
  position:relative; overflow:hidden;
}
.mhow-card::before{
  content:""; position:absolute; left:0; right:0; top:0; height:4px;
  background:var(--blue);
}
.mhow-card.is-film::before{ background:var(--cyan); }
.mhow-lab{ margin:0; font-size:11px; letter-spacing:.2em; color:var(--hud); }
.mhow-card h3{ margin:16px 0 10px; font-size:22px; font-weight:800; letter-spacing:.02em; }
.mhow-card p{ margin:0; font-size:14.5px; line-height:2; color:var(--w7); }
.mhow-card p + p{ margin-top:1.1em; }
.mhow-card strong{ color:var(--cyan); font-weight:700; }

/* ---- 測定会：実施写真＋短い本文 ---- */
.mscene{ margin:0; }
.mscene-photo{
  margin:0; position:relative; overflow:hidden;
  aspect-ratio:16/9; max-height:220px;
  background:#0f274c;
  border:1px solid var(--hair);
}
.mscene-photo img{
  display:block; width:100%; height:100%;
  object-fit:cover; object-position:48% 58%;
}
.mscene-photo::after{
  content:""; position:absolute; inset:auto 0 0; height:46%;
  background:linear-gradient(transparent, rgba(15,39,76,.42));
  pointer-events:none;
}
.mscene-photo figcaption{
  position:absolute; left:12px; bottom:10px; z-index:1;
  font-size:10px; letter-spacing:.22em; color:#f3f8ff;
}
.mscene-copy{ margin-top:22px; display:grid; gap:1.15em; }
.mscene-copy p{
  margin:0; font-size:14.5px; line-height:2.05; color:var(--w7);
}
.mscene-copy strong{ color:var(--cyan); font-weight:700; }
@media (min-width:800px){
  .mscene{
    display:grid;
    grid-template-columns:minmax(240px, 38%) minmax(0, 1fr);
    gap:0 40px;
    align-items:center;
  }
  .mscene-photo{
    aspect-ratio:16/9;
    max-height:none;
  }
  .mscene-photo img{ object-position:48% 58%; }
  .mscene-copy{ margin:0; max-width:36em; }
}
.mhow-from{
  display:flex; flex-direction:column; align-items:center;
  gap:12px; margin:28px 0 22px; text-align:center;
}
.mhow-from-arr{
  width:36px; height:36px; display:grid; place-items:center;
  font-family:var(--mono); font-size:16px; color:var(--cyan);
  background:var(--void); border:1px solid rgba(170, 214, 255, .35); border-radius:50%;
}
.mhow-from p{
  margin:0; font-size:14.5px; line-height:1.9; color:var(--w7);
}
.mhow .specs{ grid-template-columns:1fr; }
@media (min-width:620px){ .mhow .specs{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .mhow .specs{ grid-template-columns:repeat(3,1fr); } }

.phase-tail{
  margin:48px 0 0; max-width:48em; font-size:15.5px; line-height:2.1; color:var(--w7);
}
.phase-tail strong{ color:var(--cyan); font-weight:700; }

/* ---- 補足のひとこと（式など） ---- */
.sidenote{
  margin-top:38px; border-left:2px solid rgba(0,143,212,.5);
  padding:6px 0 6px 26px;
}
.sidenote p{
  margin:0; max-width:52em; font-size:14.5px; line-height:2.1; color:var(--w5);
}
.sidenote .expr{
  display:inline-block; font-size:13.5px; color:var(--w);
  background:rgba(0,143,212,.08); border:1px solid rgba(0,143,212,.26);
  padding:1px 10px; margin:0 4px; white-space:nowrap;
}
.sidenote-links{ display:flex; flex-wrap:wrap; gap:10px 28px; margin-top:18px; }
.sidenote-links a{
  font-size:14px; color:var(--w); text-decoration:none;
  border-bottom:1px solid var(--hair); padding-bottom:5px; transition:.25s;
}
.sidenote-links a::after{ content:" →"; font-family:var(--mono); color:var(--cyan); }
.sidenote-links a:hover{ color:var(--cyan); border-color:var(--cyan); }

/* ---- 準備中バナー / 仮ブロック ---- */
.draft{
  border:1px dashed rgba(255,179,0,.55); background:rgba(255,179,0,.07);
  padding:26px 30px;
}
.draft-tag{
  margin:0 0 12px; font-size:11.5px; letter-spacing:.2em; color:var(--amber);
}
.draft p:last-child{ margin:0; font-size:14.5px; line-height:2.05; color:var(--w7); }

.mback-pair{
  display:grid; gap:1px; background:var(--hair-soft);
  border:1px solid var(--hair-soft);
  grid-template-columns:1fr;
  overflow:visible;
}
@media (min-width:720px){ .mback-pair{ grid-template-columns:1fr 1fr; } }
.mback-card{
  background:var(--surface); padding:28px 26px 32px;
  position:relative;
}
.mback-card::before{
  content:""; position:absolute; left:0; right:0; top:0; height:4px;
  background:var(--blue);
}
.mback-card.is-give::before{ background:var(--cyan); }
.mback-card.is-give::after{
  content:"↓"; position:absolute; z-index:3;
  font-family:var(--mono); font-size:15px; color:var(--cyan);
  width:34px; height:34px; display:grid; place-items:center;
  background:var(--void); border:1px solid rgba(170, 214, 255, .35); border-radius:50%;
  top:-1px; left:50%; transform:translate(-50%,-50%);
}
@media (min-width:720px){
  .mback-card.is-give::after{ content:"→"; left:-1px; top:50%; transform:translate(-50%,-50%); }
}
.mback-lab{ margin:0; font-size:11px; letter-spacing:.2em; color:var(--hud); }
.mback-card h3{ margin:16px 0 10px; font-size:22px; font-weight:800; letter-spacing:.02em; }
.mback-card p{ margin:0; font-size:14.5px; line-height:2; color:var(--w7); }

.mback-paper{
  margin-top:28px;
  background:var(--paper);
  color:#14203c;
  padding:clamp(26px,3.6vw,42px) clamp(22px,3.2vw,40px) clamp(28px,3.6vw,44px);
  box-shadow:
    0 0 0 1px rgba(243,248,255,.08),
    0 18px 40px rgba(4, 12, 32, .32);
  position:relative;
}
.mback-paper::before{
  content:""; position:absolute; left:0; top:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--cyan), var(--blue));
}
.mback-paper-lab{
  margin:0; font-size:11px; letter-spacing:.2em; color:#0a6f96;
}
.mback-paper > h3{
  margin:10px 0 22px; font-size:clamp(20px,2.6vw,26px); font-weight:800; letter-spacing:.02em;
}
.mback-list{ margin:0; padding:0; list-style:none; }
.mback-list li{
  display:grid; grid-template-columns:2.4em 1fr; gap:14px;
  padding:18px 0; border-top:1px solid rgba(20,32,60,.12);
}
.mback-list li:first-child{ border-top:0; padding-top:0; }
.mback-list b{ font-size:12px; letter-spacing:.14em; color:#0a6f96; padding-top:3px; }
.mback-list h4{ margin:0 0 6px; font-size:17px; font-weight:800; }
.mback-list p{ margin:0; font-size:14px; line-height:1.95; color:rgba(20,32,60,.68); }

.mback-metrics{
  display:flex; flex-wrap:wrap; gap:8px;
  list-style:none; margin:14px 0 0; padding:0;
}
.mback-list .mback-metrics li{
  display:block; grid-template-columns:unset;
  padding:5px 11px; border-top:0;
  font-family:var(--mono); font-size:12px; letter-spacing:.06em;
  color:#14203c; background:rgba(20,32,60,.06);
  border:1px solid rgba(20,32,60,.12);
}
.msamp{
  margin-top:28px;
  border:1px solid rgba(92,243,255,.42);
  background:rgba(92,243,255,.06);
}
.msamp.rule summary{
  padding:20px 22px;
  transition:background-color .25s, border-color .25s;
}
.msamp.rule summary:hover,
.msamp.rule summary:focus-visible{
  background:rgba(92,243,255,.1);
  outline:none;
}
.msamp .rule-no{
  color:var(--hud);
  padding:4px 9px;
  border:1px solid rgba(92,243,255,.4);
}
.msamp .rule-q{ font-size:16px; }
.msamp-toggle{
  display:flex; align-items:center; gap:10px;
  font-family:var(--mono); font-size:11px; letter-spacing:.12em;
  color:var(--hud);
}
.msamp-toggle-close{ display:none; }
.msamp[open] .msamp-toggle-open{ display:none; }
.msamp[open] .msamp-toggle-close{ display:inline; }
.msamp .rule-mark{
  position:relative;
  width:30px; height:30px; margin:0;
  border:1px solid rgba(92,243,255,.5); border-radius:50%;
  transform:none;
}
.msamp .rule-mark::before,
.msamp .rule-mark::after{
  content:""; position:absolute; left:50%; top:50%;
  width:10px; height:1px;
  background:var(--hud);
  transform:translate(-50%,-50%);
  transition:transform .3s;
}
.msamp .rule-mark::after{ transform:translate(-50%,-50%) rotate(90deg); }
.rule.msamp[open] .rule-mark{ transform:none; border-color:var(--hud); }
.msamp[open] .rule-mark::after{ transform:translate(-50%,-50%) rotate(0); }
.rule-a.msamp-panel{
  margin:0;
  padding:22px;
  color:var(--w);
  background:#081c3a;
}
.msamp-panel > p{
  margin:0 0 16px;
  font-size:14px; line-height:1.9; color:var(--w7);
}
.msamp-fig{
  margin:0; background:#fff;
  border:1px solid rgba(92,243,255,.28);
  box-shadow:0 16px 34px rgba(0,0,0,.3);
}
.msamp-fig img{ display:block; width:100%; height:auto; }
@media (max-width:520px){
  .msamp.rule summary{
    grid-template-columns:1fr auto;
    gap:10px 14px;
    padding:17px 16px;
  }
  .msamp .rule-no{ grid-column:1; width:max-content; }
  .msamp .rule-q{ grid-column:1; font-size:15px; }
  .msamp-toggle{ grid-column:2; grid-row:1 / span 2; }
  .msamp-toggle-open,
  .msamp-toggle-close{ display:none !important; }
  .msamp-panel{ padding:12px; }
}

.mback-video{
  margin-top:28px;
  border:1px solid var(--hair-soft);
}
.mback-video::before{ background:var(--cyan); }

.mplan{ margin-top:44px; }
.mplan-label{
  margin:0 0 20px; font-size:11.5px; letter-spacing:.2em; color:var(--amber);
}
.mplan-grid{
  display:grid; gap:1px; background:var(--hair-soft);
  border:1px solid var(--hair-soft);
  grid-template-columns:1fr;
}
@media (min-width:720px){ .mplan-grid{ grid-template-columns:repeat(2,1fr); } }
.mitem{ background:var(--surface); padding:28px 26px 32px; }
.mitem b{ font-family:var(--mono); font-size:11.5px; letter-spacing:.18em; color:var(--hud); }
.mitem h4{ margin:12px 0 10px; font-size:18px; font-weight:800; }
.mitem p{ margin:0; font-size:14px; line-height:2; color:var(--w5); }
.mitem.is-tbd{
  --hair: rgba(170, 214, 255, .40);
  --hud: var(--cyan);
  background:transparent; border:1px dashed var(--hair);
}
.mitem.is-tbd b{ color:var(--w3); }
.mitem.is-tbd h4{ color:var(--w5); }
.mplan-note{ margin:18px 0 0; font-size:13px; color:var(--w5); line-height:1.95; }

/* ---- CLASS：3レーン ---- */
.lanes{
  display:grid; gap:20px;
  background:transparent; border:0;
}
.fees + .two{ margin-top:34px; }
.two + .two{ margin-top:34px; }
@media (min-width:860px){ .lanes{ grid-template-columns:repeat(3,1fr); } }
.lane{
  --w:  #f3f8ff;
  --w7: rgba(243, 248, 255, .88);
  --w5: rgba(243, 248, 255, .72);
  --w3: rgba(243, 248, 255, .42);
  --hud: #5cf3ff;
  --hair:      rgba(170, 214, 255, .38);
  --hair-soft: rgba(170, 214, 255, .20);
  color: var(--w);
  position:relative; padding:0 0 28px; overflow:hidden;
  background:
    linear-gradient(180deg, rgba(243,248,255,.14), rgba(243,248,255,.04)),
    #1a4f96;
  border:1px solid rgba(170, 214, 255, .48);
  box-shadow:
    0 0 0 1px rgba(92, 243, 255, .10),
    0 14px 32px rgba(4, 12, 32, .36),
    inset 0 1px 0 rgba(243,248,255,.22);
}
.lane::before{
  content:""; position:absolute; left:0; right:0; top:0; height:6px;
}
.lane-1::before{ background:var(--lane1); }
.lane-2::before{ background:var(--lane2); }
.lane-3::before{ background:var(--lane3); }
.lane-head{
  position:relative; padding:28px 26px 16px;
}
.lane-head:has(.lane-flag) .lane-en{ padding-right:118px; }
.lane-en{
  margin:0; font-size:11px; letter-spacing:.2em;
}
.lane-1 .lane-en{ color:var(--lane1); }
.lane-2 .lane-en{ color:var(--lane2); }
.lane-3 .lane-en{ color:var(--lane3); }
.lane-head h3{
  margin:8px 0 0; font-size:21px; font-weight:800; letter-spacing:.02em; color:#fff;
}
.lane-body{ padding:0 26px; }
.lane-flag{
  position:absolute; top:18px; right:16px; z-index:2;
  font-family:var(--mono); font-size:11px; letter-spacing:.14em;
  color:#2a1a00; background:var(--amber); padding:4px 10px; font-weight:700;
}
.lane-spec{ margin:0; padding:0; list-style:none; }
.lane-spec li{
  display:flex; justify-content:space-between; gap:14px; align-items:baseline;
  padding:13px 0; border-bottom:1px solid var(--hair-soft); font-size:15px;
}
.lane-spec .k{ font-family:var(--mono); font-size:12px; letter-spacing:.12em; color:var(--w5); white-space:nowrap; }
.lane-spec .v{ text-align:right; line-height:1.65; }
.lane-fee{ margin:22px 0 0; display:flex; align-items:baseline; gap:8px; }
.lane-fee small{ font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; color:var(--w5); }
.lane-fee b{ font-family:var(--mono); font-size:30px; font-weight:600; letter-spacing:.01em; }
.lane-fee span{ font-size:13.5px; color:var(--w7); }

.fees{
  display:grid; gap:0; margin-top:34px;
  background:var(--surface); border:1px solid var(--hair-soft);
}
@media (min-width:700px){ .fees{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1080px){ .fees{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:859px){ .fees.fees-3{ grid-template-columns:1fr; } }
@media (min-width:860px){ .fees.fees-3{ grid-template-columns:repeat(3,1fr); } }
.fee{ background:transparent; padding:28px 26px; position:relative; }
.fees.fees-3 .fee + .fee::before{
  content:""; position:absolute;
}
@media (max-width:859px){
  .fees.fees-3 .fee + .fee::before{
    left:26px; right:26px; top:0; height:0;
    border-top:1px solid var(--hair-soft);
  }
}
@media (min-width:860px){
  .fees.fees-3 .fee + .fee::before{
    left:0; top:28px; bottom:28px; width:0;
    border-left:1px solid var(--hair-soft);
  }
}
.fee b{ display:block; font-family:var(--mono); font-size:11.5px; letter-spacing:.18em; color:var(--hud); margin-bottom:14px; }
.fee p{ margin:0 0 .8em; font-size:14.5px; line-height:2.05; color:var(--w7); }
.fee p:last-child{ margin-bottom:0; }
.fee .dim{ font-size:13.5px; color:var(--w5); line-height:1.95; }
.fee em{ font-style:normal; font-family:var(--mono); font-size:16px; color:var(--w); }
.fees-3 .fee h3{ margin:0; font-size:18px; letter-spacing:.03em; }
.fees-3 .fee-value{ margin-top:13px; }
.fees-3 .fee-value em{ margin-right:5px; font-size:21px; color:var(--cyan); }

/* ---- COACH：ゼッケン ---- */
.bibs{ display:grid; gap:28px; }
@media (min-width:860px){ .bibs{ grid-template-columns:repeat(2,1fr); } }
.bib{ border:1px solid var(--hair); background:var(--surface); }
.bib-photo{ position:relative; aspect-ratio:16/10; overflow:hidden; border-bottom:1px solid var(--hair); }
.bib-photo img{ width:100%; height:100%; object-fit:cover; object-position:center 22%; filter:grayscale(.25) contrast(1.06); }
.bib-photo.is-honma img{
  object-position:center 48%;
  transform:scale(2);
  transform-origin:58% 38%;
}
.bib-photo.is-toyomasu img{ object-position:center 42%; }
.bib-photo::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,21,51,0) 40%, rgba(10,21,51,.92) 100%);
}
.bib-num{
  position:absolute; left:24px; bottom:18px; z-index:2;
  font-family:var(--mono); font-size:46px; font-weight:600; line-height:1;
  color:transparent; -webkit-text-stroke:1.4px var(--cyan);
}
.bib-body{ padding:30px 30px 34px; }
.bib-name{ font-size:25px; font-weight:800; letter-spacing:.08em; }
.bib-role{ margin:8px 0 22px; font-family:var(--mono); font-size:11.5px; letter-spacing:.18em; color:var(--w5); }
.bib-text{ margin:0; font-size:15px; line-height:2.05; color:var(--w7); }
.bib-rec{ margin-top:24px; border-top:1px solid var(--hair-soft); padding-top:20px; }
.bib-rec b{ display:block; font-family:var(--mono); font-size:11.5px; letter-spacing:.18em; color:var(--hud); margin-bottom:12px; }
.bib-rec ul{ margin:0; padding:0; list-style:none; }
.bib-rec li{ display:flex; gap:14px; font-size:14px; color:var(--w7); padding:6px 0; }
.bib-rec li i{ font-style:normal; font-family:var(--mono); font-size:12.5px; color:var(--w5); flex:0 0 3.8em; }

.coach-roster{
  --roster-pad-x:clamp(22px,3.4vw,42px);
  margin-top:34px; padding:30px var(--roster-pad-x) 36px;
  border:1px solid var(--hair);
  background:var(--surface);
}
.coach-roster-head{ text-align:center; }
.coach-roster-head p{ margin:0; font-size:10.5px; letter-spacing:.24em; color:var(--hud); }
.coach-roster-head h3{ margin:8px 0 0; font-size:20px; letter-spacing:.12em; }
.coach-roster-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,220px));
  justify-content:center;
  gap:30px 28px; margin-top:28px;
}
.coach-mini{ min-width:0; text-align:center; }
.coach-mini-photo{
  position:relative; display:block; width:min(180px,100%); aspect-ratio:1;
  margin:0 auto 17px; overflow:hidden; border-radius:50%;
  border:2px solid rgba(92,243,255,.46); background:#aec5db;
}
.coach-mini-photo img{
  display:block; width:100%; height:100%; object-fit:cover; object-position:center 38%;
  filter:grayscale(.08) contrast(1.04);
}
.coach-mini-photo > .mono{
  position:absolute; right:11px; top:10px;
  font-size:12px; letter-spacing:.08em; color:var(--cyan);
  text-shadow:0 1px 4px rgba(5,21,48,.9);
}
.coach-mini-name{
  margin:0; font-size:18px; font-weight:800; letter-spacing:.1em;
}
.coach-mini-role{
  margin:7px 0 0;
  font-size:12.5px; letter-spacing:.1em; color:var(--w5);
}
.coach-mini-meta{
  display:flex; align-items:center; justify-content:center; gap:13px;
}
.coach-detail-toggle{
  display:grid; place-items:center; width:32px; height:32px; flex:0 0 32px;
  margin:0; padding:0;
  border:1px solid var(--hair); border-radius:50%;
  background:rgba(255,255,255,.42); color:var(--w5);
  cursor:pointer;
  transition:border-color .2s, background .2s, color .2s, transform .2s;
}
.coach-detail-toggle:hover,
.coach-detail-toggle:focus-visible,
.coach-detail-toggle[aria-expanded="true"]{
  border-color:var(--cyan); background:rgba(0,166,220,.11); color:var(--cyan);
}
.coach-detail-toggle:hover{ transform:translateY(-2px); }
.coach-detail-mark{
  position:relative; display:block; width:12px; height:12px;
}
.coach-detail-mark::before,
.coach-detail-mark::after{
  content:""; position:absolute; left:50%; top:50%;
  width:12px; height:1.5px; background:currentColor;
  transform:translate(-50%,-50%);
  transition:transform .3s cubic-bezier(.16,.84,.32,1);
}
.coach-detail-mark::after{ transform:translate(-50%,-50%) rotate(90deg); }
.coach-detail-toggle[aria-expanded="true"] .coach-detail-mark::after{ transform:translate(-50%,-50%) rotate(0); }
.coach-record-panel{
  margin:30px calc(var(--roster-pad-x) * -1) -36px;
  padding:clamp(25px,3.2vw,38px) var(--roster-pad-x);
  border-top:1px solid var(--hair);
  background:rgba(255,255,255,.54);
  animation:coach-records-in .25s ease both;
}
.coach-record-panel[hidden]{ display:none; }
.coach-record-panel-head{ display:flex; align-items:center; justify-content:space-between; gap:24px; }
.coach-record-panel-head p{ margin:0; font-size:10px; letter-spacing:.18em; color:var(--hud); }
.coach-record-panel-head h4{ margin:0; font-size:24px; letter-spacing:.1em; }
.coach-record-panel-head .coach-record-panel-role{
  margin-top:7px; font-size:12.5px; letter-spacing:.1em; color:var(--w5);
}
.coach-record-panel-body{ margin-top:24px; padding-top:20px; border-top:1px solid var(--hair-soft); }
.coach-record-panel-body > p{ margin:0 0 13px; font-size:10px; letter-spacing:.18em; color:var(--hud); }
.coach-record-panel-body ul{
  display:grid; gap:10px 26px; margin:0; padding:0; list-style:none;
}
@media (min-width:760px){
  .coach-record-panel-body ul{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
.coach-record-panel-body li{
  position:relative; padding-left:17px;
  font-size:13px; line-height:1.75; color:var(--w7);
}
.coach-record-panel-body li::before{
  content:""; position:absolute; left:0; top:.85em;
  width:7px; height:1px; background:var(--cyan);
}
@keyframes coach-records-in{
  from{ opacity:0; transform:translateY(-8px); }
  to{ opacity:1; transform:none; }
}

/* ---- ACCESS / FLOW ---- */
.two{ display:grid; gap:1px; background:var(--hair-soft); border:1px solid var(--hair-soft); }
@media (min-width:880px){ .two{ grid-template-columns:1.05fr .95fr; } }
@media (min-width:880px){ .two.two-solo{ grid-template-columns:1fr; } }
@media (min-width:880px){ .two.two-eq{ grid-template-columns:1fr 1fr; } }
.two-eq .cell{ display:flex; flex-direction:column; }
.two-eq .cell .linkline,
.two-eq .cell .mgo{ margin-top:auto; padding-top:28px; }
.two + .feature{ margin-top:34px; }
.feature + .two{ margin-top:34px; }
.feature-lead:last-child{ margin-bottom:0; }
.cell{
  --cell-pad:clamp(28px,3.4vw,44px);
  background:var(--surface); padding:var(--cell-pad);
}
.cell-label{ font-family:var(--mono); font-size:11.5px; letter-spacing:.2em; color:var(--hud); }
.cell h3{ margin:18px 0 24px; font-size:22px; font-weight:800; line-height:1.5; letter-spacing:.02em; }
.cell-lead{ margin:0; font-size:15px; line-height:2.05; color:var(--w7); }
.cell-label + .cell-lead{ margin-top:18px; }
.cell-lead + .cell-lead{ margin-top:1.2em; }
.cell-lead strong{ color:var(--cyan); font-weight:700; }
.datarow{ display:grid; grid-template-columns:6.4em 1fr; gap:10px 18px; padding:13px 0; border-top:1px solid var(--hair-soft); font-size:15px; }
.datarow b{ font-family:var(--mono); font-size:11.5px; letter-spacing:.12em; color:var(--w5); font-weight:400; padding-top:4px; }
.datarow span{ line-height:1.85; }
.cell-note{
  margin:13px 0 0; padding-top:13px;
  border-top:1px solid var(--hair-soft);
  font-size:13.5px; color:var(--w5); line-height:1.95;
}

/* VENUE cell（HOME）: 他の.cellと差をつけ、サイトの基調色（ダークネイビー）に合わせる */
.cell-venue{
  --w:  #f3f8ff;
  --w7: rgba(243, 248, 255, .86);
  --w5: rgba(243, 248, 255, .64);
  --w3: rgba(243, 248, 255, .40);
  --hud: #5cf3ff;
  --hair:      rgba(170, 214, 255, .20);
  --hair-soft: rgba(170, 214, 255, .11);
  background:#163a6e;
}

.cmds{ list-style:none; margin:0; padding:0; }
.cmd{ display:grid; grid-template-columns:auto 1fr; gap:0 22px; padding:22px 0; border-top:1px solid var(--hair-soft); }
.cmd:first-child{ border-top:none; padding-top:0; }
.cmd-en{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.16em; color:var(--hud);
  border:1px solid color-mix(in srgb, var(--hud) 40%, transparent); padding:5px 10px; height:max-content; white-space:nowrap;
}
.cmd h4{ font-size:18px; font-weight:800; }
.cmd p{ margin:10px 0 0; font-size:14.5px; color:var(--w7); line-height:2.05; }

/* ---- BLOG teaser ---- */
.notes{ border-top:1px solid var(--hair-soft); }
.note{
  display:grid; grid-template-columns:7.6em 1fr auto; gap:0 24px; align-items:center;
  padding:22px 0; text-decoration:none; color:var(--w);
  border-bottom:1px solid var(--hair-soft);
  transition:background .25s, padding .25s;
}
.note:hover{ background:rgba(45,85,255,.05); padding-left:14px; }
.note-date{ font-family:var(--mono); font-size:12.5px; color:var(--w5); letter-spacing:.06em; }
.note-title{
  font-size:16.5px; font-weight:600; line-height:1.7;
  display:inline-flex; align-items:center; flex-wrap:wrap; gap:8px 10px;
}
.note-flag{
  font-size:13px; letter-spacing:.12em; font-weight:700;
  color:#fff; background:#e2600a; padding:3px 10px; border-radius:4px;
}
.note-new{
  font-size:10px; letter-spacing:.14em; font-weight:700;
  color:#fff; background:var(--cyan); padding:2px 10px;
  border-radius:999px;
}
.note-cat{
  font-family:var(--mono); font-size:11px; letter-spacing:.1em; justify-self:end;
  padding:3px 10px; border:1px solid var(--hair); color:var(--w5);
}
.note-cat[data-c="新着情報"]{ color:var(--amber); border-color:rgba(224,144,0,.45); }
.note-cat[data-c="コラム"]{ color:var(--lane3); border-color:rgba(58,154,66,.4); }
.note-cat[data-c="専門知識"]{ color:var(--lane2); border-color:rgba(42,143,212,.4); }
@media (max-width:760px){
  .note{ grid-template-columns:1fr auto; row-gap:8px; padding:20px 0; }
  .note-date{ grid-column:1; }
  .note-title{ grid-column:1 / -1; }
  .note-cat{ grid-column:1 / -1; justify-self:start; }
}

/* =========================================================
   フィニッシュ / フッター
   ========================================================= */
.finish{ position:relative; padding:0; }
.finish-line{
  height:24px; width:100%;
  background:#fff;
  box-shadow:inset 0 0 0 1px var(--hair);
}
.finish-in{ text-align:center; padding:56px 0 90px; }
.finish-in .finish-num{
  font-family:var(--mono); font-size:clamp(60px,14vw,150px); font-weight:600; line-height:.9;
  color:var(--w); -webkit-text-stroke:0;
  margin:0; max-width:none;
}
.finish-in h2{ margin:26px 0 0; font-size:clamp(21px,3.4vw,34px); font-weight:800; }
.finish-in p{ margin:20px auto 0; max-width:32em; color:var(--w7); font-size:15.5px; line-height:2.05; }
.finish-actions{ margin-top:40px; display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }

.foot{ border-top:1px solid var(--hair); padding:56px 0 40px; }
.foot-grid{ display:grid; gap:36px; }
@media (min-width:820px){ .foot-grid{ grid-template-columns:1.2fr 1fr 1fr; } }
.foot h4{ font-family:var(--mono); font-size:11.5px; letter-spacing:.2em; color:var(--w5); margin-bottom:16px; font-weight:400; }
.foot-name{ font-size:16px; font-weight:800; letter-spacing:.16em; }
.foot ul{ list-style:none; margin:0; padding:0; }
.foot li{ padding:5px 0; }
.foot a{ color:var(--w7); text-decoration:none; font-size:14.5px; transition:color .2s; }
.foot a:hover{ color:var(--cyan); }
.foot .btn{
  font-size:13.5px; letter-spacing:.08em;
}
.foot .btn-ghost{ color:var(--w); }
.foot .btn-ghost:hover{ color:var(--cyan); border-color:var(--cyan); }
.foot .btn-line, .foot .btn-go{ color:#fff; }
.foot .btn-line:hover, .foot .btn-go:hover{ color:#fff; }
.foot-sns-h{ margin-top:28px; }
.sns{ display:flex; gap:12px; }
.sns a{ display:grid; place-items:center; width:40px; height:40px; border:1px solid var(--hair); transition:.25s; }
.sns a:hover{ border-color:var(--cyan); background:rgba(0,143,212,.08); color:inherit; }
.sns img{ width:18px; height:18px; object-fit:contain; }
.sns a[aria-label="X"] img{ filter:invert(1); }
.foot-btm{
  margin-top:44px; padding-top:22px; border-top:1px solid var(--hair-soft);
  display:flex; flex-wrap:wrap; gap:10px 24px; justify-content:space-between;
  font-family:var(--mono); font-size:11.5px; letter-spacing:.1em; color:var(--w5);
}

/* =========================================================
   下層ページ
   ========================================================= */
.subhead{ padding:calc(var(--head) + 76px) 0 56px; border-bottom:1px solid var(--hair-soft); position:relative; overflow:hidden; }
.subhead::before{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:linear-gradient(90deg,var(--blue),var(--cyan),transparent);
}
.crumb{ font-family:var(--mono); font-size:11.5px; letter-spacing:.12em; color:var(--w5); }
.crumb a{ color:var(--w5); text-decoration:none; }
.crumb a:hover{ color:var(--cyan); }
.subhead h1{ margin:22px 0 0; font-size:clamp(28px,5vw,50px); font-weight:800; letter-spacing:.01em; }
.subhead:has(+ .sheet){ padding-inline:26px; }
.subhead:has(+ .sheet) .wrap{ max-width:760px; padding-inline:0; }
.subhead p{ margin:18px 0 0; max-width:34em; color:var(--w7); font-size:15.5px; line-height:2.05; }
.sub-en{ font-family:var(--mono); font-size:12px; letter-spacing:.24em; color:var(--hud); }
.subhead .sheet-meta{
  display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center;
  margin:22px 0 0; max-width:none;
  font-family:var(--mono); font-size:12px; letter-spacing:.12em; color:var(--w5); line-height:1.4;
  padding:0; border:0;
}
.subhead .sheet-meta i{ font-style:normal; color:var(--hud); }
.subhead .sheet-meta .log-cat{ justify-self:start; }

.pagebody{ padding:76px 0 110px; }
.pagebody .phase-head{ margin-bottom:36px; }
.page-sec + .page-sec{ margin-top:72px; }
.page-sec + .join-cta{ margin-top:56px; }
@media (max-width:640px){
  .page-sec + .page-sec{ margin-top:56px; }
}

/* カレンダー */
.calbox{ border:1px solid var(--hair); background:var(--surface); padding:14px; }
.calbox iframe{ display:block; width:100%; height:min(82vh,800px); border:0; background:#fff; }
@media (max-width:767px){ .calbox iframe{ height:580px; } }

/* ルールブック（FAQ） */
.rules{ border-top:1px solid var(--hair-soft); }
.rule{ border-bottom:1px solid var(--hair-soft); }
.rule summary{
  display:grid; grid-template-columns:auto 1fr auto; gap:0 22px; align-items:center;
  padding:26px 4px; cursor:pointer; list-style:none;
}
.rule summary::-webkit-details-marker{ display:none; }
.rule-no{ font-family:var(--mono); font-size:12.5px; letter-spacing:.12em; color:var(--hud); }
.rule-q{ font-size:17px; font-weight:700; line-height:1.7; }
.rule-mark{
  display:block; width:8px; height:8px; margin-right:2px;
  border-right:1.6px solid var(--w3); border-bottom:1.6px solid var(--w3);
  transform:rotate(-45deg); transition:transform .45s cubic-bezier(.16,.84,.32,1);
}
.rule[open] .rule-mark{
  transform:rotate(45deg);
  border-color:var(--hud);
}
.rule[open] .rule-no{ text-shadow:0 0 14px rgba(92,243,255,.4); }
.rule-body{ overflow:hidden; }
.rule:not([open]) .rule-body{ height:0; }
.rule-a{
  position:relative;
  background:
    linear-gradient(100deg, transparent 36%, rgba(92,243,255,.18) 50%, transparent 64%),
    var(--paper);
  background-size:220% 100%, auto;
  background-position:120% 0, 0 0;
  color:var(--ink); padding:30px 32px; margin:0 0 26px;
  font-size:15.5px; line-height:2.05;
  overflow:hidden;
}
.rule[open] .rule-a::before,
.rule[open] .rule-a::after{ content:""; position:absolute; pointer-events:none; }
.rule[open] .rule-a::before{
  left:0; top:0; height:2px; width:100%;
  background:linear-gradient(90deg, var(--cyan), var(--hud) 46%, transparent);
  box-shadow:0 0 14px rgba(92,243,255,.45);
  transform-origin:left center;
}
.rule[open] .rule-a::after{
  left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(180deg, var(--hud), var(--cyan) 72%, transparent);
  transform-origin:top center;
}
.rule-a.is-reveal{
  animation:
    rule-sheet .72s cubic-bezier(.16,.84,.32,1) both,
    rule-shine 1.05s ease .06s both;
}
.rule-a.is-reveal::before{ animation:rule-line .82s cubic-bezier(.16,.84,.32,1) both; }
.rule-a.is-reveal::after{ animation:rule-rail .7s cubic-bezier(.22,.9,.3,1) both; }
.rule-a.is-reveal > *{
  animation:rule-item .56s cubic-bezier(.16,.84,.32,1) both;
}
.rule-a.is-reveal > *:nth-child(1){ animation-delay:.04s; }
.rule-a.is-reveal > *:nth-child(2){ animation-delay:.12s; }
.rule-a.is-reveal > *:nth-child(3){ animation-delay:.2s; }
.rule-a.is-reveal > *:nth-child(4){ animation-delay:.28s; }
.rule-a.is-reveal > *:nth-child(5){ animation-delay:.36s; }
.rule-a.is-reveal tbody tr{
  animation:rule-item .5s cubic-bezier(.16,.84,.32,1) both;
}
.rule-a.is-reveal tbody tr:nth-child(1){ animation-delay:.28s; }
.rule-a.is-reveal tbody tr:nth-child(2){ animation-delay:.36s; }
.rule-a.is-reveal tbody tr:nth-child(3){ animation-delay:.44s; }
.rule-a.is-reveal tbody tr:nth-child(4){ animation-delay:.52s; }
.rule-a.is-fold{
  animation:rule-sheet-out .34s ease both;
}
.rule-a.is-fold::before{ animation:rule-line-out .3s ease both; }
.rule-a.is-fold::after{ animation:rule-rail-out .3s ease both; }
@keyframes rule-sheet{
  from{ transform:translateY(-12px); }
  to{ transform:none; }
}
@keyframes rule-shine{
  from{ background-position:120% 0, 0 0; }
  to{ background-position:-80% 0, 0 0; }
}
@keyframes rule-line{
  from{ transform:scaleX(0); opacity:0; filter:brightness(2.2); }
  28%{ opacity:1; }
  to{ transform:scaleX(1); opacity:1; filter:none; }
}
@keyframes rule-rail{
  from{ transform:scaleY(0); opacity:0; }
  to{ transform:scaleY(1); opacity:1; }
}
@keyframes rule-item{
  from{ opacity:0; transform:translateY(14px); }
  to{ opacity:1; transform:none; }
}
@keyframes rule-sheet-out{
  from{ opacity:1; transform:none; }
  to{ opacity:0; transform:translateY(-10px); }
}
@keyframes rule-line-out{
  from{ transform:scaleX(1); opacity:1; }
  to{ transform:scaleX(0); opacity:0; }
}
@keyframes rule-rail-out{
  from{ transform:scaleY(1); opacity:1; }
  to{ transform:scaleY(0); opacity:0; }
}
@media (prefers-reduced-motion:reduce){
  .rule-a.is-reveal,
  .rule-a.is-reveal::before,
  .rule-a.is-reveal::after,
  .rule-a.is-reveal > *,
  .rule-a.is-reveal tbody tr,
  .rule-a.is-fold,
  .rule-a.is-fold::before,
  .rule-a.is-fold::after{ animation:none; }
}
.rule-a p{ margin:0 0 1em; }
.rule-a p:last-child{ margin-bottom:0; }
.rule-a .warn{ color:#8a3a00; }
.rule-a table{ width:100%; border-collapse:collapse; font-size:13px; margin:20px 0 0; background:#fff; }
.rule-a th,.rule-a td{ border:1px solid #cfc9b8; padding:10px 12px; text-align:left; }
.rule-a thead th{ background:var(--paper-2); font-family:var(--mono); font-size:11px; letter-spacing:.08em; }
.scrollx{ width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* 記録一覧（ブログ） */
.filters{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:44px; scroll-margin-top:calc(var(--head) + 16px); }
.filters button{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--w5); background:none; border:1px solid var(--hair); padding:9px 16px;
  cursor:pointer; transition:.25s;
}
.filters button:hover{ color:var(--w); border-color:var(--w3); }
.filters button.is-on{ color:#fff; background:var(--cyan); border-color:var(--cyan); }

.log{ border-top:1px solid var(--hair-soft); }
.log-item{ border-bottom:1px solid var(--hair-soft); }
.log-item a{
  display:grid; grid-template-columns:5.4em 7.6em 1fr 130px; gap:0 24px; align-items:center;
  padding:22px 4px; text-decoration:none; color:var(--w); transition:background .25s, padding .25s;
}
.log-item a:hover{ background:rgba(45,85,255,.05); padding-left:14px; }
.log-no{ font-family:var(--mono); font-size:12.5px; color:var(--w5); letter-spacing:.08em; }
.log-date{ font-family:var(--mono); font-size:12.5px; color:var(--w5); letter-spacing:.06em; }
.log-title{ font-size:16.5px; font-weight:600; line-height:1.7; }
.log-cat{ font-family:var(--mono); font-size:11px; letter-spacing:.1em; justify-self:end; padding:3px 10px; border:1px solid var(--hair); color:var(--w5); }
.log-cat[data-c="新着情報"]{ color:var(--amber); border-color:rgba(224,144,0,.45); }
.log-cat[data-c="コラム"]{ color:var(--lane3); border-color:rgba(58,154,66,.4); }
.log-cat[data-c="専門知識"]{ color:var(--lane2); border-color:rgba(42,143,212,.4); }
@media (max-width:760px){
  .log-item a{ grid-template-columns:auto 1fr; row-gap:8px; padding:20px 4px; }
  .log-no{ grid-column:1; } .log-date{ grid-column:2; justify-self:start; }
  .log-title{ grid-column:1 / -1; } .log-cat{ grid-column:1 / -1; justify-self:start; }
}
.pager{
  display:flex; align-items:center; justify-content:center; gap:8px;
  margin-top:52px; flex-wrap:wrap;
}
.pager[hidden]{ display:none !important; }
.pager-nums{ display:flex; gap:8px; }
.pager button{
  font-family:var(--mono); font-size:12px; letter-spacing:.14em;
  color:var(--w5); background:none; border:1px solid var(--hair);
  min-width:42px; height:42px; padding:0 12px; cursor:pointer;
  transition:.25s;
}
.pager .pager-nav{ min-width:76px; letter-spacing:.16em; }
.pager button:hover:not(:disabled){ color:var(--w); border-color:var(--w3); }
.pager button.is-on{ color:#fff; background:var(--cyan); border-color:var(--cyan); }
.pager button:disabled{ opacity:.32; cursor:default; }

/* =========================================================
   記事
   ========================================================= */
.sheet{ background:var(--void); color:var(--w); padding:56px 26px 40px; }
.sheet-in{
  --w: #111;
  --w7: #333;
  --w5: #555;
  --w3: #888;
  --ink: #111;
  --hud: #00a6dc;
  --hair: rgba(0, 0, 0, .16);
  --hair-soft: rgba(0, 0, 0, .1);
  position:relative; overflow:hidden;
  max-width:760px; margin-inline:auto;
  padding:clamp(32px,4.5vw,52px) clamp(22px,4vw,48px) 56px;
  background:#fff; color:#111;
}
.sheet-in::before{
  content:""; position:absolute; left:0; top:0; right:0; height:2px;
  background:linear-gradient(90deg, var(--cyan), var(--hud) 46%, transparent);
}
.sheet-in::after{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(180deg, var(--hud), var(--cyan) 72%, transparent);
}
.doc{ position:relative; font-size:16.5px; line-height:2.12; color:#111; }
.doc > p:first-child{ font-size:17.5px; }
.doc p{ margin:0 0 1.45em; }
.doc p:last-child{ margin-bottom:0; }
.doc img{
  display:block; width:100%; height:auto;
  margin:8px 0 28px; border-radius:2px;
  background:#fff; box-shadow:none;
}
.doc .aligncenter{ margin-inline:auto; }
.doc figure{ margin:8px 0 32px; }
.doc figure img{ margin:0; }
.doc .honma-main-photo{ margin:4px 0 38px; }
.doc .honma-main-photo img{
  aspect-ratio:4/3;
  object-fit:cover;
  object-position:center;
}
.doc .honma-race-photos{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 220px));
  justify-content:center;
  gap:14px 18px;
  margin:34px 0 40px;
}
.doc .honma-race-photos img{
  width:100%;
  aspect-ratio:2/3;
  object-fit:cover;
  object-position:center;
}
.doc .honma-main-photo figcaption,
.doc .honma-race-photos figcaption{
  margin-top:8px;
  font-family:var(--mono);
  font-size:11px;
  line-height:1.6;
  letter-spacing:.1em;
  color:#666;
}
.doc .honma-race-photos figcaption{
  grid-column:1 / -1;
  margin-top:-2px;
  text-align:center;
}
.doc .toyomasu-run-photo img{
  width:min(100%, 280px);
  margin-inline:auto;
}
.doc .toyomasu-lecture-photo img{
  width:min(100%, 520px);
  margin-inline:auto;
}
@media (max-width:640px){
  .doc .toyomasu-run-photo img{ width:min(100%, 220px); }
}
.doc a{ color:#111; overflow-wrap:anywhere; }
.doc a:hover{ color:var(--cyan); }
.doc h2,.doc h3,.doc h4,.doc h5{
  background:transparent !important; border:none !important;
  border-left:3px solid var(--hud) !important; border-radius:0 !important;
  padding:2px 0 2px 16px !important; margin:44px 0 16px !important;
  border-bottom:none !important;
  font-size:18px !important; font-weight:800; letter-spacing:.02em; color:#111;
  line-height:1.6;
}
.doc h2::before,.doc h3::before,.doc h4::before,.doc h5::before{ content:none; }
.doc-head{
  font-size:18px; font-weight:800; letter-spacing:.02em; line-height:1.6; color:#111;
  margin:44px 0 16px; padding:2px 0 2px 16px;
  border-left:3px solid var(--hud);
}
.doc-head strong{ font-weight:800; color:#111; }
.doc-callout{
  margin:0 0 1.6em; padding:16px 18px 16px 20px;
  background:#f5f5f5;
  border-left:3px solid var(--amber);
}
.doc-callout strong{ color:#111 !important; }
.doc table{ width:100%; border-collapse:collapse; font-size:13.5px; background:#fff; margin:8px 0 28px; }
.doc th,.doc td{ border:1px solid #ddd; padding:10px 12px; color:#111; }
.doc p[style*="color"],
.doc span[style*="color"]{ color:#111 !important; }
.doc ul,.doc ol{ padding-left:1.4em; margin:0 0 1.45em; }
.doc span[style*="border-radius: 20px"],
.doc span[style*="border-radius:20px"]{
  background:#f5f5f5 !important; border:1px solid #ddd !important;
  border-radius:2px !important; color:#111 !important;
  padding:6px 12px !important; font-size:13.5px !important; margin:0 8px 8px 0 !important;
}
.doc a[href*="lin.ee"]{
  display:inline-flex !important; align-items:center; justify-content:center;
  background-image:linear-gradient(to right, #00bfff 0%, #7fffd4 45%, #fffacd 100%) !important;
  background-size:200% auto !important; background-position:left center !important;
  color:#fff !important; text-shadow:1px 1px 1px #191970, -1px 1px 1px #191970, -1px -1px 0 #191970, 1px -1px 0 #191970 !important;
  border-radius:8px !important; padding:16px 32px !important;
  font-size:15px !important; font-weight:800 !important; letter-spacing:.08em !important;
  text-decoration:none !important;
}
.doc .sapio-info-card{
  background:#f7f7f7 !important; border:1px solid #ddd !important;
  border-radius:0 !important; padding:6px 22px 6px 24px !important; margin:8px 0 32px !important;
}
.doc .sapio-info-row{
  display:flex; flex-wrap:wrap; gap:4px 20px; align-items:baseline;
  padding:14px 0 !important; border-bottom:1px solid #e6e6e6 !important;
}
.doc .sapio-info-row:last-child{ border-bottom:none !important; }
.doc .sapio-info-label{ flex:0 0 6.5em; font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:#555; }
.doc .sapio-info-value{ flex:1 1 12em; min-width:0; color:#111; }
.doc .sapio-info-value span[style]{ color:#555 !important; }
#ez-toc-container{
  background:#f7f7f7; border:1px solid #ddd;
  padding:22px 24px; margin:0 0 36px; font-size:14px;
}
#ez-toc-container .ez-toc-title{
  font-family:var(--mono); font-size:11px; letter-spacing:.18em; color:#555;
  margin:0 0 12px; cursor:default !important;
}
#ez-toc-container .ez-toc-title-toggle{ display:none; }
#ez-toc-container ul{ list-style:none; margin:0; padding-left:0; }
#ez-toc-container ul ul{ padding-left:1.2em; }
#ez-toc-container li{ margin:8px 0; }
#ez-toc-container a{ color:#111; text-decoration:none; border-bottom:1px solid #ccc; }
#ez-toc-container a:hover{ color:var(--cyan); border-color:var(--cyan); }

.sheet-foot{
  max-width:760px; margin:0 auto; padding:28px 0 0;
  display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center;
  color:var(--w5);
}
.sheet-foot .mono{ color:var(--w5) !important; font-size:11px; letter-spacing:.12em; }
.sheet-foot .btn-paper{
  background:transparent; color:var(--w);
  border:1.5px solid color-mix(in srgb, var(--w) 42%, transparent);
  border-radius:8px;
}
.sheet-foot .btn-paper:hover{ border-color:var(--hud); color:var(--hud); }
.sheet-foot .btn-ghost{ border-color:color-mix(in srgb, var(--w) 42%, transparent); color:var(--w); }
.sheet-foot .btn-ghost:hover{ border-color:var(--cyan); background:color-mix(in srgb, var(--cyan) 14%, transparent); color:var(--cyan); }
.sheet-nav{ display:flex; flex-wrap:wrap; gap:10px; }

.post-cta{ padding:8px 0 90px; text-align:center; }
.post-cta p{ margin:0; color:var(--w5); font-size:14.5px; }
.post-cta p + p{ margin-top:22px; }

@media (max-width:640px){
  .phase{ padding:78px 0 120px; }
  #log.phase{ padding-bottom:104px; }
  .phase-head{ margin-bottom:56px; }
  .wrap{ padding-inline:20px; }
  .start{ padding-top:calc(var(--head) + var(--mbar) + 16px); padding-bottom:20px; }
  .start-zero-line.is-left{
    width:max(20px, calc((100% - min(var(--max), 100%)) / 2 + 20px));
  }
  .start-zero .phase-dist{ font-size:clamp(32px,12vw,48px); }
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
  *{ animation:none !important; }
}

/* ---- CLASS：詳細ページへの導線（TOP 40m） ---- */
.lane-more{ margin:22px 0 0; padding-top:18px; border-top:1px solid var(--hair-soft); }
.lane-more.is-flush{ padding-top:0; border-top:0; }
.lane-more a{
  display:flex; align-items:center; justify-content:space-between;
  width:100%; gap:10px;
  font-size:13.5px; font-weight:700; letter-spacing:.06em;
  color:var(--w); text-decoration:none;
  border:1.5px solid color-mix(in srgb, var(--w) 48%, transparent);
  background:color-mix(in srgb, var(--w) 10%, transparent);
  border-radius:8px; padding:12px 16px; transition:.25s;
}
.lane-more a .arw{ color:var(--hud); transition:transform .3s; }
.lane-more a:hover{
  color:var(--w);
  border-color:var(--hud);
  background:color-mix(in srgb, var(--hud) 16%, transparent);
}
.lane-more a:hover .arw{ transform:translateX(4px); }
/* HOME 測定会：詳細ページへの導線（クラス詳細バーとは別） */
.mgo{ margin:28px 0 0; text-align:center; }
.mgo a{
  display:inline-flex; align-items:center; gap:14px;
  padding:14px 18px 14px 16px;
  background:#0f274c; color:#f3f8ff;
  text-decoration:none;
  font-size:14.5px; font-weight:800; letter-spacing:.06em;
  border-radius:2px;
  box-shadow:inset 3px 0 0 #00a6dc;
  transition:background .25s, box-shadow .25s;
}
.mgo-kicker{
  font-size:10.5px; font-weight:500; letter-spacing:.2em; color:#5cf3ff;
}
.mgo-arw{ color:#5cf3ff; transition:transform .3s; }
.mgo a:hover,
.mgo a:focus-visible{
  background:#163a6e;
  box-shadow:inset 3px 0 0 #5cf3ff;
  color:#f3f8ff;
}
.mgo a:hover .mgo-arw,
.mgo a:focus-visible .mgo-arw{ transform:translateX(4px); }

.classlink{
  margin-top:34px; border:1px solid var(--hair); background:var(--surface);
  padding:clamp(26px,3vw,40px);
  display:grid; gap:26px 44px; align-items:center;
}
@media (min-width:900px){ .classlink{ grid-template-columns:1.25fr .75fr; } }
.classlink-tag{ font-size:11.5px; letter-spacing:.2em; color:var(--hud); }
.classlink-lead{ margin:14px 0 0; font-size:15.5px; line-height:2.05; color:var(--w7); max-width:40em; }
.classlink-lead strong{ color:var(--w); }
.classlink-act{ display:flex; flex-direction:column; align-items:flex-start; gap:16px; }
@media (min-width:900px){ .classlink-act{ align-items:flex-end; text-align:right; } }
.classlink-note{ margin:0; font-size:13px; line-height:1.95; color:var(--w5); }

/* ---- CLASS：写真を軸にしたクラス案内 ---- */

/* レーン選択（ページ内インデックス） */
.class-page-index{
  display:grid; margin-bottom:clamp(40px,5vw,58px);
  border-top:1px solid var(--hair);
}
.class-page-index a{
  --index-accent:var(--cyan);
  position:relative;
  display:grid; grid-template-columns:auto 1fr auto; gap:3px 16px; align-items:center;
  padding:18px 10px 18px 18px; border-bottom:1px solid var(--hair);
  color:var(--w); text-decoration:none;
  transition:padding .22s ease, background .22s ease;
}
.class-page-index a:nth-child(1){ --index-accent:#ff9b5e; }
.class-page-index a:nth-child(2){ --index-accent:#58bfff; }
.class-page-index a:nth-child(3){ --index-accent:#72d5a3; }
.class-page-index a::before{
  content:""; position:absolute; left:0; top:16px; bottom:16px;
  width:2px; background:var(--index-accent);
}
.class-page-index a:hover{
  padding-left:24px; background:color-mix(in srgb,var(--index-accent) 10%,transparent);
}
.class-page-index span{ grid-row:1 / 3; font-size:19px; color:var(--index-accent); }
.class-page-index b{ font-size:14.5px; letter-spacing:.06em; }
.class-page-index small{ grid-column:3; grid-row:1 / 3; font-size:11.5px; color:var(--w5); }
@media (min-width:760px){
  .class-page-index{ grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--hair); }
  .class-page-index a{
    grid-template-columns:auto 1fr; padding:19px 18px;
    border-bottom:0; border-left:1px solid var(--hair);
  }
  .class-page-index a:first-child{ border-left:0; }
  .class-page-index a::before{ left:0; right:0; top:0; bottom:auto; width:auto; height:2px; }
  .class-page-index a:hover{ padding-left:18px; }
  .class-page-index small{ grid-column:2; grid-row:2; }
}

/* ---- クラスカード ---- */
.class-catalog{ padding:clamp(70px,8vw,110px) 0 clamp(92px,10vw,124px); }

.class-card{
  --class-accent:#1688d8;
  --ink-1:#14203c;
  --ink-2:rgba(20,32,60,.86);
  --ink-3:rgba(20,32,60,.64);
  --line:rgba(20,32,60,.16);
  --line-strong:rgba(20,32,60,.28);

  position:relative; display:grid; overflow:hidden; scroll-margin-top:88px;
  background:#f5f9fd; color:var(--ink-1);
  box-shadow:0 18px 52px rgba(0,10,32,.28);
}
.class-card + .class-card{ margin-top:clamp(34px,4.4vw,58px); }

.class-card-junior{        --class-accent:#c9551d; }
.class-card-junior-athlete{ --class-accent:#0f74bb; }
.class-card-athlete{       --class-accent:#0d7a55; }

@media (min-width:900px){
  .class-card{ grid-template-columns:minmax(0,.86fr) minmax(0,1fr); }
}

/* 写真 */
.class-card-photo{
  position:relative; margin:0; overflow:hidden;
  background:#c3d6e8; aspect-ratio:16 / 10;
}
@media (min-width:900px){ .class-card-photo{ aspect-ratio:auto; } }
.class-card-photo img{
  position:absolute; inset:0; display:block; width:100%; height:100%;
  object-fit:cover; filter:contrast(1.03) saturate(.96);
}
.class-card-junior        .class-card-photo img{ object-position:center bottom; transform:scale(1.65); transform-origin:50% 100%; }
/* ジュニアの写真は子どもたちが下寄りのため、画面幅ごとに寄りを変える */
@media (max-width:899px){
  .class-card-junior .class-card-photo img{ object-position:center 96%; transform:none; }
}
@media (max-width:560px){
  .class-card-junior .class-card-photo img{ object-position:center bottom; transform:scale(1.10); transform-origin:50% 100%; }
}
.class-card-junior-athlete .class-card-photo img{ object-position:center 64%; }
.class-card-athlete       .class-card-photo img{ object-position:center 60%; }

/* 写真と本文をつなぐアクセント */
.class-card-photo::before{
  content:""; position:absolute; z-index:3; background:var(--class-accent);
  left:0; right:0; bottom:0; height:3px;
}
@media (min-width:900px){
  .class-card-photo::before{ left:auto; top:0; bottom:0; width:3px; height:auto; }
}
/* 番号を読ませるための影 */
.class-card-photo::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg,rgba(6,20,44,.52),rgba(6,20,44,0) 38%,rgba(6,20,44,0) 62%,rgba(6,20,44,.34));
}
.class-card-photo figcaption{
  position:absolute; z-index:2;
  left:clamp(20px,2.4vw,30px); top:clamp(16px,2vw,24px);
  display:flex; align-items:center; gap:13px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.2em; color:#fff;
}
.class-card-photo figcaption span{
  font-size:clamp(40px,4.4vw,56px); line-height:1;
  color:transparent; -webkit-text-stroke:1.3px rgba(255,255,255,.9);
}

/* 本文 */
.class-card-body{
  display:flex; flex-direction:column;
  padding:clamp(28px,3.4vw,46px) clamp(24px,3.2vw,44px) clamp(32px,3.6vw,48px);
  background:linear-gradient(180deg,color-mix(in srgb,var(--class-accent) 6%,transparent),transparent 260px);
}

.class-card-en{
  order:1; margin:0;
  font-size:11.5px; font-weight:400; letter-spacing:.2em; color:var(--class-accent);
}
.class-card-body h2{
  order:2; margin:11px 0 0; color:var(--ink-1);
  font-size:clamp(23px,2.3vw,30px); line-height:1.38; letter-spacing:.02em;
}
.class-card-target{
  order:3; display:inline-flex; align-items:center; width:max-content; margin:15px 0 0;
  padding:7px 15px;
  border:1px solid color-mix(in srgb,var(--class-accent) 46%,transparent);
  background:color-mix(in srgb,var(--class-accent) 12%,transparent);
  color:var(--class-accent);
  font-size:12.5px; font-weight:700; letter-spacing:.06em; line-height:1.5;
}

/* リード文（クラスの説明）：短いアクセント罫のみ・左端は他と揃える */
.class-card-feature{
  order:4; position:relative; margin:27px 0 0; padding:19px 0 0;
  border:0; background:none;
}
.class-card-feature::before{
  content:""; position:absolute; left:0; top:0;
  width:34px; height:3px; background:var(--class-accent);
}
.class-card-feature .mono{ display:none; }
.class-card-feature p:last-child{
  margin:0; max-width:34em;
  font-size:15.5px; line-height:2.05; letter-spacing:.02em;
  color:var(--ink-2);
}

/* スペック＋料金 */
.class-card-data{
  --pad:clamp(18px,1.9vw,24px);
  order:6; display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  margin:26px 0 0; padding:0 var(--pad); overflow:hidden;
  border:1px solid var(--line-strong); background:rgba(255,255,255,.78);
}
.class-card-data::before{ content:none; }
.class-card-data > div{ padding:17px 0; border-bottom:1px solid var(--line); }
.class-card-data > div:nth-child(1){ padding-right:20px; }
.class-card-data > div:nth-child(2){ padding-left:20px; border-left:1px solid var(--line); }
.class-card-data .class-card-count{ grid-column:1 / -1; padding-left:0; padding-right:0; border-left:0; }
.class-card-data dt{
  font-family:var(--sans); font-size:12px; font-weight:600;
  letter-spacing:.08em; color:var(--ink-3);
}
.class-card-data dd{ margin:7px 0 0; font-size:15px; line-height:1.85; color:var(--ink-1); }

.class-card-data .class-card-fee{
  grid-column:1 / -1;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  margin:0 calc(-1 * var(--pad)); padding:18px var(--pad);
  border:0; border-bottom:0;
  background:color-mix(in srgb,var(--class-accent) 12%,transparent);
}
.class-card-fee dt{ font-size:13px; font-weight:700; color:var(--ink-2); letter-spacing:.06em; }
.class-card-fee dd{ margin:0; font-size:14px; color:var(--ink-2); }
.class-card-fee strong{
  margin-right:6px; font-size:clamp(23px,2.3vw,28px);
  color:var(--class-accent); letter-spacing:.01em;
}

/* おすすめ */
.class-card-recommend{
  order:5; margin:26px 0 0; padding:20px 0 0;
  border:0; border-top:1px solid var(--line);
  background:none;
}
.class-card-recommend h3{
  margin:0; font-size:15px; letter-spacing:.04em; color:var(--ink-1);
}
.class-card-recommend ul{
  display:grid; grid-template-columns:1fr; gap:12px; margin:15px 0 0; padding:0; list-style:none;
}
.class-card-recommend li{
  position:relative; padding-left:24px;
  font-size:14px; line-height:1.9; color:var(--ink-2);
}
.class-card-recommend li::before{
  content:""; position:absolute; left:1px; top:.46em;
  width:11px; height:6.5px; background:none;
  border-left:1.8px solid var(--class-accent);
  border-bottom:1.8px solid var(--class-accent);
  transform:rotate(-45deg);
}

@media (max-width:560px){
  .class-page-index a{ grid-template-columns:auto 1fr; }
  .class-page-index small{ grid-column:2; grid-row:2; }
  .class-card-photo{ aspect-ratio:4 / 3; }
  .class-card-photo figcaption span{ font-size:38px; }
  .class-card-data{ grid-template-columns:1fr; }
  .class-card-data > div:nth-child(1){ padding-right:0; }
  .class-card-data > div:nth-child(2){ padding-left:0; border-left:0; }
  .class-card-data > div{ padding:15px 0; }
  .class-card-data .class-card-fee{ padding:16px var(--pad); }
  .class-card-recommend{ padding:19px 18px; }
}

.class-common{
  --w:#14203c; --w7:rgba(20,32,60,.86); --w5:rgba(20,32,60,.64);
  --hair:rgba(20,32,60,.28); --hair-soft:rgba(20,32,60,.16); --hud:var(--ink);
  margin-top:76px; padding:0 clamp(24px,4vw,50px);
  border:1px solid var(--hair); background:var(--surface); color:var(--w);
}
.class-common-grid{ display:grid; }
@media (min-width:760px){ .class-common-grid{ grid-template-columns:repeat(3,1fr); } }
.class-common-grid > div{ padding:27px 0; }
@media (min-width:760px){
  .class-common-grid > div{ padding:27px 26px; border-left:1px solid var(--hair-soft); }
  .class-common-grid > div:first-child{ padding-left:0; border-left:0; }
}
@media (max-width:759px){ .class-common-grid > div + div{ border-top:1px solid var(--hair-soft); } }
.class-common-grid span{ font-size:10px; letter-spacing:.17em; color:var(--hud); }
.class-common-grid h3{ margin:12px 0 0; font-size:18px; }
.class-common-grid p{ margin:13px 0 0; font-size:14px; color:var(--w7); }
.class-common-grid strong{ margin-right:5px; font-size:21px; color:var(--cyan); }
.class-common-grid .class-common-detail{
  margin-top:16px; padding-top:13px; border-top:1px solid var(--hair-soft);
  font-size:11.5px; line-height:1.75; color:var(--w5);
}
.class-opening-note{
  display:grid; gap:8px 28px; margin-top:76px; padding:20px 24px;
  border:1px solid var(--hair); border-left:3px solid var(--cyan);
  background:rgba(8,28,61,.58);
}
@media (min-width:700px){ .class-opening-note{ grid-template-columns:140px 1fr; align-items:center; } }
.class-opening-note span{ font-size:12px; font-weight:700; letter-spacing:.05em; }
.class-opening-note p{ margin:0; font-size:13px; line-height:1.85; color:var(--w7); }
.class-opening-note + .class-common{ margin-top:34px; }
.class-common + .two{ margin-top:34px; }

.class-final{ margin-top:72px; padding:58px 24px; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); text-align:center; }
.class-final > .mono{ margin:0; font-size:10.5px; letter-spacing:.23em; color:var(--hud); }
.class-final h2{ margin:15px 0 0; font-size:clamp(25px,3.4vw,40px); }
.class-final p:last-child{ margin:29px 0 0; }

/* ---- CLASS 詳細ページ ---- */
.cdet{
  margin-top:22px; border:1px solid var(--hair); background:var(--surface);
  scroll-margin-top:96px;
}
.cdet-head{
  display:grid; grid-template-columns:auto 1fr; gap:8px 22px; align-items:center;
  padding:clamp(24px,2.6vw,34px) clamp(22px,2.6vw,36px);
  border-bottom:1px solid var(--hair-soft); position:relative; overflow:hidden;
}
@media (min-width:900px){ .cdet-head{ grid-template-columns:auto 1fr auto; } }
.cdet-head::before{
  content:""; position:absolute; inset:0; opacity:.13; pointer-events:none;
  background:repeating-linear-gradient(90deg, transparent 0 15px, rgba(18,40,84,.12) 15px 16px);
}
.cdet-no{
  position:relative; font-size:56px; font-weight:600; line-height:1;
  color:transparent; -webkit-text-stroke:1.5px currentColor;
}
.cdet-id{ position:relative; }
.cdet-en{ margin:0; font-size:11.5px; letter-spacing:.2em; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.cdet-flag{ font-size:10.5px; letter-spacing:.14em; color:#2a1a00; background:var(--amber); padding:3px 9px; font-weight:700; }
.cdet-id h2{ margin:10px 0 0; font-size:clamp(21px,2.4vw,27px); font-weight:800; letter-spacing:.02em; }
.cdet-alias{ margin:8px 0 0; font-size:12px; letter-spacing:.06em; color:var(--w5); }
.cdet-aim{
  position:relative; margin:0; font-size:14.5px; line-height:1.9; color:var(--w7);
  border-left:2px solid currentColor; padding-left:18px; max-width:22em;
  grid-column:1 / -1; margin-top:4px;
}
@media (min-width:900px){ .cdet-aim{ grid-column:auto; margin-top:0; } }
.lane-1.cdet .cdet-no, .lane-1.cdet .cdet-en{ color:var(--lane1); }
.lane-2.cdet .cdet-no, .lane-2.cdet .cdet-en{ color:var(--lane2); }
.lane-3.cdet .cdet-no, .lane-3.cdet .cdet-en{ color:var(--lane3); }
.lane-1.cdet .cdet-head{ background:linear-gradient(180deg, rgba(255,191,127,.13), transparent); }
.lane-2.cdet .cdet-head{ background:linear-gradient(180deg, rgba(143,211,255,.13), transparent); }
.lane-3.cdet .cdet-head{ background:linear-gradient(180deg, rgba(177,255,141,.13), transparent); }
.lane-1.cdet .cdet-aim{ border-color:rgba(255,191,127,.6); }
.lane-2.cdet .cdet-aim{ border-color:rgba(143,211,255,.6); }
.lane-3.cdet .cdet-aim{ border-color:rgba(177,255,141,.6); }

.cdet-body{ display:grid; gap:1px; background:var(--hair-soft); }
@media (min-width:900px){ .cdet-body{ grid-template-columns:1.15fr .85fr; } }
.cdet-main, .cdet-side{ background:var(--surface); padding:clamp(24px,2.6vw,36px); }
.cdet-lead{ margin:0 0 30px; font-size:15.5px; line-height:2.1; color:var(--w7); }
.cdet-lead strong{ color:var(--w); }
.cdet-sub{ margin:0 0 14px; font-size:11px; letter-spacing:.2em; color:var(--w3); }
.cdet-main .cmds{ margin-top:0; }
.cdet-side .datarow:first-of-type{ border-top:1px solid var(--hair-soft); }
.cdet-act{ margin:30px 0 0; }

/* ---- 比較表 ---- */
.cmp-wrap{ overflow-x:auto; margin-top:18px; border:1px solid var(--hair-soft); }
.cmp{ width:100%; min-width:620px; border-collapse:collapse; background:var(--surface); }
.cmp th, .cmp td{
  padding:16px 18px; text-align:left; font-size:14px; line-height:1.85;
  border-bottom:1px solid var(--hair-soft); border-right:1px solid var(--hair-soft);
  vertical-align:top;
}
.cmp th:last-child, .cmp td:last-child{ border-right:0; }
.cmp thead th{
  font-family:var(--mono); font-size:12px; letter-spacing:.1em; font-weight:600;
  color:var(--w); background:var(--surface-2);
}
.cmp thead th:nth-child(2){ color:var(--lane1); }
.cmp thead th:nth-child(3){ color:var(--lane2); }
.cmp thead th:nth-child(4){ color:var(--lane3); }
.cmp tbody th{
  font-size:12.5px; letter-spacing:.06em; font-weight:600; color:var(--w5);
  background:var(--surface-2); white-space:nowrap;
}
.cmp tbody td{ color:var(--w7); }
.cmp tbody tr:last-child th, .cmp tbody tr:last-child td{ border-bottom:0; }