/* Koaksiyel Kablo Veritabanı - TA3HX
   Görsel dil: aprsagent.com site ailesi (C:\Claude Projects\_shared\aprsagent-site-standardi\).
   Sıcak kâğıt üzerine teknik mürekkep, Maidenhead ızgarası, üstte airmail şeridi, mono büyük harf başlıklar,
   2px köşe, ortak kenarlı tablolar. Açık tema esas; koyu tema ailenin koyu değerleriyle. */

*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}

:root,html[data-theme="light"]{
  --bg:#f6f3ea;--bg2:#efebdf;--view:#fdfbf5;--card:#fdfbf5;--card-hover:#efebdf;
  --fg:#22201a;--fg2:#3f3a31;--dim:#635c50;
  --border:#d9d2c2;--border2:#c6bda8;--ink-line:#22201a;
  --accent:#b0413e;--accent-fg:#fdfbf5;--accent2:#24506e;--link:#24506e;
  --accent-soft:rgba(36,80,110,.08);--track:rgba(34,32,26,.08);
  --warn:#8a5a0c;--warn-soft:rgba(181,122,24,.13);
  --grid-a:rgba(36,80,110,.085);--grid-b:rgba(36,80,110,.038);
  --shadow:none;--r:2px;--art-edge:rgba(0,0,0,.28);
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
html[data-theme="dark"]{
  --bg:#1b1a16;--bg2:#24221d;--view:#211f1a;--card:#211f1a;--card-hover:#2a2822;
  --fg:#ece6d8;--fg2:#d2cbbb;--dim:#b3aa98;
  --border:#3a362e;--border2:#4a453b;--ink-line:#8a826f;
  --accent:#d0605c;--accent-fg:#1b1a16;--accent2:#7eaacb;--link:#8fb6d4;
  --accent-soft:rgba(126,170,203,.12);--track:rgba(236,230,216,.12);
  --warn:#d39a3a;--warn-soft:rgba(211,154,58,.14);
  --grid-a:rgba(126,170,203,.07);--grid-b:rgba(126,170,203,.03);
  --art-edge:rgba(255,255,255,.22);
}

/* Grafik kategorik paleti: ailenin renk aileleri (lacivert, kırmızı, camgöbeği, bakır, mor, yeşil, gül, zeytin),
   dataviz doğrulayıcısıyla ölçüldü (2026-10-10): açıklık bandı, doygunluk, renk körlüğünde komşu ayrımı ≥ 9,8,
   kâğıt ve koyu zeminde ≥ 3:1. Sıra sabittir. */
:root,html[data-theme="light"]{--series-1:#1c67a4;--series-2:#b94642;--series-3:#0099a6;--series-4:#c38323;--series-5:#754d9e;--series-6:#36884d;--series-7:#cc6490;--series-8:#85861f;--grid:rgba(34,32,26,.10);--grid2:rgba(34,32,26,.045)}
html[data-theme="dark"]{--series-1:#448bcb;--series-2:#d15c56;--series-3:#13a5b2;--series-4:#c48525;--series-5:#926abe;--series-6:#318c4c;--series-7:#d76797;--series-8:#969841;--grid:rgba(236,230,216,.12);--grid2:rgba(236,230,216,.05)}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg)}
/* Maidenhead ızgarası: ince kareler, her beşte bir kalın çizgi */
body{font:15px/1.5 var(--sans);color:var(--fg);min-height:100vh;display:flex;flex-direction:column;
  padding-top:calc(5px + env(safe-area-inset-top));padding-bottom:env(safe-area-inset-bottom);
  background:
   repeating-linear-gradient(0deg,var(--grid-a) 0 1px,transparent 1px 110px),
   repeating-linear-gradient(90deg,var(--grid-a) 0 1px,transparent 1px 110px),
   repeating-linear-gradient(0deg,var(--grid-b) 0 1px,transparent 1px 22px),
   repeating-linear-gradient(90deg,var(--grid-b) 0 1px,transparent 1px 22px),
   var(--bg)}
/* en üstte ince airmail şeridi */
body::before{content:"";position:fixed;left:0;right:0;top:0;height:5px;z-index:99;
  background:repeating-linear-gradient(45deg,#b0413e 0 9px,#f6f3ea 9px 18px,#24506e 18px 27px,#f6f3ea 27px 36px)}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent2);outline-offset:2px;border-radius:var(--r)}
.skip{position:absolute;left:-9999px;top:10px;z-index:120;background:var(--fg);color:var(--bg);padding:6px 12px;font:600 12px var(--mono)}
.skip:focus{left:8px}
.num{font-variant-numeric:tabular-nums}
.mono{font-family:var(--mono)}

/* ---------- başlık çubuğu: aprsagent.com'a geri bağlantı + site adı */
.fam-bar{background:var(--bg);border-bottom:1px solid var(--ink-line)}
.fam-bar .fam-row{display:flex;align-items:center;gap:14px;min-height:56px;max-width:1240px;margin:0 auto;padding:0 16px}
.fam-home{display:inline-flex;align-items:center;gap:8px;color:var(--dim);font:600 12px var(--mono);
  letter-spacing:.07em;text-transform:uppercase;white-space:nowrap}
.fam-home img{width:24px;height:24px;display:block}
.fam-home:hover{color:var(--accent);text-decoration:none}
.fam-sep{width:1px;height:22px;background:var(--border2);flex:none}
.fam-site{font:700 14px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--fg);white-space:nowrap}
.fam-site span{color:var(--accent)}
.fam-site:hover{text-decoration:none;color:var(--fg)}
.fam-bar .sp{flex:1}
.lang{display:flex;border:1px solid var(--ink-line);overflow:hidden}
.lang button{border:0;background:transparent;color:var(--dim);font:12px var(--mono);padding:5px 11px;cursor:pointer;letter-spacing:.06em}
.lang button[aria-pressed="true"]{background:var(--fg);color:var(--bg)}
.hdr-btn{background:transparent;border:1px solid var(--ink-line);color:var(--dim);padding:4px 9px;cursor:pointer;font:13px var(--mono);line-height:1.2}
.hdr-btn:hover{color:var(--fg);background:var(--bg2)}
.ghl{color:var(--dim);font:12px var(--mono);letter-spacing:.06em;white-space:nowrap}
.ghl:hover{color:var(--fg);text-decoration:none}

/* ---------- sekmeler */
.tab-bar{display:flex;gap:2px;padding:0 max(10px,calc((100% - 1240px) / 2 + 10px));background:var(--bg);border-bottom:1px solid var(--border2);
  overflow-x:auto;scrollbar-width:none;position:sticky;top:5px;z-index:5}
.tab-bar::-webkit-scrollbar{display:none}
.tab-btn{padding:11px 12px;border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--dim);font:600 12px var(--mono);
  letter-spacing:.09em;text-transform:uppercase;white-space:nowrap;display:flex;align-items:center;gap:6px}
.tab-btn:hover{color:var(--fg);text-decoration:none}
.tab-btn.active{color:var(--fg);border-bottom-color:var(--accent)}
.badge{background:var(--accent);color:var(--accent-fg);font:700 10.5px var(--mono);padding:0 5px;line-height:16px;letter-spacing:0}

main{flex:1;width:100%;max-width:1240px;margin:0 auto;padding:26px 16px 36px}
main:focus{outline:none}
.loading,.empty{color:var(--dim);padding:40px 0;text-align:center}

/* ---------- sayfa başlığı ve denetimler */
.page-head{margin-bottom:16px}
.page-head h1{font-size:clamp(24px,3.2vw,32px);font-weight:700;letter-spacing:-.025em;line-height:1.15}
.page-head p{color:var(--dim);margin-top:6px;max-width:70ch;font-size:15.5px}

.controls{position:static;z-index:4;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(6px);
  padding:10px 0 12px;margin-bottom:6px;border-bottom:1px solid var(--border2);display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
.ctl-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ctl-label{color:var(--dim);font:600 11px var(--mono);letter-spacing:.1em;text-transform:uppercase}
.chips{display:flex;flex-wrap:wrap;gap:4px}
.chip{border:1px solid var(--border2);background:var(--card);color:var(--fg2);border-radius:var(--r);padding:3px 9px;font:12.5px var(--mono);cursor:pointer;white-space:nowrap}
.chip:hover{border-color:var(--ink-line)}
.chip[aria-pressed="true"]{background:var(--fg);border-color:var(--fg);color:var(--bg)}
.chip small{opacity:.7;margin-left:4px;font-size:11px}
.seg{display:inline-flex;border:1px solid var(--ink-line);overflow:hidden}
.seg button{background:transparent;border:0;padding:4px 10px;font:12.5px var(--mono);cursor:pointer;color:var(--dim)}
.seg button+button{border-left:1px solid var(--ink-line)}
.seg button[aria-pressed="true"]{background:var(--fg);color:var(--bg)}
.len{display:flex;align-items:center;gap:8px}
.len input[type=range]{width:160px;accent-color:var(--accent)}
.len input[type=number]{width:70px;padding:3px 6px;border:1px solid var(--border2);border-radius:var(--r);background:var(--card);color:var(--fg);font:14px var(--mono)}

/* ---------- bölümler ve kartlar (ortak kenarlı tablo) */
.section{margin-top:30px}
.section-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.section-head h2{font:700 13px var(--mono);letter-spacing:.15em;text-transform:uppercase}
.section-head p{color:var(--dim);font-size:13.5px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0;border-top:1px solid var(--border);border-left:1px solid var(--border)}

.card{background:var(--card);border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:16px 16px 12px;
  display:flex;flex-direction:column;gap:6px;position:relative;overflow:hidden}
.card:hover{background:color-mix(in srgb,var(--card) 70%,var(--bg2))}
/* kablo kesiti: sağ üstte, kartın sağ kenarından taşar; başlık ve alt satır ona yer bırakır */
.c-art{position:absolute;top:22px;right:0;width:min(150px,46%);pointer-events:none}
.c-art svg{display:block;width:100%;height:auto}
.card .c-title,.card .c-sub{max-width:calc(100% - min(132px,40%))}
.c-class{font-size:12px;color:var(--dim);display:flex;gap:6px;align-items:center}
.tag{font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--border2);padding:0 5px;color:var(--fg2)}
.c-title{font:700 18px var(--mono);line-height:1.15;letter-spacing:.01em;color:var(--fg)}
.c-title:hover{color:var(--accent);text-decoration:none}
.c-sub{font-size:12.5px;color:var(--dim);margin-top:-2px}
.c-value{display:flex;align-items:baseline;gap:6px;margin-top:4px}
.c-value .v{font-size:27px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.c-value .u{font:12px var(--mono);color:var(--dim)}
.c-value.na .v{font-size:15px;font-weight:400;color:var(--dim)}
sup.ind{font:600 10.5px var(--mono);color:var(--warn);margin-left:1px;cursor:help;letter-spacing:0}
sup.ind.est{color:var(--fg2);font-size:13px;font-weight:700}
.bar{height:5px;background:var(--track);overflow:hidden}
.bar>span{display:block;height:100%;background:var(--accent2)}
.c-line{font-size:13px;color:var(--fg2)}
.c-line b{font-variant-numeric:tabular-nums}
.c-meta{font-size:12.5px;color:var(--dim);display:flex;flex-wrap:wrap;gap:2px 10px}
.c-actions{display:flex;gap:6px;align-items:center;margin-top:6px;padding-top:10px;border-top:1px solid var(--border)}
.btn{border:1px solid var(--border2);background:transparent;border-radius:var(--r);padding:5px 9px;font:600 10.5px var(--mono);
  letter-spacing:.06em;text-transform:uppercase;cursor:pointer;color:var(--fg);white-space:nowrap}
.btn:hover{border-color:var(--ink-line);background:var(--bg2);text-decoration:none}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.btn.primary:hover{filter:brightness(1.07);background:var(--accent)}
.btn[aria-pressed="true"]{background:var(--fg);border-color:var(--fg);color:var(--bg)}
.c-actions .src{margin-left:auto;font-size:12.5px;white-space:nowrap}

/* ---------- dipnot ve alt bilgi */
.notes{margin-top:28px;padding-top:12px;border-top:1px solid var(--border2);color:var(--dim);font-size:13px;display:grid;gap:4px}
.notes sup{color:var(--warn);font-weight:600}
.notes sup.est{color:var(--fg2);font-weight:700}
.soon{background:var(--card);border:1px dashed var(--border2);padding:28px;text-align:center;color:var(--fg2)}
.soon p+p{margin-top:8px;color:var(--dim);font-size:13px}
sup.tm{font-size:.55em;font-weight:400;margin-left:1px;line-height:0}
.tm-list{columns:2;column-gap:24px}
@media (max-width:600px){.tm-list{columns:1}}

.fam-foot{border-top:1px solid var(--ink-line);padding:24px 0 42px;color:var(--dim);font:12px var(--mono);letter-spacing:.04em;margin-top:24px;background:var(--bg)}
.fam-foot .wrap{max-width:1240px;margin:0 auto;padding:0 16px}
.fam-foot a{color:var(--dim);text-decoration:underline;text-underline-offset:2px}
.fam-foot a:hover{color:var(--accent)}
.fam-tools{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--border)}
.fam-tools b{color:var(--fg);font-weight:700;text-transform:uppercase;letter-spacing:.12em}
.fam-tools a[aria-current="page"]{color:var(--fg);text-decoration:none;border-bottom:1px solid var(--accent)}
.fam-line{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center}
.fam-line .sp{flex:1}
.fam-legal{margin:12px 0 0;font:12.5px/1.5 var(--sans);letter-spacing:0;max-width:86ch}

/* ---------- paneller ve hesaplayıcı */
.panel{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:18px}
.calc{display:grid;grid-template-columns:minmax(280px,360px) 1fr;gap:16px;align-items:start}
.calc-form{display:flex;flex-direction:column;gap:12px;position:sticky;top:56px}
.field{display:flex;flex-direction:column;gap:5px}
.field label{font:600 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.field select,.field input[type=number]{width:100%;padding:7px 9px;border:1px solid var(--border2);border-radius:var(--r);background:var(--view);color:var(--fg);font:inherit;font-size:15px}
.field select:focus,.field input:focus{border-color:var(--accent2);outline:none}
.row{display:flex;gap:8px;align-items:center}
.row input[type=number]{flex:1;min-width:0}
.row input[type=range]{flex:1.4;accent-color:var(--accent)}
.unit{color:var(--dim);font:13px var(--mono);min-width:28px}
.calc-out{display:flex;flex-direction:column;gap:16px;min-width:0}
.hero-k{font:600 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.hero-v{font-size:36px;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.hero-v small{font-size:17px;font-weight:600;color:var(--fg2)}
.hero-s{font-size:13.5px;color:var(--fg2);margin-top:2px}
.bar.big{height:8px;margin:12px 0 4px}
.kv{display:grid;grid-template-columns:1fr auto;gap:0;margin-top:10px}
.kv dt,.kv dd{padding:7px 0;border-bottom:1px solid var(--border);font-size:14px}
.kv dt{color:var(--fg2)}
.kv dd{text-align:right;padding-left:12px}
.alerts{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.alert{font-size:13px;padding:8px 11px;border-left:3px solid;background:var(--card)}
.alert.warn{background:var(--warn-soft);border-color:var(--warn)}
.alert.info{background:var(--accent-soft);border-color:var(--accent2)}
.result-foot{margin-top:10px;font-size:12.5px;color:var(--dim)}
.alts h2{font:700 13px var(--mono);letter-spacing:.14em;text-transform:uppercase}
.muted{color:var(--dim);font-size:13px;margin-top:2px}
.alt-list{list-style:none;margin-top:8px;display:flex;flex-direction:column;gap:0}
.alt-list button{width:100%;display:grid;grid-template-columns:1fr 90px 80px;gap:8px;padding:7px 8px;border:0;border-bottom:1px solid var(--border);background:transparent;cursor:pointer;text-align:left;font-size:14px;color:var(--fg)}
.alt-list button:hover{background:var(--card-hover)}
.alt-list .num{text-align:right;color:var(--fg2)}
.alt-list li.me button{background:var(--accent-soft);font-weight:600}
.calc-note{margin-top:16px;color:var(--dim);font-size:12.5px;max-width:90ch}
@media (max-width:820px){.calc{grid-template-columns:1fr}.calc-form{position:static}}

/* ---------- grafik */
.chart{position:relative;margin-top:6px}
.chart .plot{position:relative}
.chart .plot>svg{width:100%;height:auto;display:block;touch-action:pan-y}
.chart .g-major{stroke:var(--grid);stroke-width:1}
.chart .g-minor{stroke:var(--grid2);stroke-width:1}
.chart .ax{fill:var(--dim);font:11px var(--mono);font-variant-numeric:tabular-nums}
.chart .ax-t{fill:var(--dim);font:11px var(--mono)}
.chart .s-line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.chart .s-mark{stroke:var(--card);stroke-width:2}
.chart .s-label{fill:var(--fg2);font:12px var(--mono)}
.chart .cross{stroke:var(--dim);stroke-width:1;stroke-dasharray:3 3}
/* Karşılaştır: seçili frekans işareti ve sonuç kutusu */
.chart .pin-line{stroke:var(--fg);stroke-width:1.5}
.chart .pin-dot{stroke:var(--card);stroke-width:2}
.pin-box{position:absolute;background:var(--view);border:1px solid var(--ink-line);border-left-width:3px;padding:8px 10px;font-size:12.5px;
  min-width:190px;max-width:62%;z-index:2}
.pin-box b{font-weight:600}
.pin-box>b{display:block;margin-bottom:4px;font:700 11px var(--mono);letter-spacing:.06em}
.pin-box div{display:flex;align-items:center;gap:6px;white-space:nowrap}
.pin-box i{width:10px;height:10px;display:inline-block;flex:none}
.pin-box span{margin-left:auto;padding-left:10px;font-variant-numeric:tabular-nums}
.pin-more{margin-top:6px;padding:0;border:0;background:none;color:var(--link);font:600 11px var(--mono);letter-spacing:.04em;cursor:pointer}
.pin-more:hover{text-decoration:underline}
@media (prefers-reduced-motion:no-preference){.pin-box{animation:pin-in .35s ease-out}}
@keyframes pin-in{from{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent2) 25%,transparent)}}
/* dar ekranda kutu grafiğin altına iner, eğrileri kapatmaz */
@media (max-width:640px){.pin-box{position:static;max-width:none;margin-top:8px}}
.legend{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:8px;font-size:13px;color:var(--fg2)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.tip{position:absolute;pointer-events:none;background:var(--view);border:1px solid var(--ink-line);padding:7px 9px;font-size:12.5px;min-width:170px;z-index:3}
.tip b{display:block;margin-bottom:3px;font:700 11px var(--mono)}
.tip div{display:flex;align-items:center;gap:6px}
.tip i,.dot,.sel-chip i{width:10px;height:10px;display:inline-block;flex:none}
.tip span{margin-left:auto;padding-left:10px;font-variant-numeric:tabular-nums}

/* ---------- karşılaştırma */
.picker{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.picker select{padding:6px 8px;border:1px solid var(--border2);border-radius:var(--r);background:var(--view);color:var(--fg);font:inherit;font-size:14px;max-width:100%}
.sel-list{display:flex;flex-wrap:wrap;gap:6px}
.sel-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border2);padding:3px 6px 3px 10px;font:13px var(--mono);background:var(--view);color:var(--fg)}
.sel-chip a{color:var(--fg)}
.sel-chip .x{border:0;background:transparent;cursor:pointer;color:var(--dim);font-size:16px;line-height:1;padding:0 4px}
.sel-chip .x:hover{color:var(--accent)}
.sel-chip small{color:var(--dim)}
.cmp-ctl{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.ctl-row{display:flex;flex-wrap:wrap;gap:10px 18px}
.mini{display:flex;align-items:center;gap:6px;font:600 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.mini input{width:84px;padding:4px 6px;border:1px solid var(--border2);border-radius:var(--r);background:var(--view);color:var(--fg);font:14px var(--mono);text-transform:none;letter-spacing:0}
.mini .unit{text-transform:none}
.panel+.panel{margin-top:12px}
.h2{font:700 12.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.h3{font:700 11.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;margin:16px 0 6px}

/* ---------- tablolar */
.table-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th,.tbl td{padding:7px 8px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.tbl th{font:600 10.5px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--dim);white-space:nowrap;border-bottom-color:var(--border2)}
.tbl .r{text-align:right}
.tbl td .sub{font-size:12px;color:var(--dim)}
.tbl small{color:var(--dim)}
.tbl .dot{margin-right:7px;vertical-align:-1px}
.tbl tbody tr:hover{background:var(--card-hover)}
.tbl.compact td,.tbl.compact th{padding:4px 8px;font-size:13px}
.sortable th button{background:none;border:0;cursor:pointer;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;padding:0}
.sortable th.r button{text-align:right}
.warn-t{color:var(--warn);font-weight:600}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.filters input,.filters select{padding:6px 8px;border:1px solid var(--border2);border-radius:var(--r);background:var(--view);color:var(--fg);font:inherit;font-size:14px}
.filters input[type=search]{flex:1 1 220px;min-width:180px}
.filters .muted{margin-left:auto}

/* ---------- kablo detayı */
.detail-head h1{font:700 clamp(26px,3.6vw,34px) var(--mono);letter-spacing:.01em}
.top-actions{border-top:0;padding-top:0;margin-top:12px}
.warn-tag{color:var(--warn);border-color:var(--warn)}
.detail-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:12px;align-items:start}
.detail-grid .col{display:flex;flex-direction:column;min-width:0}
.art-panel{margin:0}
.art-fig{background:var(--bg2);border:1px solid var(--border)}
.art-fig svg{display:block;width:100%;height:auto;max-height:190px}
.art-legend{margin:10px 0 6px;padding-left:22px;font-size:13.5px;display:flex;flex-direction:column;gap:3px}
.art-legend b{font:700 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;margin-right:6px}
.band-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:0;border-top:1px solid var(--border);border-left:1px solid var(--border)}
.bcell{background:var(--view);border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:6px 8px;display:flex;flex-direction:column}
.bl{font:11px var(--mono);color:var(--dim)}
.bv{font-size:16px;font-weight:600}
.kv.specs dd{text-align:right;font-size:13.5px}
.kv.specs dt{font-size:13.5px}
.note-box{margin-top:10px;font-size:13px;background:var(--bg2);border-left:3px solid var(--accent2);padding:8px 10px}
.src-list{list-style:none;display:flex;flex-direction:column;gap:8px;font-size:13.5px}
.src-list li{display:flex;gap:10px}
.src-list .sid{font:12px var(--mono);color:var(--dim);min-width:38px}
.src-list li:target{background:var(--accent-soft)}
.small{font-size:12px}
.sim{display:flex;flex-wrap:wrap;gap:6px}
.prose{max-width:860px;line-height:1.6}
.prose h2{font:700 12.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;margin:20px 0 8px}
.prose h2:first-child{margin-top:0}
.prose p+p{margin-top:8px}
.prose ul{padding-left:20px;margin:6px 0 8px}
.prose li+li{margin-top:3px}
@media (max-width:900px){.detail-grid{grid-template-columns:minmax(0,1fr)}.band-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:600px){.band-grid{grid-template-columns:repeat(3,1fr)}.filters .muted{margin-left:0}}
@media (max-width:600px){
  .fam-bar .fam-row{gap:10px;padding:0 12px}
  .fam-home .t{display:none}
  .ghl{display:none}
  main{padding:18px 12px 24px}
  .controls{top:46px;gap:8px}
  .len input[type=range]{width:120px}
  .grid{grid-template-columns:1fr}
}
@media (min-width:900px){.controls{position:sticky;top:46px}}
@media (prefers-reduced-motion:no-preference){.card,.chip,.btn,.hdr-btn{transition:border-color .15s,background-color .15s}}
