:root{--bg-primary: #0f172a;--bg-secondary: #1e293b;--accent-primary: #3b82f6;--accent-glow: rgba(59, 130, 246, .5);--text-primary: #f8fafc;--text-secondary: #94a3b8;--glass-bg: rgba(30, 41, 59, .7);--glass-border: rgba(255, 255, 255, .1);--space-xs: .5rem;--space-sm: 1rem;--space-md: 1.5rem;--space-lg: 2rem;--space-xl: 3rem;--font-family: "Inter", system-ui, -apple-system, sans-serif;--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -2px rgba(0, 0, 0, .3);--radius-md: 12px;--radius-lg: 24px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-primary);background-image:radial-gradient(at 0% 0%,rgba(59,130,246,.15) 0px,transparent 50%),radial-gradient(at 100% 100%,rgba(139,92,246,.15) 0px,transparent 50%);color:var(--text-primary);min-height:100vh;display:flex;justify-content:center;align-items:center;line-height:1.6;-webkit-font-smoothing:antialiased}#root{width:100%;max-width:1280px;margin:0 auto;padding:var(--space-md);text-align:center}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}button{background:none;border:none;cursor:pointer;font-family:inherit;color:inherit}.watt-selector-container{display:flex;flex-direction:column;gap:var(--space-xs);margin-bottom:var(--space-md);text-align:left}.selector-label{font-size:.9rem;color:var(--text-secondary);margin-left:var(--space-xs)}.watt-options{display:flex;flex-wrap:wrap;gap:var(--space-xs)}.watt-btn{flex:1;min-width:60px;padding:.75rem .5rem;border-radius:var(--radius-md);background:#ffffff0d;color:var(--text-secondary);border:1px solid transparent;transition:all .2s ease;font-weight:500}.watt-btn:hover{background:#ffffff1a;color:var(--text-primary)}.watt-btn.active{background:var(--accent-primary);color:#fff;box-shadow:0 0 15px var(--accent-glow);border-color:#fff3}@media(max-width:480px){.watt-btn{padding:.5rem .2rem;font-size:.85rem;min-width:45px}.selector-label{margin-bottom:.2rem}.watt-selector-container{margin-bottom:var(--space-sm)}}.time-input-container{display:flex;justify-content:center;align-items:center;gap:var(--space-lg);margin:var(--space-lg) 0}.time-field-group{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs)}.time-field{display:flex;align-items:center;gap:10px}.adjust-btn{width:36px;height:36px;border-radius:50%;background:#ffffff1a;color:var(--text-primary);display:flex;justify-content:center;align-items:center;font-size:1.2rem;font-weight:700;border:1px solid var(--glass-border);transition:all .2s ease;-webkit-user-select:none;user-select:none}.adjust-btn:hover{background:var(--accent-primary);border-color:var(--accent-primary);box-shadow:0 0 10px var(--accent-glow)}.adjust-btn:active{transform:scale(.9)}.glass-input{width:70px;background:#0003;border:2px solid var(--glass-border);border-radius:var(--radius-md);color:var(--text-primary);font-size:1.8rem;padding:.4rem;text-align:center;outline:none;transition:border-color .2s}.glass-input:focus{border-color:var(--accent-primary);box-shadow:0 0 10px var(--accent-glow)}.unit{font-size:.9rem;color:var(--text-secondary);font-weight:700}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}@media(max-width:480px){.time-input-container{gap:var(--space-sm);margin:var(--space-md) 0}.glass-input{width:50px;font-size:1.4rem;padding:.3rem}.adjust-btn{width:32px;height:32px;font-size:1rem}.unit{font-size:.8rem}}.quick-time-container{display:flex;justify-content:center;gap:var(--space-xs);margin-bottom:var(--space-md);flex-wrap:wrap}.quick-time-btn{padding:.5rem 1rem;border-radius:var(--radius-md);background:#ffffff0d;color:var(--text-secondary);border:1px solid var(--glass-border);transition:all .2s ease;font-size:.85rem;font-weight:500}.quick-time-btn:hover{background:#ffffff1a;color:var(--text-primary);border-color:var(--accent-primary)}.quick-time-btn:active{transform:scale(.95)}.result-container{margin-top:var(--space-md);padding:var(--space-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .2s ease,box-shadow .2s ease}.result-container.pulse{transform:scale(1.02);box-shadow:0 0 20px var(--accent-glow)}.result-header{font-size:1rem;color:var(--text-secondary);margin-bottom:var(--space-sm);text-transform:uppercase;letter-spacing:.05em}.result-time{display:flex;align-items:baseline;gap:var(--space-sm)}.result-value{font-size:4rem;font-weight:700;color:var(--text-primary);line-height:1;text-shadow:0 2px 10px rgba(0,0,0,.3)}.result-unit{font-size:1.5rem;font-weight:400;color:var(--text-secondary);margin-left:.25rem}.app-container{width:100%;max-width:1000px;margin:0 auto;padding:var(--space-md)}.app-header{margin-bottom:var(--space-lg)}.app-header h1{font-size:2.5rem;font-weight:800;background:linear-gradient(to right,#fff,#94a3b8);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:var(--space-xs)}.app-header p{color:var(--text-secondary)}.converter-panel{padding:var(--space-lg)}.converter-layout{display:flex;align-items:stretch;gap:var(--space-lg);margin-bottom:var(--space-lg)}.input-section{flex:0 0 auto}.target-section{flex:1;min-width:400px}.divider{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);color:var(--text-secondary);opacity:.5;min-width:40px}.divider-line{flex:1;width:1px;background-color:var(--glass-border)}.divider-icon{font-size:1.5rem;line-height:1}.app-footer{margin-top:var(--space-xl);color:var(--text-secondary);font-size:.8rem;opacity:.6}@media(max-width:1050px){.app-header h1{font-size:2rem}.converter-panel{padding:var(--space-md)}.converter-layout{flex-direction:column;gap:var(--space-md)}.divider{flex-direction:row;width:100%;height:auto;margin:var(--space-xs) 0}.divider-line{width:100%;height:1px}.divider-icon{transform:rotate(90deg)}.target-section{min-width:0}.result-value{font-size:2.5rem}}@media(max-width:480px){.app-container{padding:var(--space-xs)}.converter-panel{padding:var(--space-sm)}.converter-layout{gap:var(--space-md);margin-bottom:var(--space-sm)}.app-header h1{font-size:1.5rem;margin-bottom:0}.app-header{margin-bottom:var(--space-sm)}.divider{margin:0}.result-container{padding:var(--space-md)}}
