.ovul-calculator{--ovul-primary: #10b981;--ovul-secondary: #34d399;--ovul-accent: #6ee7b7;--ovul-dark: #065f46;--ovul-light: #ecfdf5;--ovul-gradient: linear-gradient(135deg, #10b981 0%, #059669 50%, #047857 100%);--ovul-card-bg: #ffffff;--ovul-border: #e5e7eb;--ovul-text: #1f2937;--ovul-text-muted: #6b7280;--ovul-peak: #f59e0b;--ovul-period: #ef4444;max-width:900px;margin:0 auto;font-family:system-ui,-apple-system,sans-serif}.ovul-header{text-align:center;margin-bottom:2rem;padding:2rem;background:var(--ovul-gradient);border-radius:20px;color:#fff;position:relative;overflow:hidden}.ovul-header:before{content:"🥚";position:absolute;font-size:8rem;opacity:.1;right:-1rem;top:50%;transform:translateY(-50%)}.ovul-title{font-size:2rem;font-weight:800;margin:0 0 .5rem;position:relative}.ovul-description{font-size:1.1rem;opacity:.95;margin:0;position:relative}.ovul-formula-container{background:var(--ovul-card-bg);border-radius:16px;padding:1.5rem;margin-bottom:2rem;box-shadow:0 4px 20px #10b9811a;border:1px solid var(--ovul-border)}.ovul-formula-title{font-size:1.1rem;font-weight:700;color:var(--ovul-dark);margin:0 0 1rem;text-align:center}.ovul-formula-grid{display:grid;grid-template-columns:1fr;gap:1rem}.ovul-formula-card{background:linear-gradient(135deg,#ecfdf5,#d1fae5);border-radius:12px;padding:1.25rem;text-align:center}.ovul-formula-label{font-size:.875rem;font-weight:600;color:var(--ovul-primary);margin:0 0 .75rem;text-transform:uppercase}.ovul-formula-display{min-height:3rem;display:flex;align-items:center;justify-content:center;overflow-x:auto}.ovul-form-container{background:var(--ovul-card-bg);border-radius:16px;padding:1.5rem;margin-bottom:2rem;box-shadow:0 4px 20px #10b9811a;border:1px solid var(--ovul-border)}.ovul-form{display:flex;flex-direction:column;gap:1.25rem}.ovul-input-group{display:flex;flex-direction:column;gap:.5rem}.ovul-label{font-weight:600;font-size:.9rem;color:var(--ovul-text)}.ovul-input{padding:.875rem 1rem;border:2px solid var(--ovul-border);border-radius:10px;font-size:1rem;transition:all .2s ease;background:#fff}.ovul-input:focus{outline:none;border-color:var(--ovul-primary);box-shadow:0 0 0 4px #10b9811a}.ovul-input-with-unit{display:flex;align-items:center;gap:.5rem}.ovul-input-with-unit .ovul-input{flex:1}.ovul-input-unit{font-weight:600;color:var(--ovul-text-muted)}.ovul-input-note{font-size:.75rem;color:var(--ovul-text-muted);font-style:italic}.ovul-buttons{display:grid;grid-template-columns:2fr 1fr;gap:.75rem;margin-top:.5rem}.ovul-calculate-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem;background:var(--ovul-gradient);color:#fff;border:none;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;box-shadow:0 4px 15px #10b9814d}.ovul-calculate-btn:hover{transform:translateY(-2px)}.ovul-btn-icon{font-size:1.25rem}.ovul-reset-btn{padding:1rem;background:var(--ovul-light);color:var(--ovul-primary);border:none;border-radius:12px;font-weight:600;cursor:pointer}.ovul-results{background:var(--ovul-card-bg);border-radius:16px;padding:1.5rem;margin-bottom:2rem;box-shadow:0 4px 20px #10b9811a;border:1px solid var(--ovul-border)}.ovul-results.hidden{display:none}.ovul-results-title{font-size:1.25rem;font-weight:700;color:var(--ovul-dark);margin:0 0 1.25rem;text-align:center}.ovul-main-result{display:flex;align-items:center;justify-content:center;gap:1rem;background:var(--ovul-gradient);border-radius:16px;padding:1.5rem;color:#fff;margin-bottom:1.5rem}.ovul-main-icon{font-size:3rem}.ovul-main-content{display:flex;flex-direction:column;gap:.25rem}.ovul-main-label{font-size:.85rem;opacity:.9;text-transform:uppercase}.ovul-main-value{font-size:1.25rem;font-weight:700}.ovul-fertile-window{background:linear-gradient(135deg,#fef3c7,#fde68a);border-radius:12px;padding:1.25rem;margin-bottom:1.5rem;text-align:center}.ovul-window-title{font-size:.9rem;font-weight:700;color:#92400e;margin:0 0 .75rem}.ovul-window-range{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:.5rem}.ovul-window-start,.ovul-window-end{font-size:1.1rem;font-weight:700;color:#78350f}.ovul-window-arrow{color:#a16207}.ovul-window-peak{font-size:.85rem;color:#92400e}.ovul-peak-label{font-weight:600}.ovul-peak-dates{font-weight:700}.ovul-calendar{margin-bottom:1.5rem}.ovul-calendar-header{display:grid;grid-template-columns:repeat(7,1fr);gap:.25rem;text-align:center;font-size:.7rem;font-weight:600;color:var(--ovul-text-muted);margin-bottom:.5rem}.ovul-calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.25rem}.ovul-calendar-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f9fafb;border-radius:8px;font-size:.8rem;position:relative}.ovul-calendar-day.period{background:#fee2e2}.ovul-calendar-day.high{background:#d1fae5}.ovul-calendar-day.peak{background:#fef3c7}.ovul-calendar-day.ovulation{background:var(--ovul-primary);color:#fff}.ovul-calendar-day.today{border:2px solid var(--ovul-dark)}.ovul-day-num{font-weight:600}.ovul-day-icon{font-size:.6rem;position:absolute;bottom:2px}.ovul-calendar-legend{display:flex;justify-content:center;gap:1rem;margin-top:.75rem;flex-wrap:wrap}.ovul-legend-item{font-size:.7rem;padding:.25rem .5rem;border-radius:4px}.ovul-legend-item.period{background:#fee2e2;color:#991b1b}.ovul-legend-item.high{background:#d1fae5;color:#065f46}.ovul-legend-item.peak{background:#fef3c7;color:#92400e}.ovul-legend-item.ovulation{background:var(--ovul-primary);color:#fff}.ovul-key-dates{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.ovul-key-date{display:flex;flex-direction:column;align-items:center;gap:.25rem;background:#f9fafb;border-radius:12px;padding:1rem;text-align:center}.ovul-key-icon{font-size:1.5rem}.ovul-key-label{font-size:.7rem;font-weight:600;color:var(--ovul-text-muted);text-transform:uppercase}.ovul-key-value{font-size:1rem;font-weight:700;color:var(--ovul-dark)}.ovul-content{margin-top:3rem}.ovul-section{margin-bottom:2.5rem}.ovul-section-title{font-size:1.5rem;font-weight:800;color:var(--ovul-dark);margin:0 0 1rem;padding-bottom:.5rem;border-bottom:3px solid var(--ovul-accent)}.ovul-paragraph{color:var(--ovul-text);line-height:1.7;margin-bottom:1rem}.ovul-features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1.5rem}.ovul-feature-card{background:var(--ovul-card-bg);border-radius:12px;padding:1.25rem;text-align:center;border:1px solid var(--ovul-border)}.ovul-feature-icon{font-size:2rem;display:block;margin-bottom:.75rem}.ovul-feature-title{font-size:1rem;font-weight:700;color:var(--ovul-dark);margin:0 0 .5rem}.ovul-feature-description{font-size:.875rem;color:var(--ovul-text-muted);margin:0}.ovul-tips-list{display:flex;flex-direction:column;gap:1rem;margin-top:1.5rem}.ovul-tip-card{display:flex;gap:1rem;background:var(--ovul-card-bg);border-radius:12px;padding:1.25rem;border:1px solid var(--ovul-border)}.ovul-tip-icon{font-size:1.5rem;flex-shrink:0}.ovul-tip-content{flex:1}.ovul-tip-title{font-size:1rem;font-weight:700;color:var(--ovul-dark);margin:0 0 .375rem}.ovul-tip-text{font-size:.9rem;color:var(--ovul-text-muted);margin:0;line-height:1.6}.ovul-table-wrapper{overflow-x:auto;margin-top:1.5rem;border-radius:12px;border:1px solid var(--ovul-border)}.ovul-table{width:100%;border-collapse:collapse;font-size:.85rem}.ovul-table th{background:var(--ovul-light);padding:.875rem .75rem;text-align:left;font-weight:700;color:var(--ovul-dark)}.ovul-table td{padding:.875rem .75rem;border-bottom:1px solid var(--ovul-border)}.ovul-table-row.advanced{background:#10b9810d}.ovul-faq-list{display:flex;flex-direction:column;gap:.75rem;margin-top:1.5rem}.ovul-faq-item{background:var(--ovul-card-bg);border-radius:12px;border:1px solid var(--ovul-border);overflow:hidden}.ovul-faq-question{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;cursor:pointer;font-weight:600;color:var(--ovul-dark);list-style:none}.ovul-faq-question::-webkit-details-marker{display:none}.ovul-faq-icon{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;background:var(--ovul-gradient);color:#fff;border-radius:6px;font-size:.75rem;font-weight:800}.ovul-faq-item[open] .ovul-faq-question{border-bottom:1px solid var(--ovul-border)}.ovul-faq-answer{padding:1rem 1.25rem;background:#fafafa}.ovul-faq-answer p{margin:0;line-height:1.7}@media (max-width: 768px){.ovul-title{font-size:1.5rem}.ovul-features-grid,.ovul-key-dates,.ovul-buttons{grid-template-columns:1fr}}.hidden{display:none!important}