:root{--bg:#fbfaf7;--fg:#222;--dim:#8a8780;--line:#d8d5ce;--accent:#b5532a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#141414;--fg:#e6e3dc;--dim:#77746e;--line:#333;--accent:#e08a5f}}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--fg);margin:0}body{-webkit-text-size-adjust:100%;font:15px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}main{max-width:calc(40ch + 32px);margin:0 auto;padding:24px 16px 64px}.scene{font:inherit;white-space:pre;touch-action:manipulation;cursor:pointer;background:radial-gradient(ellipse var(--pool,25%) 70% at var(--pool-x,45%) 70%, color-mix(in srgb, var(--fg) 5%, transparent), transparent);margin:0 0 20px;font-size:min(1em,4.13223vw - 1.32231px);line-height:1.2;position:relative;overflow:hidden}.scene .grid{font:inherit;display:block}.scene .ball{will-change:transform;pointer-events:none;position:absolute;top:0;left:0}.scene .ball.cue{color:var(--accent)}.scene .probe{visibility:hidden;pointer-events:none;position:absolute}.scene .rubber{color:var(--accent)}.scene.cue .rubber{text-shadow:0 0 6px var(--accent);font-weight:700}.scene .fallen,.scene .shadow,.scene .trail,.scene .chalk{color:var(--dim)}.scene .hit{color:var(--accent)}.scene .dark{opacity:.35}.scene .word{color:var(--dim)}.scene .word.accent{color:var(--accent)}.scene .word.f1{opacity:.75}.scene .word.f2{opacity:.5}.scene .word.f3{opacity:.25}.scene .table{color:var(--dim)}.scene .table.in0{opacity:.25}.scene .table.in1{opacity:.5}.scene .table.in2{opacity:.75}.scene .word.build,.scene .table.lit{color:var(--fg)}.scene .pip{color:var(--dim)}.scene.nudge .grid,.scene.nudge .ball{translate:0 1px}.scene.nudge-l .grid,.scene.nudge-l .ball{translate:-1px}.scene.nudge-r .grid,.scene.nudge-r .ball{translate:1px}.scene .card{color:var(--fg)}.scene .card.in0{opacity:.25}.scene .card.in1{opacity:.5}.scene .card.in2{opacity:.75}.stage{white-space:pre;margin:-8px 0 16px;line-height:1.35}.stage[hidden]{display:none}.match .row{min-height:1.35em}.match .dim{color:var(--dim)}.match .cause,.match .winner{color:var(--accent)}.match .winner.dim{color:var(--dim)}.stats .stat{min-height:1.35em}.stats .stat.tap{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;align-items:center;min-height:44px;display:flex}.stats .stat.tap:active{background:var(--line)}.stat .dim,.stat .mark{color:var(--dim)}.stat .pick,.stat .passed,.stat.up .last{color:var(--accent)}.stat .last{transition:color .4s}.counters{min-height:1.5em;margin-bottom:16px;position:relative}.ghost{color:var(--dim);opacity:0;pointer-events:none;position:absolute;top:0;right:0}.ghost.fade{animation:.7s ease-out ghost}@keyframes ghost{0%{opacity:1}to{opacity:0}}.counter{white-space:pre;transition:color .2s}.counter.tick{color:var(--accent);transition:none}.leaving{pointer-events:none;animation:1s ease-in forwards out}.counter .bar{color:var(--dim)}.actions{flex-wrap:wrap;gap:10px;margin-bottom:24px;display:flex}button{font:inherit;color:var(--fg);border:1px solid var(--fg);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border-radius:3px;min-height:44px;padding:10px 18px}button:active:not(:disabled){background:var(--fg);color:var(--bg)}button:disabled{color:var(--dim);border-color:var(--line);cursor:default}button.paddle{transition:border-color 80ms}button.paddle[data-ball=out]{border-color:var(--line)}button.paddle[data-ball=cue]{border-color:var(--accent)}.actions.locked button:active,button.muffled{background:var(--line);color:var(--fg)}.actions.locked button.paddle[data-ball]{border-color:var(--fg)}button.paddle.breathe,button.refocus.breathe{animation:2s ease-in-out infinite breathe}button.place.active{border-color:var(--accent)}button.refocus{color:var(--dim);order:1;padding:.4em .9em;font-size:.85em}button.refocus.breathe{color:var(--fg)}@keyframes breathe{50%{border-color:color-mix(in srgb, var(--fg) 50%, transparent)}}.log{margin:0;padding:0;list-style:none}.log li{margin-bottom:6px;transition:opacity 1s}.log li.chatter{color:var(--dim);font-style:italic}.reveal{animation:1.4s ease-out backwards reveal}.tabs{background:var(--bg);border-top:1px solid var(--line);z-index:1;gap:0;margin:0 -16px;padding:0 16px;display:flex;position:sticky;bottom:0}.tabs[hidden],.tab-panel[hidden],.log[hidden]{display:none}.tabs .tab{min-height:44px;color:var(--dim);border:0;border-radius:0;flex:1;padding:0 4px}.tabs .tab.on{color:var(--fg);text-underline-offset:6px;text-decoration:underline}.tabs .tab:active{color:var(--fg);background:0 0}.tab-panel{white-space:pre;line-height:1.35}.the-end .scene{cursor:default}.the-end .actions{pointer-events:none;animation:1.2s ease-in forwards out}@keyframes out{to{opacity:0;visibility:hidden}}.end{color:var(--dim);margin-bottom:20px}.end p{margin:0 0 6px;animation:1.4s ease-out 1.4s backwards reveal}.end .more{font-size:12px;animation-delay:3s}.end a{color:inherit;text-underline-offset:3px;margin:-14px -6px;padding:14px 6px;display:inline-block}.end a:hover,.end a:focus-visible{color:var(--fg)}@keyframes reveal{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.reveal{animation-duration:10ms}button.paddle{transition:none}button.paddle.breathe{animation:none}.scene .word.f1,.scene .word.f2,.scene .word.f3{opacity:1}.scene.nudge .grid,.scene.nudge .ball{translate:none}.the-end .actions,.end p,.end .more{animation-duration:10ms;animation-delay:0s}.leaving{animation-duration:10ms}button.refocus.breathe{animation:none}.scene.nudge-l .grid,.scene.nudge-l .ball,.scene.nudge-r .grid,.scene.nudge-r .ball{translate:none}}@media (width>=600px) and (orientation:landscape){main{box-sizing:border-box;grid-template-rows:max-content max-content max-content max-content 1fr;grid-template-columns:40ch minmax(0,40ch);align-content:start;column-gap:3em;width:calc(80ch + 3em);max-width:none;height:100dvh;padding:16px 0;font-size:min(20px,3.33333dvh - 1.06667px,1.92308vw - 1.23077px);display:grid}.scene{grid-column:1;margin-bottom:1em;font-size:1em}.actions button{min-height:0;padding:.6em 1.2em}.counters,.actions,.stage{grid-column:1}.stage{margin-top:0}.stats .stat.tap{min-height:0;padding:.3em 0}.tabs{border-top:0;border-bottom:1px solid var(--line);order:-1;margin:0 0 1em;padding:0;position:static}.tabs .tab{flex:none;min-height:0;margin-right:2em;padding:.3em 0}.actions{align-self:start;margin-bottom:0}main.p1{font-size:min(20px,2.7027dvh - .864865px,1.92308vw - 1.23077px)}.side{flex-direction:column;grid-area:1/2/6;min-height:0;display:flex}.end{flex:none;margin-bottom:1em}.log{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;flex:auto;min-height:0;overflow-y:auto}.debug{grid-column:1/-1}}.debug{border-top:1px dashed var(--line);color:var(--dim);margin-top:40px;padding-top:12px;font-size:12px}.debug .row{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:8px;display:flex}.debug button,.debug select,.debug input{font:inherit;color:var(--fg);border:1px solid var(--line);background:0 0;border-radius:3px;min-height:0;padding:4px 8px}.debug input{width:6ch}.corner{color:var(--dim);opacity:.6;font-size:10px;position:fixed;bottom:6px;left:8px}.corner button{all:unset;cursor:pointer;padding:4px 2px}.corner button:hover,.corner button:focus-visible{text-decoration:underline}
