:root{--bg-primary:#0c0c0c;--bg-secondary:#141414;--bg-tertiary:#1a1a1a;--bg-card:#111;--text-primary:#fafafa;--text-secondary:#888;--text-muted:#555;--accent-warm:#ff6b35;--accent-gold:#fbbf24;--accent-success:#34d399;--accent-blue:#60a5fa;--border-subtle:rgba(255,255,255,.06);--font-display:"Lora",Georgia,serif;--font-body:"DM Sans",-apple-system,sans-serif;--text-6xl: 6rem;--text-2xl: 2rem;--text-xl: 1.5rem;--text-lg: 1.125rem;--text-base: 1rem;--text-sm: .875rem;--text-xs: .75rem;--text-2xs: .6875rem;--leading-tight: 1.1;--leading-snug: 1.25;--leading-normal: 1.5;--leading-relaxed: 1.625;--font-light: 300;--font-normal: 400;--font-medium: 500;--font-semibold: 600}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{background:var(--bg-primary)}body{font-family:var(--font-body);background:var(--bg-primary);min-height:100vh;min-height:100dvh;color:var(--text-primary);overflow-x:hidden;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);line-height:var(--leading-normal)}.bg-gradient{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(255,107,53,.08) 0%,transparent 50%),radial-gradient(ellipse 60% 40% at 100% 100%,rgba(251,191,36,.05) 0%,transparent 50%);pointer-events:none;z-index:0;transition:background .5s}.bg-gradient.january{background:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(96,165,250,.1) 0%,transparent 50%),radial-gradient(ellipse 60% 40% at 100% 100%,rgba(147,51,234,.05) 0%,transparent 50%)}.container{position:relative;z-index:1;max-width:420px;margin:0 auto;padding:24px 20px 40px}header{text-align:center;margin-bottom:24px;animation:fadeDown .8s ease-out}@keyframes fadeDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.logo{display:inline-flex;align-items:center;gap:10px;margin-bottom:8px}.logo-icon{font-size:1.8rem;filter:drop-shadow(0 0 20px rgba(255,107,53,.5));transition:filter .3s}.logo-icon.january{filter:drop-shadow(0 0 20px rgba(96,165,250,.5))}.logo-text{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:400;letter-spacing:.01em;color:var(--text-primary)}.tagline{font-size:var(--text-sm);color:var(--text-secondary);font-weight:400;letter-spacing:.02em}.mode-toggle{display:flex;background:var(--bg-secondary);border:1px solid var(--border-subtle);border-radius:12px;padding:4px;margin-top:16px}.mode-btn{flex:1;padding:10px 12px;font-family:var(--font-body);font-size:var(--text-sm);font-weight:500;color:var(--text-muted);background:transparent;border:none;border-radius:8px;cursor:pointer;transition:all .2s}.mode-btn:focus{outline:2px solid var(--accent-warm);outline-offset:2px}.mode-btn.active{background:var(--bg-tertiary);color:var(--text-primary)}.mode-content{display:none}.mode-content.active{display:block;animation:fadeUp .4s ease-out}.timer-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:28px;padding:40px 24px;margin-bottom:20px;position:relative;overflow:hidden}.timer-card:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:200px;height:1px;background:linear-gradient(90deg,transparent,var(--accent-warm),transparent);opacity:.5}.streak-label{text-align:center;font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.15em;color:var(--text-muted);margin-bottom:16px}.timer-display{text-align:center}.days-count{font-family:var(--font-display);font-size:var(--text-6xl);font-weight:400;line-height:var(--leading-tight);letter-spacing:-.03em;color:var(--text-primary);margin-bottom:4px}.days-label{font-family:var(--font-display);font-size:var(--text-xl);font-style:italic;color:var(--text-secondary);margin-bottom:24px;line-height:var(--leading-snug)}.time-details{display:flex;justify-content:center;gap:32px;padding-top:24px;border-top:1px solid var(--border-subtle)}.time-unit{text-align:center}.time-value{font-size:var(--text-xl);font-weight:500;color:var(--text-primary);font-variant-numeric:tabular-nums;line-height:var(--leading-tight)}.time-label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-top:4px}.start-date{text-align:center;margin-top:20px;font-size:var(--text-sm);color:var(--text-muted)}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}.stat-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:20px;padding:20px;text-align:center}.stat-icon{font-size:var(--text-xl);margin-bottom:8px}.stat-value{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:400;color:var(--text-primary);line-height:var(--leading-tight)}.stat-label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-top:6px}.next-achievement{background:linear-gradient(135deg,var(--bg-card),rgba(255,107,53,.05));border:1px solid rgba(255,107,53,.2);border-radius:20px;padding:20px;margin-bottom:20px}.next-achievement-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.next-achievement-icon{font-size:2rem}.next-achievement-info{flex:1}.next-achievement-label{font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.1em;color:var(--accent-warm);margin-bottom:2px}.next-achievement-title{font-family:var(--font-display);font-size:var(--text-lg);color:var(--text-primary);line-height:var(--leading-snug)}.next-achievement-time{font-size:var(--text-sm);color:var(--text-secondary)}.progress-track{height:6px;background:var(--bg-tertiary);border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent-warm),var(--accent-gold));border-radius:3px;transition:width .5s}.reset-btn{width:100%;padding:18px;font-family:var(--font-body);font-size:var(--text-base);font-weight:var(--font-medium);border:1px solid rgba(255,255,255,.1);border-radius:14px;background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer}.reset-btn:active{transform:scale(.98);background:var(--bg-tertiary)}.reset-btn:focus{outline:2px solid var(--accent-warm);outline-offset:2px}.start-icon{font-size:4rem;margin-bottom:16px;filter:drop-shadow(0 0 30px rgba(255,107,53,.4))}.start-message{font-family:var(--font-display);font-size:var(--text-lg);color:var(--text-secondary);margin-bottom:24px;line-height:var(--leading-snug)}.start-btn{padding:18px 48px;font-family:var(--font-body);font-size:var(--text-base);font-weight:var(--font-semibold);border:none;border-radius:14px;background:linear-gradient(135deg,var(--accent-warm),#ff8c5a);color:#fff;cursor:pointer;transition:all .2s;box-shadow:0 4px 20px #ff6b354d}.start-btn:active{transform:scale(.98)}.start-btn:focus{outline:2px solid var(--accent-gold);outline-offset:2px}.streak-inactive .stats-grid,.streak-inactive .next-achievement,.streak-inactive .reset-btn,.streak-inactive #achievementsSection,.streak-inactive #historySection{display:none}.january-header{background:linear-gradient(135deg,#60a5fa1a,#9333ea1a);border:1px solid rgba(96,165,250,.2);border-radius:20px;padding:20px;text-align:center;margin-bottom:20px}.january-header-title{font-family:var(--font-display);font-size:var(--text-xl);margin-bottom:4px;line-height:var(--leading-snug)}.january-header-subtitle{font-size:var(--text-sm);color:var(--text-secondary)}.year-progress-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:24px;padding:24px;margin-bottom:20px}.year-selector{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:20px}.year-nav{width:36px;height:36px;border-radius:50%;border:1px solid var(--border-subtle);background:var(--bg-tertiary);color:var(--text-secondary);font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center}.year-nav:focus{outline:2px solid var(--accent-blue);outline-offset:2px}.year-nav:disabled{opacity:.3;cursor:not-allowed}.year-display{font-family:var(--font-display);font-size:var(--text-xl);min-width:80px;text-align:center;line-height:var(--leading-tight)}.january-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:20px}.day-header{font-size:var(--text-2xs);color:var(--text-muted);text-align:center;padding-bottom:6px}.january-day{aspect-ratio:1;border-radius:8px;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);color:var(--text-muted);cursor:pointer;transition:all .15s;-moz-appearance:none;appearance:none;-webkit-appearance:none;border:none;font-family:inherit;padding:0;margin:0;position:relative;overflow:visible}.january-day:focus{outline:2px solid var(--accent-blue);outline-offset:1px}.january-day:active{transform:scale(.9)}.january-day.empty{background:transparent;cursor:default}.january-day.completed{background:linear-gradient(135deg,#34d399,#10b981);color:#fff;font-weight:600}.january-day.today{border:2px solid var(--accent-blue);background:#60a5fa26;color:var(--text-primary)}.january-day.future{opacity:.3;cursor:not-allowed}.january-day.missed{background:#ef444433;color:#f87171}.year-summary{display:flex;justify-content:space-around;padding-top:20px;border-top:1px solid var(--border-subtle)}.year-summary-stat{text-align:center}.year-summary-value{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--text-primary);line-height:var(--leading-tight)}.year-summary-value.success{color:var(--accent-success)}.year-summary-label{font-size:var(--text-2xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:4px}.january-easter-egg{display:none;align-items:center;justify-content:center;gap:10px;margin-top:16px;padding:12px 16px;border-radius:16px;background:#60a5fa1f;border:1px dashed rgba(96,165,250,.5);font-size:var(--text-sm);color:var(--text-secondary);text-align:center}.january-easter-egg.show{display:flex}.january-easter-egg.pulse{animation:egg-pop .9s ease-out}.january-easter-egg .egg-icon{font-size:1.2rem}@keyframes egg-pop{0%{transform:scale(.96);opacity:0}40%{transform:scale(1.02);opacity:1}to{transform:scale(1)}}.past-years-list{display:flex;flex-direction:column;gap:10px}.past-year-item{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:16px;padding:16px;display:flex;align-items:center;gap:14px}.past-year-badge{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0}.past-year-badge.gold{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.past-year-badge.silver{background:linear-gradient(135deg,#94a3b8,#64748b)}.past-year-badge.bronze{background:linear-gradient(135deg,#f59e0b,#d97706)}.past-year-badge.incomplete{background:var(--bg-tertiary)}.past-year-info{flex:1}.past-year-name{font-family:var(--font-display);font-size:var(--text-lg);line-height:var(--leading-snug)}.past-year-detail{font-size:var(--text-xs);color:var(--text-muted);margin-top:2px}.past-year-result{text-align:right}.past-year-days{font-family:var(--font-display);font-size:var(--text-lg);line-height:var(--leading-tight)}.past-year-days.complete{color:var(--accent-success)}.past-year-label{font-size:var(--text-2xs);color:var(--text-muted)}.section{margin-top:32px}.section-header{display:flex;justify-content:space-between;align-items:center;padding:16px 0;cursor:pointer;border-bottom:1px solid var(--border-subtle)}.section-title{font-family:var(--font-display);font-size:var(--text-lg);font-weight:400;line-height:var(--leading-snug)}.section-badge{font-size:var(--text-xs);color:var(--text-muted);background:var(--bg-tertiary);padding:4px 10px;border-radius:20px;font-weight:var(--font-medium)}.section-toggle{font-size:1.2rem;color:var(--text-muted);transition:transform .3s}.section.collapsed .section-toggle{transform:rotate(-90deg)}.section-content{padding-top:16px;max-height:800px;overflow-y:auto;transition:max-height .4s,opacity .3s,padding .3s}.section.collapsed .section-content{max-height:0;opacity:0;padding-top:0;overflow:hidden}.achievements-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.achievement{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:16px;padding:16px 10px;text-align:center}.achievement.unlocked{border-color:#34d3994d;background:linear-gradient(135deg,var(--bg-card),rgba(52,211,153,.05))}.achievement.next{border-color:#ff6b354d;background:linear-gradient(135deg,var(--bg-card),rgba(255,107,53,.08))}.achievement.locked{opacity:.4}.achievement-icon{font-size:1.8rem;margin-bottom:8px;display:block}.achievement.locked .achievement-icon{filter:grayscale(1)}.achievement-name{font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--text-primary);margin-bottom:4px}.achievement-req{font-size:var(--text-2xs);color:var(--text-muted)}.achievement.unlocked .achievement-req{color:var(--accent-success)}.achievement.next .achievement-req{color:var(--accent-warm)}.history-list{display:flex;flex-direction:column;gap:8px}.history-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:14px}.history-duration{font-family:var(--font-display);font-size:var(--text-lg);line-height:var(--leading-snug)}.history-date{font-size:var(--text-xs);color:var(--text-muted);margin-top:2px}.history-stats{text-align:right}.history-drinks{font-size:var(--text-base);font-weight:var(--font-medium);color:var(--accent-success)}.history-drinks-label{font-size:var(--text-2xs);color:var(--text-muted)}.empty-state{text-align:center;padding:40px 20px;color:var(--text-muted);font-size:var(--text-base)}.settings-grid{display:flex;flex-direction:column;gap:16px}.setting-row{display:flex;justify-content:space-between;align-items:center}.setting-label{font-size:var(--text-base);color:var(--text-secondary)}.setting-input{width:80px;padding:10px 12px;font-family:var(--font-body);font-size:var(--text-base);text-align:center;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-tertiary);color:var(--text-primary);outline:none}.setting-input:focus{border-color:var(--accent-warm)}.support-card{background:linear-gradient(135deg,var(--bg-card),rgba(255,107,53,.08));border:1px solid rgba(255,107,53,.2);border-radius:20px;padding:24px;text-align:center;margin-top:32px}.support-title{font-family:var(--font-display);font-size:var(--text-lg);margin-bottom:8px;line-height:var(--leading-snug)}.support-text{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:20px;line-height:var(--leading-normal)}.kofi-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 28px;background:#ff5e5b;color:#fff;font-family:var(--font-body);font-size:var(--text-base);font-weight:var(--font-semibold);text-decoration:none;border-radius:12px}.kofi-btn:active{transform:scale(.98)}.support-contact{margin-top:16px;padding-top:16px;border-top:1px solid var(--border-subtle)}.contact-link{color:var(--text-secondary);font-size:var(--text-sm);text-decoration:none;transition:color .2s}.contact-link:hover{color:var(--text-primary)}.kofi-btn svg{width:24px;height:24px}.changelog-snippet{margin:0 0 12px;font-size:var(--text-2xs);color:var(--text-muted);display:flex;flex-direction:column;gap:4px}.changelog-link{color:var(--text-secondary);text-decoration:none;opacity:.7;transition:opacity .2s,color .2s}.changelog-link:hover{color:var(--text-primary);opacity:1}.changelog-entry{background:var(--bg-tertiary);border:1px solid var(--border-subtle);border-radius:14px;padding:16px;margin-bottom:16px}.changelog-date{font-size:var(--text-xs);color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}.changelog-title{font-family:var(--font-display);font-size:var(--text-lg);margin-bottom:8px}.changelog-list{margin:0;padding-left:18px;color:var(--text-secondary);font-size:var(--text-sm);line-height:var(--leading-normal)}.install-hint{margin-top:40px;text-align:center;padding:20px;border-top:1px solid var(--border-subtle);font-size:var(--text-sm);color:var(--text-muted);line-height:var(--leading-normal)}.install-hint strong{color:var(--text-secondary)}.modal-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;align-items:center;justify-content:center;padding:24px}.modal-overlay.active{display:flex}.modal{background:var(--bg-secondary);border:1px solid var(--border-subtle);border-radius:24px;padding:32px 24px;max-width:320px;width:100%;text-align:center}.modal-icon{font-size:3rem;margin-bottom:16px}.modal-title{font-family:var(--font-display);font-size:var(--text-xl);margin-bottom:8px;line-height:var(--leading-snug)}.modal-text{font-size:var(--text-base);color:var(--text-secondary);margin-bottom:28px;line-height:var(--leading-normal)}.modal-buttons{display:flex;gap:12px}.modal-buttons-vertical{display:flex;flex-direction:column;gap:10px}.modal-btn{flex:1;padding:14px;font-family:var(--font-body);font-size:var(--text-base);font-weight:var(--font-medium);border:none;border-radius:12px;cursor:pointer}.modal-btn.cancel{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-subtle)}.modal-btn.secondary{background:linear-gradient(135deg,var(--accent-warm),#ff8c5a);color:#fff}.modal-btn.confirm{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.modal-btn:active{transform:scale(.98)}.modal-btn:focus{outline:2px solid var(--accent-warm);outline-offset:2px}.data-buttons{display:flex;gap:12px}.data-btn{flex:1;padding:14px;font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-medium);border:1px solid var(--border-subtle);border-radius:12px;background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}.data-btn:active{transform:scale(.98);background:var(--bg-secondary)}.data-btn:focus{outline:2px solid var(--accent-warm);outline-offset:2px}.qr-container{background:#fff;padding:16px;border-radius:12px;display:inline-block;margin-bottom:20px}.qr-container img,.qr-container canvas{display:block}.qr-hint{font-size:var(--text-xs);color:var(--text-muted);margin-top:8px}.import-input{display:none}.import-error{color:#ef4444;font-size:var(--text-sm);margin-top:12px}.import-success{color:var(--accent-success);font-size:var(--text-sm);margin-top:12px}.sparkle{position:absolute;pointer-events:none;opacity:0;font-size:1.2rem}.sparkle.active{animation:sparkle-pop .6s ease-out forwards}@keyframes sparkle-pop{0%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(0) rotate(0)}50%{opacity:1;transform:translate(var(--sx),var(--sy)) scale(1.2) rotate(180deg)}to{opacity:0;transform:translate(var(--ex),var(--ey)) scale(0) rotate(360deg)}}#achievementModal{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:101;align-items:center;justify-content:center;padding:24px}#achievementModal.active{display:flex;animation:achBgFadeIn .4s ease-out}@keyframes achBgFadeIn{0%{background:#0000;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{background:#000000b3}}.achievement-popup{display:flex;flex-direction:column;align-items:center;gap:8px;padding:30px 40px;background:linear-gradient(145deg,#1e1e1efa,#141414fa);border:1px solid rgba(251,191,36,.3);border-radius:16px;box-shadow:0 0 40px #fbbf2433,0 20px 60px #00000080;position:relative;overflow:hidden;animation:achShineIn .4s ease-out forwards}.achievement-popup:before{content:"";position:absolute;top:-50%;left:-100%;width:60%;height:200%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transform:skew(-20deg);opacity:0;animation:achShineSweep .8s ease-out .3s forwards}@keyframes achShineIn{0%{transform:translateY(30px) scale(.8);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@keyframes achShineSweep{0%{left:-100%;opacity:0}20%{opacity:1}to{left:150%;opacity:0}}#achievementModal.active .achievement-popup{animation:achShineIn .4s ease-out forwards}#achievementModal.active .achievement-popup:before{animation:achShineSweep .8s ease-out .3s forwards}.achievement-label{font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.15em;color:var(--accent-gold)}.achievement-icon{font-size:3rem;line-height:1;margin:8px 0}.achievement-title{font-family:var(--font-display);font-size:var(--text-xl);font-weight:600;color:var(--text-primary)}.achievement-desc{font-size:var(--text-sm);color:var(--text-secondary)}@media(max-width:420px){:root{--text-6xl: 4.5rem;--text-2xl: 1.75rem;--text-xs: .8125rem}}