:root{
  --forest:#1f5f4a; --forest-d:#123f31; --forest-l:#2e7d5b;
  --sage:#7fa88f; --sage-l:#d9e6dc;
  --cream:#f7f4ec; --cream-d:#efe9db;
  --gold:#c9a24b; --gold-l:#e4c877;
  --ink:#22302a; --ink-soft:#516058;
  --card:#fff; --line:rgba(31,95,74,.12);
  --shadow:0 12px 34px -12px rgba(20,60,45,.35);
  --shadow-s:0 4px 14px -6px rgba(20,60,45,.26);
  --radius:20px;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Nunito Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--cream);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
em{font-style:italic}
.leaf-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(1200px 700px at 82% -12%,rgba(126,168,143,.26),transparent 60%),radial-gradient(900px 600px at -10% 112%,rgba(201,162,75,.13),transparent 55%),var(--cream)}
.leaf-bg::before{content:"";position:absolute;inset:0;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cpath d='M60 10C40 30 28 46 28 66a32 32 0 0064 0c0-20-12-36-32-56z' fill='none' stroke='%231f5f4a' stroke-width='2'/%3E%3Cpath d='M60 18v72' stroke='%231f5f4a' stroke-width='1.4'/%3E%3C/svg%3E");background-size:170px}

/* topbar */
.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:12px;
  padding:10px clamp(12px,3vw,26px);padding-top:calc(10px + env(safe-area-inset-top));
  background:rgba(247,244,236,.85);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:9px;font-family:var(--serif);font-weight:700;font-size:1.45rem;color:var(--forest);white-space:nowrap}
.brand-leaf{width:25px;height:25px;color:var(--forest)}
.topsearch{flex:1;max-width:560px;margin:0 auto;display:flex;align-items:center;gap:9px;background:var(--card);border-radius:99px;padding:9px 15px;box-shadow:var(--shadow-s)}
.topsearch svg{width:18px;height:18px;color:var(--sage);flex:0 0 auto}
.topsearch input{border:0;outline:0;flex:1;font-family:var(--sans);font-size:.95rem;background:transparent;color:var(--ink)}
.topsearch kbd{font-family:var(--sans);font-size:.7rem;font-weight:800;color:var(--sage);border:1px solid var(--line);border-radius:6px;padding:1px 6px}

main{max-width:1180px;margin:0 auto;padding:0 clamp(12px,3vw,26px) 50px;min-height:60vh}
.foot{text-align:center;color:var(--sage);font-size:.8rem;padding:24px 16px calc(24px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}

/* ===== search panel ===== */
.search-panel{position:fixed;left:50%;transform:translateX(-50%);top:calc(60px + env(safe-area-inset-top));z-index:49;
  width:min(680px,94vw);max-height:72vh;overflow-y:auto;background:var(--card);border-radius:18px;box-shadow:var(--shadow);border:1px solid var(--line);padding:8px}
.search-panel[hidden]{display:none}
.sp-group{padding:6px 8px 2px;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--sage)}
.sp-item{display:flex;gap:10px;align-items:baseline;padding:9px 10px;border-radius:12px;cursor:pointer}
.sp-item:hover,.sp-item.sel{background:var(--sage-l)}
.sp-item .t{font-weight:700;color:var(--forest-d)}
.sp-item .py{font-style:italic;color:var(--sage);font-family:var(--serif);font-size:.95rem}
.sp-item .d{margin-left:auto;font-size:.68rem;font-weight:800;color:var(--sage);white-space:nowrap;text-transform:uppercase;letter-spacing:.4px}
.sp-sub-anchor{}
.sp-sub{padding:7px 10px 2px;font-size:.72rem;font-weight:800;color:var(--forest-l);border-top:1px solid var(--line);margin-top:3px}
.sp-empty{padding:22px;text-align:center;color:var(--ink-soft)}

.organs{margin:22px auto 4px;max-width:820px;text-align:center}
.organs .ol{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--sage)}
.ochips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:10px}
.ochip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--card);color:var(--forest-d);font-family:var(--sans);font-weight:700;font-size:.85rem;padding:8px 14px;border-radius:99px;cursor:pointer;box-shadow:var(--shadow-s);transition:.18s}
.ochip:hover{background:var(--forest);color:#fff;transform:translateY(-2px)}
.ochip i{font-style:normal;font-size:.9rem;opacity:.65}
.ochip:hover i{opacity:.95}

/* ===== hero / home ===== */
.hero{text-align:center;padding:44px 12px 10px;position:relative}
.hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(2.6rem,7vw,4.4rem);line-height:1.02;color:var(--forest-d);letter-spacing:-.5px}
.hero p{max-width:600px;margin:14px auto 0;color:var(--ink-soft);font-size:1.05rem}
.hero .stat{margin-top:14px;font-weight:800;color:var(--gold);letter-spacing:.4px}

