:root{
  /* Field Instrument v2 — light: 墨とインクの精密な計器。金は糸だけ */
  --green:#3c7a5a; --green-l:#3c7a5a; --bg:#faf9f6; --card:#faf9f6;
  --ink:#1b1b18; --sub:#5f6359; --line:#dcd7c8; --line2:#e8e4d8;
  --soft:#ece8dc; --inpBg:#eeeade; --hdr:#1b1b18; --title:#1b1b18;
  --advBg:#ece8dc; --advLine:#dcd7c8;
  --gold:#fdd835; --red:#c62828; --blue:#1565c0;
  /* 金は糸（線・ドット・ライブ数値の文字色）専用。面（背景）には使わない */
  --accent:#b08a2e; --accent-strong:#8a6508;
  /* 反転 CTA・選択状態: light = 墨面＋白文字 */
  --invert-bg:#1b1b18; --invert-fg:#f2f0e8;
  --danger:#c62828; --status-ok:#0f9d58; --status-warn:#c62828; --status-hold:#8a6d1d;
  --paper:#faf9f6; --paper2:#ece8dc; --ink2:#1b1b18;
  --teal:#0f766e; --amber:#b56b1f; --navy:#24537b; --mint:#ece8dc;
  --shadow-raised:0 8px 24px rgba(27,27,24,.14);
  --shadow-none:none;
  --shadow:var(--shadow-none); --glass:rgba(250,249,246,.9);
  --shadow-soft:var(--shadow-none);
  --press-shadow:var(--shadow-none);
  --chrome-bg:rgba(250,249,246,.92); --chrome-border:rgba(27,27,24,.12);
  --page-top:#faf9f6; --page-mid:#faf9f6;
  --logo-surface-a:#faf9f6; --logo-surface-b:#faf9f6;
  --target-surface-a:#eeeade; --target-surface-b:#e6e2d4;
  --radius-card:8px; --radius-panel:8px; --radius-control:6px;
  --ease-app:cubic-bezier(.2,.8,.2,1);
  --ease-fluid:cubic-bezier(.22,1,.36,1);
  --motion-fast:.16s; --motion-med:.34s; --motion-fluid:.42s;
  /* design tokens — spacing */
  --space-1:4px; --space-2:6px; --space-3:8px; --space-4:10px;
  --space-5:12px; --space-6:14px; --space-7:16px; --space-8:20px;
  --space-9:24px; --space-10:32px;
  /* design tokens — typography */
  --font-size-xs:11px; --font-size-sm:12px; --font-size-md:14px;
  --font-size-lg:16px; --font-size-xl:20px;
  --line-height-tight:1.25; --line-height-normal:1.5; --line-height-relaxed:1.7;
  /* design tokens — font-weight（全画面で段階を統一。ラベル/見出し=500、本文=400、主役数値=700） */
  --fw-body:400; --fw-label:500; --fw-emphasis:600; --fw-figure:700;
  /* design tokens — shadow / tap / layout */
  --shadow-card:var(--shadow-none);
  --shadow-floating:var(--shadow-raised);
  --tap-target-min:44px; --tap-target-comfortable:48px;
  --content-max-width:760px;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0; overflow-x:hidden;}
html{background:var(--bg);}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",Meiryo,sans-serif;
  min-height:100dvh;
  background:var(--bg);
  color:var(--ink); font-size:15px;
  padding-bottom:96px;
  padding-bottom:calc(88px + env(safe-area-inset-bottom));
  -webkit-user-select:none; user-select:none; -webkit-touch-callout:none;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
