:root{
    --bg:#f4f1ea; --card:#fff; --ink:#2b2a27; --muted:#1a1918; --col: #778899;
    --accent:#36454F; --danger:#b23a3a;
    --line:#e3ddcf; --soft:#faf7ef;
    --breakfast:#1a1918; --lunch:#1a1918; --snack:#1a1918; --dinner:#1a1918;
  }
  *{box-sizing:border-box}
  html,body{height:100%}
  body{margin:0;font:14px/1.4 -apple-system,Segoe UI,Roboto,sans-serif;
       background:var(--bg);color:var(--ink);display:flex;flex-direction:column}
  header{padding:16px 24px;background:var(--accent);color:#fff;
         display:flex;align-items:center;gap:16px;flex-wrap:wrap;flex-shrink:0}
  header h1{margin:0;font-size:20px;font-weight:600}
  header .sub{opacity:.8;font-size:13px}
  .wrap{flex:1;display:grid;
        grid-template-columns:280px 1fr minmax(320px,400px);gap:0;
        overflow:hidden}
  @media(max-width:1200px){
    .wrap{grid-template-columns:1fr;overflow:auto}
    .cheatsheet,.main,.total-card{border:none;border-bottom:1px solid var(--line)}
  }
  .card{background:var(--card);padding:20px;overflow-y:auto;height:100%}
  .card h2{margin:0 0 12px;font-size:16px;text-transform:uppercase;
           letter-spacing:.8px;color:var(--muted);font-weight:600}
  .row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:10px; padding: 10px; background: var(--soft); border-radius: 8px;}
  button,input,select{font:inherit}
  button{cursor:pointer;border:1px solid var(--line);background:var(--soft);
         color:var(--ink);padding:7px 14px;border-radius:6px;font-size:13px}
  button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
  button.danger{color:var(--danger);border-color:#e5bcbc;background:#fff5f5}
  button:hover{filter:brightness(.96)}
  input[type=text],input[type=number],select,input[type=time]{
    border:1px solid var(--line);border-radius:6px;padding:7px 10px;
    background:#fff;min-width:0;font-size:13px}
  input[type=number],input[type=time]{width:90px}
  label.check{display:inline-flex;gap:6px;align-items:center;
              padding:5px 12px;border:1px solid var(--line);
              border-radius:8px;background:var(--soft);cursor:pointer;
              user-select:none;font-size:13px;transition:all .15s}
  label.check input{margin:0}
  label.check.on{border-color:var(--accent)}
  
  .days-tabs{display:flex;gap:0;border-bottom:2px solid var(--line);margin-bottom:16px;overflow-x:auto}
  .day-tab{padding:10px 18px;border:1px solid transparent;border-bottom:none;
           background:transparent;cursor:pointer;font-size:13px;color:var(--muted);
           white-space:nowrap;transition:all .15s;border-radius:6px 6px 0 0;
           margin-bottom:-2px}
  .day-tab:hover{background:var(--soft);color:var(--ink)}
  .day-tab.active{background:var(--card);color:var(--accent);font-weight:600;
                  border-color:var(--line);border-bottom:2px solid var(--accent)}
  
  .meal-block{border-radius:8px;margin-bottom:12px;
              background:var(--soft);overflow:hidden;transition:all .15s;cursor:pointer}
  .meal-block.active{border-color:var(--accent);box-shadow:0 2px 8px rgba(74,107,58,.15)}
  .meal-header{padding:12px 16px;display:flex;align-items:center;gap:10px;transition:background .15s}
  .meal-block:hover .meal-header{background:rgba(0,0,0,.02)}
  .meal-block.active .meal-header{background:rgb(212 187 148 / 30%);}
  .meal-title{flex:1;font-size:18px;font-weight:600}
  .meal-block[data-meal="breakfast"] .meal-title{color:var(--breakfast)}
  .meal-block[data-meal="lunch"] .meal-title{color:var(--lunch)}
  .meal-block[data-meal="snack"] .meal-title{color:var(--snack)}
  .meal-block[data-meal="dinner"] .meal-title{color:var(--dinner)}
  .meal-meta{display:flex;gap:12px;margin:10px 16px 12px;flex-wrap:wrap;align-items:center}
  .meal-meta label{font-size:12px;color:var(--muted);display:flex;gap:4px;align-items:center}
  .meal-content{padding:0 16px 16px}
  
  .products-table{width:100%;border-collapse:collapse;margin-bottom:10px}
  .products-table th{text-align:left;font-size:11px;text-transform:uppercase;
                     letter-spacing:.5px;color:var(--muted);padding:6px 8px;
                     border-bottom:1px solid var(--line);font-weight:600}
  .products-table td{padding:6px 8px;border-bottom:1px solid var(--line)}
  .products-table tr:last-child td{border-bottom:none}
  .products-table input[type=text]{width:100%}
  .products-table button{padding:4px 8px;font-size:12px}
  .add-btn{margin-top:4px;font-size:13px}
  .meal-subtotal{font-size:12px;color:var(--muted);margin-top:10px;
                 padding-top:10px;border-top:1px dashed var(--line)}
  
  .total-card{position:relative}
  .total-card .print-btn-wrap{margin-bottom:16px}
  .total-row{display:flex;justify-content:space-between;padding:6px 0;
             border-bottom:1px dashed var(--line);font-size:13px}
  .total-row:last-child{border-bottom:none}
  .total-row b{font-weight:600}
  .empty{color:var(--muted);font-style:italic;padding:10px 0;font-size:13px}
  .hint{font-size:12px;color:var(--muted);margin-top:8px}
  .per-person{font-size:11px;color:var(--muted);display:block}
  /* .day-header{display:flex;justify-content:space-between;align-items:center;
              margin-bottom:12px;flex-wrap:wrap;gap:10px} */
    .day-header{
  font-size:18px;
  font-weight:600;
  color:var(--accent);
  margin:30px 0 10px;
  padding-bottom:6px;
  border-bottom:2px solid var(--accent);
}
.day-table{
  margin-bottom:20px;
}
  .day-title{font-size:22px;font-weight:600;color:var(--accent)}
  .meals-for-day{display:flex;gap:6px;flex-wrap:wrap; margin-top:10px}

  .cheatsheet{border-right:1px solid var(--line)}
  .cheat-search{margin-bottom:10px}
  .cheat-search input{width:100%}
  .cheat-list{overflow-y:auto; overflow-x:hidden;}
  .cheat-cat{font-size:14px;text-transform:uppercase;letter-spacing:.5px;
             color:var(--muted);margin:12px 0 6px;padding:0 2px;font-weight:600}
  .cheat-cat:first-child{margin-top:0}
  .cheat-item{display:flex;justify-content:space-between;align-items:center;
              padding:6px 10px;border-radius:5px;cursor:pointer;font-size:13px;
              margin-bottom:2px;transition:all .15s}
  .cheat-item:hover{background:var(--soft);transform:translateX(2px)}
  .cheat-item .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .cheat-item .dose{color:var(--muted);font-size:11px;margin-left:8px;white-space:nowrap}
  .cheat-item.added{background:#e8f0dc;color:var(--accent)}

  .toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);
         background:var(--accent);color:#fff;padding:12px 20px;border-radius:8px;
         font-size:13px;box-shadow:0 4px 12px rgba(0,0,0,.15);
         opacity:0;transition:opacity .2s, transform .2s;pointer-events:none;
         z-index:1000;max-width:90vw}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(-4px)}

  @media print{
    body{background:#fff}
    header, .wrap, .toast{display:none !important}
    .print-table{display:block !important}
    .print-header{display:block !important;margin-bottom:20px}
    .print-header h1{font-size:24px;margin:0 0 10px}
    .print-header p{margin:4px 0;color:#555}
  }
  .print-table, .print-header{display:none}
  .print-table table{width:100%;border-collapse:collapse;font-size:12px;margin-bottom:20px}
  .print-table th, .print-table td{border:1px solid #333;padding:6px 8px;text-align:left;vertical-align:top}
  .print-table th{background:#f5f5f5;font-weight:600}
  .print-table .day-row{background:#fafafa}
  .print-table .meal-name{font-weight:600}
  .print-table .products{font-size:11px}
  .print-table .products div{margin:2px 0}