@font-face{font-family:Omori;src:url('assets/omori.woff2') format('woff2'),url('assets/omori.ttf') format('truetype');font-display:swap;size-adjust:150%;ascent-override:60%;descent-override:20%;line-gap-override:0%}
*{box-sizing:border-box}
html{color:#141414;background:#fff}
body{margin:0;min-height:100svh;display:flex;flex-direction:column;font-family:Omori,'Courier New',monospace;font-size:1.375rem;-webkit-font-smoothing:antialiased}
summary:focus-visible,a:focus-visible{outline:2px solid #111;outline-offset:5px}
.masthead{text-align:center;padding:30px 24px 0}
.logo{width:176px;height:48px;object-fit:contain}
.masthead p{margin:10px 0 0;font-size:1.2rem;letter-spacing:.16em}
main{flex:1;display:grid;place-items:center;padding:28px 36px 38px;min-height:480px}
.tracker{width:min(900px,100%);text-align:center}
.caption h1{font-size:1.55rem;letter-spacing:.05em;font-weight:400;margin:0 0 1px}
.percentage{font-size:4.7rem;line-height:1;margin:0 0 22px;letter-spacing:-.03em;min-width:5ch}
.percent-sign{font-size:.65em;vertical-align:8%;margin-left:3px}
.friends{position:relative;width:100%;--colour-edge:0%}
.friends img{display:block;width:100%;height:auto}
.lineup-base{filter:grayscale(1)}
.lineup-colour{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--colour-edge)) 0 0);pointer-events:none}
.progress-wrap{height:42px;position:relative;margin-top:4px}
.pencil-bar{display:block;width:100%;height:100%;overflow:visible}
.scale{display:flex;justify-content:space-between;font-size:1.15rem;margin-top:9px;padding:0 3px;color:#565656}
.status{font-size:1.4rem;margin:23px 0 0;line-height:1.3}
.status.error{color:#8a1c1c}
footer{position:relative;display:flex;justify-content:center;flex-wrap:wrap;gap:10px 20px;color:#666;padding:60px 24px 23px;font-family:'Courier New',monospace;font-size:.875rem;letter-spacing:.035em}
.mewo{display:block;width:52px;height:32px;object-fit:contain;image-rendering:pixelated}
.cat{position:absolute;left:50%;bottom:59px;transform:translateX(-50%);margin:0}
.credits{position:relative}
.credits summary{cursor:pointer;list-style:none;text-decoration:underline;text-underline-offset:3px}
.credits summary::-webkit-details-marker{display:none}
.credits p{position:absolute;bottom:25px;right:0;width:min(340px,85vw);padding:18px;border:1px solid #222;background:white;color:#222;font-size:.875rem;letter-spacing:0;line-height:1.4;margin:0;z-index:5}
.credits a{color:inherit}
@media(min-height:850px){.masthead{padding-top:48px}main{padding-bottom:65px}}
@media(max-width:600px){.masthead{padding-top:30px}.logo{width:150px;height:48px}main{min-height:380px;padding:28px 14px 35px}.caption h1{font-size:1.4rem}.percentage{font-size:4.4rem;margin-bottom:24px}.progress-wrap{height:36px}.status{font-size:1.25rem}footer{gap:9px 18px;font-size:.75rem;letter-spacing:0}.credits p{right:-30px}}