input, textarea{-webkit-user-select:auto; user-select:auto;}
button,.chip,.listItem,summary,.btn,.tinyAction,.sc,.npad button{touch-action:manipulation;}
/* 桁揃え: 統計・スコア系の数値表示に継承させる共通クラス。主役数値のweight段階もここで統一する */
.tnum,.stat b,.insightTile b,.heroMetric b,.liveCell b,
.decisionCard b,.histTrendValue,.listItem .big,.kv,.lensCard b,.nativePill b{
  font-variant-numeric:tabular-nums;
  font-weight:var(--fw-figure);
}
button:focus-visible,.chip:focus-visible,.listItem:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid var(--accent); outline-offset:2px;
}
header.app{
  background:var(--chrome-bg); color:var(--ink); padding:10px 16px;
  padding-right:58px;
  padding-top:10px;
  padding-top:calc(10px + env(safe-area-inset-top));
  display:flex; align-items:center; gap:8px;
  position:sticky; top:0; z-index:20;
  border-bottom:1px solid var(--chrome-border);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
}
header.app h1{font-size:13px; margin:0; font-weight:var(--fw-label); letter-spacing:.09em; color:var(--sub);}
header.app .sub{display:none; font-size:11px; opacity:.9;}
header.app .appLogo{
  width:34px; height:34px; border-radius:8px; display:flex; align-items:center; justify-content:center;
  background:var(--logo-surface-a); border:1px solid var(--chrome-border); color:var(--ink); font-size:20px; flex:0 0 auto;
  overflow:hidden;
}
header.app .appLogo img{width:25px; height:25px; display:block;}
header.app .appIdentity{min-width:0; flex:1 1 auto;}
header.app .appIdentity h1,header.app .appIdentity .sub{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.statusDot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(176,138,46,.18);flex:0 0 auto;}
.statusDot.native{background:var(--green);box-shadow:0 0 0 3px rgba(99,176,136,.18);}
main{width:100%; max-width:560px; min-width:0; margin:0 auto; padding:12px 10px 14px;}
.bootFallback{
  min-height:52vh; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
  text-align:center; color:var(--ink); padding:28px 14px;
  opacity:0; visibility:hidden; pointer-events:none;
  /* motion:注意 — 起動が既定より遅い場合のみ、フォールバック文言を遅延表示して誤操作を防ぐ */
  animation:bootFallbackDelay .01s steps(1,end) 2.8s forwards;
}
@keyframes bootFallbackDelay{to{opacity:1; visibility:visible; pointer-events:auto;}}
.bootFallback .bootIcon{
  width:54px; height:54px; border-radius:8px; display:flex; align-items:center; justify-content:center;
  background:var(--card); border:1px solid var(--line); box-shadow:none; font-size:26px;
}
.bootFallback h2{font-size:18px; margin:4px 0 0; color:var(--title);}
.bootFallback p{font-size:12px; color:var(--sub); line-height:1.65; margin:0; max-width:320px;}
.bootFallback .bootReload{width:auto; min-width:148px; text-decoration:none; margin-top:4px;}
@keyframes appRise{
  from{opacity:.96; transform:translateY(6px) scale(.992);}
  to{opacity:1; transform:translateY(0) scale(1);}
}
@keyframes scorePop{
  0%{opacity:.55; transform:scale(.86);}
  58%{opacity:1; transform:scale(1.06);}
  100%{opacity:1; transform:scale(1);}
}
@keyframes markPop{
  0%{opacity:.4; transform:scale(.72);}
  62%{opacity:1; transform:scale(1.08);}
  100%{opacity:1; transform:scale(1);}
}
@keyframes impactFlash{
  0%{filter:drop-shadow(0 0 0 rgba(23,100,61,0)); opacity:.58;}
  48%{filter:drop-shadow(0 0 5px rgba(23,100,61,.34)); opacity:1;}
  100%{filter:drop-shadow(0 0 0 rgba(23,100,61,0)); opacity:.92;}
}
@keyframes decisionSlide{
  from{opacity:.94; transform:translateY(6px);}
  to{opacity:1; transform:translateY(0);}
}
/* カード文法: 白面＋影ではなく地と同化した面＋hairline罫線＋余白（スコアカードの紙の文法） */
.card{
  background:var(--card); border:none; border-top:2px solid var(--line);
  border-radius:0; padding:15px; margin-bottom:12px; box-shadow:none;
}
@supports (content-visibility:auto){
  main > .card,
  main > .launchPanel,
  main > .pageHero,
  main > .insightStrip{
    content-visibility:auto;
    contain-intrinsic-size:auto 240px;
  }
}
/* ラベル様式に統一（v2 0節の再監査）: セクション見出しは本文より控えめな刻印風ラベルにする */
.card h2{font-size:12px; letter-spacing:.04em; font-weight:var(--fw-label); margin:0 0 10px; color:var(--sub); display:flex; align-items:center; justify-content:space-between;}
.card h2 .mini{font-size:11px; color:var(--sub); font-weight:normal; letter-spacing:0;}
/* アイコン付き見出し共通: アイコン＋テキストを1つの左詰めブロックにまとめ、.mini 等の右側要素とだけ両端寄せする */
.h2Icon{display:inline-flex; align-items:center; gap:5px; min-width:0;}
label.f{display:block; font-size:12px; color:var(--sub); margin:10px 0 4px;}
.inp, select.inp, textarea.inp{
  width:100%; min-height:48px; padding:12px 13px; border:1px solid var(--line2); border-radius:var(--radius-control);
  font-size:16px; background:var(--inpBg); color:var(--ink);
  box-shadow:none;
  /* motion:状態 — フォーカス時の枠色・背景変化で入力対象になったことを知覚させる */
  transition:background var(--motion-fast), border-color var(--motion-fast), box-shadow var(--motion-fast);
}
textarea.inp{resize:vertical; min-height:56px;}
.inp{min-width:0; max-width:100%;}
input.inp[type="date"]{-webkit-appearance:none; appearance:none; display:block; background:var(--inpBg); min-height:48px;}
/* select: appearance:none + 自前シェブロン（inline SVG） */
select.inp{
  padding-right:34px;
  -webkit-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%235f6359' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; background-size:14px;
}
html.dark select.inp,html.auto select.inp{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%239aa396' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.inp:focus:not(:focus-visible){background:var(--card); border-color:var(--accent); box-shadow:0 0 0 3px rgba(176,138,46,.16); outline:none;}
.choiceManual{margin-top:6px;}
.choiceManual.is-hidden{display:none;}
.row{display:flex; gap:8px;} .row>*{flex:1; min-width:0;}
.chips{display:flex; flex-wrap:wrap; gap:8px; min-width:0; max-width:100%;}
.chip{
  min-height:44px; padding:9px 14px; border-radius:6px; border:1px solid var(--line);
  max-width:100%; background:var(--soft); color:var(--ink); font-size:14px; cursor:pointer; user-select:none;
  /* motion:状態 — 選択/押下による背景・枠色の切り替えを滑らかにして選択結果を知覚させる */
  transition:transform var(--motion-fast), background var(--motion-fast), box-shadow var(--motion-fast), border-color var(--motion-fast);
}
/* motion:因果 — 押下で沈む（共通の縮小フィードバック。.btn はさらに下の個別ルールで沈み込みを強調） */
.chip:active,.btn:active,nav.tabs button:active,.listItem:active,.tinyAction:active,.sc:active{transform:scale(.975);}
/* 選択状態は金の面ではなく反転（墨面/紙面）で示す */
.chip.on{background:var(--invert-bg); border-color:var(--invert-bg); color:var(--invert-fg); font-weight:var(--fw-emphasis); box-shadow:none;}
/* button タグ化したチップの UA デフォルト打ち消し（見た目は従来の div と同一に保つ） */
button.chip{display:inline-flex; align-items:flex-start; margin:0; font-family:inherit; font-weight:inherit; line-height:inherit; text-align:inherit; -webkit-appearance:none; appearance:none;}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:48px; padding:12px 16px; border-radius:8px; border:none; font-size:15px; font-weight:var(--fw-emphasis);
  background:var(--invert-bg); color:var(--invert-fg); cursor:pointer; width:100%;
  box-shadow:none;
  transition:transform var(--motion-fast), filter var(--motion-fast), background var(--motion-fast), box-shadow var(--motion-fast);
}
/* motion:因果 — 押下で沈む（結果がどこで受理されたか手応えで示す） */
.btn:active{filter:brightness(.94); transform:translateY(1px) scale(.982); box-shadow:inset 0 2px 4px rgba(0,0,0,.12);}
.btn.sec{background:transparent; color:var(--title); border:1.5px solid var(--line); box-shadow:none;}
.btn.ghost{background:var(--soft); color:var(--ink); box-shadow:none; border:1px solid transparent;}
.btn.danger{background:transparent; color:var(--danger); border:1.5px solid var(--danger);}
.btn.sm{padding:8px 12px; font-size:13px; width:auto; border-radius:8px;}
.btn:disabled{opacity:.4;}
.btnrow{display:flex; gap:8px; margin-top:10px;} .btnrow .btn{flex:1;}
}
.homeActions{
  display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:4px 0 12px;
  /* motion:因果 — 記録ホームを開いた結果として主要導線ボタンが現れる */
  animation:appRise .42s cubic-bezier(.2,.8,.2,1) .04s both;
}
.homeAction{
  min-height:60px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--ink);
  padding:9px 12px; text-align:center; cursor:pointer; box-shadow:none;
  /* motion:因果 — 押下で沈む手応えを滑らかにする */
  transition:transform var(--motion-fast), box-shadow var(--motion-fast), background var(--motion-fast), border-color var(--motion-fast);
}
.homeAction b{display:block; font-size:13.5px; line-height:1.2; color:inherit;}
.homeAction span{display:block; font-size:10.5px; line-height:1.25; color:var(--sub); margin-top:3px;}
/* motion:因果 — 押下で沈む */
.homeAction:active{transform:translateY(1px) scale(.982);}
.homeAction:disabled{opacity:.45; cursor:not-allowed;}
/* 「前回と同じ」帯: 墨面＋左に金アクセントバー（金の塗りはセッション票の startPrimary のみに限定するため、
   ここは面ではなくアクセントバー1本にとどめる） */