.section-title{font-family:var(--serif);font-weight:700;font-size:clamp(1.8rem,4.5vw,2.6rem);color:var(--forest-d);margin:8px 0 4px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-top:26px}
.tile{position:relative;overflow:hidden;background:var(--card);border-radius:var(--radius);padding:20px 20px 18px;box-shadow:var(--shadow-s);cursor:pointer;transition:.22s;border:1px solid var(--line);display:flex;flex-direction:column;gap:6px;min-height:132px}
.tile:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.tile .ic{font-size:1.7rem;line-height:1}
.tile h3{font-family:var(--serif);font-weight:700;font-size:1.5rem;color:var(--forest-d);line-height:1.05}
.tile .src{font-size:.78rem;color:var(--ink-soft)}
.tile .cnt{margin-top:auto;font-size:.72rem;font-weight:800;color:var(--gold);text-transform:uppercase;letter-spacing:.6px}
.tile.feat{background:linear-gradient(150deg,var(--forest),var(--forest-d));color:#fff;border:0}
.tile.feat h3{color:#fff}.tile.feat .src{color:var(--sage-l)}.tile.feat .cnt{color:var(--gold-l)}

/* ===== domain list ===== */
.crumbs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:.85rem;color:var(--ink-soft);padding:22px 2px 4px}
.crumbs a{color:var(--forest-l);font-weight:700}
.crumbs .sep{color:var(--sage)}
.dom-head{padding:2px 2px 10px}
.dom-tools{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.dom-tools .typchip{border:1px solid var(--line);background:var(--card);color:var(--ink-soft);font-weight:700;font-size:.76rem;padding:6px 13px;border-radius:99px;cursor:pointer}
.dom-tools .typchip.on{background:var(--forest);color:#fff;border-color:var(--forest)}
.filter-in{display:flex;align-items:center;gap:9px;background:var(--card);border-radius:99px;padding:10px 16px;box-shadow:var(--shadow-s);max-width:420px;margin-bottom:12px}
.filter-in input{border:0;outline:0;flex:1;background:transparent;font-family:var(--sans);font-size:.95rem}
.elist{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.ecard{background:var(--card);border-radius:15px;padding:14px 16px;box-shadow:var(--shadow-s);cursor:pointer;transition:.18s;border:1px solid var(--line);border-left:4px solid var(--sage)}
.ecard:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-left-color:var(--forest-l)}
.ecard .et{font-family:var(--serif);font-weight:700;font-size:1.28rem;color:var(--forest-d);line-height:1.1}
.ecard .epy{font-style:italic;color:var(--sage);font-family:var(--serif);font-size:.95rem}
.ecard .esn{font-size:.83rem;color:var(--ink-soft);margin-top:5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ecard .etag{display:inline-block;margin-top:8px;font-size:.64rem;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--gold);background:rgba(201,162,75,.13);padding:3px 9px;border-radius:99px}
.more-btn{display:block;margin:20px auto 0;background:var(--card);border:1px solid var(--line);color:var(--forest);font-weight:800;padding:11px 22px;border-radius:99px;cursor:pointer;box-shadow:var(--shadow-s)}

/* ===== reader ===== */
.reader{max-width:820px;margin:0 auto}
.rd-head{padding:6px 2px 14px;border-bottom:1px solid var(--line);margin-bottom:18px}
.rd-tag{display:inline-block;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--forest);background:var(--sage-l);padding:4px 11px;border-radius:99px;margin-bottom:9px}
.rd-head h1{font-family:var(--serif);font-weight:700;font-size:clamp(2rem,5vw,3rem);color:var(--forest-d);line-height:1.05}
.rd-head .rd-py{font-style:italic;font-family:var(--serif);color:var(--gold);font-size:1.35rem;margin-top:2px}
.rd-head .rd-py .hz{color:var(--forest-l);font-style:normal;margin-left:8px}
.rd-head .rd-src{font-size:.82rem;color:var(--ink-soft);margin-top:8px}
.rd-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.rd-meta .m{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:6px 12px;font-size:.82rem;box-shadow:var(--shadow-s)}
.rd-meta .m b{color:var(--forest);font-weight:800;font-size:.68rem;text-transform:uppercase;letter-spacing:.4px;display:block}
.content{font-size:.98rem;color:var(--ink);line-height:1.68}
.content h1,.content h2,.content h3,.content h4{font-family:var(--serif);color:var(--forest-d);line-height:1.15;margin:1.3em 0 .4em}
.content h1{font-size:1.7rem}.content h2{font-size:1.45rem}.content h3{font-size:1.2rem;color:var(--forest-l)}.content h4{font-size:1.05rem;color:var(--gold)}
.content p{margin:.7em 0}
.content ul,.content ol{margin:.6em 0 .6em 1.3em}
.content li{margin:.24em 0}
.content strong{color:var(--forest-d)}
.content em{color:var(--ink-soft)}
.content blockquote{border-left:3px solid var(--sage);padding-left:14px;color:var(--ink-soft);margin:.8em 0}
.content code{background:var(--cream-d);padding:1px 6px;border-radius:6px;font-size:.9em}
.content table{width:100%;border-collapse:collapse;margin:1em 0;font-size:.86rem;box-shadow:var(--shadow-s);border-radius:12px;overflow:hidden}
.content th{background:var(--forest-l);color:#fff;font-weight:700;text-align:left;padding:8px 10px}
.content td{padding:7px 10px;border-top:1px solid var(--line);vertical-align:top}
.content tr:nth-child(even) td{background:var(--cream)}
.related{margin-top:34px;padding-top:20px;border-top:1px solid var(--line)}
.related h4{font-family:var(--serif);font-size:1.3rem;color:var(--forest-d);margin-bottom:10px}
.related .elist{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.loading{text-align:center;color:var(--sage);padding:50px;font-size:1.05rem}

/* ===== Ross module (flashcards + browse) ===== */
.ross-tabs{display:flex;gap:6px;justify-content:center;margin:18px 0}
.ross-tabs button{border:0;background:var(--cream-d);color:var(--ink-soft);font-weight:800;font-size:.85rem;padding:9px 18px;border-radius:99px;cursor:pointer}
.ross-tabs button.on{background:var(--forest);color:#fff;box-shadow:var(--shadow-s)}
.flash-stage{display:flex;align-items:center;justify-content:center;gap:clamp(6px,2vw,16px);margin-top:6px}
.nav-arrow{flex:0 0 auto;width:50px;height:50px;border-radius:50%;border:0;cursor:pointer;background:var(--card);color:var(--forest);font-size:1.9rem;box-shadow:var(--shadow-s);display:grid;place-items:center;transition:.2s}
.nav-arrow:hover{background:var(--forest);color:#fff}
.flashcard{width:min(380px,86vw);height:min(540px,70vh);perspective:1500px;cursor:pointer}
.fc-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.flashcard.flipped .fc-inner{transform:rotateY(180deg)}
.fc-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:var(--card);display:flex;flex-direction:column}
.fc-photo{flex:1;overflow:hidden;position:relative;background:var(--sage-l)}
.fc-photo img{width:100%;height:100%;object-fit:cover}
.fc-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(18,63,49,.78),rgba(18,63,49,.05) 42%,transparent)}
.fc-cap{position:absolute;left:0;right:0;bottom:0;padding:18px 20px;color:#fff;z-index:2}
.fc-cap h2{font-family:var(--serif);font-weight:700;font-size:1.9rem}
.fc-cap .lat{font-style:italic;color:var(--gold-l);font-family:var(--serif);font-size:1.1rem}
.fc-back{transform:rotateY(180deg);background:linear-gradient(160deg,#fff,var(--cream));padding:24px 22px;overflow-y:auto}
.fc-back h3{font-family:var(--serif);font-size:1.7rem;color:var(--forest-d)}
.props{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.prop{display:flex;gap:10px;padding:9px 12px;background:#fff;border-radius:12px;box-shadow:var(--shadow-s);border-left:4px solid var(--forest-l)}
.prop.supp{border-left-style:dashed;border-left-color:var(--gold)}
.prop .k{flex:0 0 84px;font-weight:800;font-size:.68rem;text-transform:uppercase;letter-spacing:.5px;color:var(--forest);padding-top:2px}
.prop .v{flex:1;font-size:.9rem}
.supp-badge{font-size:.58rem;font-weight:800;color:#8a6d1e;background:rgba(201,162,75,.16);border:1px dashed var(--gold);padding:1px 6px;border-radius:99px;margin-left:5px;white-space:nowrap}
.supp-note{font-size:.72rem;color:var(--gold);margin-top:8px;padding-top:8px;border-top:1px dashed rgba(201,162,75,.4)}
.desc{font-size:.88rem;color:var(--ink-soft);margin-top:6px}
.learn-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.pill{border:0;background:var(--card);color:var(--forest);font-weight:800;font-size:.88rem;padding:11px 20px;border-radius:99px;box-shadow:var(--shadow-s);cursor:pointer;transition:.2s}
.pill:hover{transform:translateY(-2px)}.pill.primary{background:var(--forest);color:#fff}.pill.primary.done{background:var(--gold);color:#3a2e0e}
.counter{text-align:center;font-weight:800;color:var(--forest);margin:14px 0 4px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin-top:8px}
.hcard{position:relative;border-radius:16px;overflow:hidden;background:var(--card);box-shadow:var(--shadow-s);cursor:pointer;transition:.2s;border:1px solid var(--line)}
.hcard:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.hcard .ph{aspect-ratio:1;overflow:hidden;background:var(--sage-l)}
.hcard .ph img{width:100%;height:100%;object-fit:cover;transition:.4s}
.hcard:hover .ph img{transform:scale(1.06)}
.hcard .in{padding:10px 12px}
.hcard h3{font-family:var(--serif);font-weight:700;font-size:1.1rem;color:var(--forest-d);line-height:1.08}
.hcard .cl{font-style:italic;font-family:var(--serif);color:var(--sage);font-size:.86rem}

@media(max-width:640px){
  .brand span{display:none}
  .topsearch{margin:0}
  .topsearch kbd{display:none}
  .elist{grid-template-columns:1fr}
  .nav-arrow{width:42px;height:42px;font-size:1.5rem}
}

/* ===== topbar extras ===== */
.nav-lnk{font-weight:800;font-size:.85rem;color:var(--forest);padding:8px 10px;white-space:nowrap}
.nav-lnk:hover{color:var(--forest-l)}
.icon-btn{border:1px solid var(--line);background:var(--card);color:var(--forest);width:38px;height:38px;border-radius:50%;cursor:pointer;font-size:1.1rem;box-shadow:var(--shadow-s);flex:0 0 auto}
.icon-btn:hover{background:var(--sage-l)}

/* ===== highlight / cross-links / glossary tooltip ===== */
mark{background:#fdeeb0;color:inherit;border-radius:3px;padding:0 2px}
.content a.xlink{color:var(--forest-l);font-weight:600;text-decoration:none;border-bottom:1px dotted var(--sage)}
.content a.xlink:hover{color:var(--forest);border-bottom-style:solid}
abbr.gloss{text-decoration:none;border-bottom:1px dotted var(--gold);cursor:help}

/* ===== in-article TOC ===== */
.toc{margin:0 0 16px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-s);overflow:hidden}
.toc summary{cursor:pointer;font-weight:800;color:var(--forest-d);padding:11px 15px;font-size:.9rem;list-style:none}
.toc summary::-webkit-details-marker{display:none}
.toc summary::before{content:'☰ ';color:var(--sage)}
.toc nav{display:flex;flex-direction:column;padding:4px 6px 10px}
.toc nav a{padding:5px 12px;font-size:.85rem;color:var(--ink-soft);cursor:pointer;border-radius:8px}
.toc nav a:hover{background:var(--sage-l);color:var(--forest-d)}
.toc nav a.toc-h3{padding-left:26px;font-size:.8rem}

/* ===== herb<->formula link box ===== */
.linkbox{margin:24px 0 6px;padding:16px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-s)}
.linkbox .lk{margin-bottom:10px}
.linkbox .lk:last-child{margin-bottom:0}
.linkbox b{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.6px;color:var(--forest);margin-bottom:8px}
.lkchips{display:flex;flex-wrap:wrap;gap:7px}
.lchip{display:inline-block;background:var(--sage-l);color:var(--forest-d);font-weight:700;font-size:.82rem;padding:5px 12px;border-radius:99px}
.lchip:hover{background:var(--forest);color:#fff}

/* ===== reader compare button ===== */
.rd-actions{margin-top:12px}
.cmpbtn{border:1px solid var(--line);background:var(--card);color:var(--forest);font-weight:800;font-size:.8rem;padding:7px 14px;border-radius:99px;cursor:pointer;box-shadow:var(--shadow-s)}
.cmpbtn.on{background:var(--forest);color:#fff}

/* ===== facet label + clickable book subheader ===== */
.facet-lbl{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--sage);align-self:center;margin-right:2px}
.sp-sub{cursor:pointer}
.sp-sub.on{color:var(--forest-d);background:var(--sage-l);border-radius:8px}

/* ===== compare tray (floating) ===== */
#cmpbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + env(safe-area-inset-bottom));z-index:60;display:flex;align-items:center;gap:10px;background:var(--forest-d);color:#fff;padding:9px 12px 9px 16px;border-radius:99px;box-shadow:0 12px 30px -8px rgba(0,0,0,.5);max-width:94vw;font-size:.82rem}
#cmpbar[hidden]{display:none}
#cmpbar span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:52vw}
#cmpbar i{opacity:.8}
#cmpbar .cmpgo{background:var(--gold);color:#3a2e0e;border:0;font-weight:800;padding:7px 14px;border-radius:99px;cursor:pointer}
#cmpbar .cmpclr{background:transparent;border:0;color:#fff;font-size:1rem;cursor:pointer}

/* ===== glossary page ===== */
.glossary{max-width:760px;margin:14px auto;display:flex;flex-direction:column;gap:2px}
.gl-row{display:grid;grid-template-columns:180px 1fr;gap:14px;padding:12px 8px;border-bottom:1px solid var(--line)}
.gl-t{font-family:var(--serif);font-weight:700;font-size:1.2rem;color:var(--forest-d)}
.gl-hz{color:var(--sage);font-size:1rem}
.gl-d{color:var(--ink-soft);font-size:.94rem;align-self:center}

/* ===== compare grid ===== */
.cmpgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-top:14px}
.cmpcol{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-s);padding:16px;max-height:78vh;overflow:auto}
.cmphead{position:relative;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:10px}
.cmphead h3{font-family:var(--serif);font-size:1.4rem;color:var(--forest-d)}
.cmphead .latin{font-style:italic;color:var(--gold);font-family:var(--serif)}
.cmprm{position:absolute;top:0;right:0;border:0;background:var(--cream-d);color:var(--ink-soft);width:26px;height:26px;border-radius:50%;cursor:pointer}
.cmpcol .content{font-size:.9rem}

/* ===== dark mode ===== */
.dark{--cream:#131a16;--cream-d:#1c241e;--card:#1a221c;--ink:#e7ede8;--ink-soft:#a4b0a8;
 --line:rgba(255,255,255,.11);--forest:#8fd3ac;--forest-d:#d2ecdf;--forest-l:#93cdaa;--sage:#8aa896;--sage-l:#25322a;
 --shadow:0 12px 34px -12px rgba(0,0,0,.6);--shadow-s:0 4px 14px -6px rgba(0,0,0,.5)}
.dark body{background:var(--cream);color:var(--ink)}
.dark .topbar{background:rgba(19,26,22,.86)}
.dark .leaf-bg{background:radial-gradient(1200px 700px at 82% -12%,rgba(46,125,91,.16),transparent 60%),var(--cream)}
.dark .leaf-bg::before{opacity:.03}
.dark mark{background:#5c4b13;color:#ffe7a3}
.dark .tile.feat{background:linear-gradient(150deg,#1f5f4a,#123f31)}

/* ===== v6 visual refinements ===== */
/* colored domain tiles */
.tile{border-top:3px solid var(--acc,var(--forest-l))}
.tile .ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:var(--acc,var(--forest-l));color:#fff;font-size:1.5rem;box-shadow:0 7px 16px -7px var(--acc,rgba(0,0,0,.3))}
.tile.feat .ic{background:rgba(255,255,255,.18)}
.tile .tbody{margin-top:2px}
.tile .cnt{color:var(--acc,var(--gold))}
.tile.feat .cnt{color:var(--gold-l)}

/* organ badges */
.obadges{display:inline-flex;flex-wrap:wrap;gap:4px}
.obadge{font-size:.62rem;font-weight:800;letter-spacing:.2px;color:var(--forest-d);background:var(--sage-l);border:1px solid var(--line);padding:2px 8px;border-radius:99px;white-space:nowrap}
.ecfoot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:9px}
.ecfoot .etag{margin-top:0}
.rd-organs{margin-top:11px}

/* reader meta -> definition grid */
.metagrid{margin-top:15px;display:grid;grid-template-columns:auto 1fr;column-gap:18px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:6px 18px;box-shadow:var(--shadow-s);max-width:640px}
.mg-row{display:contents}
.mg-k{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--forest);padding:9px 0;white-space:nowrap;border-bottom:1px solid var(--line)}
.mg-v{font-size:.9rem;color:var(--ink);padding:9px 0;border-bottom:1px solid var(--line)}
.mg-row:last-child .mg-k,.mg-row:last-child .mg-v{border-bottom:0}

/* content typographic polish */
.content h2{border-left:3px solid var(--gold);padding-left:12px}
.content h3{border-left:2px solid var(--sage);padding-left:10px}
.content>p:first-of-type{font-size:1.04rem;color:var(--ink)}
.content hr{border:0;border-top:1px solid var(--line);margin:1.5em 0}
.content ul li::marker{color:var(--sage)}

/* glossary rows: subtle hover + card feel */
.gl-row{border-radius:10px;transition:.15s}
.gl-row:hover{background:var(--card);box-shadow:var(--shadow-s)}

@media(max-width:640px){
  .metagrid{grid-template-columns:1fr;column-gap:0}
  .mg-k{padding-bottom:0;border-bottom:0}
  .mg-v{padding-top:2px}
  .gl-row{grid-template-columns:1fr;gap:2px}
}

/* ===================== v7 — nowe widoki ===================== */
/* home: quick tiles + ulubione/historia */
.quick{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;max-width:820px;margin:26px auto 0}
.qtile{display:flex;flex-direction:column;gap:2px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 16px;box-shadow:var(--shadow-s);transition:.2s;position:relative;padding-left:58px}
.qtile:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.qtile .qi{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:1.6rem}
.qtile b{color:var(--forest-d);font-size:.95rem}
.qtile i{font-style:normal;font-size:.75rem;color:var(--ink-soft)}
.mine{max-width:980px;margin:18px auto 0;display:flex;flex-direction:column;gap:10px}
.mine-row{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 14px;box-shadow:var(--shadow-s)}
.mine-lbl{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.7px;color:var(--gold);white-space:nowrap}
.lchip.ghost{background:transparent;border:1px dashed var(--line);color:var(--ink-soft);cursor:pointer}
.ochip.on{background:var(--forest);color:#fff}
.ochip.on i{opacity:.9}

/* reader: prev/next + fav */
.pn-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px;padding-top:16px;border-top:1px solid var(--line)}
.pn{display:flex;flex-direction:column;gap:2px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 14px;box-shadow:var(--shadow-s);transition:.18s}
.pn:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.pn.next{text-align:right}
.pn i{font-style:normal;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--sage)}
.pn b{font-family:var(--serif);font-size:1.05rem;color:var(--forest-d);line-height:1.15}
.rd-actions{display:flex;gap:8px;flex-wrap:wrap}
.favbtn.on{background:var(--gold);border-color:var(--gold);color:#3a2e0e}

/* organ pages */
.organ-head{display:flex;gap:22px;align-items:center;padding:20px 2px 8px;flex-wrap:wrap}
.organ-hz{font-size:4.2rem;line-height:1;color:var(--forest);background:var(--card);border:1px solid var(--line);border-radius:22px;padding:18px 20px;box-shadow:var(--shadow-s);font-family:var(--serif)}
.organ-py{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--gold);font-size:.6em}
.organ-desc{color:var(--ink-soft);font-size:.95rem;margin:6px 0 12px}
.osec{margin:26px 0}
.osec h2{font-family:var(--serif);font-size:1.55rem;color:var(--forest-d);margin-bottom:12px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.osec-all{margin-left:auto;font-size:.78rem;font-weight:800;color:var(--forest-l);font-family:var(--sans)}
.osec-all:hover{color:var(--forest)}

/* clinical paths */
.pattern-list{display:flex;flex-direction:column;gap:12px;margin:18px 0;max-width:860px}
.pattern{display:flex;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow-s)}
.pat-no{flex:0 0 34px;height:34px;border-radius:50%;background:var(--forest);color:#fff;font-weight:800;display:grid;place-items:center;font-size:.95rem}
.pat-body{flex:1}
.pat-body h3{font-family:var(--serif);font-size:1.3rem;color:var(--forest-d);margin-bottom:4px}
.pat-sig{font-size:.9rem;color:var(--ink);margin-bottom:4px}
.pat-tp{font-size:.8rem;color:var(--ink-soft);font-style:italic;margin-bottom:8px}
.cmp-note{font-size:.8rem;color:var(--ink-soft);margin:12px 0}

/* compare table */
.cmptab-wrap{overflow-x:auto;margin-top:14px;border-radius:16px;box-shadow:var(--shadow-s);border:1px solid var(--line);background:var(--card)}
.cmptab{width:100%;border-collapse:collapse;font-size:.88rem}
.cmptab th,.cmptab td{padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:top;text-align:left;min-width:150px}
.cmptab thead th:first-child{min-width:90px}
.cmptab tbody th{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--forest);white-space:nowrap}
.cmptab tr.cdiff td{background:rgba(201,162,75,.12)}
.cmptab tr.cdiff th{color:var(--gold)}
.cmiss{color:var(--sage);opacity:.6}
.cmptab .cmphead{border-bottom:0;padding-bottom:0;margin-bottom:0;position:relative;padding-right:26px}
.cmptab .cmphead h3 a{color:var(--forest-d)}
.cmptab .cmphead h3 a:hover{color:var(--forest-l)}
.cmpdet{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-s);margin:12px 0;overflow:hidden}
.cmpdet summary{cursor:pointer;font-weight:800;color:var(--forest-d);padding:12px 16px;font-family:var(--serif);font-size:1.15rem}
.cmpdet .content{padding:0 18px 16px}

/* graph */
.graf-wrap{position:relative;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-s);overflow:hidden;margin-top:10px}
#grafC{display:block;width:100%;touch-action:none;cursor:grab}
.graf-zoom{position:absolute;right:10px;top:10px;display:flex;flex-direction:column;gap:6px}
.graf-zoom button{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--forest-d);font-size:1.25rem;font-weight:800;line-height:1;cursor:pointer;box-shadow:var(--shadow-s)}
.graf-zoom button:active{transform:scale(.93)}
.dark .graf-zoom button{border-color:rgba(143,211,172,.16);color:var(--ink)}
.graf-legend{display:flex;gap:16px;font-size:.8rem;color:var(--ink-soft);margin:8px 2px}
.graf-legend i{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.graf-info{display:flex;gap:12px;align-items:center;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 14px;box-shadow:var(--shadow-s);margin-top:12px}
.graf-info b{font-family:var(--serif);font-size:1.05rem;color:var(--forest-d)}
.graf-btns{display:flex;gap:8px;margin-left:auto}

/* meridian map */
.map-wrap{display:grid;grid-template-columns:minmax(300px,560px) minmax(220px,1fr);gap:20px;align-items:start;margin-top:12px}
.mmap{width:100%;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-s)}
.mbody circle,.mbody rect{fill:var(--sage-l)}
.mbody line{stroke:var(--sage-l);stroke-width:15;stroke-linecap:round}
.mbody line.leg{stroke-width:19}
.mcap{font-family:var(--sans);font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;fill:var(--sage);text-anchor:middle}
.mch{cursor:pointer}
.mch .vis{fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;transition:.2s}
.mch .hit{fill:none;stroke:transparent;stroke-width:12}
.mch:hover .vis{stroke-width:4.2}
.mch.dim .vis{opacity:.16}
.mch.sel .vis{stroke-width:4.6;filter:drop-shadow(0 0 3px rgba(201,162,75,.8))}
.chlegend{display:flex;flex-wrap:wrap;gap:7px;align-content:start}
.chleg{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--card);color:var(--ink);font-weight:700;font-size:.78rem;padding:7px 12px;border-radius:99px;cursor:pointer;box-shadow:var(--shadow-s);transition:.15s}
.chleg:hover{transform:translateY(-1px)}
.chleg.on{background:var(--forest);color:#fff;border-color:var(--forest)}
.chleg i{width:10px;height:10px;border-radius:50%;display:inline-block}
.chdot{display:inline-block;width:16px;height:16px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.ch-detail{background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-s);padding:18px 20px;margin-top:16px}

/* search panel: typ chips + suggestions */
.sp-typs{display:flex;gap:6px;flex-wrap:wrap;padding:8px 8px 4px}
.sp-typs .typchip{border:1px solid var(--line);background:var(--card);color:var(--ink-soft);font-weight:700;font-size:.72rem;padding:4px 11px;border-radius:99px;cursor:pointer}
.sp-typs .typchip.on{background:var(--forest);color:#fff;border-color:var(--forest)}
.sp-sugg{display:flex;gap:6px;flex-wrap:wrap;padding:4px 8px 8px}
.sp-sugg .lchip{cursor:pointer;border:0;font-family:var(--sans)}

@media(max-width:760px){
  .map-wrap{grid-template-columns:1fr}
  .pn-nav{grid-template-columns:1fr}
  .organ-hz{font-size:3rem;padding:12px 15px}
  .cmptab th,.cmptab td{min-width:120px;padding:8px 10px}
}
.dark .cmptab tr.cdiff td{background:rgba(201,162,75,.14)}
.dark .qtile b,.dark .pn b{color:var(--forest-d)}

/* ===================== v8 — szata graficzna ===================== */
/* ikony SVG */
.ic-svg{width:1.15em;height:1.15em;vertical-align:-.18em;flex:0 0 auto}
.tile .ic .ic-svg{width:24px;height:24px;vertical-align:0}
.qtile .qi{color:var(--forest)}
.qtile .qi .ic-svg{width:27px;height:27px}
.h-ic .ic-svg{width:.95em;height:.95em;vertical-align:-.1em}
.sub-ic .ic-svg{width:15px;height:15px;vertical-align:-3px}
.cmpbtn .ic-svg,.lchip .ic-svg{width:14px;height:14px;vertical-align:-2px}

/* nagłówek hasła — kolor działu + znak wodny */
.rd-head{position:relative;overflow:hidden;background:var(--card);border:1px solid var(--line);border-left:5px solid var(--dacc,var(--forest-l));border-radius:18px;padding:18px 20px 16px;box-shadow:var(--shadow-s);margin-bottom:20px}
@supports (background:color-mix(in srgb,red 10%,white)){
  .rd-head{background:linear-gradient(135deg,color-mix(in srgb,var(--dacc,var(--forest-l)) 10%,var(--card)),var(--card) 62%)}
}
.rd-head .rd-tag{background:var(--sage-l);color:var(--forest)}
@supports (color:color-mix(in srgb,red 10%,white)){
  .rd-head .rd-tag{background:color-mix(in srgb,var(--dacc,var(--forest-l)) 15%,transparent);color:var(--dacc,var(--forest))}
}
.rd-wm{position:absolute;right:2px;top:-26px;font-family:var(--serif);font-size:8.5rem;line-height:1;color:var(--dacc,var(--forest));opacity:.07;pointer-events:none;user-select:none;z-index:0}
.rd-wm-ic .ic-svg{width:150px;height:150px;transform:rotate(-8deg)}
.rd-head>*{position:relative;z-index:1}
.rd-head .rd-wm{z-index:0}

/* wejście widoku + skeleton */
@keyframes viewIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
#app>*{animation:viewIn .28s ease both}
@keyframes shimmer{to{background-position:-200% 0}}
.skel{border-radius:12px;background:linear-gradient(90deg,var(--cream-d) 25%,var(--card) 50%,var(--cream-d) 75%);background-size:200% 100%;animation:shimmer 1.15s linear infinite}
@media (prefers-reduced-motion: reduce){#app>*{animation:none}.skel{animation:none}}

/* miniatury ziół Rossa w wynikach i kartach */
.sp-th{width:36px;height:36px;border-radius:10px;object-fit:cover;flex:0 0 auto;align-self:center;box-shadow:var(--shadow-s)}
.ecard .eth{float:right;width:54px;height:54px;border-radius:12px;object-fit:cover;margin:0 0 6px 10px;box-shadow:var(--shadow-s)}

/* graf: klikalna legenda */
.graf-legend .gleg{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--card);color:var(--ink-soft);font-weight:700;font-size:.78rem;padding:5px 12px;border-radius:99px;cursor:pointer;box-shadow:var(--shadow-s)}
.graf-legend .gleg.on{background:var(--forest);color:#fff;border-color:var(--forest)}
.graf-legend .gleg i{width:11px;height:11px;border-radius:50%;margin:0}
.gleg-hint{font-size:.72rem;color:var(--sage);align-self:center}

/* graf: filtr po nazwie */
.graf-search{display:flex;align-items:center;gap:8px;margin:8px 2px 0}
.graf-search input{flex:0 1 280px;min-width:0;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:99px;padding:7px 14px;font:inherit;font-size:16px;box-shadow:var(--shadow-s);outline:none;-webkit-appearance:none}
.graf-search input:focus{border-color:var(--forest)}
.graf-search input::-webkit-search-cancel-button{display:none}
.graf-search button{width:32px;height:32px;flex:0 0 auto;border:1px solid var(--line);background:var(--card);color:var(--ink-soft);border-radius:50%;font-size:1.05rem;font-weight:800;line-height:1;cursor:pointer;box-shadow:var(--shadow-s)}
#grafQn{font-size:.75rem;color:var(--sage);font-weight:700}
.dark .graf-search input,.dark .graf-search button{border-color:rgba(143,211,172,.16)}

/* mapa: gradient sylwetki */
:root{--body-g1:#e0ebe3;--body-g2:#c8dccd}
.dark{--body-g1:#2b3b31;--body-g2:#1f2d26}
.mbody circle,.mbody rect{fill:url(#bodyg)}
.mbody line{stroke:url(#bodyg)}

/* tryb ciemny: głębia — obrysy kart + tło aurora (tylko border-color, żeby nie zgubić akcentów) */
.dark .tile,.dark .ecard,.dark .qtile,.dark .mine-row,.dark .pattern,.dark .graf-wrap,.dark .mmap,
.dark .ch-detail,.dark .cmptab-wrap,.dark .linkbox,.dark .toc,.dark .cmpdet,.dark .rd-head,
.dark .metagrid,.dark .search-panel,.dark .organ-hz,.dark .graf-info,.dark .pn,.dark .filter-in,.dark .topsearch{border-color:rgba(143,211,172,.16)}
.dark .tile{border-top-color:var(--acc,var(--forest-l))}
.dark .rd-head{border-left-color:var(--dacc,var(--forest-l))}
.dark .ecard{border-left-color:var(--sage)}
.dark .ecard:hover{border-left-color:var(--forest-l)}
.dark .leaf-bg{background:
  radial-gradient(1100px 700px at 80% -10%,rgba(46,125,91,.30),transparent 60%),
  radial-gradient(900px 620px at -12% 22%,rgba(122,108,174,.15),transparent 55%),
  radial-gradient(820px 520px at 62% 116%,rgba(201,162,75,.10),transparent 55%),
  var(--cream)}
.dark .rd-wm{opacity:.1}

/* ===================== v8.1 — kompaktowa strona główna ===================== */
.hero{padding:26px 12px 6px}
.hero h1{font-size:clamp(2.1rem,5.5vw,3.3rem)}
.hero p{margin-top:10px;font-size:.96rem;max-width:560px}
.hero .stat{margin-top:10px;font-size:.85rem}
.quick{margin-top:20px}

/* chipy narządów: jedna linia z poziomym przewijaniem */
.organs{margin:16px auto 2px;max-width:none}
.ochips{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding:4px 2px 10px;
  -webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--sage-l) transparent}
.ochips::-webkit-scrollbar{height:6px}
.ochips::-webkit-scrollbar-thumb{background:var(--sage-l);border-radius:99px}
.ochips::-webkit-scrollbar-track{background:transparent}
.ochip{white-space:nowrap;flex:0 0 auto;scroll-snap-align:start}

@media(max-width:640px){
  .hero{padding:16px 10px 0}
  .hero p{display:none}
  .hero .stat{margin-top:6px;font-size:.78rem}
  .quick{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
  .qtile{flex-direction:column;align-items:center;gap:5px;text-align:center;padding:10px 6px}
  .qtile .qi{position:static;transform:none}
  .qtile .qi .ic-svg{width:23px;height:23px}
  .qtile b{font-size:.76rem;line-height:1.15}
  .qtile i{display:none}
  .mine-row{padding:8px 10px}
  .section-title{margin-top:14px}
}

/* ===================== v9 — wyszukiwanie++ / wzorce / zioła / bezpieczeństwo ===================== */
/* konteksty trafień + częściowe dopasowania */
.sp-item{flex-wrap:wrap}
.sp-snip{flex-basis:100%;font-size:.78rem;color:var(--ink-soft);line-height:1.45;padding-top:2px}
.sp-snip:empty{display:none}
.sp-part{color:var(--gold);font-weight:800}
/* przeglądarka ziół */
.hb-count{font-size:.8rem;font-weight:800;color:var(--sage);margin:4px 0 12px;text-transform:uppercase;letter-spacing:.5px}
/* wzorce */
.pat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.pat-card{display:flex;flex-direction:column;gap:2px;background:var(--card);border:1px solid var(--line);border-left:4px solid #7a6cae;border-radius:14px;padding:12px 14px;box-shadow:var(--shadow-s);transition:.18s}
.pat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.pat-card b{font-family:var(--serif);font-size:1.08rem;color:var(--forest-d);line-height:1.15}
.pat-card i{font-size:.76rem;color:var(--gold);font-style:italic}
.pat-mini{font-size:.76rem;color:var(--ink-soft);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* bezpieczeństwo */
.sf-sec{background:var(--card);border:1px solid var(--line);border-left:4px solid #c0492a;border-radius:14px;padding:14px 18px;box-shadow:var(--shadow-s);margin:14px 0}
.sf-sec h2{font-family:var(--serif);font-size:1.25rem;color:var(--forest-d);margin-bottom:8px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.sf-sec .content{font-size:.9rem}
/* punkty po wskazaniu */
.pt-group{margin:10px 0}
.pt-group>b{display:flex;align-items:center;gap:7px;font-size:.85rem;color:var(--forest-d);margin-bottom:6px}
/* tabele w treści: poziome przewijanie na mobile */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1em 0;border-radius:12px}
.tbl-scroll table{margin:0;min-width:480px}
.dark .pat-card,.dark .sf-sec{border-color:rgba(143,211,172,.16)}
.dark .pat-card{border-left-color:#7a6cae}
.dark .sf-sec{border-left-color:#c0492a}