/* The shared look for the recipe pages (tools/recipes.awk) and Kitchen SOS question pages (tools/build-sos.py). */
:root{color-scheme:light;--ink:#2B231F;--red:#C0392B;--stone:#F7F3EE;--line:rgba(43,35,31,.16);--mut:#675C55}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--ink);font:16px/1.6 'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif}
a{color:var(--red)}
.top{border-bottom:1px solid var(--line);padding:12px 16px}.top div,main,.foot div{max-width:760px;margin:0 auto}
.brand{font:600 20px 'Fraunces',Georgia,serif;color:var(--ink);text-decoration:none}
.nav{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px;font-size:14px}.nav a{color:var(--mut);text-decoration:none}.nav a:hover{color:var(--ink)}
main{padding:18px 16px 32px}.crumb{font-size:14px;color:var(--mut);margin:0 0 8px}.crumb a{color:var(--mut)}
h1{font:600 clamp(30px,6vw,42px)/1.12 'Fraunces',Georgia,serif;margin:0 0 12px}h2{font:600 22px/1.25 'Fraunces',Georgia,serif;margin:28px 0 10px}
.pills{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}.pill{display:inline-block;padding:3px 11px;border:1px solid var(--line);border-radius:999px;font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;background:#fff}.pill.tm{background:var(--ink);border-color:var(--ink);color:#fff}.pill.ovn{background:#FBEBD9;border-color:#F0C9A5;color:#8A3B12}
.lede{color:var(--mut);margin:0 0 6px}ul.ing{padding-left:20px}ul.ing li{margin:4px 0}ul.ing small{display:block;color:var(--mut);font-size:13.5px}
ol.st{padding-left:22px}ol.st li{margin:6px 0}.tip,.no{background:#FBEBD9;border-radius:10px;padding:10px 14px;font-size:15px;margin:10px 0}.no{background:var(--stone);border-left:3px solid var(--red)}
.acts{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 6px}.btn{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:12px;font-weight:700;font-size:15px;text-decoration:none;border:1.5px solid var(--red);color:var(--red);background:#fff}.btn.go{background:var(--red);color:#fff}
.more{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;padding:0;list-style:none}.more a{display:block;padding:10px 12px;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--ink);font-weight:600}.more a:hover{border-color:var(--ink)}
.cat{margin-top:8px}.cat ul{columns:2 220px;padding-left:20px}.cat li{margin:3px 0;break-inside:avoid}
.hero{display:block;width:100%;max-width:520px;height:auto;border-radius:14px;margin:4px 0 16px;background:var(--stone)}
.foot{border-top:1px solid var(--line);padding:16px;font-size:13.5px;color:var(--mut)}.foot p{margin:0 0 6px}
/* Kitchen SOS question pages */
.qmeta{color:var(--mut);font-size:14px;margin:0 0 12px}.qbody{font-size:17px;white-space:pre-line;margin:0 0 6px}
.ans{list-style:none;padding:0;margin:0}.ans li{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:0 0 10px}.ans li.best{border-color:#3E8A35;background:#F1F7EE}
.ans .who{font-size:13.5px;color:var(--mut);margin:0 0 4px}.ans .who b{color:var(--ink)}.ans .badge{display:inline-block;margin-left:6px;padding:0 8px;border-radius:999px;background:#3E8A35;color:#fff;font-size:12px;font-weight:700}
.ans p{margin:0;white-space:pre-line}.qlist{list-style:none;padding:0}.qlist li{border-bottom:1px solid var(--line);padding:10px 0}.qlist a{font-weight:600;color:var(--ink);text-decoration:none}.qlist small{display:block;color:var(--mut)}
/* picture cards on the category pages and recipes/ */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;list-style:none;padding:0;margin:16px 0}
.dc{display:block;height:100%;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;transition:border-color .15s,transform .15s}
.dc:hover{border-color:var(--ink);transform:translateY(-2px)}.dc img,.dc .noimg{display:block;width:100%;height:auto;aspect-ratio:5/3;background:var(--stone)}
.dc b{display:block;padding:8px 10px 0;font-size:15px;line-height:1.3}.dc small{display:block;padding:2px 10px 10px;color:var(--mut);font-size:13px}
.az{columns:3 200px;padding-left:20px;font-size:15px}.az li{margin:3px 0;break-inside:avoid}