.recordRepeatBand{grid-template-columns:minmax(0,1fr) 74px;}
.repeatMain{
  grid-column:auto; text-align:left; background:var(--invert-bg); color:var(--invert-fg); border-color:rgba(255,255,255,.10);
  position:relative; padding-left:16px; min-height:64px;
}
html.dark .repeatMain,html.auto .repeatMain{background:#0e100d;}
.repeatMain::before{
  content:""; position:absolute; left:0; top:10px; bottom:10px; width:3px; border-radius:2px; background:var(--accent);
}
.repeatEyebrow{display:block; font-size:11px; letter-spacing:.06em; color:rgba(242,240,232,.72); font-weight:var(--fw-label);}
.repeatMain b{font-size:17px; margin-top:2px; font-variant-numeric:tabular-nums;}
.repeatSub{color:rgba(242,240,232,.6)!important;}
.repeatHistory{min-height:64px;}
.launchPanel.convergeLaunch{border-radius:var(--radius-panel); overflow:hidden;}
.convergeLaunch .launchHead{background:var(--card);}
.convergeLaunch .launchBody{padding:12px 13px 13px;}
.startFirst{
  border-color:var(--line);
  box-shadow:none;
  /* motion:因果 — 記録ホームを開いた結果として条件選択パネルが現れる */
  animation:appRise .42s cubic-bezier(.2,.8,.2,1) .10s both;
}
.startFirst .launchHead{
  background:var(--card);
  border-bottom-color:var(--line2);
}
.startFirst .launchHead h2{font-size:15px;}
.quickSelects{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px;}
.quickSelects .f{margin-top:0;}
.startPrimary{
  min-height:58px; border-radius:8px; font-size:16px; position:relative; overflow:hidden; isolation:isolate;
  background:var(--invert-bg); color:var(--invert-fg);
  box-shadow:none;
}
/* 記録中カード全体: 連続タップでのダブルタップズーム誤爆を防ぐ（pan は許可、拡大操作だけ抑止） */
.targetFocusCard{padding:12px; border-radius:8px; touch-action:manipulation;}
.targetFocusCard h2{font-size:13px;}
.targetFocusCard .tgWrap svg.main{border-radius:8px; background:var(--target-surface-a); box-shadow:none;}
/* 記録中: 的を主役にするため左右 padding を切り詰め、的の実効幅を画面幅いっぱいに近づける（現行より拡大方向）。
   ただし縦方向はビューポート高の一定割合で頭打ちにし、固定操作列（activeActionDock）や矢チップ列が
   常にドックの裏へ隠れないようにする */
.targetFocusWide{padding-left:6px; padding-right:6px;}
.targetFocusWide .targetTools{padding:0 6px;}
.tgWrapWide{margin:0 auto; max-width:min(100%, 36vh); max-width:min(100%, 36dvh); max-height:36dvh;}
.targetTools{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px;}
.targetTools .chips{flex:1; justify-content:flex-end;}
.sightMiniDial{
  border:1px solid var(--advLine); border-radius:8px; padding:12px; margin-top:10px;
  background:var(--card);
}
.sightMiniDial .dialGrid{display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; align-items:center;}
.sightMiniDial svg{width:110px; height:110px; display:block;}
.sightMiniDial .ring{fill:var(--card); stroke:var(--advLine); stroke-width:2;}
.sightMiniDial .axis{stroke:var(--line); stroke-width:1.5;}
.sightMiniDial .vector{stroke:var(--green); stroke-width:3; stroke-linecap:round;}
.sightMiniDial .groupDot{fill:var(--green); stroke:#fff; stroke-width:3;}
.sightMiniDial .originDot{fill:var(--ink); opacity:.72;}
.sightMiniDial b{display:block; color:var(--title); font-size:14px;}
.sightMiniDial span{display:block; color:var(--sub); font-size:11.5px; line-height:1.45; margin-top:3px;}
.decisionCard{
  border:1px solid var(--advLine); border-radius:8px; padding:12px; margin:10px 0;
  background:var(--advBg); color:var(--ink);
  /* motion:因果 — セッション終了の結果として判断カードがサマリー内で最初に現れる */
  animation:decisionSlide .34s ease-out both;
}
.decisionCard .k{font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--sub); font-weight:var(--fw-label);}
.decisionCard b{display:block; color:var(--title); font-size:24px; line-height:1.15; margin:3px 0; font-variant-numeric:tabular-nums;}
.decisionCard p{margin:0; color:var(--ink); font-size:12.5px; line-height:1.55;}
.decisionCard span{display:block; color:var(--sub); font-size:11.5px; line-height:1.45; margin-top:6px;}
.decisionCard .decisionQuestion{display:block; color:var(--sub); font-size:11px; line-height:1.45; margin:0 0 2px;}
.decisionCard.warn{background:var(--advBg); border-color:var(--danger);}
.decisionCard.hold{background:var(--advBg); border-color:var(--amber);}
.decisionCard.ok{background:var(--advBg);}
.summaryDetails{margin-top:10px;}
.launchPanel{
  background:var(--card); border:none; border-top:2px solid var(--line); border-radius:0; margin-bottom:12px; box-shadow:none; min-width:0; width:100%;
}
.launchHead{
  display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px;
  padding:12px 14px; border-bottom:1px solid var(--line2); background:var(--card);
}
.launchHead h2{font-size:15px; margin:0; color:var(--title);}
.stepBadge{
  width:32px; height:32px; border-radius:8px; display:flex; align-items:center; justify-content:center;
  background:var(--ink2); color:#fff; font-size:12px; font-weight:var(--fw-figure); flex:0 0 auto;
}
.launchTitle{display:flex; align-items:center; gap:9px; min-width:0;}
.launchBody{padding:14px;}
.setupLens{
  display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:10px 0 4px;
}
.lensCard{
  border:1px solid var(--line); border-radius:8px; padding:9px; background:var(--paper);
  min-height:58px; min-width:0;
}
.lensCard .k{font-size:10.5px; color:var(--sub);}
.lensCard b{display:block; margin-top:2px; font-size:13px; color:var(--ink);}
.lensCard span{display:block; margin-top:2px; font-size:10.5px; color:var(--sub); line-height:1.35;}
/* セッション票の下に小さく置く「直近の調子」（設計要求: 開始までに視線が縦1本で済む配置） */
.sessionCondition{margin-top:4px;}
.sessionCondition .setupLens{margin:0; opacity:.86;}
.sessionCondition .lensCard{padding:7px 9px; min-height:44px;}
.sessionCondition .lensCard b{font-size:11.5px;}
.sessionCondition .lensCard span{font-size:10.5px;}
/* セッション票内の罫線区切り（スコアカードの紙の文法: hairlineで距離／的・本数／開始 を分ける） */
.sessionCardRule{height:1px; background:var(--line2); margin:12px 0;}
.quickDists{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; margin-top:6px;}
.quickDists .chip{display:flex; align-items:center; justify-content:center; padding:9px 4px; border-radius:6px; font-size:13px;}
.fieldBand{
  display:grid; grid-template-columns:1fr; gap:10px;
}
/* 多距離ラウンドのステージ行程表（計器の目盛り風）。ロジックは fRoundStages の JS 側で組み立て済み */
.stageGaugeWrap{border:1px solid var(--advLine); border-radius:8px; background:var(--advBg); padding:10px 10px 8px;}
.stageGaugeLabel{font-size:11.5px; font-weight:var(--fw-label); color:var(--title); margin-bottom:6px;}
.stageGauge{display:flex; align-items:flex-end; gap:0;}
.stageGaugeTick{display:flex; flex-direction:column; align-items:center; min-width:0;}
.stageGaugeMark{width:2px; background:var(--accent); border-radius:1px; margin-bottom:4px;}
.stageGaugeTick b{font-size:12px; color:var(--title); font-variant-numeric:tabular-nums; white-space:nowrap;}
.stageGaugeTick span{font-size:10.5px; color:var(--sub); margin-top:1px; white-space:nowrap;}
.stageGaugeRail{flex:1; height:1px; background:var(--line); margin-bottom:16px; min-width:8px;}
.recordDetails{margin-top:10px; border:none!important; background:transparent!important; padding:0!important;}
.recordDetails summary{
  display:flex; align-items:center; justify-content:flex-start; gap:4px;
  width:max-content; margin-left:auto; padding:7px 0 0!important;
}
.recordDetails summary::before{content:"＋ "!important; font-size:10px; position:static!important; border:none!important; width:auto!important; height:auto!important; transform:none!important; transition:none!important;}
.recordDetails[open] summary::before{content:"− "!important; transform:none!important;}
.recordDistCustomWrap{display:none;}
.recordNeutralAdvice{background:var(--card); border-color:var(--line);}
.recordNudgeHint{font-size:var(--font-size-sm); color:var(--sub);}
.recordNudgeDelete{color:var(--danger);}
.recordCurEmpty{font-size:var(--font-size-sm); color:var(--sub); align-self:center;}
.recordEndEditBtn{padding:4px var(--space-3); min-width:var(--tap-target-min);}
.recordSummaryPlot{margin-top:var(--space-4);}
.recordAdviceLabel{font-size:var(--font-size-sm); color:var(--sub);}
.recordReadOnlyItem{cursor:default;}
.tinyAction{
  border:1px solid var(--line); background:var(--card); color:var(--title); border-radius:8px;
  padding:7px 10px; font-size:12px; font-weight:var(--fw-label); cursor:pointer; white-space:nowrap;
  max-width:92px; overflow:hidden; text-overflow:ellipsis;
}
/* 分析タブ「今日の結論」: 机上モードの入口カード。金面は使わず、hairlineの罫線と大きめの本文だけで目立たせる */
.todayConclusionCard{
  border-top:2px solid var(--accent);
  animation:appRise .36s var(--ease-app) both; /* motion:因果 — タブを開いた結果として最初に読む一言が現れる */
}
.todayConclusionKicker{font-size:10.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--sub); font-weight:var(--fw-label);}
.todayConclusionText{margin:6px 0 0; font-size:17px; font-weight:var(--fw-figure); line-height:1.5; color:var(--title);}
.insightStrip{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:12px;
}
.insightTile{
  border:1px solid var(--line); border-radius:8px; padding:10px; background:var(--card);
  min-height:74px; min-width:0;
}
.insightTile .k{font-size:10.5px; color:var(--sub);}
/* 結論(todayConclusionText)より視覚的に勝たない太さに抑える（v2 0節: 主役は結論、KPIは根拠） */
.insightTile b{display:block; font-size:17px; font-weight:var(--fw-emphasis); color:var(--title); margin-top:2px; font-variant-numeric:tabular-nums;}
.insightTile span{display:block; font-size:10.5px; color:var(--sub); margin-top:2px; line-height:1.35;}
.pageHero{
  border:1px solid var(--line); border-radius:var(--radius-panel); padding:14px; margin-bottom:12px;
  background:var(--card);
  box-shadow:none; overflow:hidden;
}
.pageHero .kicker{font-size:10.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--title); font-weight:var(--fw-label);}
/* 見出しラベル化: 大見出しをやめ、ラベル様式（11-12px・字間0.08em・淡色）に統一 */
.pageHero h2{margin:4px 0 0; font-size:12px; letter-spacing:.02em; font-weight:var(--fw-label); color:var(--sub); line-height:1.4;}
.pageHero p{margin:0; color:var(--sub); font-size:12px; line-height:1.55;}
/* 履歴ヒーロー: 見出しではなく todayConclusion() の1文（結論）。唯一の例外として本文サイズを保つ */
.pageHero h2.pageHeroLead{font-size:17px; line-height:1.45; font-weight:var(--fw-figure); color:var(--ink); letter-spacing:0;}
.heroMetrics{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin-top:12px;}
.heroMetric{border:1px solid var(--line); border-radius:8px; background:var(--glass); padding:8px; min-width:0;}
.heroMetric .k{font-size:11px; color:var(--sub);}
.heroMetric b{display:block; color:var(--title); font-size:14px; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-variant-numeric:tabular-nums; font-weight:var(--fw-emphasis);}
/* サイトタブ「いまの提案」: 方向（SVG矢印＋言葉）＋量（tabular-nums大型）を主役にする単一ブロック */
.sightNow{margin-top:10px;}
.sightNowDir{display:flex; align-items:center; gap:6px; font-size:15px; font-weight:var(--fw-emphasis); color:var(--title);}
.sightNowDir .icoInline{width:22px; height:22px; color:var(--title);}
.sightNowAmount{font-size:38px; font-weight:var(--fw-figure); color:var(--title); line-height:1.05; margin-top:2px; font-variant-numeric:tabular-nums;}
.sightNowAmount small{font-size:15px; font-weight:var(--fw-body); color:var(--sub); margin-left:4px;}
.sightNowNote{margin:6px 0 0; color:var(--sub); font-size:12px; line-height:1.55;}
.sightNowNeutral .sightNowDir .icoInline{color:var(--green);}
.heroMetric span{display:block; color:var(--sub); font-size:10.5px; margin-top:2px; line-height:1.35;}
/* 記録中HUD: 面を持たない。地の上に数値が置いてあるだけ（枠・背景・影なし） */
.liveHud{
  border:none; border-radius:0; margin-bottom:12px; padding:13px 2px;
  background:transparent; color:var(--ink); box-shadow:none;
}
.compactHud{
  background:transparent; color:var(--ink); padding:8px 2px; margin-bottom:8px;
  box-shadow:none; border:none;
}
.liveHud .kicker{font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--sub); font-weight:var(--fw-label);}
/* ライブ中の主役数値だけ金の文字色を残す（面ではなく文字色としての金） */
.liveHud h2{font-size:20px;margin:3px 0;color:var(--ink); font-variant-numeric:tabular-nums; font-weight:var(--fw-figure);}
.liveContext{display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--title); font-size:12px; font-weight:var(--fw-label); line-height:1.35;}
.liveContext>span{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
/* HUD の「詳細」折りたたみ: 射場モードで畳んでおく用具名・平均・ステージ情報 */
.liveHudMore{position:relative; flex:0 0 auto;}
.liveHudMore summary{
  list-style:none; cursor:pointer; font-size:10.5px; font-weight:var(--fw-label); color:var(--sub);
  padding:2px 6px; border:1px solid var(--line); border-radius:6px; background:var(--soft);
}
.liveHudMore summary::-webkit-details-marker{display:none;}
.liveHudMoreBody{
  position:absolute; right:0; top:calc(100% + 6px); z-index:5; min-width:180px;
  display:flex; flex-direction:column; gap:3px; padding:8px 10px; border-radius:8px;
  background:var(--card); border:1px solid var(--line); box-shadow:var(--shadow-raised);
}
.liveHudMoreBody span{font-size:11px; color:var(--sub); white-space:nowrap;}
/* HUDセル: 枠・面なし。ラベルは小さく淡く、数値だけ大型 tabular-nums で地に置く */
.liveGrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; margin-top:10px;}
.liveCell{border:none; border-radius:0; background:transparent; padding:8px 0; min-width:0;}
.liveCell .k{font-size:11px; color:var(--sub);}
.liveCell b{display:block; font-size:15px; margin-top:2px; color:var(--title); font-variant-numeric:tabular-nums;}
.compactHud .liveGrid{margin-top:8px;}
.compactHud .liveCell{background:transparent; border:none; color:var(--ink); padding:7px 4px; text-align:center;}
.compactHud .liveCell .k{color:var(--sub); opacity:1;}
.compactHud .liveCell b{color:var(--title);}
/* 記録中HUDの「いま必要な3つ」: エンド・合計・残りだけを大型 tabular-nums で並べる */
.liveGrid3{grid-template-columns:repeat(3,minmax(0,1fr));}
.liveGrid3 .liveCell b{font-size:22px; font-weight:var(--fw-figure);}
.liveGrid3 .liveCell b small{font-size:11px; font-weight:var(--fw-body); margin-left:1px; color:var(--sub);}
/* motion:状態 — HUD数値が変わった瞬間だけ知覚できる短いティック */
.liveCell b.tick{animation:hudTick var(--motion-fast) var(--ease-app);}
@keyframes hudTick{
  0%{transform:translateY(-3px); opacity:.5;}
  100%{transform:translateY(0); opacity:1;}
}
.nativeStack{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:8px;}
.nativePill{
  border:1px solid var(--line); border-radius:8px; padding:9px; background:var(--paper);
  min-width:0;
}
.nativePill .k{font-size:10.5px; color:var(--sub);}
.nativePill b{display:block; font-size:13px; color:var(--title); margin-top:2px;}
.nativePill span{display:block; font-size:10.5px; color:var(--sub); line-height:1.35; margin-top:2px;}
.guideLine{display:flex; gap:8px; align-items:flex-start; font-size:12px; color:var(--sub); line-height:1.45; margin-top:8px;}
.guideLine b{color:var(--title); white-space:nowrap; flex:0 0 auto;}
.activeGuide{margin-top:8px;}
.activeGuide .guideLine{margin-top:6px;}
.activeGuideDone{margin-top:8px;}
/* 記録中の操作固定列（親指圏＝タブバー直上）。エンド確定・undo・終了の3つに絞り、終了は視覚を控えめにする */
.activeActionDock{
  position:fixed; left:50%; transform:translateX(-50%); z-index:29;
  bottom:calc(8px + 64px + 16px); bottom:calc(max(8px,env(safe-area-inset-bottom)) + 64px + 16px);
  width:calc(100% - 20px); max-width:560px;
  display:grid; grid-template-columns:1fr 1.3fr auto; gap:8px;
  background:var(--chrome-bg); border:1px solid var(--chrome-border); border-radius:8px;
  padding:10px 12px; box-shadow:var(--shadow-raised);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  /* ドック連打でのダブルタップズーム誤爆を防ぐ（ボタン間の余白部分にも明示が必要） */
  touch-action:manipulation;
}
.activeActionDock .btn{min-height:48px; width:auto;}
/* 終了: 誤タップ防止のため視覚を控えめに（本体の appConfirm 確認は不変） */
.activeFinishBtn{background:transparent; color:var(--sub); border:1px solid var(--line); font-weight:var(--fw-label);}
.activeStatsMore{margin-top:10px;}
.activeNextStageRow{margin-bottom:0;}
/* ドックの高さ分、記録中カードの下に呼吸を確保（endsTbl カードが隠れないように） */
.targetFocusWide{margin-bottom:0;}
main.hasActiveDock{padding-bottom:calc(64px + 24px + 96px);}
/* tab bar */
nav.tabs{
  position:fixed; bottom:8px; bottom:max(8px,env(safe-area-inset-bottom)); left:50%; right:auto; z-index:30;
  width:calc(100% - 20px); max-width:560px; transform:translateX(-50%);
  min-height:64px; background:var(--chrome-bg); border:1px solid var(--chrome-border); border-top:1.5px solid var(--chrome-border); border-radius:8px;
  --active-tab:0; --tab-count:5;
  display:flex; padding:6px 4px; overflow:hidden; isolation:isolate;
  box-shadow:var(--shadow-raised);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  /* タブ連打でのダブルタップズーム誤爆を防ぐ（ボタン間の余白部分にも明示が必要） */
  touch-action:manipulation;
}
/* motion:方向 — アクティブタブの位置移動を実際の並びと一致させて示す（金の面ではなく2pxの下線） */
nav.tabs::before{
  content:""; position:absolute; z-index:0; pointer-events:none;
  bottom:2px; left:4px; height:2px; width:calc((100% - 8px)/var(--tab-count,5));
  border-radius:0; background:var(--accent);
  transform:translate3d(calc(var(--active-tab,0) * 100%),0,0);
  transition:transform var(--motion-fluid) var(--ease-fluid);
}
/* motion:状態 — 選択中タブは色のみで示す（weight は全ラベル同一。強調は下線移動＋色にのみ担わせる） */
nav.tabs button{
  position:relative; z-index:1;
  flex:1 1 0; min-width:0; min-height:56px; background:none; border:none; border-radius:8px; padding:7px 0 6px; font-size:10.5px; color:var(--sub);
  font-weight:var(--fw-label);
  display:flex; flex-direction:column; align-items:center; gap:3px; cursor:pointer;
  transition:color var(--motion-fast), transform var(--motion-fast);
}
/* タブアイコン: インラインSVGの刻印（24pxグリッド・stroke1.5・butt cap、v2 5節）。
   図形はHTML側のSVG（ic-record / ic-history / ic-analysis / ic-sight / ic-gear）、CSSは配置のみ */
