:root{color:#3d3038;font-synthesis:none;text-rendering:optimizelegibility;--pink:#dca1be;--mint:#a1dcbf;--milk:#fff8fb;--white:#fff;--ink:#3d3038;--muted:#8b6f7c;--line:#7e6872;--soft-pink:#fdebf4;--soft-mint:#eafaf2;background:#fff8fb;font-family:MS Sans Serif,Tahoma,Geneva,Verdana,sans-serif}*{box-sizing:border-box}body{background:linear-gradient(90deg, #dca1be2e 1px, transparent 1px), linear-gradient(#a1dcbf2e 1px, transparent 1px), radial-gradient(circle at 12% 16%, #dca1be52, transparent 18rem), radial-gradient(circle at 88% 8%, #a1dcbf57, transparent 20rem), var(--milk);background-size:24px 24px,24px 24px,auto,auto,auto;min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}.page{width:min(1180px,100% - 32px);margin:0 auto;padding:32px 0 48px;position:relative}.page:before,.page:after,.hero:after{z-index:-1;content:"";background:var(--pink);width:8px;height:8px;image-rendering:pixelated;box-shadow:8px 0 var(--pink), 16px 0 #c97eaa, -8px 8px var(--pink), 0 8px #e7b5cc, 8px 8px var(--pink), 16px 8px #c97eaa, 24px 8px #c97eaa, -8px 16px #d68db4, 0 16px var(--pink), 8px 16px #e7b5cc, 16px 16px var(--pink), 24px 16px #c97eaa, 0 24px #c97eaa, 8px 24px var(--pink), 16px 24px #d68db4, 8px -8px var(--mint), 16px -8px var(--mint), 24px -8px #73bd99;position:absolute}.page:before{top:88px;right:40px}.page:after{bottom:92px;right:110px;transform:scale(.72)rotate(-8deg)}.hero{border:2px solid var(--line);background:linear-gradient(180deg, var(--white), var(--soft-pink));box-shadow:5px 5px 0 var(--pink), 9px 9px 0 var(--mint);gap:12px;margin-bottom:24px;padding:18px 142px 18px 20px;display:grid;position:relative}.hero:before{content:"";border-bottom:2px solid var(--line);background:repeating-linear-gradient(90deg, var(--pink) 0 12px, var(--mint) 12px 24px, var(--white) 24px 36px);height:12px;position:absolute;top:0;left:0;right:0}.hero:after{top:38px;right:48px;transform:scale(1.5)rotate(4deg)}.eyebrow{color:#8e4e72;letter-spacing:.12em;text-transform:uppercase;margin:0;font-size:13px;font-weight:800}h1{max-width:780px;color:var(--ink);text-shadow:2px 2px 0 var(--white), 4px 4px 0 #dca1be85;margin:0;font-size:clamp(30px,5vw,58px);line-height:1}.hero-note{color:#6c5260;max-width:780px;margin:0;font-size:16px;line-height:1.6}.page-nav{flex-wrap:wrap;gap:10px;margin-bottom:18px;display:flex}.nav-link{border:2px solid var(--line);color:var(--ink);background:var(--white);text-transform:uppercase;padding:10px 14px;font-weight:900;text-decoration:none;box-shadow:3px 3px #dca1beb8}.nav-link:hover,.nav-link.is-active{background:linear-gradient(135deg, var(--soft-pink), var(--soft-mint));box-shadow:3px 3px 0 var(--pink), 6px 6px 0 var(--mint)}.panel{border:2px solid var(--line);background:var(--white);box-shadow:4px 4px 0 var(--pink), 7px 7px 0 #a1dcbfe0;border-radius:0;position:relative}.panel:before{content:"";border-bottom:2px solid var(--line);background:repeating-linear-gradient(90deg, var(--pink) 0 10px, var(--white) 10px 20px, var(--mint) 20px 30px);height:10px;position:absolute;top:0;left:0;right:0}.controls{background:linear-gradient(180deg, var(--white), #fff2f8);grid-template-columns:minmax(120px,.5fr) auto;gap:16px;margin-bottom:18px;padding:28px 18px 18px;display:grid}.field{color:#704b5f;gap:8px;font-size:13px;font-weight:800;display:grid}.field-label{color:#704b5f;margin-bottom:4px;font-size:13px;font-weight:800;display:block}.field input,.field select{width:100%;color:var(--ink);background:var(--white);border:2px inset #f2c5da;border-radius:0;outline:none;padding:11px 12px;box-shadow:inset 2px 2px #f7d8e7}.field input:focus,.field select:focus{border-color:var(--pink);box-shadow:inset 2px 2px #f7d8e7,0 0 0 3px #a1dcbfb8}.primary-button{border:2px solid var(--line);color:var(--ink);background:linear-gradient(135deg, var(--pink), #f5cddd 48%, var(--mint));cursor:pointer;text-transform:uppercase;border-radius:0;align-self:end;padding:12px 18px;font-weight:900;box-shadow:4px 4px #8e4e72,7px 7px #a1dcbfe6}.primary-button:hover:not(:disabled){background:linear-gradient(135deg, var(--mint), #fff 48%, var(--pink))}.primary-button:active:not(:disabled){transform:translate(3px,3px);box-shadow:1px 1px #8e4e72,3px 3px #a1dcbfe6}.primary-button:disabled{cursor:wait;opacity:.6}.status-line{color:#b95079;min-height:24px;margin:0 0 16px;font-weight:700}.notice-line{color:#5b8b70}.metric-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px;display:grid}.metric-card{background:linear-gradient(180deg, var(--white), var(--soft-mint));padding:28px 18px 18px}.metric-card strong{color:#8e4e72;text-shadow:2px 2px 0 var(--white), 3px 3px 0 #a1dcbfdb;margin-bottom:6px;font-size:26px;display:block}.metric-card span{color:#6c5260}.cycle-controls{grid-template-columns:minmax(120px,.5fr) minmax(120px,.5fr) auto}.calendar-layout{grid-template-columns:minmax(0,1fr) minmax(320px,.42fr);align-items:start;gap:18px;display:grid}.cycle-month-shell{background:linear-gradient(180deg, var(--white), #fff7fb 62%, var(--soft-mint));padding:28px 18px 18px}.cycle-month-nav{grid-template-columns:52px 1fr 52px;align-items:center;gap:12px;margin-bottom:10px;display:grid}.cycle-month-nav h1{text-align:center;text-transform:capitalize;max-width:none;margin:0;font-size:clamp(24px,5vw,42px)}.cycle-month-nav .eyebrow{text-align:center}.cycle-month-nav button{border:2px solid var(--line);color:var(--ink);background:linear-gradient(135deg, var(--soft-pink), var(--white), var(--soft-mint));cursor:pointer;width:52px;height:44px;box-shadow:3px 3px 0 var(--pink), 5px 5px 0 #a1dcbfdb;font-size:24px;font-weight:900}.cycle-month-nav button:hover:not(:disabled){background:linear-gradient(135deg, var(--mint), var(--white), var(--pink))}.cycle-month-nav button:disabled{cursor:not-allowed;opacity:.42}.cycle-forecast-note{color:#6c5260;background:#ffffffb3;border:2px dashed #d9b2c5;margin:0 0 12px;padding:8px 10px;font-size:12px;font-weight:800;line-height:1.45}.cycle-legend{flex-wrap:wrap;gap:10px;margin-bottom:18px;display:flex}.cycle-legend span{background:var(--white);color:#704b5f;border:2px solid #b98aa1;align-items:center;gap:8px;padding:8px 10px;font-size:13px;font-weight:800;display:inline-flex;box-shadow:3px 3px #dca1be6b}.legend-swatch{border:2px solid var(--line);width:16px;height:16px}.legend-swatch.observed{background:var(--pink)}.legend-swatch.predicted{background:repeating-linear-gradient(135deg, #fff0f7 0 5px, var(--pink) 5px 10px)}.legend-swatch.ovulation{background:var(--mint)}.legend-swatch.spotting{background:var(--white);position:relative}.legend-swatch.spotting:after{content:"";background:#8e4e72;width:6px;height:6px;position:absolute;top:3px;right:3px;box-shadow:3px 3px #dca1beb3}.legend-swatch.today{background:var(--white);box-shadow:inset 0 0 0 3px #8e4e72}.cycle-calendar-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;display:grid}.cycle-month{padding:4px 0 0}.cycle-weekdays,.cycle-days{grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;display:grid}.cycle-weekdays{margin-bottom:6px}.cycle-weekdays span{color:#8e4e72;text-align:center;font-size:12px;font-weight:900}.cycle-day{appearance:none;background:var(--white);width:100%;min-height:54px;color:var(--ink);font:inherit;text-align:left;cursor:pointer;border:2px solid #d9b2c5;border-radius:0;align-content:start;gap:2px;padding:6px;display:grid;position:relative;box-shadow:2px 2px #dca1be5c}.cycle-day-empty{cursor:default;box-shadow:none;background:0 0;border-color:#0000}.cycle-day:hover:not(.cycle-day-empty){z-index:1;border-color:#8e4e72;transform:translate(-1px,-1px);box-shadow:3px 3px #dca1bebd,5px 5px #a1dcbf8a}.cycle-day:focus-visible{outline:3px solid var(--mint);outline-offset:2px}.cycle-day strong{font-size:13px}.cycle-day small{color:#704b5f;font-size:10px;font-weight:800}.cycle-day em{color:#8e4e72;text-overflow:ellipsis;white-space:nowrap;font-size:9px;font-style:normal;font-weight:900;overflow:hidden}.cycle-day.is-observed-period{background:linear-gradient(180deg, #f7c9de, var(--pink));border-color:#8e4e72;box-shadow:2px 2px #8e4e72}.cycle-day.is-predicted-period{background:repeating-linear-gradient(135deg,#fff0f7 0 6px,#f4c2d9 6px 12px);border-color:#c97eaa}.cycle-day.is-ovulation-window{background:linear-gradient(180deg, var(--white), var(--soft-mint));border-color:#73bd99}.cycle-day.is-ovulation-day:after{content:"";background:var(--mint);width:8px;height:8px;box-shadow:0 0 0 2px var(--line), 3px 3px 0 #73bd99b3;position:absolute;bottom:5px;right:5px}.cycle-day.is-spotting:before{content:"";border:1px solid var(--white);background:#8e4e72;width:7px;height:7px;position:absolute;top:5px;right:5px;box-shadow:0 0 0 1px #8e4e72,2px 2px #dca1beb8}.cycle-day.has-cycle-events:not(.is-observed-period):not(.is-predicted-period):not(.is-ovulation-window){background:linear-gradient(180deg, var(--white), #fff2f8);border-color:#c97eaa}.cycle-day.is-today{outline-offset:-5px;outline:3px solid #8e4e72}.cycle-day.is-selected{z-index:2;border-color:var(--line);outline:3px solid var(--mint);outline-offset:-5px;box-shadow:3px 3px #8e4e72,6px 6px #a1dcbfe6}.day-summary-panel{background:linear-gradient(180deg, var(--white), #fff8fb 58%, #f4fff9);gap:14px;padding:28px 16px 16px;display:grid;position:sticky;top:16px}.day-summary-header{gap:6px;display:grid}.day-summary-header h2{color:var(--ink);text-transform:capitalize;text-shadow:2px 2px 0 var(--white), 3px 3px 0 #a1dcbfbd;margin:0;font-size:clamp(22px,4vw,32px);line-height:1}.day-summary-count{background:var(--white);color:#704b5f;border:2px solid #b98aa1;width:fit-content;padding:5px 8px;font-size:12px;font-weight:900;box-shadow:2px 2px #dca1be6b}.day-summary-overview{background:#ffffffb8;border:2px dashed #b98aa1;padding:10px}.day-summary-overview strong{color:#8e4e72;text-transform:uppercase;margin-bottom:4px;font-size:13px;display:block}.day-summary-overview p,.food-summary-text,.summary-empty-text{color:#6c5260;margin:0;font-size:13px;line-height:1.45}.summary-category-list{gap:12px;display:grid}.summary-category-card{border:2px solid var(--line);background:var(--white);gap:10px;padding:12px;display:grid;box-shadow:3px 3px #dca1be6b}.summary-category-cycle{background:linear-gradient(#fff8fb,#ffe4f0);border-color:#8e4e72;box-shadow:3px 3px #8e4e729e}.summary-category-food{background:linear-gradient(180deg, #fbfffd, var(--soft-mint));border-color:#73bd99;box-shadow:3px 3px #73bd999e}.summary-category-symptom{background:linear-gradient(#fffaf1,#ffeac7);border-color:#c48a52;box-shadow:3px 3px #c48a5270}.summary-category-other{background:linear-gradient(180deg, var(--white), #f7eef4);border-color:#8b6f7c}.summary-category-header{justify-content:space-between;align-items:start;gap:10px;display:flex}.summary-category-header strong{color:var(--ink);font-size:16px}.summary-category-header span{color:#704b5f;white-space:nowrap;background:#ffffffb8;border:2px solid #7e687280;padding:3px 6px;font-size:11px;font-weight:900}.summary-chip-list{flex-wrap:wrap;gap:7px;display:flex}.summary-chip{background:var(--white);max-width:100%;color:var(--ink);text-overflow:ellipsis;white-space:nowrap;border:2px solid #7e687294;padding:5px 7px;font-size:12px;font-weight:800;overflow:hidden;box-shadow:2px 2px #ffffffd1}.summary-chip.is-muted{color:#8b6f7c;opacity:.72;background:#ffffff94}.food-progress-list{gap:9px;display:grid}.food-progress-row{background:#ffffffbd;border:2px solid #73bd99b8;gap:5px;padding:8px;display:grid;box-shadow:2px 2px #73bd9952}.food-progress-row.is-complete{background:linear-gradient(#ffffffdb,#f0fff7);border-color:#73bd99}.food-progress-row.has-no-goal{border-color:#7e687270}.food-progress-topline,.food-progress-meta{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.food-progress-topline strong{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.food-progress-topline span{color:#704b5f;white-space:nowrap;font-size:12px;font-weight:900}.food-progress-track{border:2px solid var(--line);background:repeating-linear-gradient(90deg,#fffc 0 8px,#a1dcbf3d 8px 16px);height:12px;overflow:hidden;box-shadow:inset 2px 2px #7e68721f}.food-progress-track span{background:linear-gradient(90deg, var(--mint), #73bd99);height:100%;display:block;box-shadow:inset -2px 0 #3d303829}.food-progress-row.is-complete .food-progress-track span{background:linear-gradient(90deg, var(--pink), var(--mint))}.food-progress-row.has-no-goal .food-progress-track span{background:linear-gradient(90deg,#d9b2c5,#b98aa1)}.food-progress-meta{color:#6c5260;text-transform:uppercase;font-size:10px;font-weight:900}.selectors{margin-bottom:18px;display:grid}.metric-picker{background:linear-gradient(180deg, var(--white), #fff2f8);gap:16px;padding:28px 18px 18px;display:grid}.metric-picker-header{justify-content:space-between;align-items:start;gap:16px;display:flex}.metric-picker-header strong{color:var(--ink);font-size:18px}.metric-picker-header span{color:var(--muted);font-size:13px}.metric-search{max-width:560px}.metric-category-list{scrollbar-color:var(--pink) var(--soft-pink);gap:12px;max-height:440px;padding:4px 8px 8px 4px;display:grid;overflow:auto}.metric-category{background:#ffffffd1;border:2px solid #b98aa1;box-shadow:3px 3px #dca1be80}.metric-category[open]{background:linear-gradient(180deg, var(--white), #fff7fb);box-shadow:3px 3px #dca1bea8,5px 5px #a1dcbf94}.metric-category-summary{cursor:pointer;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;list-style:none;display:flex}.metric-category-summary::-webkit-details-marker{display:none}.metric-category-summary:before{border:2px solid var(--line);color:#8e4e72;content:"+";background:var(--soft-pink);flex:0 0 22px;place-items:center;width:22px;height:22px;font-weight:900;display:inline-grid;box-shadow:2px 2px #a1dcbfb8}.metric-category[open] .metric-category-summary:before{content:"-";background:var(--soft-mint)}.metric-category-summary strong{color:var(--ink);flex:1;font-size:15px}.metric-category-count{color:var(--muted);text-align:right;font-size:12px;font-weight:800}.metric-category .metric-option-list{border-top:2px dashed #e7b5cc;max-height:none;padding:12px;overflow:visible}.metric-option-list{scrollbar-color:var(--pink) var(--soft-pink);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;max-height:330px;padding:4px 8px 8px 4px;display:grid;overflow:auto}.metric-option{background:var(--white);cursor:pointer;border:2px solid #b98aa1;border-radius:0;align-items:flex-start;gap:10px;padding:12px;display:flex;box-shadow:3px 3px #dca1be9e}.metric-option:hover:not(.is-disabled){box-shadow:3px 3px 0 var(--pink), 5px 5px 0 #a1dcbfcc;background:#fff4f9}.metric-option.is-disabled{cursor:not-allowed;opacity:.48}.metric-option.is-selected{background:linear-gradient(135deg, #fff8fb, var(--soft-mint));box-shadow:3px 3px 0 var(--pink), 6px 6px 0 var(--mint);border-color:#8e4e72}.metric-option input{width:auto;accent-color:var(--pink);margin-top:4px}.metric-option strong{color:var(--ink);font-size:14px;display:block}.metric-option small{color:var(--muted);margin-top:4px;display:block}.chart-stack{gap:18px;display:grid}.chart-panel{background:linear-gradient(180deg, var(--white), #fff7fb 62%, var(--soft-mint));min-height:500px;padding:28px 18px 18px}.chart-title{justify-content:space-between;gap:16px;margin-bottom:10px;display:flex}.chart-title h2{color:var(--ink);text-shadow:2px 2px 0 var(--white), 3px 3px 0 #dca1be8f;margin:0;font-size:18px}.chart-title span{color:var(--muted);font-size:13px}.chart-toolbar{color:#704b5f;justify-content:space-between;align-items:center;gap:14px;margin-bottom:8px;font-size:13px;display:flex}.chart-offset-control{grid-template-columns:auto minmax(140px,220px) 52px;align-items:center;gap:10px;font-weight:800;display:grid}.chart-offset-control input{accent-color:var(--pink)}.chart-offset-control strong{color:#8e4e72;text-align:right}.chart-offset-note{color:var(--muted);text-align:right}.empty-state{min-height:220px;color:var(--muted);text-align:center;place-items:center;display:grid}.compact-empty{min-height:120px}@media (width<=760px){.page{width:min(100% - 20px,1180px);padding-top:20px}.page:before,.page:after,.hero:after{display:none}.hero{padding:18px 14px}.controls,.cycle-controls,.calendar-layout,.selectors,.metric-grid,.cycle-calendar-grid{grid-template-columns:1fr}.cycle-month-shell{padding:24px 10px 12px}.cycle-month-nav{grid-template-columns:42px 1fr 42px;gap:8px}.cycle-month-nav button{width:42px;height:40px}.cycle-month-nav h1{font-size:clamp(22px,7vw,32px)}.cycle-legend{gap:8px}.cycle-legend span{padding:7px 8px;font-size:12px}.cycle-day{min-height:48px;padding:5px}.day-summary-panel{position:static}.summary-category-header,.metric-picker-header{display:grid}.metric-category-list{max-height:520px}.metric-category-summary{align-items:start}.metric-category-count{text-align:left}.chart-panel{min-height:440px}.chart-toolbar,.chart-offset-control{grid-template-columns:1fr;display:grid}.chart-offset-control strong,.chart-offset-note{text-align:left}}
