:root{--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "SF Mono", Consolas, Menlo, monospace;--font-serif: "Newsreader", Georgia, serif;--bg-primary: #f8fafc;--bg-surface: #ffffff;--bg-surface-elevated: #ffffff;--bg-glass: rgba(255, 255, 255, .85);--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #94a3b8;--border-subtle: rgba(0, 0, 0, .08);--border-medium: rgba(0, 0, 0, .14);--accent: #e11d48;--accent-hover: #be123c;--accent-subtle: rgba(225, 29, 72, .08);--accent-glow: rgba(225, 29, 72, .25);--clock-face-bg: #ffffff;--clock-face-border: #e2e8f0;--clock-inner-ring: rgba(0, 0, 0, .04);--clock-mark-major: #1e293b;--clock-mark-medium: #64748b;--clock-mark-minor: #cbd5e1;--clock-mark-subtle: #94a3b8;--hour-hand: #0f172a;--minute-hand: #334155;--second-hand: #e11d48;--clock-label-muted: #94a3b8;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .08), 0 2px 4px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .05)}[data-theme=dark]{--bg-primary: #090d16;--bg-surface: #111726;--bg-surface-elevated: #161e31;--bg-glass: rgba(17, 23, 38, .88);--text-primary: #f8fafc;--text-secondary: #cbd5e1;--text-muted: #64748b;--border-subtle: rgba(255, 255, 255, .08);--border-medium: rgba(255, 255, 255, .16);--accent: #f43f5e;--accent-hover: #fb7185;--accent-subtle: rgba(244, 63, 94, .15);--accent-glow: rgba(244, 63, 94, .35);--clock-face-bg: #0d1322;--clock-face-border: rgba(255, 255, 255, .1);--clock-inner-ring: rgba(255, 255, 255, .04);--clock-mark-major: #f1f5f9;--clock-mark-medium: #94a3b8;--clock-mark-minor: rgba(255, 255, 255, .16);--clock-mark-subtle: #475569;--hour-hand: #f8fafc;--minute-hand: #cbd5e1;--second-hand: #f43f5e;--clock-label-muted: #64748b;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .4);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -2px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .6), 0 8px 10px -6px rgba(0, 0, 0, .5)}[data-theme=light]{--bg-primary: #f8fafc;--bg-surface: #ffffff;--bg-surface-elevated: #ffffff;--bg-glass: rgba(255, 255, 255, .85);--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #94a3b8;--border-subtle: rgba(0, 0, 0, .08);--border-medium: rgba(0, 0, 0, .14);--accent: #e11d48;--accent-hover: #be123c;--accent-subtle: rgba(225, 29, 72, .08);--accent-glow: rgba(225, 29, 72, .25);--clock-face-bg: #ffffff;--clock-face-border: #e2e8f0;--clock-inner-ring: rgba(0, 0, 0, .04);--clock-mark-major: #1e293b;--clock-mark-medium: #64748b;--clock-mark-minor: #cbd5e1;--clock-mark-subtle: #94a3b8;--hour-hand: #0f172a;--minute-hand: #334155;--second-hand: #e11d48;--clock-label-muted: #94a3b8}@media(prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]){--bg-primary: #090d16;--bg-surface: #111726;--bg-surface-elevated: #161e31;--bg-glass: rgba(17, 23, 38, .88);--text-primary: #f8fafc;--text-secondary: #cbd5e1;--text-muted: #64748b;--border-subtle: rgba(255, 255, 255, .08);--border-medium: rgba(255, 255, 255, .16);--accent: #f43f5e;--accent-hover: #fb7185;--accent-subtle: rgba(244, 63, 94, .15);--accent-glow: rgba(244, 63, 94, .35);--clock-face-bg: #0d1322;--clock-face-border: rgba(255, 255, 255, .1);--clock-inner-ring: rgba(255, 255, 255, .04);--clock-mark-major: #f1f5f9;--clock-mark-medium: #94a3b8;--clock-mark-minor: rgba(255, 255, 255, .16);--clock-mark-subtle: #475569;--hour-hand: #f8fafc;--minute-hand: #cbd5e1;--second-hand: #f43f5e;--clock-label-muted: #64748b}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden;font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{width:100%;height:100%;display:flex;flex-direction:column}.flex-row-center{display:flex;align-items:center}.flex-row-between{display:flex;align-items:center;justify-content:space-between}.font-mono{font-family:var(--font-mono)}.font-serif{font-family:var(--font-serif)}.font-sans{font-family:var(--font-sans)}.font-bold{font-weight:700}.font-semibold{font-weight:600}.font-medium{font-weight:500}.text-accent{color:var(--accent)}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.text-primary{color:var(--text-primary)}.text-danger{color:#ef4444}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.w-full{width:100%}.app-container{display:flex;flex-direction:column;height:100%;max-width:1200px;margin:0 auto;padding:1rem 1.5rem;position:relative}.app-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;z-index:10;gap:.5rem}.header-brand{display:flex;align-items:center;gap:.65rem;min-width:0}.logo-icon-wrap{width:36px;height:36px;min-width:36px;display:flex;align-items:center;justify-content:center;background:var(--accent-subtle);color:var(--accent);border-radius:10px;border:1px solid var(--accent-glow)}.logo-icon{transform:rotate(-12deg);transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.header-brand:hover .logo-icon{transform:rotate(12deg) scale(1.05)}.brand-title{font-size:1.2rem;font-weight:700;letter-spacing:-.02em;color:var(--text-primary);white-space:nowrap}.brand-badge{font-size:.6875rem;padding:.15rem .45rem;background:var(--accent-subtle);color:var(--accent);border-radius:6px;border:1px solid var(--accent-glow);font-weight:700;white-space:nowrap}.brand-tagline{font-size:.75rem;color:var(--text-muted);margin-top:.1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-actions{display:flex;align-items:center;gap:.4rem;flex-shrink:0}.btn-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:var(--bg-surface);color:var(--text-secondary);border:1px solid var(--border-subtle);cursor:pointer;transition:all .18s ease;flex-shrink:0}.btn-icon:hover{background:var(--bg-surface-elevated);color:var(--text-primary);border-color:var(--border-medium);transform:translateY(-1px)}.btn-icon:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn-settings-accent{background:var(--accent-subtle);color:var(--accent);border-color:var(--accent-glow)}.btn-settings-accent:hover{background:var(--accent);color:#fff}.main-stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;min-height:0}.clock-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem;width:100%}.clock-viewport{width:min(76vw,58vh,400px);height:min(76vw,58vh,400px);display:flex;align-items:center;justify-content:center;position:relative}.clock-svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(var(--shadow-md))}.fill-clock-face{fill:var(--clock-face-bg)}.stroke-clock-border{stroke:var(--clock-face-border)}.stroke-clock-inner-ring{stroke:var(--clock-inner-ring)}.stroke-clock-mark-major{stroke:var(--clock-mark-major)}.stroke-clock-mark-medium{stroke:var(--clock-mark-medium)}.stroke-clock-mark-minor{stroke:var(--clock-mark-minor)}.fill-clock-mark-subtle{fill:var(--clock-mark-subtle)}.stroke-hour-hand{stroke:var(--hour-hand)}.stroke-minute-hand{stroke:var(--minute-hand)}.stroke-second-hand{stroke:var(--second-hand)}.fill-second-hand{fill:var(--second-hand)}.fill-clock-label-muted{fill:var(--clock-label-muted)}.digital-clock-container{display:flex;flex-direction:column;align-items:center;gap:.25rem}.digital-time-readout{font-family:var(--font-mono);font-size:1.75rem;font-weight:700;letter-spacing:.05em;color:var(--text-primary)}.digital-time-caption{display:flex;align-items:center;gap:.4rem}.badge-real-time{font-size:.6875rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-weight:600}.badge-hurry-active{font-size:.6875rem;font-family:var(--font-mono);font-weight:700;color:var(--accent);background:var(--accent-subtle);padding:.1rem .4rem;border-radius:4px}.bottom-dock{display:flex;align-items:center;justify-content:center;padding:.5rem 0;z-index:10;width:100%}.quick-presets-pill{display:flex;align-items:center;gap:.25rem;padding:.3rem .45rem;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:9999px;box-shadow:var(--shadow-sm);max-width:100%;overflow-x:auto;scrollbar-width:none}.quick-presets-pill::-webkit-scrollbar{display:none}.preset-pill-btn{padding:.25rem .55rem;border-radius:9999px;border:none;background:transparent;color:var(--text-secondary);font-family:var(--font-mono);font-size:.725rem;font-weight:600;cursor:pointer;transition:all .15s ease;white-space:nowrap;flex-shrink:0}.preset-pill-btn:hover{background:var(--bg-surface-elevated);color:var(--text-primary)}.preset-pill-btn.active{background:var(--accent);color:#fff;box-shadow:0 2px 8px var(--accent-glow)}.preset-pill-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:1rem;z-index:100;animation:fadeIn .15s ease-out}.modal-card{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-medium);border-radius:20px;width:100%;max-width:520px;max-height:88vh;display:flex;flex-direction:column;box-shadow:var(--shadow-xl);animation:scaleUp .2s cubic-bezier(.16,1,.3,1);overflow:hidden}.modal-about{max-width:600px}.modal-header{display:flex;align-items:flex-start;justify-content:space-between;padding:1.25rem 1.5rem 1rem;border-bottom:1px solid var(--border-subtle)}.modal-title{font-size:1.25rem;font-weight:700;color:var(--text-primary)}.modal-subtitle{font-size:.8125rem;color:var(--text-muted);margin-top:.15rem}.modal-body{padding:1.25rem 1.5rem;overflow-y:auto;-webkit-overflow-scrolling:touch}.modal-footer{padding:1rem 1.5rem;border-top:1px solid var(--border-subtle);background:var(--bg-surface-elevated)}.space-y-6>*+*{margin-top:1.5rem}.space-y-3>*+*{margin-top:.75rem}.setting-section{display:flex;flex-direction:column;gap:.5rem}.section-label{font-size:.875rem;color:var(--text-primary)}.setting-help-text{font-size:.75rem;color:var(--text-muted);line-height:1.4}.slider-wrapper{display:flex;flex-direction:column;gap:.35rem}.custom-range{width:100%;height:6px;border-radius:3px;background:var(--border-medium);outline:none;accent-color:var(--accent);cursor:pointer}.slider-ticks{display:flex;justify-content:space-between;font-size:.6875rem;color:var(--text-muted)}.preset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.25rem}.preset-chip{padding:.5rem .4rem;border:1px solid var(--border-subtle);background:var(--bg-surface-elevated);border-radius:10px;text-align:center;cursor:pointer;transition:all .15s ease}.preset-chip:hover{border-color:var(--accent);background:var(--accent-subtle)}.preset-chip.active{border-color:var(--accent);background:var(--accent-subtle);box-shadow:0 0 0 1px var(--accent)}.preset-rate{font-size:.8125rem;font-weight:700;color:var(--text-primary)}.preset-chip.active .preset-rate{color:var(--accent)}.preset-desc{font-size:.625rem;color:var(--text-muted);margin-top:.1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.segmented-control{display:flex;background:var(--bg-surface-elevated);padding:.25rem;border-radius:10px;border:1px solid var(--border-subtle);gap:.25rem}.segment-btn{flex:1;padding:.45rem .5rem;border:none;border-radius:8px;background:transparent;color:var(--text-secondary);font-size:.8125rem;font-weight:500;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease}.segment-btn:hover{color:var(--text-primary)}.segment-btn.active{background:var(--bg-surface);color:var(--accent);font-weight:600;box-shadow:var(--shadow-sm)}.icon-mr{margin-right:.35rem}.toggle-list{display:flex;flex-direction:column;gap:.75rem;margin-top:.25rem}.toggle-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;cursor:pointer}.toggle-label-text{display:flex;flex-direction:column}.custom-toggle{width:42px;height:24px;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:var(--border-medium);border-radius:12px;position:relative;cursor:pointer;outline:none;transition:background-color .2s ease;flex-shrink:0}.custom-toggle:before{content:"";position:absolute;width:18px;height:18px;border-radius:50%;top:3px;left:3px;background:#fff;transition:transform .2s cubic-bezier(.34,1.56,.64,1);box-shadow:0 1px 3px #00000040}.custom-toggle:checked{background:var(--accent)}.custom-toggle:checked:before{transform:translate(18px)}.custom-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.custom-toggle:disabled{opacity:.4;cursor:not-allowed}.btn-primary{padding:.65rem 1.25rem;border-radius:10px;border:none;background:var(--accent);color:#fff;font-weight:600;font-size:.875rem;cursor:pointer;transition:all .15s ease}.btn-primary:hover{background:var(--accent-hover);box-shadow:0 2px 10px var(--accent-glow)}.btn-primary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.alert-box{padding:.75rem 1rem;border-radius:10px;font-size:.8125rem;display:flex;gap:.6rem}.alert-subtle{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);color:var(--text-muted)}.alert-warning{background:#f59e0b14;border:1px solid rgba(245,158,11,.25);display:flex;flex-direction:column}.text-warning-title{color:#d97706}.badge-active-status{font-size:.75rem;color:#10b981;font-weight:500}.quote-card{padding:1rem 1.25rem;background:var(--accent-subtle);border-left:3px solid var(--accent);border-radius:0 10px 10px 0}.quote-text{font-size:.9375rem;color:var(--text-primary)}.flow-diagram{background:var(--bg-surface-elevated);padding:.5rem .75rem;border-radius:8px;border:1px dashed var(--border-medium);color:var(--text-secondary);text-align:center}.comparison-box{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:10px;padding:.75rem 1rem;display:flex;flex-direction:column;gap:.5rem}.comparison-item{display:flex;align-items:center;justify-content:space-between;font-size:.8125rem}.reference-item{padding:.5rem 0;border-bottom:1px solid var(--border-subtle)}.reference-item:last-child{border-bottom:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{opacity:0;transform:scale(.96) translateY(6px)}to{opacity:1;transform:scale(1) translateY(0)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(max-width:640px){.app-container{padding:.5rem .75rem}.brand-tagline{display:none}.brand-title{font-size:1.05rem}.hidden-mobile{display:none}.preset-grid{grid-template-columns:repeat(2,1fr)}.modal-card{max-height:94vh;border-radius:16px}.quick-presets-pill{padding:.25rem .35rem;gap:.15rem}.preset-pill-btn{padding:.2rem .45rem;font-size:.6875rem}}