/* tvguideapi.com site pages: pricing, account, sign-in, terms, privacy, refunds, support, status and the 404 page.
   The top bar, footer and buttons come from site.css; these are the parts of the pages themselves. */
section.s.alt { background:var(--alt); }
.sh .p { color:var(--muted); margin-top:8px; max-width:640px; }
.lk { color:var(--blue); } .lk:hover { text-decoration:underline; }
.small { font-size:12px; color:var(--muted); margin-top:12px; }
.warn { background:#fff5cc; color:#7a6200; border-radius:var(--r); padding:10px 14px; margin-bottom:16px; font-size:13px; }
.okmsg { background:var(--ok-bg); color:var(--ok); border-radius:var(--r); padding:10px 14px; margin-bottom:16px; font-size:13px; }
.num { font-variant-numeric:tabular-nums; }

/* page header: faint grid, the keyword small, the line large */
.phero { position:relative; overflow:hidden; background:var(--black); color:var(--on-dark); padding:54px 0 0; text-align:center; }
.phero.short { padding:46px 24px 46px; }
.phero::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(34,211,238,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(34,211,238,.06) 1px, transparent 1px); background-size:24px 24px; pointer-events:none; animation:drift 30s linear infinite; }
.phero::after { content:''; position:absolute; width:700px; height:420px; left:50%; top:-140px; transform:translateX(-50%); background:radial-gradient(closest-side, rgba(31,91,255,.18), transparent); pointer-events:none; }
.phero > * { position:relative; z-index:1; }
@keyframes drift { from { background-position:0 0; } to { background-position:24px 24px; } }

