/* Climbing Notes components. Uses only the tokens defined in style.css (copied unchanged from security-notes). */
.ev{display:inline-block;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:1px 8px;margin-right:6px;border-radius:999px;vertical-align:1px}
.ev-m{color:var(--hi);background:color-mix(in srgb,var(--hi) 13%,transparent)}
.ev-c{color:var(--mid);background:color-mix(in srgb,var(--mid) 13%,transparent)}
.ev-x{color:var(--accent);background:color-mix(in srgb,var(--accent) 13%,transparent)}
.group li.planned a{color:var(--muted)}.group li.planned small{font-style:italic}

/* ── simulators (figure.sim) ── */
.sim{margin:18px 0;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--bg)}
.sim figcaption{font-weight:700;color:var(--strong);margin-bottom:4px}
.sim-note{font-size:13px;color:var(--muted);margin:0 0 12px!important}
.fa-arms{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fa-arm svg{width:100%;height:auto;display:block}
.fa-skin{fill:var(--card);stroke:var(--line);stroke-width:2}
.fa-muscle{stroke:color-mix(in srgb,var(--fg) 25%,transparent);stroke-width:1;transition:fill .2s}
.fa-vessel{fill:none;stroke:color-mix(in srgb,var(--crit) 25%,transparent);stroke-width:5;stroke-linecap:round}
.fa-blood{fill:none;stroke:var(--crit);stroke-width:3;stroke-linecap:round;stroke-dasharray:6 10}
.fa-cap{font-size:12.5px;line-height:1.4;color:var(--muted)}.fa-cap b{color:var(--fg)}
.fa-pct{display:block;font-weight:700;color:var(--fg)}
.sim-chart{width:100%;height:auto;display:block;margin-top:10px}
.sim-grid line{stroke:var(--line)}.sim-grid line.ready{stroke:var(--muted);stroke-dasharray:4 4}
.sim-grid text{fill:var(--muted);font-size:11px;text-anchor:end}.sim-grid text.tx{text-anchor:middle}
.ln-a,.ln-b{fill:none;stroke-width:2.5}.ln-a{stroke:var(--accent)}.ln-b{stroke:var(--mid)}
.sim-head{stroke:var(--fg);stroke-width:1;opacity:.5}
.sim-legend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--muted)}
.sim-legend span::before{content:"";display:inline-block;width:14px;height:3px;margin-right:6px;vertical-align:middle;background:currentColor}
.lg-a::before{color:var(--accent)}.lg-b::before{color:var(--mid)}.lg-r::before{color:var(--muted)}
.sim-out{margin:12px 0!important;padding:10px 12px;border-left:3px solid var(--accent);background:var(--card);border-radius:0 8px 8px 0;font-size:14.5px}
.sim-ctl{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px}
.sim-time{flex:1 1 200px;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.sim-time input{flex:1}
.sim-sliders{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px 18px}
.sim-sliders label{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 8px;font-size:13px}
.sim-sliders output,.sim-time output{font-weight:700;color:var(--fg);font-variant-numeric:tabular-nums}
.sim input[type=range]{width:100%;min-height:32px;accent-color:var(--accent);margin:0}
.sim-hint{grid-column:1/-1;font-size:12px;color:var(--muted);margin:0!important}
.sim .chip{justify-self:start;padding:8px 14px;font-size:13px;min-height:36px}
@media (max-width:520px){.fa-arms{grid-template-columns:1fr}.sim{padding:12px;margin-left:-8px;margin-right:-8px}}
@media (prefers-reduced-motion:reduce){.fa-muscle{transition:none}}

/* ── line drawings (diagrams.mjs) ── */
.diagram-fig{margin:16px 0}.diagram-fig>figcaption{font-size:13px;color:var(--muted);margin-top:6px}
.dg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.dg-panel{margin:0;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:8px}
.dg-panel figcaption{font-size:12.5px;line-height:1.35;color:var(--muted)}.dg-panel figcaption b{display:block;color:var(--fg);font-size:13.5px}
.dg-wide{overflow-x:auto}.dg-wide .dg{min-width:480px}
.dg{width:100%;height:auto;display:block;fill:none;stroke-linecap:round;stroke-linejoin:round}
.dg-body{stroke:var(--fg);stroke-width:4}.dg-head{fill:var(--card);stroke:var(--fg);stroke-width:3}
.dg-hold{fill:color-mix(in srgb,var(--mid) 45%,var(--card));stroke:var(--mid);stroke-width:1.5}
.dg-wall{fill:var(--code);stroke:var(--line);stroke-width:1}.dg-wallline{stroke:var(--muted);stroke-width:3;stroke-dasharray:2 5}
.dg-cut{fill:var(--card);stroke:var(--mid);stroke-width:1.5}
.dg-arrow{stroke:var(--accent);stroke-width:2.5}.dg-arrow.crit{stroke:var(--crit)}
.dg-text{fill:var(--muted);stroke:none;font-size:12px}.dg-text.sm{font-size:11px}.dg-text.strong{fill:var(--fg);font-weight:700}
.dg-bone{stroke:color-mix(in srgb,var(--fg) 55%,var(--card));stroke-width:14}.dg-joint{fill:var(--card);stroke:var(--fg);stroke-width:1.5}
.dg-load{fill:color-mix(in srgb,var(--crit) 35%,transparent);stroke:var(--crit);stroke-width:1.5}
.dg-bonefill{fill:color-mix(in srgb,var(--fg) 14%,var(--card));stroke:color-mix(in srgb,var(--fg) 40%,var(--card));stroke-width:1.5}
.dg-plate{fill:var(--accent);stroke:none}.dg-tendon{stroke:var(--mid);stroke-width:3}
.dg-pulley{fill:color-mix(in srgb,var(--hi) 35%,var(--card));stroke:var(--hi);stroke-width:1.5}
.dg-draw{fill:var(--accent);stroke:none}

/* ── shared sim pieces: line colours, legends, gauges ── */
.ln-a{--c:var(--accent)}.ln-b{--c:var(--mid)}.ln-pcr{--c:var(--accent)}.ln-gly{--c:var(--crit)}.ln-aer{--c:var(--hi)}.ln-fa{--c:var(--mid)}.ln-cf{--c:var(--muted)}
polyline[class^=ln-],polyline[class*=" ln-"],line.ln-cf{fill:none;stroke:var(--c);stroke-width:2.5}
line.ln-cf{stroke-dasharray:6 5;stroke-width:2}polyline.dash{stroke-dasharray:5 5;stroke-width:1.8;opacity:.75}
.sim-legend .lg::before{background:var(--c,var(--muted))}.sim-legend .lg.dash::before{background:repeating-linear-gradient(90deg,var(--muted) 0 4px,transparent 4px 7px)}
.er-gauges{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:6px 16px;margin:10px 0}
.er-g{display:grid;grid-template-columns:1fr auto;gap:2px 8px;font-size:12.5px;color:var(--muted)}
.er-g b{color:var(--fg);font-variant-numeric:tabular-nums}.er-g i{grid-column:1/-1;height:8px;border-radius:99px;background:var(--line);overflow:hidden}
.er-g s{display:block;height:100%;width:0;background:var(--c);border-radius:99px;transition:width .15s}
.sim.still .er-g s,.sim.still .er-me{transition:none}
@media (prefers-reduced-motion:reduce){.er-g s,.er-me{transition:none}}

/* route diagrams */
.er-route{width:100%;height:auto;display:block;margin:4px 0}
.er-crux{fill:color-mix(in srgb,var(--crit) 10%,transparent);stroke:none}.er-lbl{fill:var(--crit);font-size:10px;font-weight:700;text-anchor:middle}
.er-path{fill:none;stroke:var(--line);stroke-width:2}
.er-hold{fill:var(--muted)}.er-rest{fill:var(--hi)}.er-me{fill:var(--accent);stroke:var(--card);stroke-width:2;transition:cx .15s,cy .15s}.er-me.resting{fill:var(--hi)}
.er-x,.sc-x{fill:var(--crit);font-size:14px;font-weight:800;text-anchor:middle}
.er-share{margin-top:8px}.er-sbar{display:grid;grid-template-columns:minmax(120px,1.2fr) 2fr auto;align-items:center;gap:8px;font-size:12.5px;margin:4px 0}
.er-sbar i{display:flex;height:12px;border-radius:99px;overflow:hidden;background:var(--line)}
.er-sbar s{display:block;height:100%}.er-sbar .sh0{background:var(--hi)}.er-sbar .sh1{background:var(--accent)}.er-sbar .sh2{background:var(--crit)}
.er-sbar small{font-variant-numeric:tabular-nums;color:var(--muted)}
@media (max-width:520px){.er-sbar{grid-template-columns:1fr auto}.er-sbar i{grid-column:1/-1;grid-row:2}}

/* critical force */
.cf-above{fill:color-mix(in srgb,var(--crit) 7%,transparent)}.cf-lbl{fill:var(--muted);font-size:11px;text-anchor:end}

/* study explorer */
.st-sets,.st-views{margin:6px 0}.st-title{margin:12px 0 4px!important}.st-title small{color:var(--muted);font-weight:400}
.st-g{fill:var(--fg);font-size:12px;text-anchor:end}.st-n,.st-t{fill:var(--muted);font-size:10.5px}.st-n{text-anchor:end}.st-t{text-anchor:middle}
.st-tick{stroke:var(--line)}.st-v{fill:var(--fg);font-size:11.5px;font-variant-numeric:tabular-nums}
.st-bar.s0{fill:var(--accent)}.st-bar.s1{fill:var(--mid)}.st-bar.s2{fill:var(--crit)}
.st-s0{--c:var(--accent)}.st-s1{--c:var(--mid)}.st-s2{--c:var(--crit)}
.st-range{fill:color-mix(in srgb,var(--crit) 25%,transparent);stroke:var(--crit)}.st-sd{stroke:var(--fg);stroke-width:1.5}
.st-table{margin:6px 0;font-size:13px}.st-table summary{cursor:pointer;color:var(--accent)}

/* scenario player */
.sc-grid{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:14px;align-items:start}
.sc-wall{width:100%;height:auto;background:var(--card);border:1px solid var(--line);border-radius:12px}
.sc-sit{font-size:14.5px;margin:6px 0 10px!important}
.sc-choices{display:flex;flex-direction:column;gap:8px}.sc-choices .btn{justify-content:flex-start;text-align:left;min-height:44px;white-space:normal}
.sc-choices .btn[aria-pressed=true]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--card))}
.sc-out{margin-top:12px}.sc-out h4{margin:10px 0 4px!important}
.sc-res{padding:10px 12px;border-radius:10px;border-left:4px solid var(--hi);background:color-mix(in srgb,var(--hi) 8%,var(--card))}
.sc-res.fall,.sc-res.time{border-left-color:var(--crit);background:color-mix(in srgb,var(--crit) 8%,var(--card))}
@media (max-width:560px){.sc-grid{grid-template-columns:1fr}.sc-wall{max-width:170px;justify-self:center}}

