:root{--paper:#f4f1e8;--ink:#24303a;--ink-rgb:36 48 58;--rule:#b4462d;--rule-rgb:180 70 45;--disc-fill:#6c8ca838;--stroke:2px;--hair:1.5px;--r:14px;--wall:3px;--cell:var(--r);--grid-out:rgb(var(--ink-rgb) / 6%);--grid-in:rgb(var(--ink-rgb) / 13%);--grid-at:calc(50% - var(--cell) / 2);--hatch:repeating-linear-gradient(45deg, rgb(var(--ink-rgb) / 55%) 0 1px, transparent 1px 6px);--bar-h:4.5rem;--gutter:1rem;--disc:56px;--star-line:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-7 -7 114 114'%3E%3Cpolygon points='50,0 61,35 98,35 68,57 79,91 50,70 21,91 32,57 2,35 39,35' fill='none' stroke='%23b4462d' stroke-width='12' stroke-linejoin='round'/%3E%3C/svg%3E");--star-fill:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-7 -7 114 114'%3E%3Cpolygon points='50,0 61,35 98,35 68,57 79,91 50,70 21,91 32,57 2,35 39,35' fill='%23b4462d' stroke='%23b4462d' stroke-width='12' stroke-linejoin='round'/%3E%3C/svg%3E");--label:Georgia, "Iowan Old Style", "Times New Roman", serif;color-scheme:light}@media (width<=35rem){:root{--bar-h:4rem;--disc:48px;--stroke:1.6px;--hair:1.25px}}*{box-sizing:border-box}html,body{height:100%}body{color:var(--ink);overscroll-behavior:none;background-color:var(--paper);background-image:linear-gradient(90deg, var(--grid-out) 0 1px, transparent 1px), linear-gradient(var(--grid-out) 0 1px, transparent 1px);background-size:var(--cell) var(--cell);background-position:var(--grid-at) var(--grid-at);margin:0;font-family:system-ui,sans-serif;overflow:hidden}main{display:block}h1{font-family:var(--label);letter-spacing:.16em;text-transform:uppercase;color:var(--ink);opacity:.8;flex:none;margin:0 0 1.4rem;font-size:1.05rem;font-weight:400}#play{top:var(--bar-h);bottom:var(--bar-h);left:var(--gutter);right:var(--gutter);pointer-events:none;position:fixed}#top,#foot{height:var(--bar-h);z-index:3;pointer-events:none;position:fixed;left:0;right:0}#top{top:0}#foot{bottom:0}#stage{touch-action:none;user-select:none;position:fixed;inset:0}.ball{-webkit-user-drag:none;background:var(--disc-fill);box-shadow:inset 0 0 0 var(--stroke) var(--ink);--h:0;will-change:transform;z-index:1;border-radius:50%;position:absolute;top:0;left:0}.ball:after{content:"";background:rgb(var(--ink-rgb) / 60%);border-radius:50%;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;position:absolute;top:50%;left:50%}.box{will-change:transform;position:absolute;top:0;left:0}.box:before{content:"";inset:calc(var(--wall) * -1);border:var(--wall) solid transparent;background-image:var(--hatch);outline:var(--hair) solid var(--ink);outline-offset:calc(var(--hair) * -1);background-clip:border-box;position:absolute}.box:after{content:"";background-color:var(--paper);background-image:linear-gradient(90deg, var(--grid-in) 0 1px, transparent 1px), linear-gradient(var(--grid-in) 0 1px, transparent 1px);background-size:var(--cell) var(--cell);background-position:var(--grid-at) var(--grid-at);box-shadow:0 0 0 var(--hair) var(--ink);position:absolute;inset:0}.handle{clip-path:polygon(100% 100%,100% 0%,0% 100%);cursor:nwse-resize;background-color:rgb(var(--rule-rgb) / 12%);background-image:repeating-linear-gradient(45deg, rgb(var(--rule-rgb) / 55%) 0 1px, transparent 1px 6px);position:absolute;top:0;left:0}.handle:after{content:"";background:var(--rule);clip-path:polygon(54% 54%,66% 57%,63% 60%,94% 91%,97% 88%,100% 100%,88% 97%,91% 94%,60% 63%,57% 66%);position:absolute;inset:0}#screen{z-index:5;padding:var(--bar-h) var(--gutter) 2rem;overscroll-behavior:contain;background:var(--paper);flex-direction:column;align-items:center;display:flex;position:fixed;inset:0;overflow-y:auto}#screen[hidden]{display:none}#levels{flex-direction:column;align-items:center;gap:.5rem;display:flex}.level{background-color:#0000;background-image:linear-gradient(rgb(var(--ink-rgb) / 9%) 0 0);background-repeat:no-repeat;background-position:var(--index-w) center;background-size:calc(100% - var(--index-w)) 12px;width:min(22rem,84vw);height:40px;color:var(--ink);font:inherit;cursor:pointer;--index-w:2.6rem;border:none;flex:none;padding:0;display:block;position:relative}.level .index{width:var(--index-w);height:100%;font-family:var(--label);opacity:.85;justify-content:center;align-items:center;font-size:.95rem;font-style:italic;display:flex;position:absolute;top:0;left:0}.level:focus-visible{outline:2px solid var(--rule);outline-offset:2px}.level .bar{left:var(--index-w);height:12px;width:calc(var(--bar,0) * (100% - var(--index-w)));background:rgb(var(--ink-rgb) / 82%);margin-top:-6px;position:absolute;top:50%}.level .notch{top:50%;left:calc(var(--index-w) + var(--at) * (100% - var(--index-w)));width:10px;height:10px;transform:translateY(calc(-50% + (2 - var(--rank)) * 10px));background:var(--star-line) center / contain no-repeat;margin:0 0 0 -5px;position:absolute}.level .notch.is-won{background-image:var(--star-fill)}.level.is-current{outline:var(--hair) solid var(--rule);outline-offset:3px}.level.is-locked{cursor:default;opacity:.4}.level.is-locked .notch,.level .lock{display:none}.level.is-locked .lock{left:calc(var(--index-w) + .5rem);background:var(--ink);border-radius:1.5px;width:11px;height:9px;margin-top:2px;display:block;position:absolute;top:50%;transform:translateY(-50%)}.level.is-locked .lock:before{content:"";border:2px solid var(--ink);border-bottom:none;border-radius:4px 4px 0 0;width:7px;height:7px;position:absolute;bottom:7px;left:2px}.fin{font-family:var(--label);letter-spacing:.3em;text-indent:.3em;text-transform:uppercase;color:var(--ink);opacity:.55;flex:none;margin-top:.6rem;font-size:.8rem}#gauge{left:50%;right:var(--gutter);--now:0px;--star:11px;position:absolute;top:0;bottom:0}#gauge[hidden]{display:none}#gauge .track{background-image:linear-gradient(rgb(var(--ink-rgb) / 45%) 0 0), repeating-linear-gradient(90deg, rgb(var(--ink-rgb) / 32%) 0 1px, transparent 1px var(--r)), repeating-linear-gradient(90deg, rgb(var(--ink-rgb) / 24%) 0 1px, transparent 1px calc(var(--r) / 2));background-position:0 100%,0 100%,0 100%;background-repeat:no-repeat;background-size:100% 1px,100% 8px,100% 4px;height:12px;position:absolute;bottom:1rem;left:0;right:0}#gauge .fill{width:var(--now);background:var(--rule);height:7px;position:absolute;bottom:1rem;left:0}#gauge.is-unfit .fill{box-shadow:inset 0 0 0 var(--hair) var(--rule);opacity:.6;background:0 0}#gauge .mark{left:var(--now);background:var(--rule);width:2px;height:22px;margin-left:-1px;position:absolute;bottom:calc(1rem - 5px)}#gauge .tick{left:var(--at,0px);bottom:calc(1rem + 14px + (var(--rank) - 1) * (var(--star) + 2px));width:var(--star);height:var(--star);margin-left:calc(var(--star) / -2);background:var(--star-fill) center / contain no-repeat;position:absolute}@media (width<=35rem){#gauge{--star:9px}}#gauge .tick[data-rank="3"]{--rank:3}#gauge .tick[data-rank="2"]{--rank:2}#gauge .tick[data-rank="1"]{--rank:1}#stars{--slot:22px;gap:7px;display:flex;position:absolute;top:50%;right:calc(50% + .75rem);transform:translateY(-50%)}#stars[hidden]{display:none}#stars .star{width:var(--slot);height:var(--slot);background:var(--star-line) center / contain no-repeat}#stars .star.is-won{background-image:var(--star-fill)}.fly{z-index:4;pointer-events:none;background:var(--star-fill) center / contain no-repeat;animation:.52s cubic-bezier(.33,.85,.35,1) forwards fly;position:fixed}@keyframes fly{0%{opacity:.7;transform:translate(0)scale(1)}45%{transform:translate(calc(var(--dx) * .45), calc(var(--dy) * .45 - 16px)) scale(calc(var(--grow) * 1.35));opacity:1}to{transform:translate(var(--dx), var(--dy)) scale(var(--grow));opacity:1}}@media (prefers-reduced-motion:reduce){.fly{display:none}}#tie{left:calc(50% + var(--at,0px));top:var(--top,0px);height:var(--length,0px);border-left:2px dotted rgb(var(--rule-rgb) / 65%);z-index:2;pointer-events:none;width:0;margin-left:-1px;position:fixed}#tie[hidden]{display:none}.advance,.pick,.back{pointer-events:auto;width:var(--disc);height:var(--disc);cursor:pointer;background:var(--paper);box-shadow:inset 0 0 0 var(--hair) var(--ink);z-index:3;border:none;border-radius:50%;padding:0;position:absolute;top:50%;transform:translateY(-50%)}.advance[hidden],.pick[hidden],.back[hidden]{display:none}.advance:after,.pick:after,.back:after{content:"";background:var(--ink);position:absolute;inset:0}.advance{right:var(--gutter);box-shadow:inset 0 0 0 var(--stroke) var(--rule)}.advance:after{background:var(--rule);clip-path:polygon(40% 28%,50% 28%,66% 50%,50% 72%,40% 72%,54% 50%)}.pick{left:var(--gutter)}.pick:after{clip-path:polygon(30% 33%,70% 33%,70% 39%,30% 39%,30% 47%,70% 47%,70% 53%,30% 53%,30% 61%,70% 61%,70% 67%,30% 67%)}.back{left:var(--gutter);top:calc(var(--bar-h) / 2);z-index:6;position:fixed}.back:after{clip-path:polygon(60% 28%,50% 28%,34% 50%,50% 72%,60% 72%,46% 50%)}