html,body{width:100%;height:100%;height:100dvh;overflow:hidden;background:#0b0f14;color:var(--ink);font-family:var(--mono);font-size:12px}#serveToolbar{position:fixed;top:14px;left:14px;z-index:90}#serveToolbar button{display:flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid #243240;border-radius:8px;background:#0c1117e0;color:var(--ink);font:11px var(--mono);cursor:pointer}#serveToolbar svg{width:16px;height:16px}#serveToolbar kbd{color:#8295a8;font:10px var(--mono)}#serveToolbar #serveMuteBtn{display:none}@media(pointer:fine){#serveToolbar button{background:#0c1117eb}}#serveReadyPrompt{position:fixed;bottom:22%;left:50%;transform:translate(-50%);z-index:9;display:flex;flex-direction:column;align-items:center;gap:5px;max-width:calc(100vw - 32px);padding:16px 38px;border:1.5px solid rgba(170,221,0,.35);border-radius:14px;background:#0c1117eb;backdrop-filter:blur(6px);text-align:center;white-space:nowrap}#serveReadyPrompt[hidden]{display:none}#serveReadyPrompt .c02195b{margin:0;min-height:0;color:var(--amber);font:700 21px var(--sans);letter-spacing:.1em;text-transform:uppercase}#serveReadyPrompt .cb80e0a{color:#a0b4c4;font:13px var(--mono)}#serveReadyPrompt kbd{padding:1px 5px;border:1px solid #2e3f50;border-bottom-width:2px;border-radius:4px;background:#ffffff12;color:#c5d1dc;font:11px/1.6 var(--mono)}#servePromptMeters{display:none;gap:5px;margin-top:8px;justify-content:center}#servePromptMeters.cd42ef1{display:flex}#servePromptMeters .cfcde2b{position:relative;width:36px;height:5px;border-radius:3px;background:#ffffff26;overflow:hidden}#servePromptMeters .ccbc8a8{position:absolute;inset:-1px 0;background:#ffffff1f}#servePromptMeters .cdcd324{position:relative;z-index:1;width:0%;height:100%;background:var(--amber)}#servePromptMeters .cfcde2b.c029f33{width:54px;margin-left:6px}#servePromptMeters .cfcde2b.c029f33 .cdcd324{background:#e8f4ff}@media(pointer:coarse){#serveReadyPrompt{display:none}}#serveMenu{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:24px 16px 78px;overflow-y:auto;box-sizing:border-box;background:radial-gradient(120% 90% at 50% 38%,#0b0f1452,#0b0f1494);backdrop-filter:blur(1.5px)}#serveMenu[hidden]{display:none}#serveMenu .caaf232{font:700 23px var(--sans);margin:0}#serveMenu .cddc6e2{margin-top:-15px;color:#8295a8;font:11px var(--mono);letter-spacing:.08em}#serveMenu .c19ef5e{display:flex;width:100%;max-width:560px;padding-left:6px;position:relative;z-index:1;margin-bottom:-24px}#serveMenu .c4656ce{min-width:108px;padding:7px 16px;border:1px solid #1e2a37;border-bottom:none;border-radius:9px 9px 0 0;background:#0c1117eb;color:#e6eef6;font:11px var(--mono);position:relative;top:1px;cursor:pointer}#serveMenu .c7415e1{width:100%;max-width:560px;min-height:260px;max-height:66vh;overflow-y:auto;padding:16px 19px 6px;box-sizing:border-box;background:#0c1117eb;border:1px solid #1e2a37;border-radius:11px}#serveMenu .c143abf+.c143abf{margin-top:20px;padding-top:20px;border-top:1px solid #1e2a37}#serveMenu .c87372d{font:700 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#6b7d90}#serveMenu .c693d6d{margin-top:6px;font:11px/1.5 var(--mono);color:#8295a8}#serveMenu .cea42cf{margin-top:10px}#serveMenu .cca57d1{display:contents}#serveMenu .cca57d1 button,#serveMenu .cca57d1 a{margin-top:7px;padding:12px 28px;border:1px solid #2a3a4a;border-radius:9px;background:#0c1117e6;color:var(--ink);text-align:center;text-decoration:none;font:600 12px var(--mono);cursor:pointer}#serveMenu .cca57d1 button:hover{border-color:var(--amber);color:var(--amber);box-shadow:0 6px 16px #aadd0026}#serveMenu #serveHomeLink{border-color:#ff6b6b;color:#ff6b6b}#serveMenu #serveHomeLink:hover{border-color:#e35c5c;color:#e35c5c}#serveMenu .cca57d1 kbd{display:inline-block;padding:1px 5px;border:1px solid #2e3f50;border-bottom-width:2px;border-radius:4px;background:#ffffff12;color:#9aaaba;font:10px/1.6 var(--mono)}#serveMenu button:focus-visible,#serveMenu a:focus-visible,#serveToolbar button:focus-visible,#serveMenu .c0fb694{outline:2px solid var(--amber);outline-offset:3px}@media(pointer:coarse)and (orientation:landscape)and (max-height:560px){#serveMenu[data-tutorial=false]{display:grid;grid-template-columns:auto 1fr auto auto;grid-template-rows:auto minmax(0,1fr);align-items:stretch;gap:6px 10px;padding:8px 12px;overflow:hidden;background:#090d12db}#serveMenu[data-tutorial=false][hidden]{display:none}#serveMenu[data-tutorial=false] .caaf232{grid-area:1 / 1;align-self:end;padding-bottom:4px;font-size:15px;white-space:nowrap}#serveMenu[data-tutorial=false] .cddc6e2{display:none}#serveMenu[data-tutorial=false] .c19ef5e{grid-area:1 / 2;align-self:end;width:auto;max-width:none;margin-bottom:0;padding-left:10px}#serveMenu[data-tutorial=false] .c4656ce{min-width:76px;padding:5px 12px;font-size:10px}#serveMenu[data-tutorial=false] .c7415e1{grid-area:2 / 1 / 3 / 5;max-width:none;max-height:none;min-height:0;padding:12px 14px 4px}#serveMenu[data-tutorial=false] .cca57d1 :is(button,a){align-self:end;margin-top:0;padding:8px 12px;white-space:nowrap}#serveMenu[data-tutorial=false] #serveResumeBtn{grid-area:1 / 3}#serveMenu[data-tutorial=false] #serveHomeLink{grid-area:1 / 4}}.c59d850{display:grid;gap:6px;margin-top:12px}.c286a53{margin-top:10px;color:#8295a8}.c286a53 summary{cursor:pointer;font:11px var(--mono)}.c286a53 #contact{margin:8px 0}#serveFeedback{position:fixed;bottom:16px;left:50%;transform:translate(-50%);z-index:9;width:min(460px,calc(100vw - 32px));box-sizing:border-box;padding:10px 14px;border:1px solid #243240;border-radius:12px;background:#0c1117eb;backdrop-filter:blur(6px)}#serveFeedback[hidden],#serveKeyboard[hidden]{display:none}#serveFeedback .c962151{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 14px}#serveFeedback .c955908{display:none}#serveFeedback .c5eff32{margin:0}#serveFeedback .c333419{font-size:9px}#serveFeedback .cfcde2b{height:6px}#serveFeedback .c02195b{font-size:10px;text-align:center;margin:9px 0 0;min-height:14px}#serveFeedback .c02195b:empty{display:none}#serveFeedback[data-playback=true] .c02195b{display:none}#serveFeedback[data-playback-mode=demo] :is(#keyA,#keyD,.c7cc4fb){display:none}.c189dd4{display:flex;justify-content:space-between;align-items:center;margin:10px 0 8px;color:#a0b4c4;font:11px var(--mono)}.c189dd4 button{background:transparent;border:1px solid #2e3f50;border-radius:5px;padding:3px 9px;color:var(--ink);font:10px var(--mono);cursor:pointer}.c0ab65e{display:flex;align-items:flex-end;justify-content:center;gap:5px}.cfbcc91{min-width:38px;padding:7px 3px 5px;border:1px solid #344556;border-bottom-width:3px;border-radius:6px;text-align:center;background:#18232f}.cfbcc91 kbd{font:16px var(--mono);color:var(--ink)}.cfbcc91>span{display:block;font:8px var(--sans);color:#8295a8;margin-top:4px}.cfbcc91.cc20dea{background:#ad0;border-color:#c5ed45;color:#172000}.cfbcc91.cc20dea kbd,.cfbcc91.cc20dea>span{color:#172000}.cfbcc91.cd29eae{animation:serve-key-release .7s ease-out}.cfbcc91.cd29eae kbd,.cfbcc91.cd29eae>span{animation:serve-key-release-label .7s ease-out}@keyframes serve-key-release-label{0%{color:#172000}to{color:var(--ink)}}@keyframes serve-key-release{0%{background:#fff;border-color:#fff;box-shadow:0 0 12px #ffffffb3}to{background:#18232f;border-color:#344556;box-shadow:none}}.c7cc4fb{display:grid;grid-template-columns:repeat(3,25px);gap:3px;margin-left:6px}.c7cc4fb .cfbcc91{min-width:0;padding:3px 0;border-bottom-width:2px}.c7cc4fb kbd{font-size:11px}#keyI{grid-column:2}#keyJ{grid-column:1}.c2cc5bf{display:flex;justify-content:center;gap:16px;margin-top:7px;color:#8295a8;font:9px var(--mono)}.c2cc5bf span:before{content:"";display:inline-block;width:6px;height:6px;margin-right:5px;background:var(--amber);border-radius:2px}.c2cc5bf span+span:before{background:#fff}#app{position:absolute;inset:0}canvas{display:block}#panel{position:absolute;top:0;left:0;width:300px;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;padding:13px 14px 20px;background:#0c1117db;border-right:1px solid #1e2a37;backdrop-filter:blur(6px);pointer-events:none;-webkit-user-select:none;user-select:none;scrollbar-width:thin;scrollbar-color:#2a3a4a transparent}#panel .ccdf69b{pointer-events:auto}@media(pointer:fine){#panel{pointer-events:auto}}#panel h1{font-family:var(--sans);font-size:15px;font-weight:700;letter-spacing:.01em;color:var(--amber)}.c955908{font-family:var(--sans);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#55677a;margin:15px 0 7px;padding-bottom:4px;border-bottom:1px solid #18232f}#panel .cddc6e2{color:#6b7d90;margin:9px 0 0;line-height:1.5}.c8fdb32{color:#6b7d90;font-weight:400}.c02195b{color:var(--amber);margin:6px 0 9px;min-height:16px;line-height:1.35}.c941488{display:flex;align-items:stretch;gap:3px}.cf9b11b{align-self:center;color:#3a4a5c;font-size:13px}.cedd85c{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;padding:5px 0 4px;background:#131d27;border:1px solid #253546;border-radius:6px;color:#64798d;transition:background .05s linear,color .05s linear,border-color .05s linear}.cedd85c .c8254c3{font-size:13px;font-weight:700;line-height:1.1}.cedd85c .cacac86{font-size:8.5px;letter-spacing:.04em;text-transform:uppercase}.cedd85c.cc20dea{background:var(--amber);border-color:var(--amber);color:#0b0f14}.cedd85c.cd29eae{animation:key-release-pulse .35s ease-out}@keyframes key-release-pulse{0%{box-shadow:0 0 #aadd00b3}to{box-shadow:0 0 0 8px #ad00}}.c5eff32{margin:6px 0}.c5eff32 .c333419{display:flex;justify-content:space-between;gap:8px;color:#9fb2c4;margin-bottom:3px}.c5eff32 .c02cee3{color:var(--ink);font-variant-numeric:tabular-nums}.c396788{color:#5e7183}.c5eff32.cf9194e .c333419,.c5eff32.cf9194e .c02cee3{color:#5c6e80}.c5eff32.cf9194e .cfcde2b{opacity:.55}.c5eff32 .cfcde2b{position:relative;height:9px;background:#0b0f14;border:1px solid #2a3a4a;border-radius:5px;overflow:hidden;transition:opacity .12s linear}.c5eff32 .cdcd324{position:relative;z-index:1;left:0;top:0;height:100%;width:0%;background:var(--amber);transition:width .03s linear}.c5eff32 .ccbc8a8{position:absolute;inset:-2px 0}.cf6a214{padding:9px 10px 10px;border:1px solid #1e2a37;border-radius:8px;background:#0d141c}.cf6a214 .cae6c79{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.cf6a214 .c2a21fe{font-family:var(--sans);font-size:21px;font-weight:700;letter-spacing:.05em;color:#7d8fa1}.cf6a214 .c2a21fe.c582967{color:#3ddc6f}.cf6a214 .c2a21fe.cf1c562{color:#ff6b6b}.cf6a214 .cbbccb9{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}.cf6a214 .c2be23c{margin-top:2px;color:#ff9a9a}.cf6a214 .c093e7d{margin-top:2px;color:#8fa2b4}.cf6a214 .c093e7d.cb4dc66{color:#ffb648}.cf6a214 .c973801{margin-top:8px;padding-left:8px;border-left:2px solid var(--amber);color:#c3d2e1;line-height:1.45}.cf6a214 .c2be23c:empty,.cf6a214 .c093e7d:empty,.cf6a214 .c973801:empty{display:none}.cf6a214 .cbc51e9{margin-top:9px;display:grid;grid-template-columns:auto 1fr auto;gap:2px 8px;color:#8295a8}.cf6a214 .cbc51e9 .c634768{display:contents}.cf6a214 .cbc51e9 .c81e4a9{text-align:right;color:var(--ink);font-variant-numeric:tabular-nums}.cf6a214 .cbc51e9 .c5a5000{text-align:right;font-size:10px;letter-spacing:.04em;text-transform:uppercase;align-self:center}.c91e1fc{color:#3ddc6f}.cb204e4{color:var(--amber)}.ca5502d{color:#ffb648}.cf173a1{color:#ff6b6b}.cb01e26{color:var(--ink);font-variant-numeric:tabular-nums}.c8d6466{margin:14px 0 0}.c35aad3{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#6b7d90;margin-bottom:5px}.cea42cf{width:max-content}.cea42cf button{min-width:52px;padding:5px 9px;border:0;border-radius:5px;background:transparent;color:#8295a8;font:12px var(--mono);text-align:center;cursor:pointer}.cea42cf button:hover:not(.c968796){color:var(--ink)}.cea42cf button.c968796{background:#c7d2de;color:#18232e;font-weight:600;box-shadow:0 1px 3px #00000040}.cea42cf button:disabled{opacity:.55;cursor:default}#serveMenu .cea42cf button:focus-visible,#serveMenu .cea42cf button.c0fb694{outline:2px solid var(--ink);outline-offset:2px}.c20e792{display:block;width:100%;margin-top:8px;font:inherit;background:#16202b;color:var(--ink);border:1px solid #2a3a4a;border-radius:5px;padding:7px 8px;cursor:pointer}.c20e792:hover:not(:disabled){background:#1d2a37;border-color:#37516b}.c20e792:disabled{opacity:.55;cursor:default}.c48a53f{margin-top:11px;color:#5e6f80;line-height:1.9}.c48a53f kbd{background:#1e2a37;border-radius:3px;padding:0 5px;color:#cfe0f0}.c03f3b4,.c2833f5{display:none}@media(pointer:coarse){html,body{touch-action:none;overscroll-behavior:none}#serveFeedback,#tabTiming,#panel .c962151,.c990d1a .c962151{display:none}#panel.c67de61 .c962151,.c990d1a.c67de61 .c962151{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin-top:6px;max-width:241px}.c990d1a.c67de61 .c962151{margin-right:-40px;margin-left:auto}:is(#panel,.c990d1a).c67de61 .c5eff32{margin:0}:is(#panel,.c990d1a).c67de61 .c5eff32 .c333419{display:none}:is(#panel,.c990d1a).c67de61 .c5eff32 .cfcde2b{height:4px}#panel{top:calc(10px + env(safe-area-inset-top));left:calc(10px + env(safe-area-inset-left));width:min(58vw,216px);padding:8px 10px 10px;border:1px solid #1e2a37;border-radius:12px;font-size:10px;max-height:86dvh;overflow:hidden}#panel:not(.c2fb358){top:calc(8px + env(safe-area-inset-top));left:auto;right:calc(8px + env(safe-area-inset-right))}#panel.c2fb358{top:calc(46px + env(safe-area-inset-top));width:min(44vw,170px)}body:has(.c990d1a[data-collapsed=false]) #panel.c2fb358{top:var(--tutorial-mobile-panel-top, 150px)}#panel.c2fb358 .c286a53{display:none}#serveToolbar{top:calc(8px + env(safe-area-inset-top));left:calc(8px + env(safe-area-inset-left));right:auto;display:flex;gap:5px}#serveToolbar button{padding:5px 8px}#serveToolbar #serveMenuBtn{font-size:0;gap:0}#serveToolbar #serveMuteBtn{display:flex}#panel .c4598d8,.c03f3b4{text-align:center}#panel h1{font-size:12px}#panel .cddc6e2{margin:6px 0 0}.c02195b{margin:5px 0 0}.c955908{margin:0 0 5px;font-size:9px;letter-spacing:.08em}.c962151>.c955908,.c1b285c>.c955908{display:none}#panel .c59d67e,#panel .c962151,#panel .c1b285c{display:none}#panel[data-tab=main] .c59d67e,#panel[data-tab=timing] .c962151,#panel[data-tab=results] .c1b285c{display:block;margin-top:7px}.c2833f5{display:flex;gap:4px;margin:5px 0 0}.ca3b325{flex:1;font:inherit;font-size:10px;padding:6px 4px;background:#16202b;color:#8295a8;border:1px solid #2a3a4a;border-radius:6px;cursor:pointer}.ca3b325.c968796{background:var(--amber);border-color:var(--amber);color:#0b0f14;font-weight:700}.c1fcd20,.c941488,.c48a53f,.c396788{display:none}.c03f3b4{display:block}.c03f3b4 b{color:var(--amber);font-weight:400}#panel .c8d6466{margin:10px 0 0;text-align:left}.c20e792{padding:8px 6px;font-size:11px}.c5eff32{margin:4px 0}.cf6a214{padding:7px 8px}.cf6a214 .c2a21fe{font-size:16px}.cf6a214 .cbc51e9{margin-top:6px;font-size:9px;gap:1px 6px}.cf6a214 .cbc51e9 .c5a5000{font-size:8.5px}.cf6a214 .c973801{margin-top:6px;line-height:1.4}body .c4f52a7{top:calc(114px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right))}}@media(pointer:coarse)and (orientation:portrait){#serveMenu[data-tutorial=false] .cca57d1{display:flex;width:min(100%,560px);gap:10px}#serveMenu[data-tutorial=false] .cca57d1 :is(button,a){flex:1;min-width:0;margin-top:0;padding:10px 8px}#panel{max-height:46dvh}body .cdc2549{bottom:calc(14px + env(safe-area-inset-bottom));left:calc(8px + env(safe-area-inset-left))}body .c4f52a7{top:calc(8px + env(safe-area-inset-top));right:calc(10px + env(safe-area-inset-right))}}@media(pointer:coarse)and (orientation:landscape){body .cdc2549{top:auto!important;right:auto;bottom:calc(14px + env(safe-area-inset-bottom));left:calc(14px + env(safe-area-inset-left))}#panel:not(.c2fb358){max-height:calc(100dvh - 92px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;pointer-events:auto;touch-action:pan-y}#panel.c2fb358{top:calc(46px + env(safe-area-inset-top));left:calc(10px + env(safe-area-inset-left));right:auto;width:min(44vw,216px);max-height:calc(100dvh - 140px - env(safe-area-inset-bottom));overflow-y:auto}body:has(.c990d1a[data-lesson=serving][data-collapsed=false]) #panel.c2fb358{top:calc(46px + env(safe-area-inset-top))}body:has(.c990d1a[data-lesson=serving]) #panel.c2fb358 .c59d850{gap:3px;margin-top:6px}body:has(.c990d1a[data-lesson=serving]) #panel.c2fb358 .c59d850 .c20e792{padding:5px 6px;line-height:1.2}#panel .c59d67e>.c955908,#panel .cb01e26{display:none}#panel:has(.c286a53[open]){z-index:16;pointer-events:auto;max-height:calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}body:has(.c990d1a[data-lesson=serving]) #panel.c2fb358 .cf6a214 .c2be23c,body:has(.c990d1a[data-lesson=serving]) #panel.c2fb358 .cf6a214 .c973801{font-size:9px;line-height:1.3}}@media(pointer:coarse)and (orientation:portrait)and (max-height:740px){.c03f3b4{display:none}}@media(pointer:fine){#panel{top:60px;left:14px;width:230px;max-height:calc(100dvh - 74px);padding:14px;box-sizing:border-box;border:1px solid #243240;border-radius:12px}#panel{background:#0c1117eb}#panel .c955908{margin-top:10px}#panel .c1b285c>.c955908{display:none}#panel .c20e792{margin:0;padding:8px 10px}#panel .cf6a214 .c2a21fe{font-size:24px}#panel .cf6a214 .cbbccb9{font-size:12px}#panel .c973801{font-size:11px}}