:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;background-color:#242424;color:#ffffffde}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}#root{width:100%;margin:0 auto;text-align:center}.jump-counter-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0;background-color:#1a1a1a;min-height:100vh;height:100vh;width:100vw;overflow:hidden;color:#fff;font-family:Inter,sans-serif}.video-wrapper{position:relative;width:100vw;height:100vh;background:#000;border-radius:0;overflow:hidden;box-shadow:none;display:flex;align-items:center;justify-content:center}.video-wrapper:fullscreen{width:100vw;height:100vh;border-radius:0}.video-wrapper:fullscreen .webcam-feed,.video-wrapper:fullscreen .pose-overlay{width:100vw;height:100vh;object-fit:contain}.video-wrapper:fullscreen .controls-panel{display:none}.webcam-feed{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}.pose-overlay{position:absolute;top:0;left:0;width:100%;height:100%;transform:scaleX(-1);object-fit:contain}.loading-overlay,.countdown-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#000c;z-index:10}.overlay-stat{position:absolute;z-index:20;display:flex;flex-direction:column;align-items:center;text-shadow:0 2px 4px rgba(0,0,0,.8);pointer-events:none}.overlay-stat.top-left{top:40px;left:40px}.overlay-stat.top-right{top:40px;right:40px}.overlay-value{font-size:5rem;font-weight:900;color:#ffffffe6;line-height:1}.overlay-value.warning{color:#ef4444;animation:pulse .5s infinite}.overlay-label{font-size:1.2rem;font-weight:600;color:#ffffffb3;text-transform:uppercase}.overlay-status{position:absolute;bottom:100px;left:50%;transform:translate(-50%);font-size:3rem;font-weight:800;color:#ffffff80;text-shadow:0 2px 10px rgba(0,0,0,.5);pointer-events:none;transition:all .1s ease;z-index:15}.overlay-status.jumping{color:#facc15;transform:translate(-50%) scale(1.2);opacity:1}.overlay-status.paused{color:#fb923c;transform:translate(-50%) scale(1.1);opacity:1}.recording-indicator{position:absolute;top:20px;left:50%;transform:translate(-50%);background:#ef444433;padding:8px 16px;border-radius:20px;display:flex;align-items:center;gap:8px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(239,68,68,.5);z-index:25;pointer-events:none}.recording-dot{width:10px;height:10px;background:#ef4444;border-radius:50%;animation:recordingPulse 1.5s infinite}.recording-text{color:#fff;font-size:.9rem;font-weight:600;text-shadow:0 1px 3px rgba(0,0,0,.5)}@keyframes recordingPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}.mode-indicator-overlay{position:absolute;top:20px;left:50%;transform:translate(-50%);background:#00000080;padding:4px 12px;border-radius:12px;font-size:.9rem;color:#ffffffb3;pointer-events:none;z-index:15}.immersive-controls{position:absolute;bottom:40px;left:50%;transform:translate(-50%);z-index:30;opacity:0;transition:opacity .3s ease;pointer-events:none;display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.immersive-controls.visible{opacity:1;pointer-events:auto}.loading-overlay{font-size:1.5rem;font-weight:700}.countdown-number{font-size:8rem;font-weight:900;color:#facc15;animation:pulse 1s infinite}.countdown-text{font-size:2rem;font-weight:600;color:#fff;margin-top:10px}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}to{transform:scale(1);opacity:1}}.controls-panel{position:absolute;top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;display:flex;flex-direction:column;gap:16px;align-items:center;background:#2a2a2ad9;padding:16px 28px;border-radius:16px;box-shadow:0 8px 32px #0009;max-width:85%;box-sizing:border-box;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:25;border:1px solid rgba(255,255,255,.1);animation:fadeInPanel .3s ease}@keyframes fadeInPanel{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)!important}to{opacity:1;transform:translate(-50%,-50%) scale(1)!important}}.stats-group{display:flex;justify-content:space-around;width:100%;gap:20px}.count-display,.timer-display{display:flex;flex-direction:column;align-items:center}.label{font-size:.75rem;text-transform:uppercase;letter-spacing:1px;color:#888;margin-bottom:2px}.value{font-size:2rem;font-weight:800;line-height:1;color:#4ade80;font-variant-numeric:tabular-nums}.value.warning{color:#ef4444;animation:pulse .5s infinite}.status-indicator{font-size:1.1rem;font-weight:700;color:#555;width:100%;text-align:center;padding:6px;background:#0003;border-radius:8px}.status-indicator.active{color:#facc15}.setup-controls{display:flex;flex-direction:column;gap:12px;width:100%;align-items:center}.mode-selector{display:flex;align-items:center;gap:12px;margin-bottom:8px}.selector-label{color:#aaa;font-weight:600}.mode-btn{background:#374151;color:#d1d5db;border:2px solid transparent;padding:6px 16px;border-radius:20px;font-weight:600;cursor:pointer;transition:all .2s;font-size:.9rem}.mode-btn:hover{background:#4b5563}.mode-btn.active{background:#3b82f6;color:#fff;border-color:#2563eb}.mode-btn.disabled{opacity:.5;cursor:not-allowed}.duration-selector{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.duration-btn{background:#374151;color:#d1d5db;border:2px solid transparent;padding:6px 12px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s;font-size:.85rem}.duration-btn:hover{background:#4b5563}.duration-btn.active{background:#4ade80;color:#064e3b;border-color:#22c55e}.custom-input-group{display:flex;gap:8px}.custom-input{background:#1f2937;border:1px solid #374151;color:#fff;padding:8px 12px;border-radius:8px;width:80px;text-align:center;font-size:1rem}.confirm-btn{background:#4ade80;color:#064e3b;border:none;padding:8px 16px;border-radius:8px;font-weight:600;cursor:pointer}.recording-toggle{width:100%;display:flex;justify-content:center;margin:8px 0}.toggle-label{display:flex;align-items:center;gap:12px;cursor:pointer;position:relative}.toggle-checkbox{position:absolute;opacity:0;width:0;height:0}.toggle-slider{position:relative;width:48px;height:24px;background:#374151;border-radius:12px;transition:background .3s}.toggle-slider:before{content:"";position:absolute;width:18px;height:18px;background:#fff;border-radius:50%;top:3px;left:3px;transition:transform .3s}.toggle-checkbox:checked+.toggle-slider{background:#ef4444}.toggle-checkbox:checked+.toggle-slider:before{transform:translate(24px)}.toggle-text{color:#ffffffe6;font-size:.95rem;font-weight:500}.control-btn{border:none;padding:10px 32px;border-radius:8px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s;min-width:160px}.start-btn{background:#4ade80;color:#064e3b}.start-btn:hover{background:#22c55e;transform:translateY(-2px)}.stop-btn{background:#ef4444;color:#fff}.stop-btn:hover{background:#dc2626}.stop-btn:disabled{background:#7f1d1d;cursor:not-allowed;opacity:.7}.pause-btn{background:#f59e0b;color:#fff}.pause-btn:hover{background:#d97706}.video-control-buttons{position:absolute;bottom:20px;right:20px;display:flex;flex-direction:column;gap:12px;z-index:30}.icon-control-btn{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);border:none;color:#fff;font-size:1.3rem;cursor:pointer;box-shadow:0 4px 12px #667eea80;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.icon-control-btn:hover{transform:scale(1.1);box-shadow:0 6px 16px #667eea99}.icon-control-btn:active{transform:scale(.95)}@media(max-width:700px){.video-wrapper{width:100vw;height:100vh}.webcam-feed,.pose-overlay{width:100%;height:100%;object-fit:cover}.controls-panel{top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;width:calc(100% - 40px);padding:16px 20px;gap:14px;max-width:90%;max-height:80%}.video-control-buttons{bottom:15px;right:15px;gap:10px}.icon-control-btn{width:44px;height:44px;font-size:1.2rem}.immersive-controls{bottom:30px;gap:8px}.control-btn{padding:8px 20px;font-size:.9rem;min-width:120px}.value{font-size:2rem}.overlay-value{font-size:3rem}.overlay-stat.top-left{top:20px;left:20px}.overlay-stat.top-right{top:20px;right:20px}}
