/* 716 Garage Door brand: blue #1077BF, red #E31E24, white — same colors as the mascot's shirt logo. */
html:root { --brand-blue: #1077BF; --brand-red: #E31E24;
  --accent: #1077BF; --accent-ink: #ffffff; --steel: #1077BF; --bg: #eef3f9; --line: #d3dde9; --chip: #e2ebf5; }
@media (prefers-color-scheme: dark) { html:root:not([data-theme="light"]) {
  --bg: #0b1626; --panel: #12223a; --line: #213a5c; --chip: #1a2f4d; --ink: #eef3fa; --muted: #9db0c8;
  --accent: #3a9be3; --steel: #6fb3ea; } }
html:root[data-theme="dark"] { --bg: #0b1626; --panel: #12223a; --line: #213a5c; --chip: #1a2f4d; --ink: #eef3fa; --muted: #9db0c8; --accent: #3a9be3; --steel: #6fb3ea; }
.brand-logo { height: 60px; width: auto; display: block; filter: drop-shadow(0 2px 3px rgba(0,0,0,.25)); }
header.top { border-bottom: 4px solid var(--brand-red); }
#kpiAuth .box { border-top: 6px solid var(--brand-blue); }
#kpiAuth button { background: var(--brand-red) !important; }
#kpiAuth .brand-logo { height: 120px; margin: 0 auto 6px; }
@media (min-height: 760px) { #kpiAuth .brand-logo { height: 170px; } }
/* phone app */
.am-top { border-bottom: 3px solid var(--brand-red); padding-bottom: 8px; }
.am-top .who b { color: var(--accent); }
.am-btn { background: var(--brand-red); }
.am-card.go { border-color: var(--brand-red); }
.am-li.me { border-color: var(--brand-blue); background: color-mix(in srgb, var(--brand-blue) 10%, var(--panel)); }
.am-nav { border-top: 3px solid var(--brand-blue); }
.am-nav button[aria-current="page"] { color: var(--accent); }
.am-ring circle:nth-of-type(2) { stroke: var(--brand-blue); }
.pcard.top { border-color: var(--brand-red); box-shadow: 0 8px 30px rgba(227,30,36,.25); }
#nl-badge-frame { display: none !important; }
