:root{--yellow-50:#fffdf0;--yellow-100:#fff9d6;--yellow-200:#fff3ad;--yellow-300:#ffec85;--yellow-400:#ffe44d;--yellow-500:gold;--yellow-600:#f5c800;--yellow-700:#d4a800;--yellow-800:#a68300;--yellow-900:#6b5500;--streak-active:gold;--streak-active-hover:#ffec85;--streak-inactive:#f0ede4;--streak-inactive-dark:#2a2825;--bg-primary:#fafafa;--bg-card:#fff;--bg-card-shadow:#0000000f;--text-primary:#1a1a1a;--text-secondary:#7a7a7a;--text-muted:#b0b0b0;--gap-xs:3px;--gap-sm:6px;--gap-md:12px;--gap-lg:16px;--gap-xl:24px;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-xl:28px;--font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-slow:.4s cubic-bezier(.4, 0, .2, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}body{font-family:var(--font-family);background:var(--bg-primary);color:var(--text-primary);min-height:100dvh;line-height:1.5;overflow-x:hidden}body.tg-dark{--bg-primary:#1a1a1a;--bg-card:#252525;--bg-card-shadow:#0000004d;--text-primary:#f5f5f5;--text-secondary:#a0a0a0;--text-muted:#666;--streak-inactive:#2a2825}#root{min-height:100dvh}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes fireGlow{0%,to{filter:drop-shadow(0 0 6px #ffd70066)}50%{filter:drop-shadow(0 0 14px #ffd700b3)}}.app{max-width:480px;height:100vh;padding:var(--gap-lg);flex-direction:column;justify-content:center;margin:0 auto;padding-bottom:32px;animation:.5s fadeInUp;display:flex}.header{text-align:center;margin-bottom:var(--gap-xl);animation:.4s fadeInUp}.header-icon{margin-bottom:var(--gap-sm);border-radius:50%;font-size:64px;animation:2s ease-in-out infinite fireGlow;display:inline-block}.streak-count{background:linear-gradient(135deg, var(--yellow-400), var(--yellow-600));-webkit-text-fill-color:transparent;letter-spacing:-2px;-webkit-background-clip:text;background-clip:text;font-size:64px;font-weight:900;line-height:1.1}.header-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:2px;margin-top:2px;font-size:15px;font-weight:600}.header-dates{color:var(--text-muted);margin-top:var(--gap-sm);font-size:13px}.streak-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:var(--gap-lg);box-shadow:0 2px 16px var(--bg-card-shadow);margin-bottom:var(--gap-lg);animation:.5s .1s both fadeInUp}.card-row{justify-content:space-between;align-items:center;display:flex}.card-stat{flex-direction:column;flex:1;align-items:center;display:flex}.stat-value{color:var(--yellow-600);font-size:28px;font-weight:800}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;margin-top:2px;font-size:11px;font-weight:600}.card-divider{background:var(--streak-inactive);width:1px;height:40px}.month-nav{margin-bottom:var(--gap-md);justify-content:space-between;align-items:center;animation:.5s .15s both fadeInUp;display:flex}.nav-title{color:var(--text-primary);text-transform:capitalize;font-size:17px;font-weight:700}.nav-buttons{gap:var(--gap-sm);display:flex}.nav-btn{background:var(--bg-card);width:36px;height:36px;color:var(--text-primary);cursor:pointer;box-shadow:0 1px 4px var(--bg-card-shadow);transition:all var(--transition-fast);border:none;border-radius:50%;justify-content:center;align-items:center;font-size:18px;display:flex}.nav-btn:hover{transform:scale(1.08)}.nav-btn:active{transform:scale(.95)}.nav-btn:disabled{opacity:.3;cursor:not-allowed;transform:none}.calendar{background:var(--bg-card);border-radius:var(--radius-lg);padding:var(--gap-md) var(--gap-md) var(--gap-lg);box-shadow:0 2px 16px var(--bg-card-shadow);animation:.5s .2s both fadeInUp}.weekdays{gap:var(--gap-xs);margin-bottom:var(--gap-sm);grid-template-columns:repeat(7,1fr);display:grid}.weekday{text-align:center;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;padding:4px 0;font-size:11px;font-weight:600}.days-grid{gap:var(--gap-xs);grid-template-columns:repeat(7,1fr);display:grid}.day{aspect-ratio:1;border-radius:var(--radius-sm);transition:all var(--transition-normal);cursor:default;justify-content:center;align-items:center;font-size:13px;font-weight:600;display:flex;position:relative}.day-empty{background:0 0}.day-inactive{background:var(--streak-inactive);color:var(--text-muted)}.day-active{background:var(--yellow-500);color:#1a1a1a;box-shadow:0 2px 8px #ffd7004d}.day-active:hover{background:var(--yellow-400);transform:scale(1.12);box-shadow:0 3px 12px #ffd70080}.day-today{outline:2.5px solid var(--yellow-600);outline-offset:-1px}.day-today.day-active{animation:2s ease-in-out infinite pulse}.day-future{background:var(--streak-inactive);color:var(--text-muted)}.day-active{animation:.3s both scaleIn}.skeleton{background:linear-gradient(90deg, var(--streak-inactive) 25%, var(--yellow-100) 50%, var(--streak-inactive) 75%);border-radius:var(--radius-sm);background-size:200% 100%;animation:1.5s infinite shimmer}