/* Classfern Music keyword pages: orchestral strings (group K). The fk-* and staff rules are the same as groups F and J (f-kw.css, fb.css). */
.fk-answer{font-size:1.08rem;line-height:1.6;max-width:72ch;margin:6px 0 10px}
.fk-updated{font-size:.88rem;color:var(--muted);margin:4px 0 14px}
.fk-facts{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px 18px;margin:14px 0;max-width:72ch}
.fk-facts h2{margin:4px 0 6px;font-size:1.15rem}
.fk-facts ul{margin:0;padding-left:1.2em}
.fk-facts li{margin:3px 0}
.fk-label{display:inline-block;font-size:.82rem;font-weight:650;padding:2px 8px;border-radius:8px;background:var(--brand-soft);color:var(--brand-2);border:1px solid var(--line);margin:2px 0}
.fk-btns{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0;align-items:center}
.fk-btns .btn{min-width:44px}
.fk-btns .btn small{font-weight:500;opacity:.85}
.fk-btns .btn[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.fk-live{min-height:1.5em;font-weight:650;margin:6px 0}
.fk-scroll{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.fk-scroll table{min-width:300px}
.fk-steps>li{margin:6px 0}
.fk-direct{font-weight:500}
.fb-row{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-end;margin:8px 0}
.fb-row .mu-field{display:flex;flex-direction:column;gap:2px;font-size:.9rem}
.fb-row select,.fb-row input[type=number]{min-height:44px;font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line-2);border-radius:10px;padding:6px 8px;max-width:100%}
.fb-row input[type=number]{width:7em}
/* Fingering chart: every cell is a button */
.ks-board{border-collapse:collapse;font-variant-numeric:tabular-nums}
.ks-board th,.ks-board td{border:1px solid var(--line);padding:2px;text-align:center}
.ks-board thead th{font-size:.8rem;color:var(--muted);padding:4px}
.ks-board tbody th{padding:2px 8px;white-space:nowrap}
.ks-n{min-width:52px;min-height:44px;font:inherit;font-weight:650;background:var(--surface);color:var(--ink);border:1px solid transparent;border-radius:8px;cursor:pointer;padding:2px 4px;line-height:1.15}
.ks-n:hover{border-color:var(--line-2)}
.ks-n:focus-visible{outline:3px solid var(--brand);outline-offset:1px}
.ks-n small{display:block;font-size:.68rem;color:var(--muted);font-weight:400}
.ks-n.hit{outline:3px solid var(--ink);background:var(--accent-soft);font-weight:800}
.ks-n.hit::before{content:"★ "}
.ks-n.now{box-shadow:inset 0 -4px 0 var(--brand)}
.ks-empty{color:var(--muted)}
/* Scales */
.ks-scales{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin:10px 0;padding:0;list-style:none}
.ks-scales>li{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.ks-scales>li.ks-cur{border:2px solid var(--ink)}
.ks-scales h3{margin:2px 0 4px;font-size:1.05rem}
.ks-scales p{margin:4px 0;font-size:.9rem}
.ks-scale{display:flex;flex-wrap:wrap;gap:4px;list-style:none;padding:0;margin:6px 0}
.ks-scale li{border:1px solid var(--line-2);border-radius:8px;padding:2px 6px;text-align:center;min-width:2.6em;font-weight:650;font-size:.92rem}
.ks-scale li small{display:block;font-size:.7rem;font-weight:400;color:var(--muted)}
.ks-scale li.on{background:var(--accent-soft);border:3px solid var(--ink);text-decoration:underline}
.ks-now{font-size:.95rem;margin:6px 0}
/* Harp */
.ks-harp{display:flex;align-items:flex-end;gap:3px;margin:12px 0 6px;padding:0 0 4px;list-style:none;overflow-x:auto}
.ks-harp li{flex:0 0 auto}
.ks-str{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:34px;min-height:120px;padding:4px 0;font:inherit;background:none;border:1px solid transparent;border-radius:8px;cursor:pointer;color:var(--ink)}
.ks-str::before{content:"";display:block;width:3px;flex:1 1 auto;min-height:60px;background:var(--line-2);border-radius:2px;margin-bottom:4px}
.ks-str.c::before{background:#c62828;width:4px}
.ks-str.f::before{background:#1a237e;width:4px}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .ks-str.f::before{background:#7986cb}}
:root[data-theme=dark] .ks-str.f::before{background:#7986cb}
.ks-str b{font-size:.85rem}
.ks-str small{font-size:.6rem;color:var(--muted);min-height:1.5em;text-align:center;line-height:1.1}
.ks-str.up b{text-decoration:underline}
.ks-str.on{background:var(--accent-soft);border-color:var(--ink)}
.ks-str:focus-visible{outline:3px solid var(--brand)}
/* Violin parts diagram */
.ks-parts-wrap{display:grid;grid-template-columns:minmax(200px,300px) 1fr;gap:16px;align-items:start}
.ks-vp{width:100%;max-width:300px;height:auto;color:var(--ink)}
.ks-vp .o{fill:var(--brand-soft);stroke:currentColor;stroke-width:2}
.ks-vp .l{fill:none;stroke:currentColor;stroke-width:1.5}
.ks-vp .d{fill:currentColor}
.ks-vp text{font-size:13px;font-weight:700;fill:currentColor;text-anchor:middle}
.ks-vp [data-p] circle{fill:var(--surface);stroke:currentColor;stroke-width:2}
.ks-vp [data-p].on circle{fill:var(--accent);stroke-width:3.5}
.ks-vp [data-p].on text{text-decoration:underline}
.ks-partlist{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
.ks-partlist .btn{width:100%;justify-content:flex-start;text-align:left;min-height:44px}
.ks-partlist .btn[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--surface)}
@media (max-width:600px){.ks-parts-wrap{grid-template-columns:1fr}.ks-vp{max-width:220px;margin:0 auto;display:block}}
/* Songs and sheet music */
.ks-songs{list-style:none;padding:0;margin:10px 0;display:grid;gap:10px}
.ks-songs>li{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.ks-songs h3{margin:2px 0 4px;font-size:1.08rem}
.ks-songs p{margin:4px 0}
.ks-meta{font-size:.85rem;color:var(--muted)}
.ks-bars{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9rem;line-height:1.7;overflow-wrap:anywhere;margin:6px 0}
.ks-bars b{white-space:nowrap;font-weight:600}.ks-songs>li{min-width:0}
.ks-bars i{font-style:normal;color:var(--muted);font-size:.8em}
.ks-player{margin:14px 0;padding:10px;border:2px solid var(--line-2);border-radius:14px}
.ks-player>h2{margin-top:0}
html.bz-kids .fk-btns .btn,html.bz-kids .ks-songs .btn{font-size:1.15rem;min-height:56px;padding:12px 20px}
html.bz-kids .fk-live{font-size:1.25rem}
html.bz-kids .ks-n{min-width:60px;min-height:56px;font-size:1.1rem}
html.bz-kids .ks-str{width:42px;min-height:150px}
html.bz-kids .ks-str b{font-size:1.05rem}
@media (max-width:600px){.ks-n{min-width:44px;min-height:42px;font-size:.88rem}.ks-board tbody th{padding:2px 4px}}
@media print{.tool .fk-btns,.fb-row,.fk-kids,.privacy,.cards,.ks-songs .btn,.staff-art,.staff-tip{display:none}.ks-songs>li{break-inside:avoid;border:1px solid #999}}
/* Music staff illustrations (shared pattern; the lead merges these into one file) */
:root{--staff-tip-bg:#e6f4f0;--staff-tip-line:#bfe1d8}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--staff-tip-bg:#16302b;--staff-tip-line:#28524a}}
:root[data-theme=dark]{--staff-tip-bg:#16302b;--staff-tip-line:#28524a}
.staff-art{margin:4px 0 12px;width:260px;max-width:100%;background:none;border:0;padding:0}
.staff-art img,.staff-tip img{display:block;width:100%;height:auto;background:none;border:0}
.staff-art--right{float:right;margin-left:20px}
.staff-art--left{float:left;margin-right:20px}
.prose h2{clear:both}
.staff-tip{display:flex;align-items:center;gap:14px;background:var(--staff-tip-bg);border:1px solid var(--staff-tip-line);border-radius:18px;padding:14px 18px 14px 0;margin:28px 0 20px 0;max-width:72ch;clear:both}
.staff-tip picture{flex:0 0 140px;max-width:140px;margin:-34px 0 -14px -10px}
.staff-tip div{flex:1 1 auto;min-width:0}
.staff-tip p{margin:4px 0}
.staff-tip__who{font-weight:700;color:var(--brand-2)}
@media (max-width:600px){.staff-art--right,.staff-art--left{float:none;margin:8px auto 14px;width:180px}.staff-tip{padding:12px 14px 12px 0}.staff-tip picture{flex-basis:96px;max-width:96px;margin:-24px 0 -12px -6px}}
.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}
.ks-clear{clear:both}
