@charset "UTF-8";

/* ==========================================================
   SELF-HOSTED FONTS (spec 3.6)
   Latin subset only, woff2 only, exactly the weights in use.
   No third-party request, no DNS+TLS round-trip to Google.
   Source: @fontsource (same files Google serves), 168KB total.
   Symbols the site uses (checkmark, arrow, triangle) are NOT in
   any latin subset and fall back to the system stack, which was
   already true when these came from Google.
   ========================================================== */
@font-face{
  font-family:'Fraunces';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url('fonts/fraunces-latin-400-italic.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Fraunces';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('fonts/fraunces-latin-600-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Fraunces';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url('fonts/fraunces-latin-700-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Space Grotesk';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('fonts/space-grotesk-latin-400-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Space Grotesk';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('fonts/space-grotesk-latin-600-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'JetBrains Mono';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'JetBrains Mono';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('fonts/jetbrains-mono-latin-500-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* ==========================================================
   Swing Of It - shared styles
   Built on the jmineo.com design system.
   Palette shift: paper stays, plasma steps back, turf steps up.
   ========================================================== */

:root{
  /* core jmineo tokens */
  --ink:#10131a;
  --paper:#f3efe2;
  --paper-line:#d9d2bd;
  --plasma:#ff3d8b;
  --plasma-deep:#c81e63;
  --volt:#5ef2c4;
  --volt-deep:#0e7355;      /* darkened: 5.07:1 on paper (was #1bbf8f, 2.05:1 FAIL) */
  --volt-mid:#1bbf8f;       /* old volt-deep kept for FILLS/borders only, never text */
  --beaker:#3b5bff;
  --amber:#ffb627;          /* fills + borders only */
  --amber-deep:#8a5600;     /* 3.4 - text on paper: 5.4:1 PASS */
  --grid:rgba(16,19,26,.055);

  /* golf extension */
  --turf:#2f6b4f;
  --turf-deep:#1e4a36;
  --turf-soft:#e4ece3;
  --fairway:#7fb069;        /* accents only, never text */
  --sand:#e8d9b5;
  --sky:#8fb8de;
  --muted-txt:#5a626f;      /* 3.4 - 6.2:1 on paper */
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Space Grotesk',system-ui,sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.62;
  background-image:
    linear-gradient(var(--grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:28px 28px;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:960px;margin:0 auto;padding:0 24px}
.wrap-wide{max-width:1140px;margin:0 auto;padding:0 24px}

a{color:var(--turf-deep);text-decoration:none;border-bottom:1.5px solid var(--fairway)}
a:hover{color:var(--plasma-deep);border-bottom-color:var(--plasma)}

/* 3.5 - visible focus everywhere */
a:focus-visible,.btn:focus-visible,button:focus-visible,summary:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--beaker);outline-offset:2px;border-radius:4px;
}

/* 3.5 - skip link */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--volt);color:var(--ink);border:2px solid var(--ink);
  padding:10px 18px;border-radius:0 0 12px 0;font-weight:600;
  font-family:'Space Grotesk',sans-serif;border-bottom:2px solid var(--ink);
}
.skip-link:focus{left:0}

code{font-family:'JetBrains Mono',monospace;font-size:.85em;background:rgba(16,19,26,.06);padding:2px 6px;border-radius:5px}

.eyebrow{
  font-family:'JetBrains Mono',monospace;font-size:.72rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--turf-deep);
  display:block;
}
.eyebrow-pink{color:var(--plasma-deep)}

h1,h2,h3,h4{font-family:'Fraunces',serif;letter-spacing:-.015em}

/* ---------- nav (1.5) ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:var(--turf);
  border-bottom:2px solid var(--ink);
}
.nav-inner{
  max-width:1140px;margin:0 auto;padding:6px 20px;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  min-height:56px;
}
.nav-brand{
  font-family:'Fraunces',serif;font-weight:700;font-size:1.02rem;
  color:var(--paper);border:none;margin-right:4px;white-space:nowrap;
}
.nav-brand:hover{color:var(--volt);border:none}
.nav-brand .dot{color:var(--volt)}

/* persistent one-tap cheat sheet pill (1.5 exception) */
.nav-cheat{
  font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.08em;
  text-transform:uppercase;font-weight:500;
  background:var(--volt);color:var(--ink);border:2px solid var(--ink);
  border-radius:20px;padding:5px 11px;white-space:nowrap;
  box-shadow:2px 2px 0 var(--ink);transition:transform .12s ease;
}
.nav-cheat:hover{color:var(--ink);transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink);border-color:var(--ink)}
.nav-cheat.active{background:var(--paper)}

.nav-links{display:flex;align-items:center;gap:14px;flex-wrap:wrap;flex:1}
.nav-primary{display:flex;align-items:center;gap:3px;flex-wrap:wrap}
.nav-ref{display:flex;align-items:center;gap:5px;flex-wrap:wrap;
  padding-left:12px;border-left:1.5px solid rgba(255,255,255,.28)}
.nav-ref-label{
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.62);
}
.nav-ref-items{display:flex;align-items:center;gap:2px;flex-wrap:wrap}
.nav a.nav-link{
  font-size:.82rem;font-weight:500;color:#e8f0ea;
  padding:5px 9px;border-radius:20px;border:1.5px solid transparent;
  transition:all .12s ease;white-space:nowrap;
}
.nav-ref a.nav-link{font-size:.75rem;color:#cfe0d5;padding:4px 8px}
.nav a.nav-link:hover{color:var(--ink);background:var(--volt);border-color:var(--ink)}
.nav a.nav-link.active{color:var(--ink);background:var(--paper);border-color:var(--ink);font-weight:600}
.nav-toggle{
  display:none;margin-left:auto;background:var(--paper);border:2px solid var(--ink);
  border-radius:8px;padding:5px 11px;font-family:'JetBrains Mono',monospace;
  font-size:.78rem;cursor:pointer;color:var(--ink);
}
@media(max-width:980px){
  .nav-toggle{display:block}
  .nav-links{display:none;width:100%;flex-direction:column;align-items:stretch;padding-bottom:10px;gap:8px}
  .nav-links.open{display:flex}   /* 3.5 - display:none when closed, no phantom tab stops */
  .nav-primary{flex-direction:column;align-items:stretch;gap:2px}
  .nav a.nav-link{display:block;width:100%}
  .nav-ref{flex-direction:column;align-items:stretch;gap:2px;
    padding-left:14px;border-left:2px solid rgba(255,255,255,.28);margin-left:4px}
  .nav-ref-items{flex-direction:column;align-items:stretch;gap:2px}
  .nav-ref-label{padding:4px 0 2px}
}

/* ---------- hero ---------- */
.hero{padding:52px 0 30px}
.hero h1{
  font-weight:700;font-size:clamp(2.1rem,4.6vw,3.3rem);line-height:1.05;
  margin:12px 0 14px;letter-spacing:-.025em;
}
.hero h1 .hl{position:relative;white-space:nowrap;z-index:1}
.hero h1 .hl::after{
  content:"";position:absolute;left:-2%;right:-2%;bottom:6%;height:.32em;
  background:var(--volt);z-index:-1;transform:rotate(-1.3deg);
}
.hero p.lede{max-width:62ch;font-size:1.06rem;color:#333a47}
.hero-min{padding:34px 0 18px}
.hero-min h1{font-size:clamp(1.9rem,4vw,2.7rem);margin:10px 0 8px}

/* ---------- 1.4 TL;DR ---------- */
.tldr{
  max-width:960px;margin:0 auto 30px;padding:16px 20px 16px 22px;
  background:#fff;border:2px solid var(--ink);border-left:8px solid var(--volt-mid);
  border-radius:0 14px 14px 0;box-shadow:4px 4px 0 var(--ink);
}
.tldr-wrap{max-width:960px;margin:0 auto;padding:0 24px}
.tldr .tag{
  font-family:'JetBrains Mono',monospace;font-size:.66rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--volt-deep);display:block;margin-bottom:7px;font-weight:500;
}
.tldr p{font-size:.97rem;line-height:1.55;max-width:74ch;margin:0}
.tldr p + p{margin-top:5px}
.tldr strong{font-weight:600}

/* ---------- sections ---------- */
section.sec{padding:36px 0;border-top:2px solid var(--ink)}
.sec-head{display:flex;align-items:center;gap:13px;margin-bottom:20px;flex-wrap:wrap}
.sec-num{
  font-family:'JetBrains Mono',monospace;font-size:.76rem;color:var(--turf-deep);
  border:1.5px solid var(--turf-deep);border-radius:30px;padding:3px 11px;white-space:nowrap;
}
.sec-head h2{font-weight:600;font-size:clamp(1.5rem,3vw,2.1rem)}
h3{font-weight:600;font-size:1.22rem;margin:24px 0 10px}
h4{font-weight:600;font-size:1.03rem;margin:16px 0 6px}
p.body{margin-bottom:12px;max-width:72ch}
ul.body,ol.body{margin:6px 0 14px 22px;max-width:72ch}
ul.body li,ol.body li{margin-bottom:7px}
.muted{color:var(--muted-txt)}
.small{font-size:.9rem}

/* ---------- cards ---------- */
.card{
  background:#fff;border:2px solid var(--ink);border-radius:18px;padding:22px;
  box-shadow:6px 6px 0 var(--turf);
}
.card.acc-plasma{box-shadow:6px 6px 0 var(--plasma)}
.card.acc-amber{box-shadow:6px 6px 0 var(--amber)}
.card.acc-beaker{box-shadow:6px 6px 0 var(--beaker)}
.card.acc-volt{box-shadow:6px 6px 0 var(--volt-mid)}
.card.acc-sand{box-shadow:6px 6px 0 var(--sand)}
.card h4{margin-top:0;font-size:1.25rem}
.card p{font-size:.95rem;color:#3a4150}

.card-link{display:block;border:none;color:inherit;transition:all .13s ease}
.card-link:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--turf);border-bottom:none;color:inherit}
.card-link.acc-plasma:hover{box-shadow:8px 8px 0 var(--plasma)}
.card-link.acc-amber:hover{box-shadow:8px 8px 0 var(--amber)}
.card-link.acc-beaker:hover{box-shadow:8px 8px 0 var(--beaker)}
.card-link.acc-volt:hover{box-shadow:8px 8px 0 var(--volt-mid)}
.card-link.acc-sand:hover{box-shadow:8px 8px 0 var(--sand)}

.chip{
  font-family:'JetBrains Mono',monospace;font-size:.64rem;letter-spacing:.13em;
  text-transform:uppercase;padding:4px 10px;border-radius:20px;display:inline-block;
  margin-bottom:12px;border:1.5px solid var(--turf);background:var(--turf);color:#fff;
}
.chip-plasma{border-color:var(--plasma);background:var(--plasma)}
.chip-amber{border-color:var(--amber);background:var(--amber);color:var(--ink)}
.chip-volt{border-color:var(--volt-mid);background:var(--volt);color:var(--ink)}
.chip-ghost{background:transparent;color:var(--turf-deep)}
.chip-bonus{background:var(--paper);color:var(--muted-txt);border-color:var(--muted-txt)}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:820px){.grid-2,.grid-3{grid-template-columns:1fr}}

