:root{--bg1:#fff1f6;--bg2:#f3e9ff;--fg:#3a1b2b;--card:#fff9fb;--muted:#8a6b7a;--acc:#d6336c;--acc-d:#a8124d;--acc2:#ffe3ee;--per:#ec4c84;--fer:#3cbfae;--fer-l:#d9f6f1;--ov:#1f9e8f;--bd:rgba(214,51,108,.10);
--sh:12px 14px 30px rgba(170,60,110,.16),-10px -10px 24px rgba(255,255,255,.95),inset 2px 2px 3px rgba(255,255,255,.9),inset -4px -6px 10px rgba(214,51,108,.06);
--sh-s:6px 8px 16px rgba(170,60,110,.18),-6px -6px 14px rgba(255,255,255,.9),inset 1px 1px 2px rgba(255,255,255,.9);--sh-in:inset 4px 5px 10px rgba(170,60,110,.14),inset -4px -4px 10px rgba(255,255,255,.9)}
[data-theme=lavender]{--bg1:#f5f1ff;--bg2:#ece6ff;--acc:#7a5bd0;--acc-d:#5a3db0;--acc2:#ebe4ff;--per:#9b6cf0}
[data-theme=teal]{--bg1:#eefbf8;--bg2:#e6f4ff;--acc:#16867a;--acc-d:#0d655c;--acc2:#d6f2ee;--per:#e0577a}
[data-theme=dark]{--bg1:#1d1622;--bg2:#241a2c;--fg:#f7eaf1;--card:#2a2131;--muted:#c0a9b6;--acc:#f06a9b;--acc-d:#ff8db5;--acc2:#3d2a39;--fer-l:#1f4642;
--sh:10px 12px 26px rgba(0,0,0,.45),-6px -6px 18px rgba(255,255,255,.04),inset 1px 1px 2px rgba(255,255,255,.06);--sh-s:5px 6px 14px rgba(0,0,0,.45),inset 1px 1px 2px rgba(255,255,255,.06);--sh-in:inset 3px 4px 8px rgba(0,0,0,.5)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;color:var(--fg);background:linear-gradient(160deg,var(--bg1),var(--bg2)) fixed;font:16px/1.5 ui-rounded,"SF Pro Rounded",system-ui,-apple-system,"Segoe UI","Noto Sans","Noto Naskh Arabic","Noto Nastaliq Urdu","Noto Sans Devanagari",sans-serif}
[lang=ur] body{line-height:1.95}
#app{max-width:640px;margin:0 auto;padding:env(safe-area-inset-top) 16px calc(96px + env(safe-area-inset-bottom))}
header{padding:16px 2px 6px}.brand{display:flex;align-items:center;gap:10px}.logo{width:36px;height:36px;border-radius:11px;box-shadow:var(--sh-s)}.dot{font-size:1.6rem}
header h1{margin:0;font-size:1.35rem;font-weight:800;color:var(--acc-d);letter-spacing:-.01em}.tag{margin:4px 0 0;font-size:.78rem;color:var(--muted)}
h2{font-size:1.15rem;font-weight:800;margin:1.1em 0 .5em}h3{margin:.1em 0 .5em;font-weight:800}h4{margin:.9em 0 .35em;font-size:.85rem;color:var(--muted);font-weight:700}
.card{background:var(--card);border-radius:26px;padding:16px;margin:14px 0;border:1px solid var(--bd)}.clay{box-shadow:var(--sh)}
.center{min-height:100vh;display:flex;align-items:center;padding:20px 0}.center .card{width:100%}
.ob{text-align:start}.hero-art{display:block;width:min(100%,360px);margin:0 auto 6px;filter:drop-shadow(0 18px 24px rgba(170,60,110,.18))}.hero-art.small{width:84px;border-radius:22px}
.title{font-size:2rem;font-weight:900;color:var(--acc-d);margin:.2em 0 0;text-align:center}.lead{text-align:center;color:var(--muted);margin:.2em 0 1em}
details{margin:8px 0}summary{cursor:pointer;font-weight:700}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:10px 18px;border-radius:18px;border:0;background:var(--card);color:var(--fg);font:inherit;font-weight:700;cursor:pointer;text-decoration:none;margin:5px 0;box-shadow:var(--sh-s);transition:transform .12s,box-shadow .12s}
.btn:active{transform:translateY(1px) scale(.98);box-shadow:var(--sh-in)}
.btn.primary{background:linear-gradient(160deg,#ff7aa8,var(--acc) 55%,var(--acc-d));color:#fff;box-shadow:8px 10px 20px rgba(214,51,108,.32),inset 2px 3px 4px rgba(255,255,255,.45),inset -3px -4px 8px rgba(120,0,50,.25)}
.btn.big{width:100%;font-size:1.05rem;min-height:56px;border-radius:22px;margin-top:16px}.btn.danger{color:#c62828}.btn[disabled]{opacity:.55;cursor:not-allowed}
.btn.icon{min-width:46px;font-size:1.4rem;padding:0}.btn.round{width:56px;height:56px;border-radius:50%;font-size:1.4rem;padding:0;flex:none}
.hero{text-align:center;padding:8px 0 4px}.hero.empty p{color:var(--muted);margin:.2em 1em}
.ring{position:relative;width:176px;height:176px;margin:10px auto;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#fff,var(--card) 60%,var(--acc2))}
.ring b{position:relative;font-size:3.6rem;font-weight:900;color:var(--acc-d)}.arc{position:absolute;inset:10px;transform:rotate(-90deg)}[dir=rtl] .arc{transform:rotate(-90deg) scaleY(-1)}
.arc circle{fill:none;stroke:var(--acc);stroke-width:7;stroke-linecap:round;opacity:.85}.hero.onp .arc circle{stroke:var(--per)}.hero h2{margin:.3em 0 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}.grid .card{margin:0}
.stat small{display:block;color:var(--muted);font-weight:700;font-size:.8rem}.stat b{display:block;font-size:1.25rem;font-weight:800}.stat span{font-size:.88rem;color:var(--muted)}
.fert{background:linear-gradient(160deg,var(--card),var(--fer-l))}.feature{grid-column:1/-1}
.pill{display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(160deg,var(--card),var(--acc2))}.pill b{display:block;font-weight:800}.pill small,.pill span{color:var(--muted);font-size:.85rem}
.note,.muted,.hint{color:var(--muted);font-size:.85rem}.hint{background:var(--acc2);border-radius:16px;padding:10px 12px;margin:12px 0}
.warn{background:linear-gradient(160deg,#fff8e1,#ffefc2);color:#5c4400;border-radius:18px;padding:12px;font-size:.9rem;box-shadow:var(--sh-in)}.err{color:#c62828}
.modes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0}.mode{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 8px;border-radius:22px;border:2px solid transparent;background:var(--card);color:var(--fg);font:inherit;font-weight:700;box-shadow:var(--sh-s);cursor:pointer;min-height:100px;text-align:center}
.mode.on{border-color:var(--acc);background:var(--acc2)}.mi{font-size:1.9rem;filter:drop-shadow(0 4px 4px rgba(0,0,0,.15))}
.calhead{display:flex;align-items:center;justify-content:space-between}.calhead h2{margin:0}
.cal .wd,.cal .days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center}.wd{margin:10px 0 4px}.wd span{font-size:.7rem;color:var(--muted);font-weight:700;overflow:hidden;white-space:nowrap}
.day{aspect-ratio:1;min-height:40px;border-radius:50%;border:0;background:var(--card);color:var(--fg);font:inherit;font-weight:600;cursor:pointer;position:relative;box-shadow:3px 4px 8px rgba(170,60,110,.10),-3px -3px 6px rgba(255,255,255,.8)}
.day.period{background:radial-gradient(circle at 35% 30%,#ff9cc0,var(--per) 60%,#c2185b);color:#fff}.day.predicted{box-shadow:inset 0 0 0 2px var(--per);background:var(--acc2)}
.day.fertile{background:radial-gradient(circle at 35% 30%,#fff,var(--fer-l));color:#0a4a42}.day.ovulation{background:radial-gradient(circle at 35% 30%,#9df0e4,var(--fer) 60%,#14857a);color:#fff}
.day.now{outline:3px solid var(--acc);outline-offset:2px;font-weight:900}.day.has::after{content:"";position:absolute;bottom:4px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:currentColor}
.day.pilled::before{content:"";position:absolute;top:3px;right:3px;width:7px;height:7px;border-radius:50%;background:#7a5bd0}
.legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:.78rem;margin:12px 0 2px;color:var(--muted)}.k{width:14px;height:14px;border-radius:50%;display:inline-block}
.k.period{background:var(--per)}.k.predicted{box-shadow:inset 0 0 0 2px var(--per)}.k.fertile{background:var(--fer-l);box-shadow:inset 0 0 0 1px var(--fer)}.k.ovulation{background:var(--fer)}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{min-height:40px;padding:6px 14px;border-radius:20px;border:0;background:var(--card);color:var(--fg);font:inherit;font-size:.92rem;cursor:pointer;box-shadow:var(--sh-s)}
.chip.on{background:linear-gradient(160deg,#ff8ab2,var(--acc));color:#fff;box-shadow:inset 2px 2px 4px rgba(255,255,255,.35),4px 5px 10px rgba(214,51,108,.25)}.chip.sm{min-height:0;padding:3px 10px;font-size:.8rem;margin:3px;display:inline-block}
.phases{display:grid;grid-template-columns:1fr 1fr;gap:12px}.phase{margin:0}.phase small{display:block;font-weight:800;margin-bottom:4px}
.ph-men{background:linear-gradient(160deg,var(--card),#ffe0eb)}.ph-ov{background:linear-gradient(160deg,var(--card),var(--fer-l))}.ph-lut{background:linear-gradient(160deg,var(--card),#efe6ff)}
.actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
input,select,textarea{font:inherit;padding:10px 12px;border-radius:14px;border:0;background:var(--card);color:var(--fg);min-height:46px;max-width:100%;box-shadow:var(--sh-in)}
label{display:block;margin:8px 0}textarea{width:100%;display:block;margin-top:4px}.row{display:flex;justify-content:space-between;align-items:center;gap:10px}.row input[type=number]{width:90px}
.center input{width:100%;display:block;margin-top:6px}
.switch input{position:absolute;opacity:0;width:1px;height:1px}.sw{flex:none;width:52px;height:30px;border-radius:15px;background:var(--acc2);box-shadow:var(--sh-in);position:relative;transition:.2s}
.sw::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:2px 3px 6px rgba(0,0,0,.2);transition:.2s}
.switch input:checked+.sw{background:var(--acc)}.switch input:checked+.sw::after{inset-inline-start:25px}.switch input:focus-visible+.sw{outline:2px solid var(--acc)}
.hist{list-style:none;padding:0}.hist li{display:flex;justify-content:space-between;gap:8px;padding:12px 14px;background:var(--card);border-radius:18px;margin:8px 0;box-shadow:var(--sh-s)}
.tabs{position:fixed;bottom:calc(10px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(620px,calc(100% - 20px));display:flex;background:var(--card);border-radius:26px;box-shadow:0 12px 30px rgba(170,60,110,.22),inset 1px 1px 2px rgba(255,255,255,.9);padding:6px;z-index:5}
.tabs a{flex:1;display:flex;flex-direction:column;align-items:center;padding:6px 2px;color:var(--muted);text-decoration:none;font-size:.74rem;font-weight:700;border-radius:20px;min-height:54px}.ti{font-size:1.2rem}
.tabs a.on{color:var(--acc-d);background:var(--acc2);box-shadow:var(--sh-in)}
#toast{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);background:#3a1b2b;color:#fff;padding:10px 18px;border-radius:20px;z-index:9;box-shadow:0 8px 20px rgba(0,0,0,.25)}
a{color:var(--acc-d)}.sheet{scroll-margin-bottom:110px}
.print-wrap{padding:20px 0}.report{background:#fff;color:#222;border-radius:20px;padding:24px;box-shadow:var(--sh)}.report table{width:100%;border-collapse:collapse}.report th,.report td{text-align:start;padding:8px;border-bottom:1px solid #eee}
@media print{body{background:#fff}.noprint,.tabs{display:none!important}.report{box-shadow:none;padding:0}#app{padding:0}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.codebox{text-align:center}.qr{width:220px;height:220px;border-radius:18px;box-shadow:var(--sh-s)}.pass{font-size:1.4rem;letter-spacing:.12em;font-family:ui-monospace,monospace;direction:ltr;display:inline-block}#shareurl{width:100%;font-size:.75rem;direction:ltr}
.locked{opacity:.92}.badge{font-size:.7rem;background:var(--acc2);color:var(--acc-d);border-radius:10px;padding:2px 8px;margin-inline-start:6px}.teaser{background:linear-gradient(160deg,var(--card),#efe6ff)}.okmsg{color:#1f7a4d;font-weight:700}.pcos{background:linear-gradient(160deg,var(--card),#f0e6ff)}