:root{--brand-primary: #FF6B9D;--brand-secondary: #C77DFF;--brand-tertiary: #FFB5A7;--success: #06D6A0;--success-light: #B8F3E3;--success-dark: #048A67;--warning: #FFD60A;--warning-light: #FFF4CC;--warning-dark: #B39700;--error: #EF476F;--error-light: #FFD4DF;--error-dark: #C7244D;--info: #4ECDC4;--info-light: #C4F1EF;--info-dark: #2A9D96;--gray-50: #FAFAFA;--gray-100: #F5F5F5;--gray-200: #EEEEEE;--gray-300: #E0E0E0;--gray-400: #BDBDBD;--gray-500: #9E9E9E;--gray-600: #757575;--gray-700: #616161;--gray-800: #424242;--gray-900: #212121;--bg-primary: #FFFCF9;--bg-secondary: #FFF5F0;--bg-tertiary: #FFEDE5;--surface: #FFFFFF;--surface-raised: #FEFEFE;--surface-overlay: rgba(255, 255, 255, .9);--period-predicted: #FFD5DC;--period-confirmed: #FFB8C1;--period-active: #FF9AA2;--period-1: #E63946;--period-2: #FF6B9D;--period-3: #FFB3C6;--period-4: #FFE5EC;--period-heavy: var(--period-1);--period-medium: var(--period-2);--period-light: var(--period-3);--ovulation-predicted: #E8D5F2;--fertile-window: #F3E5F9;--fertile-peak: #9D4EDD;--fertile-high: #C77DFF;--fertile-moderate: #E0AAFF;--fertile-low: #F3E5FF;--fertile-peak-legacy: #C9A8D5;--fertile-moderate-legacy: #E8D5F2;--fertile-light: var(--fertile-low);--cramps-severe: #E63946;--cramps-moderate: #FF6B9D;--cramps-mild: #FFB3C6;--cramps-indicator: #FFE4CC;--mood-positive: #06D6A0;--mood-neutral: #FFD60A;--mood-negative: #EF476F;--current-day: #D4E4F7;--accent-primary: #FF6B9D;--accent-secondary: #C77DFF;--accent-tertiary: #4ECDC4;--text-primary: #3D3D3D;--text-secondary: #7A7A7A;--text-tertiary: #B0B0B0;--text-disabled: #D0D0D0;--text-inverse: #FFFFFF;--border-light: #F0F0F0;--border-medium: #E0E0E0;--border-strong: #BDBDBD;--border-accent: rgba(255, 107, 157, .3);--shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .25);--shadow-soft: var(--shadow-sm);--shadow-medium: var(--shadow-md);--shadow-strong: var(--shadow-xl);--shadow-pink-sm: 0 4px 12px rgba(255, 107, 157, .15);--shadow-pink-md: 0 8px 24px rgba(255, 107, 157, .2);--shadow-pink-lg: 0 16px 48px rgba(255, 107, 157, .25);--shadow-purple-sm: 0 4px 12px rgba(199, 125, 255, .15);--shadow-purple-md: 0 8px 24px rgba(199, 125, 255, .2);--shadow-purple-lg: 0 16px 48px rgba(199, 125, 255, .25);--shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, .06);--shadow-inner-lg: inset 0 4px 8px 0 rgba(0, 0, 0, .1);--gradient-sunrise: linear-gradient(135deg, #FF6B9D 0%, #FFD93D 100%);--gradient-lavender: linear-gradient(135deg, #C77DFF 0%, #FF6B9D 100%);--gradient-ocean: linear-gradient(135deg, #4ECDC4 0%, #556FB5 100%);--gradient-peach: linear-gradient(135deg, #FFB5A7 0%, #FFC6FF 100%);--gradient-mint: linear-gradient(135deg, #06D6A0 0%, #4ECDC4 100%);--gradient-sunset: linear-gradient(135deg, #FF6B9D 0%, #C77DFF 50%, #4ECDC4 100%);--gradient-period: linear-gradient(135deg, var(--period-1) 0%, var(--period-2) 100%);--gradient-fertile: linear-gradient(135deg, var(--fertile-peak) 0%, var(--fertile-high) 100%);--glass-light: rgba(255, 255, 255, .7);--glass-medium: rgba(255, 255, 255, .5);--glass-dark: rgba(0, 0, 0, .3);--glass-blur: blur(20px);--glass-blur-sm: blur(10px);--glass-blur-lg: blur(30px);--font-primary: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-secondary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Courier New", monospace;--font-family: var(--font-primary);--text-xs: clamp(.7rem, .5vw + .6rem, .75rem);--text-sm: clamp(.8rem, .6vw + .7rem, .875rem);--text-base: clamp(.9rem, .8vw + .8rem, 1rem);--text-lg: clamp(1rem, 1vw + .85rem, 1.125rem);--text-xl: clamp(1.1rem, 1.2vw + .9rem, 1.25rem);--text-2xl: clamp(1.3rem, 1.5vw + 1rem, 1.5rem);--text-3xl: clamp(1.6rem, 2vw + 1.2rem, 2rem);--text-4xl: clamp(2rem, 3vw + 1.5rem, 2.5rem);--text-5xl: clamp(2.5rem, 4vw + 2rem, 3rem);--weight-light: 300;--weight-normal: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--weight-extrabold: 800;--weight-black: 900;--leading-none: 1;--leading-tight: 1.25;--leading-snug: 1.375;--leading-normal: 1.5;--leading-relaxed: 1.625;--leading-loose: 2;--tracking-tighter: -.05em;--tracking-tight: -.025em;--tracking-normal: 0;--tracking-wide: .025em;--tracking-wider: .05em;--tracking-widest: .1em;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-2xl: 24px;--radius-full: 9999px;--ease-in-expo: cubic-bezier(.95, .05, .795, .035);--ease-out-expo: cubic-bezier(.19, 1, .22, 1);--ease-in-out-expo: cubic-bezier(.87, 0, .13, 1);--ease-bounce: cubic-bezier(.68, -.55, .265, 1.55);--ease-smooth: cubic-bezier(.4, 0, .2, 1);--duration-instant: .1s;--duration-fast: .15s;--duration-normal: .25s;--duration-slow: .35s;--duration-slower: .5s;--duration-slowest: .7s;--transition-fast: var(--duration-fast) var(--ease-smooth);--transition-base: var(--duration-normal) var(--ease-smooth);--transition-slow: var(--duration-slow) var(--ease-smooth);--transition-all: all var(--duration-normal) var(--ease-smooth);--transition-colors: color var(--duration-fast) var(--ease-smooth), background-color var(--duration-fast) var(--ease-smooth), border-color var(--duration-fast) var(--ease-smooth);--transition-transform: transform var(--duration-normal) var(--ease-out-expo);--transition-opacity: opacity var(--duration-fast) var(--ease-smooth);--transition-shadow: box-shadow var(--duration-normal) var(--ease-smooth);--button-radius: var(--radius-lg);--button-padding: var(--spacing-md) var(--spacing-lg);--button-shadow: var(--shadow-sm);--button-shadow-hover: var(--shadow-md);--card-radius: var(--radius-2xl);--card-padding: var(--spacing-lg);--card-shadow: var(--shadow-md);--card-shadow-hover: var(--shadow-xl);--input-radius: var(--radius-md);--input-padding: var(--spacing-md);--input-border: 2px solid var(--border-medium);--input-border-focus: 2px solid var(--accent-primary);--modal-radius: var(--radius-3xl);--modal-shadow: var(--shadow-2xl);--modal-backdrop: rgba(0, 0, 0, .4);--calendar-day-size: 64px;--calendar-day-radius: var(--radius-lg);--calendar-gap: 6px}[data-theme=dark]{--brand-primary: #FF6B9D;--brand-secondary: #C77DFF;--brand-tertiary: #FFB5A7;--success: #06D6A0;--success-light: #1B3D34;--success-dark: #0AFFBB;--warning: #FFD60A;--warning-light: #3D3618;--warning-dark: #FFE566;--error: #EF476F;--error-light: #3D1D26;--error-dark: #FF7A9A;--info: #4ECDC4;--info-light: #1E3D3B;--info-dark: #7EDDD6;--gray-50: #1A1A1A;--gray-100: #212121;--gray-200: #2D2D2D;--gray-300: #3D3D3D;--gray-400: #525252;--gray-500: #6B6B6B;--gray-600: #8A8A8A;--gray-700: #A8A8A8;--gray-800: #C7C7C7;--gray-900: #E8E8E8;--bg-primary: #0D0D0D;--bg-secondary: #1A1A1A;--bg-tertiary: #242424;--surface: #1E1E1E;--surface-raised: #2D2D2D;--surface-overlay: rgba(30, 30, 30, .95);--period-predicted: #6B4F54;--period-confirmed: #8B5F65;--period-active: #9B6B70;--period-1: #8B3A3A;--period-2: #8B5F65;--period-3: #6B4F54;--period-4: #4A3538;--period-heavy: var(--period-1);--period-medium: var(--period-2);--period-light: var(--period-3);--ovulation-predicted: #6B5B7A;--fertile-window: #5A4F66;--fertile-peak: #6B5B7A;--fertile-high: #5A4F66;--fertile-moderate: #4A3F52;--fertile-low: #3A2F42;--fertile-peak-legacy: #6B5B7A;--fertile-moderate-legacy: #4A3F52;--fertile-light: var(--fertile-low);--cramps-severe: #8B3A3A;--cramps-moderate: #8B5F65;--cramps-mild: #6B4F54;--cramps-indicator: #7A6B5A;--mood-positive: #048A67;--mood-neutral: #B39700;--mood-negative: #C7244D;--current-day: #4A5F7A;--accent-primary: #FF6B9D;--accent-secondary: #C77DFF;--accent-tertiary: #4ECDC4;--text-primary: #FFFFFF;--text-secondary: #B3B3B3;--text-tertiary: #666666;--text-disabled: #4D4D4D;--text-inverse: #0D0D0D;--border-light: #2D2D2D;--border-medium: #3D3D3D;--border-strong: #525252;--border-accent: rgba(255, 107, 157, .3);--shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .4), 0 1px 2px -1px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .5), 0 2px 4px -2px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .6), 0 4px 6px -4px rgba(0, 0, 0, .5);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .7), 0 8px 10px -6px rgba(0, 0, 0, .6);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .8);--shadow-soft: var(--shadow-sm);--shadow-medium: var(--shadow-md);--shadow-strong: var(--shadow-xl);--shadow-pink-sm: 0 4px 12px rgba(255, 107, 157, .25);--shadow-pink-md: 0 8px 24px rgba(255, 107, 157, .35);--shadow-pink-lg: 0 16px 48px rgba(255, 107, 157, .4);--shadow-purple-sm: 0 4px 12px rgba(199, 125, 255, .25);--shadow-purple-md: 0 8px 24px rgba(199, 125, 255, .35);--shadow-purple-lg: 0 16px 48px rgba(199, 125, 255, .4);--shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, .3);--shadow-inner-lg: inset 0 4px 8px 0 rgba(0, 0, 0, .4);--gradient-sunrise: linear-gradient(135deg, #FF6B9D 0%, #FFD93D 100%);--gradient-lavender: linear-gradient(135deg, #C77DFF 0%, #FF6B9D 100%);--gradient-ocean: linear-gradient(135deg, #4ECDC4 0%, #556FB5 100%);--gradient-peach: linear-gradient(135deg, #FFB5A7 0%, #FFC6FF 100%);--gradient-mint: linear-gradient(135deg, #06D6A0 0%, #4ECDC4 100%);--gradient-sunset: linear-gradient(135deg, #FF6B9D 0%, #C77DFF 50%, #4ECDC4 100%);--gradient-period: linear-gradient(135deg, var(--period-1) 0%, var(--period-2) 100%);--gradient-fertile: linear-gradient(135deg, var(--fertile-peak) 0%, var(--fertile-high) 100%);--glass-light: rgba(30, 30, 30, .7);--glass-medium: rgba(30, 30, 30, .5);--glass-dark: rgba(0, 0, 0, .6);--glass-blur: blur(20px);--glass-blur-sm: blur(10px);--glass-blur-lg: blur(30px);--glow-pink: 0 0 20px rgba(255, 107, 157, .4);--glow-purple: 0 0 20px rgba(199, 125, 255, .4);--glow-teal: 0 0 20px rgba(78, 205, 196, .4);--glow-accent: 0 0 30px var(--brand-primary)}html{transition:background-color var(--transition-slow)}body,.app-header,.calendar-day,.prediction-card,.chart-card,.modal-content,.btn,.nav-btn,.theme-toggle{transition:background-color var(--transition-slow),color var(--transition-slow),border-color var(--transition-slow),box-shadow var(--transition-slow)}.no-transition,.no-transition *{transition:none!important}.elevation-0{box-shadow:none}.elevation-1{box-shadow:var(--shadow-sm)}.elevation-2{box-shadow:var(--shadow-md)}.elevation-3{box-shadow:var(--shadow-lg)}.elevation-4{box-shadow:var(--shadow-xl)}.elevation-5{box-shadow:var(--shadow-2xl)}.glass{background:var(--glass-light);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid rgba(255,255,255,.2)}.glass-strong{background:var(--glass-medium);-webkit-backdrop-filter:var(--glass-blur-lg);backdrop-filter:var(--glass-blur-lg)}.gradient-lavender{background:var(--gradient-lavender)}.gradient-sunrise{background:var(--gradient-sunrise)}.gradient-ocean{background:var(--gradient-ocean)}.gradient-peach{background:var(--gradient-peach)}.gradient-mint{background:var(--gradient-mint)}.gradient-sunset{background:var(--gradient-sunset)}.gradient-text{background:var(--gradient-lavender);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}[data-theme=dark] .glow-pink{box-shadow:var(--glow-pink)}[data-theme=dark] .glow-purple{box-shadow:var(--glow-purple)}[data-theme=dark] .glow-teal{box-shadow:var(--glow-teal)}[data-theme=dark] .glow-accent{box-shadow:var(--glow-accent)}.heading-1{font-size:var(--text-5xl);font-weight:var(--weight-black);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight)}.heading-2{font-size:var(--text-4xl);font-weight:var(--weight-extrabold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight)}.heading-3{font-size:var(--text-3xl);font-weight:var(--weight-bold);line-height:var(--leading-snug)}.heading-4{font-size:var(--text-2xl);font-weight:var(--weight-semibold);line-height:var(--leading-snug)}.heading-5{font-size:var(--text-xl);font-weight:var(--weight-semibold);line-height:var(--leading-normal)}.heading-6{font-size:var(--text-lg);font-weight:var(--weight-medium);line-height:var(--leading-normal)}.body-large{font-size:var(--text-lg);line-height:var(--leading-relaxed)}.body-base{font-size:var(--text-base);line-height:var(--leading-normal)}.body-small{font-size:var(--text-sm);line-height:var(--leading-normal)}.label{font-size:var(--text-xs);font-weight:var(--weight-semibold);text-transform:uppercase;letter-spacing:var(--tracking-wider)}.caption{font-size:var(--text-xs);color:var(--text-tertiary);line-height:var(--leading-normal)}.mono{font-family:var(--font-mono);font-size:.9em}.text-secondary-font{font-family:var(--font-secondary)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;overflow-y:scroll;-webkit-overflow-scrolling:touch}body{font-family:var(--font-family);font-size:var(--text-base);line-height:1.6;color:var(--text-primary);background-color:var(--bg-primary);overflow-x:hidden;position:relative;width:100%;min-height:100vh;min-height:-webkit-fill-available}#app{display:flex;flex-direction:column;min-height:100vh;min-height:-webkit-fill-available;max-width:1200px;width:100%;max-width:100vw;margin:0 auto;overflow-x:hidden}.offline-indicator{position:fixed;top:0;left:0;right:0;background:var(--error);color:var(--text-inverse);text-align:center;padding:8px;font-size:14px;font-weight:500;z-index:1000;transform:translateY(-100%);transition:transform .3s var(--ease-out-expo);box-shadow:var(--shadow-md)}.offline-indicator.offline{transform:translateY(0)}.update-btn{background:var(--gradient-lavender);color:var(--text-inverse);border:none;padding:8px 16px;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s var(--ease-out);box-shadow:var(--shadow-pink-sm);margin-left:auto;animation:pulse-gentle 2s infinite}.update-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-pink-md)}.update-btn:active{transform:translateY(0)}body.offline .header-nav{opacity:.7}body.offline .prediction-summary{opacity:.8}body.offline .toast-container .toast--info{background:var(--warning)}.app-header{position:sticky;top:0;z-index:100;background:var(--surface);border-bottom:1px solid var(--border-light);padding-top:max(20px,env(safe-area-inset-top));padding-right:max(20px,env(safe-area-inset-right));padding-bottom:16px;padding-left:max(20px,env(safe-area-inset-left))}.header-top{position:relative;margin-bottom:16px}.app-title{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--text-primary);text-align:center;margin:0;letter-spacing:-.02em}.theme-toggle{position:absolute;top:0;right:0;width:36px;height:36px;padding:6px;background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:var(--radius-full);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-base)}.theme-toggle:hover{background:var(--accent-primary);border-color:var(--accent-primary);transform:scale(1.05)}.theme-toggle:active{transform:scale(.95);transition:transform .1s ease}.theme-toggle:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.theme-toggle:hover .theme-icon{color:#fff}.theme-icon{width:20px;height:20px;color:var(--text-secondary);transition:color var(--transition-base)}.header-nav{display:flex;gap:8px;justify-content:center}.nav-btn{flex:1;max-width:140px;padding:10px 16px;background:transparent;border:none;border-radius:var(--radius-md);color:var(--text-secondary);font-family:var(--font-family);font-size:var(--text-sm);font-weight:var(--weight-medium);cursor:pointer;transition:all var(--transition-base)}.nav-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.nav-btn:active{transform:scale(.98);transition:transform .1s ease}.nav-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.nav-btn.active{background:var(--gradient-lavender);color:#fff;box-shadow:var(--shadow-pink-sm);transition:all var(--transition-base)}.nav-btn.active:hover{box-shadow:var(--shadow-pink-md);transform:translateY(-1px)}.app-main{flex:1;padding:24px 20px;padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));padding-bottom:24px;position:relative}.view{display:none;position:relative;z-index:1}.view.active{display:block;animation:fadeIn var(--transition-base)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.calendar-controls{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;gap:16px}.calendar-controls h2{font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--text-primary);flex:1;text-align:center}.control-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--surface);border:1px solid var(--border-light);border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--text-2xl);cursor:pointer;transition:all var(--transition-base);font-weight:var(--weight-normal)}.control-btn:hover{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary);transform:scale(1.05)}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:32px;width:100%;max-width:100%;box-sizing:border-box;margin-left:0;margin-right:0}.calendar-day{aspect-ratio:1;min-height:64px;max-height:120px;padding:6px 4px;background:linear-gradient(135deg,var(--surface) 0%,var(--bg-secondary) 100%);border:2px solid transparent;border-radius:var(--radius-xl);cursor:pointer;transition:all var(--duration-normal) var(--ease-out-expo);position:relative;display:grid;grid-template-rows:auto 1fr auto;align-items:center;justify-items:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent;overflow:hidden}.calendar-day:before{content:"";position:absolute;inset:0;background:var(--gradient-lavender);opacity:0;transition:opacity var(--duration-fast);z-index:0}.calendar-day>*{position:relative;z-index:1}.calendar-day:hover:not(.other-month){transform:translateY(-8px) scale(1.05);box-shadow:var(--shadow-pink-lg);border-color:var(--brand-primary)}.calendar-day:hover:not(.other-month):before{opacity:.05}.calendar-day.today.period-day-1:hover,.calendar-day.today.period-day-2:hover{box-shadow:0 -12px 24px #ff6b9d80,var(--shadow-pink-lg);border-color:var(--brand-primary)}.calendar-day.today.period-day-3:hover,.calendar.day.today.period-day-4:hover{box-shadow:0 -12px 24px #ff6b9d66,var(--shadow-pink-lg);border-color:var(--period-1)}.calendar-day.today.period-day-5:hover,.calendar.day.today.period-day-6:hover,.calendar.day.today.period-day-7:hover{box-shadow:0 -12px 24px #ff6b9d59,var(--shadow-pink-lg);border-color:#ff6b9d80}.calendar-day.other-month{opacity:.25;cursor:default}.calendar-day.other-month:hover{transform:none;box-shadow:none;border-color:var(--border-light)}.calendar-day.today{position:relative}.calendar-day.today:before{content:"";position:absolute;top:-2px;right:-2px;width:10px;height:10px;background:var(--gradient-lavender);border:2px solid white;border-radius:50%;z-index:10;box-shadow:0 2px 6px #0000004d}.calendar-day.today:after{content:"";position:absolute;inset:-2px;border-radius:inherit;padding:2px;background:var(--gradient-lavender);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:pulse 2s infinite;z-index:0}.calendar-day.current-day{background:var(--current-day);border-color:#4a90e2;box-shadow:0 0 0 3px #4a90e21a}.calendar-day.today:not(.period-day-1):not(.period-day-2):not(.period-day-3):not(.period-day-4):not(.period-day-5):not(.period-day-6):not(.period-day-7):not(.period-confirmed):not(.period-predicted):not(.period-predicted-current){border:3px solid var(--gradient-lavender);box-shadow:0 0 0 2px #c77dff4d,0 -4px 12px #c77dff66}.calendar-day.today.period-day-1,.calendar-day.today.period-day-2{border:3px solid var(--brand-primary);box-shadow:0 0 0 2px #ff6b9d4d,0 -4px 12px #ff6b9d66;position:relative}.calendar-day.today.period-day-3,.calendar.day.today.period-day-4{border:2px solid var(--period-1);box-shadow:0 0 0 2px #ff6b9d40,0 -4px 12px #ff6b9d59;position:relative}.calendar-day.today.period-day-5,.calendar.day.today.period-day-6,.calendar.day.today.period-day-7{border:2px solid rgba(255,107,157,.5);box-shadow:0 0 0 2px #ff6b9d33,0 -4px 12px #ff6b9d4d;position:relative}.calendar-day.today.period-confirmed{border:3px solid var(--period-confirmed);box-shadow:0 0 0 2px #ff6b9d4d,0 -4px 12px #ff6b9d66;position:relative}.calendar-day.today.period-predicted,.calendar.day.today.period-predicted-current{border:3px dashed var(--brand-primary);box-shadow:0 0 0 2px #ff6b9d40,0 -4px 12px #ff6b9d59;position:relative}.calendar-day.today.ovulation-predicted{border:3px solid var(--brand-secondary);box-shadow:0 0 0 2px #c77dff4d,0 -4px 12px #c77dff66;position:relative}.calendar-day.today.ovulation-historical-exact{border:3px solid var(--accent-secondary);box-shadow:0 0 0 2px #c77dff4d,0 -4px 12px #c77dff66;position:relative}.calendar-day.today.fertile-peak{border:2px solid var(--brand-secondary);box-shadow:0 0 0 2px #c77dff40,0 -4px 12px #c77dff59;position:relative}.calendar-day.today.fertile-moderate,.calendar.day.today.fertile-light,.calendar.day.today.fertile-window{border:2px solid rgba(199,125,255,.6);box-shadow:0 0 0 2px #c77dff33,0 -4px 12px #c77dff4d;position:relative}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.98)}}.calendar-day.period-day-1,.calendar-day.period-day-2{background:linear-gradient(135deg,var(--period-1) 0%,var(--period-2) 100%);border-color:var(--period-1);color:#fff;box-shadow:var(--shadow-pink-md)}.calendar-day.period-day-3,.calendar-day.period-day-4{background:linear-gradient(135deg,var(--period-2) 0%,var(--period-3) 100%);border-color:var(--period-2);color:var(--text-primary);box-shadow:var(--shadow-pink-sm)}.calendar-day.period-day-5,.calendar-day.period-day-6,.calendar-day.period-day-7{background:linear-gradient(135deg,var(--period-3) 0%,var(--period-4) 100%);border-color:var(--period-3);color:var(--text-primary)}.calendar-day.period-confirmed{background:var(--gradient-period);border-color:var(--period-confirmed);color:var(--text-primary);box-shadow:var(--shadow-pink-sm)}.calendar-day.period-predicted{background:var(--period-predicted);border:2px dashed var(--brand-primary);color:var(--text-primary)}.calendar-day.period-predicted-current{background:linear-gradient(135deg,var(--period-3) 0%,var(--period-4) 100%);border:2px dashed var(--brand-primary);color:var(--text-primary);opacity:.75}.calendar-day.ovulation-predicted{background:var(--gradient-fertile);border:2px dashed var(--brand-secondary);color:#fff;box-shadow:var(--shadow-purple-md)}.calendar-day.ovulation-historical-exact{background:linear-gradient(135deg,var(--accent-secondary),var(--accent-tertiary));border:2px solid var(--accent-secondary);box-shadow:var(--shadow-purple-md);color:#fff}.calendar-day.ovulation-historical-range{background:linear-gradient(135deg,var(--fertile-moderate),var(--neutral-100));border:1px solid var(--accent-secondary);color:var(--text-primary);opacity:.7}.calendar-day.fertile-peak{background:linear-gradient(135deg,var(--fertile-peak) 0%,var(--fertile-high) 100%);border-color:var(--brand-secondary);box-shadow:var(--shadow-purple-sm);color:var(--text-primary)}.calendar-day.fertile-moderate{background:var(--fertile-moderate);border-color:var(--accent-secondary);color:var(--text-primary)}.calendar-day.fertile-light{background:var(--fertile-light);border-color:var(--accent-secondary);color:var(--text-primary)}.calendar-day.fertile-window{background:var(--fertile-moderate);border-color:var(--accent-secondary);color:var(--text-primary)}.day-number{font-size:14px;font-weight:var(--weight-semibold);line-height:1;text-align:center;align-self:start;width:100%}.cycle-day{position:static;font-size:10px;color:var(--text-tertiary);font-weight:var(--weight-medium);line-height:1;text-align:center;align-self:end;opacity:.85;white-space:nowrap;width:100%}.calendar-day.current-day .cycle-day{color:var(--text-secondary);opacity:1}.calendar-day.period-day-1 .cycle-day,.calendar.day.period-day-2 .cycle-day{color:#ffffffe6;opacity:1}.calendar-day.period-day-3 .cycle-day,.calendar.day.period-day-4 .cycle-day,.calendar.day.period-day-5 .cycle-day,.calendar.day.period-day-6 .cycle-day,.calendar.day.period-day-7 .cycle-day,.calendar-day.period-confirmed .cycle-day{color:var(--text-secondary);opacity:1}.calendar-day.today.period-day-1:after,.calendar.day.today.period-day-2:after{background:var(--gradient-lavender);box-shadow:0 0 0 2px #ffffff4d}.calendar-day.today.period-day-3:after,.calendar.day.today.period-day-4:after{background:var(--gradient-lavender);box-shadow:0 0 0 2px #fff6}.calendar-day.today.period-day-5:after,.calendar.day.today.period-day-6:after,.calendar.day.today.period-day-7:after{background:var(--gradient-lavender);box-shadow:0 0 0 2px #ffffff80}.calendar-day.today.period-confirmed:after{background:var(--gradient-lavender);box-shadow:0 0 0 2px #fff6}.calendar-day.period-day-1 .cycle-day,.calendar-day.period-day-2 .cycle-day{color:#ffffffe6;opacity:1}.calendar-day.period-day-3 .cycle-day,.calendar-day.period-day-4 .cycle-day,.calendar-day.period-day-5 .cycle-day,.calendar-day.period-day-6 .cycle-day,.calendar-day.period-day-7 .cycle-day,.calendar-day.period-confirmed .cycle-day{color:var(--text-secondary);opacity:1}.calendar-day.ovulation-predicted .cycle-day,.calendar-day.fertile-peak .cycle-day{color:#ffffffe6;opacity:1}.day-indicators{display:flex;gap:3px;flex-wrap:wrap;justify-content:center;align-items:center;padding:2px 0;min-height:18px;width:100%}.indicator{width:14px;height:14px;flex-shrink:0;display:flex;align-items:center;justify-content:center}.indicator svg{width:100%;height:100%}.indicator.cramps svg{fill:#ffd4a3}.indicator.intercourse svg{fill:#ff9aa2}.indicator.after-sex-cramps svg{fill:#e8d5f2}.indicator.ovulation svg{fill:var(--accent-secondary)}.calendar-day.period-day-1 .indicator svg,.calendar-day.period-day-2 .indicator svg,.calendar-day.period-confirmed .indicator svg,.calendar-day.current-day .indicator svg{fill:#ffffffe6}.calendar-day.ovulation-historical-exact .indicator.ovulation svg{fill:#fffffff2}.prediction-summary{margin-top:32px}.section-title{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:16px}.prediction-card{background:var(--surface);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:20px;margin-bottom:12px;transition:all var(--transition-base)}.prediction-card:hover{box-shadow:var(--shadow-soft);border-color:var(--accent-primary)}.prediction-header{display:flex;align-items:center;gap:10px;margin-bottom:16px}.prediction-icon{font-size:24px}.prediction-header h4{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-secondary);margin:0;text-transform:uppercase;letter-spacing:.05em}.prediction-date{font-size:var(--text-xl);font-weight:var(--weight-bold);color:var(--text-primary);margin-bottom:12px}.prediction-meta{margin-bottom:8px}.confidence-bar{width:100%;height:6px;background:var(--bg-secondary);border-radius:3px;overflow:hidden;margin-bottom:6px}.confidence-fill{height:100%;background:linear-gradient(90deg,var(--accent-primary),var(--accent-secondary));border-radius:3px;transition:width var(--transition-slow)}.confidence-text{font-size:var(--text-sm);color:var(--text-secondary);font-weight:var(--weight-medium)}.prediction-range{font-size:var(--text-sm);color:var(--text-tertiary)}.prediction-item{padding:var(--spacing-md);margin-bottom:var(--spacing-sm);background:var(--surface);border-radius:var(--radius-md);border-left:4px solid var(--accent-primary)}.prediction-label{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--spacing-xs)}.prediction-value{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-xs)}.prediction-confidence{font-size:var(--text-sm);color:var(--text-tertiary)}.charts-container{display:grid;gap:24px}@media(min-width:768px){.charts-container{grid-template-columns:repeat(2,1fr)}.stats-card{grid-column:1 / -1}}.chart-card{background:var(--surface);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:24px}.chart-title{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:20px}.chart-wrapper{position:relative;height:250px}#stats-summary{display:grid;gap:12px}.stat-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:var(--bg-secondary);border-radius:var(--radius-md)}.stat-label{font-size:var(--text-sm);color:var(--text-secondary);font-weight:var(--weight-medium)}.stat-value{font-size:var(--text-xl);font-weight:var(--weight-bold);color:var(--accent-primary)}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal[hidden]{display:none}.modal-content{background:var(--surface);border-radius:var(--radius-xl);max-width:480px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d;animation:slideUp var(--transition-slow)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:24px 24px 20px;border-bottom:1px solid var(--border-light)}.modal-header h2{font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--text-primary)}.close-btn{width:36px;height:36px;border-radius:var(--radius-full);background:var(--bg-secondary);border:none;color:var(--text-secondary);font-size:24px;cursor:pointer;transition:all var(--transition-base);line-height:1}.close-btn:hover{background:var(--accent-primary);color:#fff;transform:rotate(90deg)}.modal-body{padding:24px}.form-group{margin-bottom:20px}.form-group label{display:block;font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-primary);margin-bottom:8px}.form-group input[type=date],.form-group input[type=text],.form-group textarea{width:100%;padding:12px 16px;border:1.5px solid var(--border-light);border-radius:var(--radius-md);font-family:var(--font-family);font-size:var(--text-base);background:var(--surface);color:var(--text-primary);transition:all var(--transition-base)}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 3px #ffb8c11a}.form-group textarea{resize:vertical;min-height:80px}.radio-group,.checkbox-group{display:flex;flex-direction:column;gap:8px}.radio-label,.checkbox-label{display:flex;align-items:center;gap:10px;padding:12px;border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-base)}.radio-label:hover,.checkbox-label:hover{background:var(--bg-secondary)}.radio-label input,.checkbox-label input{width:20px;height:20px;cursor:pointer;accent-color:var(--accent-primary)}.radio-label span,.checkbox-label span{font-size:var(--text-base);color:var(--text-primary)}.entry-type-due{background:linear-gradient(135deg,#ffb8c11a,#ffb8c10d);border:1px solid rgba(255,184,193,.2);box-shadow:0 2px 8px #ffb8c11a}.entry-type-due:hover{background:linear-gradient(135deg,#ffb8c126,#ffb8c114)}.form-group{margin-bottom:24px}.form-group label{display:block;font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-primary);margin-bottom:12px}.radio-group{display:flex;flex-direction:column;gap:12px}.radio-label{display:flex;align-items:center;gap:12px;padding:16px;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);border:1px solid var(--border-light);background:var(--surface)}.radio-label:hover{background:var(--bg-secondary);border-color:var(--accent-primary);transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.radio-label input{width:20px;height:20px;cursor:pointer;accent-color:var(--accent-primary)}.form-actions{display:flex;gap:16px;justify-content:flex-end;margin-top:32px;padding-top:24px;border-top:1px solid var(--border-light)}.btn-primary{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;min-width:120px}.btn-secondary{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-light);min-width:100px}.btn-secondary:hover{background:var(--bg-primary);border-color:var(--border-medium)}.modal-content{background:var(--surface);border-radius:var(--radius-xl);max-width:500px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #00000026;animation:slideUp var(--transition-slow)}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:28px 28px 24px;border-bottom:1px solid var(--border-light)}.modal-body{padding:28px}.form-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}.btn{padding:12px 24px;border-radius:var(--radius-md);font-family:var(--font-family);font-size:var(--text-base);font-weight:var(--weight-semibold);cursor:pointer;border:none;transition:all var(--transition-base);display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:active:not(:disabled){transform:scale(.98);transition:transform .1s ease}.btn:focus-visible:not(:disabled){outline:2px solid var(--accent-primary);outline-offset:2px}.btn-primary{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-soft)}.btn-primary:active:not(:disabled){transform:translateY(0) scale(.98);transition:transform .1s ease}.btn-secondary{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-light)}.btn-secondary:hover:not(:disabled){background:var(--border-light)}.btn-secondary:active:not(:disabled){transform:scale(.98);transition:transform .1s ease}.settings-container{max-width:600px}.settings-container h2{font-size:var(--text-2xl);font-weight:var(--weight-bold);margin-bottom:24px;color:var(--text-primary)}.setting-group{margin-bottom:24px;padding:20px;background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border-light)}.setting-group h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);margin-bottom:12px;color:var(--text-primary)}.setting-group p{margin-bottom:12px;color:var(--text-secondary);font-size:var(--text-sm)}.setting-group .btn{margin-right:8px;margin-bottom:8px}.setting-group.danger-zone{border:2px solid #FF6B6B;background:#ff6b6b0d}[data-theme=dark] .setting-group.danger-zone{background:#ff6b6b1a}.privacy-summary{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--spacing-md);line-height:1.6}.privacy-features{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--spacing-sm)}.privacy-features li{display:flex;align-items:center;gap:var(--spacing-xs);font-size:var(--text-sm);color:var(--text-secondary);padding:var(--spacing-xs) 0}.privacy-features li:before{content:"✓";color:var(--success);font-weight:var(--weight-bold)}.guide-intro{margin-bottom:20px;color:var(--text-secondary);line-height:1.5;font-size:var(--text-sm)}.homescreen-instructions .step{display:flex;align-items:center;margin-bottom:16px;gap:16px}.step-number{background:var(--accent-primary);color:#fff;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}.step span:last-child{line-height:1.4;color:var(--text-primary);font-size:var(--text-sm)}.homescreen-benefits{background:var(--background-secondary);border-radius:var(--radius-md);padding:16px;margin:20px 0}.homescreen-benefits p{margin:6px 0;font-size:var(--text-sm);color:var(--text-secondary);line-height:1.4}.homescreen-benefits p:first-child{margin-top:0}.homescreen-benefits p:last-child{margin-bottom:0}.icon{background:var(--border-color);border-radius:4px;padding:4px 8px;font-family:monospace;font-size:12px;font-weight:700;color:var(--text-primary);display:inline-block;vertical-align:middle}@media(max-width:480px){.homescreen-instructions .step{flex-direction:column;align-items:flex-start;gap:8px}.step-number{margin-bottom:4px}.step span:last-child{width:100%}}.warning-text{color:#ff6b6b;font-weight:var(--weight-semibold);font-size:var(--text-sm);margin-bottom:12px;line-height:1.4}.btn-danger{background:#ff6b6b;color:#fff;border:none}.btn-danger:hover:not(:disabled){background:#e85555;transform:translateY(-2px);box-shadow:var(--shadow-soft)}.btn-danger:active:not(:disabled){transform:translateY(0) scale(.98);transition:transform .1s ease}.existing-entry-section{margin-bottom:24px;padding-bottom:24px;border-bottom:2px solid var(--border-light)}.existing-entry-section h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);margin-bottom:12px;color:var(--text-primary)}.entry-display{background:var(--bg-secondary);border-radius:var(--radius-md);padding:16px;margin-bottom:16px}.entry-display-item{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:var(--text-base);color:var(--text-primary)}.entry-display-item:last-child{margin-bottom:0}.entry-display-icon{font-size:20px}.import-wizard{max-width:600px}.import-step{min-height:400px}.step-description{color:var(--text-secondary);font-size:var(--text-base);margin-bottom:24px;line-height:1.6}.import-methods{display:grid;grid-template-columns:1fr;gap:16px}.import-method-btn{display:flex;align-items:center;gap:16px;padding:20px;background:var(--surface);border:2px solid var(--border-light);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);text-align:left}.import-method-btn:hover{border-color:var(--accent-primary);background:var(--bg-secondary);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.method-icon{font-size:32px;flex-shrink:0}.method-info h4{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:4px}.method-info p{font-size:var(--text-sm);color:var(--text-secondary);margin:0}.back-btn{background:var(--bg-secondary);border:1px solid var(--border-light);padding:8px 16px;border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-sm);color:var(--text-primary);margin-bottom:20px;transition:all var(--transition-base)}.back-btn:hover{background:var(--bg-primary);border-color:var(--border-medium)}.file-upload-area{margin:24px 0}.file-upload-label{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;border:2px dashed var(--border-medium);border-radius:var(--radius-lg);background:var(--bg-secondary);cursor:pointer;transition:all var(--transition-base);padding:32px}.file-upload-label:hover{border-color:var(--accent-primary);background:var(--surface)}.upload-icon{font-size:48px;margin-bottom:16px}.file-upload-label p{margin:8px 0;color:var(--text-primary);font-size:var(--text-base)}.file-hint{font-size:var(--text-sm)!important;color:var(--text-tertiary)!important}.file-name{margin-top:12px;padding:12px;background:var(--bg-secondary);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--text-primary)}#csv-preview-section{margin-top:24px}#csv-preview-stats{background:var(--bg-secondary);padding:16px;border-radius:var(--radius-md);margin-bottom:16px}#csv-preview-table{max-height:300px;overflow-y:auto;border:1px solid var(--border-light);border-radius:var(--radius-md);margin-bottom:20px}.manual-entry-form{background:var(--bg-secondary);padding:24px;border-radius:var(--radius-lg);margin-bottom:24px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.form-row:last-child{grid-template-columns:1fr}.radio-group-inline{display:flex;gap:12px}.radio-label-inline{display:flex;align-items:center;gap:6px;cursor:pointer}.radio-label-inline input{cursor:pointer;accent-color:var(--accent-primary)}.quick-entry-date{font-size:var(--text-base)!important}.manual-entry-list{margin:24px 0}.manual-entry-list h4{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:12px}.entry-list{max-height:300px;overflow-y:auto;border:1px solid var(--border-light);border-radius:var(--radius-md);padding:12px;background:var(--surface)}.entry-item{display:flex;justify-content:space-between;align-items:center;padding:12px;border-bottom:1px solid var(--border-light);font-size:var(--text-sm)}.entry-item:last-child{border-bottom:none}.entry-item-remove{background:none;border:none;color:var(--error);cursor:pointer;font-size:var(--text-lg);padding:4px 8px;transition:opacity var(--transition-base)}.entry-item-remove:hover{opacity:.7}.manual-actions{display:flex;justify-content:flex-end;gap:12px}.app-guides{display:flex;flex-direction:column;gap:24px}.app-guide{background:var(--bg-secondary);padding:20px;border-radius:var(--radius-lg);border-left:4px solid var(--accent-primary)}.app-guide h4{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:12px}.app-guide ol{margin:12px 0;padding-left:24px;color:var(--text-secondary);line-height:1.8}.app-guide li{margin-bottom:8px}.app-guide a{color:var(--accent-primary);text-decoration:none;font-weight:var(--weight-medium)}.app-guide a:hover{text-decoration:underline}.copy-email-btn{margin-top:12px;padding:8px 16px;background:var(--accent-primary);color:#fff;border:none;border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-sm);font-weight:var(--weight-medium);transition:all var(--transition-base)}.copy-email-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-soft)}#email-template{width:100%;padding:16px;border:1px solid var(--border-light);border-radius:var(--radius-md);background:var(--surface);color:var(--text-primary);font-family:var(--font-family);font-size:var(--text-sm);line-height:1.6;margin:12px 0;resize:vertical}@media(max-width:768px){.app-main{padding:20px 16px;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}.calendar-grid{gap:5px}.calendar-day{min-height:56px;max-height:80px;font-size:var(--text-sm);padding:6px 4px}.calendar-day.today:before{width:8px;height:8px;top:-1px;right:-1px}.day-number{font-size:13px}.cycle-day{font-size:8px}.indicator{width:12px;height:12px}.calendar-day.today.period-day-1,.calendar-day.today.period-day-2,.calendar-day.today.period-day-3,.calendar-day.today.period-day-4,.calendar-day.today.period-day-5,.calendar-day.today.period-day-6,.calendar-day.today.period-day-7,.calendar-day.today.period-confirmed,.calendar-day.today.period-predicted,.calendar-day.today.period-predicted-current,.calendar-day.today.ovulation-predicted,.calendar-day.today.ovulation-historical-exact,.calendar-day.today.fertile-peak,.calendar-day.today.fertile-moderate,.calendar-day.today.fertile-light,.calendar-day.today.fertile-window{transform:translateY(-2px)}.calendar-day.today.period-day-1:hover,.calendar-day.today.period-day-2:hover,.calendar-day.today.period-day-3:hover,.calendar.day.today.period-day-4:hover,.calendar.day.today.period-day-5:hover,.calendar.day.today.period-day-6:hover,.calendar.day.today.period-day-7:hover,.calendar-day.today.period-confirmed:hover,.calendar-day.today.period-predicted:hover,.calendar.day.today.period-predicted-current:hover,.calendar.day.today.ovulation-predicted:hover,.calendar.day.today.ovulation-historical-exact:hover,.calendar.day.today.fertile-peak:hover,.calendar.day.today.fertile-moderate:hover,.calendar.day.today.fertile-light:hover,.calendar.day.today.fertile-window:hover{transform:translateY(-10px) scale(1.02)}.form-actions{flex-direction:column-reverse}.form-actions .btn{width:100%}.calendar-controls h2{font-size:var(--text-lg)}.control-btn{width:40px;height:40px}}@media(max-width:480px){.app-main{padding:20px 10px;padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}.app-title{font-size:var(--text-xl)}.calendar-grid{gap:3px}.calendar-day{min-height:50px;max-height:68px;padding:5px 3px}.day-number{font-size:13px;margin-bottom:2px}.indicator{width:12px;height:12px}.cycle-day{font-size:8px;bottom:2px;right:2px}}.hidden{display:none!important}.mt-md{margin-top:var(--spacing-md)}.mb-md{margin-bottom:var(--spacing-md)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes scaleOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slideInDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes slideOutRight{0%{transform:translate(0)}to{transform:translate(100%)}}@keyframes slideOutLeft{0%{transform:translate(0)}to{transform:translate(-100%)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(.95)}}@keyframes heartbeat{0%,to{transform:scale(1)}14%{transform:scale(1.15)}28%{transform:scale(1)}42%{transform:scale(1.15)}56%{transform:scale(1)}}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes glow{0%,to{box-shadow:0 0 10px var(--brand-primary)}50%{box-shadow:0 0 20px var(--brand-primary)}}.animate-fadeIn{animation:fadeIn var(--duration-normal) var(--ease-smooth)}.animate-fadeInUp{animation:fadeInUp var(--duration-normal) var(--ease-out-expo)}.animate-fadeInDown{animation:fadeInDown var(--duration-normal) var(--ease-out-expo)}.animate-fadeInLeft{animation:fadeInLeft var(--duration-normal) var(--ease-out-expo)}.animate-fadeInRight{animation:fadeInRight var(--duration-normal) var(--ease-out-expo)}.animate-scaleIn{animation:scaleIn var(--duration-normal) var(--ease-out-expo)}.animate-slideInUp{animation:slideInUp var(--duration-normal) var(--ease-out-expo)}.animate-bounce{animation:bounce 1s infinite}.animate-shake{animation:shake var(--duration-fast)}.animate-spin{animation:spin 1s linear infinite}.animate-pulse{animation:pulse 2s infinite}.animate-heartbeat{animation:heartbeat 1.5s infinite}.animate-wiggle{animation:wiggle .5s}.animate-float{animation:float 3s ease-in-out infinite}.animate-glow{animation:glow 2s infinite}.animation-delay-100{animation-delay:.1s}.animation-delay-200{animation-delay:.2s}.animation-delay-300{animation-delay:.3s}.animation-delay-500{animation-delay:.5s}.container{width:100%;margin-left:auto;margin-right:auto;padding-left:var(--spacing-md);padding-right:var(--spacing-md)}@media(min-width:640px){.container{max-width:640px}}@media(min-width:768px){.container{max-width:768px;padding-left:var(--spacing-lg);padding-right:var(--spacing-lg)}}@media(min-width:1024px){.container{max-width:1024px}}@media(min-width:1280px){.container{max-width:1280px}}.grid{display:grid;gap:var(--spacing-md)}.grid-cols-1{grid-template-columns:repeat(1,1fr)}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}@media(min-width:640px){.sm\\:grid-cols-1{grid-template-columns:repeat(1,1fr)}.sm\\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.sm\\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.sm\\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}@media(min-width:768px){.md\\:grid-cols-1{grid-template-columns:repeat(1,1fr)}.md\\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.md\\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.md\\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}@media(min-width:1024px){.lg\\:grid-cols-1{grid-template-columns:repeat(1,1fr)}.lg\\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.lg\\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.lg\\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.gap-1{gap:var(--spacing-xs)}.gap-2{gap:var(--spacing-sm)}.gap-3{gap:.75rem}.gap-4{gap:var(--spacing-md)}.gap-6{gap:var(--spacing-lg)}.gap-8{gap:var(--spacing-xl)}.hidden{display:none}@media(min-width:640px){.sm\\:block{display:block}.sm\\:flex{display:flex}.sm\\:hidden{display:none}}@media(min-width:768px){.md\\:block{display:block}.md\\:flex{display:flex}.md\\:hidden{display:none}}@media(min-width:1024px){.lg\\:block{display:block}.lg\\:flex{display:flex}.lg\\:hidden{display:none}}.w-full{width:100%}.h-full{height:100%}.max-w-xs{max-width:320px}.max-w-sm{max-width:384px}.max-w-md{max-width:448px}.max-w-lg{max-width:512px}.max-w-xl{max-width:576px}.max-w-2xl{max-width:672px}.max-w-3xl{max-width:768px}.max-w-4xl{max-width:896px}.max-w-5xl{max-width:1024px}.max-w-6xl{max-width:1152px}.max-w-7xl{max-width:1280px}.mx-auto{margin-left:auto;margin-right:auto}.p-0{padding:0}.p-1{padding:var(--spacing-xs)}.p-2{padding:var(--spacing-sm)}.p-4{padding:var(--spacing-md)}.p-6{padding:var(--spacing-lg)}.p-8{padding:var(--spacing-xl)}.px-2{padding-left:var(--spacing-sm);padding-right:var(--spacing-sm)}.px-4{padding-left:var(--spacing-md);padding-right:var(--spacing-md)}.px-6{padding-left:var(--spacing-lg);padding-right:var(--spacing-lg)}.px-8{padding-left:var(--spacing-xl);padding-right:var(--spacing-xl)}.py-2{padding-top:var(--spacing-sm);padding-bottom:var(--spacing-sm)}.py-4{padding-top:var(--spacing-md);padding-bottom:var(--spacing-md)}.py-6{padding-top:var(--spacing-lg);padding-bottom:var(--spacing-lg)}.py-8{padding-top:var(--spacing-xl);padding-bottom:var(--spacing-xl)}.m-0{margin:0}.m-2{margin:var(--spacing-sm)}.m-4{margin:var(--spacing-md)}.m-6{margin:var(--spacing-lg)}.m-8{margin:var(--spacing-xl)}.mt-2{margin-top:var(--spacing-sm)}.mt-4{margin-top:var(--spacing-md)}.mt-6{margin-top:var(--spacing-lg)}.mt-8{margin-top:var(--spacing-xl)}.mb-2{margin-bottom:var(--spacing-sm)}.mb-4{margin-bottom:var(--spacing-md)}.mb-6{margin-bottom:var(--spacing-lg)}.mb-8{margin-bottom:var(--spacing-xl)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.rounded{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:var(--radius-full)}@media(max-width:767px){.app-main{padding-bottom:calc(80px + env(safe-area-inset-bottom))}.calendar-grid{gap:4px}.calendar-day{min-height:50px;padding:4px 2px;font-size:var(--text-sm)}.day-number{font-size:13px}.cycle-day{font-size:9px}.indicator{width:12px;height:12px}.day-indicators{gap:2px;min-height:16px}.prediction-card{padding:var(--spacing-md)}}@media(min-width:768px)and (max-width:1023px){.calendar-day{min-height:60px}.day-number{font-size:14px}.cycle-day{font-size:10px}.indicator{width:14px;height:14px}}@media(min-width:1024px){.app-layout{display:grid;grid-template-columns:300px 1fr 300px;gap:var(--spacing-xl)}.calendar-day{min-height:70px}.day-number{font-size:15px}.cycle-day{font-size:11px}.indicator{width:16px;height:16px}.day-indicators{gap:4px}}.insights-tabs{display:flex;gap:var(--spacing-xs);background:var(--glass-light);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);padding:var(--spacing-xs);border-radius:var(--radius-xl);margin-bottom:var(--spacing-lg);border:1px solid var(--border-light);box-shadow:var(--shadow-pink-sm)}.insights-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);border:none;background:transparent;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--duration-normal) var(--ease-smooth);color:var(--text-secondary);font-family:var(--font-primary);font-size:var(--text-sm);font-weight:var(--weight-medium);min-height:44px}.insights-tab:hover{background:#ff6b9d1a;color:var(--text-primary)}.insights-tab:active{transform:scale(.98);transition:transform .1s ease}.insights-tab:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.insights-tab.active{background:var(--gradient-lavender);color:#fff;box-shadow:var(--shadow-pink-sm)}.insights-tab .tab-icon{font-size:var(--text-lg);line-height:1}.insights-tab .tab-label{display:none}@media(min-width:400px){.insights-tab .tab-label{display:inline}}.insights-content{position:relative}.insights-panel{display:none;animation:fadeIn var(--duration-normal) var(--ease-smooth)}.insights-panel.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.overview-header{text-align:center;margin-bottom:var(--spacing-xl)}.overview-header h2{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--text-primary);margin-bottom:var(--spacing-xs)}.overview-header p{font-size:var(--text-md);color:var(--text-secondary)}.quick-stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-xl)}@media(min-width:768px){.quick-stats-grid{grid-template-columns:repeat(4,1fr)}}.quick-stat-card{background:var(--surface);border-radius:var(--card-radius);padding:var(--spacing-lg);text-align:center;box-shadow:var(--card-shadow);transition:all var(--duration-normal) var(--ease-smooth);position:relative;overflow:hidden;border:1px solid var(--border-light)}.quick-stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-lavender)}.quick-stat-card:hover{transform:translateY(-4px);box-shadow:var(--card-shadow-hover)}.quick-stat-value{font-size:var(--text-3xl);font-weight:var(--weight-black);background:var(--gradient-lavender);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.2;margin-bottom:var(--spacing-xs)}.quick-stat-label{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary);text-transform:uppercase;letter-spacing:var(--tracking-wider);margin-bottom:var(--spacing-xs)}.quick-stat-status{font-size:var(--text-xs);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-full);display:inline-block}.quick-stat-status.normal{background:#06d6a026;color:var(--success-dark)}.quick-stat-status.attention{background:#ffb74d26;color:var(--warning-dark)}.quick-stat-status.concern{background:#ef476f26;color:var(--error-dark)}.health-status-card{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);margin-bottom:var(--spacing-xl)}.health-status-card h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-md);display:flex;align-items:center;gap:var(--spacing-sm)}.health-status-list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.health-status-item{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-secondary);border-radius:var(--radius-lg);font-size:var(--text-sm);color:var(--text-primary)}.health-status-item .status-icon{font-size:var(--text-lg)}.data-confidence{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);margin-bottom:var(--spacing-xl)}.data-confidence h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-md)}.confidence-meter{height:8px;background:var(--bg-tertiary);border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--spacing-sm)}.confidence-fill{height:100%;background:var(--gradient-lavender);border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out-expo)}.confidence-label{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--text-tertiary)}.milestones-compact{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);margin-bottom:var(--spacing-xl)}.milestones-compact h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-md)}.milestones-row{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.milestone-chip{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-md);background:var(--gradient-lavender);color:#fff;border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--weight-medium)}.milestone-chip.upcoming{background:var(--bg-secondary);color:var(--text-secondary);border:1px dashed var(--border-medium)}.predictions-card{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);border-left:4px solid var(--brand-primary)}.predictions-card h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-md)}.prediction-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--bg-secondary);border-radius:var(--radius-lg);margin-bottom:var(--spacing-sm)}.prediction-item:last-child{margin-bottom:0}.prediction-icon{font-size:var(--text-2xl)}.prediction-details{flex:1}.prediction-label{font-size:var(--text-xs);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:var(--tracking-wider)}.prediction-value{font-size:var(--text-md);font-weight:var(--weight-semibold);color:var(--text-primary)}.insights-empty-state{text-align:center;padding:var(--spacing-3xl) var(--spacing-xl)}.insights-empty-state .empty-icon{font-size:64px;margin-bottom:var(--spacing-lg);opacity:.5}.insights-empty-state h3{font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-sm)}.insights-empty-state p{font-size:var(--text-md);color:var(--text-secondary);margin-bottom:var(--spacing-lg);max-width:400px;margin-left:auto;margin-right:auto}.insights-empty-state .empty-actions{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}.learn-section{margin-bottom:var(--spacing-xl)}.learn-section-title{font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-md);display:flex;align-items:center;gap:var(--spacing-sm)}.learn-intro{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);margin-bottom:var(--spacing-xl);border-left:4px solid var(--brand-secondary)}.learn-intro p{font-size:var(--text-md);color:var(--text-secondary);line-height:1.7}.info-card{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);margin-bottom:var(--spacing-md);border:1px solid var(--border-light)}.info-card h4{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-sm)}.info-card p{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6}.info-list{list-style:none;padding:0;margin:var(--spacing-md) 0 0 0}.info-list li{padding:var(--spacing-xs) 0;padding-left:var(--spacing-lg);position:relative;font-size:var(--text-sm);color:var(--text-secondary)}.info-list li:before{content:"•";position:absolute;left:0;color:var(--brand-primary);font-weight:700}.charts-container{display:grid;grid-template-columns:1fr;gap:var(--spacing-lg);animation:fadeInUp var(--duration-slow) var(--ease-out-expo)}@media(min-width:768px){.charts-container{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.charts-container{grid-template-columns:repeat(3,1fr)}}.chart-card{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);transition:all var(--duration-normal) var(--ease-smooth);position:relative;overflow:hidden}.chart-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-lavender)}.chart-card:hover{transform:translateY(-4px);box-shadow:var(--card-shadow-hover)}.chart-card h3{font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-md)}.chart-card canvas{max-height:300px}.chart-card.full-width{grid-column:1 / -1}.stats-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-md)}.stat-card{background:var(--bg-secondary);border-radius:var(--radius-xl);padding:var(--spacing-lg);text-align:center;transition:all var(--duration-fast) var(--ease-smooth)}.stat-card:hover{transform:scale(1.05);background:var(--gradient-lavender);color:#fff}.stat-value{font-size:var(--text-4xl);font-weight:var(--weight-black);background:var(--gradient-lavender);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;display:block;margin-bottom:var(--spacing-sm)}.stat-card:hover .stat-value{-webkit-text-fill-color:white}.stat-label{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);text-transform:uppercase;letter-spacing:var(--tracking-wider)}.stat-card:hover .stat-label{color:#fff}.insight-card{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);border-left:4px solid var(--brand-primary)}.insight-card h4{font-size:var(--text-lg);font-weight:var(--weight-semibold);margin-bottom:var(--spacing-md);color:var(--text-primary)}.insight-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--spacing-md)}.insight-stat{text-align:center}.insight-stat .stat-label{font-size:var(--text-xs);color:var(--text-tertiary);display:block;margin-bottom:var(--spacing-xs)}.insight-stat .stat-value{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--brand-primary)}.chart-empty-state{text-align:center;padding:var(--spacing-xl);color:var(--text-tertiary)}.chart-empty-state svg{width:80px;height:80px;margin:0 auto var(--spacing-md);opacity:.3}.chart-empty-state h4{font-size:var(--text-lg);font-weight:var(--weight-medium);color:var(--text-secondary);margin-bottom:var(--spacing-sm)}.chart-empty-state p{font-size:var(--text-sm);color:var(--text-tertiary)}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--spacing-md)}.metric-item{background:var(--bg-secondary);padding:var(--spacing-md);border-radius:var(--radius-lg);text-align:center;transition:all var(--duration-fast) var(--ease-smooth)}.metric-item:hover{transform:translateY(-2px);background:var(--gradient-lavender);color:#fff}.metric-label{display:block;font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--spacing-xs);text-transform:uppercase;letter-spacing:var(--tracking-wider)}.metric-value{display:block;font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--text-primary);margin-bottom:var(--spacing-xs)}.metric-unit{font-size:var(--text-sm);font-weight:var(--weight-normal);opacity:.8}.metric-detail{display:block;font-size:var(--text-xs);color:var(--text-tertiary);margin-top:var(--spacing-xs)}.metric-item:hover .metric-value,.metric-item:hover .metric-detail{color:#fff}.hero-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-md);margin-bottom:var(--spacing-xl)}.hero-stat-card{background:var(--gradient-lavender);border-radius:var(--card-radius);padding:var(--spacing-lg);display:flex;align-items:center;gap:var(--spacing-md);color:#fff;box-shadow:var(--shadow-pink-lg);transition:all var(--duration-normal) var(--ease-smooth);animation:fadeInUp var(--duration-normal) var(--ease-out-expo)}.hero-stat-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-purple-lg)}.hero-stat-icon{font-size:var(--text-4xl);line-height:1}.hero-stat-content{flex:1}.hero-stat-value{font-size:var(--text-4xl);font-weight:var(--weight-black);line-height:1.1}.hero-stat-label{font-size:var(--text-sm);opacity:.9;margin-top:var(--spacing-xs)}.milestones-section{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);margin-bottom:var(--spacing-xl);box-shadow:var(--card-shadow)}.milestones-section h3{font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-md)}.milestones-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--spacing-sm)}.milestone-badge{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-md);text-align:center;transition:all var(--duration-fast) var(--ease-smooth);border:2px solid transparent}.milestone-badge.earned{background:var(--gradient-lavender);color:#fff;border-color:var(--brand-primary);animation:bounceIn var(--duration-normal) var(--ease-out-expo)}.milestone-badge.locked{opacity:.5;filter:grayscale(1)}.milestone-badge:hover{transform:scale(1.05)}.milestone-icon{font-size:var(--text-3xl);display:block;margin-bottom:var(--spacing-xs)}.milestone-name{font-size:var(--text-xs);font-weight:var(--weight-medium);display:block}.section-header{margin:var(--spacing-xl) 0 var(--spacing-lg)}.section-header h3{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--text-primary);margin-bottom:var(--spacing-xs)}.section-header p{font-size:var(--text-md);color:var(--text-secondary)}.chart-subtitle{font-size:var(--text-sm);color:var(--text-tertiary);margin-top:var(--spacing-xs);margin-bottom:var(--spacing-md)}.phase-breakdown{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-lg);margin-bottom:var(--spacing-xl)}.phase-card{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);transition:all var(--duration-normal) var(--ease-smooth);border-left:4px solid var(--brand-primary);border:1px solid var(--border-light)}.phase-card:hover{transform:translateY(-4px);box-shadow:var(--card-shadow-hover)}.phase-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--border-light)}.phase-header h4{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary)}.phase-days{font-size:var(--text-sm);color:var(--text-tertiary);font-weight:var(--weight-medium);background:var(--bg-secondary);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-md)}.phase-description{font-size:var(--text-md);color:var(--text-secondary);line-height:1.6;margin-bottom:var(--spacing-md)}.phase-symptoms,.phase-tips{margin-bottom:var(--spacing-md)}.phase-symptoms strong,.phase-tips strong{display:block;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-xs)}.phase-symptoms ul,.phase-tips ul{list-style:none;padding:0;margin:0}.phase-symptoms li,.phase-tips li{font-size:var(--text-sm);color:var(--text-secondary);padding:var(--spacing-xs) 0;padding-left:var(--spacing-md);position:relative}.phase-symptoms li:before{content:"•";position:absolute;left:0;color:var(--brand-primary);font-weight:700}.phase-tips li:before{content:"→";position:absolute;left:0;color:var(--success)}.symptom-stat{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm) 0;border-bottom:1px solid var(--border-light)}.symptom-stat:last-of-type{border-bottom:none}.symptom-stat .stat-label{font-size:var(--text-sm);color:var(--text-tertiary);font-weight:var(--weight-medium)}.symptom-stat .stat-value{font-size:var(--text-md);color:var(--text-primary);font-weight:var(--weight-semibold)}.symptom-insight{margin-top:var(--spacing-md);padding:var(--spacing-md);background:var(--bg-secondary);border-radius:var(--radius-lg);font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6}.privacy-section{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--spacing-lg);margin-bottom:var(--spacing-xl)}.privacy-card{background:var(--surface);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow);text-align:center;transition:all var(--duration-normal) var(--ease-smooth);border:2px solid var(--border-light)}.privacy-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-pink-lg);border-color:var(--brand-primary)}.privacy-icon{font-size:var(--text-5xl);margin-bottom:var(--spacing-md);display:block}.privacy-card h4{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-sm)}.privacy-card p{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6}.charts-empty-state{text-align:center;padding:var(--spacing-3xl);color:var(--text-tertiary)}.empty-icon{font-size:80px;margin-bottom:var(--spacing-lg);opacity:.3}.charts-empty-state h3{font-size:var(--text-2xl);font-weight:var(--weight-semibold);color:var(--text-secondary);margin-bottom:var(--spacing-md)}.charts-empty-state p{font-size:var(--text-md);color:var(--text-tertiary);margin-bottom:var(--spacing-lg);max-width:500px;margin-left:auto;margin-right:auto}.empty-state-small{text-align:center;padding:var(--spacing-xl);background:var(--bg-secondary);border-radius:var(--card-radius);color:var(--text-tertiary)}.empty-state-small p{font-size:var(--text-md);color:var(--text-secondary)}@keyframes bounceIn{0%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1.05)}70%{transform:scale(.9)}to{transform:scale(1)}}@media(max-width:768px){.hero-stats{grid-template-columns:repeat(2,1fr)}.hero-stat-card{flex-direction:column;text-align:center}.milestones-grid{grid-template-columns:repeat(3,1fr)}.phase-breakdown,.privacy-section{grid-template-columns:1fr}}@media(max-width:480px){.hero-stats{grid-template-columns:1fr}.milestones-grid{grid-template-columns:repeat(2,1fr)}}.toast-container{position:fixed;z-index:10000;display:flex;flex-direction:column;gap:var(--spacing-sm);pointer-events:none;max-width:500px;width:calc(100% - var(--spacing-xl))}.toast-container.toast-bottom-center{bottom:var(--spacing-lg);left:50%;transform:translate(-50%)}.toast-container.toast-top{top:var(--spacing-lg);left:50%;transform:translate(-50%)}.toast-container.toast-bottom{bottom:var(--spacing-lg);left:50%;transform:translate(-50%)}.toast{background:var(--glass-medium);backdrop-filter:blur(var(--blur-lg));-webkit-backdrop-filter:blur(var(--blur-lg));border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--spacing-md) var(--spacing-lg);box-shadow:var(--shadow-xl);display:flex;align-items:center;gap:var(--spacing-md);min-width:300px;pointer-events:all;opacity:0;transform:translateY(20px);transition:all var(--duration-normal) var(--easing-smooth)}.toast-show{opacity:1;transform:translateY(0)}.toast-hide{opacity:0;transform:translateY(20px)}.toast-success{border-left:4px solid var(--color-success);background:var(--glass-medium)}.toast-error{border-left:4px solid var(--color-error);background:var(--glass-medium)}.toast-warning{border-left:4px solid var(--color-warning);background:var(--glass-medium)}.toast-info{border-left:4px solid var(--color-info);background:var(--glass-medium)}[data-theme=dark] .toast{background:var(--glass-strong);border-color:var(--border-medium)}.toast-icon{font-size:var(--font-size-xl);flex-shrink:0;font-weight:var(--weight-bold);display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%}.toast-success .toast-icon{color:var(--color-success);background:var(--color-success-light)}.toast-error .toast-icon{color:var(--color-error);background:var(--color-error-light)}.toast-warning .toast-icon{color:var(--color-warning);background:var(--color-warning-light)}.toast-info .toast-icon{color:var(--color-info);background:var(--color-info-light)}.toast-message{flex:1;font-size:var(--font-size-md);color:var(--text-primary);line-height:var(--line-height-normal)}.toast-action{background:var(--accent-primary);color:#fff;border:none;border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-md);font-weight:var(--weight-semibold);font-size:var(--font-size-sm);cursor:pointer;transition:background var(--duration-fast);white-space:nowrap}.toast-action:hover{background:var(--accent-primary-dark)}.toast-action:active{transform:scale(.95)}.toast-close{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;font-size:var(--font-size-lg);padding:var(--spacing-xs);display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;transition:all var(--duration-fast);flex-shrink:0}.toast-close:hover{background:var(--surface-hover);color:var(--text-primary)}@media(max-width:480px){.toast-container{width:calc(100% - var(--spacing-md) * 2)}.toast{min-width:unset;padding:var(--spacing-sm) var(--spacing-md)}.toast-message{font-size:var(--font-size-sm)}}@keyframes toast-slide-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes toast-slide-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}.symptom-picker{display:grid;gap:2rem;padding:1rem 0}.symptom-category{display:flex;flex-direction:column;gap:1rem}.symptom-category h4{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-secondary);margin:0;display:flex;align-items:center;gap:.5rem}.symptom-category h4 .category-icon{font-size:1.25em}.flow-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.75rem}.flow-option{padding:1rem .75rem;border:2px solid var(--border-medium);border-radius:var(--radius-md);background:var(--surface);cursor:pointer;transition:all var(--duration-fast) var(--ease-smooth);text-align:center;font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);display:flex;flex-direction:column;align-items:center;gap:.5rem}.flow-option .flow-icon{font-size:1.5rem;transition:transform var(--duration-fast) var(--ease-smooth)}.flow-option:hover{border-color:var(--brand-primary);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.flow-option.selected{border-color:var(--brand-primary);background:var(--period-4);color:var(--text-primary);box-shadow:var(--shadow-pink-sm)}.flow-option.selected .flow-icon{transform:scale(1.1)}.mood-options{display:flex;justify-content:space-around;gap:.75rem;flex-wrap:wrap}.mood-option{width:64px;height:64px;font-size:2rem;border:2px solid var(--border-light);border-radius:var(--radius-full);background:var(--surface);cursor:pointer;transition:all var(--duration-normal) var(--ease-bounce);display:flex;align-items:center;justify-content:center;position:relative}.mood-option:hover{border-color:var(--brand-secondary);transform:scale(1.05);box-shadow:var(--shadow-sm)}.mood-option.selected{border-color:var(--brand-secondary);transform:scale(1.15);box-shadow:var(--shadow-purple-sm);background:linear-gradient(135deg,var(--fertile-low),var(--fertile-moderate))}.mood-option:after{content:attr(data-label);position:absolute;bottom:-1.75rem;left:50%;transform:translate(-50%);font-size:var(--text-xs);color:var(--text-tertiary);white-space:nowrap;opacity:0;transition:opacity var(--duration-fast) var(--ease-smooth);pointer-events:none}.mood-option:hover:after,.mood-option.selected:after{opacity:1}.symptom-pills{display:flex;flex-wrap:wrap;gap:.5rem}.symptom-pill{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1rem;border:2px solid var(--border-medium);border-radius:var(--radius-full);cursor:pointer;transition:all var(--duration-fast) var(--ease-smooth);background:var(--surface);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);-webkit-user-select:none;user-select:none}.symptom-pill input[type=checkbox]{display:none}.symptom-pill .symptom-icon{font-size:1.1em;transition:transform var(--duration-fast) var(--ease-smooth)}.symptom-pill:hover{border-color:var(--brand-primary);transform:translateY(-1px);box-shadow:var(--shadow-xs)}.symptom-pill:has(input:checked){background:var(--brand-tertiary);border-color:var(--brand-primary);color:var(--text-primary);font-weight:var(--weight-semibold);box-shadow:var(--shadow-sm)}.symptom-pill:has(input:checked) .symptom-icon{transform:scale(1.15)}.symptom-notes{display:flex;flex-direction:column;gap:.5rem}.symptom-notes label{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary)}.symptom-notes textarea{width:100%;min-height:80px;padding:.75rem;border:2px solid var(--border-medium);border-radius:var(--radius-md);background:var(--surface);color:var(--text-primary);font-family:var(--font-primary);font-size:var(--text-base);resize:vertical;transition:border-color var(--duration-fast) var(--ease-smooth)}.symptom-notes textarea:focus{outline:none;border-color:var(--brand-primary);box-shadow:var(--shadow-sm)}.symptom-notes textarea::placeholder{color:var(--text-tertiary)}@media(max-width:768px){.symptom-picker{gap:1.5rem}.flow-options{grid-template-columns:repeat(2,1fr)}.mood-option{width:56px;height:56px;font-size:1.75rem}.symptom-pills{gap:.4rem}.symptom-pill{padding:.5rem .875rem;font-size:var(--text-xs)}}@media(max-width:480px){.flow-options{grid-template-columns:1fr}.mood-options{justify-content:space-between}.mood-option{width:52px;height:52px;font-size:1.5rem}}@keyframes symptomPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.symptom-pill:has(input:checked):active{animation:symptomPulse .3s var(--ease-bounce)}.mood-option.selected{animation:symptomPulse .4s var(--ease-bounce)}#dashboard-view{max-width:1000px;margin:0 auto;padding:2rem 1rem}.dashboard-card{background:var(--surface);border-radius:var(--radius-2xl);padding:2rem;box-shadow:var(--shadow-md);border:2px solid var(--border-light);transition:all var(--duration-normal) var(--ease-smooth)}.dashboard-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.current-status{margin-bottom:2rem;text-align:center;background:linear-gradient(135deg,var(--bg-primary),var(--surface))}.current-status h2{font-size:var(--text-4xl);font-weight:var(--weight-bold);color:var(--text-primary);margin-bottom:.5rem;display:flex;align-items:center;justify-content:center;gap:.75rem}.phase-icon{font-size:1.2em}.current-phase{font-size:var(--text-2xl);font-weight:var(--weight-semibold);margin-bottom:1.5rem}.phase-progress{margin-top:1.5rem}.progress-bar{height:12px;background:var(--gray-200);border-radius:var(--radius-full);overflow:hidden;margin-bottom:.75rem}[data-theme=dark] .progress-bar{background:var(--gray-700)}.progress-fill{height:100%;border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-smooth);background:var(--gradient-lavender)}.progress-label{font-size:var(--text-sm);color:var(--text-tertiary)}.empty-message{color:var(--text-tertiary);font-size:var(--text-base);margin-top:.5rem}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{text-align:center;display:flex;flex-direction:column;gap:.75rem;position:relative;padding:1.75rem}.stat-icon{font-size:3rem;margin-bottom:.5rem;display:block}.stat-card h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-secondary);margin:0}.stat-value{font-size:var(--text-3xl);font-weight:var(--weight-bold);color:var(--text-primary);margin:0;background:var(--gradient-lavender);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-value.fertile-window{font-size:var(--text-lg)}.stat-date{font-size:var(--text-sm);color:var(--text-tertiary);margin:0}.confidence-badge{display:inline-block;padding:.25rem .75rem;background:var(--success-light);color:var(--success-dark);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-semibold);margin-top:.5rem}.dashboard-actions{margin-bottom:2rem;display:flex;justify-content:center}.dashboard-log-btn{display:flex;align-items:center;gap:.75rem;font-size:var(--text-lg);box-shadow:var(--shadow-pink-md)}.dashboard-log-btn:hover{box-shadow:var(--shadow-pink-lg);transform:translateY(-3px)}.dashboard-log-btn svg{width:24px;height:24px}.recent-activity{background:var(--bg-secondary)}.recent-activity h3{font-size:var(--text-xl);font-weight:var(--weight-bold);margin-bottom:1.5rem;color:var(--text-primary)}.activity-list{display:flex;flex-direction:column;gap:1rem}.activity-item{display:flex;flex-direction:column;gap:.25rem;padding:1rem;background:var(--surface);border-radius:var(--radius-md);border-left:4px solid var(--brand-primary)}.activity-date{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-primary)}.activity-symptoms{font-size:var(--text-sm);color:var(--text-secondary)}@media(max-width:768px){#dashboard-view{padding:1.5rem 1rem}.dashboard-grid{grid-template-columns:1fr;gap:1rem}.current-status h2{font-size:var(--text-3xl);flex-direction:column;gap:.5rem}.current-phase{font-size:var(--text-xl)}.stat-icon{font-size:2.5rem}.stat-value{font-size:var(--text-2xl)}}@media(max-width:480px){.dashboard-card{padding:1.5rem}.current-status h2{font-size:var(--text-2xl)}.dashboard-log-btn{width:100%;justify-content:center}}
