/* =====================================================================
   iORicetto — tema scuro, minimal
   Fondo nero, testo bianco, accento senape. Pulsanti a pillola, link senza sottolineatura.
   ===================================================================== */
:root {
  color-scheme: dark;
  --bg: #111111;
  --surface: #181818;       /* schede e pannelli */
  --soft: #1f1f1f;          /* campi, fondi leggeri */
  --raise: #262626;         /* hover */
  --line: #2b2b2b;
  --line-strong: #3a3a3a;
  --text: #e9e5df;
  --ink: #ffffff;
  --muted: #9b958d;
  --gold: #edb654;
  --gold-dark: #d9a03c;
  --gold-soft: rgba(237, 182, 84, .12);
  --lilac: #d7c1d3;
  --accent: var(--gold);
  --ok: #5aa877; --ok-soft: rgba(90, 168, 119, .14);
  --err: #ef6b62; --err-soft: rgba(239, 107, 98, .12);
  --warn: rgba(237, 182, 84, .08);
  --radius: 14px;
  --radius-sm: 10px;
  --serif: "Bitter", Georgia, Cambria, "Times New Roman", serif;
  --slab: "Arvo", Georgia, serif;
  --sans: "Work Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ease: cubic-bezier(.2, .8, .2, 1);
}
* { box-sizing: border-box; }
html { background: var(--bg); }
body { margin: 0; font: 17px/1.65 var(--serif); background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
::selection { background: var(--gold); color: #111; }

/* link: niente sottolineatura, colore d'accento, linea sottile che compare al passaggio */
a { color: var(--gold); text-decoration: none; background-image: linear-gradient(currentColor, currentColor);
    background-size: 0 1px; background-position: 0 100%; background-repeat: no-repeat;
    transition: background-size .25s var(--ease), color .2s; }
a:hover { background-size: 100% 1px; color: #f6cd7c; }
a.btn, nav a, .dd-panel a, .brand, .card-cover, .card-title, .match-foto, .match-nome, .admin-card, .meta-pill, .cook-close, .price-link { background-image: none; }

main { max-width: 1080px; margin: 0 auto; padding: 40px 20px 110px; }
h1, h2, h3 { color: var(--ink); font-family: var(--slab); font-weight: 700; line-height: 1.2; }
h1 { font-size: 1.55rem; margin: .1em 0 .55em; letter-spacing: -.01em; }
h2 { font: 700 .74rem var(--sans); margin: 2em 0 1em; text-transform: uppercase; letter-spacing: .18em; color: var(--muted); }
h2::after { content: ""; display: block; width: 28px; height: 2px; background: var(--gold); margin-top: 10px; border-radius: 2px; }
h3 { font-size: 1.1rem; }

/* ---------- testata */
.promo { background: #0a0a0a; color: var(--muted); text-align: center; font: 600 .68rem/1 var(--sans);
         letter-spacing: .2em; text-transform: uppercase; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.promo span { color: var(--gold); }
.topbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 28px;
          padding: 16px max(20px, calc((100% - 1080px) / 2 + 20px)); background: rgba(17,17,17,.86);
          backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px);
          border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 5; }
.brand { display: inline-flex; align-items: center; gap: 12px; font: 700 1.75rem/1 var(--slab); color: #fff; letter-spacing: -.02em; }
.brand:hover { color: #fff; }
.brand .io { color: #fff; font-style: italic; }
.brand-txt { color: #fff; }
.brand-logo { height: 44px; width: 44px; object-fit: contain; padding-right: 12px; border-right: 1px solid var(--line-strong); flex-shrink: 0; }
.brand .ver { align-self: flex-end; margin-bottom: 3px; font: 600 .62rem var(--sans); color: var(--muted); letter-spacing: .1em; }
/* menu: tutte le voci nello stesso stile (testo tenue, capsula grigia sulla voce attiva) */
.topbar { flex-wrap: nowrap; }
.menu { display: flex; align-items: center; gap: 2px; flex: 1; min-width: 0; }
.menu > a, .dropdown > summary { font: 500 .82rem/1 var(--sans); letter-spacing: .01em; color: var(--muted);
        padding: 10px 14px; border-radius: 999px; white-space: nowrap; cursor: pointer; background: none;
        transition: color .2s, background .2s; }
.menu > a:hover, .dropdown > summary:hover { color: #fff; background: var(--soft); }
.menu > a.on, .dropdown > summary.on { color: #fff; background: var(--raise); }
.dropdown { position: relative; }
.dropdown > summary { list-style: none; display: inline-flex; align-items: center; gap: 8px; user-select: none; }
.dropdown > summary::-webkit-details-marker { display: none; }
.dropdown[open] > summary { color: #fff; background: var(--raise); }
.caret { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
         transform: translateY(-2px) rotate(45deg); transition: transform .2s; opacity: .7; }
.dropdown[open] .caret { transform: translateY(1px) rotate(225deg); }
.dd-panel { position: absolute; top: calc(100% + 8px); left: 0; z-index: 30; min-width: 210px; padding: 6px;
            background: #1b1b1b; border: 1px solid var(--line-strong); border-radius: 14px;
            box-shadow: 0 18px 40px rgba(0,0,0,.55); display: flex; flex-direction: column;
            animation: ddIn .16s var(--ease); }
.dd-right { left: auto; right: 0; }
@keyframes ddIn { from { opacity: 0; transform: translateY(-4px); } }
.dd-panel a, .dd-panel button { display: block; width: 100%; text-align: left; font: 500 .86rem/1 var(--sans); color: var(--text);
            padding: 11px 12px; border-radius: 9px; background: none; border: 0; cursor: pointer; }
.dd-panel a:hover, .dd-panel button:hover { background: var(--raise); color: #fff; }
.dd-panel a.on { color: var(--gold); }
.dd-panel form { margin: 0; }
.dd-panel button { color: var(--err); }
.dd-sep { font: 600 .62rem var(--sans); text-transform: uppercase; letter-spacing: .16em; color: var(--muted);
          padding: 12px 12px 6px; border-top: 1px solid var(--line); margin-top: 4px; }
.dd-info { font: 400 .78rem var(--sans); color: var(--muted); padding: 8px 12px 10px; border-bottom: 1px solid var(--line);
           margin-bottom: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 240px; }
.user-menu { margin-left: auto; flex-shrink: 0; }
.user-menu > summary { padding: 5px 12px 5px 5px; border: 1px solid var(--line); }
.avatar { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--gold); color: #111;
          font: 700 .8rem/1 var(--sans); }
.user-name { color: var(--text); max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 900px) {
  .topbar { flex-wrap: wrap; }
  .brand { order: 1; }
  .user-menu { order: 2; }
  .menu { order: 3; flex-basis: 100%; flex-wrap: wrap; margin: 0 -6px; }
  .user-name { display: none; }
  .user-menu > summary { padding: 4px 8px 4px 4px; }
}
@media (max-width: 480px) { .menu > a, .dropdown > summary { padding: 9px 10px; font-size: .8rem; } }

/* ---------- pulsanti: pillole minimal */
.head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 6px; }
.head h1 { margin-bottom: .2em; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.actions form { margin: 0; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 600 .8rem/1 var(--sans);
       letter-spacing: .02em; padding: 12px 20px; border-radius: 999px; border: 1px solid var(--line-strong);
       background: transparent; color: var(--text); cursor: pointer; white-space: nowrap;
       transition: background .2s, border-color .2s, color .2s, transform .12s; }
.btn:hover { background: var(--soft); border-color: #555; color: #fff; }
.btn:active { transform: scale(.97); }
.btn:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--gold); outline-offset: 2px; }
.btn.primary { background: var(--gold); border-color: var(--gold); color: #111; }
.btn.primary:hover { background: #f3c56d; border-color: #f3c56d; color: #111; }
.btn.ghost { border-color: transparent; color: var(--muted); }
.btn.ghost:hover { color: #fff; background: var(--soft); }
.btn.danger { color: var(--err); border-color: transparent; }
.btn.danger:hover { background: var(--err-soft); color: var(--err); border-color: transparent; }
.btn.cook-start { background: #fff; border-color: #fff; color: #111; }
.btn.cook-start:hover { background: var(--gold); border-color: var(--gold); color: #111; }
.btn.icon { width: 38px; height: 38px; padding: 0; border-radius: 50%; letter-spacing: 0; font-size: .8rem; }
.small-btn { padding: 8px 14px; font-size: .74rem; }
.btn.full { width: 100%; padding: 15px; margin-top: 6px; }
.btn:disabled { opacity: .5; cursor: wait; }

/* ---------- moduli */
input, select, textarea { font: 16px/1.4 var(--serif); padding: 11px 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
  background: var(--soft); color: var(--ink); width: 100%; transition: border-color .2s, background .2s; }
input::placeholder, textarea::placeholder { color: #6f6a64; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--gold); background: #222; }
input[type=checkbox] { accent-color: var(--gold); }
input[type=file] { padding: 9px; }
input[type=file]::file-selector-button { font: 600 .75rem var(--sans); border: 0; border-radius: 999px; padding: 8px 14px;
  margin-right: 12px; background: var(--raise); color: #fff; cursor: pointer; }
select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
         background-position: calc(100% - 18px) 55%, calc(100% - 13px) 55%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 34px; }
input.small { width: 96px; }
label { display: block; font: 600 .7rem var(--sans); text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }
label input, label select, label textarea { margin-top: 7px; text-transform: none; letter-spacing: 0; font-weight: 400; }
.form > label, .form .row { margin-bottom: 16px; }
.row { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.row.tight { gap: 6px; align-items: center; flex-wrap: nowrap; }
.row.tight select { width: auto; max-width: 45%; }
.row.tight input, .row.tight select { padding: 8px 12px; font-size: 15px; }
.grow { flex: 1 1 200px; }
.grow2 { flex: 2 1 260px; }
.add-form { margin: 14px 0 24px; padding: 18px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); align-items: center; }
.add-form select { width: auto; }
.form-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.inline label { display: inline-flex; align-items: center; gap: 10px; }
.inline input { margin: 0; }
.check { display: flex; align-items: center; gap: 10px; color: var(--text); margin: 16px 0; font: 400 .95rem var(--serif);
         text-transform: none; letter-spacing: 0; }
.check input { width: 18px; height: 18px; margin: 0; }

/* ---------- testi e messaggi */
.muted { color: var(--muted); }
.small-txt { font-size: .82rem; }
.descr { margin: 6px 0 0; }
.lead { font-size: 1.12rem; font-style: italic; color: var(--text); }
.center { text-align: center; margin: 22px 0; }
code { font-size: .88em; background: var(--soft); padding: 2px 6px; border-radius: 6px; }
.empty { padding: 44px 20px; text-align: center; color: var(--muted); background: var(--surface); border: 1px dashed var(--line-strong);
         border-radius: var(--radius); font-style: italic; }
.sticky-bar { position: fixed; left: 0; right: 0; bottom: 0; padding: 14px 16px; text-align: center; z-index: 4;
              background: rgba(17,17,17,.9); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid var(--line); }
.flash { padding: 14px 18px; margin-bottom: 22px; background: var(--ok-soft); border: 1px solid rgba(90,168,119,.35);
         border-radius: var(--radius-sm); color: var(--ink); }
.flash.errore { background: var(--err-soft); border-color: rgba(239,107,98,.4); }
.flash.info { background: var(--gold-soft); border-color: rgba(237,182,84,.35); }
.badge { display: inline-block; font: 700 .6rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase;
         background: var(--gold); color: #111; padding: 6px 10px; border-radius: 999px; vertical-align: middle; }
.badge.soft { background: var(--raise); color: var(--lilac); }
.badge.ok { background: var(--ok); color: #fff; }
.badge.gold { background: var(--gold); color: #111; }
h1 .badge { font-size: .58rem; margin-left: 6px; }

/* ---------- elenco ricette */
.search { display: flex; gap: 8px; margin: 12px 0 30px; }
.search input { font-size: 17px; padding: 13px 18px; border-radius: 999px; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 30px 24px; }
.card { position: relative; }
.card-cover { display: block; aspect-ratio: 4 / 3; position: relative; border-radius: var(--radius);
              background: var(--c, var(--surface)); overflow: visible; transition: transform .35s var(--ease); }
.card-cover:hover { transform: translateY(-3px); }
.card-cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius); }
.card-cover .initial { position: absolute; inset: 0; display: grid; place-items: center; font: 700 5rem/1 var(--slab); color: rgba(255,255,255,.14); }
.card-cover .tag { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 50%); white-space: nowrap;
                   background: var(--gold); color: #111; font: 700 .64rem/1 var(--sans); letter-spacing: .14em;
                   text-transform: uppercase; padding: 8px 14px; border-radius: 999px; box-shadow: 0 6px 18px rgba(0,0,0,.4); }
.card-body { padding: 24px 4px 0; text-align: center; }
.card-title { font: 700 1.2rem/1.3 var(--slab); color: #fff; }
.card-title:hover { color: var(--gold); }
.card .meta { font: 600 .68rem var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin: 8px 0 0; }
.card .descr { font-size: .92rem; color: var(--muted); }
.card .actions { margin-top: 14px; justify-content: center; }
.pick { position: absolute; top: 10px; right: 10px; z-index: 2; background: rgba(17,17,17,.7); backdrop-filter: blur(6px);
        padding: 8px; line-height: 0; border-radius: 999px; cursor: pointer; }
.pick input { width: 18px; height: 18px; margin: 0; }
.card.plain { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; text-align: center; }

/* ---------- pagina ricetta */
.recipe-hero { text-align: center; padding: 6px 0 30px; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
.recipe-photo { max-width: 760px; margin: 0 auto 26px; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 20px; background: var(--surface); }
.recipe-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.recipe-hero .kicker { font: 700 .7rem var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--gold); }
.recipe-hero h1 { font-size: 2.7rem; margin: .25em 0 .35em; }
.recipe-hero .lead { max-width: 680px; margin: 0 auto 18px; color: var(--muted); }
.recipe-hero .actions { justify-content: center; margin-top: 20px; }
.meta-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.meta-pill { font: 600 .72rem/1 var(--sans); letter-spacing: .06em; color: var(--text); background: var(--surface);
             border: 1px solid var(--line); padding: 9px 14px; border-radius: 999px; }
a.meta-pill:hover { border-color: var(--gold); color: var(--gold); }
.two-col { display: grid; grid-template-columns: 1fr 1.5fr; gap: 28px; margin-top: 10px; }
.two-col.even { grid-template-columns: 1fr 1fr; }
@media (max-width: 760px) { .two-col, .two-col.even { grid-template-columns: 1fr; } }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 8px 26px 24px; }
.panel.tinted { background: #151515; }
.panel h2:first-child { margin-top: 1.2em; }
.ingr { padding-left: 0; list-style: none; margin: 0; }
.ingr li { padding: 11px 0; border-bottom: 1px solid var(--line); }
.ingr li:last-child { border: 0; }
.ingr .q { font-weight: 700; color: var(--gold); display: inline-block; min-width: 92px; }
.price-link { font: 700 .7rem var(--sans); color: var(--muted); margin-left: 6px; opacity: .6; }
.price-link:hover { opacity: 1; color: var(--gold); }
.steps { list-style: none; counter-reset: passo; padding: 0; margin: 0; }
.steps li { counter-increment: passo; position: relative; padding: 4px 0 20px 54px; }
.steps li::before { content: counter(passo); position: absolute; left: 0; top: 0; width: 34px; height: 34px; border-radius: 50%;
                    display: grid; place-items: center; background: var(--gold); color: #111; font: 700 .95rem/1 var(--slab); }
.steps li.muted::before { display: none; }
.steps li.muted { padding-left: 0; }

/* ---------- form ricetta */
.rows { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.ingr-row { display: flex; gap: 8px; }
.ingr-row input[name=ing_nome] { flex: 1; }
.step-row { display: flex; gap: 10px; align-items: flex-start; }
.step-row .num { width: 30px; padding-top: 10px; font: 700 1rem var(--slab); color: var(--gold); }
.vbtns { display: flex; flex-direction: column; gap: 4px; }
.vbtns .btn { width: 30px; height: 26px; padding: 0; font-size: .65rem; border-radius: 8px; }
.foto-edit { display: flex; gap: 18px; align-items: flex-start; margin-bottom: 16px; padding: 16px;
             background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.foto-anteprima { width: 180px; aspect-ratio: 4 / 3; flex-shrink: 0; background: var(--soft); border: 1px dashed var(--line-strong);
                  border-radius: var(--radius-sm); display: grid; place-items: center; text-align: center; color: var(--muted);
                  font: 600 .75rem var(--sans); overflow: hidden; }
.foto-anteprima img { width: 100%; height: 100%; object-fit: cover; }
.foto-campi { flex: 1; }
@media (max-width: 560px) { .foto-edit { flex-direction: column; } .foto-anteprima { width: 100%; } }

/* ---------- tabelle */
.table { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--surface); border: 1px solid var(--line);
         border-radius: var(--radius); overflow: hidden; }
.table th, .table td { padding: 12px 14px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.table tr:last-child td { border-bottom: 0; }
.table th { font: 600 .66rem var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); background: #141414; }
.table tbody tr { transition: background .15s; }
.table tbody tr:hover td { background: #1c1c1c; }
.table form { margin: 0; }
.table tr.warn td { background: var(--warn); }
.table tr.best td { background: var(--ok-soft); }
.table td.upd { font-size: .78rem; color: var(--muted); white-space: nowrap; }
.num-col { text-align: center !important; width: 86px; }
.rep-sep td { background: #141414 !important; font: 700 .66rem var(--sans); color: var(--gold); text-transform: uppercase; letter-spacing: .16em; }
@media (max-width: 600px) { .hide-sm { display: none; } }

/* ---------- ordinamento reparti */
.sortable { list-style: none; padding: 0; margin: 16px 0; }
.sortable li { display: flex; align-items: center; gap: 12px; padding: 12px 14px; margin-bottom: 8px; background: var(--surface);
               border: 1px solid var(--line); border-radius: var(--radius-sm); cursor: grab; transition: border-color .2s; }
.sortable li:hover { border-color: var(--gold); }
.sortable li.dragging { opacity: .4; }
.sortable .handle { color: var(--muted); }
.sortable .pos { min-width: 30px; font: 700 1.05rem var(--slab); color: var(--gold); }

/* ---------- lista della spesa */
.reparto { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 4px 22px 12px; margin-bottom: 16px; break-inside: avoid; }
.reparto h2 { margin-top: 1.1em; color: var(--gold); }
.small-link { font: 400 .8rem var(--serif); text-transform: none; letter-spacing: 0; margin-left: 8px; }
.spesa { list-style: none; padding: 0; margin: 0; }
.spesa li { border-bottom: 1px solid var(--line); }
.spesa li:last-child { border: 0; }
.spesa label { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 12px 0; color: var(--text);
               font: 400 1rem var(--serif); text-transform: none; letter-spacing: 0; cursor: pointer; }
.spesa label b { color: #fff; }
.spesa input { width: 20px; height: 20px; margin: 0; }
.spesa .small-txt { flex-basis: 100%; padding-left: 32px; font-style: italic; color: var(--muted); }
.spesa input:checked ~ .voce { text-decoration: line-through; opacity: .4; }
.spesa .costo { margin-left: auto; font: 700 .9rem var(--sans); color: var(--gold); font-variant-numeric: tabular-nums; }
.gr-tot { float: right; font: 600 .8rem var(--sans); color: var(--muted); letter-spacing: .04em; }
.totale-box { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; background: linear-gradient(135deg, #1d1a14, #181818);
              border: 1px solid rgba(237,182,84,.3); border-radius: var(--radius); padding: 20px 24px; margin-bottom: 22px; }
.totale-box > span:first-child { font: 700 .7rem var(--sans); text-transform: uppercase; letter-spacing: .16em; color: var(--muted); }
.totale-box b { font: 700 2rem var(--slab); color: var(--gold); }
.totale-box .small-txt { flex-basis: 100%; color: var(--muted); }

/* ---------- prezzi e costi */
.costi { margin-top: 34px; }
.costi .table { margin: 10px 0; }
.price-row { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.price-row input { margin: 0; padding: 8px 12px; }
.price-row .eur { width: 92px; }
.price-row .qrif { width: 72px; }
.price-row .urif { width: 112px; }
.price-row .per { color: var(--muted); font-style: italic; }
@media (max-width: 600px) { .price-row { flex-wrap: wrap; } }

/* ---------- importa */
.originale { margin-bottom: 20px; }
.originale summary { cursor: pointer; color: var(--gold); font: 600 .74rem var(--sans); letter-spacing: .06em; }
.originale pre { white-space: pre-wrap; font: .92rem/1.55 var(--serif); background: var(--surface); border: 1px solid var(--line);
                 border-radius: var(--radius-sm); padding: 16px; max-height: 320px; overflow: auto; }
.oppure { text-align: center; color: var(--muted); margin: 22px 0 12px; font-style: italic; }
.bookmarklet { margin-top: 38px; border-color: rgba(237,182,84,.3); }
.bookmarklet ol { padding-left: 22px; }
.bookmarklet li { margin-bottom: 8px; }

/* ---------- accesso e account */
.auth-box { max-width: 420px; margin: 24px auto 0; padding: 34px 32px 26px; background: var(--surface); border: 1px solid var(--line); border-radius: 20px; }
.auth-box .kicker { font: 700 .7rem var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--gold); text-align: center; }
.auth-box h1 { text-align: center; font-size: 1.8rem; margin-bottom: 22px; }
.auth-box pre { white-space: pre-wrap; background: var(--soft); padding: 8px 10px; margin: 8px 0 0; font-size: .85rem; border-radius: 8px; }
.auth-logo { display: block; width: 120px; margin: 0 auto 16px; }
.add-user { margin-top: 28px; }

/* ---------- amministrazione */
.admin-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; margin-top: 20px; }
.admin-card { display: flex; flex-direction: column; gap: 6px; padding: 26px; background: var(--surface); border: 1px solid var(--line);
              border-radius: 18px; color: var(--text); transition: border-color .2s, transform .25s var(--ease); }
.admin-card:hover { border-color: var(--gold); transform: translateY(-3px); color: var(--text); }
.admin-ico { font-size: 1.8rem; color: var(--gold); }
.admin-tit { font: 700 1.3rem var(--slab); color: #fff; }
.admin-sub { color: var(--muted); font-size: .92rem; }
.admin-go { margin-top: 10px; font: 600 .78rem var(--sans); color: var(--gold); }
.sost-add { align-items: flex-end; }
.sost-add .btn { margin-bottom: 1px; }
.sost-gruppo { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 6px 18px 12px; margin-bottom: 14px; scroll-margin-top: 110px; }
.sost-gruppo h3 { font: 600 .74rem var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); margin: 12px 0 10px; }
.sost-gruppo h3 span { color: #fff; font: 700 1.05rem var(--slab); text-transform: none; letter-spacing: 0; margin-left: 4px; }
.sost-riga { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.sost-riga .freccia { color: var(--gold); width: 18px; flex-shrink: 0; }
.sost-riga input[name=sostituto] { flex: 1 1 30%; }
.sost-riga input[name=nota] { flex: 2 1 50%; color: var(--muted); }
.sost-riga input { padding: 8px 12px; font-size: 15px; }
@media (max-width: 640px) { .sost-riga { flex-wrap: wrap; } .sost-riga input[name=nota] { flex-basis: 100%; order: 3; } }

/* ---------- cosa cucino? */
.dispensa-form { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; }
.tag-box { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; background: var(--soft); border: 1px solid var(--line-strong);
           border-radius: var(--radius-sm); padding: 8px; min-height: 56px; margin: 7px 0 14px; cursor: text; }
.tag-box:focus-within { border-color: var(--gold); }
.tag-box input { flex: 1 1 220px; border: 0; background: transparent; padding: 6px; min-width: 0; }
.tag-box input:focus { background: transparent; }
.chip { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 7px 13px; font: 600 .82rem/1.2 var(--sans); }
.chip.tag { background: var(--gold); color: #111; }
.chip.tag button { border: 0; background: rgba(0,0,0,.15); color: #111; width: 20px; height: 20px; border-radius: 50%;
                   cursor: pointer; font-size: .68rem; line-height: 1; padding: 0; }
.chip.sugg { border: 1px solid var(--line-strong); background: transparent; color: var(--text); cursor: pointer; margin: 0 6px 6px 0; transition: all .2s; }
.chip.sugg:hover { border-color: var(--gold); color: #fff; }
.chip.sugg.on { background: var(--gold); border-color: var(--gold); color: #111; }
.suggeriti { margin-bottom: 10px; }
.suggeriti summary { cursor: pointer; font: 600 .74rem var(--sans); letter-spacing: .06em; color: var(--gold); margin-bottom: 10px; }
.sugg-gruppo { margin-bottom: 8px; }
.sugg-titolo { display: block; font: 600 .64rem var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); margin: 8px 0 6px; }
.risultati-titolo { margin-top: 38px; }
.match-list { display: flex; flex-direction: column; gap: 16px; }
.match { display: flex; gap: 20px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; }
.match.perfetta { border-color: rgba(90,168,119,.5); }
.match-foto { flex: 0 0 140px; aspect-ratio: 1; background: var(--c, var(--soft)); display: grid; place-items: center;
              overflow: hidden; border-radius: var(--radius-sm); }
.match-foto img { width: 100%; height: 100%; object-fit: cover; }
.match-foto span { font: 700 3rem var(--slab); color: rgba(255,255,255,.18); }
.match-corpo { flex: 1; min-width: 0; }
.match-testa { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.match-nome { font: 700 1.25rem var(--slab); color: #fff; }
.match-nome:hover { color: var(--gold); }
.meter { position: relative; height: 6px; background: var(--raise); border-radius: 999px; overflow: hidden; margin: 12px 0 8px; }
.meter div { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px; }
.meter-sost { background: rgba(237,182,84,.55); }
.meter-ok { background: var(--ok); }
.match-meta { margin: 0 0 8px; font-size: .92rem; color: var(--muted); }
.match-meta b { color: #fff; }
.mancanti { list-style: none; padding: 0; margin: 0 0 12px; font-size: .92rem; }
.mancanti li { padding: 7px 0; border-top: 1px solid var(--line); }
.manca-nome { color: var(--err); font-weight: 700; margin-right: 6px; }
.manca-nome em { color: var(--muted); font-weight: 400; }
.sost-lista { color: var(--muted); }
.sost { display: inline-block; margin: 2px 4px 2px 0; padding: 3px 10px; border-radius: 999px; background: var(--raise); color: var(--text); }
.sost small { color: var(--muted); }
.sost.si { background: var(--ok-soft); color: #8fd3a8; font-weight: 600; }
.match .actions { margin-top: 4px; }
@media (max-width: 600px) {
  .match { flex-direction: column; padding: 0 0 14px; overflow: hidden; }
  .match-foto { flex-basis: auto; aspect-ratio: 16 / 9; border-radius: 0; }
  .match-corpo { padding: 0 14px; }
}

/* ---------- piè di pagina */
.footer { text-align: center; color: var(--muted); padding: 36px 16px 100px; border-top: 1px solid var(--line);
          font: 600 .66rem var(--sans); letter-spacing: .18em; text-transform: uppercase; }
.footer-logo { display: block; width: 96px; margin: 0 auto 14px; opacity: .85; }
.footer .brand-sm { display: block; font: 700 1.2rem var(--slab); color: #fff; letter-spacing: 0; text-transform: none; margin-bottom: 6px; }
.footer .brand-sm .io { color: #fff; font-style: italic; }

/* ---------- telefono */
@media (max-width: 700px) {
  body { font-size: 16px; }
  main { padding: 26px 16px 110px; }
  h1 { font-size: 1.35rem; }
  .recipe-hero h1 { font-size: 2rem; }
  .topbar { position: static; padding: 14px 16px; }
  .brand { font-size: 1.5rem; gap: 10px; }
  .brand-logo { height: 36px; width: 36px; padding-right: 10px; }
  .promo { font-size: .6rem; letter-spacing: .12em; }
  .card-cover { aspect-ratio: 16 / 9; }
  .panel { padding: 6px 16px 18px; }
  .auth-box { padding: 26px 18px; }
}

/* ---------- stampa: sempre chiaro, per risparmiare inchiostro */
@media print {
  :root { --bg: #fff; --surface: #fff; --text: #000; --ink: #000; --muted: #444; --line: #ccc; }
  body, html { background: #fff; color: #000; }
  .promo, .topbar, .no-print, .flash, .sticky-bar { display: none !important; }
  .reparto, .panel, .table { border: 0; padding: 0; background: #fff; }
  .spesa label b, .totale-box b { color: #000; }
  .totale-box { background: #fff; border: 1px solid #000; }
  .footer { display: block !important; padding: 20px 0 0; }
  .footer-logo { filter: invert(1); }
  .recipe-photo { max-width: 360px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }

/* ---------- modalità preparazione */
body.cook { background: #111; color: #f4f1ec; height: 100vh; height: 100dvh; overflow: hidden;
            display: flex; flex-direction: column; overscroll-behavior: none; }
.cook-top { width: 100%; min-width: 0; display: flex; align-items: center; gap: 14px; padding: 14px max(16px, env(safe-area-inset-left)) 12px; }
.cook-close { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0;
              background: rgba(255,255,255,.08); color: #fff; text-decoration: none; font-size: 1.1rem; }
.cook-close:hover { background: rgba(255,255,255,.18); color: #fff; }
.cook-title { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cook-kicker { font: 700 .66rem var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--gold); }
.cook-name { font: 700 1.15rem/1.25 var(--slab); color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cook-ingr-btn { flex-shrink: 0; border: 0; border-radius: 999px; padding: 11px 16px; cursor: pointer;
                 background: rgba(255,255,255,.08); color: #fff; font: 700 .72rem var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.cook-ingr-btn:hover { background: rgba(255,255,255,.18); }
.cook-progress { height: 3px; background: rgba(255,255,255,.1); }
.cook-bar { height: 100%; width: 0; background: var(--gold); transition: width .45s cubic-bezier(.2,.8,.2,1); }

.cook-stage { flex: 1; min-height: 0; width: 100%; max-width: none; margin: 0; padding: 0; min-width: 0; overflow: hidden; position: relative; z-index: 1; touch-action: pan-y; }
.cook-track { display: flex; width: 100%; height: 100%; transition: transform .45s cubic-bezier(.2,.8,.2,1); will-change: transform; }
.cook-slide { flex: 0 0 100%; width: 100%; min-width: 0; height: 100%; overflow-y: auto; display: flex; align-items: center; justify-content: center;
              padding: 24px 20px 130px; }
.cook-card { width: 100%; min-width: 0; max-width: 760px; overflow-wrap: anywhere; text-align: center; opacity: .35; transform: scale(.96);
             transition: opacity .45s, transform .45s cubic-bezier(.2,.8,.2,1); margin: auto 0; }
.cook-slide.attiva .cook-card { opacity: 1; transform: none; }
.cook-step-label { font: 700 .72rem var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--lilac); margin-bottom: 16px; }
.cook-num { width: 84px; height: 84px; margin: 0 auto 26px; border-radius: 50%; display: grid; place-items: center;
            background: var(--gold); color: #111; font: 700 2.2rem/1 var(--slab); box-shadow: 0 10px 40px rgba(237,182,84,.25); }
.cook-num.done { background: #5aa877; color: #fff; box-shadow: 0 10px 40px rgba(90,168,119,.3); }
.cook-text { font: 400 clamp(1.35rem, 3.6vw, 2.15rem)/1.5 var(--serif); color: #fff; margin: 0; }
.cook-text.small { font-size: 1.1rem; color: #cfc8bf; }
.cook h1 { color: #fff; font-size: clamp(1.6rem, 4vw, 2.4rem); margin: 0 0 18px; }
.cook-photo { width: 150px; height: 150px; margin: 0 auto 20px; border-radius: 50%; overflow: hidden; border: 3px solid var(--gold); }
.cook-photo img { width: 100%; height: 100%; object-fit: cover; }
.cook-checklist { list-style: none; padding: 0; margin: 0 auto; max-width: 480px; text-align: left; }
.cook-checklist li { border-bottom: 1px solid rgba(255,255,255,.1); }
.cook-checklist label { display: flex; gap: 14px; align-items: center; padding: 12px 4px; cursor: pointer;
                        font: 400 1.08rem var(--serif); color: #f4f1ec; text-transform: none; letter-spacing: 0; }
.cook-checklist b { color: var(--gold); margin-right: 4px; }
.cook-checklist input { width: 22px; height: 22px; margin: 0; accent-color: var(--gold); flex-shrink: 0; }
.cook-checklist input:checked + span { opacity: .4; text-decoration: line-through; }
.cook-hint { margin-top: 24px; color: #8f887f; font-style: italic; font-size: .95rem; }
.cook-timers { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px; }
.cook-timer-btn { border: 1px solid rgba(237,182,84,.55); background: rgba(237,182,84,.1); color: var(--gold);
                  border-radius: 999px; padding: 11px 18px; cursor: pointer; font: 700 .78rem var(--sans); letter-spacing: .06em; }
.cook-timer-btn:hover { background: rgba(237,182,84,.22); }
.cook-end-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 28px; }
.cook-end-actions .btn:not(.primary) { background: transparent; color: #fff; border-color: rgba(255,255,255,.5); }

.cook-nav { position: fixed; z-index: 10; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between;
            gap: 14px; padding: 18px max(20px, env(safe-area-inset-left)) max(22px, env(safe-area-inset-bottom));
            background: linear-gradient(to top, #111 55%, rgba(17,17,17,0)); pointer-events: none; }
.cook-nav > * { pointer-events: auto; }
.cook-arrow { width: 64px; height: 64px; border-radius: 50%; border: 0; cursor: pointer; flex-shrink: 0;
              display: grid; place-items: center; background: rgba(255,255,255,.1); color: #fff;
              transition: transform .15s, background .2s, opacity .2s; backdrop-filter: blur(8px); }
.cook-arrow:hover:not(:disabled) { background: rgba(255,255,255,.2); }
.cook-arrow:active:not(:disabled) { transform: scale(.92); }
.cook-arrow.next { background: var(--gold); color: #111; box-shadow: 0 8px 30px rgba(237,182,84,.3); }
.cook-arrow.next:hover:not(:disabled) { background: #f3c56d; }
.cook-arrow:disabled { opacity: .2; cursor: default; box-shadow: none; }
.cook-dots { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; flex: 1; }
.cook-dots button { width: 8px; height: 8px; border-radius: 999px; border: 0; padding: 0; cursor: pointer;
                    background: rgba(255,255,255,.25); transition: width .3s, background .3s; }
.cook-dots button.on { width: 26px; background: var(--gold); }

.cook-drawer { position: fixed; inset: 0; overflow: hidden; background: rgba(0,0,0,.55); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .3s, visibility .3s; z-index: 20; }
.cook-drawer.aperto { opacity: 1; visibility: visible; pointer-events: auto; }
.cook-drawer-box { position: absolute; right: 0; top: 0; bottom: 0; width: min(420px, 92vw); background: #fff; color: var(--text);
                   padding: 20px 24px; overflow-y: auto; transform: translateX(100%); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.cook-drawer.aperto .cook-drawer-box { transform: none; }
.cook-drawer-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;
                    font: 700 .8rem var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--plum); }
.cook-drawer-head button { border: 0; background: var(--soft); width: 36px; height: 36px; border-radius: 50%; cursor: pointer; }

.cook-timer-pill { position: fixed; top: 76px; left: 50%; transform: translateX(-50%); z-index: 15;
                   display: flex; align-items: center; gap: 10px; padding: 10px 12px 10px 18px; border-radius: 999px;
                   background: #fff; color: #111; box-shadow: 0 10px 30px rgba(0,0,0,.35); font: 600 .9rem var(--sans); white-space: nowrap; }
.cook-timer-pill b { font: 700 1.15rem var(--sans); font-variant-numeric: tabular-nums; }
.cook-timer-pill span { color: var(--muted); font-size: .78rem; }
.cook-timer-pill button { border: 0; background: var(--soft); border-radius: 999px; padding: 6px 11px; cursor: pointer; font: 700 .75rem var(--sans); }
.cook-timer-pill.suona { background: var(--gold); animation: pulsa 1s ease-in-out infinite; }
.cook-timer-pill[hidden] { display: none; }
html:has(body.cook) { overflow: hidden; }
@keyframes pulsa { 50% { transform: translateX(-50%) scale(1.06); } }
@media (max-width: 560px) {
  .cook-ingr-btn span { display: none; }
  .cook-arrow { width: 58px; height: 58px; }
  .cook-num { width: 68px; height: 68px; font-size: 1.8rem; margin-bottom: 20px; }
}
@media (prefers-reduced-motion: reduce) { .cook-track, .cook-card, .cook-bar { transition: none; } }


/* pulsanti lunghi su schermi stretti */
@media (max-width: 700px) {
  .sticky-bar .btn { white-space: normal; max-width: 100%; line-height: 1.3; text-align: center; }
  .head .actions { width: 100%; }
}

/* ---------- ingredienti in tre colonne: quantità | unità | ingrediente */
.ing3 { display: grid; grid-template-columns: 64px 86px 1fr auto; align-items: baseline; column-gap: 10px; }
.ing3-head { font: 600 .62rem var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--muted);
             padding-bottom: 8px; border-bottom: 1px solid var(--line-strong); }
.ing3 .i-qta { font-weight: 700; color: var(--gold); text-align: right; font-variant-numeric: tabular-nums; }
.ing3 .i-un { color: var(--gold); opacity: .85; }
.ing3 .i-nome { color: var(--text); }
.ingr li.ing3 { padding: 11px 0; }
.ingr .price-link { justify-self: end; }
.ingr-head { display: flex; gap: 8px; padding: 0 0 6px; font: 600 .62rem var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); }
.ingr-row .c-qta, .ingr-head .c-qta { flex: 0 0 96px; width: 96px; }
.ingr-row .c-unita, .ingr-head .c-unita { flex: 0 0 120px; width: 120px; }
.ingr-row .c-nome, .ingr-head .c-nome { flex: 1; min-width: 0; }
.ingr-row .c-qta { text-align: right; }
.ingr-head .c-qta { text-align: right; padding-right: 14px; }
.ingr-head .c-x { flex: 0 0 38px; }
.cook-checklist label.ing3 { grid-template-columns: 22px 54px 78px 1fr; column-gap: 12px; align-items: center; }
.cook-checklist .i-qta, .cook-checklist .i-un { color: var(--gold); }
.cook-checklist input:checked ~ span { opacity: .4; text-decoration: line-through; }
.cook-drawer .ing3 { grid-template-columns: 56px 80px 1fr; }
.cook-drawer .ing3 .i-nome { color: #222; }
@media (max-width: 560px) {
  .ingr-row .c-qta, .ingr-head .c-qta { flex-basis: 70px; width: 70px; }
  .ingr-row .c-unita, .ingr-head .c-unita { flex-basis: 84px; width: 84px; }
  .ing3 { grid-template-columns: 50px 70px 1fr auto; }
}

/* ---------- dispensa */
.disp-add { max-width: none; }
.disp-add-row { display: flex; gap: 8px; align-items: center; }
.disp-add-row input { margin: 0; }
.disp-add-row .c-qta { flex: 0 0 90px; width: 90px; text-align: right; }
.disp-add-row .c-unita { flex: 0 0 110px; width: 110px; }
.disp-add-row .c-nome { flex: 1; min-width: 0; }
.disp-table .disp-nome { font-weight: 700; }
@media (max-width: 600px) {
  .disp-add-row { flex-wrap: wrap; }
  .disp-add-row .c-nome { flex-basis: 100%; order: -1; }
  .disp-add-row .c-qta, .disp-add-row .c-unita { flex: 1 1 0; width: auto; }
}

/* ---------- scontrino */
fieldset.domanda { border: 1px solid var(--line); border-radius: var(--radius); padding: 6px 18px 4px; margin: 22px 0 6px; }
fieldset.domanda legend { font: 600 .9rem var(--sans); color: #fff; padding: 0 8px; }
fieldset.domanda .check { margin: 12px 0; }
.sc-negozio { display: grid; gap: 4px; padding-top: 18px; margin-bottom: 18px; }
.sc-negozio label { margin: 0; }
.sc-righe { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
.sc-riga { display: flex; gap: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
           padding: 14px 16px; transition: opacity .2s, border-color .2s; }
.sc-riga.off { opacity: .5; }
.sc-riga:not(.off) { border-color: var(--line-strong); }
.sc-usa { margin: 2px 0 0; }
.sc-usa input { width: 20px; height: 20px; margin: 0; accent-color: var(--gold); }
.sc-corpo { flex: 1; min-width: 0; }
.sc-testo { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.sc-orig { font: 600 .78rem/1.3 ui-monospace, Menlo, Consolas, monospace; color: var(--muted); letter-spacing: .02em; }
.sc-tot { font: 600 .82rem var(--sans); color: var(--text); white-space: nowrap; }
.sc-campi { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 18px; align-items: end; }
.sc-ing { margin: 0; position: relative; }
.sc-ing input { margin-top: 6px; margin-bottom: 0; }
.sc-lbl { display: block; font: 600 .66rem var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); margin-bottom: 6px; }
.sc-fonte { position: absolute; right: 12px; bottom: 12px; font: 600 .62rem var(--sans); letter-spacing: .1em; text-transform: uppercase;
            color: var(--ok); pointer-events: none; }
.sc-fonte.nuovo { color: var(--gold); }
.sc-prima, .sc-disp small { display: block; margin-top: 4px; font-size: .74rem; color: var(--muted); }
.sc-disp { display: none; grid-column: 2; }
.con-dispensa .sc-disp { display: block; }
@media (max-width: 700px) {
  .sc-riga { padding: 12px; gap: 10px; }
  .sc-campi { grid-template-columns: 1fr; }
  .sc-disp { grid-column: 1; }
  .sc-fonte { bottom: 13px; }
}
.dd-panel .dd-sep:first-child { border-top: 0; margin-top: 0; padding-top: 8px; }
.dd-panel { max-height: calc(100vh - 130px); overflow-y: auto; }

/* ---------- scadenze */
.disp-add-row .c-scad { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; margin: 0; color: var(--muted);
                        font: 500 .78rem var(--sans); white-space: nowrap; }
.disp-add-row .c-scad input { width: 150px; margin: 0; }
input[type=date] { color-scheme: dark; }
.disp-scad { white-space: nowrap; }
.disp-scad input { width: 150px; margin: 0; padding: 8px 10px; }
.scad-txt { display: block; margin-top: 4px; font: 600 .7rem var(--sans); letter-spacing: .04em; color: var(--muted); }
.scad-txt.scaduto, .scad-txt.urgente { color: var(--err); }
.scad-txt.presto { color: var(--gold); }
.disp-table tr.scad-scaduto td.disp-nome { color: var(--err); }
.disp-table tr.scad-scaduto td.disp-nome::after { content: "scaduto"; margin-left: 8px; font: 700 .58rem var(--sans);
        letter-spacing: .12em; text-transform: uppercase; background: var(--err-soft); color: var(--err); padding: 3px 7px; border-radius: 999px; }
.scad-box { border: 1px solid rgba(237,182,84,.35); background: var(--warn); border-radius: var(--radius); padding: 14px 18px; margin: 16px 0 22px; }
.scad-testa { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; font-family: var(--sans); }
.scad-testa b { color: #fff; font-size: .9rem; }
.scad-testa a { font-size: .82rem; }
.scad-box p { margin: 10px 0 0; }
.scad-lista, .usa-lista { display: flex; flex-wrap: wrap; gap: 6px; }
.scad-chip, .usa-chip { display: inline-flex; align-items: baseline; gap: 6px; padding: 6px 12px; border-radius: 999px;
        background: var(--raise); color: var(--text); font: 600 .8rem/1.2 var(--sans); }
.scad-chip small, .usa-chip small { font-weight: 500; font-size: .7rem; color: var(--muted); }
.usa-chip em { font-weight: 400; color: var(--muted); font-size: .74rem; }
.scad-chip.scaduto, .usa-chip.scaduto, .scad-chip.urgente, .usa-chip.urgente { background: var(--err-soft); color: #ffb3ad; }
.scad-chip.scaduto small, .usa-chip.scaduto small, .scad-chip.urgente small, .usa-chip.urgente small { color: #ffb3ad; }
.scad-chip.presto, .usa-chip.presto { background: rgba(237,182,84,.16); color: #f3cf8c; }
.scad-chip.presto small, .usa-chip.presto small { color: #f3cf8c; }
.badge.scad { background: var(--err-soft); color: #ffb3ad; }
/* svuota dispensa */
.svuota-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 16px; }
.match.svuota.top { border-color: rgba(237,182,84,.55); }
.match-foto { position: relative; }
.svuota-pos { position: absolute; top: 8px; left: 8px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
        background: rgba(17,17,17,.8); color: #fff !important; font: 700 .8rem/1 var(--sans) !important; }
.da-comprare { margin: 10px 0 0; }
.match-azioni { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.match-azioni form { margin: 0; }
.sc-disp .price-row .scad { width: 150px; }
@media (max-width: 600px) {
  .disp-add-row .c-scad { flex-basis: 100%; }
  .disp-add-row .c-scad input { flex: 1; width: auto; }
  .disp-table th:nth-child(3) { display: none; }
  .disp-table tr:not(.rep-sep) { display: grid; grid-template-columns: 1fr auto; }
  .disp-table tr:not(.rep-sep) td { border-bottom: 0; padding: 8px 12px; }
  .disp-table tr:not(.rep-sep) td.disp-nome { grid-column: 1; padding-top: 14px; }
  .disp-table tr:not(.rep-sep) td.num-col { grid-column: 2; grid-row: 1; width: auto; padding-top: 10px; }
  .disp-table tr:not(.rep-sep) td:nth-child(2), .disp-table tr:not(.rep-sep) td.disp-scad { grid-column: 1 / -1; }
  .disp-table tr:not(.rep-sep) td.disp-scad { padding-bottom: 14px; border-bottom: 1px solid var(--line); }
  .disp-table thead { display: none; }
}
@media (max-width: 600px) {
  .form .disp-add-row > input.c-qta, .form .disp-add-row > input.c-unita { flex: 1 1 calc(50% - 4px); width: calc(50% - 4px); min-width: 0; }
  .form .disp-add-row > .btn { flex: 1 1 100%; }
}

/* ---------- import da PDF */
.pdf-lista { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.pdf-ricetta { display: flex; gap: 16px; align-items: flex-start; background: var(--surface); border: 1px solid var(--line-strong);
               border-radius: var(--radius); padding: 16px; transition: opacity .2s; }
.pdf-ricetta.off { opacity: .5; border-color: var(--line); }
.pdf-ricetta.unita { opacity: .75; border-style: dashed; margin-top: -8px; }
.pdf-ricetta.unita .sc-usa { visibility: hidden; }
.pdf-foto { flex: 0 0 120px; margin: 0; position: relative; cursor: pointer; }
.pdf-foto img { width: 120px; height: 120px; object-fit: cover; border-radius: var(--radius-sm); display: block; }
.pdf-foto span { position: absolute; left: 6px; bottom: 6px; display: flex; align-items: center; gap: 5px; background: rgba(17,17,17,.8);
                 border-radius: 999px; padding: 4px 9px; font: 600 .66rem var(--sans); color: #fff; }
.pdf-foto input { width: 14px; height: 14px; margin: 0; accent-color: var(--gold); }
.pdf-corpo { flex: 1; min-width: 0; }
.pdf-testa { display: flex; gap: 10px; align-items: center; margin-bottom: 6px; }
.pdf-nome { flex: 1; min-width: 0; margin: 0 !important; font: 700 1.1rem var(--slab) !important; }
.pdf-porz { display: flex; align-items: center; gap: 6px; margin: 0; white-space: nowrap; color: var(--muted); font: 500 .8rem var(--sans); }
.pdf-porz input { width: 60px; margin: 0; text-align: center; }
.pdf-dettagli summary { cursor: pointer; color: var(--gold); font: 600 .8rem var(--sans); margin: 4px 0; }
.pdf-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 20px; margin-top: 10px; }
.pdf-passi { margin: 0; padding-left: 20px; font-size: .9rem; }
.pdf-passi li { margin-bottom: 6px; }
.pdf-unisci { margin: 10px 0 0; font-size: .85rem; color: var(--muted); }
@media (max-width: 700px) {
  .pdf-ricetta { flex-wrap: wrap; padding: 12px; gap: 12px; }
  .pdf-foto { flex-basis: 80px; }
  .pdf-foto img { width: 80px; height: 80px; }
  .pdf-corpo { flex-basis: 100%; }
  .pdf-testa { flex-wrap: wrap; }
  .pdf-cols { grid-template-columns: 1fr; }
}

/* ---------- Cosa cucino: scelta dell'obiettivo */
.modo-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; border: 0; padding: 4px; margin: 0 0 20px;
               background: #141414; border: 1px solid var(--line); border-radius: 18px; }
.modo-switch label { display: flex; flex-direction: column; gap: 3px; margin: 0; padding: 12px 16px; border-radius: 14px; cursor: pointer;
                     color: var(--muted); transition: background .2s, color .2s; }
.modo-switch label:hover { background: var(--soft); }
.modo-switch label.on { background: var(--raise); color: #fff; box-shadow: inset 0 0 0 1px var(--line-strong); }
.modo-switch input { position: absolute; opacity: 0; pointer-events: none; }
.modo-switch b { font: 600 .9rem var(--sans); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.modo-switch small { font-size: .78rem; color: var(--muted); }
.modo-switch label:has(input:focus-visible) { outline: 2px solid var(--gold); outline-offset: 2px; }
@media (max-width: 600px) { .modo-switch { grid-template-columns: 1fr; } }
.form .modo-switch label, .modo-switch label { text-transform: none; letter-spacing: 0; font: 400 .9rem var(--serif); }
.modo-switch b { text-transform: none; letter-spacing: 0; }
.modo-switch small { text-transform: none; letter-spacing: 0; font-family: var(--serif); }

/* ---------- aggiornamento */
.agg-panel { padding: 20px 24px; margin-bottom: 18px; max-width: 760px; }
.agg-panel h2 { margin-top: 0; display: flex; align-items: center; gap: 12px; font-size: 1.15rem; }
.agg-versioni { display: flex; align-items: center; gap: 16px; margin: 10px 0 12px; }
.agg-v { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 18px; border-radius: var(--radius);
         background: var(--raise); font: 700 1.2rem var(--sans); color: var(--text); }
.agg-v.nuova { background: rgba(237,182,84,.16); color: var(--gold); }
.agg-v small { font: 600 .6rem var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.agg-freccia { font-size: 1.4rem; color: var(--muted); }
.agg-nota { border-left: 3px solid var(--gold); padding-left: 12px; }
.agg-novita { margin: 14px 0; border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 16px; }
.agg-novita summary { cursor: pointer; font: 600 .85rem var(--sans); color: #fff; }
.agg-novita-testo { margin-top: 8px; max-height: 320px; overflow-y: auto; }
.agg-novita-testo p { margin: 4px 0; font-size: .9rem; padding-left: 14px; position: relative; }
.agg-novita-testo p::before { content: "•"; position: absolute; left: 0; color: var(--gold); }
.agg-novita-testo p.sub { margin-left: 18px; color: var(--muted); }
.agg-novita-testo p.sub::before { content: "–"; color: var(--muted); }
.agg-log { background: #0b0b0b; border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 12px 14px; max-height: 280px;
           overflow: auto; font: .78rem/1.5 ui-monospace, Menlo, Consolas, monospace; color: #cfcfcf; white-space: pre-wrap; margin: 10px 0 0; }
.agg-dettagli { max-width: 760px; margin-top: 10px; }
.agg-dettagli summary { cursor: pointer; color: var(--muted); font: 600 .8rem var(--sans); }
.spinner { width: 18px; height: 18px; border-radius: 50%; border: 2.5px solid var(--line-strong); border-top-color: var(--gold);
           animation: gira 0.9s linear infinite; flex-shrink: 0; }
@keyframes gira { to { transform: rotate(360deg); } }
.pdf-unisci-tutto { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
                    border: 1px dashed var(--line-strong); border-radius: var(--radius); padding: 14px 18px; margin-bottom: 14px; }
.pdf-unisci-tutto b { display: block; color: #fff; font: 600 .9rem var(--sans); margin-bottom: 3px; }
.pdf-unisci-tutto .btn.on { background: var(--gold); border-color: var(--gold); color: #111; }

/* ---------- menu a hamburger (smartphone e tablet) */
.burger { display: none; }
@media (max-width: 900px) {
  .topbar { flex-wrap: wrap; row-gap: 0; }
  .brand { order: 1; margin-right: auto; }
  .user-menu { order: 2; margin-left: 0; }
  .burger { order: 3; display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px;
            margin-left: 8px; padding: 0 11px; border-radius: 50%; border: 1px solid var(--line); background: none; cursor: pointer; }
  .burger span { display: block; height: 2px; border-radius: 2px; background: var(--text); transition: transform .25s var(--ease), opacity .2s; }
  .burger:hover { background: var(--soft); }
  .menu-aperto .burger { background: var(--raise); }
  .menu-aperto .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-aperto .burger span:nth-child(2) { opacity: 0; }
  .menu-aperto .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .topbar .menu { order: 4; flex-basis: 100%; display: none; flex-direction: column; align-items: stretch; gap: 2px;
                  margin: 12px 0 4px; padding: 8px; border: 1px solid var(--line); border-radius: 16px; background: #161616;
                  max-height: calc(100vh - 110px); overflow-y: auto; animation: ddIn .18s var(--ease); }
  .menu-aperto .menu { display: flex; }
  .menu > a, .menu .dropdown > summary { padding: 14px 16px; font-size: .95rem; border-radius: 12px; justify-content: space-between; }
  .menu .dropdown > summary { display: flex; width: 100%; }
  .menu .dropdown { width: 100%; }
  .menu .dd-panel { position: static; box-shadow: none; border: 0; background: none; min-width: 0; max-height: none;
                    padding: 0 0 6px 10px; animation: none; }
  .menu .dd-panel a { padding: 12px 14px; font-size: .92rem; }
  .menu .dd-sep { border-top: 0; padding: 12px 14px 4px; }
  .user-menu .dd-panel { right: 0; }
}
@media (max-width: 480px) { .menu > a, .menu .dropdown > summary { padding: 13px 14px; font-size: .92rem; } }
@media (max-width: 600px) {
  .topbar { padding-top: 12px; padding-bottom: 12px; }
  .brand { font-size: 1.3rem; gap: 9px; min-width: 0; }
  .brand-logo { height: 32px; width: 32px; padding-right: 9px; }
  .brand .ver { font-size: .55rem; margin-bottom: 1px; }
  .burger { width: 40px; height: 40px; padding: 0 10px; margin-left: 6px; }
  .user-menu > summary { padding: 3px 6px 3px 3px; gap: 4px; }
  .avatar { width: 30px; height: 30px; }
}

/* ---------- modalità preparazione: indicatore «schermo sempre acceso» */
.cook-schermo { flex-shrink: 0; display: inline-flex; align-items: center; gap: 7px; border: 1px solid rgba(255,255,255,.18);
                border-radius: 999px; padding: 9px 13px; background: none; color: rgba(255,255,255,.7); cursor: pointer;
                font: 600 .72rem var(--sans); letter-spacing: .02em; transition: background .2s, color .2s, border-color .2s; }
.cook-schermo .ico { font-size: .95rem; line-height: 1; }
.cook-schermo.on { color: var(--gold); border-color: rgba(237,182,84,.45); background: rgba(237,182,84,.1); }
.cook-schermo:not(.on) { animation: pulsa 2s ease-in-out infinite; }
@keyframes pulsa { 50% { border-color: rgba(237,182,84,.7); color: #fff; } }
@media (max-width: 600px) { .cook-schermo .txt { display: none; } .cook-schermo { padding: 9px 11px; } }

/* ---------- pagina ricetta: pulsanti tutti uguali e minimal */
.azioni-ricetta { gap: 8px; }
.azioni-ricetta form { margin: 0; }
.azioni-ricetta .btn { background: none; border: 1px solid var(--line-strong); color: var(--text); }
.azioni-ricetta .btn:hover { background: var(--soft); border-color: #555; color: #fff; }
.azioni-ricetta .btn.elimina:hover { color: var(--err); border-color: rgba(239,107,98,.5); background: var(--err-soft); }

/* ---------- scelta «Nuova ricetta» */
dialog.scelta-nuova { width: min(520px, calc(100vw - 32px)); padding: 22px 22px 18px; border: 1px solid var(--line-strong);
                      border-radius: 20px; background: #181818; color: var(--text); box-shadow: 0 30px 80px rgba(0,0,0,.6); }
dialog.scelta-nuova::backdrop { background: rgba(0,0,0,.65); backdrop-filter: blur(3px); }
dialog.scelta-nuova[open] { animation: ddIn .18s var(--ease); }
.scelta-nuova h2 { margin: 0 0 2px; font-size: 1.2rem; }
.scelta-nuova .muted { margin: 0 0 14px; }
.scelta-chiudi { position: absolute; top: 12px; right: 12px; margin: 0; }
.scelta-chiudi button { width: 36px; height: 36px; border-radius: 50%; border: 0; background: none; color: var(--muted); cursor: pointer; font-size: .95rem; }
.scelta-chiudi button:hover { background: var(--raise); color: #fff; }
.scelta-lista { display: grid; gap: 8px; }
.scelta { display: flex; flex-direction: column; gap: 3px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px;
          color: var(--text); transition: background .15s, border-color .15s; }
.scelta:hover { background: var(--raise); border-color: var(--line-strong); color: #fff; }
.scelta b { font: 600 .95rem var(--sans); }
.scelta span { font-size: .84rem; color: var(--muted); }

/* ---------- categorie */
.cat-filtri { display: flex; gap: 6px; overflow-x: auto; padding: 2px 0 12px; margin: -4px 0 14px; scrollbar-width: thin; }
.cat-filtri a { flex-shrink: 0; display: inline-flex; align-items: baseline; gap: 6px; padding: 8px 14px; border-radius: 999px;
                border: 1px solid var(--line); color: var(--muted); font: 500 .8rem var(--sans); white-space: nowrap;
                transition: background .15s, color .15s, border-color .15s; }
.cat-filtri a:hover { background: var(--soft); color: #fff; }
.cat-filtri a.on { background: var(--raise); color: #fff; border-color: var(--line-strong); }
.cat-filtri small { font-size: .7rem; color: var(--muted); }
.card .meta .cat { color: var(--gold); }
.recipe-hero .kicker a { color: var(--gold); }
.recipe-hero .kicker a:hover { color: #fff; }
.c-categoria input { min-width: 190px; }
.pdf-cat { width: 190px; margin: 0 !important; }
@media (max-width: 700px) { .pdf-cat { width: 100%; } }

/* ---------- pulizia */
.disco-testa { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-family: var(--sans); margin-bottom: 10px; }
.disco-testa b { color: #fff; }
.disco-testa span { color: var(--muted); font-size: .85rem; }
.disco-barra { height: 10px; border-radius: 999px; background: var(--raise); overflow: hidden; }
.disco-barra div { height: 100%; background: var(--ok); border-radius: 999px; }
.disco-barra.quasi div { background: var(--gold); }
.disco-barra.piena div { background: var(--err); }
.disco p { margin: 8px 0 0; }
.pulizia-form { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }
.pul-gruppo { display: flex; gap: 14px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--radius);
              background: var(--surface); cursor: pointer; margin: 0; text-transform: none; letter-spacing: 0; font: inherit; color: var(--text); }
.pul-gruppo:hover { border-color: var(--line-strong); }
.pul-gruppo > input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--gold); flex-shrink: 0; }
.pul-corpo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.pul-testa { display: flex; justify-content: space-between; gap: 10px; }
.pul-testa b { font: 600 .92rem var(--sans); color: #fff; }
.pul-dim { font: 700 .85rem var(--sans); color: var(--gold); white-space: nowrap; }
.pul-file summary { cursor: pointer; color: var(--muted); font: 600 .74rem var(--sans); margin-top: 4px; }
.pul-file ul { margin: 6px 0 0; padding-left: 18px; font-size: .78rem; }
.pul-file code { word-break: break-all; }
.soglia-nota { margin: -6px 0 14px; }
.link-btn { background: none; border: 0; padding: 0; margin-left: 6px; color: var(--gold); font: inherit; cursor: pointer; }
.link-btn:hover { color: #fff; text-decoration: underline; }

/* ---------- connettore Claude */
.inline-form { margin: 8px 0 0; }
.url-box { display: flex; gap: 10px; align-items: center; background: #0b0b0b; border: 1px solid var(--line); border-radius: var(--radius-sm);
           padding: 10px 12px; margin: 8px 0 14px; }
.url-box code { flex: 1; min-width: 0; word-break: break-all; font-size: .82rem; color: var(--gold); background: none; }
.passi { padding-left: 20px; margin: 0 0 12px; }
.passi li { margin-bottom: 8px; font-size: .92rem; }

/* ---------- lista della spesa salvata */
.conta-lista { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 4px; border-radius: 999px;
               background: var(--gold); color: #111; font: 700 .64rem/1 var(--sans); vertical-align: 1px; }
.conta-lista[hidden] { display: none; }
.lista-negozio { margin: 0 0 12px; max-width: 360px; }
.lista-negozio label, .lista-negozio select { margin: 0; }
.lista-aggiungi { display: grid; gap: 10px; margin-bottom: 18px; }
.lista-add { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; max-width: none; margin: 0;
             background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 14px; }
.lista-add label { margin: 0; }
.lista-add input, .lista-add select { margin-bottom: 0; }
.lista-add-nome { flex: 1 1 260px; min-width: 0; }
.lista-add-porz input { width: 90px; }
.lista-add-check { flex-basis: 100%; order: 5; margin: 0 !important; font-size: .85rem; }
.lista-ricette { margin: -4px 0 14px; }
.spesa li { display: flex; align-items: center; gap: 8px; }
.spesa li > label { flex: 1; min-width: 0; }
.spesa li.preso .voce { text-decoration: line-through; opacity: .4; }
.togli-voce { margin: 0; }
.togli-voce .btn.icon { width: 32px; height: 32px; opacity: .5; }
.togli-voce .btn.icon:hover { opacity: 1; }
.sticky-bar form { margin: 0; }
.inline-form0 { margin: 0; display: inline; }
@media print { .togli-voce, .conta-lista { display: none !important; } }
.sticky-bar:has(> form) { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 10px; flex-wrap: wrap; }

/* valori nutrizionali */
.nutri { margin-top: 34px; }
.nutri .table { margin: 10px 0; }
.nutri-tab tr.sub td:first-child, .nutri-form tr.sub td:first-child { padding-left: 22px; color: var(--muted); font-size: .92em; }
.nutri-tab tr.energia td { font-size: 1.05em; }
.nutri-form input.small { width: 90px; text-align: right; }
.nutri-tab td.num-col, .nutri-form td.num-col { white-space: nowrap; }
.nutri-form td { padding-top: 6px; padding-bottom: 6px; }
.nutri-form input.small { padding: 6px 10px; }

/* versioni vegana / senza glutine */
.alternative { margin: 0 0 26px; padding: 16px 18px; }
.alt-stato { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.alt-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; font: 600 .78rem var(--sans); }
.alt-badge.si { background: var(--ok-soft); color: #9fdcb4; }
.alt-badge.no { background: var(--soft); color: var(--muted); }
.alt-scelta { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 0 4px; }
.alt-scelta a { flex-shrink: 0; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted);
                font: 500 .82rem var(--sans); white-space: nowrap; transition: background .15s, color .15s, border-color .15s; }
.alt-scelta a:hover { background: var(--soft); color: #fff; }
.alt-scelta a.on { background: var(--gold); border-color: var(--gold); color: #111; font-weight: 600; }
.alt-tab { margin: 14px 0 8px; }
.alt-azioni { margin-top: 10px; align-items: center; }
.alt-azioni form { display: inline; }
.al-posto { display: block; font: 500 .72rem var(--sans); color: var(--gold); margin-top: 2px; }
.al-posto.verifica { color: var(--muted); }
.show-sm { display: none; }
@media (max-width: 600px) { .show-sm { display: block; margin-top: 4px; } }

/* filtri delle ricette: categorie rapide (9 sul computer, 3 sul telefono) + «Altre» con il pannello */
.cat-filtri { display: none; }
.cat-rapide { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px; margin: 2px 0 14px; }
.cat-rapide a, .cat-rapide button { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 5px; min-height: 76px; padding: 8px 4px; border-radius: 14px; border: 1px solid var(--line); background: var(--surface);
    color: var(--text); font: 600 .78rem/1.15 var(--sans); text-align: center; cursor: pointer; transition: background .15s, border-color .15s; }
.cat-rapide a:hover, .cat-rapide button:hover { background: var(--raise); border-color: var(--line-strong); }
.cat-rapide .e { font-size: 1.45rem; line-height: 1; }
.cat-rapide .n { overflow-wrap: anywhere; }
.cat-rapide a.on { background: var(--gold); border-color: var(--gold); color: #111; }
.cat-rapide button.on { border-color: var(--gold); }
.cat-rapide .pallino { position: absolute; top: 6px; right: 8px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
    background: var(--gold); color: #111; font: 700 .68rem/18px var(--sans); }
.filtri-attivi { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -2px 0 16px; }
.filtri-attivi .chip i { font-style: normal; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%;
    background: rgba(0,0,0,.18); font-size: .62rem; }
.filtri-attivi .muted { margin-left: 4px; }
@media (max-width: 700px) { .cat-rapide .solo-pc { display: none; } }
dialog.foglio-filtri { width: min(560px, 100vw); max-height: 86vh; margin: auto auto 0; padding: 8px 16px 18px; border: 1px solid var(--line-strong);
    border-bottom: 0; border-radius: 22px 22px 0 0; background: var(--surface); color: var(--text); overflow-y: auto; overscroll-behavior: contain; }
dialog.foglio-filtri::backdrop { background: rgba(0,0,0,.65); backdrop-filter: blur(3px); }
dialog.foglio-filtri[open] { animation: foglioSu .22s var(--ease); }
@keyframes foglioSu { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
.foglio-filtri .maniglia { width: 42px; height: 4px; border-radius: 4px; background: var(--line-strong); margin: 4px auto 10px; }
.foglio-filtri .foglio-testa { display: flex; align-items: center; justify-content: space-between; }
.foglio-filtri h2 { margin: 0; }
.foglio-filtri .chiudi { border: 0; background: var(--soft); color: var(--text); width: 34px; height: 34px; border-radius: 50%; cursor: pointer; }
.foglio-filtri .st { font: 700 .68rem var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin: 16px 0 8px; }
.griglia-filtri { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.griglia-filtri .t { display: flex; align-items: center; gap: 9px; padding: 11px 12px; border-radius: 12px; border: 1px solid var(--line);
    background: var(--soft); font: 600 .86rem/1.2 var(--sans); cursor: pointer; min-height: 48px; }
.griglia-filtri .t input { position: absolute; opacity: 0; pointer-events: none; }
.griglia-filtri .t .e { font-size: 1.2rem; }
.griglia-filtri .t small { margin-left: auto; color: var(--muted); font-size: .72rem; }
.griglia-filtri .t:has(input:checked) { background: var(--gold); border-color: var(--gold); color: #111; }
.griglia-filtri .t:has(input:checked) small { color: #111; }
.griglia-filtri .t:has(input:focus-visible) { outline: 2px solid var(--gold); outline-offset: 2px; }
.foglio-filtri .mostra { width: 100%; margin-top: 18px; padding: 14px; font-size: .95rem; position: sticky; bottom: 0; }
.foglio-filtri .mostra:disabled { opacity: .5; }
dialog.foglio-filtri { box-sizing: border-box; width: 100%; max-width: 560px; }
.griglia-filtri .t { text-transform: none; letter-spacing: normal; color: var(--text); margin: 0; min-width: 0; }
.griglia-filtri .t .n { min-width: 0; overflow-wrap: anywhere; }

/* ripartizione delle calorie (ciambella minimal) */
.macro { --m-proteine: #3987e5; --m-carboidrati: #d95926; --m-grassi: #199e70;
         display: flex; align-items: center; gap: 22px; margin: 18px 0 6px; }
.macro-torta { width: 86px; height: 86px; flex-shrink: 0; transform: rotate(0deg); }
.macro-torta circle { fill: none; stroke-width: 3.4; }
.macro-fondo { stroke: var(--line); }
.macro-fetta.m-proteine { stroke: var(--m-proteine); }
.macro-fetta.m-carboidrati { stroke: var(--m-carboidrati); }
.macro-fetta.m-grassi { stroke: var(--m-grassi); }
.macro figcaption { display: flex; flex-direction: column; gap: 6px; font: 500 .82rem var(--sans); color: var(--text); min-width: 150px; }
.macro-tit { font: 600 .66rem var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); }
.macro-voce { display: flex; align-items: center; gap: 8px; }
.macro-voce i { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.macro-voce i.m-proteine { background: var(--m-proteine); }
.macro-voce i.m-carboidrati { background: var(--m-carboidrati); }
.macro-voce i.m-grassi { background: var(--m-grassi); }
.macro-voce b { margin-left: auto; font-weight: 600; font-variant-numeric: tabular-nums; }
@media (min-width: 701px) {
  dialog.foglio-filtri { margin: auto; border-bottom: 1px solid var(--line-strong); border-radius: 22px; padding: 14px 22px 22px; }
  .foglio-filtri .maniglia { display: none; }
  .griglia-filtri { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- pulsanti: stessa forma dei riquadri dei filtri (angoli arrotondati, fondo scheda) */
.btn { border-radius: 12px; background: var(--surface); border-color: var(--line); }
.btn:hover { background: var(--raise); border-color: var(--line-strong); color: #fff; }
.btn.ghost, .btn.danger { background: transparent; }
.btn.icon { border-radius: 10px; }
.azioni-ricetta .btn { background: var(--surface); border-color: var(--line); }
.azioni-ricetta .btn:hover { background: var(--raise); border-color: var(--line-strong); }
.cook-end-actions .btn:not(.primary) { background: transparent; }
.search input { border-radius: 14px; }
input[type=file]::file-selector-button, .cook-timer-btn, .cook-schermo, .cook-ingr-btn, .cook-timer-pill button,
.alt-scelta a { border-radius: 12px; }
.alt-scelta a { background: var(--surface); }
mark.cambiato { background: rgba(237,182,84,.16); color: inherit; border-radius: 4px; padding: 0 1px; box-decoration-break: clone; -webkit-box-decoration-break: clone; }

/* Cosa cucino: tre obiettivi e ricette di stagione */
.modo-switch.tre { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 760px) { .modo-switch.tre { grid-template-columns: 1fr; } }
.solo-adatta[hidden] { display: none; }
.stagione-ora { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -6px 0 18px; }
.chip-stag { padding: 4px 10px; border-radius: 999px; background: var(--ok-soft); color: #9fdcb4; font: 600 .74rem var(--sans); }
.cat-rapide button.chip, .filtri-attivi button.chip { border: 0; cursor: pointer; }
.modo-switch label { position: relative; }
.modo-switch input, .griglia-filtri .t input { width: 1px; height: 1px; left: 0; top: 0; }
.griglia-filtri .t { position: relative; }
.btn.svuota-lista { color: var(--err); border-color: rgba(239,107,98,.45); }
.btn.svuota-lista:hover { background: var(--err-soft); border-color: var(--err); color: var(--err); }
.head .actions form { display: inline; margin: 0; }
.btn.togli-presi { color: var(--gold); border-color: rgba(237,182,84,.6); }
.btn.togli-presi:hover:not(:disabled) { background: var(--gold-soft); border-color: var(--gold); color: var(--gold); }
.btn.togli-presi:disabled { cursor: default; opacity: .45; }
.burger { position: relative; }
.burger .burger-conta { position: absolute; top: -4px; right: -6px; margin: 0; font-style: normal; }
.burger .burger-conta[hidden] { display: none; }

/* pagina Ricette: «Aggiungi alla lista» con il bordo giallo; sul telefono «Nuova ricetta» va nella barra in fondo */
.btn.bordo-giallo { background: var(--surface); color: var(--gold); border-color: rgba(237,182,84,.7); }
.btn.bordo-giallo:hover { background: var(--gold-soft); border-color: var(--gold); color: var(--gold); }
.barra-ricette .nuova-in-basso, .barra-ricette .testo-breve { display: none; }
@media (max-width: 700px) {
  .nuova-in-alto { display: none; }
  .barra-ricette { display: flex; gap: 8px; }
  .barra-ricette .btn { flex: 1 1 0; white-space: nowrap; padding: 13px 10px; }
  .barra-ricette .nuova-in-basso { display: inline-flex; }
  .barra-ricette .testo-lungo { display: none; }
  .barra-ricette .testo-breve { display: inline; }
}

/* importazione: porzioni da chiedere all'utente */
label.chiedi-porzioni { color: var(--gold); }
label.chiedi-porzioni input { border-color: var(--gold); box-shadow: 0 0 0 3px var(--gold-soft); }
label.chiedi-porzioni small { display: block; margin-top: 6px; font: 400 .78rem var(--serif); text-transform: none; letter-spacing: 0; color: var(--gold); }
.pdf-porz.chiedi-porzioni { font-weight: 600; }
.pdf-porz.chiedi-porzioni input { width: 64px; }
.fit-confronto { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin: 14px 0 4px; padding: 12px 14px;
                 border-radius: 12px; background: var(--ok-soft); font: 500 .82rem var(--sans); color: var(--text); }
.fit-confronto .fit-meno { font: 700 1rem var(--sans); color: #9fdcb4; }
.fit-confronto span { color: var(--muted); }
.fit-confronto span b { color: var(--text); }

/* ricette private / pubbliche */
.visibilita { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; border: 0; padding: 0; margin: 4px 0 18px; max-width: 520px; }
.visibilita .t { position: relative; display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 12px;
    border: 1px solid var(--line); background: var(--soft); cursor: pointer; text-transform: none; letter-spacing: 0; color: var(--text); margin: 0; }
.visibilita .t input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.visibilita .t .e { font-size: 1.25rem; }
.visibilita .t b { display: block; font: 600 .88rem var(--sans); }
.visibilita .t small { display: block; font: 400 .76rem var(--serif); color: var(--muted); }
.visibilita .t:has(input:checked) { border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }
.visibilita .t:has(input:focus-visible) { outline: 2px solid var(--gold); outline-offset: 2px; }
.card .meta .vis { letter-spacing: 0; }

/* filtro visibilità ricette */
.vis-scelta { display: flex; gap: 6px; margin: 2px 0 12px; }
.vis-scelta a { flex: 1 1 0; text-align: center; padding: 9px 10px; border-radius: 12px; border: 1px solid var(--line);
                background: var(--surface); color: var(--muted); font: 600 .8rem var(--sans); white-space: nowrap; }
.vis-scelta a:hover { background: var(--raise); color: #fff; }
.vis-scelta a.on { background: var(--raise); color: #fff; border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }
@media (min-width: 701px) { .vis-scelta { max-width: 460px; } }
.griglia-filtri.tre { grid-template-columns: repeat(3, 1fr); }

/* pagina Aiuto */
.aiuto-cerca input { width: 100%; border-radius: 14px; margin: 4px 0 14px; }
.aiuto-indice { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 20px; }
.aiuto-indice a { padding: 7px 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface);
                  color: var(--text); font: 600 .78rem var(--sans); }
.aiuto-indice a:hover { background: var(--raise); border-color: var(--line-strong); }
.aiuto { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
.aiuto-voce { border: 1px solid var(--line); border-radius: 14px; background: var(--surface); scroll-margin-top: 90px; }
.aiuto-voce[hidden] { display: none; }
.aiuto-voce > summary { cursor: pointer; list-style: none; padding: 15px 18px; font: 700 .95rem var(--sans); color: #fff;
                        display: flex; justify-content: space-between; align-items: center; }
.aiuto-voce > summary::-webkit-details-marker { display: none; }
.aiuto-voce > summary::after { content: "+"; color: var(--gold); font-size: 1.2rem; }
.aiuto-voce[open] > summary::after { content: "−"; }
.aiuto-voce > div { padding: 0 18px 16px; border-top: 1px solid var(--line); }
.aiuto-voce > div p, .aiuto-voce li { font-size: .95rem; line-height: 1.6; }
.aiuto-voce ul { padding-left: 20px; margin: 10px 0; }
.aiuto-voce li { margin-bottom: 6px; }
.vis-riga { display: flex; gap: 10px; align-items: center; margin: 2px 0 12px; }
.vis-riga .vis-scelta { margin: 0; flex: 1; }
.di-chi { display: flex; align-items: center; gap: 8px; margin: 0; text-transform: none; letter-spacing: 0; }
.di-chi span { font: 600 .66rem var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); white-space: nowrap; }
.di-chi select { margin: 0; padding: 9px 12px; border-radius: 12px; min-width: 150px; }
@media (max-width: 700px) {
  .vis-riga { flex-direction: column; align-items: stretch; gap: 8px; }
  .di-chi select { flex: 1; }
}

/* statistiche */
.periodo { max-width: 520px; margin-bottom: 16px; }
.stat-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 18px; }
@media (max-width: 700px) { .stat-tiles { grid-template-columns: 1fr 1fr; } }
.stat-tile { display: flex; flex-direction: column; gap: 4px; padding: 16px; border-radius: 14px; border: 1px solid var(--line); background: var(--surface); }
.stat-num { font: 700 1.9rem/1 var(--sans); color: #fff; font-variant-numeric: tabular-nums; }
.stat-lab { font: 500 .78rem var(--sans); color: var(--muted); }
.stat-panel { margin-bottom: 18px; }
.stat-barre { display: flex; align-items: flex-end; gap: 2px; height: 140px; padding: 6px 0; border-bottom: 1px solid var(--line-strong); }
.stat-barra { flex: 1 1 0; height: 100%; display: flex; align-items: flex-end; cursor: default; }
.stat-barra i { display: block; width: 100%; min-height: 2px; background: var(--gold); border-radius: 3px 3px 0 0; }
.stat-barra:hover i { background: #f3c56d; }
.stat-asse { display: flex; justify-content: space-between; font: 500 .72rem var(--sans); color: var(--muted); margin: 6px 0 10px; }
.stat-top { padding-left: 22px; margin: 8px 0 0; }
.stat-top li { display: flex; align-items: baseline; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.stat-top li b { margin-left: auto; font-variant-numeric: tabular-nums; }
.avviso-admin { margin: 14px auto 0; max-width: 640px; padding: 10px 14px; border-radius: 12px; background: var(--gold-soft);
                border: 1px solid rgba(237,182,84,.35); font-size: .88rem; text-align: center; }
@media (max-width: 600px) { .stat-panel .table th, .stat-panel .table td { padding: 10px 8px; } }
.stat-uso { display: flex; flex-direction: column; gap: 12px; margin: 6px 0 10px; }
.uso-testa { display: flex; justify-content: space-between; font: 600 .86rem var(--sans); color: var(--text); }
.uso-testa b { font-variant-numeric: tabular-nums; color: #fff; }
.uso-barra { height: 8px; border-radius: 4px; background: var(--raise); margin: 5px 0 4px; overflow: hidden; }
.uso-barra i { display: block; height: 100%; background: var(--gold); border-radius: 4px; }
.uso-dett { display: flex; flex-wrap: wrap; gap: 4px 10px; color: var(--text); font-family: var(--sans); }
.uso-riga.zero { opacity: .45; }

/* ---------- 3.0.0.6: piani Free / Premium e amministrazione */
.piano { display: inline-block; font: 700 .58rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase;
         padding: 4px 7px; border-radius: 999px; border: 1px solid var(--line-strong); color: var(--muted); white-space: nowrap; vertical-align: middle; }
.piano-premium { border-color: var(--gold); color: var(--gold); }
.piano-admin { color: var(--lilac); }
.user-menu > summary .piano { margin-left: 2px; }
@media (max-width: 900px) { .user-menu > summary .piano { font-size: .52rem; padding: 3px 6px; } }
.flash.premium { background: var(--gold-soft); border-color: rgba(237,182,84,.45); }
.flash.premium a { color: var(--gold); font-weight: 700; white-space: nowrap; }

.admin-nav { display: flex; gap: 6px; overflow-x: auto; margin: 0 0 22px; padding-bottom: 4px; scrollbar-width: none; }
.admin-nav::-webkit-scrollbar { display: none; }
.admin-nav a { flex: 0 0 auto; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted);
               font: 600 .8rem var(--sans); text-decoration: none; white-space: nowrap; }
.admin-nav a:hover { color: #fff; background: var(--raise); }
.admin-nav a.on { color: #fff; border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }

.utenti-lista { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); margin-bottom: 26px; }
.utente-riga { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-top: 1px solid var(--line); }
.utente-riga:first-child { border-top: 0; }
.avatar.grande { width: 38px; height: 38px; font-size: .95rem; flex-shrink: 0; text-decoration: none; }
.utente-info { flex: 1; min-width: 0; }
.utente-nome { font: 700 .95rem var(--sans); color: #fff; text-decoration: none; }
.utente-sub { font: 400 .76rem var(--sans); color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.utente-sub a { color: var(--muted); }
.piano-scelta, .seg { display: inline-flex; border: 1px solid var(--line-strong); border-radius: 999px; padding: 2px; flex-shrink: 0; }
.piano-scelta button, .seg label { border: 0; background: none; color: var(--muted); font: 600 .74rem var(--sans); padding: 6px 11px;
                                   border-radius: 999px; cursor: pointer; white-space: nowrap; margin: 0; }
.piano-scelta button:hover:not(:disabled) { color: #fff; }
.piano-scelta button.on { background: var(--raise); color: #fff; cursor: default; }
.piano-scelta button[value=premium].on { color: var(--gold); }
.seg { margin: 4px 0 14px; align-self: flex-start; }
.seg input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.seg label:has(input:checked) { background: var(--raise); color: #fff; }
.seg label:has(input:focus-visible) { outline: 2px solid var(--gold); }
.lbl-piano { font: 600 .8rem var(--sans); color: var(--muted); }

.limiti-form { max-width: 620px; }
.limite-riga { display: grid; grid-template-columns: 1fr 96px auto; align-items: center; gap: 12px; padding: 8px 0;
               border-bottom: 1px solid var(--line); }
.limite-nome { font: 600 .9rem var(--sans); }
.limite-riga input { text-align: center; }
@media (max-width: 600px) { .limite-riga { grid-template-columns: 1fr 80px; } }

.piani { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); max-width: 720px; overflow: hidden; margin-bottom: 14px; }
.piani-riga { display: grid; grid-template-columns: 1fr 110px 110px; align-items: center; border-top: 1px solid var(--line); }
.piani-riga:first-child { border-top: 0; }
.piani-riga > span { padding: 11px 12px; font: 400 .84rem var(--sans); text-align: center; }
.piani-riga > span.piani-nome, .piani-riga > span:first-child { text-align: left; color: var(--text); }
.piani-riga > span.mio { background: var(--gold-soft); }
.piani-riga small { display: block; font-size: .7rem; color: var(--muted); }
.piani-riga small.pieno { color: var(--err); }
.piani-testa > span { font: 700 .8rem var(--sans); letter-spacing: .06em; text-transform: uppercase; color: #fff; }
.piani-testa > span:last-child { color: var(--gold); }
@media (max-width: 600px) { .piani-riga { grid-template-columns: 1fr 76px 88px; } .piani-riga > span { padding: 10px 8px; font-size: .78rem; } }

.visibilita .t.spento { opacity: .45; }
.limite-nota { font: 400 .8rem var(--sans); color: var(--muted); margin: -8px 0 18px; }
.limite-nota.pieno { color: var(--gold); }
.limite-nota a { color: var(--gold); }
.form .seg label, .seg label { text-transform: none; letter-spacing: 0; font: 600 .8rem var(--sans); color: var(--muted); }
.seg label:has(input:checked) { color: #fff; }
@media (max-width: 600px) { .utente-sub { white-space: normal; } .utente-riga { align-items: flex-start; } .piano-scelta { margin-top: 4px; } }
.limite-riga, .limiti-form .limite-riga { text-transform: none; letter-spacing: 0; font: 600 .9rem var(--sans); color: var(--text); margin: 0; }
.limite-riga .small-txt { font-weight: 400; }
@media (max-width: 900px) {
  .user-menu > summary:has(.piano) .caret { display: none; }
  .user-menu > summary .piano { font-size: .5rem; padding: 3px 5px; letter-spacing: .08em; }
}
@media (max-width: 900px) {
  .user-menu > summary { position: relative; }
  .user-menu > summary:has(.piano) .caret { display: inline-block; }
  .user-menu > summary .piano { position: absolute; left: 4px; bottom: -7px; width: 30px; text-align: center; padding: 2px 0;
                                font-size: .42rem; letter-spacing: .04em; background: var(--bg); margin: 0; }
}
.limite-riga { grid-template-columns: 1fr 96px 110px; }
@media (max-width: 600px) { .limite-riga { grid-template-columns: 1fr 80px; } }
/* piano scritto sopra al nome */
.user-col { display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1.15; min-width: 0; }
.user-piano { font: 700 .56rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.user-piano-free { color: var(--muted); }
.user-piano-premium { color: var(--gold); }
@media (max-width: 900px) {
  .user-col { position: absolute; left: 50%; top: -14px; transform: translateX(-50%); align-items: center; }
  .user-menu > summary { position: relative; }
  .user-piano { font-size: .5rem; letter-spacing: .08em; background: var(--bg); padding: 0 4px; }
}

/* ---------- 3.0.0.7: connettore Claude con accesso */
.oauth-box { max-width: 520px; margin: 10px auto 30px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 24px; }
.oauth-box h1 { font-size: 1.5rem; margin: 6px 0 12px; }
.oauth-logo { font: 700 1.1rem var(--sans); color: #fff; }
.oauth-logo span:not(.io) { color: var(--muted); margin: 0 4px; }
.oauth-logo .io { color: var(--gold); font-style: italic; }
.oauth-permessi { font: 400 .9rem var(--sans); padding-left: 0; list-style: none; margin: 0 0 16px; }
.oauth-permessi li { padding: 7px 0; border-bottom: 1px solid var(--line); }
.oauth-azioni { display: flex; gap: 10px; margin: 18px 0 14px; }
.oauth-azioni .btn { flex: 1; justify-content: center; }
.collegamenti { border: 1px solid var(--line); border-radius: var(--radius-sm); margin-bottom: 12px; }
.collegamento { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px;
                border-top: 1px solid var(--line); font: 400 .88rem var(--sans); }
.collegamento:first-child { border-top: 0; }
.url-box { margin: 6px 0; }
.passa-free { max-width: 640px; }
.ecc-blocco h2 { margin-bottom: 4px; }
.ecc-nomi { margin: 6px 0 10px; padding-left: 18px; font: 400 .85rem var(--sans); columns: 2; column-gap: 24px; }
@media (max-width: 600px) { .ecc-nomi { columns: 1; } }
.ecc-via { color: var(--err); margin: 0; }
.ecc-scelta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ecc-scelta .t { position: relative; display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 12px;
                 border: 1px solid var(--line); background: var(--soft); cursor: pointer; }
.ecc-scelta .t input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ecc-scelta .t .e { font-size: 1.2rem; }
.ecc-scelta .t b { display: block; font: 600 .86rem var(--sans); }
.ecc-scelta .t small { display: block; font: 400 .74rem var(--sans); color: var(--muted); }
.ecc-scelta .t:has(input:checked) { border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }
.ecc-scelta .t:has(input[value=elimina]:checked) { border-color: var(--err); box-shadow: inset 0 0 0 1px var(--err); }
@media (max-width: 480px) { .ecc-scelta { grid-template-columns: 1fr; } }
.ecc-scelta .t, .ecc-scelta .t b, .ecc-scelta .t small { text-transform: none; letter-spacing: 0; }
.ecc-scelta .t { margin: 0; color: var(--text); }

/* ---------- 3.0.0.8: Basic, prova Premium, richieste */
.scelta-piano { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; margin: 4px 0 14px; }
.scelta-piano .t { position: relative; display: flex; align-items: center; gap: 10px; padding: 11px 13px; border-radius: 12px; margin: 0;
                   border: 1px solid var(--line); background: var(--soft); cursor: pointer; text-transform: none; letter-spacing: 0; color: var(--text); }
.scelta-piano .t > input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.scelta-piano .t .e { font-size: 1.15rem; }
.scelta-piano .t b { display: block; font: 600 .86rem var(--sans); }
.scelta-piano .t small { display: block; font: 400 .74rem var(--sans); color: var(--muted); }
.scelta-piano .t input[type=date] { margin-top: 4px; padding: 5px 8px; font: 600 .8rem var(--sans); width: 100%; min-width: 0; }
.scelta-piano .t:has(> input:checked) { border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }
.passa-premium { max-width: 640px; }
.utente-prova { font: 600 .74rem var(--sans); color: var(--gold); margin: 1px 0; }
.utente-prova.scaduta { color: var(--err); }
.utente-prova a { color: inherit; }
.richiesta-link { color: var(--gold) !important; }
.nav-conta { background: var(--gold); color: #111; border-radius: 999px; padding: 1px 7px; font: 700 .66rem var(--sans); margin-left: 4px; }

.fine-prova { max-width: 640px; margin: 0 auto; }
.fine-prova h1 { margin-bottom: 4px; }
.perdi { border: 1px solid var(--line); border-radius: var(--radius-sm); margin-bottom: 10px; }
.perdi-riga { display: flex; justify-content: space-between; gap: 10px; padding: 8px 12px; border-top: 1px solid var(--line); font: 400 .85rem var(--sans); }
.perdi-riga:first-child { border-top: 0; }
.perdi-riga.oltre { color: var(--gold); }
.scegli-ricette { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 14px; margin: 8px 0; max-height: 320px; overflow-y: auto;
                  border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 8px 12px; }
.scegli-ricette .check { font: 400 .86rem var(--sans); margin: 4px 0; text-transform: none; letter-spacing: 0; color: var(--text); }
@media (max-width: 600px) { .scegli-ricette { grid-template-columns: 1fr; } }
.scelte-conta { margin: 4px 0 12px; }
.fine-prova textarea { width: 100%; }
.fine-prova-esci { text-align: center; margin: 10px 0 30px; }

.richieste { display: grid; gap: 10px; max-width: 720px; }
.richiesta { background: var(--surface); border: 1px solid var(--gold); border-radius: var(--radius); padding: 14px 16px; }
.richiesta.letta { border-color: var(--line); opacity: .8; }
.richiesta-testa { font: 400 .9rem var(--sans); }
.richiesta-testo { font-style: italic; margin: 8px 0 4px; }
.richiesta .nuova { color: var(--gold); font-weight: 700; }
.richiesta-azioni { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }

/* ---------- 3.0.0.9: app sul telefono */
.banner-app { display: flex; align-items: center; gap: 10px; background: var(--gold-soft); border: 1px solid rgba(237,182,84,.45);
              border-radius: var(--radius); padding: 10px 12px 10px 16px; margin-bottom: 18px; font: 600 .86rem var(--sans); }
.banner-app[hidden] { display: none; }
.banner-app span { flex: 1; }
.banner-app .chiudi { background: none; border: 0; color: var(--muted); font-size: 1rem; padding: 4px 6px; cursor: pointer; }
.installa { max-width: 560px; margin: 0 auto; text-align: center; }
.installa-icona { width: 84px; height: 84px; border-radius: 20px; margin: 6px 0 10px; box-shadow: 0 8px 30px rgba(0,0,0,.5); }
.installa h1 { margin-bottom: 6px; }
.installa .panel { text-align: left; margin-top: 16px; }
.installa-caso[hidden], .installa-avviso[hidden] { display: none; }
.installa-ok { font: 700 1rem var(--sans); color: var(--ok); margin: 0; text-align: center; }
.installa-avviso { border-color: rgba(237,182,84,.45); background: var(--warn); font: 400 .88rem var(--sans); }
.installa-avviso a { color: var(--gold); word-break: break-all; }
.installa-btn { width: 100%; justify-content: center; padding: 14px; font-size: 1rem; margin-bottom: 6px; }
.passi-app { list-style: none; padding: 0; margin: 4px 0 0; }
.passi-app li { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--line); font: 400 .92rem var(--sans); }
.passi-app li:first-child { border-top: 0; }
.passi-app .n { flex: 0 0 26px; height: 26px; border-radius: 50%; background: var(--gold); color: #111; display: grid; place-items: center;
                font: 700 .8rem var(--sans); }
.ico-condividi { width: 20px; height: 20px; vertical-align: -4px; color: #0a84ff; }
.ico-piu { display: inline-grid; place-items: center; width: 20px; height: 20px; border: 1.5px solid var(--text); border-radius: 5px; font-size: .75rem; }
html.in-app .voce-installa { display: none; }

/* ---------- 3.0.0.9: piano settimanale */
.piano-head { align-items: center; flex-wrap: wrap; gap: 10px; }
.settimana-nav { display: flex; align-items: center; gap: 6px; }
.settimana-lbl { font: 700 .9rem var(--sans); min-width: 120px; text-align: center; }
.giorni-tab { display: grid; grid-template-columns: repeat(8, 1fr); gap: 6px; margin: 4px 0 20px; }
.giorni-tab a { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 2px; border-radius: 12px; border: 1px solid var(--line);
                background: var(--surface); color: var(--muted); text-decoration: none; font: 600 .7rem var(--sans); text-transform: uppercase; letter-spacing: .06em; }
.giorni-tab a b { font: 700 1.05rem var(--slab); color: #fff; letter-spacing: 0; }
.giorni-tab a small { font: 500 .62rem var(--sans); text-transform: none; letter-spacing: 0; white-space: nowrap; }
.giorni-tab a small.avviso::before { content: "• "; color: var(--gold); }
.giorni-tab a.oggi { border-color: var(--line-strong); }
.giorni-tab a.oggi span { color: var(--gold); }
.giorni-tab a.on { border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); background: var(--raise); color: #fff; }
.giorni-tab a.tab-settimana b { font-size: .9rem; }
@media (max-width: 600px) { .giorni-tab { grid-template-columns: repeat(4, 1fr); } .giorni-tab a small { font-size: .58rem; } }

.piano-giorno { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 20px; align-items: start; }
@media (max-width: 900px) { .piano-giorno { grid-template-columns: minmax(0, 1fr); } }
.giorno-titolo { font-size: 1.2rem; margin: 0 0 10px; }
.pasto { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 14px 12px; margin-bottom: 10px; }
.pasto-testa { display: flex; justify-content: space-between; align-items: baseline; font: 700 .9rem var(--sans); color: #fff; margin-bottom: 6px; }
.voce { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-top: 1px solid var(--line); }
.voce-nome { flex: 1; min-width: 0; color: var(--text); font: 600 .9rem var(--sans); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.voce-porz select { padding: 4px 6px; font: 600 .75rem var(--sans); width: auto; margin: 0; }
.voce-kcal { font: 600 .75rem var(--sans); color: var(--muted); white-space: nowrap; min-width: 58px; text-align: right; }
.voce-togli { background: none; border: 0; color: var(--err); cursor: pointer; font-size: .85rem; padding: 4px; }
.pasto-add { display: flex; gap: 6px; margin-top: 8px; }
.pasto-add input { flex: 1; min-width: 0; margin: 0; padding: 8px 12px; font-size: .88rem; }

.resoconto .panel { position: sticky; top: 12px; }
.kcal-box { margin: 4px 0 12px; }
.kcal-num { font: 400 .9rem var(--sans); } .kcal-num b { font: 700 1.6rem var(--slab); color: #fff; }
.kbar { height: 8px; border-radius: 99px; background: var(--soft); overflow: hidden; margin-top: 6px; }
.kbar span { display: block; height: 100%; background: var(--ok); border-radius: 99px; }
.kbar span.oltre { background: var(--err); } .kbar span.poco { background: var(--gold); }
.macro-g { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px; font: 400 .8rem var(--sans); color: var(--muted); margin-bottom: 12px; }
.macro-g b { color: #fff; }
.macro-riga { display: grid; grid-template-columns: 88px 1fr 42px; align-items: center; gap: 10px; padding: 5px 0; font: 600 .8rem var(--sans); }
.macro-pct { text-align: right; color: #fff; }
.macro-riga.fuori .macro-pct { color: var(--gold); }
.mbar { position: relative; height: 10px; border-radius: 99px; background: var(--soft); }
.mbar .range { position: absolute; top: 0; bottom: 0; background: rgba(90,168,119,.35); border-radius: 99px; }
.mbar .val { position: absolute; top: -3px; width: 4px; height: 16px; margin-left: -2px; border-radius: 2px; background: #fff; }
.macro-riga.fuori .mbar .val { background: var(--gold); }
.macro-rif { font: 400 .7rem var(--sans); color: var(--muted); margin: 6px 0 0; }
.sugg { display: flex; gap: 10px; background: var(--gold-soft); border: 1px solid rgba(237,182,84,.35); border-radius: var(--radius-sm);
        padding: 10px 12px; margin-top: 12px; font: 400 .85rem var(--sans); }
.sugg p { margin: 0 0 8px; } .sugg p:last-child { margin: 0; }
.sugg-ico { font-size: 1.1rem; }
.bilanciato { color: var(--ok); font: 700 .88rem var(--sans); margin: 12px 0 0; }

.piano-settimana { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 20px; align-items: start; }
@media (max-width: 900px) { .piano-settimana { grid-template-columns: minmax(0, 1fr); } }
.sett-tab { border: 1px solid var(--line); border-radius: var(--radius-sm); margin-bottom: 10px; overflow: hidden; }
.sett-riga { display: grid; grid-template-columns: 1.2fr repeat(4, 1fr); padding: 8px 12px; border-top: 1px solid var(--line);
             font: 500 .85rem var(--sans); color: var(--text); text-decoration: none; text-align: right; }
.sett-riga > span:first-child { text-align: left; }
.sett-riga:hover { background: var(--raise); }
.sett-testa { border-top: 0; font: 700 .66rem var(--sans); text-transform: uppercase; letter-spacing: .1em; color: var(--muted); }
.sett-testa:hover { background: none; }
.sett-media { font-weight: 700; background: var(--soft); }
.sett-riga .fuori { color: var(--gold); }
.piano-azioni { margin-top: 20px; }
.piano-azioni .inline-form { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.piano-azioni-riga { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 12px 0; }
.obiettivo-form { display: flex; align-items: center; gap: 8px; font: 600 .8rem var(--sans); }
.obiettivo-form label { display: flex; align-items: center; gap: 6px; margin: 0; text-transform: none; letter-spacing: 0; color: var(--text); }
.obiettivo-form input { width: 86px; margin: 0; padding: 6px 8px; }

.al-piano { margin-top: 10px; }
.al-piano > summary { list-style: none; display: inline-flex; cursor: pointer; }
.al-piano > summary::-webkit-details-marker { display: none; }
.al-piano-form { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; justify-content: center; }
.al-piano-form select { width: auto; margin: 0; padding: 7px 10px; font: 600 .82rem var(--sans); }
@media (max-width: 600px) {
  .sett-riga { grid-template-columns: 1.1fr repeat(4, 1fr); padding: 8px 8px; font-size: .78rem; }
  .voce-kcal { min-width: 0; }
  .macro-riga { grid-template-columns: 76px 1fr 36px; }
}
.sugg > div { min-width: 0; }
.sugg .btn { white-space: normal; text-align: left; height: auto; line-height: 1.35; }
.voce-porz select { padding-right: 24px; background-position: right 6px center; }

/* ---------- 3.0.0.9: schermata Novità */
body.con-novita { overflow: hidden; }
.novita-velo { position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.72); display: grid; place-items: center; padding: 16px;
               animation: novita-in .25s var(--ease); }
.novita-velo.chiusa { opacity: 0; transition: opacity .2s; }
@keyframes novita-in { from { opacity: 0; } to { opacity: 1; } }
.novita-box { width: min(520px, 100%); max-height: min(86vh, 760px); display: flex; flex-direction: column; background: var(--surface);
              border: 1px solid var(--gold); border-radius: 20px; box-shadow: 0 20px 60px rgba(0,0,0,.6); overflow: hidden; }
.novita-testa { text-align: center; padding: 22px 22px 10px; }
.novita-stella { font-size: 1.8rem; }
.novita-testa h2 { font: 700 1.35rem var(--slab); color: #fff; margin: 4px 0 2px; text-transform: none; letter-spacing: 0; }
.novita-testa h2::after { display: none; }
.novita-lista { overflow-y: auto; padding: 4px 22px 8px; }
.novita-ver { font: 700 .66rem var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--gold); margin: 12px 0 2px; }
.novita-voce { display: flex; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line); }
.novita-ver + .novita-voce, .novita-lista > .novita-voce:first-child { border-top: 0; }
.novita-ico { flex: 0 0 34px; height: 34px; border-radius: 50%; background: var(--gold-soft); border: 1px solid rgba(237,182,84,.35);
              display: grid; place-items: center; font-size: 1rem; }
.novita-voce b { font: 700 .92rem var(--sans); color: #fff; }
.novita-voce p { margin: 2px 0 0; font: 400 .84rem/1.45 var(--sans); color: var(--muted); }
.novita-admin { font: 700 .56rem var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--lilac); border: 1px solid var(--line-strong);
                border-radius: 99px; padding: 2px 6px; vertical-align: 2px; }
.novita-fine { padding: 12px 22px 20px; border-top: 1px solid var(--line); }
.novita-fine .btn { width: 100%; justify-content: center; padding: 13px; }
.novita-pagina { max-width: 720px; }
.novita-pagina .panel h2 small { font-size: .7em; letter-spacing: .1em; }

/* ---------- 3.0.1.0: reparti degli articoli, ingredienti senza salti */
.voce-reparto select { width: auto; margin: 0; padding: 4px 8px; font: 600 .74rem var(--sans); border-style: dashed; }
.spesa li .voce-reparto { margin-left: auto; }
.salvato { color: var(--ok); font: 700 .9rem var(--sans); transition: opacity .6s; }
.salvato.via { opacity: 0; }
/* scelta della ricetta nel piano */
button.pasto-add { display: block; width: 100%; margin-top: 8px; padding: 9px 12px; border: 1px dashed var(--line-strong); border-radius: 12px;
                   background: none; color: var(--muted); font: 600 .84rem var(--sans); text-align: left; cursor: pointer; }
button.pasto-add:hover { color: #fff; border-color: var(--gold); }
.scegli-velo { position: fixed; inset: 0; z-index: 900; background: rgba(0,0,0,.7); display: grid; place-items: center; padding: 16px; }
.scegli-velo[hidden] { display: none; }
.scegli-box { width: min(640px, 100%); height: min(88vh, 820px); display: flex; flex-direction: column; background: var(--surface);
              border: 1px solid var(--line-strong); border-radius: 20px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.6); }
.scegli-testa { display: flex; justify-content: space-between; align-items: flex-start; padding: 16px 18px 8px; }
.kicker-mini { font: 700 .62rem var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--gold); }
.scegli-testa h2 { font: 700 1.1rem var(--slab); color: #fff; margin: 2px 0 0; text-transform: none; letter-spacing: 0; }
.scegli-testa h2::after { display: none; }
.scegli-chiudi { background: var(--soft); border: 1px solid var(--line); color: var(--text); width: 34px; height: 34px; border-radius: 50%; cursor: pointer; }
#scegli-cerca { margin: 4px 18px 10px; width: auto; }
.scegli-cat { display: flex; gap: 6px; overflow-x: auto; padding: 0 18px 10px; scrollbar-width: none; flex-shrink: 0; }
.scegli-cat::-webkit-scrollbar { display: none; }
.chip-cat { flex: 0 0 auto; border: 1px solid var(--line); background: var(--soft); color: var(--text); border-radius: 999px; padding: 7px 12px;
            font: 600 .78rem var(--sans); cursor: pointer; white-space: nowrap; }
.chip-cat small { color: var(--muted); font-size: .7rem; margin-left: 2px; }
.chip-cat.on { background: var(--gold); color: #111; border-color: var(--gold); }
.chip-cat.on small { color: #111; }
.scegli-porz { display: flex; align-items: center; gap: 6px; padding: 0 18px 10px; font: 600 .76rem var(--sans); color: var(--muted); flex-shrink: 0; }
.scegli-porz span:first-child { margin-right: 4px; }
.scegli-porz label { margin: 0; }
.scegli-porz input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.scegli-porz label span { display: inline-block; min-width: 34px; text-align: center; padding: 5px 8px; border-radius: 999px; border: 1px solid var(--line);
                          color: var(--text); text-transform: none; letter-spacing: 0; cursor: pointer; }
.scegli-porz input:checked + span { border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); color: #fff; }
.scegli-lista { flex: 1; overflow-y: auto; border-top: 1px solid var(--line); padding: 4px 10px 12px; }
.scegli-ric { display: flex; align-items: center; gap: 12px; width: 100%; padding: 8px; border: 0; border-bottom: 1px solid var(--line);
              background: none; color: var(--text); text-align: left; cursor: pointer; border-radius: 10px; }
.scegli-ric:hover { background: var(--raise); }
.scegli-ric img, .scegli-lettera { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 10px; object-fit: cover; }
.scegli-lettera { display: grid; place-items: center; background: var(--soft); font: 700 1.2rem var(--slab); color: var(--muted); }
.scegli-info { flex: 1; min-width: 0; }
.scegli-info b { display: block; font: 600 .9rem var(--sans); color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.scegli-info small { font: 400 .74rem var(--sans); color: var(--muted); }
.scegli-kcal { font: 700 .9rem var(--sans); color: var(--gold); text-align: right; white-space: nowrap; }
.scegli-kcal small { display: block; font: 500 .62rem var(--sans); color: var(--muted); }
.scegli-vuoto { text-align: center; padding: 24px; }
@media (max-width: 600px) { .scegli-velo { padding: 0; place-items: end stretch; } .scegli-box { height: 92vh; border-radius: 20px 20px 0 0; width: 100%; } }
/* menu Impostazioni con sottomenu per categoria */
.dd-categorie { min-width: 250px; }
.dd-sub { border-radius: 10px; }
.dd-sub + .dd-sub { border-top: 1px solid var(--line); }
.dd-sub > summary { list-style: none; display: flex; align-items: center; gap: 10px; padding: 11px 12px; border-radius: 10px; cursor: pointer;
                    font: 600 .88rem/1 var(--sans); color: var(--text); }
.dd-sub > summary::-webkit-details-marker { display: none; }
.dd-sub > summary:hover { background: var(--raise); color: #fff; }
.dd-ico { width: 22px; text-align: center; font-size: 1rem; }
.dd-freccia { margin-left: auto; width: 7px; height: 7px; border-right: 1.6px solid var(--muted); border-bottom: 1.6px solid var(--muted);
              transform: rotate(-45deg); transition: transform .2s var(--ease); }
.dd-sub[open] > summary .dd-freccia { transform: rotate(45deg); }
.dd-sub[open] > summary { color: var(--gold); }
.dd-sub-voci { padding: 2px 0 8px 44px; }
.dd-sub-voci a { padding: 8px 10px; font-size: .84rem; border-radius: 8px; }
@media (max-width: 700px) {
  .ing-tab thead { display: none; }
  .ing-tab, .ing-tab tbody { display: block; }
  .ing-tab tr { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 4px 8px; padding: 10px 0; border-bottom: 1px solid var(--line); }
  .ing-tab td { display: block; border: 0; padding: 0; }
  .ing-tab td:first-child { grid-column: 1 / -1; }
  .ing-tab td:nth-child(2)::before { content: "Ricette: "; color: var(--muted); font-size: .75rem; }
  .ing-tab .ing-riga { display: grid; grid-template-columns: 1fr 1fr auto; gap: 6px; }
  .ing-tab .ing-riga input, .ing-tab .ing-riga select { min-width: 0; margin: 0; }
}
.spesa li:has(.voce-reparto) { flex-wrap: wrap; }
.spesa li .voce-reparto { order: 3; flex-basis: 100%; margin: 4px 0 0 34px; }
@media (max-width: 700px) {
  .ing-tab tr { grid-template-columns: 1fr auto auto; padding: 12px 0; }
  .ing-tab tr.warn { background: none; }
  .ing-tab tr.warn td { background: none; }
  .ing-tab .ing-riga { grid-template-columns: 1fr auto; }
  .ing-tab .ing-riga input[name=nome] { grid-column: 1 / -1; }
  .ing-tab tr.warn .ing-reparto { border-color: var(--gold); }
  .ing-tab td:nth-child(3) { display: flex; gap: 6px; }
  .ing-tab td:nth-child(2) { font: 400 .78rem var(--sans); color: var(--muted); }
}
.ing-reparto { padding-right: 30px; text-overflow: ellipsis; }

/* ---------- 3.0.1.1: pulsanti della ricetta tutti uguali, con icona */
.azioni-ricetta { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; margin: 18px auto 0; max-width: 760px; }
.azioni-ricetta > form, .azioni-ricetta > a, .azioni-ricetta > details { margin: 0; min-width: 0; }
.azioni-ricetta .btn.az { width: 100%; height: 46px; display: flex; align-items: center; justify-content: flex-start; gap: 10px; padding: 0 14px;
                          font: 600 .84rem var(--sans); text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.az-ico { flex: 0 0 22px; text-align: center; font-size: 1rem; }
.azioni-ricetta .az-elimina { color: var(--err); }
.azioni-ricetta .az-elimina:hover { border-color: var(--err); }
.azioni-ricetta .al-piano { margin: 0; }
.azioni-ricetta .al-piano[open] { grid-column: 1 / -1; }
.azioni-ricetta .al-piano > summary.btn.az { display: flex; }
.azioni-ricetta .al-piano[open] > summary { border-color: var(--gold); color: var(--gold); }
@media (max-width: 600px) { .azioni-ricetta { grid-template-columns: 1fr 1fr; } .azioni-ricetta .btn.az { font-size: .78rem; padding: 0 10px; gap: 8px; } }
.vis-scelta a small { opacity: .7; margin-left: 4px; font-size: .78em; }
.azioni-ricetta { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.azioni-ricetta .btn.az { white-space: normal; height: auto; min-height: 48px; line-height: 1.2; padding: 8px 14px; overflow: visible; }
@media (max-width: 600px) { .azioni-ricetta { grid-template-columns: 1fr 1fr; } .azioni-ricetta .btn.az { padding: 8px 10px; } }
/* ricette dal web */
.web-passo { max-width: 720px; }
.web-passo h2 { display: flex; align-items: center; gap: 10px; }
.web-passo h2 .n { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--gold); color: #111;
                   font: 700 .8rem var(--sans); letter-spacing: 0; }
.web-cerca, .web-importa { gap: 8px; flex-wrap: nowrap; }
.web-cerca input, .web-importa input { margin: 0; min-width: 0; }
@media (max-width: 600px) { .web-cerca, .web-importa { flex-wrap: wrap; } .web-cerca .btn, .web-importa .btn { width: 100%; justify-content: center; } }
.sito { display: inline-block; font: 600 .7rem var(--sans); border: 1px solid var(--line); border-radius: 99px; padding: 2px 8px; margin: 3px 3px 0 0; color: var(--text); }

/* ---------- 3.0.1.2: versione della ricetta nel piano */
.pasto .voce { flex-wrap: wrap; row-gap: 4px; }
.pasto .voce .voce-nome { flex: 1 1 calc(100% - 44px); order: 0; }
.pasto .voce > form:last-child { order: 1; margin-left: auto; }
.pasto .voce .voce-var { order: 2; margin-right: auto; }
.pasto .voce .voce-porz:not(.voce-var) { order: 3; }
.pasto .voce .voce-kcal { order: 4; }
.voce-var select { max-width: 150px; }
.scegli-var { overflow-x: auto; scrollbar-width: none; flex-wrap: nowrap; }
.scegli-var::-webkit-scrollbar { display: none; }
.scegli-var label span { white-space: nowrap; }

/* ---------- 3.0.1.2: icone in «Nuova ricetta», import da social, siti della ricerca web */
.scelta { flex-direction: row; align-items: center; gap: 14px; }
.scelta .scelta-ico { flex: 0 0 40px; height: 40px; display: grid; place-items: center; border-radius: 12px;
                      background: var(--raise); font-size: 1.25rem; color: inherit; }
.scelta .scelta-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; font-size: inherit; color: inherit; }
.scelta .scelta-txt span { font-size: .84rem; color: var(--muted); }
.social-chip { display: flex; flex-wrap: wrap; gap: 6px; margin: -4px 0 14px; }
.social-chip span { font: 600 .78rem var(--sans); border: 1px solid var(--line); border-radius: 99px; padding: 4px 10px; color: var(--text); }
.siti-scelta { display: flex; flex-wrap: wrap; gap: 2px; margin-top: 4px; }
button.sito { background: none; cursor: pointer; }
button.sito:hover { border-color: var(--accent, #f5c518); color: #fff; }
.siti-form textarea { font-family: var(--mono, monospace); font-size: .9rem; }