nav.tabs button .ic{
  width:30px; height:26px; display:flex; align-items:center; justify-content:center;
  position:relative; line-height:1; color:currentColor;
  transition:transform .18s, color .18s;
}
nav.tabs button .ic svg{display:block; width:24px; height:24px;}
nav.tabs button.on .ic{transform:translateY(-1px); color:var(--title);}
nav.tabs button.on{color:var(--title);}
/* target */
.tgWrap{position:relative; width:100%; touch-action:none; border-radius:8px;}
/* motion:状態 — ズーム段階の切り替え（拡大率変更）を滑らかにする */
.tgWrap svg.main{width:100%; display:block; border-radius:8px; background:var(--target-surface-a); touch-action:none; transform-origin:center; transition:transform var(--motion-fast), filter var(--motion-fast);}
.lens{
  position:absolute; top:8px; width:128px; height:128px; border-radius:50%;
  border:3px solid var(--green); background:var(--target-surface-a); box-shadow:0 2px 10px rgba(0,0,0,.25);
  display:none; pointer-events:none; overflow:hidden;
}
.lens.fine{border-color:var(--red);}
.lens.fine.cut{border-color:var(--green);}
.lens.fine.miss{border-color:var(--red);}
.lensTag{
  position:absolute; top:140px; font-size:11px; font-weight:var(--fw-label); color:#fff; background:var(--green);
  padding:2px 8px; border-radius:6px; display:none; pointer-events:none;
}
.lensTag.fine{background:var(--red);}
.lensTag.fine.cut{background:var(--green);}
.lensTag.fine.miss{background:var(--red);}
.hint{font-size:12.5px; color:var(--sub); margin-top:8px; line-height:1.5;}
/* score chips */
.scoreChips{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; min-height:36px;}
.sc{
  position:relative; width:40px; height:40px; border-radius:6px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-weight:var(--fw-figure); font-size:15px; border:2px solid transparent; cursor:pointer;
  /* motion:状態 — 選択中の矢チップの枠強調を滑らかにする */
  transform-origin:center; transition:transform var(--motion-fast), box-shadow var(--motion-fast), border-color var(--motion-fast);
  font-variant-numeric:tabular-nums;
}
/* 視覚は40pxのまま当たり判定だけ44px（--tap-target-min）へ拡張。gap:6px なので隣接チップとは重ならない */
/* absolute の基準は padding box（36px）なので -4px で外形40px+2px=44px になる */
.sc::before{content:""; position:absolute; inset:-4px; border-radius:inherit;}
button.sc{margin:0; padding:0; font-family:inherit; line-height:inherit; text-align:inherit; -webkit-appearance:none; appearance:none;}
/* motion:状態 — 選択中のスコアチップにリング＋微細な浮上で視線誘導 */
@keyframes chipSelect{0%{transform:scale(.92);}50%{transform:scale(1.06);}100%{transform:scale(1);}}
.sc.sel{border-color:var(--ink); box-shadow:0 0 0 2px var(--card) inset; animation:chipSelect .2s var(--ease-app);}
/* motion:因果 — タップ結果を的から得点チップへ視覚的に反映。
   着弾象限（impactFrom-*）ごとに開始オフセットを変え、「的の着弾方向からチップが来た」感触にする。
   座標計算・当たり判定には無関係の表示専用クラス */