/* the plan meter */
.meter { max-width:1000px; margin:34px auto 0; border:1px solid var(--panel-line); border-bottom:0; border-radius:var(--r) var(--r) 0 0; background:var(--panel-2); text-align:left; }
.meter-h { display:grid; grid-template-columns:180px 1fr 170px; align-items:center; height:38px; border-bottom:1px solid var(--panel-line); padding:0 14px; font-size:12px; color:var(--on-dark-muted); }
.meter-h span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.meter-h .live { justify-self:end; display:flex; align-items:center; gap:8px; } .meter-h .live i { width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 0 3px rgba(34,197,94,.18); }
.mrow { display:grid; grid-template-columns:180px 1fr 170px; align-items:center; height:46px; border-bottom:1px solid var(--panel-line); padding:0 14px; }
.mrow .pn { font-size:13px; color:#fff; white-space:nowrap; } .mrow .pn small { display:block; font-size:11px; color:var(--on-dark-muted); }
.track { position:relative; height:10px; border-radius:5px; background:#141a26; margin:0 16px; overflow:hidden; }
.fill { position:absolute; left:0; top:0; bottom:0; width:0; border-radius:5px; background:linear-gradient(90deg, #1f5bff, #22d3ee); }
.mrow.free .fill { background:linear-gradient(90deg, #15803d, #22c55e); } .mrow.cap .fill { background:linear-gradient(90deg, #7a6200, #ffd400); }
.mrow .n { justify-self:end; font-size:12px; color:#c9d3e0; font-variant-numeric:tabular-nums; white-space:nowrap; }

/* plans */
.pbar { display:flex; justify-content:flex-end; gap:16px; margin-bottom:18px; }
.seg { display:grid; grid-auto-flow:column; grid-auto-columns:190px; }
.seg span { height:36px; display:grid; place-items:center; font-size:13px; color:var(--muted); border:1px solid var(--line); cursor:pointer; white-space:nowrap; background:#fff; }
.seg span:first-child { border-radius:var(--r) 0 0 var(--r); } .seg span:last-child { border-radius:0 var(--r) var(--r) 0; } .seg span + span { border-left:0; }
.seg span.on { background:var(--black); color:#fff; border-color:var(--black); }
.plans { display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; } .plans.three { grid-template-columns:repeat(3, 1fr); }
.plan { border:1px solid var(--line); border-radius:var(--r); background:#fff; padding:20px; display:grid; grid-template-rows:auto auto auto 1fr auto; gap:10px; }
.plan.pick { border-color:var(--blue); box-shadow:0 0 0 3px rgba(31,91,255,.10); }
.plan .pn { display:flex; justify-content:space-between; align-items:center; font-size:15px; }
.plan .pp { font-size:34px; font-weight:300; font-variant-numeric:tabular-nums; } .plan .pp small { font-size:12px; color:var(--muted); margin-left:4px; }
.plan .pd { color:var(--muted); font-size:13px; min-height:40px; }
.plan ul { list-style:none; display:grid; gap:7px; align-content:start; font-size:13px; color:var(--text); }
.plan li, .checks li { display:grid; grid-template-columns:16px 1fr; gap:8px; align-items:start; }
.plan li::before, .checks li::before { content:''; width:12px; height:7px; border-left:1.5px solid var(--ok); border-bottom:1.5px solid var(--ok); transform:rotate(-45deg); margin-top:4px; }
.plan li.no { color:var(--faint); } .plan li.no::before { border:0; height:1.5px; width:10px; background:var(--faint); transform:none; margin-top:9px; }
.plan .lim { display:grid; grid-template-columns:1fr 1fr; gap:6px; border-top:1px solid var(--line-2); padding-top:10px; font-size:12px; color:var(--muted); }
.plan .lim span b { display:block; font-weight:400; color:var(--ink); font-size:14px; font-variant-numeric:tabular-nums; }
.pbtn { width:100%; min-width:0; margin-top:12px; font:inherit; }
.notes { display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-top:16px; }
.notes span { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted); white-space:nowrap; }
.notes span::before { content:''; width:7px; height:7px; border-radius:50%; background:var(--green); flex:none; }
.charge { margin-top:18px; border:1px solid var(--line); border-radius:var(--r); background:#fff; padding:14px 20px; display:flex; justify-content:space-between; gap:16px; font-size:13px; color:var(--muted); }
.charge a { color:var(--blue); }

/* comparison table */
.cmp { border:1px solid var(--line); border-radius:var(--r); background:#fff; overflow-x:auto; }
.cmp table { width:100%; border-collapse:collapse; font-size:13px; }
.cmp th, .cmp td { height:42px; padding:0 14px; border-bottom:1px solid var(--line-2); text-align:left; white-space:nowrap; }
.cmp thead th { font-weight:400; color:var(--muted); font-size:12px; }
.cmp th.c, .cmp td.c { text-align:center; width:150px; }
.cmp tr.grp td { background:var(--alt); color:var(--blue); font-size:12px; letter-spacing:.06em; text-transform:uppercase; height:34px; }
.cmp tbody tr:not(.grp):hover td { background:#fafbfd; }
.yes { display:inline-block; width:12px; height:7px; border-left:1.5px solid var(--ok); border-bottom:1.5px solid var(--ok); transform:rotate(-45deg); }
.nul { color:var(--faint); font-size:12px; }

/* questions and the closing band */
.faq { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.q { border:1px solid var(--line); border-radius:var(--r); background:#fff; padding:18px 20px; }
.q .qt { font-size:15px; } .q p { color:var(--muted); margin-top:6px; font-size:13px; }
.close2 { background:var(--black); color:var(--on-dark); padding:56px 0; }
.close2 .in { display:grid; grid-template-columns:1fr auto; align-items:center; gap:24px; }
.close2 .t { font-size:30px; font-weight:300; color:#fff; } .close2 .row2 { display:grid; grid-template-columns:repeat(2, 170px); gap:10px; }

/* sign in */
.narrow { max-width:520px; }
.card { border:1px solid var(--line); border-radius:var(--r); background:#fff; padding:28px; }
.gbtn { width:100%; min-width:0; display:flex; gap:10px; justify-content:center; height:46px; }
/* Google's own button (onetap.js): its box shows, and the plain link hides, only once it has rendered */
.gbox { display:none; justify-content:center; min-height:44px; }
html.g-ready .gbox { display:flex; }
html.g-ready .gbtn { display:none; }
.checks { list-style:none; display:grid; gap:8px; margin-top:20px; font-size:13px; color:var(--text); }

/* account: the left menu stands out, the page beside it */
.acc { background:var(--alt); padding:32px 0 64px; min-height:70vh; }
.acc .in { display:grid; grid-template-columns:240px 1fr; gap:20px; align-items:start; }
.anav { background:var(--black); border-radius:var(--r); padding:14px; display:grid; gap:4px; position:sticky; top:80px; }
.anav .who { display:flex; gap:10px; align-items:center; padding:6px 6px 14px; border-bottom:1px solid #1a2130; margin-bottom:8px; }
.anav .who img, .anav .av { width:36px; height:36px; border-radius:50%; flex:none; } .anav .av { background:#1a2a4d; color:#fff; display:grid; place-items:center; }
.anav .tx { display:grid; min-width:0; } .anav .nm { color:#fff; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .anav .em { color:#8f9aab; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.anav a { height:38px; display:flex; align-items:center; gap:10px; padding:0 10px; border-radius:var(--r); color:#c3ccd8; font-size:13px; white-space:nowrap; }
.anav a svg { width:16px; height:16px; } .anav a:hover { background:#161c28; color:#fff; } .anav a.on { background:#1a2a4d; color:#fff; }
.anav form { margin-top:10px; } .anav form .btn { width:100%; min-width:0; font:inherit; }
.amain { display:grid; gap:14px; min-width:0; }
.ahead { display:flex; justify-content:space-between; align-items:flex-end; }
.at { font-size:26px; font-weight:300; margin-top:4px; }
.tiles { display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; } .tiles.three { grid-template-columns:repeat(3, 1fr); }
.tile { background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:16px; display:grid; gap:4px; }
.tile .k { font-size:12px; color:var(--muted); } .tile .v { font-size:24px; font-weight:300; font-variant-numeric:tabular-nums; white-space:nowrap; } .tile .s { font-size:12px; color:var(--faint); }
.okt { display:inline-block; width:16px; height:9px; border-left:2px solid var(--ok); border-bottom:2px solid var(--ok); transform:rotate(-45deg); margin:6px 0 0 4px; }
.bar1 { height:6px; border-radius:3px; background:var(--line-2); overflow:hidden; } .bar1 i { display:block; height:100%; background:var(--blue); }
.panel { background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:18px; overflow-x:auto; }
.panel.danger { border-color:#f3d6d6; }
.ph2 { display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap; } .pt2 { font-size:15px; } .ps2 { font-size:12px; color:var(--muted); } .mk .btn { font:inherit; }
.mk { margin-left:auto; display:grid; grid-template-columns:220px 170px; gap:8px; }
.mk input { height:40px; border:1px solid var(--line); border-radius:var(--r); padding:0 12px; font:inherit; }
.spark { height:90px; display:grid; grid-template-columns:repeat(30, 1fr); gap:3px; align-items:end; }
.spark i { display:block; background:linear-gradient(180deg, #22d3ee, #1f5bff); border-radius:3px 3px 0 0; min-height:2px; }
.ktab { width:100%; border-collapse:collapse; font-size:13px; }
.ktab th, .ktab td { height:44px; padding:0 10px; border-bottom:1px solid var(--line-2); text-align:left; white-space:nowrap; }
.ktab th { font-weight:400; font-size:12px; color:var(--muted); } .ktab .r { text-align:right; } .ktab tr:hover td { background:#fafbfd; }
.ktab code, .code1, .keyline code { font-family:'IBM Plex Mono', monospace; font-size:12px; }
.kchip { font-size:11px; padding:2px 8px; border-radius:var(--r); background:var(--alt); color:var(--muted); white-space:nowrap; }
.kchip.active { background:var(--ok-bg); color:var(--ok); } .kchip.rotating { background:#fff5cc; color:#7a6200; } .kchip.revoked { background:#f6e9e9; color:#8a3b3b; }
.kbtn { min-width:110px; height:32px; font:inherit; font-size:12px; } .btn.off { opacity:.45; pointer-events:none; }
.code1 { background:#0c1018; color:#c9d3e0; border-radius:var(--r); padding:14px; overflow-x:auto; }
.fresh { background:#0c1018; color:var(--on-dark); border-radius:var(--r); padding:18px; }
.fresh .ft { font-size:15px; color:var(--yel); } .fresh p { font-size:13px; color:#aeb8c6; margin:4px 0 12px; }
.keyline { display:grid; grid-template-columns:1fr 170px; gap:10px; align-items:center; }
.keyline code { background:#03060a; border:1px solid var(--panel-line); border-radius:var(--r); padding:11px 12px; color:var(--cyan); overflow-x:auto; white-space:nowrap; }
.bacts { display:grid; grid-template-columns:repeat(2, 200px); gap:10px; } .bacts form .btn, .bacts .btn { width:100%; min-width:0; font:inherit; }

/* confirm modal */
.modal { position:fixed; inset:0; background:rgba(5,7,12,.55); z-index:60; display:none; place-items:center; padding:16px; }
.modal.open { display:grid; }
.mbox { background:#fff; border-radius:var(--r); width:min(480px, 100%); padding:22px; display:grid; gap:12px; }
.mt { font-size:18px; font-weight:300; } .mfx { list-style:none; display:grid; gap:7px; font-size:13px; color:var(--text); }
.mfx li { padding-left:16px; position:relative; } .mfx li::before { content:''; position:absolute; left:0; top:8px; width:6px; height:6px; border-radius:50%; background:var(--blue); }
.tick { display:flex; gap:8px; align-items:flex-start; font-size:13px; color:var(--text); } .tick a { color:var(--blue); }
.mact { display:grid; grid-template-columns:1fr 1fr; gap:10px; } .mact .btn { min-width:0; font:inherit; } .mact .btn[disabled] { opacity:.45; cursor:not-allowed; }

/* terms, privacy, refunds */
.legal { display:grid; grid-template-columns:200px 1fr; gap:28px; align-items:start; }
.ltabs { display:grid; gap:4px; position:sticky; top:80px; }
.ltabs a { height:38px; display:flex; align-items:center; padding:0 12px; border-radius:var(--r); color:var(--text); border:1px solid var(--line); background:#fff; }
.ltabs a.on { background:var(--black); color:#fff; border-color:var(--black); }
.ltext { max-width:760px; color:var(--text); font-size:14px; line-height:1.65; }
.ltext h2 { font-size:18px; font-weight:400; color:var(--ink); margin:26px 0 8px; } .ltext p { margin-bottom:10px; }
.ltext ul { margin:0 0 10px 18px; } .ltext li { margin-bottom:4px; } .ltext code { font-family:'IBM Plex Mono', monospace; font-size:12px; background:var(--alt); padding:1px 5px; border-radius:4px; }
.steps3 { list-style:none; display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin:8px 0 14px; }
.steps3 li { border:1px solid var(--line); border-radius:var(--r); padding:14px; display:grid; gap:6px; font-size:13px; }
.steps3 .n { width:24px; height:24px; border-radius:50%; background:var(--black); color:var(--yel); display:grid; place-items:center; font-size:12px; }
.kitbox, .kitwrap { margin-top:8px; }

/* the 404 page */
.nf { position:relative; overflow:hidden; background:var(--black); color:var(--on-dark); padding:70px 0 0; text-align:center; }
.nf::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(34,211,238,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(34,211,238,.06) 1px, transparent 1px); background-size:24px 24px; }
.nf > * { position:relative; }
.static { width:min(640px, 92%); margin:30px auto 0; height:210px; border:1px solid var(--panel-line); border-bottom:0; border-radius:var(--r) var(--r) 0 0; position:relative; overflow:hidden; background:#0c1018; }
.static canvas { position:absolute; inset:0; width:100%; height:100%; opacity:.5; }
.static .card { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); background:rgba(5,7,12,.86); border:1px solid var(--panel-line); border-radius:var(--r); padding:14px 22px; font-family:'IBM Plex Mono', monospace; font-size:13px; color:#c9d3e0; white-space:nowrap; }
.static .card .c { color:var(--yel); }
.bars { position:absolute; left:0; right:0; bottom:0; height:12px; display:grid; grid-template-columns:repeat(7, 1fr); }
.bars i:nth-child(1) { background:#e6ebf2; } .bars i:nth-child(2) { background:#ffd400; } .bars i:nth-child(3) { background:#22d3ee; } .bars i:nth-child(4) { background:#22c55e; } .bars i:nth-child(5) { background:#c026d3; } .bars i:nth-child(6) { background:#ff4d4d; } .bars i:nth-child(7) { background:#1f5bff; }
.nf-links { background:#fff; padding:44px 0 64px; }
.nf-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; }
.nf-grid a { border:1px solid var(--line); border-radius:var(--r); padding:16px 18px; display:grid; gap:4px; } .nf-grid a:hover { border-color:var(--blue); }
.nf-grid .lt { font-size:14px; } .nf-grid .ls { font-size:12px; color:var(--muted); }
.nf-search { display:grid; grid-template-columns:1fr 170px; gap:10px; max-width:640px; margin:0 auto 28px; }
.nf-search input { height:40px; border:1px solid var(--line); border-radius:var(--r); padding:0 14px; font:inherit; color:var(--ink); }
.nf-search .btn { font:inherit; }

/* the phone menu */
.mnav { display:none; }
@media (max-width:1080px) {
  .plans { grid-template-columns:1fr 1fr; } .faq { grid-template-columns:1fr; } .notes { grid-template-columns:1fr; } .nf-grid { grid-template-columns:1fr 1fr; }
  .acc .in { grid-template-columns:1fr; } .anav { position:static; grid-template-columns:repeat(2, 1fr); } .anav .who, .anav form { grid-column:1 / -1; }
  .tiles { grid-template-columns:1fr 1fr; } .legal { grid-template-columns:1fr; } .ltabs { position:static; grid-template-columns:repeat(3, 1fr); }
  .mnav.open { display:grid; position:fixed; top:62px; left:0; right:0; z-index:40; background:var(--black); padding:12px 16px 18px; gap:4px; border-bottom:1px solid #1a2130; }
  .mnav a { height:42px; display:flex; align-items:center; padding:0 12px; border-radius:var(--r); color:#c3ccd8; } .mnav a:hover { background:#161c28; color:#fff; }
}
@media (max-width:620px) {
  .plans, .plans.three, .tiles, .tiles.three { grid-template-columns:1fr; } .pbar { justify-content:stretch; } .seg { grid-auto-columns:1fr; width:100%; }
  .meter { margin-left:16px; margin-right:16px; } .meter-h, .mrow { grid-template-columns:96px 1fr 104px; }
  .close2 .in { grid-template-columns:1fr; } .close2 .row2 { grid-template-columns:1fr 1fr; } .close2 .row2 .btn { min-width:0; }
  .nf-grid, .steps3 { grid-template-columns:1fr; } .nf-search, .keyline, .mk { grid-template-columns:1fr; } .mk { margin-left:0; width:100%; }
  .bacts { grid-template-columns:1fr; } .charge { flex-direction:column; } .ahead { align-items:flex-start; flex-direction:column; gap:8px; }
}
button.btn { font:inherit; } .panel.danger .btn { margin-top:12px; }

/* public pages: header figures and the moving line */
.pfacts { display:grid; grid-auto-flow:column; grid-auto-columns:max-content; justify-content:center; gap:34px; margin-top:26px; }
.pfacts div { display:grid; } .pfacts b { font-weight:300; font-size:24px; color:#fff; font-variant-numeric:tabular-nums; white-space:nowrap; } .pfacts span { font-size:12px; color:var(--on-dark-muted); white-space:nowrap; }
.pline { position:relative; height:3px; margin:34px auto 0; max-width:1000px; background:#141a26; border-radius:2px; overflow:hidden; }
.pline i { position:absolute; top:0; bottom:0; width:22%; background:linear-gradient(90deg, transparent, var(--yel), var(--cyan), transparent); animation:sweep 4.5s ease-in-out infinite; }
@keyframes sweep { from { left:-22%; } to { left:100%; } }
.phero:not(.short) { padding-bottom:0; }
/* country and data cards */
.cgrid { display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; }
.ccard { border:1px solid var(--line); border-radius:var(--r); background:#fff; padding:14px 16px; display:flex; gap:12px; align-items:center; min-width:0; }
.ccard:hover, .dcard:hover { border-color:var(--blue); }
.ccard .fl { flex:none; display:flex; } .ccard .tx { display:grid; gap:2px; min-width:0; }
.t3 { font-size:14px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* the card's channel count: was .s3, which is also the homepage's dark section class in site.css and turned each count
   into a dark dotted block (9 Oct 2026) */
.cnum { font-size:12px; color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; }
.ccode { display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:24px; padding:0 6px; border-radius:6px; background:#eef2f8; color:#33415c; font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.04em; }
.ccard:hover .ccode { background:var(--blue); color:#fff; }
.dgrid { display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
.dcard { border:1px solid var(--line); border-radius:var(--r); background:#fff; padding:20px; display:grid; gap:6px; align-content:start; }
.dcard p { font-size:13px; color:var(--muted); }
.chips2 { display:flex; flex-wrap:wrap; gap:8px; }
.chips2 a { border:1px solid var(--line); border-radius:var(--r); padding:6px 12px; font-size:13px; background:#fff; white-space:nowrap; } .chips2 a:hover { border-color:var(--blue); color:var(--blue); }
/* now and next, schedules */
.nowt td { white-space:normal; } .nowt td:first-child { white-space:nowrap; }
.pbar2 { display:inline-block; width:90px; height:6px; border-radius:3px; background:var(--line-2); overflow:hidden; vertical-align:middle; } .pbar2 i { display:block; height:100%; background:var(--blue); }
.cmp td.r, .cmp th.r { text-align:right; }
tr.onrow td { background:#f2f7ff; }
.dsearch { display:grid; grid-template-columns:1fr 240px 170px; gap:10px; }
.dsearch input, .dsearch select { height:40px; border:1px solid var(--line); border-radius:var(--r); padding:0 12px; font:inherit; color:var(--ink); background:#fff; min-width:0; }
.dsearch:has(> select:first-child) { grid-template-columns:280px 170px; }
.tabs2 { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.tabs2 a { height:36px; min-width:130px; display:inline-grid; place-items:center; padding:0 14px; border:1px solid var(--line); border-radius:var(--r); font-size:13px; background:#fff; white-space:nowrap; }
.tabs2 a.on { background:var(--black); color:#fff; border-color:var(--black); }
.ep.lk { font-family:'IBM Plex Mono', monospace; font-size:12px; }
@media (max-width:1080px) { .cgrid { grid-template-columns:repeat(2, 1fr); } .dgrid { grid-template-columns:1fr 1fr; } }
@media (max-width:620px) { .cgrid, .dgrid { grid-template-columns:1fr; } .dsearch, .dsearch:has(> select:first-child) { grid-template-columns:1fr; } .pfacts { grid-auto-flow:row; grid-template-columns:1fr 1fr; gap:14px; } .tabs2 a { min-width:0; flex:1 1 40%; } }

/* every code block on the site pages wraps instead of scrolling sideways, with the thin dark scrollbar (9 Oct 2026) */
pre { white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; overflow-x:hidden; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#2a3446 transparent; }
pre::-webkit-scrollbar { width:8px; height:8px; } pre::-webkit-scrollbar-track { background:transparent; } pre::-webkit-scrollbar-thumb { background:#2a3446; border-radius:8px; border:2px solid transparent; background-clip:padding-box; } pre::-webkit-scrollbar-thumb:hover { background-color:#3a4760; }

/* account: the plan panel above Last 30 days (12 Oct 2026); what the key reads, its refused calls, the plans that stop them */
.asub { font-size:13px; color:var(--muted); margin-top:2px; } .asub em { font-style:normal; color:var(--ok); }
.au { background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.au-top { position:relative; background:var(--black); color:#e6ebf2; padding:18px; display:grid; grid-template-columns:1fr auto; gap:16px; align-items:center; overflow:hidden; }
.au-top::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(34,211,238,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(34,211,238,.07) 1px, transparent 1px); background-size:24px 24px; pointer-events:none; }
.au-top > * { position:relative; }
.au-k { font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:#8f9aab; display:flex; gap:8px; align-items:center; }
.au-t { font-size:20px; font-weight:300; color:#fff; margin-top:4px; } .au-t span { color:var(--yel); }
.au-d { font-size:13px; color:#aeb8c6; margin-top:4px; }
.au-days { display:grid; grid-template-columns:repeat(5, 74px); gap:6px; }
.au-day { position:relative; height:58px; border-radius:var(--r); display:grid; place-items:center; align-content:center; gap:2px; font-size:11px; border:1px solid #1e2532; color:#5d6b7e; background:#0c1018; white-space:nowrap; }
.au-day b { font-weight:400; font-size:15px; }
.au-day.on { background:rgba(34,197,94,.12); border-color:rgba(34,197,94,.45); color:#86efac; }
.au-day.lock::after { content:''; position:absolute; top:6px; right:6px; width:8px; height:8px; border:1.5px solid #5d6b7e; border-radius:2px; }
.au-body { padding:18px; display:grid; grid-template-columns:300px 1fr; gap:18px; }
.au-msgs { display:grid; gap:8px; align-content:start; }
.au-mh { font-size:13px; color:var(--muted); }
.au-m { display:grid; grid-template-columns:1fr 64px; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--line); border-radius:var(--r); }
.au-m .l { font-size:13px; } .au-m .h { font-size:11px; color:var(--faint); display:block; }
.au-m .n { text-align:right; font-size:20px; font-weight:300; font-variant-numeric:tabular-nums; color:#b45309; }
.au-m .n.z { color:var(--ok); display:flex; justify-content:flex-end; }
.au-m code { font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--muted); }
.au-plans { display:grid; grid-template-columns:1fr 1fr; gap:14px; } .au-body.one .au-plans { grid-template-columns:1fr; }
.au-p { border:1px solid var(--line); border-radius:var(--r); padding:16px; display:flex; flex-direction:column; gap:8px; }
.au-p.pick { border-color:var(--blue); box-shadow:0 0 0 3px rgba(31,91,255,.08); }
.au-ph { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.au-pn { font-size:16px; white-space:nowrap; } .au-pr { font-size:13px; color:var(--muted); white-space:nowrap; } .au-pr span { font-size:22px; font-weight:300; color:var(--ink); }
.au-p ul { list-style:none; display:grid; gap:5px; font-size:13px; color:var(--text); }
.au-p li { display:flex; gap:8px; align-items:flex-start; } .au-p li::before { content:''; flex:none; width:12px; height:7px; margin-top:6px; border-left:1.5px solid var(--ok); border-bottom:1.5px solid var(--ok); transform:rotate(-45deg); }
.au-stop { font-size:12px; color:var(--ok); background:var(--ok-bg); border-radius:var(--r); padding:6px 10px; }
.au-p .btn { width:100%; min-width:0; margin-top:auto; font:inherit; }
.au-foot { padding:0 18px 16px; font-size:12px; color:var(--faint); display:flex; justify-content:space-between; gap:12px; } .au-foot a { color:var(--blue); }
.pick-chip { font-size:10px; padding:2px 8px; border-radius:var(--r); background:#eef3ff; color:var(--blue); vertical-align:middle; }
@media (max-width:960px) { .au-body { grid-template-columns:1fr; } .au-top { grid-template-columns:1fr; } }
@media (max-width:620px) { .au-plans { grid-template-columns:1fr; } .au-days { grid-template-columns:repeat(5, 1fr); } .au-foot { flex-direction:column; } }