: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)}}.expired .number{animation:glow-pulse 1s ease-in-out infinite alternate}.expired .reason{color:#ff6eb4;font-weight:400;font-size:1.2rem}@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;overflow:hidden}.float-emoji{position:absolute;bottom:-60px;animation:float-up linear infinite;opacity:0}@keyframes float-up{0%{transform:translateY(0) rotate(0) scale(.4);opacity:0}8%{opacity:.9}85%{opacity:.9}to{transform:translateY(-110vh) rotate(720deg) scale(1.3);opacity:0}}.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}}