/* * V30389_FAST_POSITION_PICKER */ /* * 원본 select는 저장/기존 이벤트용으로 유지. * DOM에서 제거하지 않는다. */ #captureEditorV62 select[data-field="position"] .capture-position-source-v30389, #captureEditorV62 select[data-field="position"].capture-position-source-v30389 { position: absolute !important; width: 1px !important; height: 1px !important; min-width: 0 !important; min-height: 0 !important; opacity: 0 !important; pointer-events: none !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; margin: 0 !important; padding: 0 !important; border: 0 !important; } /* * 실제 사용자가 누르는 trigger. */ #captureEditorV62 .capture-position-trigger-v30389 { display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; width: 118px; min-width: 118px; height: 34px; padding: 0 10px; border: 1px solid rgba(148, 163, 184, 0.35); border-radius: 8px; background: rgba(15, 23, 42, 0.92); color: inherit; font: inherit; font-size: 12px; font-weight: 700; line-height: 1; cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent; /* * 네이티브 select 지연 원인 후보였던 * transition / animation / compositor 효과 제거. */ transition: none !important; animation: none !important; transform: none !important; filter: none !important; backdrop-filter: none !important; will-change: auto !important; } #captureEditorV62 .capture-position-trigger-v30389:hover { border-color: rgba(148, 163, 184, 0.72); } #captureEditorV62 .capture-position-trigger-v30389:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; } .capture-position-label-v30389 { white-space: nowrap; } .capture-position-arrow-v30389 { flex: none; opacity: 0.72; font-size: 10px; } /* * BODY에 붙는 picker menu. * * position:fixed라 workspace transform이나 * overflow에 잘리지 않는다. */ .capture-position-menu-v30389 { position: fixed; z-index: 2147483000; display: grid; gap: 3px; padding: 5px; border: 1px solid rgba(148, 163, 184, 0.38); border-radius: 10px; background: rgba(15, 23, 42, 0.98); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.34); contain: layout paint; transition: none !important; animation: none !important; transform: none !important; filter: none !important; backdrop-filter: none !important; will-change: auto !important; } .capture-position-menu-v30389.hidden { display: none !important; } .capture-position-option-v30389 { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 32px; padding: 0 9px; border: 0; border-radius: 7px; background: transparent; color: inherit; text-align: left; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; transition: none !important; animation: none !important; transform: none !important; } .capture-position-option-v30389:hover, .capture-position-option-v30389:focus-visible { background: rgba(148, 163, 184, 0.16); outline: none; } .capture-position-option-v30389.active { background: rgba(148, 163, 184, 0.22); } .capture-position-dot-v30389 { width: 6px; height: 6px; flex: none; border-radius: 50%; background: currentColor; opacity: 0.28; } .capture-position-option-v30389.active .capture-position-dot-v30389 { opacity: 1; } /* * 모바일 */ @media ( max-width: 720px ) { #captureEditorV62 .capture-position-trigger-v30389 { width: 105px; min-width: 105px; height: 32px; padding: 0 8px; font-size: 11px; } .capture-position-option-v30389 { min-height: 36px; } } /* * V30390_CAPTURE_QUICK_CONTROLS */ /* * 기존 team_number select는 * capture-v62 상태/저장용으로 유지한다. */ #captureEditorV62 select[data-field="team_number"] .capture-team-source-v30390, #captureEditorV62 select[data-field="team_number"].capture-team-source-v30390 { position: absolute !important; width: 1px !important; height: 1px !important; min-width: 0 !important; min-height: 0 !important; opacity: 0 !important; pointer-events: none !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; margin: 0 !important; padding: 0 !important; border: 0 !important; } /* * A/B팀 원클릭 toggle */ #captureEditorV62 .capture-team-toggle-v30390 { display: inline-flex; align-items: center; justify-content: center; width: 54px; min-width: 54px; height: 34px; padding: 0 8px; border: 1px solid rgba(148, 163, 184, 0.38); border-radius: 8px; background: rgba(15, 23, 42, 0.92); color: inherit; font: inherit; font-size: 12px; font-weight: 800; line-height: 1; cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent; transition: none !important; animation: none !important; transform: none !important; filter: none !important; backdrop-filter: none !important; will-change: auto !important; } #captureEditorV62 .capture-team-toggle-v30390:hover { border-color: rgba(148, 163, 184, 0.78); } #captureEditorV62 .capture-team-toggle-v30390:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; } #captureEditorV62 .capture-team-toggle-v30390[data-team="1"]::before { content: "A"; display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; margin-right: 4px; border-radius: 5px; background: rgba(148, 163, 184, 0.18); font-size: 10px; } #captureEditorV62 .capture-team-toggle-v30390[data-team="2"]::before { content: "B"; display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; margin-right: 4px; border-radius: 5px; background: rgba(148, 163, 184, 0.18); font-size: 10px; } @media ( max-width: 720px ) { #captureEditorV62 .capture-team-toggle-v30390 { width: 50px; min-width: 50px; height: 32px; padding: 0 6px; font-size: 11px; } }