:root{--ink:#17211d;--muted:#718078;--paper:#f5f3ed;--line:#dbded8;--orange:#f05a31;--blue:#173f8f;--grass:#6eaa66}*{box-sizing:border-box}html,body{overscroll-behavior:none;height:100%;margin:0;overflow:hidden}button{font:inherit}body{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;font-family:-apple-system,BlinkMacSystemFont,Avenir Next,Segoe UI,sans-serif}.app-shell{background:radial-gradient(circle at 90% 10%, #f05a310f, transparent 24%), var(--paper);width:100vw;height:100dvh;min-height:440px}.rail-action-icon{fill:none;stroke:currentColor;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round;width:27px;height:27px}.workspace{grid-template-columns:68px minmax(0,1fr);width:100%;height:100%;min-height:0;display:grid}.tool-rail{padding:max(12px, env(safe-area-inset-top)) 8px max(12px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));background:#faf9f5e0;border-right:1px solid #17211d1c;flex-direction:column;align-items:center;gap:14px;display:flex}.rail-header{order:0;display:none}.settings-tools{order:1}.primary-tools{order:2}.drawing-tools{order:3}.capture-tools{order:4}.sport-badge{filter:drop-shadow(0 2px 2px #232f282e);place-items:center;width:38px;height:38px;font-size:32px;line-height:1;display:grid}.sport-badge>span{line-height:1;display:block}.tool-group{width:100%}.tool-button,.option-button{cursor:pointer;border:0;width:100%}.tool-button{color:#3e4b44;text-align:left;background:0 0;border-radius:11px;justify-content:center;align-items:center;gap:0;min-height:43px;margin-bottom:7px;padding:6px;font-size:0;font-weight:700;display:flex}.tool-button:active{background:0 0;transform:scale(.92)}.tool-button.is-on{background:0 0}.tool-button.is-on .mini-marker{filter:brightness(1.08)drop-shadow(0 0 4px #f05a3138)}.mini-marker{color:#fff;flex:0 0 31px;place-items:center;width:31px;height:31px;font-size:16px;font-weight:500;display:grid}.mini-circle{background:var(--orange);border-radius:50%;box-shadow:inset 0 -3px #7618062e,0 3px 6px #f05a3130}.mini-triangle{background:var(--blue);clip-path:polygon(50% 2%,98% 91%,2% 91%);position:relative}.mini-triangle i{font-style:normal;position:relative;top:3px}.equipment-menu-icon{position:relative}.equipment-menu-icon:before{content:"";z-index:2;clip-path:polygon(50% 0,76% 76%,95% 76%,100% 94%,0 94%,5% 76%,24% 76%);filter:drop-shadow(0 2px 2px #532e1040);background:linear-gradient(#f28a2d 0 48%,#fff4df 48% 61%,#ed6e24 61% 100%);width:14px;height:22px;position:absolute;bottom:2px;left:1px}.equipment-menu-icon:after{content:"";z-index:1;background-color:#ffffffbf;background-image:linear-gradient(#43514933 1px,#0000 1px),linear-gradient(90deg,#43514933 1px,#0000 1px);background-size:5px 5px;border:3px solid #435149;border-radius:3px 3px 1px 1px;width:18px;height:15px;position:absolute;bottom:4px;right:0}.settings-tools{border-top:0;padding-top:0}.primary-tools,.drawing-tools,.capture-tools{border-top:1px solid var(--line);padding-top:18px}.record-icon i{background:#e0452f;border-radius:50%;width:17px;height:17px;display:block;box-shadow:0 0 0 2px #e0452f1f}.record-button.is-recording .record-icon i{border-radius:3px;width:15px;height:15px;animation:1.2s ease-in-out infinite recording-pulse}.record-button.is-recording .option-icon{color:#e0452f}.microphone-icon svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.voiceover-button.is-on .microphone-icon{color:var(--orange);filter:drop-shadow(0 0 4px #f05a3138)}.option-button{color:#4d5952;text-align:left;background:0 0;border-radius:10px;justify-content:center;align-items:center;gap:0;min-height:43px;padding:6px;font-size:0;font-weight:650;display:flex}.option-button:active:not(:disabled){background:0 0;transform:scale(.9)}.option-button.is-on{background:0 0}.option-button.is-on .option-icon{color:var(--orange);filter:drop-shadow(0 0 4px #f05a3133)}.option-button.draw-is-on{color:var(--ink);background:0 0}.option-button.draw-is-on .option-icon{color:var(--orange)}.option-button:disabled{cursor:default;opacity:.35}@media (hover:hover) and (pointer:fine){.tool-button:hover,.option-button:hover:not(:disabled) .option-icon{color:var(--orange)}}.option-icon{color:#536159;border:1px solid #d7dcd6;border-radius:8px;place-items:center;width:28px;height:28px;font-size:10px;font-weight:800;display:grid}.team-size-icon{color:var(--ink);background:#eef0eb}.settings-icon{color:#536159;background:#eef0eb;font-size:17px}.tool-rail .option-icon{background:0 0;border:0;border-radius:0;width:32px;height:32px}.tool-rail .settings-icon{font-size:0}.fa-settings-icon{fill:currentColor;width:20px;height:20px}.tool-rail .quick-clear-button{color:#5b665f}.tool-rail .draw-icon svg,.tool-rail .layers-icon svg,.tool-rail .camera-icon svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:25px;height:25px}.tool-rail .highlight-icon svg{fill:#5361592e;stroke:currentColor;stroke-width:2.3px;stroke-linecap:round;stroke-linejoin:round;width:27px;height:27px}.tool-rail .option-button.highlight-is-on .highlight-icon svg{fill:#f05a3124}.drawing-tools>.quick-undo-button{margin-top:8px}.tool-rail .folder-icon svg{fill:currentColor;stroke:none;width:25px;height:25px}.field-style-icon.green{background:var(--grass);color:#fff;border-color:#4f844c}.field-style-icon.white{color:#17211d;background:#fff;border-color:#969b96}.team-color-icon{gap:3px;display:flex}.team-color-icon i{border:1px solid #fffc;border-radius:50%;width:9px;height:9px}.team-color-icon i:last-child{clip-path:polygon(50% 0,100% 100%,0 100%);border-radius:1px}.team-manager-icon{display:block;position:relative}.team-manager-icon i{border:2px solid #ffffffe6;width:19px;height:19px;display:block;position:absolute;box-shadow:0 3px 6px #17211d33}.team-manager-icon i:first-child{bottom:1px;left:0}.team-manager-icon i:last-child{top:0;right:0}.team-manager-icon .circle{border-radius:50%}.team-manager-icon .triangle{clip-path:polygon(50% 0,100% 100%,0 100%)}.team-manager-icon .square{border-radius:3px}.board-wrap{min-width:0;min-height:0;padding:max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) 10px;display:block;position:relative}.saved-boards-backdrop{z-index:300;padding:max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#141e1994;place-items:start center;display:grid;position:fixed;inset:0}.restore-confirm-backdrop{z-index:410;padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);background:#141e19a8;place-items:center;display:grid;position:fixed;inset:0}.restore-confirm-modal{text-align:center;background:#f8f7f2;border:1px solid #17211d2b;border-radius:20px;justify-items:center;gap:10px;width:min(430px,100%);padding:27px;display:grid;box-shadow:0 28px 80px #0e181270}.restore-confirm-modal h2,.restore-confirm-modal p{margin:0}.restore-confirm-modal h2{color:var(--ink);letter-spacing:-.02em;font-size:23px}.restore-confirm-modal p{max-width:340px;color:var(--muted);font-size:13px;font-weight:680;line-height:1.5}.restore-confirm-icon{width:52px;height:52px;color:var(--orange);background:#ffebe4;border-radius:15px;place-items:center;margin-bottom:2px;display:grid}.restore-confirm-icon svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:27px;height:27px}.restore-confirm-icon.is-delete{color:#b4412d;background:#fbe9e5}.restore-confirm-details{color:#657169;background:#efeee8;border:1px solid #dde1dc;border-radius:11px;justify-content:space-between;align-items:center;gap:16px;width:100%;margin-top:7px;padding:11px 13px;font-size:11px;font-weight:750;display:flex}.restore-confirm-details time{color:#48564e;text-align:right}.restore-confirm-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;width:100%;margin-top:5px;display:grid}.restore-confirm-actions button{cursor:pointer;border:1px solid #d2d8d2;border-radius:11px;min-height:44px;padding:0 16px;font-size:13px;font-weight:850}.restore-confirm-cancel{color:#536058;background:#fff}.restore-confirm-cancel:hover{color:var(--orange);border-color:#9eaaa1}.restore-confirm-accept{background:var(--orange);color:#fff;border-color:var(--orange)!important}.restore-confirm-accept:hover{background:#d94b29}.restore-confirm-accept.is-delete{background:#b4412d;border-color:#b4412d!important}.restore-confirm-accept.is-delete:hover{background:#963522}.restore-confirm-actions button:focus-visible{outline-offset:2px;outline:3px solid #f05a3140}.save-board-notice{z-index:340;right:max(18px, env(safe-area-inset-right));bottom:max(18px, env(safe-area-inset-bottom));color:#fff;background:#17211d;border:1px solid #ffffff29;border-radius:12px;max-width:min(360px,100vw - 36px);padding:12px 16px;font-size:13px;font-weight:800;position:fixed;box-shadow:0 12px 34px #0e18124d}.save-board-notice.is-error{background:#9b351f}.recording-status,.playback-status{z-index:250;top:max(16px, env(safe-area-inset-top));right:max(16px, env(safe-area-inset-right));color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#17211df0;border:1px solid #ffffff2e;border-radius:13px;align-items:center;gap:9px;min-height:44px;padding:7px 8px 7px 12px;font-size:12px;display:flex;position:fixed;box-shadow:0 12px 34px #0e181247}.recording-status>span{background:#ff4f38;border-radius:50%;width:10px;height:10px;animation:1.2s ease-in-out infinite recording-pulse}.recording-status strong{color:#ff7a68;letter-spacing:.08em}.recording-status time,.playback-status time{font-variant-numeric:tabular-nums;min-width:68px;font-weight:750}.recording-status button,.playback-status button{min-height:30px;color:var(--ink);cursor:pointer;background:#fff;border:0;border-radius:8px;padding:0 11px;font-size:11px;font-weight:850}.is-playing-recording .tool-rail,.is-playing-recording .board-wrap{pointer-events:none}@keyframes recording-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.86)}}.saved-boards-modal{background:#f8f7f2;border:1px solid #17211d2b;border-radius:20px;flex-direction:column;width:min(900px,100%);max-height:min(820px,92dvh);display:flex;overflow:hidden;box-shadow:0 28px 80px #0e181261}.saved-boards-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:flex-start;gap:18px;padding:20px 22px 17px;display:flex}.saved-boards-header h2,.saved-boards-header p,.saved-boards-empty h3,.saved-boards-empty p{margin:0}.saved-boards-header h2{font-size:24px;line-height:1.1}.saved-boards-header p{color:var(--muted);margin-top:5px;font-size:13px;font-weight:650}.saved-boards-close{color:#5f6b64;cursor:pointer;background:0 0;border:0;border-radius:10px;place-items:center;width:38px;height:38px;padding:0;font-size:34px;font-weight:300;line-height:1;display:grid}.saved-boards-close:hover{color:var(--ink);background:#ebeae4}.saved-media-tabs{grid-template-columns:1fr 1fr;gap:7px;padding:12px 22px 0;display:grid}.saved-media-tabs button{color:#65716a;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;min-height:40px;font-weight:800}.saved-media-tabs button span{background:#e5e6e0;border-radius:11px;place-items:center;min-width:22px;height:22px;margin-left:5px;padding:0 6px;font-size:11px;display:inline-grid}.saved-media-tabs button.is-active{color:var(--ink);background:#fff;border-color:#ccd2cc;box-shadow:0 3px 8px #17211d12}.saved-boards-actions{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;padding:14px 22px;display:flex}.saved-boards-actions>span{color:var(--muted);font-size:13px;font-weight:750}.save-board-button{background:var(--ink);color:#fff;cursor:pointer;border:0;border-radius:12px;justify-content:center;align-items:center;gap:9px;min-height:44px;padding:0 18px;font-weight:800;display:inline-flex}.save-board-button:hover:not(:disabled){background:#2a3931}.save-board-button:disabled{cursor:wait;opacity:.65}.save-board-button svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:21px;height:21px}.saved-board-error{color:#a33c21;background:#fff0eb;margin:0;padding:11px 22px;font-size:13px;font-weight:750}.saved-recordings-note{border-bottom:1px solid var(--line);color:var(--muted);justify-content:space-between;gap:18px;padding:15px 22px;font-size:12px;font-weight:700;display:flex}.saved-recordings-note span{white-space:nowrap}.saved-boards-content{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;min-height:240px;padding:20px 22px 24px;overflow:auto}.saved-board-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.saved-board-card{background:#fff;border:1px solid #d8dcd6;border-radius:14px;min-width:0;overflow:hidden;box-shadow:0 5px 15px #17211d14}.saved-board-thumbnail{aspect-ratio:16/9;cursor:zoom-in;background:#e8ece7;border:0;border-bottom:1px solid #e0e3de;width:100%;padding:0;display:block;overflow:hidden}.saved-board-thumbnail img{object-fit:contain;width:100%;height:100%;display:block}.saved-board-preview-footer{justify-content:space-between;align-items:center;gap:10px;display:flex}.saved-board-card-footer{gap:10px;padding:12px;display:grid}.saved-board-card-footer time{color:#67746c;font-size:12px;font-weight:750;line-height:1.3;display:block}.saved-board-card-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;display:grid}.saved-board-preview-footer>div{flex-wrap:wrap;gap:6px;display:flex}.saved-board-card-footer a,.saved-board-card-footer button,.saved-board-preview-footer a,.saved-board-preview-footer button{color:#526058;cursor:pointer;background:#fff;border:1px solid #d8dcd6;border-radius:9px;place-items:center;min-width:34px;min-height:34px;padding:0 10px;font-size:15px;font-weight:800;line-height:1;text-decoration:none;display:inline-grid}.saved-board-card-footer a,.saved-board-card-footer button{width:100%;min-width:0;min-height:36px;padding:0 6px;font-size:11px}.saved-board-card-actions button:last-child{color:#a74330}.saved-board-card-actions button:last-child:hover{color:#b7331d;border-color:#e2a497}.saved-board-card-footer a:hover,.saved-board-card-footer button:hover,.saved-board-preview-footer a:hover,.saved-board-preview-footer button:hover{color:var(--orange);border-color:#aeb6af}.saved-board-card-footer button:disabled,.saved-board-preview-footer button:disabled{cursor:default;opacity:.42;color:#77827b}.saved-board-card-footer button:disabled:hover,.saved-board-preview-footer button:disabled:hover{color:#77827b;border-color:#d8dcd6}.saved-board-preview-footer .restore-board-button{min-width:112px}.saved-board-preview{gap:14px;display:grid}.saved-board-back{color:#536159;cursor:pointer;background:0 0;border:0;justify-self:start;padding:6px 0;font-weight:800}.saved-board-preview>img{object-fit:contain;background:#e7ebe6;border:1px solid #d7dcd6;border-radius:13px;width:100%;max-height:58dvh;display:block}.saved-board-preview-footer{color:var(--muted);font-size:12px;font-weight:700}.saved-boards-empty{min-height:260px;color:var(--muted);text-align:center;align-content:center;justify-items:center;display:grid}.saved-boards-empty svg{color:#87938c;width:58px;height:58px;margin-bottom:14px}.saved-boards-empty h3{color:var(--ink);font-size:18px}.saved-boards-empty p{margin-top:5px;font-size:13px;font-weight:650}.saved-recording-list{gap:10px;display:grid}.saved-recording-card{background:#fff;border:1px solid #d8dcd6;border-radius:13px;grid-template-columns:132px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px;display:grid;box-shadow:0 4px 13px #17211d0f}.saved-recording-thumbnail{aspect-ratio:16/9;background:#e8ece7;border:1px solid #d9ded8;border-radius:9px;width:132px;margin:0;overflow:hidden}.saved-recording-thumbnail img{object-fit:cover;width:100%;height:100%;display:block}.saved-recording-placeholder{background:#fff0ec;place-items:center;width:100%;height:100%;display:grid}.saved-recording-placeholder i,.large-record-icon{background:#e0452f;border-radius:50%;display:block}.saved-recording-placeholder i{width:18px;height:18px}.saved-recording-card>div{gap:2px;min-width:0;display:grid}.saved-recording-card strong{font-size:14px}.saved-recording-card time{color:#66736b;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700;overflow:hidden}.saved-recording-card small{color:#89938d;font-size:10px;font-weight:700}.saved-recording-card>.saved-recording-card-actions{background:#f3f4f0;border:1px solid #e0e4df;border-radius:11px;grid-column:3;align-items:center;gap:3px;padding:4px;display:flex}.play-recording-button,.download-recording-button,.video-recording-button,.delete-recording-button{color:#4e5b53;cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;gap:6px;width:auto;min-height:34px;padding:0 10px;font-size:11px;font-weight:800;line-height:1;display:inline-flex}.saved-recording-card-actions svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:15px;height:15px}.saved-recording-card-actions .play-recording-button{border-color:var(--ink);background:var(--ink);color:#fff}.saved-recording-card-actions .play-recording-button svg{fill:currentColor;stroke:none}.saved-recording-card-actions .play-recording-button:hover:not(:disabled){color:#fff;background:#2c3c33;border-color:#2c3c33}.play-recording-button:hover:not(:disabled),.download-recording-button:hover,.video-recording-button:hover:not(:disabled){color:var(--orange);background:#fff;border-color:#d9ddd8}.play-recording-button:disabled,.video-recording-button:disabled{cursor:default;opacity:.45}.delete-recording-button{color:#a74330}.delete-recording-button:hover{color:#b33c25;background:#fff8f6;border-color:#efd4ce}.large-record-icon{width:48px;height:48px;margin-bottom:14px;box-shadow:0 0 0 9px #fff0ec}.video-export-backdrop{z-index:420;padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#141e19a3;place-items:center;display:grid;position:fixed;inset:0}.video-export-modal{text-align:center;background:#f8f7f2;border:1px solid #17211d2e;border-radius:20px;justify-items:center;gap:10px;width:min(680px,100%);max-height:calc(100dvh - 32px);padding:26px;display:grid;overflow:auto;box-shadow:0 28px 80px #0e18126b}.video-export-modal h2,.video-export-modal p{margin:0}.video-export-modal h2{color:var(--ink);font-size:23px}.video-export-modal p{max-width:520px;color:var(--muted);font-size:13px;font-weight:680;line-height:1.5}.video-export-modal>small{color:#7b877f;font-size:11px;font-weight:750}.video-export-symbol{color:#2f7049;background:#e3ece5;border-radius:50%;place-items:center;width:48px;height:48px;margin-bottom:2px;font-size:24px;font-weight:900;display:grid}.video-export-symbol.is-rendering span{border:3px solid #b8c8bd;border-top-color:var(--orange);border-radius:50%;width:22px;height:22px;animation:.85s linear infinite video-export-spin}.video-export-symbol.is-error{color:#a63c24;background:#f9e5df}.video-export-progress{background:#dfe5df;border-radius:999px;width:min(460px,100%);height:10px;margin-top:8px;overflow:hidden}.video-export-progress i{border-radius:inherit;background:var(--orange);height:100%;transition:width .18s linear;display:block}.video-export-percent{color:#5d6b62;font-variant-numeric:tabular-nums;font-size:12px}.video-export-preview{background:#152019;border:1px solid #cfd7d0;border-radius:13px;width:100%;max-height:48dvh;margin-top:5px;display:block}.video-export-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;margin-top:4px;display:grid}.video-export-actions a,.video-export-actions button,.video-export-cancel,.video-export-close-single{color:#4b5951;cursor:pointer;background:#fff;border:1px solid #d2d8d2;border-radius:10px;place-items:center;min-height:42px;padding:0 15px;font-size:12px;font-weight:850;text-decoration:none;display:inline-grid}.video-export-actions a{border-color:var(--ink);background:var(--ink);color:#fff}.video-export-actions a:hover{background:#2b3a32}.video-export-actions button:hover,.video-export-cancel:hover,.video-export-close-single:hover{color:var(--orange);border-color:#9eaaa1}.video-export-cancel,.video-export-close-single{min-width:120px;margin-top:3px}@keyframes video-export-spin{to{transform:rotate(360deg)}}.zone-panel,.pen-panel,.layers-panel,.preset-panel,.team-colors-panel,.equipment-panel{z-index:20;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#faf9f5f2;border:1px solid #17211d29;border-radius:14px;width:min(228px,100% - 36px);position:absolute;top:18px;left:18px;overflow:hidden;box-shadow:0 16px 44px #18271f40}.preset-panel{width:min(260px,100% - 36px)}.zone-panel,.pen-panel,.layers-panel{width:min(276px,100% - 36px)}.drawing-panel-stack{z-index:20;flex-direction:column;gap:8px;width:min(276px,100% - 36px);display:flex;position:absolute;top:18px;left:18px}.drawing-panel-stack>.zone-panel,.drawing-panel-stack>.pen-panel,.drawing-panel-stack>.layers-panel{width:100%;max-height:none;position:relative;top:auto;left:auto}.drawing-panel-stack>.layers-panel{order:-1}.zone-panel,.pen-panel{overscroll-behavior:contain;max-height:calc(100% - 36px);overflow:hidden auto}.settings-panel{overscroll-behavior:contain;width:min(320px,100% - 36px);max-height:calc(100% - 36px);overflow:hidden auto}.team-colors-panel{width:min(306px,100% - 36px)}.equipment-panel{overscroll-behavior:contain;width:min(330px,100% - 36px);max-height:calc(100% - 36px);overflow:hidden auto}.preset-panel-top{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;min-height:48px;padding:0 8px 0 13px;display:flex}.preset-panel-top>div{gap:2px;display:grid}.preset-panel-top strong{font-size:12px}.preset-panel-top small{color:#849088;letter-spacing:.07em;text-transform:uppercase;font-size:8px;font-weight:750}.preset-panel-top>button{color:#69756e;cursor:pointer;background:0 0;border:0;border-radius:8px;place-items:center;width:30px;height:30px;padding:0;font-size:20px;display:grid}.preset-options{grid-template-columns:repeat(3,1fr);gap:7px;padding:11px;display:grid}.preset-options button{color:#34423a;cursor:pointer;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:10px;place-items:center;gap:4px;min-height:67px;padding:7px 4px;display:grid}.preset-options button.is-active{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange);background:#fff1ea}.preset-options span{letter-spacing:-.04em;font-size:16px;font-weight:850}.preset-options i{color:#829087;margin:0 2px;font-size:9px;font-style:normal;font-weight:700}.preset-options small{color:#7d8982;font-size:9px;font-weight:750}.preset-panel>p{color:#7b8780;margin:0;padding:0 12px 11px;font-size:8px;line-height:1.35}.settings-section-label{color:#6e7a73;letter-spacing:.08em;text-transform:uppercase;padding:11px 12px 0;font-size:8px;display:block}.settings-panel .preset-options{padding-top:8px;padding-bottom:8px}.formation-groups{gap:7px;padding:8px 11px 11px;display:grid}.formation-group{grid-template-columns:42px minmax(0,1fr);align-items:center;gap:7px;display:grid}.formation-group>strong{color:#34423a;letter-spacing:-.03em;font-size:12px}.formation-group>strong i{color:#829087;margin:0 1px;font-size:7px;font-style:normal}.formation-choices{grid-template-columns:repeat(auto-fit,minmax(48px,1fr));gap:5px;display:grid}.formation-choices button{color:#46534c;cursor:pointer;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:8px;min-height:31px;padding:4px 3px;font-size:9px;font-weight:850}.formation-choices button.is-active{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange);background:#fff1ea}.player-label-heading,.field-color-heading,.field-view-heading,.field-lines-heading{border-top:1px solid var(--line)}.player-label-options{grid-template-columns:repeat(3,1fr);gap:6px;padding:8px 11px 11px;display:grid}.player-label-options button{color:#46534c;cursor:pointer;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:9px;place-items:center;gap:3px;min-height:47px;padding:5px 3px;display:grid}.player-label-options button.is-active{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange);background:#fff1ea}.player-label-options span{font-size:13px;font-weight:850}.player-label-options small{color:#7d8982;font-size:8px;font-weight:750}.settings-options{border-top:1px solid var(--line);gap:6px;padding:10px 11px 11px;display:grid}.settings-options button{color:#435048;text-align:left;cursor:pointer;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:10px;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:46px;padding:5px 8px;display:grid}.settings-options button.is-active{background:#fff;border-color:#aeb7b0}.settings-options button>span:nth-child(2){gap:2px;display:grid}.settings-options strong{font-size:9px}.settings-options small{color:#849088;font-size:8px;font-weight:700}.settings-options i{color:#68756d;font-size:8px;font-style:normal;font-weight:850}.field-style-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:8px 11px 11px;display:grid}.field-style-choices button{color:#46534c;cursor:pointer;text-align:center;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:9px;justify-content:center;align-items:center;gap:6px;min-height:47px;padding:5px 8px;font-size:9px;font-weight:850;display:flex}.field-style-choices button.is-active{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange);background:#fff1ea}.field-style-swatch{border:1px solid #78827b;border-radius:4px;width:15px;height:15px}.field-style-swatch.green{background:var(--grass);border-color:#4f844c}.field-style-swatch.white{background:#fbfbf8;border-color:#969b96}.field-view-choices{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:8px 11px 11px;display:grid}.field-view-choices button{color:#46534c;cursor:pointer;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:9px;place-items:center;gap:4px;min-width:0;min-height:58px;padding:6px 3px;display:grid}.field-view-choices button.is-active{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange);background:#fff1ea}.field-view-choices svg{fill:none;stroke:currentColor;stroke-width:1.55px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}.field-view-choices small{color:#66736b;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:8px;font-weight:800;overflow:hidden}.field-lines-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:8px 11px 11px;display:grid}.field-lines-choices button{color:#46534c;cursor:pointer;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:9px;place-items:center;gap:4px;min-height:52px;padding:6px 3px;display:grid}.field-lines-choices button.is-active{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange);background:#fff1ea}.field-lines-choices svg{fill:none;stroke:currentColor;stroke-width:1.55px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}.field-lines-choices small{color:#66736b;font-size:8px;font-weight:800}.settings-options .settings-reset{color:#8d4939;margin-top:3px}.settings-reset-icon{fill:none;stroke:currentColor;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round;width:19px;height:19px}.settings-panel .preset-panel-top strong{font-size:15px}.settings-panel .preset-panel-top small{font-size:9px}.settings-panel>p{font-size:9px;line-height:1.4}.settings-panel .settings-section-label{font-size:9px}.settings-panel .formation-group>strong i{font-size:8px}.settings-panel .formation-group>strong small{font-size:9px}.settings-panel .formation-choices button{font-size:10px}.settings-panel .player-label-options small{font-size:9px}.settings-panel .settings-options strong{font-size:10px}.settings-panel .settings-options small,.settings-panel .settings-options i{font-size:9px}.settings-panel .field-style-choices button{font-size:10px}.settings-panel .field-view-choices small,.settings-panel .field-lines-choices small{font-size:9px}.equipment-group{padding:10px 11px 11px}.equipment-group+.equipment-group{border-top:1px solid var(--line)}.equipment-group>strong{color:#6e7a73;letter-spacing:.08em;text-transform:uppercase;margin:0 0 7px 2px;font-size:8px;display:block}.equipment-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;display:grid}.equipment-options.marker-options{grid-template-columns:repeat(4,minmax(0,1fr))}.equipment-options button{color:#435048;cursor:pointer;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:10px;place-items:center;gap:5px;min-width:0;min-height:74px;padding:7px 3px 6px;display:grid}.equipment-options button:active{border-color:var(--orange);background:#fff1ea;transform:scale(.98)}.equipment-options small{color:#59665f;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:8px;font-weight:800;overflow:hidden}.equipment-preview{width:62px;max-width:100%;height:39px;display:block;position:relative}.equipment-ball-preview{background:radial-gradient(circle at 36% 28%,#fffdf5,#e8e5da 78%);border:2px solid #f7f4e8;border-radius:50%;width:35px;height:35px;overflow:hidden;box-shadow:inset -3px -4px 6px #29332d29,0 3px 7px #232f283d}.equipment-preview .cone-shape{inset:2px 18px 0}.equipment-preview-mini-cone .cone-shape{inset:9px 22px 0}.equipment-preview .disk-shape{inset:18px 16px 5px}.equipment-preview-mini-disk .disk-shape{inset:23px 21px 6px}.equipment-preview-mini-goal-small .mini-goal-shape{inset:10px 10px 3px}.equipment-preview-mini-goal .mini-goal-shape{inset:6px 4px 1px}.equipment-preview-mini-goal-large .mini-goal-shape{inset:1px -2px 0}.equipment-preview .pole-shape{inset:1px 24px 0}.equipment-preview .flag-shape{inset:1px 16px 0 20px}.equipment-preview .mannequin-shape{inset:0 16px}.equipment-color-picker{border-top:1px solid var(--line);padding:10px 11px 11px}.equipment-color-heading{color:#56635c;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:9px;display:flex}.equipment-color-heading strong{font-size:9px}.equipment-color-heading small{color:#849088;font-size:8px}.equipment-swatches{justify-content:space-between;align-items:center;gap:6px;display:flex}.equipment-swatches>button,.equipment-custom-color{cursor:pointer;border:2px solid #17211d26;border-radius:50%;flex:0 0 24px;place-items:center;width:24px;height:24px;padding:0;display:grid;position:relative}.equipment-swatches>button.is-active{outline:2px solid var(--ink);outline-offset:2px}.equipment-custom-color{color:#536058;background:#fff;border-style:dashed;font-size:15px;font-weight:700;overflow:hidden}.equipment-custom-color input{opacity:0;cursor:pointer;width:44px;height:44px;position:absolute}.equipment-custom-color span{pointer-events:none;place-items:center;width:100%;height:100%;line-height:1;display:grid}.equipment-controls{border-top:1px solid var(--line);padding:10px 11px 11px}.equipment-selection{color:#66736b;justify-content:space-between;align-items:center;min-height:18px;margin-bottom:7px;font-size:8px;font-weight:750;display:flex}.equipment-selection small{color:#4b5851;background:#e9e7df;border-radius:999px;padding:2px 5px;font-size:8px}.equipment-control-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.equipment-control-grid button,.clear-equipment{color:#48554e;cursor:pointer;background:#fff;border:1px solid #d7dcd6;border-radius:8px;min-height:34px;padding:5px 6px;font-size:9px;font-weight:800}.equipment-control-grid button:disabled,.clear-equipment:disabled{cursor:default;opacity:.35}.equipment-control-grid .remove-equipment:not(:disabled){color:#a7422c}.clear-equipment{color:#7b4a3e;width:100%;margin-top:6px}.team-player-hint{border-bottom:1px solid var(--line);color:#6d7972;background:#f0eee7;margin:0;padding:8px 12px;font-size:8px;font-weight:750;line-height:1.35}.team-color-row{border-bottom:1px solid var(--line);padding:11px 12px}.team-maintenance-row{justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}.team-color-label{color:#435048;align-items:center;gap:8px;font-size:12px;font-weight:800;display:flex}.team-color-label>span{width:18px;height:18px;display:block;box-shadow:inset 0 0 0 2px #ffffffbf}.team-color-label>span.circle{border-radius:50%}.team-color-label>span.triangle{clip-path:polygon(50% 0,100% 100%,0 100%)}.team-color-label>span.square{border-radius:3px}.team-count-controls{background:#fff;border:1px solid #d7dcd6;border-radius:9px;grid-template-columns:28px 30px 28px;align-items:center;display:grid;overflow:hidden}.team-count-controls button{color:#45534b;cursor:pointer;background:0 0;border:0;width:28px;height:28px;padding:0;font-size:16px;font-weight:700}.team-count-controls button:active:not(:disabled){background:#edf0eb}.team-count-controls button:disabled{cursor:default;opacity:.28}.team-count-controls>span{color:#34423a;border-left:1px solid #e2e5e0;border-right:1px solid #e2e5e0;place-items:center;height:20px;font-size:9px;font-weight:850;display:grid}.team-palette-label{color:#7b8780;letter-spacing:.04em;text-transform:uppercase;margin:0 0 7px 1px;font-size:8px;font-weight:800;display:block}.team-shape-options{grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:12px;display:grid}.team-shape-options button{color:#657169;cursor:pointer;background:#fff;border:1px solid #d7dcd6;border-radius:8px;justify-content:center;align-items:center;gap:5px;min-height:30px;padding:4px 5px;display:flex}.team-shape-options button.is-active{color:#28342e;background:#edf0eb;border-color:#526058;box-shadow:inset 0 0 0 1px #526058}.team-shape-options button small{text-transform:capitalize;font-size:8px;font-weight:800}.shape-sample{background:currentColor;width:13px;height:13px;display:block}.shape-sample.circle{border-radius:50%}.shape-sample.triangle{clip-path:polygon(50% 0,100% 100%,0 100%)}.shape-sample.square{border-radius:2px}.team-palette-label.goalkeeper-label{margin-top:12px}.team-swatches{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.team-swatches>button,.custom-color{cursor:pointer;border:2px solid #17211d26;border-radius:50%;flex:0 0 25px;place-items:center;width:25px;height:25px;padding:0;display:grid;position:relative}.team-swatches>button.is-active{outline:2px solid var(--ink);outline-offset:2px}.custom-color{color:#536058;background:#fff;border-style:dashed;font-size:15px;font-weight:700;overflow:hidden}.custom-color input{opacity:0;cursor:pointer;width:45px;height:45px;position:absolute}.custom-color span{pointer-events:none;place-items:center;width:100%;height:100%;line-height:1;display:grid}.default-colors{color:#59655e;cursor:pointer;background:#fff;border:1px solid #d7dcd6;border-radius:8px;min-height:34px;margin:9px 12px 11px;padding:0 11px;font-size:9px;font-weight:800}.zone-panel-top,.pen-panel-top,.layers-panel-top{border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;min-height:42px;padding:0 8px 0 13px;display:grid}.zone-panel-top strong,.pen-panel-top strong,.layers-panel-top strong{font-size:12px}.layers-panel-heading{min-width:0;color:inherit;text-align:left;white-space:nowrap;cursor:pointer;background:0 0;border:0;padding:0;display:block;overflow:hidden}.layers-panel-heading strong{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.layers-panel-heading small{color:#7b8780;text-overflow:ellipsis;white-space:nowrap;font-size:9px;font-weight:750;overflow:hidden}.layers-panel.is-collapsed .layers-panel-top{border-bottom:0}.zone-panel-top>button,.pen-panel-top>button,.layers-panel-top>button{color:#69756e;cursor:pointer;background:0 0;border:0;border-radius:8px;place-items:center;width:30px;height:30px;padding:0;font-size:20px;display:grid}.layers-panel-top>.layers-panel-heading{text-align:left;justify-self:stretch;width:100%;height:auto;min-height:30px;padding-left:0;display:block}.layers-panel-top>.layers-panel-heading strong{text-align:left;width:100%}.zone-panel-top>button:active,.pen-panel-top>button:active,.layers-panel-top>button:active{background:#e9e7df}.layers-panel-top>.layers-collapse-button{color:#748078}.layers-collapse-button svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:16px;height:10px;transition:transform .15s}.layers-collapse-button.is-expanded svg{transform:rotate(180deg)}.zone-panel-top>.drawing-status,.pen-panel-top>.drawing-status,.layers-panel-top>.drawing-status{color:#737f78;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;background:#e9e7df;border:0;border-radius:999px;align-items:center;gap:5px;width:auto;height:auto;min-height:27px;padding:4px 7px;font-size:8px;font-weight:800;display:flex}.zone-panel-top>.drawing-status i,.pen-panel-top>.drawing-status i,.layers-panel-top>.drawing-status i{background:0 0;border:1.5px solid;border-radius:50%;width:7px;height:7px}.zone-panel-top>.drawing-status.is-active,.pen-panel-top>.drawing-status.is-active,.layers-panel-top>.drawing-status.is-active{color:#33723e;background:#dbeedc}.zone-panel-top>.drawing-status.is-active i,.pen-panel-top>.drawing-status.is-active i,.layers-panel-top>.drawing-status.is-active i{background:#4b9d57}.zone-compact-toolbar{grid-template-columns:minmax(0,1fr) 28px;align-items:center;gap:6px;padding:7px 9px 8px;display:grid}.zone-shape-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;display:grid}.zone-shape-grid button{color:#647169;cursor:pointer;touch-action:manipulation;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:7px;place-items:center;min-height:30px;padding:2px;display:grid}.zone-shape-grid button.is-active{border-color:var(--orange);color:var(--orange);background:#fff0e9;box-shadow:inset 0 0 0 1px #f05a3114}.zone-shape-grid svg{fill:currentColor;stroke:currentColor;stroke-width:1.5px;stroke-linejoin:round;width:18px;height:18px}.zone-options-expand{color:#7a867f;cursor:pointer;background:0 0;border:0;border-radius:7px;place-items:center;width:28px;height:30px;padding:0;display:grid}.zone-options-expand:hover,.zone-options-expand:focus-visible{color:var(--orange);background:#f05a310d}.zone-options-expand:focus-visible{outline-offset:-2px;outline:2px solid #f05a315c}.zone-options-expand svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:16px;height:10px;transition:transform .15s}.zone-options-expand.is-expanded svg{transform:rotate(180deg)}.zone-expanded-options{border-top:1px solid var(--line);padding:9px 10px 10px;animation:.16s ease-out pen-options-down}.zone-color-heading{margin:0 2px 8px}.zone-color-heading strong{color:#35423b;font-size:10px}.color-picker.zone-color-picker{border-top:0;grid-template-columns:repeat(4,25px);justify-content:start;gap:10px;padding:0 2px}.pen-option-section{border-bottom:1px solid var(--line);padding:10px}.pen-option-heading{justify-content:space-between;align-items:baseline;margin:0 2px 8px;display:flex}.pen-option-heading strong{color:#35423b;font-size:10px}.pen-option-heading small{color:#8c9690;font-size:8px;font-weight:700}.pen-compact-toolbar{grid-template-columns:minmax(0,1fr) 28px;align-items:center;gap:6px;padding:7px 9px 8px;display:grid}.pen-style-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;display:grid}.pen-style-grid button{color:#647169;cursor:pointer;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:7px;place-items:center;min-height:30px;padding:2px;display:grid}.pen-style-grid button.is-active{border-color:var(--orange);color:var(--orange);background:#fff0e9;box-shadow:inset 0 0 0 1px #f05a3114}.pen-style-grid svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:32px;height:15px}.pen-style-grid .freehand-preview{transform:translate(4px)}.pen-style-grid .preview-arrowhead{stroke-dasharray:none}.pen-style-grid .freehand-baseline{stroke-width:1.8px}.pen-expanded-options{border-top:1px solid var(--line);animation:.16s ease-out pen-options-down}.pen-thickness-section{border-bottom:1px solid var(--line);padding-top:9px;padding-bottom:10px}.pen-thickness-options{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.pen-thickness-options button{color:#647169;cursor:pointer;background:#ffffffb8;border:1px solid #d7dcd6;border-radius:9px;justify-content:center;align-items:center;min-height:32px;padding:3px 8px;font-size:9px;font-weight:800;display:flex}.pen-thickness-options button.is-active{border-color:var(--orange);color:var(--orange);background:#fff0e9}.pen-thickness-options i{background:currentColor;border-radius:999px;width:42px;display:block}.pen-color-section{border-bottom:0;padding-top:9px}.pen-color-section>.pen-option-heading{margin-left:12px;margin-right:10px}.color-picker.pen-color-picker{border-top:0;padding-top:0}.pen-options-expand{color:#7a867f;cursor:pointer;background:0 0;border:0;border-radius:7px;place-items:center;width:28px;height:30px;padding:0;display:grid}.pen-options-expand:hover,.pen-options-expand:focus-visible{color:var(--orange);background:#f05a310d}.pen-options-expand:focus-visible{outline-offset:-2px;outline:2px solid #f05a315c}.pen-options-expand svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:16px;height:10px;transition:transform .15s}.pen-options-expand.is-expanded svg{transform:rotate(180deg)}@keyframes pen-options-down{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.layers-panel-body{padding-bottom:7px}.layer-list{overscroll-behavior:contain;max-height:190px;padding:7px;overflow-y:auto}.layer-row{border-radius:9px;grid-template-columns:35px minmax(0,1fr) 31px 31px;align-items:center;display:grid}.layer-row+.layer-row{margin-top:3px}.layer-row.is-active{box-shadow:inset 3px 0 var(--orange);background:#e9e7df}.visibility-button{color:#65736b;cursor:pointer;background:0 0;border:0;place-items:center;width:35px;height:37px;padding:0;font-size:16px;display:grid}.visibility-icon{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.visibility-button[aria-pressed=false]{color:#8b948f}.visibility-button[aria-pressed=false] .visibility-icon>:not(.visibility-slash){opacity:.5}.visibility-slash{stroke-width:2.2px}.layer-select{color:#35423b;text-align:left;cursor:pointer;background:0 0;border:0;justify-content:space-between;align-items:center;min-width:0;min-height:37px;padding:0 10px 0 5px;font-size:11px;font-weight:700;display:flex}.layer-select span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.layer-select small{color:#8c9690;font-size:9px;font-weight:800}.layer-icon-action{color:#718078;cursor:pointer;background:0 0;border:0;border-radius:7px;place-items:center;width:29px;height:31px;padding:0;font-size:11px;display:grid}.layer-icon-action.undo-layer svg{fill:none;stroke:currentColor;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round;width:14px;height:14px}.layer-icon-action.delete-layer svg{width:12px;height:12px}.layer-icon-action:active:not(:disabled){background:#fffc}.layer-icon-action:disabled{cursor:default;opacity:.28}.layer-icon-action.delete-layer:not(:disabled){color:#a7422c}.layer-name-input{color:#35423b;width:calc(100% - 5px);height:30px;font:inherit;-webkit-user-select:text;user-select:text;background:#fff;border:1px solid #aab2ac;border-radius:7px;outline:0;margin-left:3px;padding:0 7px;font-size:11px;font-weight:700}.layer-name-input:focus{border-color:var(--orange);box-shadow:0 0 0 2px #f05a311f}.add-layer-row{color:#56645c;cursor:pointer;background:#ffffff9e;border:1px dashed #c9d0ca;border-radius:9px;justify-content:center;align-items:center;gap:6px;width:calc(100% - 14px);min-height:36px;margin:0 7px;font-size:10px;font-weight:800;display:flex}.add-layer-row span{font-size:16px;line-height:1}.add-layer-row:active{background:#fff;border-color:#9fa9a1}.color-picker{border-top:1px solid var(--line);grid-template-columns:repeat(9,25px);justify-content:space-between;align-items:center;gap:0;padding:10px 8px;display:grid}.color-picker button,.draw-custom-color{cursor:pointer;border:2px solid #17211d2e;border-radius:50%;place-items:center;width:25px;height:25px;padding:0;display:grid;position:relative;box-shadow:inset 0 0 0 1px #ffffff73}.color-picker button.is-active,.draw-custom-color.is-active{outline:2px solid var(--ink);outline-offset:2px}.draw-custom-color{color:#fff;text-shadow:0 1px 2px #17211db3;background:conic-gradient(#f05a31,#ffd23f,#39ff14,#00a8e8,#7a4bc2,#f05a31);border-style:dashed;font-size:15px;font-weight:800;overflow:hidden}.draw-custom-color input{opacity:0;cursor:pointer;width:45px;height:45px;position:absolute}.draw-custom-color span{pointer-events:none}.pitch{background:var(--grass);touch-action:none;isolation:isolate;border:8px solid #517e4d;border-radius:6px;width:100%;height:100%;min-height:0;position:relative;overflow:hidden;box-shadow:0 18px 40px #2036262e,inset 0 0 60px #1a402214}.pitch.is-drawing,.pitch.is-highlighting{cursor:crosshair}.pitch.field-white{background:#fbfbf8;border-color:#c7cbc6;box-shadow:0 18px 40px #202a2424,inset 0 0 40px #17211d06}.field-white .grass-stripes{display:none}.field-white .field-lines,.field-white .halfway,.field-white .center-circle,.field-white .penalty-box,.field-white .goal-box,.field-white .arc,.field-white .goal,.field-white .corner{border-color:#17211dc7}.field-white .center-circle i,.field-white .penalty-spot{background:#17211dd1}.drawing-canvas{z-index:2;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.drawing-canvas path{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 1px 1px #16271c59)}.drawing-canvas .drawing-arrowhead{fill:none;stroke-linecap:round;stroke-linejoin:round}.highlight-zones{z-index:1;pointer-events:none;position:absolute;inset:0}.highlight-zone{cursor:grab;pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent;background:0 0;border:0;min-width:2px;min-height:2px;padding:0;position:absolute}.highlight-zone:before{border:1px solid var(--zone-color);background:var(--zone-fill);content:"";pointer-events:none;border-radius:4px;position:absolute;inset:0;box-shadow:inset 0 0 18px #ffffff14}.highlight-zone.shape-circle:before{border-radius:50%}.highlight-zone.shape-triangle:before{background:var(--zone-fill);clip-path:polygon(50% 0,100% 100%,0 100%);filter:drop-shadow(0 0 1px var(--zone-color));border:0;border-radius:0}.highlight-zone:active{cursor:grabbing}.highlight-zone.is-selected{outline-offset:2px;outline:2px solid #ffffffe6}.highlight-zone:focus-visible{outline-offset:2px;outline:2px solid #17211d}.highlight-zone-resize-handle{background:var(--orange);cursor:nwse-resize;opacity:0;pointer-events:none;border:2px solid #fffffff2;border-radius:4px;width:18px;height:18px;transition:opacity .14s,transform .14s;position:absolute;bottom:-9px;right:-9px;transform:scale(.72);box-shadow:0 2px 6px #17211d47}.highlight-zone.is-selected .highlight-zone-resize-handle{opacity:1;pointer-events:auto;transform:scale(1)}.pitch.is-drawing .highlight-zone:not(.is-selected),.pitch.is-drawing .highlight-zone:not(.is-selected):active{cursor:crosshair}.grass-stripes{z-index:-2;background:repeating-linear-gradient(90deg,#ffffff07 0 10%,#164e1f09 10% 20%);position:absolute;inset:0}.grass-stripes:after{content:"";opacity:.22;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");position:absolute;inset:0}.field-lines,.field-lines>span{pointer-events:none;position:absolute}.field-lines{z-index:-1;border:2px solid #f7f8edd6;inset:3.2% 5.6%}.hide-field-lines .field-lines{display:none}.halfway{border-left:2px solid #f7f8edd6;top:0;bottom:0;left:50%}.center-circle{aspect-ratio:1;border:2px solid #f7f8edd6;border-radius:50%;width:min(18vw,22vh);top:50%;left:50%;transform:translate(-50%,-50%)}.center-circle i,.penalty-spot{background:#f7f8edeb;border-radius:50%;width:5px;height:5px;position:absolute}.center-circle i{top:50%;left:50%;transform:translate(-50%,-50%)}.penalty-box{border:2px solid #f7f8edd6;width:16%;top:18%;bottom:18%}.penalty-box.left{border-left:0;left:-2px}.penalty-box.right{border-right:0;right:-2px}.goal-box{border:2px solid #f7f8edd6;width:42%;position:absolute;top:23%;bottom:23%}.left .goal-box{border-left:0;left:-1px}.right .goal-box{border-right:0;right:-1px}.penalty-spot{top:50%;transform:translateY(-50%)}.left .penalty-spot{right:28%}.right .penalty-spot{left:28%}.arc{aspect-ratio:1;border:2px solid #f7f8edd6;border-radius:50%;width:112%;position:absolute;top:50%}.left .arc{clip-path:inset(0 0 0 75%);left:72%;transform:translate(-50%,-50%)}.right .arc{clip-path:inset(0 75% 0 0);left:28%;transform:translate(-50%,-50%)}.goal{border:2px solid #f7f8edb8;width:1.6%;top:38%;bottom:38%}.goal.left{border-right:0;left:-1.8%}.goal.right{border-left:0;right:-1.8%}.corner{border:2px solid #f7f8edd6;border-radius:50%;width:22px;height:22px}.corner.tl{clip-path:inset(50% 0 0 50%);top:-11px;left:-11px}.corner.tr{clip-path:inset(50% 50% 0 0);top:-11px;right:-11px}.corner.bl{clip-path:inset(0 0 50% 50%);bottom:-11px;left:-11px}.corner.br{clip-path:inset(0 50% 50% 0);bottom:-11px;right:-11px}.field-view-half .halfway,.field-view-half.half-goal-bottom .penalty-box.left,.field-view-half.half-goal-bottom .goal.left,.field-view-half.half-goal-bottom .corner.tl,.field-view-half.half-goal-bottom .corner.bl,.field-view-half.half-goal-top .penalty-box.right,.field-view-half.half-goal-top .goal.right,.field-view-half.half-goal-top .corner.tr,.field-view-half.half-goal-top .corner.br{display:none}.field-view-half.half-goal-bottom .center-circle{clip-path:inset(0 0 0 50%);width:min(36vw,44vh);left:0}.field-view-half.half-goal-top .center-circle{clip-path:inset(0 50% 0 0);width:min(36vw,44vh);left:100%}.field-view-half.half-goal-bottom .penalty-box.right,.field-view-half.half-goal-top .penalty-box.left{width:32%}.field-view-half.half-goal-bottom .goal.right{width:3.2%;right:-3.6%}.field-view-half.half-goal-top .goal.left{width:3.2%;left:-3.6%}.marker{z-index:3;color:#fff;width:clamp(31px,3.2vw,43px);height:clamp(31px,3.2vw,43px);transform:translate(-50%, -50%) rotate(var(--marker-rotation,0deg));cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:0 0;border:0;place-items:center;padding:0;font-size:clamp(10px,1.15vw,14px);font-weight:800;display:grid;position:absolute}.marker:after{content:"";border:2px solid #0000;border-radius:50%;transition:border-color .14s,transform .14s;position:absolute;inset:-6px}.player-shape-circle,.player-shape-square{background:var(--marker-color,var(--orange));background:linear-gradient(145deg, color-mix(in srgb, var(--marker-color,var(--orange)) 76%, white), var(--marker-color,var(--orange)));border:clamp(2px,.25vw,3px) solid #fff4e3f0;box-shadow:inset 0 -4px #7e1f0a29,0 4px 9px #2e36284d}.player-shape-circle{border-radius:50%}.player-shape-square{border-radius:clamp(5px,.55vw,8px)}.player-shape-square:after{border-radius:clamp(7px,.7vw,10px)}.player-shape-triangle .triangle-shape{clip-path:polygon(50% 0%,98% 91%,2% 91%);filter:drop-shadow(0 4px 3px #23342d47);background:#fff4e3f0;place-items:center;display:grid;position:absolute;inset:0}.player-shape-triangle .triangle-shape:before{content:"";background:linear-gradient(145deg, color-mix(in srgb, var(--marker-color,var(--blue)) 76%, white), var(--marker-color,var(--blue)));clip-path:polygon(50% 7%,91% 85%,9% 85%);position:absolute;inset:0}.player-shape-triangle .triangle-shape:after{content:"";clip-path:polygon(6% 0,94% 0,100% 100%,0 100%);background:#1220192e;height:12%;position:absolute;bottom:15%;left:9%;right:9%}.player-shape-triangle i{z-index:2;font-style:normal;position:relative;top:4px}.marker-ball{color:#27342d;background:radial-gradient(circle at 36% 28%,#fffdf5,#e8e5da 78%);border:2px solid #f7f4e8;border-radius:50%;width:clamp(27px,2.7vw,36px);height:clamp(27px,2.7vw,36px);overflow:hidden;box-shadow:inset -3px -4px 6px #29332d29,0 4px 9px #232f2859}.ball-pattern{pointer-events:none;width:100%;height:100%;display:block}.ball-seams{fill:none;stroke:#344039;stroke-width:4px;stroke-linecap:round;stroke-linejoin:round}.ball-panel,.ball-edge-panels{fill:#26312b}.marker-cone{width:clamp(28px,3vw,40px);height:clamp(34px,3.6vw,48px)}.marker-mini-cone{width:clamp(20px,2.1vw,29px);height:clamp(24px,2.6vw,35px)}.cone-shape{background:linear-gradient(to bottom, color-mix(in srgb, var(--equipment-color,#ed6e24) 82%, white) 0 48%, #fff4df 48% 61%, var(--equipment-color,#ed6e24) 61% 100%);clip-path:polygon(50% 0,76% 76%,95% 76%,100% 94%,0 94%,5% 76%,24% 76%);filter:drop-shadow(0 4px 3px #482b1452);position:absolute;inset:0}.marker-disk{width:clamp(28px,3vw,40px);height:clamp(17px,1.8vw,24px)}.marker-mini-disk{width:clamp(19px,2vw,27px);height:clamp(11px,1.2vw,16px)}.disk-shape{background:linear-gradient(color-mix(in srgb, var(--equipment-color,#ed6e24) 76%, white), var(--equipment-color,#ed6e24));border:2px solid #fff5e2e6;border-radius:50%;position:absolute;inset:1px 0 0;box-shadow:inset 0 -3px #84310c33,0 4px 4px #3b261647}.marker-pole{width:clamp(15px,1.5vw,20px);height:clamp(50px,5vw,68px)}.marker-flag{width:clamp(34px,3.4vw,46px);height:clamp(50px,5vw,68px)}.marker-mannequin{width:clamp(34px,3.4vw,46px);height:clamp(55px,5.5vw,74px)}.pole-shape,.flag-shape,.mannequin-shape{filter:drop-shadow(0 4px 3px #232f284d);position:absolute;inset:0}.pole-shape:before{content:"";background:linear-gradient(90deg, color-mix(in srgb, var(--equipment-color,#ed6e24) 75%, black), color-mix(in srgb, var(--equipment-color,#ed6e24) 72%, white), var(--equipment-color,#ed6e24));border-radius:999px;width:22%;position:absolute;top:0;bottom:10%;left:39%}.pole-shape:after,.flag-shape:after,.mannequin-shape:after{content:"";background:color-mix(in srgb, var(--equipment-color,#ed6e24) 72%, #17211d);height:12%;box-shadow:inset 0 2px 0 color-mix(in srgb, var(--equipment-color,#ed6e24) 72%, white);border-radius:50%;position:absolute;bottom:0;left:8%;right:8%}.flag-shape{background:linear-gradient(90deg, color-mix(in srgb, var(--equipment-color,#ed6e24) 70%, black), color-mix(in srgb, var(--equipment-color,#ed6e24) 76%, white), var(--equipment-color,#ed6e24)) 24% 0 / 10% 92% no-repeat}.flag-shape:before{content:"";background:linear-gradient(135deg, color-mix(in srgb, var(--equipment-color,#ed6e24) 74%, white), var(--equipment-color,#ed6e24));clip-path:polygon(0 0,100% 18%,78% 100%,0 82%);width:62%;height:35%;position:absolute;top:5%;left:31%}.mannequin-shape:before{content:"";background:radial-gradient(circle at 50% 11%, color-mix(in srgb, var(--equipment-color,#ed6e24) 78%, white) 0 10%, transparent 11%), linear-gradient(var(--equipment-color,#ed6e24), var(--equipment-color,#ed6e24)) 50% 35% / 88% 10% no-repeat, linear-gradient(180deg, color-mix(in srgb, var(--equipment-color,#ed6e24) 82%, white), var(--equipment-color,#ed6e24)) 50% 60% / 52% 55% no-repeat, linear-gradient(color-mix(in srgb, var(--equipment-color,#ed6e24) 72%, #17211d), color-mix(in srgb, var(--equipment-color,#ed6e24) 72%, #17211d)) 50% 100% / 9% 22% no-repeat;position:absolute;inset:0 5% 12%}.marker-mini-goal-small{width:clamp(43px,4.2vw,58px);height:clamp(28px,2.9vw,39px)}.marker-mini-goal{width:clamp(58px,5.7vw,78px);height:clamp(36px,3.7vw,50px)}.marker-mini-goal-large{width:clamp(76px,7.5vw,102px);height:clamp(46px,4.7vw,64px)}.marker-mini-goal-small:after,.marker-mini-goal:after,.marker-mini-goal-large:after{border-radius:7px}.mini-goal-shape{--goal-frame-width:clamp(3px, .3vw, 4px);--goal-base-height:clamp(4px, .42vw, 6px);border:var(--goal-frame-width) solid #f5f3e9;border-bottom-width:var(--goal-base-height);background-color:#ebefe824;background-image:linear-gradient(#17211d4d 1px,#0000 1px),linear-gradient(90deg,#17211d4d 1px,#0000 1px);background-size:9px 9px;border-bottom-color:#b9bfb6;border-radius:4px 4px 2px 2px;position:absolute;inset:2px 0 0;box-shadow:0 4px 7px #17211d5c,inset 0 0 0 1px #17211d2e}.mini-goal-shape:after{content:"";right:calc(-1 * var(--goal-frame-width));bottom:calc(-1 * var(--goal-base-height));left:calc(-1 * var(--goal-frame-width));height:var(--goal-base-height);pointer-events:none;background:linear-gradient(#e2e2d9 0 42%,#a7afa7 42% 100%);border-radius:0 0 2px 2px;position:absolute;box-shadow:inset 0 1px #ffffffb3,0 1px 1px #17211d38}.selected-equipment-delete,.selected-zone-delete{--delete-offset-x:24px;--delete-offset-y:-24px;z-index:12;color:#657169;cursor:pointer;opacity:.64;touch-action:manipulation;width:28px;height:28px;transform:translate(-50%, -50%) translate(var(--delete-offset-x), var(--delete-offset-y));-webkit-tap-highlight-color:transparent;background:#f7f7f2db;border:1px solid #4d59523d;border-radius:50%;place-items:center;padding:0;transition:opacity .13s,background-color .13s,color .13s;display:grid;position:absolute;box-shadow:0 2px 7px #17211d24}.selected-equipment-delete.delete-mini-goal-small{--delete-offset-x:calc(clamp(21.5px, 2.1vw, 29px) + 2px);--delete-offset-y:calc(-1 * clamp(14px, 1.45vw, 19.5px) - 2px)}.selected-equipment-delete.delete-mini-goal{--delete-offset-x:calc(clamp(29px, 2.85vw, 39px) + 2px);--delete-offset-y:calc(-1 * clamp(18px, 1.85vw, 25px) - 2px)}.selected-equipment-delete.delete-mini-goal-large{--delete-offset-x:calc(clamp(38px, 3.75vw, 51px) + 2px);--delete-offset-y:calc(-1 * clamp(23px, 2.35vw, 32px) - 2px)}.selected-zone-delete{pointer-events:auto;transform:translate(-50%,-50%)}.selected-equipment-delete svg,.selected-zone-delete svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:13px;height:13px}.selected-equipment-delete:active,.selected-zone-delete:active{opacity:1;color:#435048;background:#fff}.selected-equipment-delete:focus-visible,.selected-zone-delete:focus-visible{outline-offset:2px;opacity:1;outline:2px solid #17211d}@media (hover:hover) and (pointer:fine){.selected-equipment-delete:hover,.selected-zone-delete:hover{opacity:1;color:#435048;background:#fff}}.marker.is-selected:after{border-color:#ffffffeb;box-shadow:0 0 0 2px #18291e29}.marker.is-dragging{z-index:9;cursor:grabbing;transform:translate(-50%, -50%) rotate(var(--marker-rotation,0deg)) scale(1.15);filter:brightness(1.05)}.marker:focus-visible:after{border-color:#fff;outline:3px solid #14271b}@media (max-width:1366px),(pointer:coarse){.workspace{grid-template-columns:68px minmax(0,1fr)}.tool-rail{padding-right:9px;padding-left:max(9px, env(safe-area-inset-left));gap:14px}.tool-button,.option-button{padding:6px}.primary-tools,.drawing-tools,.capture-tools{padding-top:14px}.board-wrap{padding:max(7px, env(safe-area-inset-top)) max(7px, env(safe-area-inset-right)) max(7px, env(safe-area-inset-bottom)) 7px}.pitch{border-width:6px}.zone-panel,.pen-panel,.layers-panel,.preset-panel,.team-colors-panel,.equipment-panel,.drawing-panel-stack{top:14px;left:14px}}@media (max-width:820px),(orientation:portrait) and (max-width:1024px){.workspace{grid-template-columns:68px minmax(0,1fr)}.tool-rail{padding-right:7px;padding-left:max(7px, env(safe-area-inset-left));align-items:center;gap:12px}.rail-header{justify-items:center;width:100%;padding-bottom:11px}.tool-group{width:100%}.tool-button,.option-button{justify-content:center;min-height:42px;padding:5px;font-size:0}.mini-marker{flex-basis:32px;width:32px;height:32px}.option-icon{width:32px;height:32px}.primary-tools,.drawing-tools,.capture-tools{padding-top:12px}.zone-panel,.pen-panel,.layers-panel,.preset-panel,.team-colors-panel,.equipment-panel,.drawing-panel-stack{width:min(280px,100% - 24px);top:12px;left:12px}.marker{width:clamp(29px,5vw,38px);height:clamp(29px,5vw,38px)}.marker-cone{width:32px;height:40px}.marker-mini-cone{width:23px;height:29px}.marker-mini-goal-small{width:44px;height:29px}.marker-mini-goal{width:62px;height:40px}.marker-mini-goal-large{width:82px;height:52px}.saved-boards-modal{max-height:calc(100dvh - max(24px, env(safe-area-inset-top)) - max(24px, env(safe-area-inset-bottom)))}.saved-board-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.saved-recording-card{grid-template-columns:112px minmax(0,1fr)}.saved-recording-thumbnail{width:112px}.saved-recording-card>.saved-recording-card-actions{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.saved-recording-card-actions button{width:100%}}@media (max-width:520px){.saved-boards-backdrop{padding:8px}.saved-boards-modal{border-radius:15px;max-height:calc(100dvh - 16px)}.saved-boards-header{padding:16px 16px 13px}.saved-boards-header h2{font-size:21px}.saved-boards-actions{padding:12px 16px}.saved-boards-content{padding:14px 16px 18px}.saved-board-grid{grid-template-columns:1fr}.saved-board-preview-footer{flex-direction:column;align-items:flex-start}.saved-recording-card{grid-template-columns:92px minmax(0,1fr);gap:9px;padding:10px}.saved-recording-thumbnail{width:92px}.saved-recording-card>.saved-recording-card-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.saved-recordings-note{padding-left:16px;padding-right:16px}.restore-confirm-backdrop{padding:10px}.restore-confirm-modal{border-radius:16px;padding:23px 18px 18px}.restore-confirm-actions{grid-template-columns:1fr}.video-export-backdrop{padding:8px}.video-export-modal{border-radius:15px;max-height:calc(100dvh - 16px);padding:21px 16px}.video-export-actions{grid-template-columns:1fr}}@media (orientation:portrait) and (max-width:1024px){.board-wrap{overflow:hidden;container-type:size}.zone-panel,.pen-panel,.layers-panel,.preset-panel,.team-colors-panel,.equipment-panel,.drawing-panel-stack{z-index:100;top:max(12px, env(safe-area-inset-top));left:calc(68px + max(12px, env(safe-area-inset-left)));width:min(320px, calc(100vw - 92px - env(safe-area-inset-left) - env(safe-area-inset-right)));overscroll-behavior:contain;max-height:calc(100dvh - 24px);position:fixed;overflow:hidden auto}.team-colors-panel,.equipment-panel{width:min(420px, calc(100vw - 92px - env(safe-area-inset-left) - env(safe-area-inset-right)))}.pitch{transform-origin:50%;flex:none;width:100cqh;height:100cqw;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(90deg)}.marker{transform:translate(-50%, -50%) rotate(calc(var(--marker-rotation,0deg) - 90deg))}.selected-equipment-delete{transform:translate(-50%, -50%) translate(var(--delete-offset-x), var(--delete-offset-y)) rotate(-90deg)}.selected-zone-delete{transform:translate(-50%,-50%)rotate(-90deg)}.marker.is-dragging{transform:translate(-50%, -50%) rotate(calc(var(--marker-rotation,0deg) - 90deg)) scale(1.15)}}@media (orientation:landscape){.board-wrap.is-half-field{overflow:hidden;container-type:size}.board-wrap.is-half-field .pitch{transform-origin:50%;flex:none;width:100cqh;height:100cqw;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(90deg)}.board-wrap.is-half-field .marker{transform:translate(-50%, -50%) rotate(calc(var(--marker-rotation,0deg) - 90deg))}.board-wrap.is-half-field .selected-equipment-delete{transform:translate(-50%, -50%) translate(var(--delete-offset-x), var(--delete-offset-y)) rotate(-90deg)}.board-wrap.is-half-field .selected-zone-delete{transform:translate(-50%,-50%)rotate(-90deg)}.board-wrap.is-half-field .marker.is-dragging{transform:translate(-50%, -50%) rotate(calc(var(--marker-rotation,0deg) - 90deg)) scale(1.15)}}@media (prefers-reduced-motion:reduce){*{transition-duration:.001ms!important}.pen-expanded-options,.zone-expanded-options,.recording-status>span,.record-button.is-recording .record-icon i{animation:none}}