#controls{position:absolute;left:50%;bottom:var(--controls-bottom);transform:translate(-50%);display:flex;align-items:center;gap:var(--space-2);min-width:clamp(360px,60vw,1080px);padding:var(--space-2) var(--space-3);border-radius:var(--radius-2xl);background:var(--glass-bg);border:1px solid var(--color-border);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);box-shadow:var(--shadow-lg),inset 0 1px #ffffff0d;user-select:none;z-index:19999}#controls>*{position:relative;z-index:1}#controls,#right-controls{touch-action:none}.controls-separator{width:1px;height:24px;background:var(--color-border);flex-shrink:0;border-radius:var(--radius-full)}#play-btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;line-height:1!important;padding:0 0 1px!important;border-radius:var(--radius-xl);border:1px solid rgba(57,208,216,.3);background:var(--color-accent-dim);color:var(--color-accent);font-size:1rem;transition:background var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast),border-color var(--transition-fast)}#play-btn:hover{background:rgba(57,208,216,.22);border-color:#39d0d88c;box-shadow:0 0 14px #39d0d833;transform:scale(1.08)}#play-btn:active{transform:scale(.96)}#window-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;height:40px;padding:0 var(--space-5) 0 var(--space-3);border-radius:var(--radius-xl);border:1px solid var(--color-border);background-color:var(--glass-bg-2);background-image:linear-gradient(45deg,transparent 50%,var(--color-text-muted) 50%),linear-gradient(135deg,var(--color-text-muted) 50%,transparent 50%);background-position:calc(100% - 12px) calc(50% + 1px),calc(100% - 7px) calc(50% + 1px);background-size:4px 4px,4px 4px;background-repeat:no-repeat;color:var(--color-text);font-size:var(--text-xs);font-weight:500;outline:none;transition:border-color var(--transition-fast),background-color var(--transition-fast)}#window-select:hover{border-color:var(--color-border-hover);background-color:var(--glass-bg-2h)}#window-select:focus{border-color:#39d0d880;box-shadow:0 0 0 3px #39d0d81a}#controls label[for=window-select]{font-size:var(--text-xs);font-weight:600;letter-spacing:.04em;color:var(--color-text-muted);white-space:nowrap}#time-label{font-size:var(--text-xs);font-weight:500;color:var(--color-text-muted);white-space:nowrap;min-width:150px;text-align:center;font-variant-numeric:tabular-nums}#time-slider{-webkit-appearance:none;appearance:none;flex:1 1 auto;min-width:180px;width:auto;height:4px;border-radius:var(--radius-full);outline:none;background:var(--slider-color-past);cursor:pointer}#time-slider::-webkit-slider-runnable-track{height:4px;border-radius:var(--radius-full);background:var(--slider-color-past)}#time-slider:hover::-webkit-slider-runnable-track{background:color-mix(in srgb,var(--slider-color-past) 70%,var(--color-accent))}#time-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;margin-top:-6px;border-radius:var(--radius-full);background:var(--color-accent);border:2px solid var(--color-bg);box-shadow:0 0 8px #39d0d873;cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast);scale:1.25}#time-slider::-webkit-slider-thumb:hover{transform:scale(1.25);box-shadow:0 0 14px #39d0d8a6}#time-slider::-moz-range-thumb:hover{transform:scale(1.25);box-shadow:0 0 14px #39d0d8a6}#time-slider::-moz-range-track{height:4px;border-radius:var(--radius-full);background:var(--slider-color-past)}#time-slider::-moz-range-thumb{width:16px;height:16px;border-radius:var(--radius-full);background:var(--color-accent);border:2px solid var(--color-bg);box-shadow:0 0 8px #39d0d873;cursor:pointer}#time-slider::-moz-range-thumb:hover{transform:scale(1.25)}#controls.has-new-frames:not(.has-nowcast-frames) #time-slider::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--slider-color-past) 0% var(--new-start-pct, 100%),var(--slider-color-new) var(--new-start-pct, 100%) 100%)!important}#controls.has-new-frames:not(.has-nowcast-frames) #time-slider::-moz-range-track{background:linear-gradient(to right,var(--slider-color-past) 0% var(--new-start-pct, 100%),var(--slider-color-new) var(--new-start-pct, 100%) 100%)!important}#controls.has-nowcast-frames #time-slider::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--slider-color-past) 0% var(--new-start-pct, 100%),var(--slider-color-new) var(--new-start-pct, 100%) var(--t0-pct, 100%),var(--slider-color-nc-near) var(--t0-pct, 100%) var(--nowcast-near-pct, 100%),var(--slider-color-nc-far) var(--nowcast-near-pct, 100%) 100%)!important}#controls.has-nowcast-frames #time-slider::-moz-range-track{background:linear-gradient(to right,var(--slider-color-past) 0% var(--new-start-pct, 100%),var(--slider-color-new) var(--new-start-pct, 100%) var(--t0-pct, 100%),var(--slider-color-nc-near) var(--t0-pct, 100%) var(--nowcast-near-pct, 100%),var(--slider-color-nc-far) var(--nowcast-near-pct, 100%) 100%)!important}
