:root{--bg:#e8eeeb;--surface:#fff;--ink:#15211c;--muted:#56665f;--line:#c9d5d0;--mat:#2e6a52;--mat-edge:#1f4d3a;--court-line:#f3f8f5;--side:#d9e4df;--side-ink:#4a5d55;--you:#f2b134;--opp:#e4585d;--best:#178c61;--good:#2f6fc6;--inacc:#b07a0e;--mistake:#c93a42;--accent:#2e6a52;--on-accent:#fff;--m-best:#8ff5c3;--m-good:#a6ccff;--m-inacc:#ffd166;--m-mistake:#ff8e93;--m-neutral:#f3f8f5bf;--f-display:"Barlow Condensed","Arial Narrow",sans-serif;--f-body:"Barlow",system-ui,-apple-system,sans-serif}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0d1412;--surface:#16201c;--ink:#e5ede9;--muted:#98a9a1;--line:#2a3832;--mat:#25573f;--mat-edge:#173a2a;--court-line:#e9f1ed;--side:#1b2722;--side-ink:#9db1a8;--you:#f5bc4a;--opp:#ee6a6f;--best:#3cc08c;--good:#6aa4f0;--inacc:#e6ac3a;--mistake:#ee6b74;--accent:#62c495;--on-accent:#0d1412;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#0d1412;--surface:#16201c;--ink:#e5ede9;--muted:#98a9a1;--line:#2a3832;--mat:#25573f;--mat-edge:#173a2a;--court-line:#e9f1ed;--side:#1b2722;--side-ink:#9db1a8;--you:#f5bc4a;--opp:#ee6a6f;--best:#3cc08c;--good:#6aa4f0;--inacc:#e6ac3a;--mistake:#ee6b74;--accent:#62c495;--on-accent:#0d1412;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html{box-sizing:border-box;background:var(--bg);height:100%}body{background:var(--bg);height:100%;color:var(--ink);font:15px/1.45 var(--f-body)}*,:before,:after{box-sizing:border-box}.app{flex-direction:column;gap:8px;max-width:1000px;height:100%;margin:0 auto;padding-block:8px;padding-inline:16px;display:flex}.top{flex:none;justify-content:space-between;align-items:center;gap:10px;display:flex}.brand{white-space:nowrap;text-overflow:ellipsis;min-width:0;font:700 20px/1 var(--f-display);letter-spacing:.02em;text-transform:uppercase;overflow:hidden}.brand small{font:600 11px/1.1 var(--f-body);letter-spacing:.16em;color:var(--muted);display:block}.stats{align-items:stretch;gap:6px;display:flex}.lang{font:700 13px var(--f-body);letter-spacing:.04em;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;border-radius:8px;padding:0 9px}.lang:focus-visible{outline:3px solid var(--good);outline-offset:2px}.stat{background:var(--surface);border:1px solid var(--line);border-radius:8px;flex-direction:column;justify-content:center;align-items:center;min-width:56px;padding:3px 10px;display:flex}.stat b{font:700 18px/1 var(--f-display);font-variant-numeric:tabular-nums}.stat small{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:9px;line-height:1.2}.delta-up{color:var(--best)}.delta-down{color:var(--mistake)}.dots{flex:none;gap:5px;padding:2px;display:flex;overflow-x:auto}.dot{border:2px solid var(--line);background:var(--surface);width:28px;height:28px;color:var(--muted);font:600 14px var(--f-display);cursor:pointer;border-radius:50%;flex:none;padding:0}.dot.cur{border-color:var(--ink);color:var(--ink)}.dot.r-best{background:var(--best);border-color:var(--best);color:#fff}.dot.r-good{background:var(--good);border-color:var(--good);color:#fff}.dot.r-inacc{background:var(--inacc);border-color:var(--inacc);color:#fff}.dot.r-mistake{background:var(--mistake);border-color:var(--mistake);color:#fff}.dot.cur.r-best,.dot.cur.r-good,.dot.cur.r-inacc,.dot.cur.r-mistake{outline:2px solid var(--ink);outline-offset:1px}.main{flex-direction:column;flex:1;gap:8px;min-height:0;display:flex}.board{flex-direction:column;flex:1 1 0;gap:4px;min-height:0;display:flex}.legend{color:var(--muted);flex:none;justify-content:space-between;align-items:center;gap:10px;font-size:12px;display:flex}.legend .keys{flex-wrap:wrap;gap:10px;display:flex}.legend i{vertical-align:-1px;border-radius:50%;width:10px;height:10px;margin-right:4px;display:inline-block}.replay{font:600 13px var(--f-body);color:var(--ink);background:var(--surface);border:1px solid var(--line);cursor:pointer;border-radius:999px;flex:none;padding:4px 10px}#svg{touch-action:none;-webkit-user-select:none;user-select:none;flex:1 1 0;width:100%;height:100%;min-height:0;display:block}.panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;flex-direction:column;flex:none;gap:8px;min-width:0;max-height:42%;padding:10px 12px;display:flex;overflow-y:auto}@media (width>=760px){.main{flex-direction:row}.panel{gap:12px;width:380px;max-height:100%;padding:16px}}.head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;display:flex}h2{font:700 22px/1.05 var(--f-display);text-wrap:balance;margin:0}.meta{color:var(--muted);white-space:nowrap;font-size:12px}.q{margin:0;font-size:15px}.q .step{font:600 11px var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:6px}.opts{grid-template-columns:1fr 1fr;gap:6px;display:grid}.opt{text-align:left;width:100%;font:500 14px/1.25 var(--f-body);color:var(--ink);background:var(--bg);cursor:pointer;border:2px solid #0000;border-radius:9px;align-items:center;gap:8px;min-width:0;padding:7px 8px;display:flex}.opt .k{background:var(--mat);color:#fff;width:24px;height:24px;font:700 14px var(--f-display);border-radius:50%;flex:none;place-items:center;display:grid}.opt .lbl{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.g{font:600 10px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:#fff;border-radius:4px;align-self:flex-start;padding:2px 5px}.opt.sel{border-color:var(--ink)}.opt.view{background:var(--surface);border-color:var(--line)}.g-best{background:var(--best)}.g-good{background:var(--good)}.g-inacc{background:var(--inacc)}.g-mistake{background:var(--mistake)}.pick{flex-wrap:wrap;gap:6px;display:flex}.chip{font:600 14px var(--f-body);color:var(--ink);background:var(--bg);cursor:pointer;border:2px solid #0000;border-radius:999px;align-items:center;gap:6px;padding:5px 12px;display:inline-flex}.chip.on{border-color:var(--ink);background:var(--surface)}.chip i{background:var(--you);border-radius:50%;width:10px;height:10px}.per{flex-wrap:wrap;align-items:baseline;gap:6px;font-size:14px;display:flex}.hint{color:var(--muted);margin:0;font-size:13px}.verdict{background:var(--bg);border-radius:9px;flex-direction:column;gap:5px;padding:8px 10px;font-size:14px;display:flex}.verdict .badge{font:700 15px/1 var(--f-display);letter-spacing:.04em;text-transform:uppercase;color:#fff;border-radius:5px;align-self:flex-start;padding:5px 8px}.verdict p{margin:0}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.stick{background:var(--surface);margin-top:-2px;padding-block:6px 2px;position:sticky;bottom:-10px}.btn{font:600 15px var(--f-body);cursor:pointer;border:2px solid var(--accent);background:var(--accent);color:var(--on-accent);border-radius:9px;padding:9px 16px}.btn.ghost{color:var(--ink);border-color:var(--line);background:0 0}.btn:disabled{opacity:.4;cursor:default}.btn:focus-visible,.opt:focus-visible,.dot:focus-visible,.chip:focus-visible,.replay:focus-visible{outline:3px solid var(--good);outline-offset:2px}.lesson{border-left:4px solid var(--accent);padding:2px 0 2px 10px;font-size:15px;font-weight:500}.score{font:700 36px/1 var(--f-display);font-variant-numeric:tabular-nums}.small{color:var(--muted);margin:0;font-size:12px}#three{touch-action:none;border-radius:12px;flex:1 1 0;min-height:0;position:relative;overflow:hidden}#three canvas{width:100%;height:100%;display:block}.hint3{color:#fff;pointer-events:none;background:#00000080;border-radius:999px;padding:3px 9px;font-size:11px;position:absolute;bottom:8px;left:8px}.load3{color:var(--muted);place-items:center;font-size:14px;display:grid;position:absolute;inset:0}.ctrls{flex:none;align-items:center;gap:6px;display:flex}.seg{border:1px solid var(--line);background:var(--surface);border-radius:999px;display:inline-flex;overflow:hidden}.seg button{font:600 13px var(--f-body);color:var(--muted);cursor:pointer;background:0 0;border:0;padding:4px 11px}.seg button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.seg button:focus-visible{outline:3px solid var(--good);outline-offset:-3px}.home{flex-direction:column;flex:1;gap:14px;min-height:0;padding-bottom:16px;display:flex;overflow-y:auto}.hero{background:var(--mat);color:#f3f8f5;border-radius:16px;flex-direction:column;gap:12px;padding:18px;display:flex}.hero .eyebrow{font:600 12px var(--f-body);letter-spacing:.12em;text-transform:uppercase;opacity:.8}.hero h1{font:700 32px/1 var(--f-display);text-wrap:balance;margin:0}.hero p{opacity:.92;margin:0}.sqs{gap:8px;display:flex}.sq{background:#ffffff24;border:2px solid #ffffff59;border-radius:8px;width:38px;height:38px}.hero .sq.r-best{background:var(--m-best);border-color:var(--m-best)}.hero .sq.r-good{background:var(--m-good);border-color:var(--m-good)}.hero .sq.r-inacc{background:var(--m-inacc);border-color:var(--m-inacc)}.hero .sq.r-mistake{background:var(--m-mistake);border-color:var(--m-mistake)}.btn.light{color:#173a2a;background:#f3f8f5;border-color:#f3f8f5;align-self:flex-start;padding:12px 24px;font-size:17px}.bigscore{font:700 44px/1 var(--f-display);font-variant-numeric:tabular-nums}.cd{opacity:.85;font-size:13px}.sharebox{width:100%;min-height:96px;font:14px/1.4 var(--f-body);color:#f3f8f5;background:#00000040;border:1px solid #fff6;border-radius:8px;padding:8px}.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;flex-direction:column;gap:10px;padding:14px;display:flex}.card h3{font:700 22px/1.1 var(--f-display);margin:0}.lrow{align-items:flex-start;gap:10px;font-size:14px;display:flex}.lrow b{font-size:15px;display:block}.lrow .sq{border:0;border-radius:4px;flex:none;width:16px;height:16px;margin-top:3px}.card .sq.r-best{background:var(--best)}.card .sq.r-good{background:var(--good)}.card .sq.r-inacc{background:var(--inacc)}.card .sq.r-mistake{background:var(--mistake)}.filters{flex-wrap:wrap;gap:6px;display:flex}.plist{flex-direction:column;gap:6px;display:flex}.prow{text-align:left;background:var(--bg);cursor:pointer;width:100%;color:var(--ink);font:600 15px var(--f-body);border:0;border-radius:10px;align-items:center;gap:10px;padding:10px 12px;display:flex}.prow .pt{flex:1;min-width:0}.prow small{color:var(--muted);font-size:12px;font-weight:500;display:block}.prow:focus-visible{outline:3px solid var(--good);outline-offset:2px}.g-new{background:var(--muted)}.playbar{flex:none;align-items:center;gap:8px;min-width:0;display:flex}.playbar .dots{flex:1;gap:4px;min-width:0}.playbar .dot{width:26px;height:26px;font-size:13px}.playbar{gap:6px}.playbar .backbtn{min-width:36px;padding:4px 0;font-size:17px;line-height:1.2}.backbtn{font:600 14px var(--f-body);border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;border-radius:999px;flex:none;padding:4px 12px}.backbtn:focus-visible{outline:3px solid var(--good);outline-offset:2px}.pmode{font:600 12px var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.dot[disabled]{cursor:default}.toast{left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);z-index:50;text-align:center;border-radius:999px;max-width:90vw;padding:10px 16px;font-size:14px;position:fixed;transform:translate(-50%)}.plabel{font:600 12px var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.levels{gap:6px;display:grid}.lvl{text-align:left;background:var(--bg);color:var(--ink);cursor:pointer;font:600 15px var(--f-body);border:2px solid #0000;border-radius:10px;flex-direction:column;gap:2px;padding:10px 12px;display:flex}.lvl span{color:var(--muted);font-size:13px;font-weight:400}.lvl.on{border-color:var(--ink);background:var(--surface)}.lvl:focus-visible{outline:3px solid var(--good);outline-offset:2px}.chip[disabled]{opacity:.5;cursor:default}.prefline{font-size:14px}.linkbtn{color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.alley{fill:#000;opacity:.22}.eb{font:600 11px/1.35 var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.panel .badge{font:700 15px/1 var(--f-display);letter-spacing:.04em;text-transform:uppercase;color:#fff;border-radius:5px;align-self:flex-start;padding:5px 8px}.ochips{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.ochip{width:34px;height:34px;font:700 15px var(--f-display);color:#16201c;cursor:pointer;border:2px solid #0000;border-radius:50%;padding:0}.ochip.on{border-color:var(--ink)}.ochip:focus-visible{outline:3px solid var(--good);outline-offset:2px}.home.center{justify-content:center}.hero-big{gap:16px;padding:28px 22px}.hero-big h1{font-size:40px}.btn.big{border-radius:12px;align-self:stretch;padding:16px 24px;font-size:19px}.linkrow{color:var(--ink);font:600 15px var(--f-body);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;align-self:center;padding:12px;text-decoration:underline}.linkrow:focus-visible{outline:3px solid var(--good);outline-offset:2px}details.lessons summary{font:700 20px/1.1 var(--f-display);cursor:pointer}details.lessons[open] summary{margin-bottom:6px}.term{font:inherit;color:inherit;text-underline-offset:3px;cursor:help;background:0 0;border:0;margin:0;padding:0;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;text-decoration-thickness:1.5px;display:inline}.term:focus-visible{outline:2px solid var(--good);outline-offset:1px}.sheet{z-index:60;background:#0006;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet-card{background:var(--surface);color:var(--ink);width:100%;max-width:560px;padding:20px 18px calc(18px + env(safe-area-inset-bottom,0px));border-radius:16px 16px 0 0;flex-direction:column;gap:12px;max-height:75%;display:flex;overflow-y:auto}.sheet-card h3{font:700 24px/1.1 var(--f-display);margin:0}.sheet-card p{margin:0}.sheet-card .plabel{margin-top:6px}.sheet-card .btn{align-self:stretch}.gl-list{flex-direction:column;gap:10px;font-size:14px;display:flex}.gl-item b{font-size:15px;display:block}.helpbtn{min-width:32px;margin-left:auto;font-weight:700}.setbtn{min-width:32px;font-size:16px}.links{flex-wrap:wrap;justify-content:center;gap:4px;display:flex}.bestbox{border-top:1px solid var(--line);flex-direction:column;gap:5px;margin-top:4px;padding-top:8px;display:flex}.clist{flex-direction:column;gap:8px;display:flex}.ccard{text-align:left;background:var(--bg);cursor:pointer;color:var(--ink);font:inherit;border:0;border-radius:12px;flex-direction:column;gap:8px;padding:12px 14px;display:flex}.ccard b{font:700 19px/1.1 var(--f-display)}.ccard:focus-visible{outline:3px solid var(--good);outline-offset:2px}.pbar{background:var(--line);border-radius:3px;height:6px;display:block;overflow:hidden}.pbar i{background:var(--accent);height:100%;display:block}.mini{gap:4px;margin-top:4px;display:inline-flex}.mini span{background:var(--line);border-radius:3px;width:12px;height:12px}.mini .r-best{background:var(--best)}.mini .r-good{background:var(--good)}.mini .r-inacc{background:var(--inacc)}.mini .r-mistake{background:var(--mistake)}.legend .lh{font-size:11px;font-style:italic}.legend .keys{gap:4px 9px}.codebox{font:700 40px/1 var(--f-display);letter-spacing:.12em;text-align:center;background:var(--bg);font-variant-numeric:tabular-nums;-webkit-user-select:all;user-select:all;border-radius:12px;padding:14px}.linkline{word-break:break-all;-webkit-user-select:all;user-select:all}.sharebox.dark{background:var(--bg);color:var(--ink);border-color:var(--line)}.codeform{flex-direction:column;gap:6px;display:flex}#codein{min-width:0;font:700 18px var(--f-display);letter-spacing:.12em;text-transform:uppercase;border:2px solid var(--line);background:var(--surface);color:var(--ink);border-radius:9px;flex:1;padding:9px 12px}#codein:focus-visible{outline:3px solid var(--good);outline-offset:1px}.ebrow{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.sharelink{font:600 12px/1.35 var(--f-body);color:var(--muted);cursor:pointer;text-underline-offset:2px;background:0 0;border:0;flex:none;padding:0 0 0 4px;text-decoration:underline}.sharelink:focus-visible{outline:2px solid var(--good)}.ebacts{flex:none;gap:10px;display:flex}.repc{width:100%;font:15px/1.4 var(--f-body);border:2px solid var(--line);background:var(--surface);color:var(--ink);resize:vertical;border-radius:9px;padding:8px 10px}.repc:focus-visible{outline:3px solid var(--good);outline-offset:1px}a.btn{align-items:center;text-decoration:none;display:inline-flex}.tok.ideal circle{fill:var(--court-line);stroke:var(--mat-edge);stroke-width:4px}.tok.ideal text{fill:#16201c}.corr-line{stroke:var(--court-line);stroke-width:4px;stroke-dasharray:6 8;stroke-linecap:round;opacity:.9}.mat{fill:var(--mat)}.cl{stroke:var(--court-line);stroke-width:5px;fill:none}.net{stroke:var(--court-line);stroke-width:9px}.myhalf{fill:var(--court-line);opacity:0}.myhalf.on{opacity:.07}.tok circle{stroke:var(--mat-edge);stroke-width:4px}.tok.y circle{fill:var(--you)}.tok.o circle{fill:var(--opp)}.tok text{font:700 50px var(--f-display);fill:#1a1a1a}.tok.o text{fill:#fff}.tok.faded{opacity:.35}.tok.faded circle{stroke-dasharray:7 6}.tok.ghost circle{fill:none;stroke:var(--court-line);stroke-width:4px;stroke-dasharray:8 6}.tok.ghost text{fill:var(--court-line)}.zone-good{fill:none;stroke:var(--court-line);stroke-width:3px;stroke-dasharray:10 8;opacity:.8}.zone-best{fill:var(--court-line);fill-opacity:.2;stroke:var(--court-line);stroke-width:3px}.ring{fill:none;stroke:var(--you);stroke-width:5px}.trail{fill:none;stroke:var(--court-line);stroke-width:3px;stroke-dasharray:3 10;stroke-linecap:round;opacity:.7}.side-bg{fill:var(--side)}.side-grid{stroke:var(--side-ink);stroke-width:1.5px;opacity:.35;stroke-dasharray:4 8}.side-txt{font:600 28px var(--f-display);fill:var(--side-ink);letter-spacing:.04em}.side-net{stroke:var(--side-ink);stroke-width:7px}.side-trail{fill:none;stroke:var(--side-ink);stroke-width:3px;stroke-dasharray:3 9;stroke-linecap:round}.side-sh{fill:var(--ink)}.lbl-half{font:600 22px var(--f-display);letter-spacing:.14em;fill:var(--muted)}.arrow{stroke-width:6px;fill:none;stroke-linecap:round}.arrow.n{stroke:var(--m-neutral);stroke-dasharray:12 10}.tgt circle{stroke:var(--mat-edge);stroke-width:3px}.tgt text{font:700 26px var(--f-display);fill:#16201c}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}