:root{color-scheme:light;--navy:#101f32;--ink:#172a3e;--muted:#607286;--line:#dce6ee;--paper:#f4f7fa;--white:#fff;--mint:#49c8aa;--mint-deep:#00866c;--shadow:0 14px 36px rgba(20,42,66,.07);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:16px}
*{box-sizing:border-box}
html{background:var(--paper)}
body{margin:0;color:var(--ink);line-height:1.5}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{opacity:.6;cursor:wait}
a{color:inherit}
[hidden]{display:none!important}
.shell{width:min(100% - 40px,1080px);margin-inline:auto}
.site-header{background:var(--navy);color:#fff}
.header-inner{min-height:72px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:12px;font-size:1.04rem;font-weight:750;letter-spacing:-.02em}
.brand-mark{width:32px;height:32px;border:2px solid var(--mint);border-radius:10px;display:inline-grid;place-items:center;color:var(--mint);font-size:1.15rem;line-height:1}
.header-actions{display:flex;align-items:center;gap:22px;font-size:.94rem}
.header-actions a,.text-button{color:#e7f4f6;text-decoration:none}
.text-button{border:0;background:none;padding:10px 0}
.header-actions a:hover,.text-button:hover{text-decoration:underline}
.main-content{padding-block:34px 80px}
.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:26px}
.eyebrow{color:var(--mint-deep);font-size:.77rem;font-weight:800;text-transform:uppercase;letter-spacing:.13em;margin:0 0 7px}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(1.85rem,4vw,2.65rem);letter-spacing:-.04em;line-height:1.14;margin-bottom:9px}
h2{font-size:1.35rem;letter-spacing:-.025em;line-height:1.2;margin-bottom:0}
h3{font-size:1rem;margin-bottom:4px}
.muted{color:var(--muted);margin-bottom:0}
.update-badge{color:#296755;background:#e1f5ee;border:1px solid #bde8da;border-radius:999px;padding:9px 14px;font-size:.82rem;max-width:310px;text-align:center}
.overview{display:grid;grid-template-columns:1.45fr 1fr;gap:18px;margin-bottom:18px}
.reading-card,.adjusted-card,.chart-card,.lookup-card,.interval-card,.admin-card{border-radius:22px;box-shadow:var(--shadow)}
.reading-card{background:var(--navy);color:white;padding:28px 32px;min-height:210px;position:relative;overflow:hidden}
.reading-card:after{content:"";position:absolute;width:210px;height:210px;border:1px solid rgba(94,224,195,.18);border-radius:50%;right:-45px;top:-80px;box-shadow:0 0 0 42px rgba(94,224,195,.035),0 0 0 85px rgba(94,224,195,.025);pointer-events:none}
.adjusted-card{background:var(--white);border:1px solid var(--line);color:var(--ink);padding:28px 32px;min-height:210px}
.metric-label{font-weight:650;margin-bottom:20px;color:inherit;opacity:.82}
.reading-card .metric-label,.adjusted-card .metric-label{margin-bottom:3px}
.transform-note{font-size:.85rem;opacity:.75;margin:0 0 17px}
.big-reading{display:flex;align-items:baseline;gap:10px;font-weight:750;letter-spacing:-.06em;line-height:1.1;white-space:nowrap;font-size:clamp(2.45rem,5vw,4.1rem)}
.adjusted-card .big-reading{font-size:clamp(2rem,3vw,3rem);flex-wrap:wrap;white-space:normal}
.metric-unit{font-size:clamp(.875rem,.36em,1.25rem);font-weight:600;letter-spacing:0;white-space:nowrap}
.metric-note{font-size:.91rem;margin:17px 0 0;opacity:.82}
.chart-card,.lookup-card,.interval-card,.admin-card{background:var(--white);border:1px solid var(--line)}
.chart-card{padding:26px 30px 20px;margin-bottom:18px}
.section-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}
.period-tabs{display:flex;gap:6px;flex-wrap:wrap;background:#f0f5f8;border-radius:14px;padding:5px;width:max-content;max-width:100%;margin-bottom:20px}
.period-tab{border:0;background:transparent;color:#52677b;border-radius:10px;padding:10px 17px;min-height:44px;font-weight:650;font-size:.9rem}
.period-tab.active{background:white;color:var(--navy);box-shadow:0 2px 8px rgba(16,31,50,.1)}
.scale-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:-6px 0 18px}
.scale-tab{border:1px solid var(--line);background:#fff;color:#52677b;border-radius:11px;padding:8px 13px;min-height:40px;font-size:.86rem;font-weight:650}
.scale-tab.active{background:#e1f5ef;border-color:#9bdec8;color:#006c59}
.custom-range{display:flex;align-items:end;gap:12px;flex-wrap:wrap;padding:4px 0 20px}
label{display:flex;flex-direction:column;gap:7px;font-weight:650;font-size:.88rem}
input{border:1px solid #c9d8e4;border-radius:12px;min-height:46px;padding:10px 13px;background:white;color:var(--ink);outline:none;width:100%}
input:focus{border-color:var(--mint-deep);box-shadow:0 0 0 3px rgba(0,134,108,.15)}
.custom-range input{min-width:205px}
.button{border:0;border-radius:12px;min-height:46px;padding:10px 19px;font-weight:750;display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none}
.button.primary{background:var(--mint-deep);color:white}
.button.primary:hover{background:#00745e}
.button.secondary{background:#eaf1f5;color:var(--navy)}
.button.secondary:hover{background:#dce9ef}
.button.small{font-size:.85rem;min-height:38px;padding:7px 12px}
.chart-message{display:grid;place-items:center;text-align:center;min-height:250px;color:var(--muted);font-weight:600;background:linear-gradient(180deg,#fbfdfe,#f5f9fb);border-radius:14px}
.chart-wrap{height:250px;position:relative;overflow:hidden;background:linear-gradient(180deg,#fff,#fbfefd);border-radius:14px}
.chart-grid{position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 60px,#e9f0f4 61px);pointer-events:none}
#chart{position:relative;width:100%;height:100%;display:block;touch-action:pan-y}
.chart-area{fill:rgba(36,179,147,.12)}
.chart-line{fill:none;stroke:#009d7f;stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.chart-marker{fill:white;stroke:#008e74;stroke-width:4;vector-effect:non-scaling-stroke}
.chart-tip{position:absolute;top:12px;left:12px;background:var(--navy);color:#fff;border-radius:10px;padding:9px 12px;font-size:.8rem;pointer-events:none;box-shadow:0 7px 20px rgba(16,31,50,.18);max-width:230px}
.chart-axis{display:flex;justify-content:space-between;color:var(--muted);font-size:.84rem;margin-top:10px}
.chart-footnote{color:var(--muted);font-size:.82rem;margin:15px 0 0}
.lookup-card,.interval-card{padding:25px 30px;margin-bottom:18px}
.lookup-card{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.lookup-card h2,.interval-card h2{margin-bottom:8px}
.lookup-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.lookup-form input{min-width:225px}
.interval-form{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin-top:20px}
.interval-form label{flex:1 1 225px}
.interval-form .button{flex:0 0 auto}
.interval-result{border-top:1px solid var(--line);margin-top:20px;padding-top:16px;color:var(--ink)}
.interval-result .lookup-time:last-child{margin-bottom:0}
.lookup-result{width:100%;border-top:1px solid var(--line);padding-top:16px;color:var(--ink)}
.lookup-time{font-size:.88rem;color:var(--muted);margin-bottom:12px}
.lookup-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.lookup-value{background:#f4f8fa;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.lookup-value.primary{background:#e1f5ef;border-color:#bde8da}
.lookup-value-label{display:block;color:var(--muted);font-size:.82rem;font-weight:650;margin-bottom:4px}
.lookup-value strong{display:block;font-size:clamp(1.15rem,3vw,1.55rem);line-height:1.2;overflow-wrap:anywhere}
.login-body{min-height:100dvh;background:radial-gradient(circle at 85% 0,#254762 0,transparent 35%),var(--navy);display:grid;place-items:center;padding:24px}
.login-card{width:min(100%,440px);background:white;border-radius:26px;padding:34px;box-shadow:0 30px 80px rgba(0,0,0,.17)}
.login-card .brand-mark{margin-bottom:30px}
.login-card h1{font-size:2rem;margin-bottom:11px}
.login-intro{color:var(--muted);margin-bottom:27px}
.form-stack{display:grid;gap:18px}
.form-stack .button{width:100%;margin-top:4px}
.form-error{margin:0;color:#a32936;background:#fff0f1;border-radius:10px;padding:10px 12px;font-size:.9rem}
.admin-layout{max-width:820px}
.admin-card{padding:25px 28px;margin-bottom:18px}
.admin-card h2{margin-bottom:18px}
.admin-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.admin-form label:nth-child(3),.admin-form label:nth-child(4),.admin-form .form-message,.admin-form button{grid-column:1/-1}
.admin-form small{font-size:.78rem;color:var(--muted);font-weight:400}
.admin-form button{justify-self:start}
.form-message{padding:11px 13px;background:#e1f5ef;border-radius:10px;color:#006c59;margin:0}
.user-list{display:grid;gap:12px}
.user-item{border:1px solid var(--line);border-radius:14px;padding:17px}
.user-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.user-top p{font-size:.85rem}
.status{font-size:.77rem;font-weight:750;background:#edf0f2;color:#566573;border-radius:999px;padding:5px 10px;white-space:nowrap}
.status.active{background:#dff5ec;color:#087658}
.user-actions{display:flex;gap:8px;margin-top:13px}
.user-details{margin-top:12px;border-top:1px solid var(--line);padding-top:11px}
.user-details summary{cursor:pointer;color:var(--mint-deep);font-size:.85rem;font-weight:700}
.details-form{display:grid;grid-template-columns:1fr auto;align-items:end;gap:10px;margin-top:13px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){.shell{width:min(100% - 28px,1080px)}.header-inner{min-height:64px}.brand{font-size:.95rem}.header-actions{gap:12px;font-size:.82rem}.main-content{padding-block:26px 52px}.page-heading{align-items:flex-start;flex-direction:column;margin-bottom:20px;gap:10px}.update-badge{font-size:.78rem;padding:7px 11px}.overview{grid-template-columns:1fr;gap:12px}.reading-card,.adjusted-card{min-height:0;padding:24px}.reading-card{min-height:180px}.adjusted-card{min-height:170px}.metric-label{margin-bottom:12px}.big-reading{font-size:clamp(2rem,8vw,3.8rem)}.chart-card{padding:22px 16px 18px}.period-tabs{width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:4px}.period-tab{padding:8px 3px;font-size:.77rem}.chart-wrap{height:235px}.chart-message{min-height:235px}.chart-tip{font-size:.76rem}.lookup-card,.interval-card{padding:22px 18px;display:block}.lookup-form{margin-top:18px;display:grid;grid-template-columns:1fr auto}.lookup-form input{min-width:0}.interval-form{display:grid;grid-template-columns:1fr 1fr}.interval-form label{min-width:0}.interval-form .button{grid-column:1/-1}.lookup-values{grid-template-columns:1fr}.admin-card{padding:21px 18px}.admin-form{grid-template-columns:1fr}.admin-form label:nth-child(3),.admin-form label:nth-child(4),.admin-form .form-message,.admin-form button{grid-column:1}.user-top{display:block}.status{display:inline-block;margin-top:10px}.details-form{grid-template-columns:1fr}.details-form button{justify-self:start}}
@media(max-width:390px){.header-actions{gap:9px}.brand span:last-child{font-size:.84rem}.period-tab{font-size:.72rem}.lookup-form,.interval-form{grid-template-columns:1fr}.lookup-form .button,.interval-form .button{width:100%;grid-column:1}}
