/* BatCat system explainer: static native tiles using the master design tokens. */
.bc-system {margin:var(--bc-space-6) 0 48px;padding:var(--bc-space-5);border:1px solid var(--bc-line);border-top:2px solid var(--bc-emerald);border-radius:var(--bc-radius);background:var(--bc-panel);min-width:0;}
.bc-system h3 {font-size:clamp(23px,2.5vw,30px);margin-bottom:var(--bc-space-3);}
.bc-system-intro {max-width:780px;margin-bottom:var(--bc-space-4);color:var(--bc-muted);font-size:15px;}
.bc-system-jump {display:flex;flex-wrap:wrap;gap:var(--bc-space-2) var(--bc-space-3);margin-bottom:var(--bc-space-5);}
.bc-system-jump a {display:inline-flex;align-items:center;min-height:44px;max-width:100%;padding:var(--bc-space-2) var(--bc-space-3);border:1px solid var(--bc-line);border-radius:7px;color:var(--bc-link);font-size:13px;font-weight:650;text-decoration:none;overflow-wrap:anywhere;}
.bc-system-jump a:hover {background:var(--bc-blue-tint);}
.bc-system-tools {display:flex;flex-wrap:wrap;align-items:end;gap:var(--bc-space-4);margin-bottom:var(--bc-space-4);}
.bc-system-field {display:grid;gap:var(--bc-space-2);flex:1 1 220px;min-width:0;max-width:390px;}
.bc-system-field label {font-size:14px;font-weight:650;}
.bc-system-field select {width:100%;min-width:0;min-height:44px;padding:var(--bc-space-2) var(--bc-space-3);border:1px solid var(--bc-line);border-radius:7px;background:var(--bc-black);color:var(--bc-ink);}
.bc-system-reset {min-height:44px;max-width:100%;padding:var(--bc-space-2) var(--bc-space-4);border:1px solid var(--bc-line);border-radius:7px;background:var(--bc-raised);color:var(--bc-ink);font-weight:650;white-space:normal;}
.bc-system-count {font-size:13px;color:var(--bc-green-ink);margin-bottom:var(--bc-space-4);}
.bc-system-figure {margin:0;min-width:0;}
.bc-system-figure>figcaption {font-size:13px;color:var(--bc-muted);margin-bottom:var(--bc-space-4);}
.bc-system-panels {list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--bc-space-4);}
.bc-system-panel {min-width:0;padding:var(--bc-space-4);border:1px solid var(--bc-line);border-radius:9px;background:var(--bc-black);overflow-wrap:anywhere;}
.bc-system-panel h4 {font-size:19px;line-height:1.35;letter-spacing:-.25px;margin:0 0 var(--bc-space-3);}
.bc-system-panel h4 a {color:var(--bc-ink);text-decoration:none;}
.bc-system-panel h4 a:hover {text-decoration:underline;}
.bc-system-step-label {display:block;font-size:12px;font-weight:750;color:var(--bc-link);margin-bottom:var(--bc-space-3);}
.bc-system-stage {display:inline-block;max-width:100%;margin-bottom:var(--bc-space-4);padding:var(--bc-space-1) var(--bc-space-2);border:1px solid var(--bc-line);border-radius:5px;font-size:11px;font-weight:650;color:var(--bc-green-ink);}
.bc-system-panel>p {font-size:14px;color:var(--bc-muted);margin:var(--bc-space-4) 0;}
.bc-system-tile {min-width:0;padding:var(--bc-space-3);border:1px solid var(--bc-line);border-radius:7px;background:var(--bc-raised);}
.bc-system-tile b,.bc-system-tile span {display:block;}
.bc-system-tile b {font-size:13px;line-height:1.45;color:var(--bc-ink);}
.bc-system-tile span {font-size:12px;line-height:1.5;margin-top:var(--bc-space-2);color:var(--bc-muted);}
.bc-system-identity-tile {border-top:2px solid var(--bc-blue);}
.bc-system-device-pair {display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);align-items:stretch;gap:var(--bc-space-2);}
.bc-system-device-pair .bc-system-tile {padding:var(--bc-space-2);}
.bc-system-device-pair .bc-system-tile:first-child {border-top:2px solid var(--bc-blue);}
.bc-system-device-pair .bc-system-tile:last-child {border-top:2px solid var(--bc-emerald);}
.bc-system-swap {align-self:center;justify-self:center;color:var(--bc-link);font-size:20px;}
.bc-system-care-tiles {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--bc-space-2);}
.bc-system-care-tiles .bc-system-tile:first-child {border-top:2px solid var(--bc-emerald);}
.bc-system-care-tiles .bc-system-tile:last-child {border-top:2px solid var(--bc-blue);}
.bc-system-link {display:inline-flex;align-items:center;gap:var(--bc-space-2);min-height:44px;max-width:100%;font-size:13px;font-weight:650;}
.bc-system-link span {flex:none;}
.bc-system-note {max-width:840px;margin:var(--bc-space-5) 0 0;font-size:13px;color:var(--bc-muted);}
.bc-system-tools[hidden],.bc-system-panel[hidden] {display:none !important;}
@media(max-width:1000px) {
  .bc-system-panels {grid-template-columns:minmax(0,1fr);}
  .bc-system-device-pair,.bc-system-care-tiles {max-width:430px;}
}
@media(max-width:760px) {
  .bc-system {padding:var(--bc-space-4);margin-bottom:var(--bc-space-6);}
  .bc-system-panel {padding:var(--bc-space-3);}
  .bc-system-jump {display:grid;grid-template-columns:minmax(0,1fr);}
  .bc-system-field {flex-basis:100%;max-width:none;}
  .bc-system-reset {width:100%;}
}
@media(max-width:390px) {
  .bc-system-device-pair {grid-template-columns:minmax(0,1fr);}
  .bc-system-swap {line-height:1;}
}
/* No animated illustration; fragment scrolling always uses auto behaviour. */