@import url('/assets/styles/fonts.css');
:root{color-scheme:light;font:19px/1.35 'Arial Narrow',Arial,sans-serif;color:#000;background:#036}
*{box-sizing:border-box}
body{margin:0}
main{max-width:900px;margin:auto;padding:16px 20px 24px;text-align:center}
.visually-hidden,.skip-link:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link:focus{position:absolute;left:16px;top:16px;z-index:2;padding:12px;background:#fc0;color:#036;border:3px solid #036;border-radius:14px;font-weight:bold}
.panel{padding:20px 26px;background:#0280cd;border:3px solid #036;border-radius:28px;box-shadow:inset 0 0 0 3px #0cf,0 0 0 2px #fff,0 0 0 4px #ffffff80,0 12px 50px #0007;margin-bottom:24px}
.board{display:grid;gap:12px;padding:18px 24px}
header{display:grid;grid-template-columns:150px minmax(0,1fr);align-items:center;column-gap:16px;color:#fff;text-shadow:0 2px #036;text-align:right}
.brand{display:block;grid-row:1/3;width:150px;min-height:44px}.brand img{display:block;width:100%;height:auto}
#updated{font-size:15px;margin:2px 0 0}
h1,h2,.hero-number{font-family:'Burbank Small',Arial,sans-serif;color:#fff;text-shadow:2px 0 #036,-2px 0 #036,0 2px #036,0 -2px #036,2px 2px #036,-2px 2px #036,2px -2px #036,-2px -2px #036,0 4px #036}
h1{font-size:34px;line-height:1.1;margin:0}
h1,h2,h3{text-wrap:balance}
h2{font-size:26px;line-height:1.1;margin:0 0 8px}
p{margin:8px 0}
.hero{display:grid;grid-template-columns:150px minmax(0,1fr) 150px;align-items:center;gap:12px}
.hero-portrait{display:flex;justify-content:center;align-items:center}
.hero-icon{display:block;width:84px;height:auto;filter:drop-shadow(0 3px 0 #036)}
.hero-number{display:block;font-size:72px;line-height:1;color:#fc0;font-variant-numeric:tabular-nums}
.hero-number.is-long{font-size:48px}
.hero p{margin:4px 0 0;font-size:17px}
.arrival{background:#fff;border:3px solid #036;border-radius:14px;padding:10px;min-width:0}
.arrival strong{display:block;font:bold 34px/1 'Burbank Small',Arial,sans-serif;color:#036}
.arrival strong.is-long{font-size:24px}
.arrival span{display:block;margin-top:4px;font-size:16px;line-height:1.15}
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
article{background:#fff;border:3px solid #036;border-radius:14px;padding:8px;min-width:0}
.metric-art{display:block;width:28px;height:28px;object-fit:contain;margin:0 auto;filter:drop-shadow(0 2px 0 #036)}
article>strong{display:block;font:bold 34px/1 'Burbank Small',Arial,sans-serif;color:#036;margin:3px 0;font-variant-numeric:tabular-nums}
article>strong.is-long{font-size:30px}
h3{font:bold 19px/1.1 'Arial Narrow',Arial,sans-serif;margin:0}
article p{display:none}
.board-footer{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:15px;line-height:1.25;color:#fff}
.board-footer a{color:#fff;font-weight:bold;text-decoration:none;display:flex;align-items:center;min-height:44px;padding:0 4px}
.board-footer a:hover{text-decoration:underline}
.stats-feedback:has(#status[hidden]){display:none}
.no-data .hero,.no-data .milestones,.no-data .board-footer,.no-data .daily{display:none}
#status{margin:0 0 12px;font-size:17px;color:#fff}
#status.error{font:bold 19px/1.35 'Arial Narrow',Arial,sans-serif;color:#fff;background:#f60;border:3px solid #983901;border-radius:14px;box-shadow:inset 0 0 0 2px #fc0;padding:10px;text-shadow:1px 0 #983901,-1px 0 #983901,0 1px #983901,0 -1px #983901}
.chart{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;background:#fff;border:3px solid #036;border-radius:14px;padding:20px 14px 12px;margin-top:18px;min-height:200px}
.chart>p{grid-column:1/-1;align-self:center}
.bar.zero{min-height:0;border:0}
.chart-date-short{display:none}
.chart-day{display:grid;grid-template-rows:24px 100px 28px;align-items:end;gap:8px;font-size:16px}
.chart-count{font-weight:bold;color:#036}.bar-track{height:100px;display:flex;align-items:end;justify-content:center;border-bottom:2px solid #036}.bar{width:70%;max-width:55px;height:calc(var(--share)*100%);min-height:3px;background:#0280cd;border:2px solid #036;border-radius:8px 8px 0 0;box-shadow:inset 2px 2px #0cf}.chart-day:last-child .bar{background:#fc0;box-shadow:inset 2px 2px #fff}
footer{color:#fff;text-shadow:0 2px #036}
button,.action{display:block;width:100%;max-width:360px;min-height:48px;margin:16px auto;padding:10px 16px;font:bold 23px/1.15 'Arial Narrow',Arial,sans-serif;color:#fff;text-decoration:none;background:#0280cd;border:3px solid #036;border-radius:18px;box-shadow:inset 0 2px 0 #1aa3e8,0 3px 0 #0cf;cursor:pointer;touch-action:manipulation}
button:hover,.action:hover{background:#00529b}button:active,.action:active{background:#004280;transform:translateY(1px)}button:disabled{opacity:.6;cursor:wait}a:focus-visible,button:focus-visible{outline:3px solid #fc0;outline-offset:2px}[hidden]{display:none!important}
@media(max-width:600px){
 main{padding:10px 10px 20px}.panel{padding:18px 14px}.board{padding:14px;gap:8px}
 header{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:3px}
 .brand{grid-row:auto;width:140px}h1{font-size:26px}#updated{font-size:15px;margin:0}
 .hero{grid-template-columns:minmax(0,1fr);gap:8px}.hero-portrait{display:none}
 .hero-number{font-size:60px}.hero-number.is-long{font-size:34px}.hero p{font-size:16px}
 .arrival{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:8px}
 .arrival strong{flex-shrink:0}.arrival span{min-width:0}
 .arrival span{margin:0;text-align:left;font-size:16px}.arrival br{display:none}.arrival strong{font-size:28px}
 .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 article{padding:4px 5px}article>strong{font-size:30px}article>strong.is-long{font-size:22px}h3{font-size:17px}
 .board-footer{flex-direction:column;gap:0;text-align:center;line-height:1.2}
 .board-footer a{min-height:44px}
 .chart{gap:5px;padding:16px 8px 10px}.chart-day{font-size:15px}
 .chart-date-full{display:none}.chart-date-short{display:inline}.daily>p{font-size:16px}
}
