:root{color-scheme:light;--navy:#002244;--green:#69be28;--ink:#263b45}*{box-sizing:border-box}body{margin:0;background:#f4f7fa;color:var(--ink);font:1rem/1.5 system-ui,-apple-system,sans-serif}header{background:var(--navy);color:white;padding:1.1rem max(1rem,calc((100vw - 820px)/2));display:flex;align-items:center;justify-content:space-between;gap:1rem}header a{color:white;text-decoration:none;font-weight:800;font-size:1.2rem;letter-spacing:.07em}header strong{color:var(--green)}header span{font-size:.8rem;letter-spacing:.1em}main{max-width:820px;margin:auto;padding:1.5rem 1rem 3rem}.picker{margin-bottom:1.5rem}.picker label{display:block;font-weight:700;margin-bottom:.5rem}select{width:100%;font:inherit;color:var(--navy);padding:.9rem 2rem .9rem 1rem;background:white;border:1px solid #95aab5;border-radius:8px}article{background:white;border:1px solid #d6e0e5;border-radius:14px;overflow:hidden}.recipe-heading{display:grid;grid-template-columns:1.25fr 1fr;align-items:center;background:#eef4f0}.recipe-heading>div{padding:1.5rem}.eyebrow{color:#316b30;font-weight:700;margin:0 0 .5rem;font-size:.9rem}h1{font:700 clamp(1.65rem,4vw,2.25rem)/1.13 Georgia,serif;color:var(--navy);margin:0 0 .9rem}.servings{margin:0;font-size:.95rem}#photo{width:100%;height:100%;min-height:230px;object-fit:cover}.list-top{padding:1.5rem 1.5rem .5rem}h2{font-size:1.2rem;margin:0 0 .3rem}.list-top p{margin:.25rem 0}#count{color:#316b30;font-weight:700}.ingredients{list-style:none;padding:0 1.5rem;margin:.5rem 0 1rem}.ingredients li{border-bottom:1px solid #e0e7eb}.ingredients label{display:flex;gap:.9rem;align-items:flex-start;padding:1rem 0;cursor:pointer}.ingredients input{width:1.4rem;height:1.4rem;flex:none;margin:.1rem 0;accent-color:#275e35}.ingredients li.have span{text-decoration:line-through;color:#647781}.actions{display:flex;flex-wrap:wrap;gap:.7rem;padding:1rem 1.5rem}button{font:700 1rem/1.2 system-ui;min-height:48px;border:1px solid #93a8b3;border-radius:8px;padding:.85rem 1rem;background:white;color:var(--navy);cursor:pointer}button.primary{background:var(--navy);border-color:var(--navy);color:white}button.quiet{border-color:transparent;text-decoration:underline;font-weight:500}button:hover{filter:brightness(.93)}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible,textarea:focus-visible{outline:3px solid var(--green);outline-offset:3px}#message{margin:0 1.5rem;color:#316b30}textarea{display:block;width:calc(100% - 3rem);margin:1rem 1.5rem;min-height:180px;font:1rem/1.5 system-ui}.note{font-size:.9rem;color:#52656f;margin:1.5rem}footer{padding-top:1.5rem;font-size:.9rem}footer a{color:var(--navy);text-underline-offset:4px}footer p{color:#647781}.picker~#invalid{background:#fff4d2;padding:1rem;border-radius:8px}[hidden]{display:none!important}@media(max-width:560px){header span{font-size:.7rem}main{padding:1rem .75rem 2rem}.recipe-heading{grid-template-columns:1fr}.recipe-heading>div{padding:1.25rem}#photo{height:190px;min-height:0}.list-top,.actions{padding-left:1.25rem;padding-right:1.25rem}.ingredients{padding:0 1.25rem}.primary{flex:1 0 100%}.note{margin:1.25rem}}@media print{body{background:white}header,.picker,.actions,#message,#fallback,.note,footer,#photo,#invalid{display:none!important}main{max-width:none;padding:0}article{border:none}.recipe-heading{background:white;display:block}.ingredients li.have{display:none}.ingredients input{display:none}.ingredients label{padding:.3rem 0}.list-top p:not(#count){display:none}}
.tabs{display:flex;gap:.6rem;margin-bottom:1rem}.tabs button{flex:1}.tabs button[aria-pressed=true]{background:var(--navy);color:white}.tabs span{display:inline-block;background:#eaf4e2;color:#244a18;padding:.1rem .5rem;border-radius:1rem;margin-left:.3rem}.shopping{background:white;border:1px solid #d6e0e5;border-radius:14px;margin-top:1rem;overflow:hidden}#message{margin:0 0 1rem;min-height:1.5rem}.recipe-heading input{display:block;width:90px;margin:.35rem 0 1rem}input:not([type=checkbox]){font:inherit;min-height:48px;border:1px solid #95aab5;border-radius:6px;padding:.6rem;width:100%;max-width:100%}.recipe-heading input{width:90px}.recipe-notes{margin:1rem 1.5rem}.recipe-notes p{font-size:.95rem}.plan{padding:1.5rem}.plan>p{margin:.75rem 0 1rem}.planned-recipe{display:grid;grid-template-columns:minmax(0,1fr) 100px auto;gap:1rem;align-items:center;padding:1rem 0;border-bottom:1px solid #d6e0e5}.planned-recipe label{font-size:.9rem}.planned-recipe input{display:block;width:85px;margin-top:.25rem}details{margin-top:1rem}summary{cursor:pointer;font-weight:700;color:var(--navy);min-height:44px;padding:.5rem 0}.saved-controls,#extra-form{display:grid;grid-template-columns:1fr;gap:.5rem;margin-top:.5rem}.saved-controls button{justify-self:start}.aisle{padding:0 1.5rem}.aisle h3{margin:1.1rem 0 0;color:var(--navy);font-size:1.1rem;background:#eef4f0;padding:.65rem .8rem;border-radius:6px}.aisle ul{list-style:none;padding:0;margin:0}.grocery{padding:1rem .15rem;border-bottom:1px solid #e0e7eb}.grocery strong{font-weight:600}.ingredient-note{font-size:.875rem;color:#53656d;margin:.3rem 0}.item-controls{display:flex;align-items:center;flex-wrap:wrap;gap:.7rem;margin-top:.5rem}.item-controls label{display:flex;gap:.45rem;align-items:center;cursor:pointer;font-size:.9rem;min-height:44px}.item-controls input{width:1.3rem;height:1.3rem;accent-color:#275e35}.item-controls button{min-height:44px;padding:.5rem;font-size:.875rem}.grocery.have strong,.grocery.bought strong{text-decoration:line-through;color:#647781}.grocery.bought{background:#f5faf0}.edit-item{display:grid;grid-template-columns:2fr 1fr auto auto;gap:.5rem}.add-extra{margin:1rem 1.5rem}#extra-form{grid-template-columns:1fr 1fr}#extra-form label{grid-column:1/-1}#extra-form input,#extra-form select{grid-column:1/-1}#extra-form button{grid-column:1/-1;justify-self:start}.shopping .actions .primary{flex:none}.note{font-size:.9rem}input:focus-visible{outline:3px solid var(--green);outline-offset:3px}@media(max-width:560px){.tabs{gap:.4rem}.tabs button{padding:.75rem .5rem}.planned-recipe{grid-template-columns:1fr auto;gap:.6rem}.planned-recipe strong{grid-column:1/-1}.plan{padding:1.25rem}.aisle{padding:0 1.25rem}.edit-item{grid-template-columns:1fr 1fr}.edit-item input{grid-column:1/-1}.shopping .actions .primary{flex:1 0 100%}}@media print{.tabs,.recipe-heading label,.recipe-heading input,.recipe-heading button,.recipe-notes,.item-controls,.add-extra,.plan>button,.plan>details,.planned-recipe button,.planned-recipe label{display:none!important}.shopping{border:none;margin:0}.aisle{break-inside:avoid}.grocery.have,.grocery.bought{display:none}.grocery{padding:.3rem 0}.list-top>p:not(#count){display:none}.plan{padding:0 1.5rem}.planned-recipe{display:block;padding:.2rem 0}.aisle h3{background:white;padding:0}.ingredient-note{font-size:10pt}.recipe-heading>div{padding:0 1.5rem}}