/* growth plate */
.gp-h{margin:14px 0 4px!important}.gp-grow,.gp-load{width:100%;height:auto;display:block;background:var(--card);border:1px solid var(--line);border-radius:12px;margin:6px 0}
.gp-bone{fill:color-mix(in srgb,var(--fg) 14%,var(--card));stroke:color-mix(in srgb,var(--fg) 40%,var(--card));stroke-width:1.5}
.gp-bonel{fill:none;stroke:color-mix(in srgb,var(--fg) 22%,var(--card));stroke-width:24;stroke-linecap:round;stroke-linejoin:round}
.gp-plate{fill:var(--accent)}.gp-plate-l{stroke:var(--accent);stroke-width:4;stroke-linecap:round}
.gp-scar{stroke:color-mix(in srgb,var(--fg) 30%,var(--card));stroke-width:1.5;stroke-dasharray:3 3}
.gp-new{stroke:color-mix(in srgb,var(--hi) 70%,transparent);stroke-width:2}
.gp-hot{fill:color-mix(in srgb,var(--crit) 40%,transparent);stroke:var(--crit);stroke-width:1.5}
.gp-micro{stroke:var(--crit);stroke-width:1.5}.gp-crack{fill:none;stroke:var(--crit);stroke-width:3;stroke-linecap:round}
.gp-lead{stroke:var(--muted);stroke-width:1;stroke-dasharray:3 3}
.prose .dg-panel figcaption,.prose .diagram-fig>figcaption{text-transform:none;letter-spacing:0;font-weight:400}
/* a11y: links in text blocks need more than colour (axe link-in-text-block) */
.foot a{text-decoration:underline;text-underline-offset:2px}
/* search: q-slot hits here are memory hooks and terms, not interview questions */
.result .hits a.qh::before{content:none}

