/* Grocery list generator page; loaded after the shared site and workspace stylesheets. */
.gen{padding:28px max(24px,calc((100vw - 1440px)/2)) 64px}
.gen .crumbs{font-size:14px;color:var(--muted);margin:0 0 14px}.gen .crumbs a{color:var(--ink2)}
.gen-head{max-width:780px;margin-bottom:22px}
.gen-head h1{font-size:44px;line-height:1.08;margin:0 0 12px}
.gen-head .lead{font-size:18px;line-height:1.6;color:var(--ink2);margin:0}
.gen-wrap{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;align-items:start}
.gen-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;min-height:40px;margin-bottom:10px}
.gen-bar h2{font:700 22px/1.2 var(--sans);letter-spacing:-.02em;margin:0}
.gen-bar small{font-size:14px;font-weight:500;color:var(--muted);margin-left:6px}
.gen-recipes{display:grid;gap:12px}
.gen-card{border:1px solid var(--line);border-radius:14px;background:#fff;padding:14px;margin:0;min-width:0;display:grid;gap:10px}
.gen-row{display:grid;grid-template-columns:minmax(0,1fr) 110px 110px;gap:10px}
.gen-card-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px}
.gen-mult{font-size:13.5px;color:var(--muted)}
.gen-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0}
.gen-paste{border:1px dashed #b9c9bd;border-radius:12px;padding:10px 14px;margin:0 0 12px;background:var(--wash)}
.gen-paste summary{cursor:pointer;font-weight:700;min-height:32px;display:flex;align-items:center}
.gen-paste .help{margin:6px 0 8px}
.gen-in>.help{margin:0}
.gen-card textarea{resize:vertical}.gen-paste .btn{margin-top:8px}
.gen-out{position:sticky;top:12px;margin-top:50px}
.gen-errors{margin:10px 0 0;padding:8px 12px 8px 28px;background:var(--err-wash);color:var(--err);border-radius:10px;font-size:14px}
.gen-group{padding:10px 0 4px;border-bottom:1px dashed #d6e0d8}
.gen-group h3{font:700 12px/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 4px}
.gen-group ul{list-style:none;margin:0;padding:0}
.gen-item label{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:8px;align-items:start;padding:5px 0;cursor:pointer;min-height:40px}
.gen-item input{width:20px;height:20px;margin:3px 0 0;accent-color:var(--mint)}
.gen-name{display:flex;flex-direction:column;min-width:0;overflow-wrap:anywhere}
.gen-name b{font-weight:600}
.gen-name small{font-size:12.5px;color:var(--muted);line-height:1.4}
.gen-q{white-space:nowrap;text-align:right}
.gen-item.got .gen-name b,.gen-item.got .gen-q{text-decoration:line-through;color:#8b938d}
.gen-doc{max-width:860px;margin:48px 0 0}
.gen-doc h2{font:600 28px/1.2 var(--display);margin:40px 0 12px}
.gen-doc p,.gen-doc li{font-size:16.5px;line-height:1.65;color:var(--ink2)}
.gen-rules,.gen-limits{padding-left:22px;margin:0 0 8px}
.gen-rules li,.gen-limits li{margin-bottom:8px}
.gen-doc .table-wrap{margin-bottom:14px}
.gen-doc .units td,.gen-doc .units th{vertical-align:top}
.gen-doc .home-guides{grid-template-columns:repeat(2,minmax(0,1fr))}
.gen-sheet{display:none}
.gen-jump{display:none;margin-left:auto;font-size:14px;font-weight:650;color:var(--tomato-dk)}
@media (max-width:900px){
  .gen-wrap{grid-template-columns:1fr}
  .gen-out{position:static;margin-top:8px}
  .gen-jump{display:inline-flex;align-items:center;min-height:36px}
}
@media (max-width:640px){
  .gen{padding:20px 16px 48px}
  .gen-head h1{font-size:32px}
  .gen-head .lead{font-size:16.5px}
  .gen-row{grid-template-columns:1fr 1fr}
  .gen-row .grow{grid-column:1/-1}
  .gen-doc h2{font-size:24px}
  .gen-doc .home-guides{grid-template-columns:1fr}
  .gen-doc .units{font-size:14px}.gen-doc .units th,.gen-doc .units td{padding:8px 10px}
}
@media print{
  body.gen-page>main,body.gen-page>header,body.gen-page>footer,body.gen-page>.skip{display:none!important}
  body.gen-page>#genSheet{display:block!important;font:11pt/1.35 var(--sans);color:#000}
  .gen-sheet h2{font:700 20pt/1.1 var(--sans);margin:0 0 2mm}
  .gen-sheet>p{margin:0 0 5mm;padding-bottom:2mm;border-bottom:2pt solid #000;font-size:10pt}
  .gen-sheet-cols{columns:2;column-gap:10mm}
  .gen-sheet section{break-inside:avoid;margin-bottom:5mm}
  .gen-sheet h3{font:700 10.5pt var(--sans);text-transform:uppercase;letter-spacing:.1em;margin:0 0 1.5mm;padding-bottom:1mm;border-bottom:1pt solid #000}
  .gen-sheet ul{list-style:none;margin:0;padding:0}
  .gen-sheet li{padding:1.4mm 0 1.4mm 6mm;border-bottom:.4pt solid #bbb;position:relative}
  .gen-sheet li::before{content:"";position:absolute;left:0;top:2mm;width:3.4mm;height:3.4mm;border:1pt solid #000}
  .gen-sheet li.got{text-decoration:line-through;color:#666}
}