@font-face{font-family:Inter;src:url('/assets/fonts/inter-variable.woff2') format('woff2');font-weight:100 900;font-display:swap}
[hidden]{display:none}
h1{font-size:var(--fs-6);font-weight:300;line-height:var(--lh-head)}
h2{font-size:var(--fs-4);font-weight:400;margin:var(--s-7) 0 var(--s-3)}
.page-heading{margin-bottom:var(--s-5)}
#login{max-width:var(--frame-text);display:grid;gap:var(--s-4)}
#login[hidden]{display:none}
input{box-sizing:border-box;max-width:100%;min-height:var(--hit);border:var(--control-line);border-radius:var(--r-control);background:var(--panel);color:var(--ink);padding:var(--s-3);font:inherit}
input:focus{outline:2px solid var(--ink);outline-offset:0}
button:focus-visible,a:focus-visible{outline:var(--focus);outline-offset:2px}
#status{min-height:var(--s-5);max-width:var(--frame-text)}
.note{color:var(--text-2);font-size:var(--fs-2)}
.pick{display:flex;flex-wrap:wrap;align-items:end;gap:var(--s-3);margin-bottom:var(--s-6)}
.pick label{flex-basis:100%;color:var(--text-2);font-size:var(--fs-2)}
.pick input{width:auto;flex:0 1 240px}
.visually-quiet{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.readouts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-5)}
.readout .label{color:var(--text-2);font-size:var(--fs-2);margin:0 0 var(--s-2)}
.readout .value{font-size:var(--fs-6);font-weight:300;letter-spacing:-0.02em;line-height:1.1;margin:0;font-variant-numeric:lining-nums tabular-nums}
.unit{color:var(--text-3);font-size:var(--fs-1)}
.advice{max-width:var(--frame-text);padding-left:var(--s-5);margin:0}
.advice li{padding-block:var(--s-2);line-height:1.6}
.facts{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-2) var(--s-5);max-width:var(--frame-text);margin:0}
.facts dt{color:var(--text-2)}
.facts dd{margin:0;text-align:right;font-variant-numeric:lining-nums tabular-nums}
.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;max-width:var(--frame-text)}
th{color:var(--text-2);font-size:var(--fs-1);font-weight:400;text-align:left;background:var(--ground-2);padding:var(--s-2) var(--s-3)}
td{padding:var(--s-2) var(--s-3);border-bottom:var(--hairline);overflow-wrap:anywhere}
.num{text-align:right;font-variant-numeric:lining-nums tabular-nums}
@media(max-width:899px){.readouts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:599px){.readouts{grid-template-columns:minmax(0,1fr)}}

/* Optional Google owner login, composed from preserved shared input. */
.owner-google{max-width:var(--frame-text);margin-block:var(--s-5);padding:var(--s-4);border:var(--control-line);border-radius:var(--r-control);background:var(--panel);color:var(--ink)}
.owner-google[hidden]{display:none}.owner-google-form{display:grid;gap:var(--s-4);margin-top:var(--s-5)}
.owner-google-form label{display:grid;gap:var(--s-2)}.owner-google-form input,.owner-google-form textarea,.owner-google-form select{box-sizing:border-box;width:100%;min-width:0;min-height:var(--hit);padding:var(--s-3);font:inherit;border:var(--control-line);border-radius:var(--r-control);background:var(--panel);color:var(--ink)}
.owner-google-form textarea{min-height:calc(var(--hit)*2);resize:vertical}.owner-google-form fieldset{border:var(--control-line);padding:var(--s-3);display:grid;gap:var(--s-3);min-width:0}
.owner-google-form .owner-google-check{display:flex;align-items:flex-start;gap:var(--s-3)}.owner-google-form .owner-google-check input{flex:none;width:var(--hit);min-height:var(--hit);margin:0;padding:0}.owner-google-check span{overflow-wrap:anywhere;padding-top:var(--s-2)}
.owner-google-actions{display:flex;flex-wrap:wrap;gap:var(--s-3)}.owner-google-actions button{min-height:var(--hit)}
/* CLAUDE-AUDIT U4 (D-205): who is waiting for an item; a flag is text on its wash, only when it is news */
.waiting-item{max-width:var(--frame-text);padding-block:var(--s-4);border-bottom:var(--hairline)}
.waiting-item h3{font-size:var(--fs-3);font-weight:400;margin:0 0 var(--s-2)}
.waiting-item ul{margin:0;padding-left:var(--s-5)}
.waiting-item li{padding-block:var(--s-1);overflow-wrap:anywhere}
.flag{display:inline-block;font-size:var(--fs-1);color:var(--warn);background:var(--warn-wash);padding:0 var(--s-2);border-radius:var(--r-control)}
.flag.ok{color:var(--ok);background:var(--ok-wash)}

.notice-switch { margin: 0 0 var(--s-5, 24px); }
.notice-switch label { font-size: 14px; }
:root[data-motion="off"]{--t-state:0ms;--t-move:0ms;--t-screen:0ms}
#motion[aria-pressed="false"]{color:var(--text-3)}
@keyframes spectre-enter{from{opacity:0;transform:translateY(var(--s-1))}to{opacity:1;transform:translateY(0)}}
.panel,.readout,.waiting-item{animation:spectre-enter var(--t-move) var(--ease) both}