/* ---------- buttons ---------- */
.btn{
  font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:.95rem;
  padding:11px 20px;border:2px solid var(--ink);border-radius:40px;
  display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  transition:all .13s ease;border-bottom-width:2px;
}
a.btn{border-bottom:2px solid var(--ink)}
.btn-primary{background:var(--turf);color:#fff;box-shadow:4px 4px 0 var(--ink)}
.btn-primary:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink);color:#fff}
.btn-pink{background:var(--plasma);color:#fff;box-shadow:4px 4px 0 var(--ink)}
.btn-pink:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink);color:#fff}
.btn-volt{background:var(--volt);color:var(--ink);box-shadow:4px 4px 0 var(--ink)}
.btn-volt:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink);color:var(--ink)}
.btn-ghost{background:var(--paper);color:var(--ink)}
.btn-ghost:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink);color:var(--ink)}
.btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important;box-shadow:4px 4px 0 var(--ink)!important}

/* ---------- panels ---------- */
.panel-dark{
  background:var(--ink);color:var(--paper);border-radius:18px;padding:24px 26px;margin:18px 0;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:24px 24px;
}
.panel-dark .eyebrow{color:var(--volt)}
.panel-dark h4{color:var(--paper);margin-top:6px}
.panel-dark p{color:#c9d1dc;max-width:68ch}
.panel-dark a{color:var(--volt);border-bottom-color:var(--volt-mid)}

.callout{
  background:var(--turf-soft);border:2px solid var(--turf);border-left-width:7px;
  border-radius:12px;padding:16px 18px;margin:16px 0;
}
.callout .tag{
  font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--turf-deep);display:block;margin-bottom:5px;font-weight:500;
}
.callout p{font-size:.95rem;max-width:70ch}
.callout p:last-child{margin-bottom:0}
.callout.warn{background:#fdf3e0;border-color:var(--amber)}
.callout.warn .tag{color:var(--amber-deep)}
.callout.tip{background:#eafaf3;border-color:var(--volt-mid)}
.callout.tip .tag{color:var(--volt-deep)}
.callout.money{background:#fdeef4;border-color:var(--plasma)}
.callout.money .tag{color:var(--plasma-deep)}

/* ---------- tables ---------- */
.tbl-scroll{overflow-x:auto;margin:14px 0;-webkit-overflow-scrolling:touch;position:relative}
/* 3.3 - scroll affordance */
.tbl-scroll.is-scrollable{
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 26px),transparent 100%);
  mask-image:linear-gradient(90deg,#000 calc(100% - 26px),transparent 100%);
}
.tbl-scroll.is-end{-webkit-mask-image:none;mask-image:none}
.scroll-hint{
  display:none;font-family:'JetBrains Mono',monospace;font-size:.66rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted-txt);margin:0 0 4px;
}
.tbl-scroll.is-scrollable + .scroll-hint,.scroll-hint.show{display:block}
table.data{
  width:100%;border-collapse:collapse;background:#fff;
  border:2px solid var(--ink);border-radius:12px;overflow:hidden;font-size:.88rem;min-width:520px;
}
table.data th,table.data td{text-align:left;padding:9px 13px;border-bottom:1px solid var(--paper-line);vertical-align:top}
table.data th{
  background:var(--ink);color:var(--paper);font-family:'JetBrains Mono',monospace;
  font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;font-weight:500;white-space:nowrap;
}
table.data tr:last-child td{border-bottom:none}
table.data tbody tr:nth-child(even){background:#faf9f4}
table.data td.club{font-weight:600;white-space:nowrap}
table.data td.mono{font-family:'JetBrains Mono',monospace;font-size:.82rem;white-space:nowrap}
/* priority tiers - 3.4 contrast-safe, text label carries meaning not just colour */
.t-yes{color:var(--volt-deep);font-weight:600}
.t-strong{color:var(--amber-deep);font-weight:600}
.t-skip{color:var(--muted-txt)}

/* ---------- 1.3 accordions ---------- */
details.acc-table{
  border:2px solid var(--ink);border-radius:14px;background:#fff;
  margin:14px 0;box-shadow:4px 4px 0 var(--turf);overflow:hidden;
}
details.acc-table > summary{
  cursor:pointer;list-style:none;padding:12px 18px;
  font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;font-weight:500;color:var(--turf-deep);
  background:var(--turf-soft);border-bottom:2px solid transparent;
  display:flex;align-items:center;gap:9px;transition:background .12s;
}
details.acc-table > summary::-webkit-details-marker{display:none}
details.acc-table > summary::before{content:"▸";font-size:.85rem;transition:transform .15s ease;display:inline-block}
details.acc-table[open] > summary{border-bottom-color:var(--ink)}
details.acc-table[open] > summary::before{transform:rotate(90deg)}
details.acc-table > summary:hover{background:#d8e5d9}
details.acc-table .tbl-scroll{margin:0}
details.acc-table table.data{border:none;border-radius:0}
details.acc-table .acc-body{padding:16px 18px}

/* ---------- do / don't ---------- */
.do-dont{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:14px 0}
@media(max-width:700px){.do-dont{grid-template-columns:1fr}}
.dd{border:2px solid var(--ink);border-radius:14px;padding:18px;background:#fff}
.dd.do{box-shadow:5px 5px 0 var(--volt-mid)}
.dd.dont{box-shadow:5px 5px 0 var(--plasma-deep)}
.dd .tag{
  font-family:'JetBrains Mono',monospace;font-size:.72rem;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:9px;display:inline-block;
}
.dd.do .tag{color:var(--volt-deep)}
.dd.dont .tag{color:var(--plasma-deep)}
.dd ul{margin-left:18px}
.dd li{margin-bottom:6px;font-size:.92rem}

/* ---------- checklist ---------- */
.checklist{list-style:none;margin:12px 0}
.checklist li{
  display:flex;gap:11px;align-items:flex-start;padding:9px 0;
  border-bottom:1px dashed var(--paper-line);
}
.checklist li:last-child{border-bottom:none}
.checklist input[type=checkbox]{
  appearance:none;-webkit-appearance:none;flex:0 0 auto;
  width:21px;height:21px;border:2px solid var(--ink);border-radius:6px;
  background:#fff;cursor:pointer;margin-top:2px;position:relative;transition:all .1s;
}
.checklist input[type=checkbox]:checked{background:var(--volt)}
.checklist input[type=checkbox]:checked::after{
  content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:.85rem;font-weight:700;color:var(--ink);
}
.checklist label{cursor:pointer;font-size:.95rem;flex:1}
.checklist input:checked + label{opacity:.55;text-decoration:line-through}

/* ---------- glossary ---------- */
.gloss{border-top:2px solid var(--ink);padding-top:6px}
.gloss dl{margin:0}
.gloss dt{
  font-family:'Fraunces',serif;font-weight:600;font-size:1.02rem;margin-top:14px;color:var(--turf-deep);
  scroll-margin-top:80px;
}
.gloss dd{margin:2px 0 0 0;font-size:.94rem;color:#3a4150;max-width:72ch}
.gloss-count{
  font-family:'JetBrains Mono',monospace;font-size:.72rem;color:var(--muted-txt);
  margin-top:8px;display:block;
}

/* ---------- 2.2 glossary tooltips ---------- */
.gloss-tip{
  border-bottom:1.5px dotted var(--turf);cursor:help;text-decoration:none;
  background:none;border-top:0;border-left:0;border-right:0;padding:0;
  font:inherit;color:inherit;
}
.gloss-tip:hover,.gloss-tip:focus-visible{background:rgba(94,242,196,.28)}
.tip-pop{
  position:absolute;z-index:120;max-width:290px;
  background:var(--ink);color:var(--paper);border:2px solid var(--ink);
  border-radius:12px;padding:12px 14px;font-size:.86rem;line-height:1.5;
  box-shadow:4px 4px 0 rgba(0,0,0,.32);font-family:'Space Grotesk',sans-serif;
}
.tip-pop .tip-term{
  font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--volt);display:block;margin-bottom:5px;
}
.tip-pop a{color:var(--volt);border-bottom-color:var(--volt-mid);font-size:.8rem}
.tip-pop .tip-close{
  position:absolute;top:5px;right:9px;background:none;border:none;color:var(--paper);
  font-size:1.05rem;cursor:pointer;line-height:1;padding:3px;
}

/* ---------- 2.1 distance inputs ---------- */
.dist-in{
  font-family:'JetBrains Mono',monospace;font-size:.85rem;
  width:80px;padding:5px 8px;border:2px solid var(--ink);border-radius:7px;
  background:#fff;color:var(--ink);
}
.dist-in::placeholder{color:#9aa2ae}
.miss-in{width:100%;min-width:120px}
.dist-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.personal-flag{
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--turf-deep);background:var(--volt);
  border:1px solid var(--turf);border-radius:10px;padding:1px 6px;margin-left:6px;
}
.print-head{display:none}


/* 3.1.5 - card/panel headings are semantically h3 (no skipped levels)
   but keep the smaller visual weight the design calls for. */
h3.card-h{font-weight:600;font-size:1.03rem;margin:16px 0 6px}
.card h3.card-h{margin-top:0;font-size:1.25rem}
.panel-dark h3.card-h{color:var(--paper);margin-top:6px;font-size:1.2rem}
.dd h3.card-h{font-size:1.03rem;margin:16px 0 6px}

/* ---------- footer ---------- */
footer.site{border-top:2px solid var(--ink);padding:28px 0 40px;margin-top:26px}
footer.site small{font-family:'JetBrains Mono',monospace;font-size:.73rem;color:var(--muted-txt);display:block;line-height:1.9}
footer.site a{color:var(--muted-txt);border-bottom-color:var(--paper-line)}
footer.site a:hover{color:var(--turf-deep)}
.foot-motto{font-family:'Fraunces',serif;font-size:.95rem;color:var(--turf-deep);font-style:italic;letter-spacing:0}
.foot-meta{color:#7a828e;font-size:.68rem}

/* ---------- page nav ---------- */
.pagenav{display:flex;justify-content:space-between;gap:12px;margin-top:30px;flex-wrap:wrap}

/* ---------- video ---------- */
.video-wrap{
  position:relative;padding-bottom:56.25%;height:0;overflow:hidden;
  border:2px solid var(--ink);border-radius:14px;box-shadow:6px 6px 0 var(--turf);margin:16px 0 22px;
}
.video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}

/* ---------- misc ---------- */
.divider{height:2px;background:var(--ink);border:none;margin:28px 0}
.pill-row{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0}
.tag-mini{
  font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;
  border:1.5px solid var(--turf-deep);color:var(--turf-deep);border-radius:20px;padding:3px 9px;
}
.stat{font-family:'JetBrains Mono',monospace;font-weight:500}
kbd{
  font-family:'JetBrains Mono',monospace;font-size:.78rem;border:1.5px solid var(--ink);
  border-radius:5px;padding:1px 6px;background:#fff;box-shadow:2px 2px 0 var(--ink);
}
.jump-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:14px 0 4px}
.jump-row .btn{font-size:.76rem;padding:6px 13px}
/* cheatsheet sticky jump bar */
.stickynav{
  position:sticky;top:58px;z-index:30;background:var(--paper);
  border-bottom:2px solid var(--ink);padding:8px 0;margin-bottom:6px;
}
.stickynav .wrap{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.stickynav a{
  font-family:'JetBrains Mono',monospace;font-size:.66rem;letter-spacing:.08em;
  text-transform:uppercase;border:1.5px solid var(--turf);color:var(--turf-deep);
  border-radius:20px;padding:4px 10px;background:#fff;white-space:nowrap;
  /* touch target: >=44px tall on phones without inflating the visual pill */
  display:inline-flex;align-items:center;min-height:32px;
}
@media(max-width:820px){
  .stickynav a{min-height:44px;padding:4px 13px}
  .stickynav .wrap{gap:8px}
}
.stickynav a:hover{background:var(--volt);color:var(--ink);border-color:var(--ink)}

/* 5.1 - the three things a beginner actually looks up mid-round, promoted
   above the long tail so they are not one of thirteen equal-weight links. */
.stickynav a.jump-hot{
  background:var(--volt);border-color:var(--ink);color:var(--ink);font-weight:500;
  box-shadow:2px 2px 0 var(--ink);
}
.stickynav a.jump-hot:hover{background:#fff}
.jump-more{
  font-family:'JetBrains Mono',monospace;font-size:.66rem;letter-spacing:.08em;
  text-transform:uppercase;border:1.5px solid var(--turf);color:var(--turf-deep);
  border-radius:20px;padding:4px 10px;background:#fff;white-space:nowrap;cursor:pointer;
  display:inline-flex;align-items:center;min-height:32px;
}
.jump-more:hover{background:var(--volt);color:var(--ink);border-color:var(--ink)}
/* long tail: hidden until asked for, so the bar stays one row on a phone */
.jump-rest{display:none;gap:7px;flex-wrap:wrap;width:100%;padding-top:7px}
.jump-rest.open{display:flex}
@media(min-width:900px){
  /* desktop has the room: show everything, drop the toggle */
  .jump-more{display:none}
  .jump-rest{display:flex;width:auto;padding-top:0}
}
@media(max-width:820px){ .jump-more{min-height:44px} }

/* clearance = main nav (58) + sticky jump bar (62) + a little air.
   Measured, not guessed: headings were landing 6-10px under the bar at 110. */
section.sec[id]{scroll-margin-top:132px}
@media(min-width:900px){ section.sec[id]{scroll-margin-top:158px} }


/* 3.5 - comfortable touch targets on phones */
@media(max-width:820px){
  .nav a.nav-link{min-height:44px;display:flex;align-items:center}
  .nav-cheat{min-height:38px;display:inline-flex;align-items:center}
  .jump-row .btn{min-height:44px}
  .checklist input[type=checkbox]{width:24px;height:24px}
}

@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}

/* ==========================================================
   3.2 PRINT
   ========================================================== */
@media print{
  .nav,footer.site,.pagenav,.btn,.skip-link,.stickynav,.jump-row,.tip-pop,.scroll-hint{display:none!important}
  html,body{background:#fff!important;color:#000!important;background-image:none!important;font-size:11pt}
  .wrap,.wrap-wide,.tldr-wrap{max-width:100%;padding:0}
  a{color:#000;border-bottom:none}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.78em;color:#444}
  a[href^="#"]::after,a[href^="mailto"]::after{content:""}
  .card,.callout,.panel-dark,.dd,.tldr,details.acc-table{
    border:1px solid #000!important;box-shadow:none!important;background:#fff!important;
    page-break-inside:avoid;
  }
  .panel-dark,.panel-dark h4,.panel-dark p,.panel-dark .eyebrow{
    background:#fff!important;color:#000!important;background-image:none!important;
  }
  .tldr{border-left:4px solid #000!important}
  table.data{min-width:0!important;page-break-inside:avoid;border:1px solid #000!important}
  table.data th{background:#eee!important;color:#000!important}
  table.data tbody tr:nth-child(even){background:#f7f7f7!important}
  .tbl-scroll{overflow:visible!important;mask-image:none!important;-webkit-mask-image:none!important}
  /* accordions must force open, else blank pages */
  details.acc-table{display:block!important}
  details.acc-table > summary{display:none!important}
  details.acc-table > *{display:revert!important}
  section.sec{page-break-inside:auto;border-top:1px solid #000}
  h1,h2,h3,h4{page-break-after:avoid}
  .dist-in{border:none!important;border-bottom:1px solid #000!important;border-radius:0!important;width:70px}
  .hero p.lede{font-size:1rem}
}

/* 2.1 - print ONLY the distance table */
@media print{
  body.print-distances > main > *:not(#my-distances){display:none!important}
  body.print-distances #my-distances{border-top:none!important;padding-top:0!important}
  body.print-distances #my-distances .print-head{
    display:block!important;font-family:'Fraunces',serif;font-size:1.5rem;
    font-weight:700;margin-bottom:4px;
  }
  body.print-distances #my-distances .sec-head,
  body.print-distances #my-distances p.body,
  body.print-distances #my-distances .callout,
  body.print-distances #my-distances .dist-actions{display:none!important}
  body.print-distances #my-distances .card{border:none!important;padding:0!important}
}

/* ==========================================================
   IN THE SWING OF IT - level 2 additions
   Tokens above are unchanged. Everything here composes from them.
   Contrast: no new text-on-background pairs are introduced; all
   text below reuses ink / muted-txt / turf-deep / volt-deep /
   plasma-deep / amber-deep, which are audited in CONTRAST.txt.
   ========================================================== */

/* ---------- setup form ---------- */
.setup-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:820px){.setup-grid{grid-template-columns:1fr}}

.field{margin-bottom:20px}
.field:last-child{margin-bottom:0}
.field-label{
  font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--turf-deep);display:block;margin-bottom:4px;font-weight:500;
}
.field-help{font-size:.85rem;color:var(--muted-txt);margin-bottom:9px;max-width:60ch}

/* segmented control: ball count, session length */
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg input[type=radio]{position:absolute;opacity:0;width:0;height:0}
.seg label{
  font-family:'JetBrains Mono',monospace;font-size:.74rem;letter-spacing:.06em;
  border:2px solid var(--ink);border-radius:20px;padding:7px 14px;background:#fff;
  cursor:pointer;transition:all .12s ease;display:inline-flex;align-items:center;
  min-height:40px;color:var(--ink);
}
.seg label:hover{background:var(--turf-soft)}
.seg input[type=radio]:checked + label{
  background:var(--volt);box-shadow:2px 2px 0 var(--ink);font-weight:500;
}
.seg input[type=radio]:focus-visible + label{outline:3px solid var(--beaker);outline-offset:2px}

/* club checkboxes */
.club-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.club-opt{position:relative}
.club-opt input[type=checkbox]{position:absolute;opacity:0;width:0;height:0}
.club-opt label{
  display:flex;align-items:center;gap:9px;
  border:2px solid var(--ink);border-radius:12px;padding:9px 12px;background:#fff;
  cursor:pointer;transition:all .12s ease;font-size:.9rem;min-height:44px;
}
.club-opt label::before{
  content:"";flex:0 0 auto;width:19px;height:19px;border:2px solid var(--ink);
  border-radius:5px;background:#fff;transition:background .1s;
}
.club-opt label:hover{background:var(--turf-soft)}
.club-opt input[type=checkbox]:checked + label{box-shadow:2px 2px 0 var(--turf)}
.club-opt input[type=checkbox]:checked + label::before{
  background:var(--volt);
  /* checkmark drawn, not typed: the latin subset has no U+2713 */
  background-image:
    linear-gradient(45deg,transparent 44%,var(--ink) 44%,var(--ink) 56%,transparent 56%),
    linear-gradient(-45deg,transparent 62%,var(--ink) 62%,var(--ink) 74%,transparent 74%);
  background-size:60% 60%,60% 60%;
  background-position:38% 68%,60% 55%;
  background-repeat:no-repeat;
}
.club-opt input[type=checkbox]:focus-visible + label{outline:3px solid var(--beaker);outline-offset:2px}
.club-opt .club-sub{
  font-family:'JetBrains Mono',monospace;font-size:.62rem;color:var(--muted-txt);
  margin-left:auto;letter-spacing:.06em;
}

/* focus picker cards */
.focus-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.focus-opt{position:relative}
.focus-opt input[type=checkbox]{position:absolute;opacity:0;width:0;height:0}
.focus-opt label{
  display:block;border:2px solid var(--ink);border-radius:14px;padding:12px 14px;
  background:#fff;cursor:pointer;transition:all .12s ease;height:100%;
}
.focus-opt label:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--turf)}
.focus-opt input[type=checkbox]:checked + label{box-shadow:4px 4px 0 var(--volt-mid);background:#f7fffb}
.focus-opt input[type=checkbox]:focus-visible + label{outline:3px solid var(--beaker);outline-offset:2px}
.focus-opt .f-name{font-family:'Fraunces',serif;font-weight:600;font-size:1rem;display:block;margin-bottom:2px}
.focus-opt .f-desc{font-size:.82rem;color:var(--muted-txt);line-height:1.45;display:block}
.focus-opt .f-tick{
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--volt-deep);display:none;margin-top:6px;font-weight:500;
}
.focus-opt input[type=checkbox]:checked + label .f-tick{display:block}

/* ---------- miss tracker ---------- */
.miss-box{
  border:2px solid var(--ink);border-radius:14px;padding:14px 16px;margin-top:18px;
  background:#fbfaf6;
}
.miss-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:3px}
.miss-title{
  font-family:'JetBrains Mono',monospace;font-size:.66rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--turf-deep);font-weight:500;
}
.miss-opt{
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted-txt);
}
.miss-sub{font-size:.82rem;color:var(--muted-txt);margin-bottom:10px;max-width:62ch}
.miss-row{display:flex;flex-wrap:wrap;gap:7px}
.miss-btn{
  font-family:'Space Grotesk',sans-serif;font-size:.82rem;font-weight:500;
  border:2px solid var(--ink);border-radius:20px;padding:7px 13px;background:#fff;
  cursor:pointer;transition:all .11s ease;display:inline-flex;align-items:center;gap:7px;
  min-height:40px;color:var(--ink);
}
.miss-btn:hover{transform:translate(-1px,-1px);box-shadow:2px 2px 0 var(--ink)}
.miss-btn .cnt{
  font-family:'JetBrains Mono',monospace;font-size:.7rem;font-weight:500;
  background:var(--ink);color:var(--paper);border-radius:20px;
  min-width:21px;height:19px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;
}
.miss-btn.has{background:var(--sand)}
.miss-btn.good.has{background:var(--volt)}
.miss-btn.good .cnt{background:var(--volt-deep)}
.miss-clear{
  font-family:'JetBrains Mono',monospace;font-size:.64rem;letter-spacing:.1em;
  text-transform:uppercase;background:none;border:none;color:var(--muted-txt);
  cursor:pointer;padding:6px 2px;text-decoration:underline;
}
.miss-clear:hover{color:var(--plasma-deep)}
.miss-tally{
  font-family:'JetBrains Mono',monospace;font-size:.66rem;color:var(--muted-txt);
  margin-top:9px;display:block;
}

/* ---------- session summary ---------- */
.sum-hero{
  background:var(--ink);color:var(--paper);border-radius:18px;padding:26px;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:24px 24px;margin-bottom:18px;
}
.sum-hero .eyebrow{color:var(--volt)}
.sum-hero h3{color:var(--paper);font-size:1.6rem;margin:8px 0 6px}
.sum-hero p{color:#c9d1dc;max-width:66ch}

.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin:16px 0}
.stat-box{
  border:2px solid var(--ink);border-radius:14px;padding:13px 15px;background:#fff;
  box-shadow:3px 3px 0 var(--turf);
}
.stat-box .s-num{
  font-family:'JetBrains Mono',monospace;font-size:1.5rem;font-weight:500;
  display:block;line-height:1.2;color:var(--ink);
}
.stat-box .s-lab{
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted-txt);display:block;margin-top:2px;
}

/* horizontal bar chart, no library, no canvas */
.bars{margin:14px 0}
.bar-row{display:grid;grid-template-columns:118px 1fr 42px;gap:10px;align-items:center;margin-bottom:8px}
@media(max-width:600px){.bar-row{grid-template-columns:96px 1fr 36px;gap:7px}}
.bar-lab{font-size:.84rem;font-weight:500}
.bar-track{background:#e6e2d4;border:1.5px solid var(--ink);border-radius:20px;height:19px;overflow:hidden}
.bar-fill{height:100%;border-radius:20px 0 0 20px;transition:width .4s ease}
.bar-fill.f-good{background:var(--volt)}
.bar-fill.f-thin{background:var(--sky)}
.bar-fill.f-fat{background:var(--sand)}
.bar-fill.f-slice{background:var(--plasma)}
.bar-fill.f-hook{background:var(--beaker)}
.bar-fill.f-other{background:var(--fairway)}
.bar-val{font-family:'JetBrains Mono',monospace;font-size:.76rem;color:var(--muted-txt);text-align:right}

/* the "bring this to a coach" block */
.coach-card{
  border:2px solid var(--ink);border-left-width:8px;border-left-color:var(--plasma);
  border-radius:0 14px 14px 0;background:#fff;padding:18px 20px;margin:16px 0;
  box-shadow:4px 4px 0 var(--ink);
}
.coach-card .tag{
  font-family:'JetBrains Mono',monospace;font-size:.66rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--plasma-deep);display:block;margin-bottom:7px;font-weight:500;
}
.coach-line{
  font-family:'Fraunces',serif;font-size:1.12rem;line-height:1.5;margin:0 0 8px;
}

/* ---------- plan preview ---------- */
.plan-list{list-style:none;margin:12px 0}
.plan-list li{
  display:grid;grid-template-columns:74px 1fr;gap:12px;padding:9px 0;
  border-bottom:1px dashed var(--paper-line);align-items:baseline;
}
.plan-list li:last-child{border-bottom:none}
.plan-n{font-family:'JetBrains Mono',monospace;font-size:.74rem;color:var(--turf-deep)}
.plan-what strong{font-weight:600}
.plan-what span{display:block;font-size:.85rem;color:var(--muted-txt)}

/* ---------- file drop ---------- */
.drop{
  border:2px dashed var(--turf);border-radius:14px;padding:22px;text-align:center;
  background:#fff;transition:all .12s ease;cursor:pointer;
}
.drop.over{background:var(--turf-soft);border-color:var(--ink);border-style:solid}
.drop-title{font-family:'Fraunces',serif;font-weight:600;font-size:1.05rem;margin-bottom:3px}
.drop-sub{font-size:.85rem;color:var(--muted-txt)}

/* ---------- history ---------- */
.hist-row{
  display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;
  border:2px solid var(--ink);border-radius:12px;padding:11px 14px;background:#fff;margin-bottom:9px;
}
.hist-date{font-family:'JetBrains Mono',monospace;font-size:.72rem;color:var(--turf-deep)}
.hist-meta{font-size:.86rem;color:var(--muted-txt)}

@media print{
  .seg,.club-grid,.focus-grid,.miss-row,.drop,.miss-clear{display:none!important}
  .sum-hero{background:#fff!important;color:#000!important;background-image:none!important;
    border:1px solid #000!important}
  .sum-hero h3,.sum-hero p,.sum-hero .eyebrow{color:#000!important}
  .stat-box,.coach-card{box-shadow:none!important;border:1px solid #000!important;page-break-inside:avoid}
  .bar-track{border:1px solid #000!important}
  .bar-fill{background:#666!important}
}

/* ==========================================================
   PASS 3 additions
   Same rule as before: no new colour pairs. Every text colour
   below is already audited in CONTRAST.txt.
   ========================================================== */

/* screen-reader-only: visible to assistive tech, not to eyes.
   Used to announce block changes in the session runner without
   putting a duplicate heading on screen. */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ---------- step indicator (0.5) ---------- */
.stepbar{
  list-style:none;display:flex;gap:6px;flex-wrap:wrap;
  margin:0 0 22px;padding:0;
}
.stepbar li{
  display:flex;align-items:center;gap:7px;
  font-family:'JetBrains Mono',monospace;font-size:.66rem;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted-txt);                 /* 5.35:1 on paper */
  border:1.5px solid var(--paper-line);
  background:#fff;border-radius:20px;padding:5px 12px;
  transition:all .12s ease;
}
.stepbar .sb-n{
  font-weight:500;width:17px;height:17px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--paper);border:1.5px solid var(--paper-line);
  font-size:.6rem;color:var(--muted-txt);
}
/* done: quiet but clearly behind you */
.stepbar li.done{
  color:var(--turf-deep);                 /* 8.74:1 on paper */
  border-color:var(--turf);
}
.stepbar li.done .sb-n{
  background:var(--turf);border-color:var(--turf);color:#fff;  /* 6.29:1 */
}
/* current: the only loud one */
.stepbar li.on{
  color:var(--ink);                        /* 16.15:1 on paper */
  border-color:var(--ink);font-weight:500;
  box-shadow:2px 2px 0 var(--ink);
}
.stepbar li.on .sb-n{
  background:var(--volt);border-color:var(--ink);color:var(--ink); /* 13.25:1 */
}
@media(max-width:600px){
  .stepbar{gap:4px}
  .stepbar li{padding:4px 9px;font-size:.6rem;gap:5px}
}
@media print{ .stepbar{display:none!important} }

/* ---------- bag mapper (Phase 1) ---------- */
.bag-card{
  border:2px solid var(--ink);border-radius:18px;background:#fff;
  box-shadow:6px 6px 0 var(--turf);overflow:hidden;margin:16px 0;
}
.bag-head{
  background:var(--turf);border-bottom:2px solid var(--ink);padding:12px 18px;
  display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;
}
.bag-head .bh-t{
  font-family:'Fraunces',serif;font-weight:600;font-size:1.05rem;color:var(--paper);
}
.bag-head .bh-s{
  font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--volt);                    /* 4.49:1 on turf, decorative+label */
}
.bag-rows{padding:6px 0}
.bag-row{
  display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;
  padding:8px 18px;border-bottom:1px dashed var(--paper-line);
}
.bag-row:last-child{border-bottom:none}
.bag-row.not-owned{opacity:.42}
.bag-row.is-anchor{background:#f7fffb}
.bag-name{font-weight:500;font-size:.95rem}
.bag-val{
  font-family:'JetBrains Mono',monospace;font-size:.9rem;font-weight:500;
  color:var(--ink);white-space:nowrap;
}
.bag-val.vague{color:var(--muted-txt);font-size:.76rem;font-style:italic}

/* 1.3 - an estimate must never be mistakable for a measurement.
   Three separate signals, not just colour: the tag word, the border
   style, and the value formatting (a range vs a single number). */
.bag-tag{
  font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.11em;
  text-transform:uppercase;border-radius:20px;padding:2px 8px;white-space:nowrap;
  border:1.5px solid var(--paper-line);color:var(--muted-txt);background:var(--paper);
}
.bag-tag.t-measured{
  border:1.5px solid var(--volt-mid);background:var(--volt);color:var(--ink);   /* 13.25:1 */
  font-weight:500;
}
.bag-tag.t-anchor{
  border:1.5px solid var(--turf);background:var(--turf-soft);color:var(--turf-deep); /* 8.34:1 */
  font-weight:500;
}
.bag-tag.t-est{
  border:1.5px dashed var(--muted-txt);background:transparent;color:var(--muted-txt); /* 5.35:1 */
}

.bag-legend{
  display:flex;gap:14px;flex-wrap:wrap;padding:11px 18px;
  border-top:2px solid var(--ink);background:#fbfaf6;
}
.bag-legend span{
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted-txt);display:flex;align-items:center;gap:6px;
}

.anchor-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin:12px 0}
.anchor-row label{
  font-family:'JetBrains Mono',monospace;font-size:.64rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--turf-deep);display:block;margin-bottom:4px;
}
select.club-sel{
  font-family:'Space Grotesk',sans-serif;font-size:.9rem;
  padding:8px 10px;border:2px solid var(--ink);border-radius:8px;background:#fff;color:var(--ink);
  min-height:42px;
}

/* measured-distance inputs on the card */
.meas-in{
  font-family:'JetBrains Mono',monospace;font-size:.8rem;
  width:64px;padding:4px 7px;border:2px solid var(--paper-line);border-radius:6px;
  background:#fff;color:var(--ink);text-align:right;
}
.meas-in:focus{border-color:var(--ink)}
.meas-in::placeholder{color:#9aa2ae;font-style:italic}

@media(max-width:600px){
  .bag-row{grid-template-columns:1fr auto;gap:8px;padding:8px 12px}
  .bag-row .bag-tag{grid-column:2;justify-self:end}
  .bag-val{grid-column:2;justify-self:end}
  .bag-name{grid-column:1;grid-row:1/3}
}

@media print{
  .anchor-row,.bag-actions,.meas-in{display:none!important}
  .bag-card{box-shadow:none!important;border:1px solid #000!important;page-break-inside:avoid}
  .bag-head{background:#fff!important;border-bottom:1px solid #000!important}
  .bag-head .bh-t,.bag-head .bh-s{color:#000!important}
  .bag-tag{border:1px solid #000!important;background:#fff!important;color:#000!important}
  .bag-row.not-owned{display:none!important}
  body.print-bag > main > *:not(#bagmap){display:none!important}
  body.print-bag #bagmap{border-top:none!important;padding-top:0!important}
  body.print-bag #bagmap .sec-head,body.print-bag #bagmap p.body,
  body.print-bag #bagmap .callout{display:none!important}
}

/* ---------- coach view (Phase 2) ----------
   Design constraint: a coach reads this in under a minute, before a lesson,
   on whatever device is in their hand. One screen, no scrolling, miss matrix
   loudest. Everything here is sized against that. */
.cv-wrap{max-width:1000px;margin:0 auto;padding:0 20px}
.cv-head{
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  flex-wrap:wrap;padding:14px 0 10px;border-bottom:2px solid var(--ink);margin-bottom:14px;
}
.cv-title{font-family:'Fraunces',serif;font-weight:700;font-size:1.5rem;letter-spacing:-.02em}
.cv-sub{
  font-family:'JetBrains Mono',monospace;font-size:.66rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted-txt);
}

/* volume strip */
.cv-vol{display:grid;grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:9px;margin-bottom:14px}
.cv-stat{border:2px solid var(--ink);border-radius:12px;padding:9px 12px;background:#fff}
.cv-stat .n{
  font-family:'JetBrains Mono',monospace;font-size:1.35rem;font-weight:500;
  display:block;line-height:1.15;color:var(--ink);
}
.cv-stat .k{
  font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--muted-txt);display:block;margin-top:1px;
}

/* THE MISS MATRIX - the loudest thing on the page, per 2.3 */
.cv-matrix{
  border:2px solid var(--ink);border-radius:14px;overflow:hidden;
  box-shadow:5px 5px 0 var(--ink);margin-bottom:14px;background:#fff;
}
.cv-matrix .mx-head{
  background:var(--ink);color:var(--paper);padding:8px 16px;
  font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
}
.mx-row{
  display:grid;grid-template-columns:1.1fr 1.5fr 1fr;gap:12px;align-items:center;
  padding:11px 16px;border-bottom:1px solid var(--paper-line);
}
.mx-row:last-child{border-bottom:none}
.mx-club{font-weight:600;font-size:.95rem}
.mx-club .mx-n{
  font-family:'JetBrains Mono',monospace;font-size:.62rem;color:var(--muted-txt);
  display:block;font-weight:400;letter-spacing:.06em;
}
/* the number a coach actually reads: biggest type on the page */
.mx-miss{
  font-family:'Fraunces',serif;font-weight:700;font-size:1.32rem;line-height:1.2;
  color:var(--ink);
}
.mx-miss.thin-data{
  font-family:'Space Grotesk',sans-serif;font-weight:400;font-size:.92rem;
  color:var(--muted-txt);font-style:italic;
}
.mx-share{
  font-family:'JetBrains Mono',monospace;font-size:.74rem;color:var(--muted-txt);
}
.mx-second{font-size:.8rem;color:var(--muted-txt);display:block;margin-top:2px}

/* two-up lower panels */
.cv-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:760px){.cv-cols{grid-template-columns:1fr}}
.cv-panel{border:2px solid var(--ink);border-radius:14px;background:#fff;padding:12px 15px}
.cv-panel h2{
  /* semantically a section heading under the page h1; visually a micro-label.
     Levelled correctly for screen readers, sized for the 45-second read. */
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--turf-deep);margin:0 0 8px;font-weight:500;
  letter-spacing:.13em;
}

/* diet bars: planned vs logged, stacked so the gap is the visual */
.diet-row{margin-bottom:9px}
.diet-lab{
  display:flex;justify-content:space-between;font-size:.78rem;margin-bottom:3px;gap:8px;
}
.diet-lab .dl-n{font-family:'JetBrains Mono',monospace;font-size:.68rem;color:var(--muted-txt)}
.diet-pair{display:flex;flex-direction:column;gap:2px}
.diet-track{background:#e6e2d4;border:1px solid var(--ink);border-radius:20px;height:11px;overflow:hidden}
.diet-fill{height:100%;border-radius:20px 0 0 20px}
.diet-fill.planned{background:var(--sand)}
.diet-fill.logged{background:var(--volt)}
.diet-key{
  font-family:'JetBrains Mono',monospace;font-size:.55rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted-txt);display:flex;gap:10px;margin-top:7px;
}
.diet-key i{width:9px;height:9px;border:1px solid var(--ink);border-radius:2px;display:inline-block;margin-right:4px}
.diet-key i.p{background:var(--sand)}
.diet-key i.l{background:var(--volt)}

.cv-goals{list-style:none;margin:0}
.cv-goals li{
  font-size:.88rem;padding:4px 0;border-bottom:1px dashed var(--paper-line);
}
.cv-goals li:last-child{border-bottom:none}
.cv-dist{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.cv-dist span{
  font-family:'JetBrains Mono',monospace;font-size:.68rem;
  border:1.5px solid var(--volt-mid);background:var(--volt);color:var(--ink);
  border-radius:20px;padding:2px 8px;
}

/* the refusal state, which must be as loud as any verdict */
.cv-refuse{
  border:2px solid var(--ink);border-left-width:8px;border-left-color:var(--amber);
  border-radius:0 14px 14px 0;background:#fdf3e0;padding:16px 18px;margin-bottom:14px;
}
.cv-refuse .tag{
  font-family:'JetBrains Mono',monospace;font-size:.64rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--amber-deep);display:block;margin-bottom:5px;font-weight:500;
}
.cv-refuse p{font-size:.92rem;max-width:68ch}

.cv-foot{
  margin-top:14px;padding-top:10px;border-top:1.5px solid var(--paper-line);
  font-family:'JetBrains Mono',monospace;font-size:.6rem;color:var(--muted-txt);
  display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;
}

@media print{
  .cv-matrix{box-shadow:none!important}
  .cv-nav,.cv-actions{display:none!important}
}
