.tracker-page{background:#faf6f2}.tracker-main{width:min(1040px,88%);margin:0 auto;padding:42px 0 92px}.cycle-hero{--phase:#c58285;position:relative;overflow:hidden;min-height:340px;padding:52px 7%;background:linear-gradient(130deg,var(--phase),color-mix(in srgb,var(--phase) 70%,#fff));color:#fff;border-radius:4px;transition:background .5s ease}.cycle-hero .eyebrow{color:#fff;opacity:.84}.phase-menstrual{--phase:#c77d86}.phase-follicular{--phase:#91a88b}.phase-ovulatory{--phase:#d5a67d}.phase-luteal{--phase:#9d91ad}.cycle-hero:after{content:'♡';position:absolute;right:7%;top:-84px;font:350px/.95 var(--serif);color:#ffffff1a;transform:rotate(13deg)}.phase-kicker{font-size:10px;letter-spacing:.2em;font-weight:700;opacity:.85;margin:26px 0 5px}.cycle-hero h1{position:relative;z-index:1;font:500 clamp(43px,7vw,76px)/1.08 var(--serif);letter-spacing:-.04em;margin:0;max-width:700px}.phase-description{font:italic 17px/1.6 var(--serif);max-width:480px;margin:17px 0}.phase-day{font-size:12px;font-weight:600;letter-spacing:.06em;margin:16px 0 0}.phase-caveat{font-size:10px;opacity:.8;margin:21px 0 0}.phase-dots{position:absolute;right:9%;bottom:32px;display:flex;gap:8px}.phase-dots span{width:9px;height:9px;border:1px solid #ffffffbd;border-radius:50%}.phase-dots span:nth-child(2){width:26px;border-radius:99px;background:#fff}.cycle-summary{display:grid;grid-template-columns:repeat(3,1fr);background:#fffdfa;border:1px solid #eee4dc;margin:17px 0 34px}.cycle-summary>div{padding:22px 24px;display:flex;flex-direction:column;gap:5px}.cycle-summary>div+div{border-left:1px solid #eee4dc}.summary-label{font-size:9px;font-weight:700;letter-spacing:.14em;color:#9a8980}.cycle-summary strong{font:500 21px var(--serif);color:#39312d}.tracker-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}.tracker-panel{padding:30px;background:#fffdfa;border:1px solid #eee4dc}.tracker-panel h2{font:500 35px/1.15 var(--serif);margin:0 0 24px}.tracker-panel h2 em{color:var(--rose)}.tracker-form{display:grid;gap:15px}.tracker-form>label,.settings-content label{display:grid;gap:7px;color:#615650;font-size:12px;font-weight:600}.optional{color:#a3948d;font-size:10px;font-weight:400}.tracker-form input[type=date],.tracker-form textarea,.settings-content input{width:100%;padding:11px 12px;background:#fbf6f2;border:1px solid #e7dcd4;border-radius:2px;font:13px var(--sans);color:#342d29}.tracker-form textarea{resize:vertical;line-height:1.5}.tracker-button{display:inline-flex;justify-content:center;align-items:center;gap:20px;padding:12px 17px;background:#383531;border:0;border-radius:30px;color:#fff;font-size:11px;font-weight:600;cursor:pointer;transition:transform .2s,background .2s,box-shadow .2s}.tracker-button:hover{transform:translateY(-2px);background:#65544e;box-shadow:0 7px 17px #31221b20}.tracker-button span{color:#efc0bc}.history-heading{display:flex;align-items:center;justify-content:space-between;margin-top:30px;border-top:1px solid #eee4dc;padding-top:18px}.history-heading h3{font:500 18px var(--serif);margin:0}.small-link{border:0;background:none;color:#a06e67;font-size:10px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.period-list,.mood-list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}.period-list li,.mood-list li{padding:11px 12px;background:#faf4ef;font-size:12px;color:#665952;border-left:2px solid #d5a5a0}.mood-entry{display:flex;justify-content:space-between;gap:12px}.mood-entry em{font-style:normal;color:#9d6d68;font-weight:700}.mood-entry-note{display:block;margin-top:5px;color:#82766e;white-space:pre-wrap}.empty-state{list-style:none!important;color:#a3948d!important;font-style:italic;border-left-color:#ded3cc!important}.mood-choices{border:0;padding:0;margin:0;display:flex;justify-content:space-between;gap:6px;flex-wrap:wrap}.mood-choices legend{font-size:12px;font-weight:600;color:#615650;margin-bottom:8px}.mood-choices label{min-width:48px;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 5px;border:1px solid #eee2db;background:#fcf8f5;cursor:pointer;transition:border .2s,background .2s}.mood-choices label:has(input:checked){border-color:#c98783;background:#f6e7e3}.mood-choices input{position:absolute;opacity:0;pointer-events:none}.mood-choices label:focus-within{outline:2px solid #be817b;outline-offset:2px}.mood-choices label span{font:23px var(--serif);color:#a97973}.mood-choices label small{font-size:9px;color:#766a63}.tracker-settings{margin-top:22px;border:1px solid #e9ded7;background:#fffdfa}.tracker-settings summary{padding:17px 20px;font:500 17px var(--serif);cursor:pointer}.settings-content{padding:0 20px 20px;display:flex;gap:14px;align-items:end;flex-wrap:wrap}.settings-content label{flex:1;min-width:160px}.settings-content input{padding:9px}.settings-content .tracker-button{height:37px}.settings-content p{flex-basis:100%;font-size:11px;line-height:1.7;color:#877970;margin:3px 0 0}.tracker-privacy-note{text-align:center;color:#978980;font-size:10px;margin:20px 0 0}.tracker-page footer{background:#302f2c}.tracker-page .topbar{position:relative}.tracker-page .brand span{font-style:italic}
@media(max-width:760px){.tracker-main{width:90%;padding:25px 0 65px}.cycle-hero{min-height:305px;padding:34px 7%}.cycle-hero:after{font-size:230px;right:0;top:-45px}.cycle-hero h1{font-size:clamp(41px,11vw,60px)}.phase-description{font-size:15px;max-width:83%}.cycle-summary{grid-template-columns:1fr;margin-bottom:22px}.cycle-summary>div{padding:13px 17px;flex-direction:row;align-items:center;justify-content:space-between}.cycle-summary>div+div{border-left:0;border-top:1px solid #eee4dc}.cycle-summary strong{font-size:17px}.tracker-grid{grid-template-columns:1fr;gap:13px}.tracker-panel{padding:23px 19px}.tracker-panel h2{font-size:31px}.phase-dots{right:8%;bottom:26px}.tracker-back{padding:8px 12px}}
@media(prefers-reduced-motion:reduce){.cycle-hero,.tracker-button,.mood-choices label{transition:none}}
.tracker-auth{width:min(520px,90%);margin:58px auto 100px}.auth-card{background:#fffdfa;border:1px solid #eee4dc;padding:36px;box-shadow:0 16px 40px #5940340d}.auth-card h1{font:500 clamp(34px,6vw,48px)/1.1 var(--serif);margin:0 0 12px}.auth-copy{color:#83766f;font-size:13px;line-height:1.7}.auth-form{display:grid;gap:15px;margin-top:22px}.auth-form[hidden]{display:none}.auth-form label{display:grid;gap:7px;color:#615650;font-size:12px;font-weight:600}.auth-form input{width:100%;padding:12px;background:#fbf6f2;border:1px solid #e7dcd4;border-radius:2px;font:14px var(--sans)}.auth-feedback{min-height:1.5em;color:#9a6d68;font-size:11px;line-height:1.6}.tracker-auth[hidden]{display:none}.tracker-main[hidden]{display:none}.tracker-top-actions{display:flex;align-items:center;gap:17px}.flow-form{margin-top:27px;padding-top:21px;border-top:1px solid #eee4dc}.flow-label{font:500 18px var(--serif);margin:0}.flow-choices{display:flex;gap:6px;flex-wrap:wrap;border:0;margin:0;padding:0}.flow-choices legend{font-size:12px;font-weight:600;color:#615650;margin-bottom:8px}.flow-choices label{cursor:pointer}.flow-choices input{position:absolute;opacity:0}.flow-choices label span{display:block;padding:8px 10px;border:1px solid #eee2db;background:#fcf8f5;color:#756963;font-size:10px;transition:background .2s,border-color .2s}.flow-choices label:has(input:checked) span{background:#f2e1dc;border-color:#c98783;color:#754e4a}.flow-choices label:focus-within span{outline:2px solid #be817b;outline-offset:2px}.flow-entry{display:flex;justify-content:space-between;gap:12px}.flow-entry span{color:#9d6d68;font-weight:700}.tracker-page .tracker-panel h2{margin-bottom:24px}
@media(max-width:760px){.tracker-auth{margin:36px auto 65px}.auth-card{padding:25px 20px}.tracker-top-actions{gap:10px}.flow-choices label span{padding:8px}}
.passcode-change{flex-basis:100%;border-top:1px solid #eee4dc;margin-top:15px;padding-top:18px}.passcode-change h3{font:500 19px var(--serif);margin:0 0 13px}.passcode-feedback{font-size:11px;color:#9a6d68;margin:0}