:root{--deck:#1e2c35;--deck-raised:#26363f;--deck-hover:#2d3e48;--ink:#dfe6e8;--ink-soft:#9fb1b8;--accent:#8fbac6;--accent-ink:#15232b;--hairline:#ffffff14;--water:#4f8799;--lane:#ffffff12;--line-2m:#cf8f86;--line-5m:#d3bf80;--line-half:#e6ecee99;--goal:#eef1ef;--cap-white:#f1eee6;--cap-white-ink:#2f4656;--cap-blue:#2c475e;--cap-blue-ink:#e7edf0;--cap-goalie:#c06a60;--cap-goalie-ink:#fbf5f2;--cap-edge:#13202840;--ball:#e6cd78;--ball-ink:#8a7536;--ball-shadow:#10202a;--move:#f1eee6;--pass:#e6cd78;--wake-w:#f4f1ea;--wake-b:#a9c9d8;--ripple:#e9f2f4;--ease-out:cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box}[hidden]{display:none!important}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background:var(--deck);height:100dvh;color:var(--ink);-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;touch-action:manipulation;-webkit-text-size-adjust:100%;-webkit-user-select:none;user-select:none;grid-template-rows:auto minmax(0,1fr) auto;margin:0;font-family:system-ui,Segoe UI,Roboto,Noto Sans Hebrew,Arial,sans-serif;display:grid;overflow:hidden}::selection{background:var(--accent);color:var(--accent-ink)}.topbar,.timeline{padding:10px max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left));flex-wrap:wrap;align-items:center;gap:10px 14px;display:flex}.topbar{border-bottom:1px solid var(--hairline);padding-top:max(10px, env(safe-area-inset-top));justify-content:space-between}.timeline{border-top:1px solid var(--hairline);padding-bottom:max(10px, env(safe-area-inset-bottom))}h1{margin:0;font-size:1.1rem;font-weight:600}.toolbar{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.group{background:var(--deck-raised);border-radius:12px;gap:2px;padding:3px;display:flex}.group.plain{background:0 0;gap:6px;padding:0}button{font:inherit;background:var(--deck-raised);min-width:48px;min-height:48px;color:var(--ink);cursor:pointer;border:0;border-radius:9px;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-size:.95rem;transition:background-color .16s ease-out,color .16s ease-out,transform .12s ease-out,opacity .2s ease-out;display:inline-flex}.group button{color:var(--ink-soft);background:0 0}button:hover{background:var(--deck-hover);color:var(--ink)}button:active{transform:scale(.96)}button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink);font-weight:600}button:disabled{opacity:.38;cursor:default;background:var(--deck-raised);transform:none}.group button:disabled{background:0 0}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.quiet{color:var(--ink-soft);background:0 0}button.primary{background:var(--accent);color:var(--accent-ink);padding-inline:18px 20px;font-weight:600}button.primary:hover{color:var(--accent-ink);background:#a2c7d1}.icon{fill:currentColor;flex:none;width:18px;height:18px}#play .icon-pause,#play.is-playing .icon-play{display:none}#play.is-playing .icon-pause{display:block}.steps-wrap{flex:1;align-items:center;gap:10px;min-width:0;display:flex}.steps-title{color:var(--ink-soft);font-size:.9rem}.steps{scrollbar-width:none;gap:6px;padding:2px;display:flex;overflow-x:auto}.steps::-webkit-scrollbar{display:none}.step-chip{font-variant-numeric:tabular-nums;min-width:48px;color:var(--ink-soft)}.step-chip[aria-current=step]{background:var(--accent);color:var(--accent-ink);font-weight:600}body.is-playing .topbar .toolbar,body.is-playing #add-step,body.is-playing #delete-step{opacity:.35;pointer-events:none}body.is-playing .step-chip{pointer-events:none}.stage{min-height:0;padding:8px 12px}#board{touch-action:none;width:100%;height:100%;display:block}.water{fill:var(--water)}.lane{stroke:var(--lane);stroke-width:.06px}.mark{stroke-width:.1px;stroke-dasharray:.5 .42}.line-2m{stroke:var(--line-2m)}.line-5m{stroke:var(--line-5m)}.line-half{stroke:var(--line-half)}.goal{fill:none;stroke:var(--goal);stroke-width:.16px;stroke-linejoin:round}.piece{cursor:grab}.piece .hit{fill:#0000}.piece .cap{stroke:var(--cap-edge);stroke-width:.07px;transition:r .16s var(--ease-out)}.piece text{pointer-events:none;font-size:.72px;font-weight:600}.team-w .cap{fill:var(--cap-white)}.team-w text{fill:var(--cap-white-ink)}.team-b .cap{fill:var(--cap-blue)}.team-b text{fill:var(--cap-blue-ink)}.goalie .cap{fill:var(--cap-goalie)}.goalie text{fill:var(--cap-goalie-ink)}.piece.dragging{cursor:grabbing}.piece.dragging .cap{r:.78px}.ball-body{fill:var(--ball);stroke:var(--ball-ink);stroke-width:.06px}.ball-seam{fill:none;stroke:var(--ball-ink);stroke-width:.05px;opacity:.7}.ball-shadow{fill:var(--ball-shadow)}.drawing{stroke-width:.14px;stroke-linecap:round;fill:none}.drawing.move{stroke:var(--move)}.drawing.pass{stroke:var(--pass);stroke-dasharray:.34 .3}.head.move{fill:var(--move)}.head.pass{fill:var(--pass)}.wake{stroke-width:1.05px;stroke-linecap:round;fill:none}.wake-grad.team-w stop{stop-color:var(--wake-w)}.wake-grad.team-b stop{stop-color:var(--wake-b)}.wake-grad.ball stop{stop-color:var(--ball)}.wake-tail{stop-opacity:0}.wake-head{stop-opacity:.32}.wake.ball{stroke-width:.22px}.ripple{fill:none;stroke:var(--ripple);stroke-width:.07px}@media (width<=900px){h1{display:none}.topbar{justify-content:center}button{padding:0 12px}}body.tool-numbers .piece:not(.ball){cursor:pointer}body.tool-numbers .piece.ball{opacity:.4}.piece .cap{transform-box:fill-box;transform-origin:50%}.cap-picker{z-index:15;background:var(--deck-raised);border:1px solid var(--hairline);border-radius:16px;width:272px;padding:12px;position:fixed;box-shadow:0 14px 40px #0008}.cap-picker-title{color:var(--ink-soft);margin:0 4px 10px;font-size:.9rem}.cap-grid{grid-template-columns:repeat(5,1fr);gap:6px;display:grid}.cap-num{aspect-ratio:1;font-variant-numeric:tabular-nums;background:var(--deck);border-radius:50%;min-width:0;min-height:46px;padding:0;font-weight:600}.cap-num.taken{color:var(--ink-soft);border:1px dashed var(--hairline);background:0 0}.cap-num[aria-pressed=true]{background:var(--accent);color:var(--accent-ink);border:0}:root{--accent-soft:#8fbac633;--danger:#d9958c;--scrim:#0d171db3}.title{align-items:center;gap:12px;min-width:0;display:flex}.title:has(.play-name:not([hidden])) h1{display:none}.play-name{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;max-width:34ch;font-size:1.05rem;font-weight:600;overflow:hidden}.play-name.dirty:after{content:" ●";color:var(--line-5m);vertical-align:middle;font-size:.7em}.library-btn{font-weight:600}.scrim{background:var(--scrim);opacity:0;z-index:10;transition:opacity .26s ease-out;position:fixed;inset:0}.scrim.open{opacity:1}.drawer{width:min(440px,94vw);padding:max(16px, env(safe-area-inset-top)) 18px max(16px, env(safe-area-inset-bottom));background:var(--deck);border-inline-end:1px solid var(--hairline);transition:transform .3s var(--ease-out);z-index:11;-webkit-user-select:text;user-select:text;flex-direction:column;gap:14px;display:flex;position:fixed;inset-block:0;inset-inline-start:0;transform:translate(104%);box-shadow:-12px 0 40px #0006}.drawer.open{transform:none}.drawer-head{justify-content:space-between;align-items:center;display:flex}.drawer h2{margin:0;font-size:1.15rem;font-weight:600}.save-form{background:var(--deck-raised);border-radius:14px;gap:10px;padding:14px;display:grid}.field{gap:6px;display:grid}.field>span{color:var(--ink-soft);font-size:.9rem}input[type=search],.field input,.rename{font:inherit;border:1px solid var(--hairline);background:var(--deck);width:100%;min-height:48px;color:var(--ink);caret-color:var(--accent);border-radius:10px;padding:0 14px}input::placeholder{color:#9fb1b8b3}input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.shake{animation:shake .36s var(--ease-out)}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.save-actions{flex-wrap:wrap;gap:8px;display:flex}.save-form .save-actions button:not(.primary){background:var(--deck)}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{background:var(--deck);min-height:40px;color:var(--ink-soft);border:1px solid var(--hairline);border-radius:999px;padding:0 12px;font-size:.88rem}.lib-tools .chip{background:0 0}.chip[aria-pressed=true]{background:var(--accent-soft);color:var(--ink);border-color:var(--accent);font-weight:400}.lib-tools{gap:10px;display:grid}.lib-tools .chips{scrollbar-width:none;flex-wrap:nowrap;padding-block:2px;overflow-x:auto}.lib-tools .chips::-webkit-scrollbar{display:none}.lib-tools .chip{flex:none}.show-save{color:var(--ink);justify-content:flex-start}.lib-list{scrollbar-width:thin;scrollbar-color:var(--deck-hover) transparent;flex:1;align-content:start;gap:8px;min-height:0;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.card{border:1px solid #0000;border-radius:14px;grid-template-columns:1fr auto auto;align-items:center;gap:6px;padding:6px;display:grid}.card.current{border-color:var(--accent-soft)}.card-open{text-align:start;background:0 0;justify-content:flex-start;gap:12px;min-width:0;min-height:72px;padding:6px}.thumb{flex:none;place-items:center;width:92px;height:68px;display:grid}.thumb svg{width:100%;height:100%}.meta{gap:4px;min-width:0;display:grid}.meta strong{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-weight:600;line-height:1.3;display:-webkit-box;overflow:hidden}.meta .sub{color:var(--ink-soft);text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;overflow:hidden}.rename{min-height:40px}.card-play{border-radius:50%;width:52px;min-width:52px;height:52px;padding:0}.card-play .icon{width:20px;height:20px;margin-inline-start:2px}.card-more{width:44px;padding:0}.card-actions{grid-column:1/-1;gap:6px;padding:0 6px 4px;display:flex}.card-actions button{min-height:44px;font-size:.9rem}.card-actions .danger{color:var(--danger)}.thumb-cap{stroke:var(--cap-edge);stroke-width:.12px}.thumb-cap.team-w{fill:var(--cap-white)}.thumb-cap.team-b{fill:var(--cap-blue)}.thumb-cap.goalie{fill:var(--cap-goalie)}.thumb-cap.excluded{opacity:.45}.thumb-ball{fill:var(--ball)}.thumb .drawing{stroke-width:.3px}.thumb .mark{stroke-width:.18px;stroke-dasharray:.8 .6}.thumb .goal{stroke-width:.3px}.empty{color:var(--ink-soft);margin:8px 4px;line-height:1.5}.drawer-foot{border-top:1px solid var(--hairline);gap:6px;padding-top:10px;display:flex}.toast{inset-inline:0;padding:6px;background:var(--ink);width:max-content;max-width:calc(100vw - 32px);color:var(--accent-ink);opacity:0;transition:opacity .22s ease-out, transform .26s var(--ease-out);z-index:20;border-radius:14px;align-items:center;gap:14px;margin-inline:auto;padding-inline-start:18px;display:flex;position:fixed;bottom:96px;transform:translateY(12px);box-shadow:0 10px 30px #0007}.toast.show{opacity:1;transform:none}.toast-text{padding-block:12px}.toast-action{color:#2f6274;background:0 0;font-weight:600}.toast-action:hover{color:#2f6274;background:#2f627418}@media (prefers-reduced-motion:reduce){.drawer,.scrim,.toast{transition:none}}.video-dialog{z-index:30;background:var(--scrim);place-items:center;padding:16px;display:grid;position:fixed;inset:0}.video-card{background:var(--deck-raised);border-radius:18px;gap:14px;width:min(560px,100%);padding:22px;display:grid;box-shadow:0 20px 60px #000a}.video-card h2{margin:0;font-size:1.2rem;font-weight:600}.video-sub{color:var(--ink-soft);overflow-wrap:anywhere;margin:-6px 0 0}.video-progress{background:var(--deck);border-radius:99px;height:8px;overflow:hidden}.video-bar{background:var(--accent);transform-origin:100%;height:100%;transition:transform .12s linear;transform:scaleX(0)}.video-preview{aspect-ratio:16/9;background:var(--deck);border-radius:12px;width:100%}.video-actions{flex-wrap:wrap;gap:8px;display:flex}.video-actions .primary{min-width:120px}[dir=ltr] .drawer{transform:translate(-104%);box-shadow:12px 0 40px #0006}[dir=ltr] .drawer.open{transform:none}[dir=ltr] .video-bar{transform-origin:0}.group.lang button{letter-spacing:.02em;min-width:44px;padding:0 10px;font-size:.85rem}.title .group.lang{margin-inline-start:4px}
