:root{
  --green:#2f6b3c; --green-d:#1e4a28; --green-l:#5a9a68;
  --leaf:#8bc34a; --cream:#f6f3e9; --paper:#fffdf7; --ink:#24301f;
  --dim:#6b7560; --line:#dcd8c6; --gold:#c9a227;
  --free:#4caf50; --silver:#9aa7b0; --premium:#c9a227;
}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--ink);
  font:16px/1.6 "Segoe UI",system-ui,sans-serif;padding-bottom:60px}
a{color:var(--green)}
.disc-ov{position:fixed;inset:0;background:rgba(20,30,15,.93);z-index:200;display:flex;align-items:center;justify-content:center;padding:20px}
.disc-card{background:var(--paper);max-width:520px;border-radius:14px;padding:26px 28px;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.disc-card h2{margin:0 0 10px;font:700 1.4rem Georgia,serif;color:var(--green-d)}
.disc-card p{font-size:14.5px;color:var(--ink);line-height:1.6}
.disc-card button{margin-top:16px;background:var(--green);color:#fff;border:0;border-radius:9px;padding:12px 22px;font:700 15px system-ui;cursor:pointer}
.disc-card button:hover{background:var(--green-d)}
.hicons{position:absolute;top:12px;right:14px;display:flex;gap:9px;z-index:5}
.hicon{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);color:#fff;font:600 16px system-ui;display:flex;align-items:center;justify-content:center;cursor:pointer;text-decoration:none;position:relative}
.hicon:hover{background:rgba(255,255,255,.3)}
.hicon .qmark{position:absolute;top:-3px;right:-3px;background:var(--gold,#c9a227);color:#2a2112;border-radius:50%;width:16px;height:16px;font:700 11px/1 system-ui;display:flex;align-items:center;justify-content:center}
.hicon.fb{font-family:Georgia,serif;font-style:italic;font-weight:700;background:#1877f2;border-color:#1877f2}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:#2e2318;color:#fff;padding:12px 18px;border-radius:10px;font-size:14px;opacity:0;pointer-events:none;transition:.25s;z-index:400;max-width:90vw;text-align:center}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.libbtn{display:inline-block;margin:0 0 14px;background:var(--paper);border:1px solid var(--green);color:var(--green-d);border-radius:9px;padding:9px 16px;font:600 14px system-ui;cursor:pointer}
.libbtn.saved{background:var(--green);color:#fff}
header.top{position:relative;background:linear-gradient(135deg,var(--green),var(--green-d));color:#fff;
  padding:26px 20px 20px;text-align:center}
header.top h1{margin:0;font:700 2rem/1.1 Georgia,serif;letter-spacing:.5px}
header.top .tag{opacity:.9;margin:6px 0 0;font-size:14px}
.wrap{max-width:1000px;margin:0 auto;padding:0 18px}
/* controls */
.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:18px 0 6px}
.controls input[type=search]{flex:1;min-width:200px;padding:11px 14px;border:1px solid var(--line);
  border-radius:10px;font-size:15px;background:var(--paper)}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0 4px}
.chip{cursor:pointer;border:1px solid var(--line);background:var(--paper);color:var(--dim);
  padding:5px 12px;border-radius:20px;font-size:12.5px;white-space:nowrap}
.chip.on{background:var(--green);color:#fff;border-color:var(--green)}
.count{color:var(--dim);font-size:13px;margin:6px 2px}
/* grid */
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));margin:12px 0 0}
.card{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  cursor:pointer;transition:.15s;text-decoration:none;color:inherit;display:flex;flex-direction:column}
.card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(30,74,40,.14);border-color:var(--green-l)}
.thumb{height:140px;background:#e9efe2 center/cover no-repeat;display:flex;align-items:center;
  justify-content:center;color:var(--green-l);font:700 2.6rem/1 Georgia,serif;position:relative}
.card .body{padding:12px 14px}
.card h3{margin:0;font:700 1.15rem/1.2 Georgia,serif;color:var(--green-d)}
.card .lat{font-style:italic;color:var(--dim);font-size:13px;margin:2px 0 8px}
.tags{display:flex;flex-wrap:wrap;gap:5px}
.why{margin-top:7px;font-size:12px;color:var(--green);font-style:italic}
.rx{max-width:900px;margin:0 auto;padding:0 6px}
.cat3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}
.cat3btn{display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:20px 10px;font-size:1.9rem;line-height:1;transition:.15s}
.cat3btn span{font:600 14px/1.2 system-ui;color:var(--green-d)}
.cat3btn:hover{border-color:var(--green-l);transform:translateY(-2px);box-shadow:0 6px 16px rgba(30,74,40,.12)}
.cat3btn.on{background:var(--green);border-color:var(--green)}
.cat3btn.on span{color:#fff}
@media(max-width:480px){.cat3btn{padding:14px 6px;font-size:1.5rem} .cat3btn span{font-size:12px}}
/* prep-method row (Teas | Tinctures | Compresses | Oils | Salts) */
.prep5{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:16px 0 0}
.prep5btn{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:14px 6px;font-size:1.5rem;line-height:1;transition:.15s}
.prep5btn span{font:600 13px/1.1 system-ui;color:var(--green-d)}
.prep5btn:hover{border-color:var(--green-l);transform:translateY(-2px);box-shadow:0 6px 16px rgba(30,74,40,.12)}
.prep5btn.on{background:var(--green);border-color:var(--green)}
.prep5btn.on span{color:#fff}
@media(max-width:560px){.prep5{grid-template-columns:repeat(5,1fr);gap:5px}.prep5btn{padding:10px 3px;font-size:1.15rem}.prep5btn span{font-size:10.5px}}
/* recipe library panel */
.reclib{margin:16px 0 0}
.reclib-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.reclib-head h2{margin:0;font:700 1.4rem Georgia,serif;color:var(--green-d)}
.reccards{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.reccard{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.reccard h3{margin:0 0 4px;font:700 1.08rem Georgia,serif;color:var(--green-d)}
.reccard .rfor{font-size:12.5px;color:var(--green);font-style:italic;margin-bottom:8px}
.reccard .ring{font-size:13px;color:var(--ink);margin:6px 0}
.reccard ol{margin:6px 0 0;padding-left:20px;font-size:13.5px} .reccard ol li{margin:3px 0}
.resources{background:#f3eee0;border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin:16px 0;font-size:13px}
.resources h3{margin:0 0 8px;font:700 1rem Georgia,serif;color:var(--green-d)}
.resources ul{margin:0;padding-left:18px} .resources li{margin:4px 0;color:var(--dim)}
.resources a{color:var(--green)}
/* legal-status flags */
.legal{display:inline-block;padding:5px 12px;border-radius:20px;font:700 12px/1 system-ui;letter-spacing:.4px;color:#fff}
.legal-legal{background:#4caf50} .legal-restricted{background:#d98a3a} .legal-controlled{background:#c0392b}
.legal-banned{background:#7b241c} .legal-unknown{background:#8a8a8a}
.ask{background:#f1f6ec;border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:8px 0}
.forms{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}
.formbtn{cursor:pointer;background:var(--paper);border:1px solid var(--green-l);color:var(--green-d);border-radius:20px;padding:8px 15px;font:600 13px system-ui}
.formbtn:hover,.formbtn.on{background:var(--green);color:#fff;border-color:var(--green)}
.beginner{max-width:900px;margin:10px auto;padding:12px 16px;background:#eef6fb;border:1px solid #bcdcee;border-radius:12px;color:#235;font-size:14px}
.profile-wrap{max-width:560px;margin:0 auto;padding:0 18px}
.field{margin:12px 0} .field label{display:block;font-weight:600;color:var(--green-d);margin-bottom:4px;font-size:14px}
.field input,.field select{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:9px;font-size:15px;background:var(--paper)}
.row2{display:flex;gap:10px} .row2>.field{flex:1}
.savebtn{background:var(--green);color:#fff;border:0;border-radius:9px;padding:13px 22px;font:700 15px system-ui;cursor:pointer;margin-top:8px}
.savebtn:hover{background:var(--green-d)}
.saved{color:var(--green);font-weight:600;margin-left:10px}
.tag{background:#eef4e8;color:var(--green-d);border-radius:6px;padding:2px 8px;font-size:11px}
.badge{display:inline-block;padding:3px 9px;border-radius:20px;font:700 10px/1 system-ui;
  letter-spacing:.6px;text-transform:uppercase;color:#fff;position:absolute;top:8px;right:8px}
.b-free{background:var(--free)} .b-silver{background:var(--silver)} .b-premium{background:var(--premium)}
.poison-ribbon{position:absolute;top:8px;left:8px;background:#7b241c;color:#fff;font:700 10px/1 system-ui;padding:4px 8px;border-radius:6px;letter-spacing:.4px;z-index:2;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.poison-banner{background:#7b241c;color:#fff;border-radius:8px;padding:10px 14px;margin:10px 0 2px;font:500 13.5px/1.4 system-ui}
.poison-banner b{font-weight:700}
/* detail page */
.detail{max-width:860px;margin:0 auto;padding:0 18px}
.back{display:inline-block;margin:16px 0;color:var(--green);text-decoration:none;font-size:14px}
.hero{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;margin-top:4px}
.hero h1{margin:0;font:700 2.3rem/1.1 Georgia,serif;color:var(--green-d)}
.hero .lat{font-style:italic;color:var(--dim);font-size:1.05rem}
.hero .fam{color:var(--dim);font-size:13px;width:100%}
.gallery{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}
.gimg{width:150px;height:120px;object-fit:cover;border-radius:10px;border:1px solid var(--line);cursor:zoom-in;transition:.15s;background:#e9efe2;display:block}
.gimg:hover{transform:scale(1.03);box-shadow:0 6px 16px rgba(30,74,40,.18)}
.lb{display:none;position:fixed;inset:0;background:rgba(10,15,8,.92);z-index:300;align-items:center;justify-content:center;padding:20px;cursor:zoom-out}
.lb.on{display:flex}
.lb img{max-width:95vw;max-height:92vh;border-radius:8px;box-shadow:0 10px 40px rgba(0,0,0,.5)}
section.block{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:14px 0}
section.block h2{margin:0 0 8px;font:700 1.1rem/1.2 Georgia,serif;color:var(--green);border-bottom:1px solid var(--line);padding-bottom:6px}
ul.clean{margin:6px 0;padding-left:20px} ul.clean li{margin:4px 0}
.pill{display:inline-block;background:#eef4e8;color:var(--green-d);border-radius:6px;padding:3px 10px;font-size:13px;margin:3px 4px 3px 0}
.recipe{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:10px 0;background:#fbfaf3}
.recipe-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.recipe-head b{font-size:1.02rem;color:var(--green-d)}
.rtype{background:var(--green);color:#fff;border-radius:6px;padding:2px 9px;font:700 10.5px/1 system-ui;letter-spacing:.6px;text-transform:uppercase}
.ratio{color:var(--dim);font-size:13px;margin:2px 0 6px}
ol.clean{margin:6px 0;padding-left:22px} ol.clean li{margin:4px 0}
.caution{background:#fdf0e6;border-left:4px solid #d98a3a;border-radius:8px;padding:12px 15px}
.disclaimer{background:#f3eee0;border:1px solid var(--line);border-radius:10px;padding:14px 16px;color:#5c5330;font-size:13px;margin:22px 0}
.tierline{margin:4px 0 0}
footer{max-width:1000px;margin:30px auto 0;padding:16px 20px;border-top:1px solid var(--line);color:var(--dim);font-size:12.5px;text-align:center}
@media(max-width:520px){ .gallery{grid-template-columns:1fr 1fr} header.top h1{font-size:1.6rem} }

/* ============ APOTHECARY detail page (sepia / parchment) ============ */
body.apoth{
  --ink:#3b2d19; --accent:#7a531f; --accent-d:#5c3d16; --rule:#c8b183; --rule-d:#a98a4e;
  color:#3b2d19;
  background:#e9dcbd;
  background-image:
    radial-gradient(circle at 20% 15%, rgba(255,250,235,.55), transparent 40%),
    radial-gradient(circle at 85% 80%, rgba(120,85,30,.10), transparent 45%),
    radial-gradient(circle at 50% 50%, rgba(160,120,60,.06), transparent 70%);
  font-family:"Palatino Linotype","Book Antiqua",Georgia,serif;
}
body.apoth .detail{max-width:900px}
body.apoth .back{color:var(--accent-d);font:600 14px "Palatino Linotype",Georgia,serif;letter-spacing:.3px}
body.apoth .back:hover{color:var(--ink)}
/* plate hero */
.plate-hero{display:flex;gap:16px;align-items:flex-start;margin:2px 0 4px;flex-wrap:wrap}
.plate-frame{flex:0 0 160px;max-width:165px;background:#fbf4e2;padding:6px;border:1px solid var(--rule-d);
  box-shadow:0 2px 0 #fff inset,0 5px 14px rgba(60,40,15,.22);position:relative}
.plate-frame::after{content:"";position:absolute;inset:3px;border:1px solid var(--rule);pointer-events:none}
.plate-frame img{display:block;width:100%;height:auto;cursor:zoom-in}
.plate-title{flex:1;min-width:220px;padding-top:0}
.apoth-kicker{font:600 10px/1 "Palatino Linotype",Georgia,serif;letter-spacing:2.5px;text-transform:uppercase;color:var(--accent);
  border-bottom:2px double var(--rule-d);display:inline-block;padding-bottom:3px;margin-bottom:6px}
.plate-title h1{margin:0;font:700 1.65rem/1.1 "Palatino Linotype","Book Antiqua",Georgia,serif;color:var(--ink);letter-spacing:.3px}
.crest{display:inline-flex;align-items:center;gap:7px;vertical-align:middle;margin-left:8px;white-space:nowrap}
.crest .elem{font-size:1.35rem;line-height:1}
.elem-fire{color:#c0392b}.elem-air{color:#5b7fa6}.elem-water{color:#2e6b8f}.elem-earth{color:#7a5a2e}
.crest .freq{font:700 11px/1 system-ui;color:#5c3d16;background:#e4d4ad;border:1px solid var(--rule-d,#a98a4e);border-radius:11px;padding:3px 9px;letter-spacing:.3px}
.plate-title .lat{font-style:italic;color:var(--accent-d);font-size:.95rem;display:block;margin:2px 0}
.plate-title .fam{color:#6e5a38;font-size:12px;display:block;margin-bottom:5px}
body.apoth .tags .tag{background:#e4d4ad;color:var(--accent-d);border:1px solid var(--rule-d);border-radius:4px}
body.apoth .libbtn{background:#fbf4e2;border:1px solid var(--accent);color:var(--accent-d);font-family:"Palatino Linotype",Georgia,serif;border-radius:4px;margin-top:12px}
body.apoth .libbtn.saved{background:var(--accent);color:#fdf6e3}
body.apoth .badge{position:static;background:var(--accent)}
/* aged section cards tiled into box-like formations */
body.apoth .apoth-grid{column-count:3;column-gap:11px;margin-top:6px}
@media(max-width:860px){ body.apoth .apoth-grid{column-count:2} }
@media(max-width:560px){ body.apoth .apoth-grid{column-count:1} }
body.apoth section.block{background:#f7efda;border:1px solid var(--rule-d);border-radius:3px;
  box-shadow:0 1px 0 #fff inset,0 2px 7px rgba(60,40,15,.08);padding:9px 11px;margin:0 0 11px;
  break-inside:avoid;-webkit-column-break-inside:avoid;display:inline-block;width:100%;font-size:13px;line-height:1.45}
body.apoth section.block h2{margin:0 0 5px;font:700 .98rem/1.2 "Palatino Linotype","Book Antiqua",Georgia,serif;color:var(--accent-d);
  border-bottom:2px double var(--rule-d);padding-bottom:4px;letter-spacing:.2px}
body.apoth section.block p{margin:5px 0}
body.apoth section.block ul.clean,body.apoth section.block ol.clean{padding-left:16px}
body.apoth .pill{font-size:11.5px;padding:2px 7px;margin:2px 3px 2px 0}
body.apoth .recipe{padding:9px 10px;margin:7px 0}
body.apoth .pill{background:#e4d4ad;color:var(--accent-d);border:1px solid var(--rule)}
body.apoth .recipe{background:#fbf4e2;border:1px solid var(--rule-d)}
body.apoth .rtype{background:var(--accent)}
body.apoth .recipe-head b,body.apoth .hero h1{color:var(--ink)}
body.apoth .caution{background:#f3e3c4;border-left:4px solid var(--accent)}
body.apoth .disclaimer{background:#efe2c2;border:1px solid var(--rule-d);color:#5c4420}
body.apoth ul.clean li,body.apoth ol.clean li{margin:5px 0}
/* decorative bottom flourish */
.apoth-sig{display:flex;align-items:center;gap:16px;justify-content:center;margin:26px 0 6px;color:var(--accent);
  font:italic 600 13px "Palatino Linotype",Georgia,serif;letter-spacing:1px;opacity:.85}
.apoth-sig img{width:62px;height:92px;object-fit:cover;border:1px solid var(--rule-d);padding:3px;background:#fbf4e2}
@media(max-width:620px){ .plate-frame{flex-basis:100%;max-width:100%} .plate-title h1{font-size:2.2rem} }
