/* azb pages: page chrome (header, buttons, forms, chips). Cards come from /dp/az/cards.css (shared component).
   Rule (Todd 10-11): balanced equal cards, equal sizes per row, no orphan rows, centred, 4/3/2/1 columns. */
:root { --bg:#050b19; --card:#0b1630; --card2:#0e1c3d; --line:#1d2b4f; --fg:#e8eefc; --mut:#9fb0d6; --cy:#22d3ee; --vi:#8b5cf6; --ok:#34d399; --warn:#fbbf24; }
* { box-sizing:border-box }
body { margin:0; font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif; color:var(--fg); background:var(--bg) }
a { color:var(--cy) }
.azb-top { display:flex; align-items:center; gap:14px; flex-wrap:wrap; max-width:1240px; margin:0 auto; padding:16px 18px }
.azb-top .brand { font-weight:800; font-size:22px; color:var(--fg); text-decoration:none } .azb-top .brand b { color:var(--cy) }
.azb-top nav { display:flex; gap:6px; flex-wrap:wrap; margin-left:auto } .azb-top nav a { color:var(--mut); text-decoration:none; padding:10px 10px; min-height:44px; display:inline-flex; align-items:center; border-radius:10px }
.azb-top nav a[aria-current] { color:var(--fg); background:var(--card) }
.azb-wrap { max-width:1240px; margin:0 auto; padding:0 18px 64px }
.azb-slogan { color:var(--mut); font-size:13px; margin:-8px 0 0 }
h1 { font-size:28px; margin:18px 0 6px } h2 { font-size:20px; margin:28px 0 12px; text-align:center } .mut { color:var(--mut) } .center { text-align:center }
/* cards: the shared az.ai component /dp/az/cards.css (.az-cards/.az-card, pkg17c). Only page chrome lives here. */
.az-card .grow { flex:1 } .az-card ul { margin:0; padding-left:18px; font-size:14px; color:#b9c7dc }
.chip { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; padding:3px 9px; border-radius:999px; border:1px solid var(--line); color:var(--mut); width:max-content }
.chip.live { color:#041022; background:var(--ok); border-color:var(--ok) } .chip.not { color:var(--warn); border-color:#5a4a12 } .chip.off { color:#fca5a5; border-color:#6b1d1d }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 16px; border-radius:12px; border:1px solid var(--line); background:var(--card2); color:var(--fg); font-weight:700; font-size:15px; cursor:pointer; text-decoration:none }
.btn.go { background:linear-gradient(90deg,var(--cy),var(--vi)); color:#041022; border:0 } .btn[disabled] { opacity:.5; cursor:not-allowed }
input, select, textarea { font:inherit; color:var(--fg); background:#07112a; border:1px solid var(--line); border-radius:12px; padding:10px 12px; min-height:44px; width:100% }
label { display:block; font-size:13px; color:var(--mut); margin:10px 0 4px }
.row { display:flex; gap:10px; flex-wrap:wrap; align-items:center } .row > * { flex:0 0 auto }
.price { font-weight:800 } .price small { color:var(--mut); font-weight:400 }
.panel { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:18px; max-width:1200px; margin:16px auto }
table { width:100%; border-collapse:collapse; font-size:14px } th, td { text-align:left; padding:8px; border-bottom:1px solid var(--line) }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0) }
:focus-visible { outline:2px solid var(--cy); outline-offset:2px }
.az-card, .panel, li, p, dd { overflow-wrap:anywhere; min-width:0 } .row > label { max-width:100% }
@media (max-width:600px) { .azb-top nav { margin-left:0 } table { font-size:13px } }
.row > span, .row > .mut { flex:1 1 220px; min-width:0 }
/* azai-ck1 */
.azm.ck-tap { position: relative; cursor: pointer; transition: border-color .15s }
.azm.ck-tap:hover { border-color: rgba(35, 216, 255, .6) }
.azm .ck-stretch { position: absolute; inset: 0; z-index: 1; border-radius: inherit }
.azm .ck-stretch:focus-visible { outline: 2px solid #23d8ff; outline-offset: 2px }