:root{--bg: #08080e;--bg-card: #10101a;--border: #1a1a2a;--border-light: #28283a;--text: #c8c8d0;--text-dim: #6a6a7a;--text-muted: #3a3a4a;--glow-1: rgba(255, 215, 0, .12);--glow-2: rgba(255, 165, 0, .2);--glow-3: rgba(255, 20, 147, .3)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;display:flex;align-items:center;justify-content:center;overflow:hidden;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 20% 50%,rgba(30,30,50,.25) 0%,transparent 50%),radial-gradient(ellipse at 80% 50%,rgba(20,20,40,.2) 0%,transparent 50%);pointer-events:none;z-index:0}.config{position:relative;z-index:1;background:var(--bg-card);padding:3rem;border-radius:1.5rem;border:1px solid var(--border);width:420px;max-width:90vw;box-shadow:0 25px 80px #0009}.config h1{text-align:center;margin-bottom:2.5rem;color:var(--text-dim);font-weight:200;font-size:1.2rem;letter-spacing:5px;text-transform:uppercase}.config-group{margin-bottom:1.5rem}.config-group label{display:block;margin-bottom:.5rem;color:var(--text-muted);font-size:.7rem;text-transform:uppercase;letter-spacing:3px;font-weight:600}.config-group input{width:100%;padding:.85rem 1.2rem;background:#0c0c14;border:1px solid var(--border);border-radius:.75rem;color:var(--text);font-size:1rem;font-family:inherit;outline:none;transition:border-color .3s}.config-group input:focus{border-color:#444460}.config-group input::placeholder{color:var(--text-muted)}.config-group input[type=date]::-webkit-calendar-picker-indicator,.config-group input[type=time]::-webkit-calendar-picker-indicator{filter:invert(.45);cursor:pointer}.start-btn{width:100%;padding:.85rem;margin-top:.5rem;background:#181824;border:1px solid var(--border-light);border-radius:.75rem;color:var(--text-dim);font-size:.85rem;font-family:inherit;cursor:pointer;transition:all .3s;letter-spacing:3px;text-transform:uppercase;font-weight:300}.start-btn:hover:not(:disabled){background:#202034;border-color:#444460;color:var(--text)}.start-btn:disabled{opacity:.25;cursor:not-allowed}.app{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem}.countdown{display:flex;align-items:center;gap:.8rem;margin-bottom:3rem}.time-unit{display:flex;flex-direction:column;align-items:center;background:#0e0e16d9;padding:1.5rem 2rem;border-radius:1.25rem;border:1px solid var(--border);min-width:130px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:all .6s ease}.number{font-size:4.5rem;font-weight:200;color:var(--text);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:4px;transition:all .6s ease}.label{font-size:.65rem;color:var(--text-muted);letter-spacing:4px;margin-top:.6rem;font-weight:600}.separator{font-size:3.5rem;font-weight:200;color:#2a2a3a;animation:blink 1s step-end infinite;margin-bottom:2rem;align-self:center;-webkit-user-select:none;user-select:none}@keyframes blink{0%,to{opacity:1}50%{opacity:.15}}.reason{font-size:1rem;color:var(--text-dim);font-weight:300;letter-spacing:2px;text-align:center;max-width:500px;line-height:1.6;transition:all .6s ease}.celebration-1 .time-unit{border-color:#ffd70026;box-shadow:0 0 25px #ffd7000a}.celebration-1 .number{color:#e6cc66}.celebration-1 .reason{color:#b0b0b8}.celebration-2 .time-unit{border-color:#ffa50040;box-shadow:0 0 35px #ffa50014}.celebration-2 .number{color:#f0a840}.celebration-2 .reason{color:#c8c8d0}.celebration-2 .countdown{animation:pulse-gentle 3s ease-in-out infinite}@keyframes pulse-gentle{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.celebration-3 .time-unit{border-color:#ff149359;box-shadow:0 0 40px #ff14931f,0 0 80px #ff14930a;background:#120e1ad9}.celebration-3 .number{color:#ff6eb4;text-shadow:0 0 20px rgba(255,20,147,.25)}.celebration-3 .reason{color:#d8d8e0}.celebration-3 .countdown{animation:pulse-strong 1.5s ease-in-out infinite}@keyframes pulse-strong{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}.celebration-4 .time-unit{border-color:#00bfff80;box-shadow:0 0 50px #00bfff33,0 0 100px #00bfff14,0 0 150px #00bfff0a;background:#0a121ed9}.celebration-4 .number{color:#87ceeb;text-shadow:0 0 30px rgba(0,191,255,.4);animation:glow-pulse-blue 1.2s ease-in-out infinite alternate}.celebration-4 .reason{color:#b0e0e6}.celebration-4 .countdown{animation:pulse-intense 1s ease-in-out infinite}@keyframes pulse-intense{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}@keyframes glow-pulse-blue{0%{text-shadow:0 0 15px rgba(0,191,255,.2)}to{text-shadow:0 0 35px rgba(0,191,255,.5),0 0 80px rgba(0,191,255,.2)}}.expired:not(.celebration-4) .number{animation:glow-pulse 1s ease-in-out infinite alternate}.expired:not(.celebration-4) .reason{color:#ff6eb4}.expired .reason{font-weight:400;font-size:1.2rem}.celebration-4.expired .time-unit{border-color:#00bfffb3;box-shadow:0 0 60px #00bfff4d,0 0 120px #00bfff1f,0 0 200px #00bfff0f}.celebration-4.expired .number{animation:glow-pulse-blue .8s ease-in-out infinite alternate}.celebration-4.expired .reason{color:#e0f7fa}@keyframes glow-pulse{0%{text-shadow:0 0 10px rgba(255,20,147,.2)}to{text-shadow:0 0 25px rgba(255,20,147,.5),0 0 60px rgba(255,20,147,.2)}}.happiness-animation{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:100}.audio-prompt{position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;background:#08080ed9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;cursor:pointer;animation:prompt-fade-in .5s ease}.audio-prompt p{font-size:1.3rem;color:#ff6eb4;letter-spacing:3px;font-weight:300;text-shadow:0 0 30px rgba(255,20,147,.3);animation:prompt-pulse 2s ease-in-out infinite;-webkit-user-select:none;user-select:none}@keyframes prompt-fade-in{0%{opacity:0}to{opacity:1}}@keyframes prompt-pulse{0%,to{transform:scale(1);opacity:.8}50%{transform:scale(1.05);opacity:1}}@media(max-width:540px){.audio-prompt p{font-size:1rem;padding:0 1.5rem;text-align:center}}.reset-btn{position:fixed;top:1.5rem;right:1.5rem;z-index:200;background:#0e0e1699;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--border);color:var(--text-muted);width:2.5rem;height:2.5rem;border-radius:50%;cursor:pointer;font-size:1.3rem;transition:all .3s;display:flex;align-items:center;justify-content:center;line-height:1}.reset-btn:hover{border-color:var(--text-dim);color:var(--text);background:#1c1c28cc}@media(max-width:820px){.countdown{gap:.5rem}.time-unit{padding:1rem 1.2rem;min-width:85px;border-radius:1rem}.number{font-size:3rem;letter-spacing:2px}.separator{font-size:2.5rem;margin-bottom:1.5rem}.reason{font-size:.9rem;padding:0 1.5rem}.config{padding:2.5rem 2rem}}@media(max-width:540px){.countdown{gap:.3rem}.time-unit{padding:.7rem .6rem;min-width:65px}.number{font-size:2rem;letter-spacing:1px}.label{font-size:.55rem;letter-spacing:2px;margin-top:.4rem}.separator{font-size:1.6rem;margin-bottom:1rem}.reason{font-size:.8rem}.config{padding:2rem 1.5rem;width:95vw}.config h1{font-size:1rem;letter-spacing:3px}}