/* half-time explainer */
.ht-tank{display:flex;height:22px;border-radius:99px;overflow:hidden;background:var(--line);margin:8px 0 4px}
.ht-tank span{display:block;height:100%;transition:width .12s}
.ht-have,.ht-l-have{--c:var(--accent)}.ht-back,.ht-l-back{--c:var(--hi)}.ht-lost,.ht-l-lost{--c:color-mix(in srgb,var(--crit) 35%,var(--line))}
.ht-tank span{background:var(--c)}
.ht-step{stroke:var(--muted);stroke-dasharray:3 4}.ht-dot{fill:var(--hi);stroke:var(--card);stroke-width:2}
.ht-lbl{fill:var(--fg);font-size:10.5px}
.ht-three .sh0{background:var(--accent)}.ht-three .sh1{background:var(--hi)}
@media (prefers-reduced-motion:reduce){.ht-tank span{transition:none}}

/* arm position */
.ap-grid{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:14px;align-items:start}
.ap-fig{width:100%;height:auto;background:var(--card);border:1px solid var(--line);border-radius:12px;fill:none;stroke-linecap:round;stroke-linejoin:round}
.ap-heart{stroke:var(--crit);stroke-dasharray:4 4;opacity:.6}.ap-arm{stroke:var(--accent);stroke-width:5}.ap-hand{fill:var(--accent)}
.ap-dh{stroke:var(--muted);stroke-width:1.5}
.ap-g{grid-template-columns:1fr}.ap-meas{margin-top:10px;font-size:13.5px}.ap-meas ul{margin:6px 0 0}
@media (max-width:560px){.ap-grid{grid-template-columns:1fr}.ap-fig{max-width:200px;justify-self:center}}

/* grip-load calculator */
.gl-band{fill:color-mix(in srgb,var(--crit) 14%,transparent);stroke:color-mix(in srgb,var(--crit) 50%,transparent)}
.gl-t{fill:var(--muted);font-size:11px;text-anchor:middle}.gl-n{fill:var(--muted);font-size:10.5px;text-anchor:middle}
.gl-axis{stroke:var(--line);stroke-width:2}
.gl-me{stroke:var(--card);stroke-width:2}.gl-me.below{fill:var(--hi)}.gl-me.above{fill:var(--mid)}.gl-me.occluding,.gl-me.occluded{fill:var(--crit)}
.gl-me-t{fill:var(--accent-fg);font-size:10px;font-weight:800;text-anchor:middle}
.gl-list{margin:4px 0 0;font-size:13.5px}
.gl-scale{max-width:480px;margin-left:auto;margin-right:auto}