.sc.fresh{animation:scorePop .38s cubic-bezier(.2,1.2,.2,1) both;}
.sc.fresh.impactFrom-ne{animation-name:scorePopFromNE;}
.sc.fresh.impactFrom-nw{animation-name:scorePopFromNW;}
.sc.fresh.impactFrom-se{animation-name:scorePopFromSE;}
.sc.fresh.impactFrom-sw{animation-name:scorePopFromSW;}
@keyframes scorePopFromNE{
  0%{opacity:.35; transform:translate(10px,-10px) scale(.72);}
  58%{opacity:1; transform:translate(0,0) scale(1.06);}
  100%{opacity:1; transform:translate(0,0) scale(1);}
}
@keyframes scorePopFromNW{
  0%{opacity:.35; transform:translate(-10px,-10px) scale(.72);}
  58%{opacity:1; transform:translate(0,0) scale(1.06);}
  100%{opacity:1; transform:translate(0,0) scale(1);}
}
@keyframes scorePopFromSE{
  0%{opacity:.35; transform:translate(10px,10px) scale(.72);}
  58%{opacity:1; transform:translate(0,0) scale(1.06);}
  100%{opacity:1; transform:translate(0,0) scale(1);}
}
@keyframes scorePopFromSW{
  0%{opacity:.35; transform:translate(-10px,10px) scale(.72);}
  58%{opacity:1; transform:translate(0,0) scale(1.06);}
  100%{opacity:1; transform:translate(0,0) scale(1);}
}
.shotNew{transform-box:fill-box; transform-origin:center; animation:markPop .42s cubic-bezier(.2,1.15,.2,1) both;}
.shotNew circle{animation:impactFlash .42s ease-out both;}
.statbar{display:flex; gap:6px; margin-top:10px;}
.stat{flex:1; background:var(--soft); border-radius:8px; padding:9px 4px; text-align:center;}
.stat b{display:block; font-size:17px; font-variant-numeric:tabular-nums;} .stat span{font-size:10.5px; color:var(--sub);}
/* nudge pad */
.nudge{display:none; margin-top:10px; background:var(--soft); border-radius:8px; padding:10px; text-align:center;}
/* motion:状態 — ナッジパネルが表示されたとき滑らかに出現 */
.nudge.on{display:block; animation:nudgeReveal .24s var(--ease-app) both;}
.shotMeta{
  margin-top:10px; padding-top:10px; border-top:1px solid var(--line);
  text-align:left;
}
.shotMetaGrid{display:grid; grid-template-columns:88px minmax(0,1fr); gap:8px; align-items:end;}
.shotMeta .metaLabel{font-size:11px; color:var(--sub); display:block; margin:0 0 4px;}
.reasonTags{display:flex; flex-wrap:wrap; gap:6px;}
.reasonTag{
  border:1px solid var(--line); background:var(--card); color:var(--ink);
  min-width:var(--tap-target-min); min-height:var(--tap-target-min);
  border-radius:6px; padding:7px 9px; font-size:11.5px; font-weight:var(--fw-label); cursor:pointer;
}
/* 選択状態は反転トークンへ統一（v2再監査: 旧 green の選択色は退役済みのため使わない） */
.reasonTag.on{background:var(--invert-bg); border-color:var(--invert-bg); color:var(--invert-fg); animation:chipPop .2s var(--ease-app);}
.reasonTag{transition:transform var(--motion-fast), background var(--motion-fast), border-color var(--motion-fast);}
.sc small{display:block; font-size:10.5px; line-height:1; color:inherit; opacity:.88; margin-top:1px;}
.npad{display:grid; grid-template-columns:52px 52px 52px; gap:6px; justify-content:center; margin:6px 0;}
.npad button{width:52px; height:46px; border-radius:8px; border:1px solid var(--line); background:var(--card); color:var(--ink); font-size:17px; cursor:pointer; font-variant-numeric:tabular-nums; transition:transform .06s, background .06s, color .06s, border-color .06s;}
/* motion:因果 — ナンバーパッドの押下で反転色フラッシュ＋深い沈み込み。スコア入力の手応えを強調 */
.npad button:active{background:var(--invert-bg); color:var(--invert-fg); border-color:var(--invert-bg); transform:scale(.92);}
.npad .blank{visibility:hidden;}
table.tbl{width:100%; border-collapse:collapse; font-size:13px;}
table.tbl th{font-size:12px; color:var(--sub); text-align:left; padding:6px 6px; border-bottom:1px solid var(--line); font-weight:var(--fw-label);}
table.tbl td{padding:7px 6px; border-bottom:1px solid var(--line2);}
table.tbl tr:last-child td{border-bottom:none;}
table.tbl td,table.tbl th{font-variant-numeric:tabular-nums;}
/* サイト台帳: 計器の目盛り台帳。使用中（先頭=最新）の行にだけ金ドットを置く */
.ledgerCurrent td{color:var(--title);}
.ledgerDot{display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--accent); margin-right:6px; box-shadow:0 0 0 3px rgba(176,138,46,.18); vertical-align:middle;}
.right{text-align:right;} .center{text-align:center;}
.listItem{
  display:flex; justify-content:space-between; align-items:center; gap:8px;
  min-height:54px; padding:13px 4px; border-bottom:1px solid var(--line2); cursor:pointer;
}
.listItem:last-child{border-bottom:none;}
.listItem .t{font-weight:var(--fw-emphasis);} .listItem .d{font-size:12px; color:var(--sub); margin-top:2px;}
.listItem .big{font-size:20px; color:var(--green); white-space:nowrap;}
.listItem .big small{font-size:11px; color:var(--sub); font-weight:var(--fw-body);}
/* button タグ化した listItem の UA デフォルト打ち消し（見た目は従来の div と同一に保つ） */
button.listItem{display:flex; width:100%; margin:0; border:none; border-bottom:1px solid var(--line2); background:none; color:inherit; font:inherit; text-align:inherit; -webkit-appearance:none; appearance:none;}
.formAnalysisRow{display:flex; align-items:center; border-bottom:1px solid var(--line2);}
.formAnalysisRow:last-child{border-bottom:none;}
.formAnalysisRow button.listItem{flex:1; border-bottom:none; min-width:0;}
.badge{display:inline-block; font-size:10.5px; background:var(--soft); color:var(--sub); border-radius:6px; padding:2px 6px; margin-right:4px;}
.empty{color:var(--sub); font-size:13px; text-align:center; padding:18px 6px;}
.empty p{margin:0 0 12px;}
.empty .btn{width:auto; min-width:200px; margin:0 auto;}
/* advice */
.advice{background:var(--advBg); border:1px solid var(--advLine); border-radius:8px; padding:12px; margin-top:10px;}
.advice .dir{font-size:17px; font-weight:var(--fw-figure); color:var(--title); margin:4px 0; font-variant-numeric:tabular-nums;}
.advice .note{font-size:13px; color:var(--sub); line-height:1.55;}
.kv{display:flex; justify-content:space-between; font-size:13px; padding:4px 0;}
.kv span:first-child{color:var(--sub);}
/* utility */
.mt8{margin-top:var(--space-3);} .mt10{margin-top:var(--space-4);} .mt14{margin-top:var(--space-6);}
.subNote{font-size:var(--font-size-sm); color:var(--sub);}
.subNoteSm{font-size:var(--font-size-xs); color:var(--sub);}
/* history & sight view */
.histFilterEnd{display:flex; align-items:flex-end;}
/* 履歴一覧: 月ラベル・日付見出しは hairline のみで区切る（白カード段組は使わない） */
.historyMonthLabel{
  font-size:10.5px; letter-spacing:.08em; color:var(--sub); font-weight:var(--fw-label);
  margin:14px 0 2px; padding-top:10px; border-top:1px solid var(--line);
}
.historyMonthLabel:first-child{margin-top:0; padding-top:0; border-top:none;}
.historyDateHead{font-size:11px; color:var(--sub); font-weight:var(--fw-label); margin:8px 0 2px;}
.historyRow{align-items:flex-start;}
.historyRowMain{min-width:0;}
.historyRowTotal{font-size:24px;}
.historyEmpty{display:flex; flex-direction:column; align-items:center; gap:10px; padding:24px 12px;}
.historyEmpty p{margin:0; max-width:32em;}
.historyEmpty .btn{width:auto; padding-left:22px; padding-right:22px;}
.histRecentBlock{border-top:1px solid var(--line); padding:10px 0;}
.histRecentHead{display:flex; align-items:flex-start; gap:10px;}
.histRecentTarget{width:128px; max-width:38%; aspect-ratio:1; border:1px solid var(--line); border-radius:8px; background:var(--inpBg); flex:0 0 auto;}
.histRecentBody{flex:1; min-width:0;}
.histRecentTitle{font-weight:var(--fw-emphasis);}
.histScoreRow{display:flex; align-items:center; gap:8px; padding:2px 0;}
.histScoreLabel{width:28px; text-align:center; font-weight:var(--fw-figure); font-size:var(--font-size-sm); border-radius:6px; padding:2px 0;}
.histScoreTrack{flex:1; background:var(--line); border-radius:5px; height:14px; overflow:hidden;}
.histScoreFill{height:100%; background:var(--green-l);}
.histScoreCount{width:70px; font-size:var(--font-size-xs); color:var(--sub); text-align:right;}
.histTrendRow{display:flex; align-items:center; gap:var(--space-4); padding:6px 0;}
.histTrendLabel{width:72px; font-weight:var(--fw-label);}
.histTrendChart{flex:1;}
.histTrendValue{width:54px; text-align:right; font-size:var(--font-size-sm);}
.histTrendSub{color:var(--sub); font-size:11px;}
.histAdviceCard{background:var(--card); border-color:var(--line);}
/* 多距離ラウンドのステージ一覧: P1 の目盛り表現（距離に応じた棒の長さ）をテーブル行に揃える */
.stageTable td,.stageTable th{font-variant-numeric:tabular-nums;}
.stageTick{display:inline-block; height:3px; background:var(--accent); border-radius:1px; margin-right:6px; vertical-align:middle;}
.stageRowCur td{color:var(--title); font-weight:var(--fw-emphasis);}
.stageTotalRow td{border-top:1px solid var(--line); padding-top:9px;}
.histDelBtn{padding:4px var(--space-3); min-width:var(--tap-target-min);}
.histEndTable td,.histEndTable th{font-variant-numeric:tabular-nums;}
/* 履歴詳細の操作列: 下部に固定（sticky）。編集=通常、画像保存=sec、削除=danger で右端へ隔離 */
.histDetailActions{
  position:sticky; bottom:calc(-1 * (16px + env(safe-area-inset-bottom))); left:0; right:0;
  margin:14px -16px calc(-16px - env(safe-area-inset-bottom)); padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  background:var(--card); border-top:1px solid var(--line);
}
.histDetailActions .btnrow:first-child{margin-top:0;}
.histDetailActions .btnrow:last-child{justify-content:space-between;}
.histDetailActions .btnrow:last-child #hClose{flex:1;}
.histDetailActions #hDel{flex:0 0 auto; width:auto; padding-left:18px; padding-right:18px;}
/* gear & settings view */
.gearAdviceCard{background:var(--card); border-color:var(--line);}
.gearChevron{font-size:18px; color:var(--sub);}
.sheet .settingsH3{margin-top:18px; font-size:var(--font-size-md);}
.settingsFileInputHidden{display:none;}
.settingsDangerHint{color:var(--danger);}
.settingsVersionFooter{text-align:center; margin-top:var(--space-5);}
.sheet .gearHistoryH3{margin-top:14px; font-size:13px;}
.gearHistoryRow{font-size:var(--font-size-sm); padding:6px 0; border-bottom:1px solid var(--line2);}
/* 機材台帳: セッティング名を主役に、諸元は罫線ラベルなしの整列行で並べる */
.gearLedgerItem{position:relative; padding-left:14px;}
.gearLedgerItem .t{display:flex; align-items:center; gap:7px;}
.gearLedgerSpecs{display:flex; flex-wrap:wrap; gap:2px 12px; margin-top:4px;}
.gearSpecCell{font-size:11.5px; color:var(--sub); white-space:nowrap;}
.gearSpecCell b{color:var(--ink); font-weight:var(--fw-figure); margin-left:4px; font-variant-numeric:tabular-nums;}
/* motion:状態 — 使用中セッティングは面ではなく小さな金ドットで示す（金面はCTA1つに限定） */
.gearActiveDot{width:7px; height:7px; border-radius:50%; background:var(--accent); flex:0 0 auto; box-shadow:0 0 0 3px rgba(176,138,46,.16);}
html.dark .gearActiveDot,html.auto .gearActiveDot{box-shadow:0 0 0 3px rgba(217,178,90,.2);}
/* スペックシート: 罫線区切りの kv 行（詳細シートの諸元表示） */
.specSheet{margin-top:10px;}
.specRow{display:flex; justify-content:space-between; gap:12px; padding:7px 0; border-bottom:1px solid var(--line2); font-size:13px;}
.specRow:last-child{border-bottom:none;}
.specRow span:first-child{color:var(--sub); flex:0 0 auto;}
.specRow b{font-weight:var(--fw-figure); text-align:right; font-variant-numeric:tabular-nums;}
/* フォーム内の単位固定表示（ラベル上・入力下、単位は入力欄右に固定） */
.fieldUnit{position:relative;}
.fieldUnit .inp{padding-right:44px;}
.fieldUnitLabel{position:absolute; right:13px; top:50%; transform:translateY(-50%); font-size:12px; color:var(--sub); pointer-events:none;}
/* 設定シート: 4群構成の節見出しと説明文 */
.settingsGroup{margin-top:20px;}
.settingsGroup:first-child{margin-top:0;}
.settingsGroupTitle{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--sub); font-weight:var(--fw-label); margin:0 0 8px;}
.settingsActionHint{font-size:11px; color:var(--sub); margin:4px 0 8px; line-height:1.5;}
/* 危険域: 赤 hairline で隔離し最下部へ */
.settingsDangerZone{margin-top:24px; padding-top:14px; border-top:1px solid var(--danger);}
.settingsDangerZone .settingsGroupTitle{color:var(--danger);}
/* analysis & physics view */
.analysisAdviceCard{background:var(--card); border-color:var(--line);}
.analysisMt6{margin-top:6px;}
.dialRingInner{opacity:.55;}
.sheet .trashH3{margin-top:18px; font-size:var(--font-size-md);}
.btn.trashRestoreBtn{padding:4px var(--space-3);}
/* modal */
/* motion:因果 — アクション操作の結果としてオーバーレイが暗転する */
@keyframes overlayFade{from{opacity:0;}to{opacity:1;}}
.ovl{position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:50; display:flex; align-items:flex-end; justify-content:center; animation:overlayFade .2s ease-out;}
body.modalOpen{overflow:hidden;}
.sheet:focus{outline:none;} /* dialog コンテナへの初期フォーカスでリングを出さない */
/* motion:因果 — アクション操作の結果としてシートが下から登場する */
@keyframes sheetUp{from{transform:translateY(100%);}to{transform:translateY(0);}}
.sheet{
  background:var(--card); width:100%; max-width:520px; border-radius:16px 16px 0 0; padding:16px;
  max-height:88vh; overflow-y:auto; padding-bottom:16px;
  padding-bottom:calc(16px + env(safe-area-inset-bottom));
  box-shadow:var(--shadow-raised);
  animation:sheetUp .32s var(--ease-fluid);
}
.sheet h3{margin:0 0 8px; font-size:16px; color:var(--title);}
/* 確認ダイアログ（appConfirm）: .sheet より小さい面。破壊的操作の直前だけ登場モーションを持つ */
.confirmSheet{max-width:360px; border-radius:8px;}
.confirmSheet .confirmMsg{font-size:14.5px; line-height:1.6; color:var(--ink); white-space:pre-line;}
/* motion:注意 — 不可逆操作の直前のみ、確認ダイアログの登場を強調する */
.confirmSheet{animation:confirmIn var(--motion-med) var(--ease-app);}
@keyframes confirmIn{from{opacity:0; transform:translateY(10px) scale(.98);}to{opacity:1; transform:translateY(0) scale(1);}}
.icoInline{display:inline-block; vertical-align:-3px; flex:0 0 auto;}
/* トースト: 計器風 — 罫線＋墨面 */
/* motion:状態 — 直前の操作（エンド確定・保存など）がアプリに受理されたことを短く知らせる */
.toast{
  position:fixed; bottom:96px; bottom:calc(92px + env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%) translateY(12px) scale(.98); z-index:60;
  background:var(--invert-bg); color:var(--invert-fg); border:1px solid rgba(255,255,255,.14); padding:9px 18px; border-radius:8px; font-size:13.5px;
  opacity:0; transition:opacity .22s, transform .22s var(--ease-app); pointer-events:none; max-width:calc(100vw - 24px); text-align:center;
  box-shadow:var(--shadow-raised);
}
html.dark .toast,html.auto .toast{background:#0e100d;}
/* dark: オーバーレイを濃くして暗背景とのコントラストを確保 */
html.dark .ovl,html.auto .ovl{background:rgba(0,0,0,.58);}
/* dark: 矢の着弾フラッシュを明るい緑に変えて暗背景で映えるようにする */
@keyframes impactFlashDark{
  0%{filter:drop-shadow(0 0 0 rgba(99,176,136,0)); opacity:.58;}
  48%{filter:drop-shadow(0 0 7px rgba(99,176,136,.55)); opacity:1;}
  100%{filter:drop-shadow(0 0 0 rgba(99,176,136,0)); opacity:.92;}
}
html.dark .shotNew circle,html.auto .shotNew circle{animation-name:impactFlashDark;}
.toast.show{opacity:.98; transform:translateX(-50%) translateY(0) scale(1);}
.histChip{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:baseline;}
.tgWrap svg.main.triple{width:58%; margin:0 auto;}
.updbar{
  position:fixed; left:50%; transform:translateX(-50%); bottom:102px;
  bottom:calc(98px + env(safe-area-inset-bottom));
  z-index:40; background:var(--card); color:var(--title); border:1px solid var(--advLine); padding:9px 14px; border-radius:8px;
  font-family:inherit; font-size:12px; font-weight:var(--fw-emphasis); box-shadow:var(--shadow-raised); cursor:pointer; display:none; max-width:calc(100vw - 24px); text-align:center;
}
.updbar:not([hidden]){display:block;}
.updbar[hidden]{display:none!important;}
html.dark{
  /* Field Instrument v2 — dark: 純に近い墨。金は糸だけ */
  --bg:#101110; --card:#101110; --ink:#e7eae5; --sub:#9aa396; --line:#33362f; --line2:#2a2d28;
  --soft:#1e211c; --inpBg:#1e211c; --hdr:#e7eae5; --title:#e7eae5; --advBg:#1e211c; --advLine:#33362f;
  --green:#63b088; --green-l:#63b088; --accent:#d9b25a; --accent-strong:#f0c04a; --danger:#ff8a80;
  --status-ok:#4ade80; --status-warn:#ff8a80; --status-hold:#d9b25a;
  /* 反転 CTA・選択状態: dark = 紙面＋墨文字 */
  --invert-bg:#f2f0e8; --invert-fg:#1b1b18;
  --paper:#101110; --paper2:#1e211c; --ink2:#e7eae5; --teal:#64d3bf; --amber:#f0b35a; --navy:#78aee8; --mint:#1e211c;
  --shadow-raised:0 10px 28px rgba(0,0,0,.4);
  --shadow-none:none;
  --shadow:var(--shadow-none); --glass:rgba(16,17,16,.86);
  --shadow-soft:var(--shadow-none);
  --press-shadow:var(--shadow-none);
  --chrome-bg:rgba(16,17,16,.92); --chrome-border:rgba(231,234,229,.10);
  --page-top:#101110; --page-mid:#101110;
  --logo-surface-a:#101110; --logo-surface-b:#101110;
  --target-surface-a:#1e211c; --target-surface-b:#191b17;
  --shadow-card:var(--shadow-none);
  --shadow-floating:var(--shadow-raised);
}
@media (prefers-color-scheme: dark){
  html.auto{
    --bg:#101110; --card:#101110; --ink:#e7eae5; --sub:#9aa396; --line:#33362f; --line2:#2a2d28;
    --soft:#1e211c; --inpBg:#1e211c; --hdr:#e7eae5; --title:#e7eae5; --advBg:#1e211c; --advLine:#33362f;
    --green:#63b088; --green-l:#63b088; --accent:#d9b25a; --accent-strong:#f0c04a; --danger:#ff8a80;
    --status-ok:#4ade80; --status-warn:#ff8a80; --status-hold:#d9b25a;
    --invert-bg:#f2f0e8; --invert-fg:#1b1b18;
    --paper:#101110; --paper2:#1e211c; --ink2:#e7eae5; --teal:#64d3bf; --amber:#f0b35a; --navy:#78aee8; --mint:#1e211c;
    --shadow-raised:0 10px 28px rgba(0,0,0,.4);
    --shadow-none:none;
    --shadow:var(--shadow-none); --glass:rgba(16,17,16,.86);
    --shadow-soft:var(--shadow-none);
    --press-shadow:var(--shadow-none);
    --chrome-bg:rgba(16,17,16,.92); --chrome-border:rgba(231,234,229,.10);
    --page-top:#101110; --page-mid:#101110;
    --logo-surface-a:#101110; --logo-surface-b:#101110;
    --target-surface-a:#1e211c; --target-surface-b:#191b17;
    --shadow-card:var(--shadow-none);
    --shadow-floating:var(--shadow-raised);
  }
}
details.adv{border:1px solid var(--line); border-radius:8px; padding:2px 12px 8px; margin-top:12px; background:var(--card);}
/* motion:因果 — アコーディオンの内容が開閉時に滑らかに現れる */
@keyframes detailReveal{from{opacity:0; transform:translateY(-4px);}to{opacity:1; transform:translateY(0);}}
details.adv[open] > :not(summary){animation:detailReveal .24s var(--ease-app) both;}
details.adv summary{
  cursor:pointer; font-size:13px; color:var(--sub); padding:9px 0 9px 18px; list-style:none; font-weight:var(--fw-label);
  position:relative;
}
details.adv summary::-webkit-details-marker{display:none;}
/* 回転シェブロン（motion:状態 — 開閉状態を知覚させる） */
details.adv summary::before{
  content:""; position:absolute; left:0; top:50%; width:8px; height:8px;
  border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor;
  transform:translateY(-65%) rotate(-45deg); transition:transform var(--motion-fast);
}
details.adv[open] summary::before{transform:translateY(-35%) rotate(45deg);}
details.adv summary::-moz-list-bullet{display:none;}
header.app .gear{
  position:absolute; right:12px; top:8px; top:calc(8px + env(safe-area-inset-top));
  width:36px; height:36px; border-radius:8px; display:flex; align-items:center; justify-content:center;
  background:var(--soft); border:1px solid var(--line); color:var(--title); font-size:20px; cursor:pointer; padding:0; flex:0 0 auto;
}
@media (max-width:420px){
  header.app{gap:7px; padding-left:12px; padding-right:52px;}
}
@media (max-width:520px){
  .heroMetrics,.liveGrid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .quickDists{grid-template-columns:repeat(4,minmax(0,1fr));}
  .targetTools{align-items:stretch; flex-direction:column;}
  .targetTools .chips{justify-content:flex-start;}
}
@media (max-width:360px){
  main{padding:8px;}
  .row{flex-direction:column;}
  .btnrow{flex-direction:column;}
  .statbar{flex-wrap:wrap;}
  .stat{min-width:46%;}
  .setupLens,.insightStrip,.nativeStack,.heroMetrics,.liveGrid{grid-template-columns:1fr;}
  .sightMiniDial .dialGrid{grid-template-columns:1fr;}
  .sightMiniDial svg{justify-self:center;}
  .quickSelects{grid-template-columns:1fr;}
  .quickDists{grid-template-columns:repeat(3,minmax(0,1fr));}
}
/* motion:因果 — タブ切替の結果として画面内容が入れ替わったことを示す微細フェード */
@keyframes viewEnter{from{opacity:.88; transform:translateY(5px);}to{opacity:1; transform:translateY(0);}}
main.viewEnter{animation:viewEnter .22s var(--ease-app) both;}
/* motion:因果 — ビュー内のリスト要素が時差で出現し、画面にリズムを与える */
@keyframes itemReveal{from{opacity:0; transform:translateY(8px);}to{opacity:1; transform:translateY(0);}}
main.viewEnter .listItem,
main.viewEnter .historyMonthLabel,
main.viewEnter .histRecentBlock,
main.viewEnter .card{
  animation:itemReveal .28s var(--ease-app) both;
}
main.viewEnter > :nth-child(1){animation-delay:0s;}
main.viewEnter > :nth-child(2){animation-delay:.03s;}
main.viewEnter > :nth-child(3){animation-delay:.06s;}
main.viewEnter > :nth-child(4){animation-delay:.08s;}
main.viewEnter > :nth-child(5){animation-delay:.10s;}
/* motion:因果 — ナッジパネルの出現（矢選択に応じて現れるヒント） */
@keyframes nudgeReveal{from{opacity:0; transform:translateY(-6px);}to{opacity:1; transform:translateY(0);}}
/* motion:状態 — レディネスバーが左から伸びてスコアの充足度を示す */
@keyframes barFill{from{transform:scaleX(0);}to{transform:scaleX(1);}}
/* motion:因果 — タブ切替でアイコンが弾む（どのタブに着地したか触覚的に示す） */
@keyframes tabPop{0%{transform:translateY(0) scale(.92);}50%{transform:translateY(-3px) scale(1.06);}100%{transform:translateY(-1px) scale(1);}}
nav.tabs button.on .ic{animation:tabPop .26s var(--ease-app);}
/* motion:因果 — チップ選択が受理されたことを示す軽い弾み */
@keyframes chipPop{0%{transform:scale(.93);}50%{transform:scale(1.04);}100%{transform:scale(1);}}
.chip.on{animation:chipPop .2s var(--ease-app);}
/* motion:因果 — 開始ボタン押下を深い手応えで返す（行射開始の意思決定の重みを表現） */
.startPrimary:active{transform:translateY(2px) scale(.968)!important; filter:brightness(.86)!important; box-shadow:inset 0 3px 6px rgba(0,0,0,.18)!important;}
/* motion:状態 — トースト登場はスプリングで弾み、退場は速く消える */
.toast.show{transition:opacity .24s, transform .3s cubic-bezier(.22,1.15,.36,1);}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{scroll-behavior:auto!important; transition:none!important; animation:none!important;}
  .bootFallback{opacity:1; visibility:visible; pointer-events:auto;}
}

