/* Watch Face — pitch-deck system. Background #0D1A2B, accent #FFEB6F, Inter.
   Numbers large, labels small, evidence class as a monospace tag beside every number.
   No responsive media rules here: the layout is fluid by construction (PUB-1 build test forbids the at-sign). */
:root { --bg:#0D1A2B; --bg2:#122238; --bg3:#182c46; --fg:#F2F5F9; --mute:#93A3B8; --dim:#5A6B80; --accent:#FFEB6F; --line:#24374F; --red:#FF7A6F; --mono: "SF Mono", Menlo, Consolas, monospace; }
html { color-scheme: dark; }
body { margin:0; background:var(--bg); color:var(--fg); font-family: Inter, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; font-size:15px; line-height:1.5; }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline; }
.wrap { max-width:1100px; margin:0 auto; padding: 0 clamp(16px, 4vw, 40px); }
header.top { border-bottom:1px solid var(--line); }
header.top .wrap { display:flex; flex-wrap:wrap; align-items:center; gap: 12px 28px; min-height:64px; }
.brand { font-weight:800; letter-spacing:.02em; font-size:18px; color:var(--fg); }
.brand span { color:var(--accent); }
nav { display:flex; flex-wrap:wrap; gap: 6px 18px; font-size:14px; color:var(--mute); }
nav a { color:var(--mute); } nav a.on, nav a:hover { color:var(--fg); text-decoration:none; }
.tier { margin-left:auto; font-family:var(--mono); font-size:12px; color:var(--dim); }
.tier.internal { color:var(--red); }
main { padding: 28px 0 60px; }
h1 { font-size: clamp(22px, 3vw, 30px); font-weight:800; margin: 0 0 6px; letter-spacing:-.01em; }
h2 { font-size:16px; font-weight:600; color:var(--mute); text-transform:uppercase; letter-spacing:.08em; margin: 36px 0 12px; }
h3 { font-size:15px; margin: 20px 0 8px; }
p { max-width: 72ch; }
.sub { color:var(--mute); margin-bottom: 22px; }
.banner { background:#3a2a16; border:1px solid #7a5a1a; color:var(--accent); padding:10px 14px; border-radius:6px; margin: 0 0 20px; font-family:var(--mono); font-size:13px; }
.banner.red { background:#3a1c1a; border-color:#7a2a24; color:var(--red); }
.freshness { font-family:var(--mono); font-size:13px; color:var(--mute); margin: 0 0 26px; }
.freshness b { color:var(--fg); font-weight:600; }
.reading { display:flex; flex-wrap:wrap; gap: 18px 40px; align-items:flex-end; margin: 10px 0 14px; }
.reading.big .fig .val { font-size: clamp(44px, 9vw, 96px); line-height:1; letter-spacing:-.03em; }
.fig { display:flex; flex-direction:column; gap:4px; }
.fig .lbl { font-size:12px; color:var(--mute); text-transform:uppercase; letter-spacing:.1em; }
.fig .val { font-size: 28px; font-weight:800; font-variant-numeric: tabular-nums; letter-spacing:-.02em; }
.fig.occupancy .val { color:var(--accent); }
.fig .val.blank { color:var(--dim); font-weight:600; }
.grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px 24px; margin: 10px 0 20px; }
.ev { display:inline-block; font-family:var(--mono); font-size:11px; letter-spacing:.06em; padding:2px 7px; border-radius:3px; border:1px solid transparent; vertical-align:middle; }
.ev-measured { background:var(--accent); color:#0D1A2B; font-weight:600; }
.ev-derived { background:var(--bg3); color:var(--mute); }
.ev-reported { border-color:var(--mute); color:var(--fg); }
.ev-forecast { color:var(--dim); border-color:var(--line); }
.ev-missing, .ev-provisional { color:var(--dim); border-color:var(--line); border-style:dashed; }
.evline { font-family:var(--mono); font-size:13px; color:var(--mute); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:12px 0; margin: 26px 0; display:flex; flex-wrap:wrap; gap: 6px 26px; }
.evline b { color:var(--fg); font-weight:600; }
.card { background:var(--bg2); border:1px solid var(--line); border-radius:8px; padding: 16px 18px; }
.cards { display:grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap:14px; }
dl { display:grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin:0; font-size:14px; }
dt { color:var(--mute); } dd { margin:0; font-variant-numeric: tabular-nums; overflow-wrap:anywhere; }
.tbl { overflow-x:auto; border:1px solid var(--line); border-radius:8px; }
table { border-collapse:collapse; width:100%; font-size:13px; font-variant-numeric: tabular-nums; }
th, td { text-align:left; padding: 8px 10px; border-bottom:1px solid var(--line); vertical-align:top; white-space:nowrap; }
th { color:var(--mute); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.06em; background:var(--bg2); }
tr:last-child td { border-bottom:0; }
td.wrap-ok { white-space:normal; }
.mono { font-family:var(--mono); font-size:12.5px; }
.dim { color:var(--dim); } .mute { color:var(--mute); } .warn { color:var(--red); }
pre { background:#0a1420; border:1px solid var(--line); border-radius:6px; padding: 12px 14px; overflow-x:auto; font-family:var(--mono); font-size:12.5px; line-height:1.5; }
code { font-family:var(--mono); font-size:.92em; background:var(--bg3); padding:1px 5px; border-radius:3px; }
pre code { background:none; padding:0; }
.null { color:var(--dim); font-style:italic; }
ul.plain { list-style:none; padding:0; margin:0; } ul.plain li { padding:4px 0; border-bottom:1px solid var(--line); }
footer { border-top:1px solid var(--line); color:var(--dim); font-size:13px; padding: 22px 0 40px; }
footer .rule { color:var(--mute); font-style:italic; }
footer .meta { font-family:var(--mono); font-size:12px; margin-top:8px; }
#live { font-family:var(--mono); font-size:13px; }
#live li { padding:6px 0; border-bottom:1px solid var(--line); }
.pill { display:inline-block; padding:1px 8px; border-radius:10px; font-size:12px; border:1px solid var(--line); color:var(--mute); }
.pill.ok { border-color:#2f6b4f; color:#8fe0b0; } .pill.bad { border-color:#7a2a24; color:var(--red); }