.site-header nav { flex-wrap:wrap; justify-content:flex-end; gap:12px 22px; }
.recipe-explainer,.recipe-layout { max-width:1100px; margin:auto; padding:55px 32px 80px; }
.recipe-explainer { max-width:950px; }
.recipe-explainer h2,.recipe-overview h2,.recipe-builder h2,.recipe-sources h2 { font-size:29px; }
.recipe-layout { display:grid; grid-template-columns:minmax(0,760px) minmax(150px,220px); gap:60px; border-top:1px solid var(--line); }
.recipe-layout article { min-width:0; }
.recipe-overview h3 { margin:28px 0 8px; font-size:19px; }
.recipe-builder { margin-top:45px; padding:30px; background:var(--soft); border:1px solid var(--line); border-radius:8px; }
.recipe-builder fieldset { min-width:0; border:0; margin:25px 0; padding:0; }
.recipe-builder legend { font-weight:650; margin-bottom:15px; }
.recipe-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.recipe-builder label { display:block; font-size:14px; font-weight:600; }
.recipe-builder input,.recipe-builder select,.recipe-builder textarea { display:block; width:100%; min-width:0; min-height:46px; margin-top:7px; border:1px solid #9da9b8; border-radius:4px; color:var(--ink); background:white; padding:10px; font:inherit; font-weight:400; }
.recipe-builder textarea { resize:vertical; }
.recipe-builder > div > form > .recipe-fields { margin:20px 0; }
.recipe-actions { display:flex; flex-wrap:wrap; gap:12px; margin:20px 0; }
.recipe-actions button { border:1px solid var(--blue); border-radius:4px; background:var(--blue); color:white; min-height:44px; padding:10px 17px; font:inherit; font-weight:600; cursor:pointer; }
.recipe-actions .secondary { color:var(--blue); background:white; }
.recipe-builder :is(input,select,textarea,button):focus-visible,.base-recipe summary:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
.field-help { font-size:13px; color:var(--muted); margin-top:12px; }
.output-label { margin-top:28px; }
.recipe-builder .recipe-output { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:13px; line-height:1.6; }
#recipe-status { font-size:14px; min-height:1.6em; }
.recipe-sidebar { align-self:start; border-top:2px solid var(--blue); padding-top:20px; }
.recipe-sidebar h2 { font-size:19px; }
.recipe-sidebar ul { list-style:none; padding:0; margin:0 0 25px; }
.recipe-sidebar li { margin-bottom:14px; font-size:14px; }
.recipe-sidebar [aria-current] { color:var(--ink); font-weight:700; }
.base-recipe { margin:35px 0; }
.base-recipe summary { cursor:pointer; font-weight:600; }
.base-recipe pre { white-space:pre-wrap; overflow-wrap:anywhere; padding:20px; border:1px solid var(--line); background:var(--soft); font:13px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace; }
.recipe-sources { border-top:1px solid var(--line); padding-top:25px; margin-top:35px; font-size:14px; }
.review-overdue { border-left-color:#986100; }
[hidden] { display:none !important; }
@media(max-width:800px) { .recipe-layout { display:block; padding:35px 20px 60px; }.recipe-sidebar { margin-top:45px; }.recipe-explainer { padding:40px 20px; }.recipe-builder { padding:22px; }.site-header { flex-wrap:wrap; padding-block:15px; gap:12px; }.site-header nav { justify-content:flex-start; } }
@media(max-width:500px) { .recipe-fields { grid-template-columns:1fr; }.recipe-builder { padding:18px; }.site-header nav { gap:10px 17px; } }