:root{--bg:#100a05;--paper:#d8bb7e;--paper2:#b9863e;--ink:#281307;--muted:#6b431e;--gold:#d99a2b;--red:#732116;--black:#080503}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#5b3513 0,transparent 36%),linear-gradient(135deg,#090604,#201207 55%,#0a0604);font-family:Georgia,Times New Roman,serif;color:var(--ink)}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.12;background-image:linear-gradient(90deg,#fff 1px,transparent 1px),linear-gradient(#fff 1px,transparent 1px);background-size:44px 44px;mix-blend-mode:overlay}.hero{padding:56px 20px 36px;text-align:center;color:#f8e4a6;border-bottom:3px double rgba(217,154,43,.6);background:linear-gradient(#0005,#0008),radial-gradient(circle,#7b4619aa,transparent 62%)}.eyebrow{letter-spacing:.35em;text-transform:uppercase;color:#f3ca66;font-size:13px}.hero h1{margin:.2em 0;font-size:clamp(38px,7vw,82px);line-height:.92;text-shadow:0 5px 18px #000}.subtitle{max-width:860px;margin:16px auto 0;color:#e9d3a3;font-size:18px;line-height:1.6}.wrap{width:min(1240px,calc(100% - 28px));margin:24px auto 64px}.toolbar{position:sticky;top:12px;z-index:10;display:grid;grid-template-columns:1.4fr 1fr 1fr auto;gap:10px;padding:14px;border:2px solid #542a0c;border-radius:24px;background:linear-gradient(135deg,#e7cb91,#b9863e);box-shadow:0 18px 50px #0008}input,select,button{width:100%;border:1px solid #4e290b80;border-radius:14px;padding:12px 14px;font:inherit;color:var(--ink);background:#fff1c9c9;outline:none}button,.btn{cursor:pointer;font-weight:700;background:linear-gradient(#f1bd48,#b36c1f);color:#261204;text-decoration:none;border:1px solid #61330e;border-radius:14px;padding:12px 14px;display:inline-flex;justify-content:center;align-items:center}.grid{display:grid;grid-template-columns:360px 1fr;gap:18px;margin-top:18px}.panel,.detail,.card{border-radius:26px;border:2px solid #502b0ee6;background:linear-gradient(90deg,#502b0e14,transparent 10%,transparent 90%,#502b0e14),radial-gradient(circle at top left,#ffffff44,transparent 30%),linear-gradient(135deg,#e0c28a,#c89c57 52%,#b98942);box-shadow:0 22px 65px #0008,inset 0 0 0 1px #ffffff50}.panel{position:sticky;top:104px;max-height:calc(100vh - 140px);overflow:auto;padding:14px}.recipe-list{display:grid;gap:9px}.recipe-link{display:block;text-decoration:none;color:inherit;padding:13px;border-radius:16px;background:#ffefc473;border:1px solid #48260b59}.recipe-link:hover,.recipe-link.active{background:linear-gradient(135deg,#7c2319e0,#4e1c10e0);color:#ffedba;border-color:#f3ca66}.recipe-link b{display:block;font-size:17px}.recipe-link small{display:block;margin-top:4px;opacity:.82}.detail{padding:clamp(20px,3vw,38px);min-height:650px}.badge{display:inline-block;padding:6px 11px;border-radius:999px;background:#2b1708d9;color:#f6d889;font-size:13px;letter-spacing:.08em;text-transform:uppercase}.detail h2{margin:14px 0 8px;font-size:clamp(34px,5vw,62px);line-height:.95;color:#3c1907}.alias{color:#6b4720;font-size:17px}.effect{font-size:18px;line-height:1.65;color:#462a10}.meta{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.pill{border-radius:999px;background:#2b1708d9;color:#f8df9d;padding:8px 12px}.section{margin-top:22px;padding:18px;border-radius:22px;background:#ffeebe61;border:1px solid #48260b52}.section h3{margin:0 0 14px;font-size:25px}.chip{border-radius:999px;padding:8px 11px;background:#2b1708d9;color:#f9e2a4}.steps{margin:0;padding-left:24px;line-height:1.7;font-size:17px}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-top:18px}.card{padding:18px;color:inherit;text-decoration:none}.card:hover{transform:translateY(-2px)}.card h2{margin:0 0 8px}.note{margin-top:18px;padding:14px 18px;border-radius:18px;background:#31522a2e;border:1px solid #31522a61;color:#3b2a10;line-height:1.55}@media(max-width:900px){.toolbar,.grid{grid-template-columns:1fr}.panel{position:static;max-height:none}}.recipe-detail{padding-top:24px;padding-bottom:64px}.back-link{display:inline-block;margin-bottom:18px;color:var(--ink, #2b1708);font-weight:700}.detail-card{border-radius:28px;border:2px solid rgba(80,43,14,.9);padding:clamp(20px,4vw,38px);background:radial-gradient(circle at top left,rgba(255,255,255,.28),transparent 30%),linear-gradient(135deg,#e0c28a,#c89c57 52%,#b98942);box-shadow:0 22px 65px #00000059,inset 0 0 0 1px #ffffff4d}.detail-head{display:grid;grid-template-columns:1fr minmax(180px,260px);gap:24px;padding-bottom:24px;border-bottom:3px double rgba(69,36,10,.45)}.detail-head h2{margin:12px 0 4px;font-size:clamp(34px,6vw,64px);line-height:.95}.alias{margin:0 0 18px;color:#6b4720;font-style:italic}.effect{max-width:760px;font-size:18px;line-height:1.65}.meta-box{align-self:start;border-radius:20px;padding:16px;background:#2b1708db;color:#f9e3a7}.meta-box p{margin:0 0 12px}.meta-box p:last-child{margin-bottom:0}.meta-box span{display:block;color:#d6a94a;font-size:13px;text-transform:uppercase;letter-spacing:.08em}.detail-grid{display:grid;grid-template-columns:minmax(240px,.8fr) 1.2fr;gap:18px;margin-top:24px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span{border-radius:999px;padding:8px 11px;background:#2b1708d6;color:#f9e2a4}.box ol{margin:0;padding-left:22px;line-height:1.7}@media(max-width:860px){.detail-head,.detail-grid{grid-template-columns:1fr}}