
:root{--paper:#FBF8F2;--card:#FFFFFF;--ink:#2B2622;--muted:#6F655C;--accent:#C4562B;--herb:#4F6B4A;--line:#E7E0D5;
--herbbg:#EEF3EC}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#1C1A17;--card:#252220;--ink:#F1EBE4;
--muted:#B3A89C;--accent:#E57A4D;--herb:#8FB287;--line:#3A3531;--herbbg:#27302A}}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.6 Inter,system-ui,sans-serif}
a{color:var(--accent)}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
header.top{border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;padding-bottom:14px}
.brand{font:700 22px/1 Fraunces,Georgia,serif;color:var(--ink);text-decoration:none}.brand span{color:var(--accent)}
nav a{font-size:16px;font-weight:600;text-decoration:none;margin-left:18px;white-space:nowrap}
h1,h2,h3{font-family:Fraunces,Georgia,serif;line-height:1.15;margin:0 0 .4em}
h1{font-size:clamp(34px,6vw,56px)}h2{font-size:clamp(26px,4vw,40px)}h3{font-size:22px}
.lede{font-size:20px;color:var(--muted);max-width:720px}
.muted{color:var(--muted)}.small{font-size:16px}
section{padding:40px 0}
.hero{padding:48px 0 24px}
.kicker{font:600 14px/1 Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.gfb{display:inline-block;font:600 13px/1 Inter,sans-serif;color:var(--herb);background:var(--herbbg);border:1px solid var(--herb);
border-radius:999px;padding:5px 10px;white-space:nowrap}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.06);
display:flex;flex-direction:column;text-decoration:none;color:var(--ink)}
.card img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;background:#d9c9b4}
.card .in{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.card h3{font-size:20px;margin:0}
.card .meta{font-size:15px;color:var(--muted)}.card .meta b{color:var(--accent)}
.free{font:700 12px/1 Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--accent);
border-radius:999px;padding:5px 9px;align-self:flex-start}
.book{display:grid;grid-template-columns:220px 1fr;gap:28px;align-items:start;padding:28px 0;border-top:1px solid var(--line)}
.book img.cover{width:220px;height:auto;aspect-ratio:8.5/11;object-fit:cover;border-radius:6px;box-shadow:0 6px 18px rgba(0,0,0,.18);background:#d9c9b4}
.pending{width:220px;aspect-ratio:8.5/11;border-radius:6px;background:var(--herbbg);border:2px dashed var(--herb);display:grid;
place-items:center;text-align:center;padding:16px;color:var(--herb);font:600 16px/1.4 Inter,sans-serif}
.btn{display:inline-block;font:600 16px/1 Inter,sans-serif;background:var(--accent);color:#fff;text-decoration:none;
border-radius:10px;padding:13px 18px;margin:6px 8px 6px 0}
.btn.ghost{background:transparent;color:var(--accent);border:2px solid var(--accent)}
.toc{columns:2 320px;column-gap:40px;padding:0;margin:0;list-style:none}
.toc li{break-inside:avoid;padding:8px 0;border-bottom:1px dotted var(--line);display:flex;justify-content:space-between;gap:12px;font-size:17px}
.toc li.ch{border:0;padding-top:22px;font:700 20px/1.2 Fraunces,Georgia,serif;column-span:none}
.toc li.locked{color:var(--muted)}.toc li .tag{font-size:13px;color:var(--muted);white-space:nowrap}
.toc li.open{background:linear-gradient(90deg,rgba(196,86,43,.10),transparent);border-radius:6px;padding-left:8px;font-weight:600}
.toc li.open a{text-decoration:none}.toc li.open .tag{color:var(--accent);font-weight:700}
.rhead{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;padding:32px 0 8px}
.rhead img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:12px;background:#d9c9b4}
.facts{display:flex;flex-wrap:wrap;gap:10px 26px;margin:14px 0;padding:12px 0;border-top:2px solid var(--accent);border-bottom:1px solid var(--line)}
.facts div{font-size:15px;color:var(--muted)}.facts b{display:block;font-size:20px;color:var(--ink);font-weight:600}
.facts .hands b{color:var(--accent)}
.tnote{font-size:16px;color:var(--muted)}
.cols{display:grid;grid-template-columns:minmax(260px,5fr) 7fr;gap:36px;padding:16px 0 8px}
.ing ul{list-style:none;padding:0;margin:0}.ing li{padding:8px 0;border-bottom:1px dotted var(--line)}
.ing li.grp{font-weight:700;border:0;padding-top:14px}
.ing .gf{display:inline-block;font-size:13px;font-weight:600;color:var(--herb);background:var(--herbbg);border-radius:999px;padding:1px 8px;margin-left:4px}
.method ol{padding-left:24px;margin:0}.method li{margin:0 0 14px;padding-left:4px}.method li::marker{font-weight:700;color:var(--accent)}
.notes{padding-left:20px}
.gfnote{font-size:15px;color:var(--muted);border-left:4px solid var(--herb);padding:8px 12px;background:var(--herbbg);border-radius:0 8px 8px 0;margin-top:18px}
.printbox{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin:20px 0}
.fromb{display:flex;gap:18px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin:28px 0}
.fromb img{width:90px;height:auto;border-radius:4px}
.hero-video{position:relative;border-radius:14px;overflow:hidden;background:#2b2622;margin:18px 0 8px;aspect-ratio:1280/704}
.hero-video video{width:100%;height:100%;display:block;object-fit:cover}
.hero-video button{position:absolute;right:12px;bottom:12px;font:600 14px Inter,sans-serif;background:rgba(0,0,0,.55);color:#fff;
border:0;border-radius:999px;padding:8px 14px;cursor:pointer}
.hero-video button.snd{right:auto;left:12px;background:#E57A4D}
footer{border-top:1px solid var(--line);margin-top:40px;padding:24px 0 40px;font-size:15px;color:var(--muted)}
@media (max-width:760px){.book{grid-template-columns:1fr}.book img.cover,.pending{width:160px}.rhead,.cols{grid-template-columns:1fr;gap:18px}
header.top .wrap{flex-wrap:wrap;row-gap:6px}nav a{margin:0 14px 0 0;font-size:15px}}
@media print{header.top,footer,.printbox,.fromb,nav{display:none}body{background:#fff;color:#000;font-size:12pt}}
