@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;900&display=swap";:root{--bg-primary:#0a0a0f;--bg-card:#ffffff08;--bg-card-hover:#ffffff0d;--border-subtle:#ffffff0f;--border-glow:#6366f166;--text-primary:#f0f0f5;--text-secondary:#8b8b9e;--accent:#818cf8;--accent-hover:#a5b4fc;--accent-glow:#818cf840;--danger:#f87171;--danger-hover:#fca5a5;--danger-glow:#f8717133;--neutral:#64748b;--neutral-hover:#94a3b8;--neutral-glow:#64748b33;--radius-lg:20px;--radius-md:14px;--radius-sm:10px;--transition-fast:.2s cubic-bezier(.4, 0, .2, 1);--transition-smooth:.4s cubic-bezier(.4, 0, .2, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:flex;overflow:hidden}body:before{content:"";z-index:-1;background:radial-gradient(600px 400px at 30% 20%,#6366f114,#0000),radial-gradient(500px 350px at 70% 80%,#a855f70f,#0000),radial-gradient(400px 300px,#3b82f60a,#0000);animation:12s ease-in-out infinite alternate bgShift;position:fixed;inset:0}@keyframes bgShift{0%{opacity:.7;transform:scale(1)}to{opacity:1;transform:scale(1.05)}}body:after{content:"";z-index:-1;background-image:linear-gradient(#ffffff04 1px,#0000 1px),linear-gradient(90deg,#ffffff04 1px,#0000 1px);background-size:60px 60px;position:fixed;inset:0}#app{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(20px);transition:var(--transition-smooth);justify-content:center;align-items:center;margin-bottom:32px;padding:40px 80px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 0 1px #ffffff08,0 20px 60px -15px #00000080,inset 0 1px #ffffff0d}#app:before{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,#818cf80f 0%,#0000 50%,#a855f70a 100%);position:absolute;inset:0}#app:hover{border-color:var(--border-glow);box-shadow:0 0 0 1px #818cf81a, 0 20px 60px -15px #00000080, 0 0 40px -10px var(--accent-glow), inset 0 1px 0 #ffffff14;transform:translateY(-2px)}#countdown{letter-spacing:-4px;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 30px #818cf826);-webkit-user-select:none;user-select:none;transition:var(--transition-fast);font-variant-numeric:tabular-nums;background:linear-gradient(#fff 0%,#c7c7d4 40%,#818cf8 100%);-webkit-background-clip:text;background-clip:text;font-size:clamp(100px,20vw,180px);font-weight:900;line-height:1}#controls{border:none;justify-content:center;align-items:center;gap:14px;margin:0;padding:0;display:flex}#controls button{letter-spacing:.02em;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-fast);-webkit-tap-highlight-color:transparent;border:1px solid;outline:none;font-family:Inter,sans-serif;font-size:16px;font-weight:600;position:relative;overflow:hidden}#controls button:before{content:"";border-radius:inherit;opacity:0;transition:opacity var(--transition-fast);position:absolute;inset:0}#controls button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}#controls button:active{transform:scale(.96)}#increase{color:var(--accent-hover);box-shadow:0 4px 15px -3px var(--accent-glow), inset 0 1px 0 #ffffff0f;background:linear-gradient(135deg,#6366f126,#818cf814);padding:16px 40px;font-size:22px;border-color:#818cf840!important}#increase:before{background:linear-gradient(135deg,#6366f133,#818cf81f)}#increase:hover{color:#fff;box-shadow:0 8px 25px -5px var(--accent-glow), 0 0 20px -5px #818cf84d, inset 0 1px 0 #ffffff1a;background:linear-gradient(135deg,#6366f140,#818cf826);transform:translateY(-2px);border-color:#818cf880!important}#increase:hover:before{opacity:1}#decrease{color:var(--danger);box-shadow:0 4px 15px -3px var(--danger-glow), inset 0 1px 0 #ffffff0a;background:linear-gradient(135deg,#f871711a,#ef44440d);padding:16px 40px;font-size:22px;border-color:#f8717133!important}#decrease:before{background:linear-gradient(135deg,#f8717126,#ef444414)}#decrease:hover{color:var(--danger-hover);box-shadow:0 8px 25px -5px var(--danger-glow), 0 0 20px -5px #f8717140, inset 0 1px 0 #ffffff14;background:linear-gradient(135deg,#f8717133,#ef44441a);transform:translateY(-2px);border-color:#f8717166!important}#decrease:hover:before{opacity:1}#reset{text-transform:uppercase;letter-spacing:.08em;color:var(--neutral);box-shadow:0 4px 15px -3px var(--neutral-glow), inset 0 1px 0 #ffffff08;background:linear-gradient(135deg,#64748b1a,#4755690d);padding:16px 32px;font-size:15px;border-color:#64748b33!important}#reset:before{background:linear-gradient(135deg,#64748b26,#47556914)}#reset:hover{color:var(--neutral-hover);box-shadow:0 8px 25px -5px var(--neutral-glow), 0 0 20px -5px #64748b33, inset 0 1px 0 #ffffff0f;background:linear-gradient(135deg,#64748b2e,#4755691a);transform:translateY(-2px);border-color:#64748b66!important}#reset:hover:before{opacity:1}@media (width<=600px){#app{border-radius:var(--radius-md);margin-bottom:24px;padding:30px 50px}#countdown{letter-spacing:-2px;font-size:100px}#controls{flex-wrap:wrap;gap:10px}#controls button{font-size:14px}#increase,#decrease{padding:14px 32px;font-size:20px}#reset{padding:14px 28px;font-size:13px}}@media (width<=380px){#app{padding:24px 32px}#countdown{font-size:72px}#increase,#decrease{padding:12px 24px;font-size:18px}#reset{padding:12px 20px}}