:root{
  --ink:#0E2A1F;
  --ink-2:#2F4A3E;
  --muted:#5A7368;
  --paper:#E4ECE7;
  --sheet:#F8FBF9;
  --line:#BFD0C6;
  --cross:#0FA65A;
  --cross-deep:#0A7A42;
  --cross-soft:#D4F0E0;
  --rx:#E3A414;
  --rx-soft:#FFF1CC;
  --alarm:#C9352A;
  --alarm-soft:#FBE3DF;
  --foil-a:#E9EEF1;
  --foil-b:#C3CBD0;
  --radius:18px;
  --display:"Rajdhani","Mukta",system-ui,sans-serif;
  --body:"Mukta",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--body);min-height:100vh}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--cross);outline-offset:2px;border-radius:8px}
.wrap{max-width:660px;margin:0 auto;padding:16px 16px 64px}
.hide{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- header ---------- */
.top{display:flex;align-items:center;gap:12px;padding:6px 0 18px}
.mark{display:flex;align-items:center;gap:10px;margin-right:auto;text-decoration:none;color:var(--ink)}
.mark svg{width:34px;height:34px;flex:none}
.mark b{font:700 32px/1 var(--display);letter-spacing:.5px}
.mark small{display:block;font:500 12px/1 var(--display);color:var(--muted);letter-spacing:.6px;margin-top:2px}
.langs{display:flex;background:var(--sheet);border:1.5px solid var(--line);border-radius:999px;padding:3px}
.langs button{border:0;background:none;padding:5px 11px;border-radius:999px;font:600 15px/1.2 var(--display);color:var(--ink-2)}
.langs button[aria-pressed="true"]{background:var(--ink);color:#fff}
.icon-btn{border:1.5px solid var(--line);background:var(--sheet);width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none}
.icon-btn svg{width:20px;height:20px}

/* ---------- composer ---------- */
.composer{background:var(--sheet);border:2px solid var(--ink);border-radius:var(--radius);overflow:hidden}
.composer textarea{display:block;width:100%;min-height:150px;resize:vertical;border:0;background:none;padding:16px 16px 8px;font-size:18px;line-height:1.5;outline:none}
.composer textarea::placeholder{color:#7F978B}
.thumb{display:flex;align-items:center;gap:10px;margin:0 16px 10px;padding:6px;border:1.5px dashed var(--line);border-radius:12px;width:max-content;max-width:calc(100% - 32px)}
.thumb img{width:56px;height:56px;object-fit:cover;border-radius:8px}
.thumb button{border:0;background:none;color:var(--alarm);font-weight:700}
.bar{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1.5px solid var(--line);background:#EEF4F0}
.tool{display:flex;align-items:center;gap:6px;border:1.5px solid var(--line);background:var(--sheet);border-radius:12px;padding:8px 12px;font:600 15px/1 var(--display)}
.tool svg{width:18px;height:18px}
.tool.live{background:var(--alarm);border-color:var(--alarm);color:#fff}
.tool.live svg{animation:pulse 1s infinite}
.go{margin-left:auto;border:0;background:var(--cross);color:#fff;border-radius:12px;padding:11px 20px;font:700 18px/1 var(--display);letter-spacing:.3px;box-shadow:0 3px 0 var(--cross-deep)}
.go:active{transform:translateY(2px);box-shadow:0 1px 0 var(--cross-deep)}
.go:disabled{opacity:.55;cursor:wait}
.err{margin:12px 2px 0;color:var(--alarm);font-weight:500}

/* ---------- loader: blister pockets popping ---------- */
.loading{display:flex;align-items:center;gap:14px;padding:28px 4px}
.pockets{display:flex;gap:8px}
.pockets i{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,var(--foil-b) 70%);box-shadow:inset 0 -2px 3px rgba(0,0,0,.18);animation:pop 1.2s infinite ease-in-out}
.pockets i:nth-child(2){animation-delay:.2s}
.pockets i:nth-child(3){animation-delay:.4s}
.loading span{font:600 18px/1 var(--display);color:var(--ink-2)}
@keyframes pop{0%,100%{background:radial-gradient(circle at 35% 30%,#fff,var(--foil-b) 70%)}45%{background:radial-gradient(circle at 35% 30%,#7EE0AA,var(--cross) 70%)}}
@keyframes pulse{50%{opacity:.35}}

/* ---------- result ---------- */
.result{margin-top:26px}
.rhead{display:flex;align-items:flex-start;gap:12px}
.rhead h1{font:700 32px/1.05 var(--display);margin:0;flex:1}
.speak{border:1.5px solid var(--ink);background:var(--sheet);border-radius:999px;padding:7px 14px;display:flex;gap:6px;align-items:center;font:600 15px/1 var(--display);flex:none}
.speak svg{width:18px;height:18px}
.speak[aria-pressed="true"]{background:var(--ink);color:#fff}
.who{margin:10px 0 0;display:flex;flex-wrap:wrap;gap:6px}
.who span{background:var(--sheet);border:1.5px solid var(--line);border-radius:8px;padding:2px 9px;font-size:14px;color:var(--ink-2)}
.summary{margin:12px 0 0;font-size:18px}
.note{margin:10px 0 0;font-size:15px;color:var(--muted)}

.alarm{background:var(--alarm);color:#fff;border-radius:var(--radius);padding:18px 18px 16px;margin-bottom:18px}
.alarm h2{font:700 26px/1.1 var(--display);margin:0 0 6px}
.alarm p{margin:0 0 12px}
.alarm a{display:inline-block;background:#fff;color:var(--alarm);font:700 18px/1 var(--display);padding:11px 18px;border-radius:12px;text-decoration:none;margin-right:8px}

.ask{background:var(--rx-soft);border:2px solid var(--rx);border-radius:var(--radius);padding:14px;margin-top:16px}
.ask p{margin:0 0 10px;font-weight:500}
.row{display:flex;gap:8px}
.row input{flex:1;min-width:0;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px}
.row button{border:0;background:var(--ink);color:#fff;border-radius:12px;padding:0 16px;font:700 16px/1 var(--display)}

.sec{margin-top:28px}
.sec h2{font:700 22px/1.1 var(--display);margin:0 0 10px;display:flex;align-items:center;gap:8px}
.sec h2 svg{width:20px;height:20px;flex:none}
.home li{list-style:none;position:relative;padding:4px 0 4px 26px}
.home li::before{content:"";position:absolute;left:4px;top:13px;width:10px;height:10px;border-radius:50%;background:var(--cross)}
ul.plain{margin:0;padding:0}
.flag li{list-style:none;padding:8px 12px;margin-bottom:6px;border-left:4px solid var(--rx);background:var(--sheet);border-radius:0 10px 10px 0}
.flag.red li{border-color:var(--alarm)}
.flag.green li{border-color:var(--cross)}

/* the signature: medicines as blister strips */
.strip{position:relative;margin-bottom:16px;border-radius:14px;padding:16px 18px 14px;
  background:linear-gradient(118deg,var(--foil-a) 0%,#D3DADE 30%,#F5F8F9 48%,#CBD3D7 70%,var(--foil-a) 100%);
  box-shadow:inset 0 0 0 1.5px rgba(14,42,31,.18), 0 2px 0 rgba(14,42,31,.12)}
.strip::before,.strip::after{content:"";position:absolute;top:10px;bottom:10px;width:6px;
  background:radial-gradient(circle,var(--paper) 2.2px,transparent 2.6px) 0 0/6px 9px repeat-y}
.strip::before{left:-3px}
.strip::after{right:-3px}
.strip h3{font:700 21px/1.15 var(--display);margin:0;padding-right:4px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0}
.tag{font:600 13px/1 var(--display);letter-spacing:.3px;padding:5px 8px;border-radius:6px;background:rgba(255,255,255,.75);color:var(--ink-2)}
.tag.rx{background:var(--rx);color:var(--ink)}
.tag.otc{background:var(--cross-soft);color:var(--cross-deep)}
.brands{margin:8px 0 0;font-size:15px;color:var(--ink-2)}
.for{margin:4px 0 0}
.doses{display:flex;gap:10px;margin:14px 0 4px}
.pocket{flex:1;text-align:center}
.pocket .bub{width:54px;height:54px;margin:0 auto;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 28%,#fff 0%,#DDE3E6 45%,#B4BEC4 100%);
  box-shadow:inset 0 -3px 6px rgba(0,0,0,.18),0 1px 0 #fff;font:700 22px/1 var(--display);color:#8A979E}
.pocket.on .bub{background:radial-gradient(circle at 35% 28%,#9BF0C1 0%,var(--cross) 55%,var(--cross-deep) 100%);color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.25)}
.pocket small{display:block;margin-top:5px;font:600 14px/1 var(--display);color:var(--ink-2)}
.sos{margin:12px 0 2px;display:inline-block;background:var(--ink);color:#fff;font:600 15px/1 var(--display);padding:7px 12px;border-radius:8px}
.facts{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:12px 0 0;font-size:15.5px}
.facts dt{font:600 15px/1.5 var(--display);color:var(--muted)}
.facts dd{margin:0}
.cheap{margin:12px 0 0;padding:9px 12px;background:rgba(255,255,255,.8);border-radius:10px;font-size:15px;border:1.5px dashed var(--cross)}
.cheap b{color:var(--cross-deep);font-family:var(--display)}

/* follow up */
.fu{margin-top:30px;border-top:2px solid var(--ink);padding-top:18px}
.thread{margin:0 0 12px}
.qa{margin-bottom:14px}
.qa .q{font-weight:700}
.qa .a{margin-top:4px;padding:10px 12px;background:var(--sheet);border-radius:12px;border:1.5px solid var(--line)}
.again{margin-top:18px;border:1.5px solid var(--ink);background:none;border-radius:12px;padding:10px 16px;font:600 16px/1 var(--display)}
.disc{margin-top:30px;font-size:13.5px;color:var(--muted)}
.trans{font:600 15px/1 var(--display);color:var(--muted);margin-top:14px}

/* ---------- login / setup ---------- */
.gate{max-width:380px;margin:12vh auto 0;padding:0 16px}
.gate .mark{margin-bottom:26px}
.gate h1{font:700 30px/1.1 var(--display);margin:0 0 6px}
.gate p{margin:0 0 18px;color:var(--muted)}
.gate input{width:100%;border:2px solid var(--ink);background:var(--sheet);border-radius:14px;padding:13px 14px;font-size:18px;margin-bottom:12px}
.gate .go{width:100%;margin:0;padding:14px}

/* ---------- settings sheet ---------- */
.veil{position:fixed;inset:0;background:rgba(14,42,31,.45);display:flex;align-items:flex-end;justify-content:center;z-index:20}
.panel{background:var(--sheet);width:100%;max-width:560px;max-height:92vh;overflow:auto;border-radius:22px 22px 0 0;padding:20px 18px 28px;animation:rise .22s ease-out}
@media (min-width:700px){.veil{align-items:center}.panel{border-radius:22px}}
@keyframes rise{from{transform:translateY(30px);opacity:0}}
.panel h2{font:700 26px/1 var(--display);margin:0 0 16px;display:flex;justify-content:space-between;align-items:center}
.field{margin-bottom:16px}
.field label,.field .lbl{display:block;font:600 15px/1.2 var(--display);color:var(--ink-2);margin-bottom:6px}
.field input,.field select{width:100%;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px}
.prov{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.prov button{border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:10px;text-align:left;font:600 16px/1.2 var(--display)}
.prov button[aria-pressed="true"]{border-color:var(--ink);background:var(--ink);color:#fff}
.hint{font-size:14px;color:var(--muted);margin-top:6px}
.hint a{color:var(--cross-deep)}
.ok{color:var(--cross-deep);font-weight:600;margin-top:8px}
.panel .go{width:100%;margin-top:6px}
.linkish{border:0;background:none;color:var(--alarm);font-weight:600;padding:0;margin-top:6px}

@media (max-width:420px){
  .top{gap:6px}
  .mark{gap:7px}
  .mark b{font-size:24px}
  .mark svg{width:28px;height:28px}
  .icon-btn{width:36px;height:36px;border-radius:10px}
  .icon-btn svg{width:18px;height:18px}
  .mark small{display:none}
  .langs button{padding:5px 7px;font-size:13.5px}
  .rhead h1{font-size:28px}
  .tool span{display:none}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}

/* ---------- v1.1: who picker ---------- */
.who-pick{margin:0 12px 12px;padding:12px;border-radius:14px;background:#EEF4F0;display:grid;gap:8px}
.who-lbl{font:600 14px/1 var(--display);color:var(--muted)}
.pills{display:flex;flex-wrap:wrap;gap:6px}
.pill{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:5px 12px;font:600 15px/1.2 var(--display);color:var(--ink-2)}
.pill[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.nums{display:flex;gap:8px}
.nums label{flex:1;display:flex;align-items:center;gap:6px;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:0 10px}
.nums label span{font:600 14px/1 var(--display);color:var(--muted);white-space:nowrap}
.nums input{width:100%;min-width:0;border:0;background:none;padding:8px 0;outline:none;font-size:16px}
.nums label.need{border-color:var(--rx);background:var(--rx-soft)}

/* quick chips */
.chips{display:flex;gap:6px;overflow-x:auto;padding:12px 2px 2px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;border:1.5px dashed var(--ink-2);background:transparent;border-radius:999px;padding:6px 12px;font:600 15px/1 var(--display);color:var(--ink-2)}
.chip:active{background:var(--cross-soft)}

/* severity + actions */
.sev{display:inline-block;margin-bottom:10px;padding:6px 12px;border-radius:8px;font:700 15px/1 var(--display);letter-spacing:.3px}
.sev.mild{background:var(--cross-soft);color:var(--cross-deep)}
.sev.doctor_soon{background:var(--rx);color:var(--ink)}
.sev.emergency{background:var(--alarm);color:#fff}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}

/* second AI check */
.check{margin:0 0 14px;padding:10px 12px;border-radius:12px;font-size:15px;border:1.5px solid var(--cross);background:var(--cross-soft)}
.check b{display:flex;align-items:center;gap:6px;font:700 16px/1.2 var(--display);color:var(--cross-deep)}
.check b svg{width:18px;height:18px;flex:none}
.check b small{font:500 13px var(--body);color:var(--muted)}
.check p{margin:4px 0 0}
.check.changed{border-color:var(--rx);background:var(--rx-soft)}
.check.changed b{color:#7A5600}
.check.failed{border-color:var(--alarm);background:var(--alarm-soft)}
.check.failed b{color:var(--alarm)}

.remind{margin-top:12px;display:inline-flex;align-items:center;gap:6px;border:0;background:var(--ink);color:#fff;border-radius:10px;padding:9px 14px;font:600 15px/1 var(--display)}
.remind svg{width:17px;height:17px}

/* chemist counter card */
.chem{position:fixed;inset:0;background:#fff;z-index:30;overflow:auto;display:flex;justify-content:center}
.chem-in{width:100%;max-width:640px;padding:28px 20px 32px}
.chem-t{font:700 24px/1.1 var(--display);color:var(--muted);margin:0 0 16px}
.chem ol{margin:0 0 24px;padding-left:28px}
.chem li{margin-bottom:18px;font-size:30px;line-height:1.15}
.chem li b{font:700 34px/1.1 var(--display);display:block}
.chem li span{display:block;font-size:20px;color:var(--ink-2);margin-top:4px}
.chem .go{width:100%;margin:0;padding:14px}

/* print / save as PDF */
@media print{
  body{background:#fff}
  .top .langs,.top .icon-btn,.composer,.chips,#err,.actions,.fu .row,.again,.remind,.trans{display:none!important}
  .wrap{padding:0;max-width:none}
  .strip,.sev,.check,.flag li,.pocket .bub,.alarm{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .strip{break-inside:avoid}
  .result{margin-top:8px}
}
