*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#1a1a2e;color:#eee;min-height:100vh}.app{max-width:900px;margin:0 auto;padding:20px}h1{text-align:center;margin-bottom:30px;color:#4ecca3}h3{margin-bottom:15px;color:#4ecca3}.settings-panel{display:flex;flex-direction:column;gap:15px}.frame-rate-setting{background:#232342;padding:15px 20px;border-radius:8px}.frame-rate-setting label{display:flex;align-items:center;gap:12px;color:#aaa;font-size:14px}.frame-rate-setting select{background:#333;color:#fff;border:1px solid #555;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:14px}.video-player{margin-bottom:20px}.upload-area{border:3px dashed #4ecca3;border-radius:12px;padding:60px;text-align:center;cursor:pointer;transition:all .3s;background:#4ecca31a}.upload-area:hover{background:#4ecca333;border-color:#7dffce}.upload-area p{font-size:18px;color:#aaa}.video-container{position:relative;background:#000;border-radius:8px;overflow:hidden}.video-container video{width:100%;display:block}.time-overlay{position:absolute;top:10px;right:10px;background:#000c;padding:8px 12px;border-radius:4px;font-family:monospace;font-size:16px;color:#4ecca3;z-index:10}.floating-controls{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:8px;z-index:10;opacity:0;transition:opacity .2s}.video-container:hover .floating-controls{opacity:1}.floating-controls-row{display:flex;gap:6px;justify-content:center}.floating-btn{background:#000c;color:#fff;border:1px solid rgba(255,255,255,.2);padding:10px 16px;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.floating-btn:hover{background:#4ecca3cc;border-color:#4ecca3}.floating-btn.play{padding:10px 24px;font-size:18px}.floating-btn.start{background:#00ff884d;border-color:#0f8;color:#0f8}.floating-btn.start:hover{background:#0f89}.floating-btn.end{background:#ff6b6b4d;border-color:#ff6b6b;color:#ff6b6b}.floating-btn.end:hover{background:#ff6b6b99}.floating-btn.clear{background:#64646480;border-color:#888;color:#aaa}.floating-btn.clear:hover{background:#96969699}.marker-display{position:absolute;top:10px;left:10px;display:flex;flex-direction:column;gap:6px;z-index:10}.marker-tag{padding:6px 12px;border-radius:4px;font-family:monospace;font-size:13px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.marker-tag.start{background:#00ff884d;color:#0f8;border:1px solid #00ff88}.marker-tag.end{background:#ff6b6b4d;color:#ff6b6b;border:1px solid #ff6b6b}.timeline-container{padding:12px 15px;background:#232342;border-radius:0 0 8px 8px}.timeline-time{text-align:center;font-family:monospace;font-size:13px;color:#888;margin-top:8px}.timeline{height:20px;background:#333;border-radius:10px;position:relative;cursor:pointer;overflow:visible}.timeline-progress{height:100%;background:linear-gradient(90deg,#4ecca3,#2d8a6e);border-radius:10px;transition:width .1s}.timeline-marker{position:absolute;top:-5px;width:4px;height:30px;border-radius:2px;transform:translate(-50%);z-index:10}.start-marker{background:#0f8}.end-marker{background:#ff6b6b}.timeline-selection{position:absolute;top:0;height:100%;background:#4ecca34d;pointer-events:none}.change-video-btn{margin-top:10px;background:transparent;border:1px solid #666;color:#aaa;padding:8px 16px;border-radius:6px;cursor:pointer;transition:all .2s}.change-video-btn:hover{border-color:#4ecca3;color:#4ecca3}.frame-controls{background:#232342;padding:20px;border-radius:8px;margin-bottom:20px}.frame-buttons{display:flex;gap:10px;margin-bottom:15px}.frame-btn{flex:1;background:#333;color:#fff;border:none;padding:15px;border-radius:6px;cursor:pointer;font-size:16px;transition:all .2s}.frame-btn:hover{background:#4ecca3;color:#1a1a2e}.frame-rate-control label{display:flex;align-items:center;gap:10px;color:#aaa}.frame-rate-control select{background:#333;color:#fff;border:1px solid #555;padding:8px 12px;border-radius:4px;cursor:pointer}.time-marker{background:#232342;padding:20px;border-radius:8px;margin-bottom:20px}.marker-buttons{display:flex;gap:10px;margin-bottom:20px}.marker-btn{flex:1;padding:12px;border:none;border-radius:6px;cursor:pointer;font-weight:700;transition:all .2s}.marker-btn.start{background:#0f8;color:#1a1a2e}.marker-btn.start:hover{background:#33ff9f}.marker-btn.end{background:#ff6b6b;color:#fff}.marker-btn.end:hover{background:#ff8a8a}.marker-btn.clear{background:#555;color:#fff}.marker-btn.clear:hover{background:#777}.marker-info{background:#1a1a2e;padding:15px;border-radius:6px}.marker-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #333}.marker-row:last-child{border-bottom:none}.marker-row.duration{margin-top:10px;padding-top:15px;border-top:2px solid #4ecca3;border-bottom:none}.marker-label{font-weight:700;color:#888;min-width:80px}.marker-value{font-family:monospace;font-size:16px;color:#4ecca3}.jump-btn{background:#333;color:#aaa;border:none;padding:4px 10px;border-radius:4px;cursor:pointer;font-size:12px;margin-left:auto}.jump-btn:hover{background:#4ecca3;color:#1a1a2e}.rpm-calculator{background:#232342;padding:20px;border-radius:8px;margin-bottom:20px}.spin-type-selector{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid #333}.spin-type-selector>label{display:block;color:#aaa;margin-bottom:10px}.spin-type-buttons{display:flex;gap:10px;margin-bottom:15px}.spin-type-btn{flex:1;background:#1a1a2e;border:2px solid #333;border-radius:8px;padding:12px;cursor:pointer;transition:all .2s;text-align:left}.spin-type-btn strong{display:block;color:#fff;margin-bottom:4px}.spin-type-btn span{font-size:12px;color:#666}.spin-type-btn:hover{border-color:#4ecca3}.spin-type-btn.active{border-color:#4ecca3;background:#4ecca31a}.spin-type-btn.active strong{color:#4ecca3}.threshold-ranges{display:flex;flex-wrap:wrap;gap:8px}.threshold-badge{font-size:11px;padding:4px 8px;border-radius:4px;background:#333;color:#aaa}.threshold-badge.low{background:#444;color:#888}.threshold-badge.medium{background:#f39c1233;color:#f39c12}.threshold-badge.good{background:#2ecc7133;color:#2ecc71}.threshold-badge.excellent{background:#3498db33;color:#3498db}.threshold-badge.elite{background:#9b59b633;color:#9b59b6}.calculator-hint{color:#888;text-align:center;padding:20px}.slowmo-input{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid #333}.slowmo-input label{display:flex;align-items:center;gap:10px;color:#aaa;flex-wrap:wrap}.slowmo-input select{background:#333;color:#fff;border:1px solid #555;padding:10px 14px;border-radius:4px;cursor:pointer;font-size:14px}.custom-slowmo-input{background:#1a1a2e;border:2px solid #4ecca3;color:#fff;padding:8px 12px;border-radius:4px;width:80px;text-align:center;font-size:14px}.custom-slowmo-input:focus{outline:none;border-color:#7dffce}.slowmo-hint{margin-top:10px;font-size:12px;color:#666;font-style:italic}.duration-info{background:#1a1a2e;padding:12px 15px;border-radius:6px;margin-bottom:20px}.duration-row{display:flex;justify-content:space-between;padding:6px 0;color:#888;font-size:14px}.duration-row.real{color:#4ecca3;font-weight:700;border-top:1px solid #333;margin-top:6px;padding-top:10px}.duration-row span:last-child{font-family:monospace}.revolution-input{margin-bottom:20px}.revolution-input label{display:flex;flex-direction:column;gap:10px;color:#aaa}.revolution-input input{background:#1a1a2e;border:2px solid #4ecca3;color:#fff;padding:15px;border-radius:6px;font-size:18px;text-align:center}.revolution-input input:focus{outline:none;border-color:#7dffce}.rpm-result{text-align:center;padding:30px;border-radius:12px;margin-bottom:20px}.rpm-result.low{background:linear-gradient(135deg,#666,#444)}.rpm-result.medium{background:linear-gradient(135deg,#f39c12,#e67e22)}.rpm-result.good{background:linear-gradient(135deg,#27ae60,#2ecc71)}.rpm-result.excellent{background:linear-gradient(135deg,#3498db,#2980b9)}.rpm-result.elite{background:linear-gradient(135deg,#9b59b6,#8e44ad)}.rpm-value{font-size:64px;font-weight:700;line-height:1}.rpm-label{font-size:24px;opacity:.8;margin-top:5px}.rpm-category{margin-top:10px;font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:2px}.calculation-breakdown{background:#1a1a2e;padding:15px;border-radius:6px;font-size:14px;color:#888}.calculation-detail{margin-top:10px;font-family:monospace;color:#4ecca3}.instructions{background:#232342;padding:20px;border-radius:8px;margin-top:30px}.instructions h3{margin-bottom:15px}.instructions ol{margin-left:20px;color:#aaa}.instructions li{margin-bottom:8px}.instructions p{margin-top:15px;color:#888;font-size:14px}@media (max-width: 600px){.app{padding:10px}.frame-buttons,.marker-buttons{flex-direction:column}.rpm-value{font-size:48px}}