:root{--bg: #0f0f1a;--surface: #1a1a2e;--surface2: #16213e;--accent: #e040fb;--accent2: #7c4dff;--text: #e8e8f0;--text-muted: #8888aa;--success: #69f0ae;--error: #ff5252;--border: #2a2a4a;--radius: 12px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100dvh;-webkit-font-smoothing:antialiased}.app{display:flex;flex-direction:column;min-height:100dvh;max-width:480px;margin:0 auto;padding:0 16px}.app-header{padding:24px 0 16px;text-align:center}.app-title{font-size:28px;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.app-subtitle{font-size:13px;color:var(--text-muted);margin-top:4px}.app-main{flex:1;padding-bottom:24px}.step-indicator{display:flex;justify-content:center;gap:12px;margin-bottom:24px}.step-dot{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;background:var(--surface);color:var(--text-muted);border:2px solid var(--border);transition:all .2s}.step-dot.active{background:var(--accent);color:#fff;border-color:var(--accent)}.step-dot.done{background:var(--surface2);color:var(--success);border-color:var(--success)}.step-container{background:var(--surface);border-radius:var(--radius);padding:20px;display:flex;flex-direction:column;gap:16px}.step-title{font-size:16px;font-weight:700;color:var(--text)}.drop-zone{border:2px dashed var(--border);border-radius:var(--radius);padding:40px 20px;text-align:center;cursor:pointer;transition:border-color .2s,background .2s;display:flex;flex-direction:column;align-items:center;gap:12px;-webkit-tap-highlight-color:transparent}.drop-zone:hover,.drop-zone:focus{border-color:var(--accent);background:#e040fb0d;outline:none}.drop-zone-icon{font-size:48px}.drop-zone-text{font-size:15px;color:var(--text);line-height:1.6}.drop-zone-hint{font-size:12px;color:var(--text-muted)}.file-info{display:flex;flex-direction:column;gap:4px;padding:12px;background:var(--surface2);border-radius:8px}.file-name{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-meta{font-size:12px;color:var(--text-muted)}.preview-video{width:100%;border-radius:8px;max-height:240px;background:#000}.range-section{display:flex;flex-direction:column;gap:12px}.range-field{display:flex;align-items:center;gap:8px}.range-field label{font-size:13px;color:var(--text-muted);width:120px;flex-shrink:0}.range-input{flex:1;background:var(--surface2);border:1px solid var(--border);border-radius:6px;padding:8px 10px;color:var(--text);font-size:14px;min-width:0}.range-input:focus{outline:none;border-color:var(--accent)}.range-display{font-size:13px;color:var(--text-muted);width:40px;text-align:right;flex-shrink:0}.range-hint{font-size:12px;color:var(--text-muted)}.trim-section{display:flex;flex-direction:column;gap:10px}.trim-time-row{display:flex;justify-content:space-between;align-items:center}.trim-time{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text);min-width:52px}.end-time{text-align:right}.trim-sel-dur{font-size:12px;font-weight:600;color:var(--accent)}.trim-track-wrap{position:relative;height:44px;display:flex;align-items:center;touch-action:none;-webkit-user-select:none;user-select:none;overflow:visible}.trim-track-bg{position:absolute;left:0;right:0;height:6px;background:var(--border);border-radius:3px;pointer-events:none}.trim-fill{position:absolute;height:6px;background:linear-gradient(90deg,var(--accent2),var(--accent));border-radius:3px;pointer-events:none}.trim-handle{position:absolute;width:26px;height:26px;border-radius:50%;background:#fff;border:3px solid var(--accent);transform:translate(-50%);cursor:grab;touch-action:none;box-shadow:0 2px 8px #00000073;transition:transform .1s,box-shadow .1s;z-index:1}.trim-handle:active{cursor:grabbing;transform:translate(-50%) scale(1.15);box-shadow:0 3px 12px #e040fb80}.trim-nudge-row{display:flex;gap:8px}.trim-nudge-group{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}.trim-nudge-label{display:flex;align-items:baseline;gap:6px;font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.trim-nudge-val{font-size:12px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0}.trim-nudge-btns{display:flex;gap:4px}.btn-nudge{flex:1;padding:9px 0;background:var(--surface2);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:11px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .1s;min-width:0}.btn-nudge:active{background:var(--border)}.trim-hint{font-size:12px;color:var(--text-muted);text-align:center}.btn-preview{background:var(--surface2);border:1px solid var(--border);color:var(--text);font-size:14px;font-weight:600;border-radius:10px;padding:12px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,border-color .15s;width:100%}.btn-preview:active{background:var(--border)}.btn-preview-active{border-color:var(--accent);color:var(--accent)}.preset-section{display:flex;flex-direction:column;gap:8px}.preset-label{font-size:13px;font-weight:600;color:var(--text-muted)}.preset-option{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:border-color .2s,background .2s}.preset-option.selected{border-color:var(--accent);background:#e040fb14}.preset-option input[type=radio]{accent-color:var(--accent);width:16px;height:16px;flex-shrink:0}.preset-name{font-size:14px;font-weight:600}.preset-desc{font-size:12px;color:var(--text-muted);margin-left:auto}.button-row{display:flex;gap:12px}.btn{flex:1;padding:14px;border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;transition:opacity .2s,transform .1s;-webkit-tap-highlight-color:transparent}.btn:active{transform:scale(.97)}.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff}.btn-secondary{background:var(--surface2);color:var(--text);border:1px solid var(--border)}.btn-download{display:block;text-align:center;text-decoration:none}.phase-label{font-size:15px;font-weight:600;text-align:center;color:var(--text)}.progress-bar-wrap{display:flex;align-items:center;gap:10px}.progress-bar{flex:1;height:10px;border-radius:5px;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:var(--surface2);border:none;overflow:hidden}.progress-bar::-webkit-progress-bar{background:var(--surface2);border-radius:5px}.progress-bar::-webkit-progress-value{background:linear-gradient(90deg,var(--accent2),var(--accent));border-radius:5px;transition:width .3s ease}.progress-bar::-moz-progress-bar{background:linear-gradient(90deg,var(--accent2),var(--accent));border-radius:5px}.progress-text{font-size:13px;color:var(--text-muted);width:36px;text-align:right}.converting-hint{font-size:12px;color:var(--text-muted);text-align:center}.result-section{display:flex;flex-direction:column;gap:12px}.result-message{text-align:center;font-size:15px;color:var(--success);font-weight:600}.error-section{display:flex;flex-direction:column;gap:12px}.error-title{font-size:15px;font-weight:700;color:var(--error)}.error-detail{font-size:12px;color:var(--text-muted);font-family:monospace;background:var(--surface2);padding:8px;border-radius:6px;word-break:break-all}.error-guide{font-size:13px;color:var(--text-muted);padding-left:20px;display:flex;flex-direction:column;gap:6px}.app-footer{padding:16px 0;text-align:center}.app-footer p{font-size:11px;color:var(--text-muted);line-height:1.6}