*{box-sizing:border-box}:root{font:16px/1.4 ui-sans-serif,system-ui,-apple-system,sans-serif;color:#193542;background:#c9d7d9;color-scheme:light}body{margin:0;min-height:100svh;height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) max(16px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(16px,env(safe-area-inset-left))}header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 8px 0}h1{font-size:24px;letter-spacing:-.045em;line-height:1.2;margin:0;font-weight:650}h1 span{font-size:16px;font-weight:450;letter-spacing:0;display:inline-block;margin-left:10px}header p{font-size:16px;margin:6px 0 0;color:#385761}#cycle{text-align:right;font-variant-numeric:tabular-nums}main{position:relative;flex:1;min-height:280px;min-width:0}canvas{display:block;width:100%;height:100%;touch-action:pan-y}footer{padding:0 0 max(10px,env(safe-area-inset-bottom))}#phase{text-align:center;margin:0 0 8px;color:#36565e;min-height:23px}nav{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px 6px}button,a,select{font:inherit;min-height:44px;min-width:44px;border:0;background:transparent;color:inherit;border-radius:22px;padding:10px 12px;touch-action:manipulation;cursor:pointer}a{display:inline-flex;align-items:center;text-decoration:none}button:hover,a:hover,select:hover{background:#b9cbce}button[aria-pressed=true]{background:#234551;color:#e8efea}button:disabled{opacity:.45;cursor:default}:focus-visible{outline:2px solid #294b57;outline-offset:2px}.speed{display:flex;align-items:center}select{appearance:auto;padding-right:6px}#error{position:absolute;inset:15% 8%;display:grid;place-content:center;text-align:center;background:#c9d7df}#error[hidden]{display:none}#error button{border:1px solid #486773;justify-self:center}h2{font-size:22px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media(min-width:1100px){header{max-width:1400px;width:100%;align-self:center}main{max-width:1500px;width:100%;align-self:center}}@media(max-width:500px){body{padding-inline:10px;min-height:640px}header{padding:14px 4px 0;align-items:flex-start}h1 span{display:block;margin:4px 0 0}header>div>p{display:none}#cycle{max-width:120px;font-size:16px}nav{gap:0}button,a,select{padding:9px 10px}#phase{margin-bottom:3px}main{min-height:300px}}@media(max-height:500px) and (min-width:600px){body{min-height:360px}header{padding-top:5px}header>div>p{display:none}h1{font-size:20px}main{min-height:180px}nav{gap:0}button,a,select{padding:7px 10px}footer{padding-bottom:0}#phase{margin:0;font-size:16px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

footer{position:relative}#adjust{position:relative}#adjust summary{cursor:pointer;list-style:none;min-height:44px;min-width:44px;padding:10px 12px;border-radius:22px}#adjust summary::-webkit-details-marker{display:none}#adjust[open] summary{background:#234551;color:#e8efea}.adjust-panel{position:absolute;z-index:2;bottom:calc(100% + 12px);left:50%;transform:translateX(-50%);width:300px;padding:12px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:4px;background:#cfddde;border:1px solid #8da9af;border-radius:10px;box-shadow:0 10px 35px #1b3b4620}#adjust:not([open]) .adjust-panel{display:none}@media(max-width:500px){nav{max-width:390px;margin:auto}#adjust summary{padding:9px 10px}.adjust-panel{position:fixed;left:50%;bottom:115px;width:min(300px,calc(100vw - 24px))}}
