:root{color:#e7ebf3;font-synthesis:none;--panel:#101520;--line:#242c3a;--muted:#8b96a8;--blue:#5d8cff;background:#080b12;font-family:Inter,Pretendard,Noto Sans KR,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 60% -20%,#182238 0,#0000 42%),#080b12;min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button{color:inherit;cursor:pointer;background:#171e2b;border:1px solid #30394a;border-radius:8px;padding:8px 12px}button:hover:not(:disabled){background:#1c2637;border-color:#5d8cff}button:disabled{opacity:.4;cursor:default}.app-shell{min-height:100vh}.topbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#080b12db;border-bottom:1px solid #1b2230;justify-content:space-between;align-items:center;height:68px;padding:0 28px;display:flex}.brand,.top-actions,.brand>div{align-items:center;gap:11px;display:flex}.brand-mark{background:linear-gradient(135deg,#617ff9,#9a66ff);border-radius:10px;place-items:center;width:34px;height:34px;font-weight:900;display:grid;box-shadow:0 8px 30px #5d62ff44}.brand h1,.brand p{margin:0}.brand h1{font-size:15px}.brand p{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font:10px/1.4 ui-monospace,monospace}.dev-badge{color:#95f5bb;letter-spacing:.12em;background:#10281b;border:1px solid #2b6944;border-radius:5px;padding:3px 7px;font:10px ui-monospace,monospace}.icon-button{min-width:36px;padding:7px;font-size:18px}.workspace{grid-template-columns:290px minmax(0,1fr);gap:18px;max-width:1500px;margin:0 auto;padding:18px;display:grid}.panel{border:1px solid var(--line);background:linear-gradient(145deg,#121824fa,#0d121bfa);border-radius:13px;box-shadow:0 12px 40px #0004}.sidebar{flex-direction:column;height:calc(100vh - 104px);min-height:650px;padding:16px;display:flex}.section-heading,.video-heading,.offset-card>div,.modal-header,.transport,.setting-row,.reset-box{justify-content:space-between;align-items:center;gap:12px;display:flex}.section-heading h2,.video-heading h2{margin:3px 0 0;font-size:16px}.eyebrow{color:#738095;letter-spacing:.15em;font:9px ui-monospace,monospace}.count{color:#9ea9bb;font:11px ui-monospace,monospace}.phase-selector{grid-template-columns:1fr 1fr;gap:6px;margin-top:14px;display:grid}.phase-selector button{text-align:left;min-width:0;padding:8px 7px}.phase-selector button span,.phase-selector button small{white-space:nowrap;display:block}.phase-selector button span{font-size:11px;font-weight:700}.phase-selector button small{color:var(--muted);font:8px/1.5 ui-monospace,monospace}.phase-selector button.selected{color:#c8d6ff;background:#1a2947;border-color:#5d8cff;box-shadow:inset 0 0 0 1px #5d8cff33}.phase-selector button.selected small{color:#8eabff}.preset-list{scrollbar-width:thin;flex:1;min-height:0;margin:10px -5px 14px;padding-right:4px;overflow-y:auto}.preset-row{border:1px solid #0000;border-radius:8px;align-items:center;gap:5px;padding:3px 5px;display:flex}.preset-row:hover{background:#171e2a}.preset-row.active{background:#172238;border-color:#415d9e}.preset-row label{flex:1;align-items:center;min-width:0;display:flex}.preset-row input{accent-color:var(--blue)}.preset-name{text-align:left;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:0;flex:1;min-width:0;padding:7px;font-size:12px;overflow:hidden}.preset-name:hover:not(:disabled){background:0 0;border-color:#0000}.edit-button{opacity:0;padding:5px 7px;font-size:10px}.preset-row:hover .edit-button,.preset-row:focus-within .edit-button{opacity:1}.offset-card{border-top:1px solid var(--line);padding-top:14px;font-size:12px}.offset-card strong{color:#9db5ff;font:12px ui-monospace,monospace}.offset-card input{width:100%;accent-color:var(--blue)}.range-labels{color:#697487;justify-content:space-between;font:9px ui-monospace,monospace;display:flex}.trainer{flex-direction:column;gap:13px;min-width:0;display:flex}.video-card{overflow:hidden}.video-heading{height:64px;padding:0 18px}.play-state{color:#7c8798;font:10px ui-monospace,monospace}.play-state.live{color:#69d594}.video-stage{aspect-ratio:16/9;background:#020305;place-items:center;display:grid;position:relative;overflow:hidden}.video-stage video{object-fit:contain;cursor:pointer;width:100%;min-width:0;height:100%;min-height:0;position:absolute;inset:0}.video-stage:fullscreen{background:#000}.stage-play{color:#fff;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0c1322cc;border-color:#8fa8e8aa;border-radius:50%;place-items:center;width:58px;height:58px;padding:0 0 0 4px;font-size:22px;display:grid;position:absolute;box-shadow:0 10px 40px #000a}.empty-state{color:var(--muted);font-size:13px}.judgment{pointer-events:none;text-shadow:0 3px 20px #000;background:radial-gradient(circle,#0a0d 0,#0000 52%);flex-direction:column;justify-content:center;align-items:center;animation:.16s ease-out pop;display:flex;position:absolute;inset:0}.judgment strong{letter-spacing:-.06em;font:900 clamp(32px,6vw,76px) ui-monospace,monospace}.judgment span{font:14px ui-monospace,monospace}.judgment.success{color:#7bf1a8}.judgment.failure{color:#ff7c8b}@keyframes pop{0%{opacity:0;transform:scale(.82)}}.timeline{cursor:pointer;background:#0a0e16;border-top:1px solid #202736;border-bottom:1px solid #202736;outline:none;height:13px;position:relative;overflow:hidden}.timeline:focus-visible{box-shadow:inset 0 0 0 1px #7799f4}.progress{pointer-events:none;background:#5d8cff30;border-right:1px solid #92acff;position:absolute;inset:0 auto 0 0}.cue-window{opacity:.85;pointer-events:none;border-radius:5px;min-width:3px;height:6px;position:absolute;top:3px}.transport{min-height:55px;padding:9px 18px}.transport-main,.media-actions{align-items:center;gap:8px;display:flex}.transport>span,.media-actions>span{color:#778296;width:48px;font:10px ui-monospace,monospace}.media-actions>span{text-align:right}.media-button{width:34px;height:32px;padding:0;font-size:14px}.primary-button{color:#fff;background:#456fe0;border-color:#7193ed;font-weight:700}.primary-button:hover:not(:disabled){background:#557ee9}.action-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.action-card{--action-color:#fff;border-top:2px solid var(--action-color);align-items:center;gap:10px;padding:12px;display:flex}.keycap{border:1px solid color-mix(in srgb,var(--action-color),#fff 20%);min-width:40px;height:34px;color:var(--action-color);background:#070a10;border-radius:7px;place-items:center;padding:0 7px;font:700 12px ui-monospace,monospace;display:grid}.action-card strong,.action-card small{display:block}.action-card strong{font-size:12px}.action-card small{color:var(--muted);margin-top:3px;font:9px ui-monospace,monospace}.hint{text-align:center;color:#6e788a;margin:0;font-size:11px}.modal-backdrop{z-index:20;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#02040ad9;place-items:center;padding:22px;display:grid;position:fixed;inset:0}.modal{background:#111722;border:1px solid #343e51;border-radius:14px;width:min(860px,100%);max-height:min(760px,100vh - 44px);padding:20px;overflow:auto;box-shadow:0 30px 100px #000}.modal-header{border-bottom:1px solid var(--line);margin-bottom:15px;padding-bottom:14px}.modal-header h2{margin:0;font-size:17px}.modal-actions{border-top:1px solid var(--line);justify-content:flex-end;gap:8px;margin-top:16px;padding-top:15px;display:flex}.timing-editor{flex-direction:column;gap:9px;display:flex}.timing-row{background:#0b1018;border:1px solid #202838;border-radius:9px;grid-template-columns:1.1fr 1.1fr 1fr 1fr auto;align-items:end;gap:8px;padding:10px;display:grid}.timing-row label{color:var(--muted);font-size:9px}.timing-row select,.timing-row input{color:#e7ebf3;background:#161d29;border:1px solid #303a4c;border-radius:6px;width:100%;margin-top:5px;padding:8px;display:block}.danger-text{color:#fb7185}.action-settings{gap:8px;display:grid}.setting-row{border:1px solid var(--line);border-radius:9px;padding:10px}.setting-row strong{flex:1}.setting-row button{min-width:120px;font:12px ui-monospace,monospace}.setting-row button.capturing{color:#fbbf24;border-color:#fbbf24}.setting-row input[type=color]{background:0 0;border:0;width:38px;height:34px}.reset-box{background:#23141a;border:1px solid #552d38;border-radius:9px;margin-top:18px;padding:12px}.reset-box p{color:#a68c94;margin:4px 0 0;font-size:11px}.danger-button{color:#ff9baa;background:#351821;border-color:#743a48}@media (width<=850px){.workspace{grid-template-columns:1fr;padding:10px}.sidebar{height:auto;min-height:0}.preset-list{max-height:210px}.action-grid{grid-template-columns:repeat(2,1fr)}.topbar{padding:0 14px}.timing-row{grid-template-columns:1fr 1fr}.timing-row .danger-text{grid-column:2}.modal{padding:14px}}@media (width<=480px){.topbar{height:58px}.brand p{display:none}.workspace{gap:9px;padding:8px}.sidebar{padding:12px}.phase-selector{grid-template-columns:repeat(4,1fr)}.phase-selector button{text-align:center;padding:8px 3px}.phase-selector button span{font-size:10px}.phase-selector button small{display:none}.preset-list{max-height:155px;margin-bottom:8px}.video-heading{height:57px;padding:0 12px}.video-heading h2{font-size:14px}.transport{gap:6px;padding:8px}.transport>span,.media-actions>span{display:none}.transport-main{flex:1}.transport-main button{flex:1;padding-inline:7px;font-size:11px}.media-actions{gap:5px}.media-actions .media-button{flex:none;width:31px}.action-grid{gap:7px}.action-card{gap:7px;padding:8px}.keycap{min-width:34px;height:30px;font-size:10px}.hint{padding:0 8px;line-height:1.5}.modal-backdrop{padding:8px}.timing-row{grid-template-columns:1fr}.timing-row .danger-text{grid-column:1}.setting-row button{min-width:105px}.reset-box{flex-direction:column;align-items:flex-start}}