:root{color-scheme:dark;font-family:system-ui,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}.app-dialog{width:min(420px,calc(100vw - 2rem));padding:0;border:1px solid #333a47;border-radius:10px;background:#1b2029;color:#f2f2f2;font-family:system-ui,sans-serif;box-shadow:0 18px 50px #0000008c}.app-dialog::backdrop{background:#080a0e99}.app-dialog-form{display:flex;flex-direction:column;gap:.9rem;padding:1.25rem}.app-dialog-form h2{margin:0;font-size:1rem;font-weight:600}.app-dialog-message{margin:0;font-size:.85rem;line-height:1.45;color:#9aa4b2}.app-dialog-input{background:#14181f;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.5rem .65rem;font-size:.9rem;font-family:inherit}.app-dialog-input:focus{outline:none;border-color:#3f6fed}.app-dialog-choices{display:flex;flex-direction:column;gap:.3rem;max-height:240px;overflow-y:auto;margin:0;padding:0;list-style:none}.app-dialog-choices button{display:flex;align-items:center;justify-content:space-between;gap:.75rem;width:100%;background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.45rem .65rem;font-size:.85rem;font-family:inherit;text-align:left;cursor:pointer}.app-dialog-choices button:hover{background:#2a3140;border-color:#3f6fed}.app-dialog-choice-hint{color:#9aa4b2;font-size:.78rem}.app-dialog-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.25rem}.app-dialog-actions button{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.45rem .9rem;font-size:.85rem;font-family:inherit;cursor:pointer}.app-dialog-actions button:hover{background:#2a3140}.app-dialog-actions button.primary{background:#3f6fed;border-color:#3f6fed}.app-dialog-actions button.primary:hover{background:#5480f0}.app-dialog-actions button.danger{background:#d92626;border-color:#d92626}.app-dialog-actions button.danger:hover{background:#e53f3f}.share-dialog{width:min(520px,calc(100vw - 2rem))}.share-invite-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,110px) auto;gap:.5rem}.share-invite-row .app-dialog-input{min-width:0}.share-new-link{background:#14181f;border:1px solid #333a47;border-radius:8px;padding:.65rem .75rem}.share-new-link p{margin:0 0 .5rem;font-size:.8rem;color:#9aa4b2}.share-new-link-row{display:flex;gap:.5rem}.share-new-link-row .app-dialog-input{flex:1;font-size:.78rem}.share-collaborator-list{display:flex;flex-direction:column;gap:.4rem;max-height:260px;overflow-y:auto;margin:0;padding:0;list-style:none}.share-empty{color:#9aa4b2;font-size:.85rem;padding:.5rem 0}.share-collaborator-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,100px) auto;align-items:center;gap:.5rem;background:#1f2530;border:1px solid #333a47;border-radius:6px;padding:.45rem .6rem}.share-collaborator-row .app-dialog-input{min-width:0}.share-collaborator-info{display:flex;flex-direction:column;min-width:0}.share-collaborator-name{font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.share-collaborator-status{font-size:.72rem;color:#9aa4b2}.comment-thread{position:absolute;z-index:20;width:260px;max-height:320px;display:flex;flex-direction:column;background:#1b2029;border:1px solid #333a47;border-radius:8px;box-shadow:0 12px 30px #00000080;font-family:system-ui,sans-serif;color:#f2f2f2;transform:translate(12px,-12px)}.comment-thread-header{display:flex;align-items:center;justify-content:space-between;padding:.4rem .6rem;border-bottom:1px solid #333a47}.comment-status{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:#ffd400}.comment-status.resolved{color:#9aa4b2}.comment-thread-close{background:none;border:none;color:#9aa4b2;font-size:1rem;line-height:1;cursor:pointer;padding:.1rem .3rem}.comment-thread-close:hover{color:#f2f2f2}.comment-thread-body{overflow-y:auto;padding:.4rem .6rem;display:flex;flex-direction:column;gap:.5rem}.comment-item p{margin:.15rem 0 0;font-size:.82rem;line-height:1.35;word-wrap:break-word}.comment-item-head{display:flex;justify-content:space-between;gap:.5rem;font-size:.75rem}.comment-item-time{color:#9aa4b2;white-space:nowrap}.comment-item-delete{background:none;border:none;color:#e35c5c;font-size:.72rem;padding:.15rem 0;cursor:pointer}.comment-item-delete:hover{text-decoration:underline}.comment-thread-reply{display:flex;gap:.4rem;padding:.5rem .6rem;border-top:1px solid #333a47}.comment-thread-reply input{flex:1;min-width:0;background:#14181f;color:#f2f2f2;border:1px solid #333a47;border-radius:5px;padding:.3rem .5rem;font-size:.8rem}.comment-thread-reply button{background:#3f6fed;color:#fff;border:none;border-radius:5px;padding:.3rem .6rem;font-size:.8rem;cursor:pointer}.comment-thread-reply button:disabled{background:#333a47;cursor:default}.comment-thread-resolve{margin:0 .6rem .55rem;background:#1f2530;border:1px solid #333a47;color:#f2f2f2;border-radius:5px;padding:.3rem .6rem;font-size:.78rem;cursor:pointer}.comment-thread-resolve:hover{background:#2a3140}.language-picker{position:relative;flex-shrink:0}.language-trigger{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .6rem;background:transparent;color:#9aa4b2;border:1px solid #333a47;border-radius:6px;font-size:.8rem;cursor:pointer;white-space:nowrap}.language-trigger:hover{color:#f2f2f2;border-color:#555f70}.language-menu{position:absolute;top:calc(100% + .35rem);inset-inline-end:0;z-index:40;list-style:none;margin:0;padding:.25rem;min-width:150px;background:#1b2029;border:1px solid #333a47;border-radius:8px;box-shadow:0 14px 34px #00000080}.language-menu button{display:block;width:100%;padding:.4rem .6rem;background:none;border:0;border-radius:5px;color:#cdd4de;font-size:.86rem;text-align:start;cursor:pointer}.language-menu button:hover{background:#232a37;color:#f2f2f2}.language-menu button.active{background:#263043;color:#fff;font-weight:600}.board-editor{display:flex;flex-direction:column;height:100vh;font-family:system-ui,sans-serif;background:#14181f;color:#f2f2f2}.board-editor.focus-mode .board-header{display:none}.focus-mode-exit{position:absolute;top:.6rem;right:.6rem;z-index:20;display:flex;align-items:center;gap:.35rem;padding:.35rem .65rem;background:#14181fd9;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;font-size:.78rem;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.focus-mode-exit:hover{background:#1f2530}.board-header{display:flex;align-items:center;gap:.9rem;padding:.3rem .6rem;border-bottom:1px solid #2a2f3a;flex-shrink:0;flex-wrap:nowrap;position:relative;z-index:1}.board-header>.back-link,.board-header>.project-heading{flex-shrink:0}.board-header h1{font-size:1.1rem;margin:0;white-space:nowrap}.back-link{display:flex;align-items:center;gap:.45rem;color:#9aa4b2;text-decoration:none;font-size:.85rem;white-space:nowrap}.back-link:hover{color:#f2f2f2}.project-heading{display:flex;flex-direction:column;line-height:1.2;margin-right:.5rem}.project-heading h1{font-size:1rem}.project-subtitle{font-size:.75rem;color:#9aa4b2}.save-button{margin-inline-start:auto;flex-shrink:0;white-space:nowrap;background:#3f6fed;color:#fff;border:1px solid #3f6fed;border-radius:6px;padding:.4rem 1rem;font-size:.85rem;cursor:pointer}.save-button:disabled{background:#1f2530;border-color:#333a47;color:#9aa4b2;cursor:default}.save-button-readonly{display:inline-flex;align-items:center;background:#1f2530;border:1px solid #333a47;color:#9aa4b2;cursor:default}.collab-presence{margin-inline-start:auto;flex-shrink:0;display:flex;align-items:center}.collab-avatar-stack{display:flex}.collab-avatar{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:2px solid #0d0f14;margin-left:-8px;font-size:.7rem;font-weight:700;color:#14181f}.collab-avatar:first-child{margin-left:0}.collab-avatar-overflow{background:#333a47;color:#f2f2f2}.collab-reconnecting{font-size:.78rem;color:#9aa4b2;white-space:nowrap}.editor-toolbar{position:relative;display:flex;align-items:center;gap:.3rem;flex-wrap:nowrap;flex:1 1 auto;min-width:0}.toolbar-scroll{display:flex;align-items:center;gap:.3rem;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none}.toolbar-scroll::-webkit-scrollbar{display:none}.toolbar-divider{width:1px;align-self:stretch;margin:.1rem .05rem;background:#2a2f3a;flex-shrink:0}.tool-group{display:flex;align-items:center;gap:.22rem;flex-shrink:0}.editor-toolbar button,.side-toggle button,.formation-list button,.recordings-controls button,.screenshots-controls button{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.35rem .7rem;font-size:.85rem;cursor:pointer}.recordings-controls button:hover,.screenshots-controls button:hover{background:#2a3140}.recordings-controls button:disabled{opacity:.4;cursor:not-allowed}.editor-toolbar button{padding:.3rem .45rem;font-size:.78rem}.editor-toolbar button:hover,.side-toggle button:hover,.formation-list button:hover{background:#2a3140}.editor-toolbar button.active,.side-toggle button.active{background:#3f6fed;border-color:#3f6fed}.editor-toolbar button:disabled{opacity:.4;cursor:not-allowed}.editor-toolbar button.tool-button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;color:#cdd4de}.editor-toolbar button.tool-button:hover{color:#f2f2f2}.editor-toolbar button.tool-button.active{color:#fff}.editor-toolbar button.recording,.recordings-controls button.recording{background:#d92626;border-color:#d92626;animation:recording-pulse 1.2s ease-in-out infinite}@keyframes recording-pulse{0%,to{opacity:1}50%{opacity:.6}}.editor-toolbar .download-link{display:inline-flex;align-items:center;background:#1f8a3d;color:#f2f2f2;border:1px solid #1f8a3d;border-radius:6px;padding:.35rem .7rem;font-size:.85rem;text-decoration:none}.editor-toolbar .download-link:hover{background:#23a347}.editor-toolbar .hint{align-self:center;font-size:.8rem;color:#9aa4b2;white-space:nowrap}.tool-options{position:absolute;top:calc(100% + .5rem);left:var(--tool-options-left, 0px);z-index:6;display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;min-width:160px;max-width:min(90vw,380px);padding:.6rem .75rem;background:#1b2029;border:1px solid #333a47;border-radius:8px;box-shadow:0 14px 34px #00000080}.tool-options .hint{align-self:flex-start;white-space:normal}.tool-options-swatches{display:flex;gap:.3rem}.tool-options-swatches .swatch{width:20px;height:20px;border-radius:50%;border:2px solid #333a47;padding:0;cursor:pointer}.tool-options-swatches .swatch.active{border-color:#3f6fed}.tool-options-sizes{display:flex;align-items:center;gap:.3rem}.tool-options-sizes .size-step{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;background:#1f2530;border:1px solid #333a47;border-radius:4px;cursor:pointer}.tool-options-sizes .size-step.active{border-color:#3f6fed}.tool-options-sizes .size-step span{display:block;border-radius:50%;background:#f2f2f2}.tool-options-thickness{display:flex;gap:.3rem}.tool-options-thickness button{width:24px;height:24px;padding:0}.tool-options-stroke-style{display:flex;gap:.3rem}.tool-options-stroke-style button{display:flex;align-items:center;justify-content:center;width:38px;height:24px;padding:0}.marker-grid{display:grid;grid-template-columns:repeat(10,26px);gap:3px}.marker-grid .marker-swatch{display:flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;font-size:.95rem;line-height:1;background:#1f2530;border:1px solid #333a47;border-radius:4px;color:#f2f2f2;cursor:pointer}.marker-grid .marker-swatch:hover{background:#2a3140}.marker-grid .marker-swatch.active{border-color:#3f6fed;background:#3f6fed}.tool-options-slider{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:#9aa4b2}.board-splash{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.board-body{flex:1;display:flex;min-height:0}.board-sidebar{width:320px;flex-shrink:0;border-right:1px solid #2a2f3a;display:flex;flex-direction:column;min-height:0;transition:width .18s ease}.board-sidebar.collapsed{width:0;border-right:none;overflow:hidden}.sidebar-toggle{flex-shrink:0;width:16px;padding:0;background:#171c25;color:#9aa4b2;border:none;border-right:1px solid #2a2f3a;font-size:.9rem;line-height:1;cursor:pointer}.sidebar-toggle:hover{background:#222937;color:#f2f2f2}.sidebar-tabs{display:flex;flex-shrink:0;border-bottom:1px solid #2a2f3a;overflow-x:auto;scrollbar-width:none}.sidebar-tabs::-webkit-scrollbar{display:none}.sidebar-tabs button{flex:1;background:transparent;color:#9aa4b2;border:none;border-bottom:2px solid transparent;padding:.55rem .15rem;font-size:.74rem;white-space:nowrap;cursor:pointer}.sidebar-tabs button:hover{color:#f2f2f2}.sidebar-tabs button.active{color:#f2f2f2;border-bottom-color:#3f6fed}.sidebar-panel{flex:1;min-height:0;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:1.5rem}.board-sidebar h3{margin:0 0 .25rem;font-size:.9rem;text-transform:uppercase;letter-spacing:.04em;color:#9aa4b2}.hint{margin:0 0 .5rem;font-size:.75rem;color:#6b7280}.palette-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.palette-chip{display:flex;align-items:center;gap:.4rem;background:#1f2530;border:1px solid #333a47;border-radius:6px;padding:.4rem .5rem;font-size:.8rem;cursor:grab}.palette-chip-disabled{cursor:not-allowed;opacity:.45}.chip-swatch{width:12px;height:12px;border-radius:50%;border:1px solid rgba(255,255,255,.4);flex-shrink:0}.side-toggle{display:flex;gap:.4rem;margin-bottom:.5rem}.formation-list{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.board-main{flex:1;display:flex;align-items:center;justify-content:center;padding:.25rem;min-width:0;min-height:0;overflow:auto;position:relative}.pitch-canvas{position:relative;width:100%;max-width:1400px;display:flex;align-items:center;justify-content:center}.pitch-zoom-reset{position:absolute;right:.6rem;bottom:.6rem;z-index:3;padding:.25rem .55rem;border:1px solid #3a3f48;border-radius:6px;background:#14161ad9;color:#d7dae0;font-size:.72rem;font-variant-numeric:tabular-nums;cursor:pointer}.pitch-zoom-reset:hover{background:#202329f2;color:#fff}.board-main .pane{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;align-self:stretch}.board-main .pane-2d{flex:1;container-type:size;position:relative}.board-main .pane-2d .pitch-canvas{width:min(100%,calc(100cqh * var(--pitch-l, 105) / var(--pitch-w, 68)));max-width:none}.board-main .pane-2d .pitch-canvas.pitch-canvas-vertical{width:min(100%,calc(100cqh * var(--pitch-w, 68) / var(--pitch-l, 105)))}.board-main .pane-2d .pitch-canvas.pitch-canvas-area-half:not(.pitch-canvas-vertical){width:min(100%,calc(100cqh * var(--pitch-l, 105) / var(--pitch-w, 68) / 2))}.pitch-3d{position:relative;width:100%;height:100%;min-height:160px;background:#10141b;border:1px solid #2a2f3a;border-radius:8px;overflow:hidden;cursor:grab}.pitch-3d:active{cursor:grabbing}.pitch-3d-hint{position:absolute;left:50%;bottom:.5rem;transform:translate(-50%);padding:.2rem .6rem;border-radius:999px;background:#0c1016b3;color:#9aa4b2;font-size:.72rem;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s ease}.pitch-3d:hover .pitch-3d-hint{opacity:1}.view-mode-camera{display:flex;flex-direction:column;gap:.15rem;margin-top:.2rem;padding-top:.35rem;border-top:1px solid #2a2f3a}.editor-toolbar .view-mode-reset{justify-content:center;margin-top:.25rem;font-size:.8rem}.board-main.view-floating .pane-3d{position:absolute;right:1.5rem;bottom:1.5rem;width:34%;min-width:240px;height:38%;min-height:170px;box-shadow:0 16px 40px #00000080;border-radius:8px}.board-main.view-split-h{gap:1rem;align-items:stretch}.board-main.view-split-h .pane{flex:1}.board-main.view-split-h .pitch-canvas{max-width:100%}.board-main.view-split-v{flex-direction:column;gap:1rem;align-items:stretch}.board-main.view-split-v .pane{flex:1}.view-mode{position:relative}.editor-toolbar .view-mode-trigger{display:inline-flex;align-items:center;gap:.2rem;height:34px;padding:0 .4rem;color:#cdd4de}.editor-toolbar .view-mode-trigger.active{color:#fff;border-color:#3f6fed}.view-mode-caret{font-size:.6rem;line-height:1}.view-mode-menu{position:absolute;top:calc(100% + .5rem);right:0;z-index:6;display:flex;flex-direction:column;gap:.15rem;min-width:232px;padding:.4rem;background:#1b2029;border:1px solid #333a47;border-radius:8px;box-shadow:0 14px 34px #00000080}.editor-toolbar .view-mode-menu button{display:flex;align-items:center;gap:.6rem;width:100%;background:transparent;border:1px solid transparent;color:#e6ebf2;text-align:left;padding:.4rem .5rem}.editor-toolbar .view-mode-menu button:hover{background:#2a3140}.editor-toolbar .view-mode-menu button.active{background:#3f6fed;border-color:#3f6fed;color:#fff}.view-mode-tilt{display:flex;align-items:center;gap:.4rem;padding:.15rem .5rem;font-size:.78rem;color:#9aa4b2}.view-mode-tilt>span:first-child{width:38px;flex-shrink:0}.view-mode-tilt>span:last-child{width:34px;flex-shrink:0;text-align:right}.view-mode-tilt input{flex:1;min-width:0}.field-settings{position:relative}.field-settings-panel{position:absolute;top:calc(100% + .5rem);left:0;z-index:6;display:grid;grid-template-columns:1fr 1fr;gap:0 1.5rem;min-width:420px;padding:.9rem 1rem;background:#1b2029;border:1px solid #333a47;border-radius:8px;box-shadow:0 14px 34px #00000080}.field-settings-col{display:flex;flex-direction:column;gap:.4rem}.field-settings-orientation{grid-column:1 / -1;display:flex;flex-direction:column;gap:.5rem;padding-bottom:.7rem;margin-bottom:.3rem;border-bottom:1px solid #2a2f3a}.field-settings-orientation h4{margin:0;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:#9aa4b2}.field-settings-template-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem}.field-settings-template{display:flex;align-items:center;justify-content:center;background:#1f2530;border:1px solid #333a47;border-radius:6px;padding:.4rem;color:#9aa4b2;cursor:pointer}.field-settings-template:hover{background:#2a3140;color:#cdd4de}.field-settings-template.active{background:#3f6fed22;border-color:#3f6fed;color:#fff}.field-settings-col h4{margin:.7rem 0 .1rem;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:#9aa4b2}.field-settings-col h4:first-child{margin-top:0}.field-settings-label{font-size:.78rem;color:#cdd4de}.field-settings-size-row{display:flex;gap:.3rem;flex-wrap:wrap}.field-settings-size-row button{background:#1f2530;color:#cdd4de;border:1px solid #333a47;border-radius:5px;padding:.25rem .5rem;font-size:.72rem;cursor:pointer}.field-settings-size-row button:hover{background:#2a3140}.field-settings-size-row button.active{background:#3f6fed;border-color:#3f6fed;color:#fff}.field-settings-flip{align-self:flex-start;display:inline-flex;align-items:center;gap:.35rem;background:#1f2530;color:#cdd4de;border:1px solid #333a47;border-radius:16px;padding:.3rem .7rem;font-size:.75rem;cursor:pointer;margin-bottom:.2rem}.field-settings-flip:hover{background:#2a3140}.field-settings-flip.active{background:#3f6fed;border-color:#3f6fed;color:#fff}.field-settings-color-row{display:flex;align-items:center;justify-content:space-between;font-size:.82rem;color:#e6ebf2}.field-settings-color-row input[type=color]{width:28px;height:22px;padding:0;border:1px solid #333a47;border-radius:4px;background:none;cursor:pointer}.field-settings-toggle{display:flex;align-items:center;justify-content:space-between;font-size:.82rem;color:#e6ebf2;cursor:pointer;padding:.15rem 0}.field-settings-toggle .switch{position:relative;display:inline-block;width:34px;height:19px;flex-shrink:0;background:#333a47;border-radius:10px;transition:background .15s ease}.field-settings-toggle .switch.on{background:#3f6fed}.field-settings-toggle .switch-knob{position:absolute;top:2px;left:2px;width:15px;height:15px;background:#f2f2f2;border-radius:50%;transition:transform .15s ease}.field-settings-toggle .switch.on .switch-knob{transform:translate(15px)}.roster-panel{display:flex;flex-direction:column;gap:.5rem}.roster-panel h3{margin:0 0 .25rem;font-size:.9rem;text-transform:uppercase;letter-spacing:.04em;color:#9aa4b2}.roster-side h4{margin:.5rem 0 .35rem;font-size:.8rem;color:#c2c9d4}.roster-row{display:flex;gap:.35rem;margin-bottom:.35rem}.roster-row-draggable{cursor:grab;border-radius:6px}.roster-row-draggable:hover{background:#1f2530}.roster-number{width:2.5rem;background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.3rem .35rem;font-size:.8rem}.roster-name{flex:1;min-width:0;background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.3rem .5rem;font-size:.8rem}.roster-remove{flex:0 0 auto;background:transparent;border:1px solid #333a47;border-radius:6px;color:#ff6a6a;width:1.8rem;cursor:pointer}.roster-add{align-self:flex-start;background:transparent;border:1px dashed #333a47;border-radius:6px;color:#9aa4b2;padding:.25rem .6rem;font-size:.75rem;cursor:pointer}.roster-add:hover{color:#f2f2f2;border-color:#555f70}.roster-save{margin-top:.5rem;background:#1f8a3d;border:1px solid #1f8a3d;color:#fff;border-radius:6px;padding:.4rem .7rem;font-size:.85rem;cursor:pointer}.roster-save:disabled{background:#1f2530;border-color:#333a47;color:#9aa4b2;cursor:default}.recordings-panel{display:flex;flex-direction:column;gap:.4rem}.recordings-panel h3{margin:0 0 .25rem;font-size:.9rem;text-transform:uppercase;letter-spacing:.04em;color:#9aa4b2}.recordings-controls,.screenshots-controls{display:flex;align-items:center;gap:.5rem;margin-bottom:.2rem}.recordings-list{display:flex;flex-direction:column;gap:.35rem}.recording-item{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem}.recording-row{flex:1;display:flex;justify-content:space-between;align-items:center;gap:.5rem;background:#1f2530;border:1px solid #333a47;border-radius:6px;padding:.4rem .6rem;color:#f2f2f2;font-size:.78rem;cursor:pointer;text-align:left}.recording-row:hover{background:#2a3140}.recording-size{color:#9aa4b2;font-size:.72rem;white-space:nowrap}.recording-remove{flex:0 0 auto;background:transparent;border:1px solid #333a47;border-radius:6px;color:#ff6a6a;width:1.8rem;height:1.8rem;cursor:pointer}.recording-video{width:100%;border-radius:6px;margin-top:.2rem}.screenshots-panel{display:flex;flex-direction:column;gap:.4rem}.screenshots-panel h3{margin:0 0 .25rem;font-size:.9rem;text-transform:uppercase;letter-spacing:.04em;color:#9aa4b2}.screenshots-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.screenshot-item{position:relative;display:block;border-radius:6px;overflow:hidden;border:1px solid #333a47;aspect-ratio:4 / 3;background:#1f2530}.screenshot-item img{width:100%;height:100%;object-fit:cover;display:block}.screenshot-remove{position:absolute;top:.25rem;right:.25rem;width:1.4rem;height:1.4rem;display:flex;align-items:center;justify-content:center;background:#14181fcc;border:none;border-radius:50%;color:#ff6a6a;font-size:.9rem;line-height:1;cursor:pointer}.screenshot-remove:hover{background:#3a1f22e6}.publish-panel{display:flex;flex-direction:column;gap:.75rem}.publish-panel h3{margin:0;font-size:.9rem;text-transform:uppercase;letter-spacing:.04em;color:#9aa4b2}.publish-field{display:flex;flex-direction:column;gap:.3rem;font-size:.82rem;color:#c2c9d4}.publish-field input,.publish-field select,.publish-field textarea{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.45rem .6rem;font-size:.85rem;font-family:inherit;resize:vertical}.publish-error{color:#ff8a80;font-size:.8rem}.publish-stats{color:#9aa4b2;font-size:.8rem}.publish-button,.publish-unpublish{background:#3f6fed;color:#fff;border:1px solid #3f6fed;border-radius:6px;padding:.55rem 1rem;font-size:.88rem;cursor:pointer}.publish-button:disabled{opacity:.5;cursor:not-allowed}.publish-unpublish{background:#1f2530;border-color:#333a47;color:#f2f2f2}.timeline-panel{position:absolute;left:50%;bottom:1rem;transform:translate(-50%);z-index:5;display:flex;flex-direction:column;align-items:stretch;gap:.4rem;width:max-content;max-width:min(220px,calc(100% - 2rem));padding:.4rem .55rem;background:#14181feb;border:1px solid #333a47;border-radius:8px;box-shadow:0 14px 34px #00000080;font-size:.78rem}.timeline-grip{display:flex;align-items:center;justify-content:center;height:12px;margin:-.4rem -.55rem 0;padding:.15rem 0;color:#555f70;cursor:grab;border-radius:8px 8px 0 0;-webkit-user-select:none;user-select:none;touch-action:none}.timeline-grip:hover{color:#9aa4b2;background:#1f2530}.timeline-grip:active{cursor:grabbing}.timeline-frames{display:flex;align-items:center;flex-wrap:wrap;gap:.25rem}.timeline-frame-chip{cursor:grab;border-radius:6px}.timeline-frame-chip.dragging{opacity:.35}.timeline-frame{display:flex;align-items:center;justify-content:center;width:22px;height:22px;padding:0;background:#1f2530;color:#9aa4b2;border:1px solid #333a47;border-radius:5px;font-size:.7rem;cursor:pointer}.timeline-frame.active{border-color:#3f6fed;box-shadow:0 0 0 1px #3f6fed inset;color:#f2f2f2}.timeline-frame-number{font-size:.7rem}.timeline-frame-add{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;background:#1f2530;color:#9aa4b2;border:1px solid #333a47;border-radius:5px;font-size:.75rem;cursor:pointer}.timeline-controls,.timeline-playback{display:flex;align-items:center;flex-wrap:wrap;gap:.3rem;padding-top:.4rem;border-top:1px solid #333a47}.timeline-controls button,.timeline-playback button{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:5px;padding:.22rem .4rem;font-size:.72rem;cursor:pointer}.timeline-controls button:disabled,.timeline-playback button:disabled,.timeline-playback select:disabled,.timeline-frame:disabled,.timeline-frame-add:disabled{opacity:.4;cursor:not-allowed}.timeline-duration,.timeline-easing{display:flex;align-items:center;gap:.25rem;font-size:.68rem;color:#9aa4b2}.timeline-duration input,.timeline-easing select,.timeline-speed{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:5px;padding:.2rem .3rem;font-size:.7rem}.timeline-duration input{width:2.6rem}.timeline-play{font-size:.8rem}.timeline-play.active{background:#d92626;border-color:#d92626}.timeline-loop.active{background:#3f6fed;border-color:#3f6fed}.timeline-export{white-space:nowrap}.timeline-export:disabled{opacity:.4;cursor:not-allowed}[dir=rtl] .board-body,[dir=rtl] .board-main,[dir=rtl] .editor-toolbar{direction:ltr}[dir=rtl] .board-sidebar,[dir=rtl] .editor-toolbar button,[dir=rtl] .tool-options,[dir=rtl] .field-settings-panel,[dir=rtl] .view-mode-menu,[dir=rtl] .timeline-panel{direction:rtl}.board-main.view-3d{align-items:stretch}.board-main.view-3d .pane-3d{flex:1;min-width:0;min-height:0}.view-mode-eagle{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;margin-top:.25rem;font-size:.8rem}.editor-toolbar .toolbar-link{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.3rem .45rem;font-size:.78rem;text-decoration:none;white-space:nowrap;cursor:pointer}.editor-toolbar .toolbar-link:hover{background:#2a3140}.app-nav{display:flex;align-items:center;gap:.2rem;margin-inline-start:.5rem}.app-nav a{padding:.35rem .75rem;border-radius:6px;color:#9aa4b2;text-decoration:none;font-size:.88rem;white-space:nowrap}.app-nav a:hover{background:#1f2530;color:#f2f2f2}.app-nav a.active{background:#232a37;color:#f2f2f2;font-weight:600}.import-match-dialog{width:min(480px,calc(100vw - 2rem))}.import-match-mode{display:flex;gap:.4rem}.import-match-mode button{flex:1;background:#1f2530;color:#9aa4b2;border:1px solid #333a47;border-radius:6px;padding:.4rem;font-size:.82rem;cursor:pointer}.import-match-mode button.active{color:#fff;border-color:#3f6fed;background:#26314a}.import-match-search{display:flex;gap:.5rem}.import-match-search .app-dialog-input{flex:1;min-width:0}.import-match-search .import-match-season{flex:0 0 90px}.import-match-error{margin:0;font-size:.82rem;color:#ff6b6b}.import-match-results{display:flex;flex-direction:column;gap:.4rem;max-height:320px;overflow-y:auto;margin:0;padding:0;list-style:none}.import-match-results button{position:relative;display:flex;flex-direction:column;gap:.2rem;width:100%;background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.55rem .7rem;font-family:inherit;text-align:left;cursor:pointer}.import-match-results button:hover:not(:disabled){background:#2a3140;border-color:#3f6fed}.import-match-results button:disabled{opacity:.5;cursor:default}.import-match-teams{display:flex;align-items:center;gap:.5rem;font-size:.88rem;font-weight:600}.import-match-teams span:first-child,.import-match-teams span:last-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.import-match-teams span:last-child{text-align:right}.import-match-score{flex-shrink:0;color:#9aa4b2;font-weight:400;font-size:.78rem}.import-match-meta{display:flex;justify-content:space-between;gap:.5rem;font-size:.72rem;color:#9aa4b2}.import-match-importing{position:absolute;right:.7rem;bottom:.5rem;font-size:.75rem;color:#3f6fed}.import-match-warning{display:flex;flex-direction:column;gap:.5rem;padding:.6rem .7rem;background:#2a2618;border:1px solid #5a4d1f;border-radius:6px}.import-match-warning p{margin:0;font-size:.82rem;color:#e8d9a0}.import-match-warning-actions{display:flex;justify-content:flex-end;gap:.5rem}.import-match-warning-actions button{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.35rem .7rem;font-size:.8rem;cursor:pointer}.import-match-warning-actions button.primary{background:#3f6fed;border-color:#3f6fed}.projects-page{min-height:100vh;background:#14181f;color:#f2f2f2;font-family:system-ui,sans-serif;display:flex;flex-direction:column}.projects-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 2rem;border-bottom:1px solid #2a2f3a}.projects-header .brand{display:flex;align-items:center;gap:.6rem;flex-shrink:0}.projects-header .app-nav{margin-inline-end:auto}.projects-header h1{margin:0;font-size:1.2rem}.projects-account{display:flex;align-items:center;gap:.75rem}.logout-button{background:transparent;color:#9aa4b2;border:1px solid #333a47;border-radius:6px;padding:.35rem .7rem;font-size:.8rem;cursor:pointer}.logout-button:hover{color:#f2f2f2;border-color:#555f70}.projects-body{flex:1;width:100%;max-width:1100px;margin:0 auto;padding:2rem}.projects-heading{margin:0 0 .25rem;font-size:1.45rem}.projects-body>.hint{margin:0 0 1.25rem}.new-project-form{display:flex;flex-direction:column;gap:.9rem;padding:1.1rem 1.25rem;margin-bottom:2rem;background:#1b2029;border:1px solid #2a2f3a;border-radius:10px}.new-project-fields{display:grid;grid-template-columns:minmax(220px,2fr) minmax(140px,1fr) minmax(140px,1fr);gap:.75rem}@media(max-width:720px){.new-project-fields{grid-template-columns:1fr}}.new-project-fields label{display:flex;flex-direction:column;gap:.3rem;font-size:.78rem;color:#9aa4b2;min-width:0}.new-project-form input{width:100%;background:#14181f;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.55rem .75rem;font-size:.9rem}.new-project-form input:focus{outline:none;border-color:#3f6fed}.new-project-actions{display:flex;flex-wrap:wrap;gap:.6rem}.new-project-form button{background:#3f6fed;color:#fff;border:1px solid #3f6fed;border-radius:6px;padding:.55rem 1.2rem;font-size:.88rem;cursor:pointer;flex:0 0 auto}.new-project-form button.import-match-button{background:#1f2530;border-color:#333a47}.new-project-form button.import-match-button:hover{background:#2a3140}.new-project-form button:disabled{opacity:.5;cursor:not-allowed}.hint{color:#9aa4b2;font-size:.85rem}.project-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.85rem}.project-card{position:relative;background:#1a1f29;border:1px solid #2a2f3a;border-radius:10px;overflow:hidden;transition:border-color .12s ease,transform .12s ease}.project-card:hover{border-color:#3a4152;transform:translateY(-1px)}.project-card-main{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;background:transparent;border:none;color:#f2f2f2;text-align:left;padding:1.1rem 1.2rem;cursor:pointer}.project-card-main:hover{background:#232a37}.project-title{font-weight:600;font-size:1rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;padding-right:1.4rem}.project-teams{font-size:.85rem;color:#c2c9d4}.project-updated{font-size:.75rem;color:#6b7280;margin-top:.2rem}.project-delete{position:absolute;top:.5rem;right:.5rem;width:1.6rem;height:1.6rem;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:#6b7280;font-size:1.2rem;line-height:1;cursor:pointer;z-index:1}.project-delete:hover{background:#3a1f22;color:#ff6a6a}.projects-account .hint,.logout-button{white-space:nowrap}@media(max-width:820px){.projects-account .hint{display:none}.projects-header{padding:.75rem 1rem}}.project-card-analyse{display:block;padding:.5rem 1.2rem;border-top:1px solid #2a2f3a;background:#161b23;color:#9aa4b2;font-size:.78rem;text-decoration:none}.project-card-analyse:hover{background:#202836;color:#9dbaff}.animations-page{min-height:100vh;background:#14181f;color:#f2f2f2;font-family:system-ui,sans-serif}.animations-header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1.5rem;border-bottom:1px solid #2a2f3a}.animations-header .brand{display:flex;align-items:center;gap:.6rem;color:inherit;text-decoration:none;flex-shrink:0}.animations-header .brand h1{margin:0;font-size:1.2rem}.animations-main{max-width:1080px;margin:0 auto;padding:1.75rem 1.5rem 3rem}.animations-main h1{margin:0 0 .25rem;font-size:1.5rem}.animations-main .hint{color:#9aa4b2;font-size:.88rem;margin:0 0 1.25rem}.animation-create{display:flex;flex-direction:column;gap:1rem;padding:1.1rem 1.25rem;margin-bottom:2rem;background:#1b2029;border:1px solid #2a2f3a;border-radius:10px}.animation-create-title{display:flex;flex-direction:column;gap:.35rem;font-size:.82rem;color:#9aa4b2}.animation-create-title input{background:#14181f;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.5rem .7rem;font-size:.92rem}.animation-area-picker{border:0;padding:0;margin:0}.animation-area-picker legend{font-size:.82rem;color:#9aa4b2;padding:0 0 .45rem}.animation-area-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.6rem}.animation-area{display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:.85rem .7rem;min-height:150px;background:#14181f;color:#cdd4de;border:1px solid #333a47;border-radius:8px;cursor:pointer;text-align:center}.animation-area:hover{background:#1f2530;color:#f2f2f2}.animation-area.active{border-color:#3f6fed;background:#1a2233;color:#fff}.animation-area svg{height:58px;margin-bottom:.15rem}.animation-area strong{font-size:.86rem}.animation-area span{font-size:.72rem;color:#9aa4b2;line-height:1.35}.animation-create-button{align-self:flex-start;background:#3f6fed;color:#fff;border:1px solid #3f6fed;border-radius:6px;padding:.5rem 1.1rem;font-size:.88rem;cursor:pointer}.animation-create-button:disabled{opacity:.5;cursor:default}.animations-error{color:#ff6b6b;font-size:.82rem;margin:0}.animation-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.75rem}.animation-card{display:flex;align-items:stretch;background:#1b2029;border:1px solid #2a2f3a;border-radius:10px;overflow:hidden}.animation-card-main{display:flex;align-items:center;gap:.75rem;flex:1;min-width:0;padding:.8rem .9rem;background:none;border:0;color:inherit;cursor:pointer;text-align:left}.animation-card-main:hover{background:#1f2530}.animation-card-thumb{display:flex;align-items:center;justify-content:center;width:52px;height:52px;flex-shrink:0;color:#fffc;background:#1c6b3a;border-radius:6px}.animation-card-text{display:flex;flex-direction:column;gap:.2rem;min-width:0}.animation-card-text strong{font-size:.92rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.animation-card-meta{font-size:.75rem;color:#9aa4b2}.animation-published{color:#5fd08a;margin-left:.3rem}.animation-card-delete{flex-shrink:0;padding:0 .85rem;background:none;border:0;border-left:1px solid #2a2f3a;color:#9aa4b2;font-size:.78rem;cursor:pointer}.animation-card-delete:hover{background:#2a1b1f;color:#ff8b8b}.tagging-page{height:100vh;background:#14181f;color:#f2f2f2;font-family:system-ui,sans-serif;display:flex;flex-direction:column;overflow:hidden}.tagging-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem 1.25rem;border-bottom:1px solid #2a2f3a;flex-shrink:0}.tagging-header .brand{display:flex;align-items:center;gap:.6rem;min-width:0}.tagging-header .app-nav{margin-inline-end:auto}.tagging-account{display:flex;align-items:center;gap:.6rem;min-width:0}.tagging-title{display:flex;flex-direction:column;min-width:0}.tagging-title h1{margin:0;font-size:1.05rem;line-height:1.2}.tagging-breadcrumb{font-size:.75rem;color:#9aa4b2;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tagging-breadcrumb:hover{color:#f2f2f2}.tagging-status{padding:2rem 1.25rem}.tagging-body{flex:1;min-height:0;display:grid;grid-template-rows:minmax(200px,1fr) auto;gap:.4rem;padding:.4rem .5rem .5rem}.tagging-body.empty{grid-template-rows:1fr;place-items:center}.tagging-top{display:grid;grid-template-columns:minmax(0,1fr) clamp(280px,20%,400px);gap:.4rem;min-height:0;min-width:0}.tagging-side{display:flex;flex-direction:column;gap:.4rem;min-height:0;min-width:0}.tagging-side .code-window{flex:0 1 auto;max-height:58%}.tagging-side .instance-panel{flex:1 1 auto;max-height:none;min-height:0}.tagging-side .instance-panel.collapsed{flex:0 0 auto}@media(max-width:1180px){.tagging-top{grid-template-columns:minmax(0,1fr) 280px}}.tagging-stage-column{display:flex;flex-direction:column;gap:.5rem;min-height:0;min-width:0}.tagging-onboarding{max-width:560px;text-align:center;background:#1b2029;border:1px solid #2a2f3a;border-radius:12px;padding:2rem}.tagging-onboarding h2{margin:0 0 .4rem;font-size:1.2rem}.tagging-onboarding .hint{margin:0 0 1.25rem}.video-stage{display:flex;flex-direction:column;gap:.25rem;min-height:0;background:#1a1f29;border:1px solid #2a2f3a;border-radius:10px;padding:.3rem}.video-frame{flex:1;min-height:0;background:#000;border-radius:6px;overflow:hidden;display:flex}.video-frame video{width:100%;height:100%;object-fit:contain;cursor:pointer}.video-frame.fill video{object-fit:cover}.video-fill-toggle.active{border-color:#3f6fed;color:#9dbaff}.video-scrub input[type=range]{width:100%;height:14px;margin:0;accent-color:#3f6fed;cursor:pointer}.video-transport{display:flex;align-items:center;gap:.3rem;flex-wrap:wrap}.video-transport button{background:#1f2530;color:#c2c9d4;border:1px solid #333a47;border-radius:5px;padding:.3rem .5rem;font-size:.75rem;cursor:pointer;font-variant-numeric:tabular-nums}.video-transport button:hover{background:#2a3140;color:#f2f2f2}.video-transport .video-play{background:#3f6fed;border-color:#3f6fed;color:#fff;min-width:2.4rem;font-size:.85rem}.video-clock{margin-inline-start:auto;font-size:.8rem;font-variant-numeric:tabular-nums;white-space:nowrap}.video-clock-total{color:#6b7280}.video-rate select{background:#1f2530;color:#c2c9d4;border:1px solid #333a47;border-radius:5px;padding:.25rem .35rem;font-size:.75rem}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.video-picker{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;background:#1a1f29;border:1px solid #2a2f3a;border-radius:10px;padding:.5rem .6rem;flex-shrink:0}.video-picker.drag-over{border-color:#3f6fed;background:#1d2433}.video-picker-list{list-style:none;margin:0;padding:0;display:flex;gap:.4rem;flex-wrap:wrap;min-width:0}.video-picker-list li{display:flex;align-items:center;background:#1f2530;border:1px solid #333a47;border-radius:6px;overflow:hidden;max-width:260px}.video-picker-list li.active{border-color:#3f6fed;background:#23304a}.video-picker-item{display:flex;flex-direction:column;align-items:flex-start;gap:.1rem;background:transparent;border:none;color:#f2f2f2;text-align:start;padding:.3rem .5rem;cursor:pointer;min-width:0}.video-picker-name{font-size:.78rem;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.video-picker-meta{font-size:.68rem;color:#6b7280}.video-picker-delete{background:transparent;border:none;color:#6b7280;font-size:1rem;line-height:1;padding:0 .4rem;cursor:pointer;align-self:stretch}.video-picker-delete:hover{background:#3a1f22;color:#ff6a6a}.video-picker-add{display:flex;align-items:center;gap:.6rem;margin-inline-start:auto}.video-picker-add button.primary,.tagging-onboarding button.primary{background:#3f6fed;color:#fff;border:1px solid #3f6fed;border-radius:6px;padding:.4rem .9rem;font-size:.82rem;cursor:pointer}.video-upload-progress{display:flex;align-items:center;gap:.6rem;flex:1;min-width:220px}.video-upload-bar{flex:1;height:6px;background:#22283440;border:1px solid #333a47;border-radius:999px;overflow:hidden}.video-upload-fill{height:100%;background:#3f6fed;transition:width .12s linear}.video-upload-progress button{background:#1f2530;color:#c2c9d4;border:1px solid #333a47;border-radius:5px;padding:.25rem .6rem;font-size:.75rem;cursor:pointer}.video-upload-error{flex-basis:100%;margin:0;color:#ff8a8a;font-size:.78rem}.code-window{display:flex;flex-direction:column;gap:.5rem;min-height:0;min-width:0;background:#1a1f29;border:1px solid #2a2f3a;border-radius:10px;padding:.6rem .7rem;overflow:hidden}.code-window-header,.tag-timeline-header,.instance-panel-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-shrink:0}.code-window-header h2,.tag-timeline-header h2,.instance-panel-header h2{margin:0;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:#9aa4b2;display:flex;align-items:center;gap:.45rem}.code-window-header-actions button,.tag-timeline-zoom button,.instance-panel-actions button{background:#1f2530;color:#c2c9d4;border:1px solid #333a47;border-radius:5px;padding:.28rem .55rem;font-size:.74rem;cursor:pointer}.code-window-header-actions button:hover,.tag-timeline-zoom button:hover,.instance-panel-actions button:hover:not(:disabled){background:#2a3140;color:#f2f2f2}.code-window-header-actions button.active{border-color:#3f6fed;color:#9dbaff}.instance-panel-actions button.primary{background:#3f6fed;border-color:#3f6fed;color:#fff}.instance-panel-actions button:disabled{opacity:.45;cursor:not-allowed}.code-window-empty{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem}.code-window-empty p{margin:0;font-size:.82rem;color:#9aa4b2}.code-window-empty button{background:#1f2530;color:#c2c9d4;border:1px solid #333a47;border-radius:6px;padding:.4rem .8rem;font-size:.8rem;cursor:pointer}.code-window-empty button.primary{background:#3f6fed;border-color:#3f6fed;color:#fff}.code-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:.3rem;overflow-y:auto;min-height:0;align-content:start}.code-cell{position:relative;min-width:0}.code-button{--code-color: #38bdf8;width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;background:color-mix(in srgb,var(--code-color) 16%,#1f2530);border:1px solid color-mix(in srgb,var(--code-color) 45%,#333a47);border-radius:7px;color:#f2f2f2;padding:.32rem .4rem;font-size:.74rem;text-align:start;cursor:pointer;min-height:2.5rem;transition:background 90ms ease,transform 90ms ease}.code-button:hover:not(:disabled){background:color-mix(in srgb,var(--code-color) 30%,#1f2530)}.code-button:active:not(:disabled){transform:scale(.97)}.code-button:disabled{opacity:.45;cursor:not-allowed}.code-button.flash{background:var(--code-color);border-color:#fff;color:#0c1017}.code-button-name{font-weight:600;line-height:1.15;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.code-button-meta{display:flex;align-items:center;gap:.3rem;margin-top:auto;font-size:.68rem;color:#c2c9d4}.code-button.flash .code-button-meta{color:#0c1017}.code-button-meta kbd{background:#0f131a80;border:1px solid #ffffff26;border-radius:3px;padding:0 .22rem;font-family:inherit;font-size:.66rem}.code-button-count{margin-inline-start:auto;font-variant-numeric:tabular-nums}.code-button-add{--code-color: #6b7280;align-items:center;justify-content:center;font-size:.74rem}.code-cell-tools{position:absolute;inset-block-start:-.3rem;inset-inline-end:-.2rem;display:flex;gap:.1rem}.code-cell-tools button{width:1.2rem;height:1.2rem;display:flex;align-items:center;justify-content:center;background:#0f131a;border:1px solid #333a47;border-radius:3px;color:#c2c9d4;font-size:.72rem;line-height:1;cursor:pointer;padding:0}.code-cell-tools button:hover:not(:disabled){border-color:#555f70;color:#fff}.code-cell-tools button.danger:hover{background:#3a1f22;border-color:#ff6a6a;color:#ff6a6a}.code-cell-tools button:disabled{opacity:.35;cursor:not-allowed}.code-window-hint{margin:0;font-size:.7rem;line-height:1.35;flex-shrink:0}.code-editor-dialog .app-dialog-form{min-width:420px}.code-editor-field{display:flex;flex-direction:column;gap:.25rem;font-size:.75rem;color:#9aa4b2;min-width:0}.code-editor-row{display:grid;grid-template-columns:4rem 1fr 1fr;gap:.6rem}.code-editor-field input:not([type=color]){background:#14181f;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.45rem .6rem;font-size:.88rem;width:100%}.code-editor-hotkey{text-align:center;text-transform:lowercase}.code-color-row{display:flex;align-items:center;gap:.25rem;flex-wrap:wrap}.code-color-swatch{width:1.3rem;height:1.3rem;border:2px solid transparent;border-radius:4px;cursor:pointer;padding:0}.code-color-swatch.selected{border-color:#fff}.code-color-row input[type=color]{width:1.9rem;height:1.5rem;background:transparent;border:1px solid #333a47;border-radius:4px;padding:0;cursor:pointer}.code-editor-warning{margin:0;color:#ffbf6a;font-size:.76rem}.label-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem}.label-chips li{display:flex;align-items:center;gap:.2rem;background:#1f2530;border:1px solid #333a47;border-radius:999px;padding:.12rem .2rem .12rem .55rem;font-size:.74rem;color:#f2f2f2}.label-chips button{background:transparent;border:none;color:#6b7280;cursor:pointer;font-size:.85rem;line-height:1;padding:0 .2rem}.label-chips button:hover{color:#ff6a6a}.label-add-row{display:flex;gap:.4rem;margin-top:.3rem}.label-add-row input{flex:1;background:#14181f;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.4rem .6rem;font-size:.82rem}.label-add-row button{background:#1f2530;color:#c2c9d4;border:1px solid #333a47;border-radius:6px;padding:.35rem .7rem;font-size:.78rem;cursor:pointer}.label-add-row button:disabled{opacity:.45;cursor:not-allowed}.tag-timeline{min-width:0;background:#1a1f29;border:1px solid #2a2f3a;border-radius:10px;padding:.35rem .5rem .4rem;display:flex;flex-direction:column;gap:.3rem;min-height:0}.tag-timeline-zoom{display:flex;gap:.25rem}.tag-timeline-body{display:flex;min-width:0;align-items:flex-start;min-height:0;max-height:22vh;overflow-y:auto}.tag-timeline-gutter{flex-shrink:0;width:120px;border-inline-end:1px solid #2a2f3a}.tag-timeline-label{display:flex;align-items:center;gap:.35rem;padding-inline-end:.4rem;font-size:.72rem;color:#c2c9d4;min-width:0}.tag-timeline-swatch{width:7px;height:7px;border-radius:2px;flex-shrink:0}.tag-timeline-label-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tag-timeline-scroll{flex:1;min-width:0;overflow-x:auto;overflow-y:hidden}.tag-timeline-track{position:relative;cursor:crosshair}.tag-ruler{position:absolute;inset-block-start:0;inset-inline-start:0;height:18px;width:100%}.tag-tick{position:absolute;top:0;font-size:.65rem;color:#6b7280;font-variant-numeric:tabular-nums;padding-inline-start:3px;border-inline-start:1px solid #2a2f3a;height:100%;display:flex;align-items:center;pointer-events:none;white-space:nowrap}.tag-timeline-row{position:absolute;inset-inline-start:0;width:100%;border-block-start:1px solid #22283a}.tag-bar{position:absolute;inset-block:4px;border-radius:3px;opacity:.85;cursor:grab;border:1px solid transparent}.tag-bar:hover{opacity:1}.tag-bar.selected{border-color:#fff;opacity:1;z-index:2}.tag-bar.playing{box-shadow:0 0 0 2px #ffd400;z-index:3}.tag-bar.dimmed{opacity:.2}.tag-bar-grip{position:absolute;inset-block:-2px;width:7px;cursor:ew-resize}.tag-bar-grip.start{inset-inline-start:-3px}.tag-bar-grip.end{inset-inline-end:-3px}.tag-playhead{position:absolute;inset-block:0;width:2px;margin-inline-start:-1px;background:#ff4d4f;pointer-events:none;z-index:4}.tag-timeline-empty{margin:0}.instance-panel{background:#1a1f29;border:1px solid #2a2f3a;border-radius:10px;padding:.5rem .6rem .6rem;display:flex;flex-direction:column;gap:.45rem;min-height:0;min-width:0;max-height:26vh}.instance-panel.collapsed,.tag-timeline.collapsed{max-height:none;padding-bottom:.45rem;gap:0}.panel-collapse{background:transparent;border:none;color:#6b7280;font-size:.7rem;line-height:1;padding:.1rem .25rem;margin-inline-end:.1rem;cursor:pointer}.panel-collapse:hover{color:#f2f2f2}.tag-timeline-header .panel-collapse{margin-inline-end:0}.tag-timeline-count{background:#1f2530;border:1px solid #333a47;border-radius:999px;padding:.05rem .45rem;font-size:.7rem;color:#c2c9d4;font-variant-numeric:tabular-nums}.tag-timeline-zoom button.active{border-color:#3f6fed;color:#9dbaff}.video-switcher{display:flex;align-items:center;gap:.25rem;min-width:0}.video-switcher-select{background:#1f2530;color:#c2c9d4;border:1px solid #333a47;border-radius:5px;padding:.28rem .4rem;font-size:.75rem;max-width:260px}.video-switcher button{background:#1f2530;color:#c2c9d4;border:1px solid #333a47;border-radius:5px;width:1.7rem;height:1.7rem;font-size:.9rem;line-height:1;cursor:pointer;padding:0}.video-switcher button:hover:not(:disabled){background:#2a3140;color:#f2f2f2}.video-switcher button.danger:hover:not(:disabled){background:#3a1f22;border-color:#ff6a6a;color:#ff6a6a}.video-switcher button:disabled{opacity:.4;cursor:not-allowed}.video-switcher-progress{display:flex;align-items:center;gap:.4rem;min-width:220px}.video-switcher-progress button{width:auto;padding:0 .5rem;font-size:.72rem}.video-switcher-error{color:#ff8a8a;font-size:.72rem;max-width:220px}.instance-count{background:#1f2530;border:1px solid #333a47;border-radius:999px;padding:.05rem .45rem;font-size:.7rem;color:#c2c9d4;letter-spacing:0;text-transform:none}.instance-panel-actions{display:flex;gap:.3rem;flex-wrap:wrap}.tagging-side .instance-panel-header{flex-wrap:wrap;row-gap:.35rem}.tagging-side .instance-panel-actions{flex:1 1 100%}.instance-filters{display:flex;flex-direction:column;gap:.3rem;flex-shrink:0}.filter-group{display:flex;align-items:center;gap:.28rem;flex-wrap:wrap}.filter-group-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:#6b7280;margin-inline-end:.2rem}.filter-chip{--chip-color: #6b7280;background:#1f2530;border:1px solid #333a47;border-radius:999px;color:#c2c9d4;padding:.16rem .5rem;font-size:.72rem;cursor:pointer}.filter-chip:hover{border-color:#555f70;color:#f2f2f2}.filter-chip.on{background:color-mix(in srgb,var(--chip-color) 30%,#1f2530);border-color:var(--chip-color);color:#fff}.filter-chip-count{color:#6b7280;font-variant-numeric:tabular-nums}.filter-chip.on .filter-chip-count{color:#dbe3f0}.filter-clear{align-self:flex-start;background:transparent;border:none;color:#9dbaff;font-size:.72rem;cursor:pointer;padding:0;text-decoration:underline}.instance-list{list-style:none;margin:0;padding:0;overflow-y:auto;min-height:0;flex:1}.instance-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border-block-end:1px solid #22283a}.instance-row.selected{background:#1f2634}.instance-row.playing{box-shadow:inset 3px 0 #ffd400}.instance-row-main{display:flex;align-items:center;flex-wrap:wrap;row-gap:.1rem;gap:.4rem;background:transparent;border:none;color:#f2f2f2;text-align:start;padding:.35rem .4rem;cursor:pointer;min-width:0;font-size:.78rem}.instance-row-main:hover{background:#232a37}.instance-swatch{width:8px;height:8px;border-radius:2px;flex-shrink:0}.instance-code{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 1 auto;min-width:0}.instance-time,.instance-duration{font-variant-numeric:tabular-nums;color:#9aa4b2;font-size:.74rem}.instance-duration:before{content:"· ";color:#4b5563}.instance-labels-inline{color:#8fb4ff;font-size:.72rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.instance-row-tools{display:flex;gap:.15rem;padding-inline-end:.3rem}.instance-row-tools button{background:transparent;border:1px solid transparent;border-radius:4px;color:#6b7280;font-size:.75rem;line-height:1;padding:.2rem .35rem;cursor:pointer}.instance-row-tools button:hover{border-color:#333a47;color:#f2f2f2}.instance-row-tools button.danger:hover{background:#3a1f22;border-color:#ff6a6a;color:#ff6a6a}.instance-editor{grid-column:1 / -1;display:flex;flex-direction:column;gap:.35rem;padding:.2rem .5rem .5rem 1rem}.instance-editor-labels{display:flex;gap:.25rem;flex-wrap:wrap}.label-toggle{background:#1f2530;border:1px solid #333a47;border-radius:999px;color:#9aa4b2;padding:.14rem .5rem;font-size:.72rem;cursor:pointer}.label-toggle:hover{color:#f2f2f2;border-color:#555f70}.label-toggle.on{background:#26406e;border-color:#3f6fed;color:#fff}.instance-editor-trim{display:flex;align-items:center;gap:.35rem;font-size:.72rem;color:#9aa4b2;font-variant-numeric:tabular-nums}.instance-editor-trim button{background:#1f2530;border:1px solid #333a47;border-radius:5px;color:#c2c9d4;padding:.18rem .45rem;font-size:.7rem;cursor:pointer}.instance-editor-trim button:hover:not(:disabled){background:#2a3140;color:#f2f2f2}.instance-editor-trim button:disabled{opacity:.4;cursor:not-allowed}.instance-notes{background:#14181f;border:1px solid #333a47;border-radius:6px;color:#f2f2f2;padding:.35rem .55rem;font-size:.78rem;width:100%;max-width:34rem}.instance-notes:focus{outline:none;border-color:#3f6fed}.instance-panel .hint,.tag-timeline .hint{margin:0;font-size:.76rem}[dir=rtl] .tagging-body{direction:ltr}.instance-list{position:relative}@media(max-width:860px){.tagging-top{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(160px,1fr) minmax(0,auto)}.tagging-side{flex-direction:row;align-items:stretch;max-height:34vh}.tagging-side .code-window,.tagging-side .instance-panel{flex:1 1 50%;max-height:none}.code-window{max-height:28vh}.tag-timeline-body{max-height:18vh}.instance-panel{max-height:22vh}.code-editor-dialog .app-dialog-form{min-width:auto}.tagging-header{flex-wrap:wrap;row-gap:.4rem}.video-switcher-select{max-width:150px}}.tagging-save-error{grid-column:1 / -1;margin:0;display:flex;align-items:center;gap:.6rem;background:#3a1f22;border:1px solid #ff6a6a;border-radius:8px;color:#ffbcbc;padding:.4rem .7rem;font-size:.8rem}.tagging-save-error button{margin-inline-start:auto;background:transparent;border:1px solid #ff6a6a80;border-radius:5px;color:#ffbcbc;padding:.15rem .5rem;font-size:.74rem;cursor:pointer}.tag-timeline-heading{display:flex;align-items:center;gap:.4rem;min-width:0}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#14181f;color:#f2f2f2;font-family:system-ui,sans-serif;padding:1rem}.auth-card{width:100%;max-width:320px;display:flex;flex-direction:column;gap:.6rem;background:#1a1f29;border:1px solid #2a2f3a;border-radius:10px;padding:1.75rem}.auth-card>svg{align-self:center;margin-bottom:.25rem}.auth-card h1{margin:0;font-size:1.2rem;text-align:center}.auth-card .hint{margin:0 0 .5rem;font-size:.8rem;color:#9aa4b2;text-align:center}.auth-card input{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.55rem .7rem;font-size:.9rem}.auth-card button{background:#3f6fed;color:#fff;border:1px solid #3f6fed;border-radius:6px;padding:.6rem;font-size:.9rem;cursor:pointer;margin-top:.25rem}.auth-card button:disabled{opacity:.5;cursor:not-allowed}.auth-error{margin:0;color:#ff6a6a;font-size:.8rem;text-align:center}.auth-default-hint{margin:.5rem 0 0;font-size:.7rem;color:#555f70;text-align:center}.library-page{min-height:100vh;background:#14181f;color:#f2f2f2;font-family:system-ui,sans-serif;display:flex;flex-direction:column}.library-header{display:flex;align-items:center;gap:.75rem;padding:.75rem 2rem;border-bottom:1px solid #2a2f3a}.library-header .brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:inherit}.library-header h1{margin:0;font-size:1.2rem}.library-header nav{display:flex;align-items:center;gap:.75rem}.library-header nav a,.library-header nav button{background:transparent;color:#9aa4b2;border:1px solid #333a47;border-radius:6px;padding:.35rem .7rem;font-size:.8rem;text-decoration:none;cursor:pointer}.library-header nav a:hover,.library-header nav button:hover{color:#f2f2f2;border-color:#555f70}.library-body{flex:1;width:100%;max-width:1100px;margin:0 auto;padding:2rem}.library-controls{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1.5rem}.library-search{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.6rem .8rem;font-size:.9rem;flex:1 1 260px}.library-tabs{display:flex;gap:.3rem}.library-tabs button,.library-sort button{background:#1f2530;color:#9aa4b2;border:1px solid #333a47;border-radius:6px;padding:.5rem .8rem;font-size:.82rem;cursor:pointer}.library-tabs button.active,.library-sort button.active{background:#3f6fed;border-color:#3f6fed;color:#fff}.library-sort{display:flex;gap:.3rem;margin-left:auto}.library-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem}.library-card{width:100%;display:flex;flex-direction:column;align-items:stretch;text-align:left;background:#1a1f29;border:1px solid #2a2f3a;border-radius:10px;overflow:hidden;cursor:pointer;padding:0;color:inherit;text-decoration:none}.library-card:hover{border-color:#3f6fed}.library-card-thumb{width:100%;aspect-ratio:105 / 68;background:#12401f;display:flex;align-items:center;justify-content:center;color:#3f8a52;font-size:2rem;overflow:hidden}.library-card-thumb img{width:100%;height:100%;object-fit:cover}.library-card-body{padding:.9rem 1rem;display:flex;flex-direction:column;gap:.3rem}.library-category-badge{align-self:flex-start;font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:#9aa4b2;background:#232a37;border-radius:4px;padding:.15rem .45rem}.library-card-title{font-weight:600;font-size:1rem}.library-card-description{font-size:.82rem;color:#c2c9d4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.library-card-meta{display:flex;gap:.8rem;font-size:.78rem;color:#6b7280;margin-top:.2rem}.library-empty{color:#9aa4b2;font-size:.9rem;padding:2rem 0;text-align:center}.library-pagination{display:flex;justify-content:center;gap:.5rem;margin-top:1.5rem}.library-pagination button{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.4rem .9rem;cursor:pointer}.library-pagination button:disabled{opacity:.4;cursor:not-allowed}.library-detail-body{flex:1;width:100%;max-width:900px;margin:0 auto;padding:2rem}.library-detail-back{display:inline-block;margin-bottom:1rem;color:#9aa4b2;text-decoration:none;font-size:.85rem}.library-detail-back:hover{color:#f2f2f2}.library-detail-preview{border-radius:10px;overflow:hidden;border:1px solid #2a2f3a;line-height:0}.library-detail-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin:1.25rem 0 .5rem}.library-detail-title{font-size:1.4rem;margin:0 0 .3rem}.library-detail-author{color:#9aa4b2;font-size:.85rem}.library-detail-actions{display:flex;gap:.6rem;flex-shrink:0}.library-detail-actions button{background:#1f2530;color:#f2f2f2;border:1px solid #333a47;border-radius:6px;padding:.55rem 1rem;font-size:.9rem;cursor:pointer;white-space:nowrap}.library-detail-actions button.primary{background:#3f6fed;border-color:#3f6fed}.library-detail-actions button.liked{background:#ff3b30;border-color:#ff3b30}.library-detail-actions button:disabled{opacity:.5;cursor:not-allowed}.library-detail-description{color:#c2c9d4;line-height:1.5;margin:.75rem 0}.library-detail-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin:.75rem 0}.library-detail-tags span{background:#232a37;color:#9aa4b2;border-radius:4px;padding:.2rem .55rem;font-size:.78rem}.library-card-badges{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}.library-animation-badge{display:inline-flex;align-items:center;gap:.2rem;padding:.1rem .4rem;border-radius:999px;background:#3f6fed2e;border:1px solid rgba(63,111,237,.55);color:#9dbaff;font-size:.68rem;white-space:nowrap}.library-detail-preview{position:relative;display:flex;justify-content:center;background:#10141b}.library-play-button{position:absolute;left:50%;bottom:.75rem;transform:translate(-50%);padding:.4rem 1rem;background:#14181fe0;color:#f2f2f2;border:1px solid #3f6fed;border-radius:999px;font-size:.82rem;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.library-play-button:hover{background:#3f6fed}.library-header .app-nav{margin-inline-end:auto}.library-login-link{padding:.35rem .75rem;border:1px solid #333a47;border-radius:6px;color:#9aa4b2;text-decoration:none;font-size:.85rem}.library-login-link:hover{color:#f2f2f2;border-color:#555f70}