:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}:root{--primary: #ff6b6b;--primary-dark: #e55555;--secondary: #4ecdc4;--accent: #ffd93d;--bg: linear-gradient(180deg, #0f0f1a 0%, #1a1a2e 50%, #16213e 100%);--card-bg: rgba(255, 255, 255, .05);--card-border: rgba(255, 255, 255, .1);--text: #ffffff;--text-muted: #a0a0b0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);background-attachment:fixed;color:var(--text);min-height:100vh;overflow-x:hidden}.app{width:100%;max-width:100%;margin:0;padding:12px 12px 40px;min-height:100vh}.header{text-align:center;padding:16px 0 12px}.header h1{font-size:32px;font-weight:800;background:linear-gradient(135deg,#fff,#ffd93d,#ff6b6b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px}.header p{color:var(--text-muted);font-size:13px;margin-top:2px}.cat-container{position:relative;background:linear-gradient(145deg,#4ecdc41a,#ff6b6b1a);border-radius:24px;margin-bottom:16px;padding:0;border:1px solid var(--card-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;height:320px;overflow:hidden}.cat-container:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 30% 30%,rgba(78,205,196,.15) 0%,transparent 50%),radial-gradient(circle at 70% 70%,rgba(255,107,107,.15) 0%,transparent 50%);animation:rotate-bg 20s linear infinite;pointer-events:none}@keyframes rotate-bg{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.cat-photo-wrapper{position:relative;z-index:1}.cat-photo{width:180px;height:auto;max-height:240px;object-fit:contain;border-radius:20px;box-shadow:0 20px 60px #0006,0 0 40px #4ecdc433;border:2px solid rgba(255,255,255,.15)}.cat-photo-wrapper:before{content:"";position:absolute;inset:-6px;background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#ffd93d,#ff6b6b);background-size:300% 300%;border-radius:24px;z-index:-1;opacity:.6;animation:gradient-glow 4s ease-in-out infinite;filter:blur(8px)}@keyframes gradient-glow{0%,to{background-position:0% 50%;opacity:.4}50%{background-position:100% 50%;opacity:.8}}.cat-eyes{display:none}.mood-bubble{position:absolute;bottom:12px;left:50%;transform:translate(-50%);background:#0009;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:10px 20px;border-radius:30px;font-size:15px;font-weight:600;border:1px solid rgba(255,255,255,.1);white-space:nowrap}.info-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}.info-card{background:var(--card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:14px 10px;border-radius:16px;text-align:center;border:1px solid var(--card-border);transition:transform .3s ease,box-shadow .3s ease}.info-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px #0000004d}.info-card .label{display:block;font-size:11px;color:var(--text-muted);margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.info-card .value{font-size:18px;font-weight:700;background:linear-gradient(135deg,#fff,var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.feed-button{width:100%;padding:18px;border:none;border-radius:20px;font-size:18px;font-weight:700;cursor:pointer;transition:all .3s ease;margin-bottom:16px;position:relative;overflow:hidden}.feed-button.can-feed{background:linear-gradient(135deg,#ff6b6b,#ff8e53,#ffd93d);background-size:200% 200%;color:#fff;box-shadow:0 8px 30px #ff6b6b66;animation:gradient-shift 3s ease infinite}@keyframes gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.feed-button.can-feed:active{transform:scale(.98);box-shadow:0 4px 15px #ff6b6b66}.feed-button.can-feed:after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent 40%,rgba(255,255,255,.3) 50%,transparent 60%);animation:shine 3s infinite}@keyframes shine{0%{transform:translate(-100%) rotate(45deg)}to{transform:translate(100%) rotate(45deg)}}.feed-button.cannot-feed{background:var(--card-bg);color:var(--text-muted);cursor:not-allowed;border:1px solid var(--card-border)}.tabs{display:flex;gap:8px;margin-bottom:16px;background:var(--card-bg);padding:6px;border-radius:16px;border:1px solid var(--card-border)}.tabs button{flex:1;padding:12px 8px;border:none;border-radius:12px;background:transparent;color:var(--text-muted);font-size:12px;font-weight:600;cursor:pointer;transition:all .3s ease}.tabs button.active{background:linear-gradient(135deg,var(--primary),#ff8e53);color:#fff;box-shadow:0 4px 15px #ff6b6b4d}.tab-content{background:var(--card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:20px;min-height:180px;border:1px solid var(--card-border)}.tab-content h3{font-size:18px;margin-bottom:16px;font-weight:700}.tab-content h4{font-size:13px;color:var(--text-muted);margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.today-stats{margin-bottom:20px}.stat-item{display:flex;align-items:center;gap:12px;padding:12px;background:#ffffff08;border-radius:12px}.stat-item span:first-child{flex-shrink:0;font-size:14px}.progress-bar{flex:1;height:10px;background:#ffffff1a;border-radius:10px;overflow:hidden}.progress{height:100%;background:linear-gradient(90deg,var(--secondary),var(--primary));border-radius:10px;transition:width .5s ease;box-shadow:0 0 10px #4ecdc480}.stat-item span:last-child{font-weight:700;color:var(--secondary);font-size:14px}.last-feeding{background:linear-gradient(135deg,#4ecdc41a,#ff6b6b1a);padding:16px;border-radius:16px;border:1px solid var(--card-border)}.last-feeding p{font-size:16px;font-weight:600}.feedings-list{display:flex;flex-direction:column;gap:10px}.feeding-item{display:flex;align-items:center;padding:14px;background:#ffffff08;border-radius:14px;border:1px solid transparent;transition:all .3s ease}.feeding-item:hover{background:#ffffff0f;border-color:var(--card-border)}.feeding-item .time{width:55px;font-weight:700;font-size:14px;color:var(--secondary)}.feeding-item .feeder{flex:1;font-size:15px}.feeding-item .portion{font-size:22px}.chart-container{max-width:220px;margin:0 auto;padding:10px 0}.empty{text-align:center;color:var(--text-muted);padding:40px 20px;font-size:15px}.app:before{content:"";position:fixed;inset:0;background-image:radial-gradient(2px 2px at 20px 30px,rgba(255,255,255,.15),transparent),radial-gradient(2px 2px at 40px 70px,rgba(255,255,255,.1),transparent),radial-gradient(2px 2px at 50px 160px,rgba(255,255,255,.15),transparent),radial-gradient(2px 2px at 90px 40px,rgba(255,255,255,.1),transparent),radial-gradient(2px 2px at 130px 80px,rgba(255,255,255,.15),transparent);background-size:200px 200px;animation:sparkle 4s ease-in-out infinite;pointer-events:none;z-index:-1}@keyframes sparkle{0%,to{opacity:.5}50%{opacity:1}}@supports (padding-bottom: env(safe-area-inset-bottom)){.app{padding-bottom:calc(40px + env(safe-area-inset-bottom))}}.snowflakes{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100;overflow:hidden}.snowflake{position:absolute;top:-20px;color:#fff;animation:fall linear infinite;text-shadow:0 0 5px rgba(255,255,255,.5)}@keyframes fall{0%{transform:translateY(-20px) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(360deg);opacity:.3}}.garland{display:flex;justify-content:space-between;padding:0 5px;margin-bottom:5px}.light{font-size:18px;animation:blink-light 1s ease-in-out infinite alternate;filter:drop-shadow(0 0 5px currentColor)}@keyframes blink-light{0%{opacity:.4;transform:scale(.9)}to{opacity:1;transform:scale(1.1)}}.light:nth-child(odd){color:#ff6b6b}.light:nth-child(2n){color:#4ecdc4}.light:nth-child(3n){color:#ffd93d}.light:nth-child(4n){color:#ff8e53}.new-year-theme{--primary: #c41e3a;--secondary: #228b22}.new-year-theme .header h1{background:linear-gradient(135deg,#fff,gold 30%,#c41e3a 70%,#228b22);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:none}.new-year-theme .cat-container{background:linear-gradient(145deg,#228b2226,#c41e3a26);border-color:#ffd7004d}.new-year-theme .cat-photo-wrapper:before{background:linear-gradient(45deg,#c41e3a,#228b22,gold,#c41e3a)}.new-year-theme .feed-button.can-feed{background:linear-gradient(135deg,#c41e3a,#228b22,gold);box-shadow:0 8px 30px #c41e3a66}.new-year-theme .tabs button.active{background:linear-gradient(135deg,#c41e3a,#228b22)}.new-year-theme .progress{background:linear-gradient(90deg,#228b22,#c41e3a)}.santa-hat{position:absolute;top:5px;right:20%;font-size:40px;z-index:10;animation:wobble 2s ease-in-out infinite;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}@keyframes wobble{0%,to{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}.reminder{position:fixed;top:10px;left:10px;right:10px;background:linear-gradient(135deg,#c41e3a,#ff6b6b);padding:16px;border-radius:16px;display:flex;align-items:center;gap:12px;z-index:1000;box-shadow:0 10px 40px #c41e3a80;border:1px solid rgba(255,255,255,.2)}.reminder span:first-child{font-size:28px;animation:ring .5s ease-in-out infinite}@keyframes ring{0%,to{transform:rotate(-15deg)}50%{transform:rotate(15deg)}}.reminder div{flex:1}.reminder strong{display:block;font-size:15px;margin-bottom:2px}.reminder p{font-size:13px;opacity:.9;margin:0}.reminder button{background:#fff3;border:none;width:30px;height:30px;border-radius:50%;color:#fff;font-size:16px;cursor:pointer}.rating-list{display:flex;flex-direction:column;gap:10px}.rating-item{display:flex;align-items:center;padding:14px 16px;background:#ffffff08;border-radius:14px;border:1px solid transparent;transition:all .3s ease}.rating-item.top-three{background:linear-gradient(135deg,#ffd7001a,#ffffff0d);border-color:#ffd7004d}.rating-item .medal{font-size:24px;width:40px;text-align:center}.rating-item .name{flex:1;font-size:16px;font-weight:600}.rating-item .count{font-size:14px;color:var(--secondary);font-weight:700;background:#ffffff1a;padding:4px 12px;border-radius:20px}.new-year-countdown{margin-top:16px;background:linear-gradient(135deg,#c41e3a33,#228b2233);padding:16px;border-radius:16px;text-align:center;border:1px solid rgba(255,215,0,.3)}.new-year-countdown h4{margin-bottom:12px;font-size:14px}.countdown-timer{display:flex;justify-content:center;gap:8px}.countdown-item{background:#0000004d;padding:10px 12px;border-radius:12px;min-width:55px;border:1px solid rgba(255,215,0,.2)}.countdown-value{display:block;font-size:24px;font-weight:800;background:linear-gradient(135deg,gold,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}.countdown-label{display:block;font-size:10px;color:var(--text-muted);text-transform:uppercase;margin-top:4px}.tabs button{font-size:20px;padding:14px 8px}.pill-tab{text-align:center}.pill-status{display:flex;align-items:center;justify-content:center;gap:16px;padding:20px;border-radius:16px;margin-bottom:16px;transition:all .3s ease}.pill-status.given{background:linear-gradient(135deg,#228b2233,#4ecdc433);border:1px solid rgba(34,139,34,.4)}.pill-status.not-given{background:linear-gradient(135deg,#c41e3a33,#ff6b6b33);border:1px solid rgba(196,30,58,.4)}.pill-icon{font-size:48px;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.pill-info{text-align:left}.pill-label{display:block;font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.pill-value{font-size:22px;font-weight:700}.pill-status.given .pill-value{color:#4ecdc4}.pill-status.not-given .pill-value{color:#ff6b6b}.pill-details{background:#ffffff0d;padding:14px;border-radius:12px;margin-bottom:16px}.pill-details p{margin:6px 0;font-size:14px}.pill-button{width:100%;padding:18px;border:none;border-radius:20px;font-size:18px;font-weight:700;cursor:pointer;transition:all .3s ease;margin-bottom:16px;background:linear-gradient(135deg,#9b59b6,#8e44ad,#6c3483);color:#fff;box-shadow:0 8px 30px #9b59b666}.pill-button:active:not(.disabled){transform:scale(.98)}.pill-button.disabled{background:var(--card-bg);color:var(--text-muted);cursor:not-allowed;box-shadow:none;border:1px solid var(--card-border)}.pill-week-stats{background:#ffffff0d;padding:16px;border-radius:12px}.pill-week-stats span{display:block;font-size:14px;margin-bottom:10px;color:var(--text-muted)}.pill-progress{background:linear-gradient(90deg,#9b59b6,#8e44ad)!important;box-shadow:0 0 10px #9b59b680!important}
