@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap";:root{--bg-gradient:radial-gradient(circle at top left, #120e26, #090714);--glass-bg:#ffffff0a;--glass-bg-hover:#ffffff14;--glass-border:#ffffff14;--glass-border-focus:#a855f766;--glass-shadow:0 8px 32px 0 #0006;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--accent-purple:#a855f7;--accent-pink:#ec4899;--accent-purple-glow:#a855f780;--accent-pink-glow:#ec489980;--status-unopened:#3b82f6;--status-opened:#10b981;--status-finished:#8b5cf6;--status-discarded:#ef4444;--font-heading:"Outfit", sans-serif;--font-body:"Plus Jakarta Sans", sans-serif;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1);--border-radius-lg:20px;--border-radius-md:12px;--border-radius-sm:8px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-gradient);color:var(--text-primary);font-family:var(--font-body);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.6;overflow-x:hidden}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#0003}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}#root{flex-direction:column;width:100%;min-height:100vh;display:flex}.app-container{width:100%;min-height:100vh;display:flex}.sidebar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-right:1px solid var(--glass-border);z-index:100;width:280px;height:100vh;transition:var(--transition-smooth);background:#0a0814d9;flex-direction:column;justify-content:space-between;padding:30px 20px;display:flex;position:fixed}.logo-section{border-bottom:1px solid var(--glass-border);align-items:center;gap:12px;padding-bottom:30px;display:flex}.logo-icon{background:linear-gradient(135deg, var(--accent-purple), var(--accent-pink));width:38px;height:38px;box-shadow:0 0 15px var(--accent-purple-glow);color:#fff;border-radius:10px;justify-content:center;align-items:center;font-size:1.2rem;display:flex}.logo-text{font-family:var(--font-heading);background:linear-gradient(90deg,#fff,#d8b4fe);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.3rem;font-weight:700}.nav-links{flex-direction:column;flex-grow:1;gap:8px;margin-top:30px;list-style:none;display:flex}.nav-item{color:var(--text-secondary);border-radius:var(--border-radius-md);cursor:pointer;transition:var(--transition-smooth);align-items:center;gap:15px;padding:12px 16px;font-size:.95rem;font-weight:500;text-decoration:none;display:flex}.nav-item:hover,.nav-item.active{background:var(--glass-bg-hover);color:var(--text-primary);border:1px solid #ffffff0d}.nav-item.active{border:1px solid var(--accent-purple);background:#a855f71f;box-shadow:inset 0 0 8px #a855f733}.user-profile-summary{border-top:1px solid var(--glass-border);align-items:center;gap:12px;padding-top:20px;display:flex}.user-avatar{background:linear-gradient(135deg,#ec4899,#f43f5e);border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.1rem;font-weight:700;display:flex}.user-info{flex-direction:column;display:flex}.user-name{color:var(--text-primary);font-size:.95rem;font-weight:600}.user-skin-type{color:var(--accent-pink);background:#ec48991a;border-radius:4px;width:fit-content;margin-top:2px;padding:2px 6px;font-size:.75rem}.main-content{flex-direction:column;flex-grow:1;min-height:100vh;margin-left:280px;padding:40px;display:flex}.page-header{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.page-title{font-family:var(--font-heading);background:linear-gradient(90deg,#fff,#a855f7);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:2.2rem;font-weight:700}.page-subtitle{color:var(--text-secondary);margin-top:4px;font-size:1rem}.glass-card{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:var(--border-radius-lg);box-shadow:var(--glass-shadow);transition:var(--transition-smooth);padding:25px}.glass-card:hover{background:var(--glass-bg-hover);border-color:#ffffff1f;transform:translateY(-2px)}.grid-cols-3{grid-template-columns:repeat(3,1fr);gap:24px;display:grid}.grid-cols-2{grid-template-columns:repeat(2,1fr);gap:24px;display:grid}.grid-main{grid-template-columns:2fr 1fr;gap:24px;margin-top:24px;display:grid}.btn-primary{background:linear-gradient(135deg, var(--accent-purple), var(--accent-pink));color:#fff;border-radius:var(--border-radius-md);cursor:pointer;transition:var(--transition-smooth);font-weight:600;font-family:var(--font-body);border:none;padding:12px 24px;box-shadow:0 4px 15px #a855f74d}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 20px #ec489980}.btn-secondary{color:var(--text-primary);border:1px solid var(--glass-border);border-radius:var(--border-radius-md);cursor:pointer;transition:var(--transition-smooth);background:#ffffff0d;padding:12px 24px;font-weight:600}.btn-secondary:hover{background:#ffffff1a;border-color:#fff3}.btn-danger{color:#f87171;border-radius:var(--border-radius-md);cursor:pointer;transition:var(--transition-smooth);background:#ef444426;border:1px solid #ef44444d;padding:10px 20px;font-weight:600}.btn-danger:hover{background:#ef44444d}.badge{border-radius:20px;padding:4px 10px;font-size:.75rem;font-weight:600;display:inline-block}.badge-unopened{color:#60a5fa;background:#3b82f626;border:1px solid #3b82f64d}.badge-opened{color:#34d399;background:#10b98126;border:1px solid #10b9814d}.badge-finished{color:#a78bfa;background:#8b5cf626;border:1px solid #8b5cf64d}.badge-discarded{color:#f87171;background:#ef444426;border:1px solid #ef44444d}.form-group{text-align:left;flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.form-label{color:var(--text-secondary);font-size:.9rem;font-weight:500}.form-input,.form-select,.form-textarea{border:1px solid var(--glass-border);color:var(--text-primary);border-radius:var(--border-radius-md);transition:var(--transition-smooth);font-family:var(--font-body);background:#ffffff0d;outline:none;padding:12px 16px;font-size:.95rem}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--accent-purple);background:#ffffff14;box-shadow:0 0 10px #a855f74d}.form-select option{color:var(--text-primary);background:#110f22}.auth-page{background:radial-gradient(circle,#1b163a,#080611);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.auth-card{width:480px;max-width:100%;padding:40px}.auth-header{text-align:center;margin-bottom:30px}.auth-title{font-family:var(--font-heading);margin-top:15px;font-size:2rem;font-weight:700}.auth-switch{text-align:center;color:var(--text-secondary);margin-top:20px;font-size:.9rem}.auth-switch-link{color:var(--accent-pink);cursor:pointer;font-weight:600}.auth-switch-link:hover{text-decoration:underline}.alert-error{color:#f87171;border-radius:var(--border-radius-sm);background:#ef444426;border:1px solid #ef44444d;margin-bottom:20px;padding:12px;font-size:.9rem}.dday-badge{border-radius:6px;padding:4px 8px;font-size:.8rem;font-weight:700}.dday-danger{color:#f87171;background:#ef444433;border:1px solid #ef4444}.dday-warning{color:#fbbf24;background:#f59e0b33;border:1px solid #f59e0b}.dday-safe{color:#34d399;background:#10b98133;border:1px solid #10b981}.report-card{flex-direction:column;gap:15px;display:flex}.rating-stars{color:#fbbf24;gap:4px;display:flex}.star-filled{fill:#fbbf24}@keyframes pulseGlow{0%,to{box-shadow:0 0 15px var(--accent-purple-glow)}50%{box-shadow:0 0 25px var(--accent-purple-glow), 0 0 10px var(--accent-pink-glow)}}.pulse-glow{animation:3s infinite pulseGlow}@media (width<=1024px){.app-container{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--glass-border);width:100%;height:auto;padding:20px;position:relative}.logo-section{border-bottom:none;padding-bottom:0}.nav-links{flex-direction:row;margin-top:15px;padding-bottom:10px;overflow-x:auto}.nav-item{white-space:nowrap;padding:8px 14px}.user-profile-summary{display:none}.main-content{margin-left:0;padding:20px}.grid-cols-3,.grid-cols-2,.grid-main{grid-template-columns:1fr}}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}