/* デスクトップ向け: 細く控えめなスクロールバー */
@media (pointer:fine){
  *{scrollbar-width:thin; scrollbar-color:var(--line) transparent;}
  *::-webkit-scrollbar{width:8px; height:8px;}
  *::-webkit-scrollbar-track{background:transparent;}
  *::-webkit-scrollbar-thumb{background:var(--line); border-radius:4px; border:2px solid transparent; background-clip:padding-box;}
  *::-webkit-scrollbar-thumb:hover{background:var(--sub); background-clip:padding-box;}
}

/* form tracking (beta) — full-viewport camera UI */
.sheet.formCapture{max-height:100dvh;height:100dvh;max-width:none;border-radius:0;display:flex;flex-direction:column;padding:0;padding-bottom:env(safe-area-inset-bottom);background:#0a0a0a;overflow:hidden;animation:none}
.formCamWrap{position:relative;width:100%;overflow:hidden;background:#0f1412;min-height:120px}
.formCapture .formCamWrap{flex:1 1 0;min-height:0;border-radius:0}
.formCamWrap video{width:100%;display:block;opacity:.9}
.formCapture .formCamWrap video{height:100%;object-fit:contain}
.formCamWrap canvas{position:absolute;inset:0;width:100%;height:100%}
.formPhaseTag{position:absolute;top:8px;right:8px;background:rgba(13,59,36,.85);color:#eafff2;border-radius:8px;padding:2px 10px;font-size:12px;font-weight:var(--fw-label);z-index:2}
.formPhaseTag.release{background:rgba(198,40,40,.9)}
.formPhaseTag.fulldraw{background:rgba(184,134,11,.9)}
.formCloseBtn,.formCropBtn{position:absolute;top:calc(8px + env(safe-area-inset-top));width:40px;height:40px;min-height:40px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.formCloseBtn{left:8px}
.formCropBtn{left:56px;opacity:.7}
.formCropBtn.active{background:rgba(15,157,88,.75);opacity:1}
.formRecBtn{left:104px;opacity:.7}
.formRecBtn.active{background:rgba(198,40,40,.85);opacity:1;animation:recPulse 1.5s ease-in-out infinite}
@keyframes recPulse{0%,100%{opacity:1}50%{opacity:.6}}
.formHud{position:absolute;bottom:8px;left:8px;right:8px;font-size:11px;line-height:1.5;color:#ddd;background:rgba(0,0,0,.55);border-radius:6px;padding:4px 10px;z-index:2;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.formShotScroll{max-height:96px;overflow-y:auto;flex:0 0 auto;padding:0 10px}
.formShotScroll:empty{display:none}
.formBar{display:flex;gap:8px;padding:8px 12px;flex:0 0 auto;align-items:center;justify-content:center}
.formFootnote{flex:0 0 auto;padding:2px 12px 4px;font-size:10px;color:#888;line-height:1.4;text-align:center}