/* Famiglia Carnera - styles shared by the hub, Mamma/Papà/Insieme, Patrimonio and Admin (on top of styles.css).
   Mischia Carnera brand: every section uses Radicchio (--pri) as its accent. --rose/--plum/--slate stay only as
   palette tones for tags (Mamma Radicchio, Papà Vigna, Patrimonio Caffè). Wider column (980px) because the brothers and sister also use it on a computer. */
:root{
  --rose:#7B1F3A; --rose-soft:#F4DEE3; --on-rose:#FFFFFF;
  --plum:#2B201C; --plum-soft:#EEE6DC; --on-plum:#FAF6EF;
  --slate:#6A5850; --slate-soft:#F0E8E1; --on-slate:#FFFFFF;
  --acc:var(--pri); --acc-soft:var(--pri-soft); --on-acc:var(--on-pri);
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --rose:#E59AAC; --rose-soft:#43202A; --on-rose:#2B0B15;
  --plum:#E7B54A; --plum-soft:#3E3014; --on-plum:#2B201C;
  --slate:#C9B8AD; --slate-soft:#3A2E28; --on-slate:#2B201C;
}}
:root[data-theme="dark"]{
  --rose:#E59AAC; --rose-soft:#43202A; --on-rose:#2B0B15;
  --plum:#E7B54A; --plum-soft:#3E3014; --on-plum:#2B201C;
  --slate:#C9B8AD; --slate-soft:#3A2E28; --on-slate:#2B201C;
}
/* every section uses the family colour (Radicchio) for header, buttons and tabs; data-tone is kept only as a hook */

/* accent applied to shared components */
.fam .brand{color:var(--acc)}
.fam .btn.primary{background:var(--acc);border-color:var(--acc);color:var(--on-acc)}
.fam .opt[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:var(--on-acc)}
.fam .toggle2.olive .btn[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:var(--on-acc)}
.fam .tab[aria-current="page"]{color:var(--acc)}
.fam .tab[aria-current="page"] .ico{background:var(--acc-soft)}
.fam .cbox[aria-pressed="true"]{background:var(--acc);border-color:var(--acc)}
.fam .chip.plan{background:var(--acc);color:var(--on-acc)}
.fam .link{color:var(--acc)}
.fam .link.strong{color:var(--ink)}
.fam .banner{background:var(--acc-soft)}
.fam .tabs a.tab{text-decoration:none}

/* layout */
.wrap.wide{max-width:980px}
.fam main.wrap{padding-block:18px 120px}
.fam .tabs .in{max-width:980px}
.top .wrap.wide{max-width:980px}
.hdr-acts{display:flex;gap:8px;align-items:center;flex:none}
a.icon-btn{text-decoration:none}
.avatar{appearance:none;width:48px;height:48px;border-radius:50%;border:0;background:var(--acc-soft);color:var(--acc);font:inherit;font-weight:700;font-size:1rem;cursor:pointer;flex:none}
.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.02em}
.sec-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:middle;flex:none}
.opt.new{border-style:dashed;color:var(--acc)}
.opt[disabled]{opacity:.55;cursor:default}

/* hub */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.tile{display:flex;align-items:center;gap:14px;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:none;color:var(--ink);text-decoration:none;min-height:110px}
.tile:hover{border-color:var(--tc)}
.tile-ico{width:52px;height:52px;border-radius:6px;display:grid;place-items:center;background:var(--tcs);color:var(--tc);flex:none}
.tile-ico svg{width:28px;height:28px}
.tile-b{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.tile-b strong{font-family:var(--f-display);font-size:1.35rem}
.tile-b .small{color:var(--muted)}
.tile-sum{font-size:.88rem;font-weight:700;margin-top:4px}
.tile-sum .bad,.bad{color:var(--red)}
.tile{--tc:var(--pri);--tcs:var(--pri-soft)}

/* segmented controls */
.seg3{display:flex;gap:6px;background:var(--sunk);padding:4px;border-radius:999px;align-self:flex-start;max-width:100%;overflow-x:auto}
.seg3 .opt{border:0;background:transparent;min-height:42px}
.seg3 .opt[aria-pressed="true"]{background:var(--surface);color:var(--acc);box-shadow:none}
.cnt{display:inline-block;min-width:22px;padding:0 6px;border-radius:999px;background:var(--acc);color:var(--on-acc);font-size:.78rem;line-height:22px;text-align:center}
.seg2{display:flex;gap:4px}
.seg2 .opt{min-height:42px;padding:6px 12px}

/* calendar toolbar */
.calbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.calnav{display:flex;align-items:center;gap:6px}
.calnav .icon-btn{font-size:1.5rem;font-weight:700}
.callbl{font-family:var(--f-display);font-size:1.15rem;min-width:9ch;text-align:center}
.calright{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.btn svg{width:20px;height:20px}
.foot-links{justify-content:flex-start}
.foot-links .btn{flex:0 1 auto}

/* day card */
.cday{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:12px 14px;display:flex;flex-direction:column;gap:10px;scroll-margin-top:90px}
.cday.is-today{border:2px solid var(--acc)}
.cday.is-past{background:transparent;opacity:.8}
.cday-h{display:flex;justify-content:space-between;align-items:center;gap:8px}
.cday-h h3{font-size:1.15rem}
.cday-h .btn{min-height:40px;padding:4px 10px}
.evlist{display:flex;flex-direction:column;gap:6px}
.evrow{appearance:none;font:inherit;color:inherit;text-align:left;cursor:pointer;display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px;align-items:start;padding:10px 12px;border:1px solid var(--line);border-left:5px solid var(--pc,#6A5850);border-radius:6px;background:var(--bg);width:100%}
.evt{font-variant-numeric:tabular-nums;font-weight:700;font-size:.95rem;white-space:nowrap}
.evb{display:flex;flex-direction:column;gap:4px;min-width:0}
.tmeta{display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center}
.pchip{display:inline-flex;align-items:center;gap:5px;font-size:.84rem;font-weight:700;padding:2px 9px 2px 6px;border-radius:999px;background:var(--sunk)}
.pchip i{width:10px;height:10px;border-radius:50%;display:inline-block}
.pchip.none{font-weight:400;color:var(--muted);padding-left:9px}
.tg.subj-mamma{background:var(--rose-soft);color:var(--rose)}
.tg.subj-papa{background:var(--olive-soft);color:var(--olive)}
.tg.subj-patrimonio{background:var(--plum-soft);color:var(--plum)}

/* coverage */
.cover{display:flex;flex-direction:column;gap:3px}
.cbar{position:relative;height:16px;border-radius:6px;overflow:hidden;background:repeating-linear-gradient(135deg,var(--red-soft) 0 6px,color-mix(in srgb,var(--red) 30%,var(--red-soft)) 6px 12px)}
.cover.ok .cbar{background:var(--sunk)}
.cbar i{position:absolute;top:0;bottom:0;opacity:.9}
.cbar-l{display:flex;justify-content:space-between;font-size:.78rem;color:var(--muted);font-weight:700}
.cover.bad .cbar-l span:nth-child(2){color:var(--red)}
.cover.ok .cbar-l span:nth-child(2){color:var(--olive)}
.gaprow{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 12px;border-radius:6px;background:var(--red-soft);color:var(--red)}
.gaprow .evb strong{font-weight:700}
.gaprow .small{color:var(--red);opacity:.85}
.gacts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.gacts .btn{min-height:40px;padding:4px 12px;font-size:.9rem}
.gacts .btn.ghost{color:var(--red);border-color:color-mix(in srgb,var(--red) 35%,transparent)}
.gapsum{border:2px solid var(--red-soft);border-radius:6px;padding:12px;display:flex;flex-direction:column;gap:8px;background:var(--surface)}
.gapsum-h{display:flex;flex-direction:column;gap:2px;color:var(--red)}
@media (max-width:560px){
  .evrow{grid-template-columns:1fr}
  .gaprow{grid-template-columns:1fr auto}
  .gaprow .evt{grid-column:1/-1}
}

/* month */
.month{background:var(--surface);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.mhead,.mgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.mhead span{padding:8px 6px;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;text-align:center;background:var(--sunk)}
.mcell{appearance:none;font:inherit;color:inherit;background:var(--surface);border:0;border-top:1px solid var(--line);border-left:1px solid var(--line);min-height:96px;padding:6px;text-align:left;display:flex;flex-direction:column;gap:3px;cursor:pointer;min-width:0}
.mcell:nth-child(7n+1){border-left:0}
.mcell.out{background:var(--bg);color:var(--muted)}
.mcell.is-today .mnum{background:var(--acc);color:var(--on-acc);border-radius:999px;padding:0 8px}
.mnum{font-weight:700;display:flex;align-items:center;gap:4px;align-self:flex-start}
.gapdot{width:9px;height:9px;border-radius:50%;background:var(--red);display:inline-block}
.mevs{display:flex;flex-direction:column;gap:2px;min-width:0}
.mev{font-size:.74rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-left:3px solid var(--pc);padding-left:4px}
.more{font-size:.72rem;color:var(--muted)}
.mdots{display:none;gap:3px;flex-wrap:wrap}
.mdots i{width:7px;height:7px;border-radius:50%}
@media (max-width:640px){ .mevs{display:none} .mdots{display:flex} .mcell{min-height:60px} }

/* editors */
.wdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.wdays .opt{padding:8px 0;text-align:center}
.swatches{display:flex;gap:8px;flex-wrap:wrap}
.sw{width:40px;height:40px;border-radius:50%;border:3px solid var(--surface);box-shadow:0 0 0 1.5px var(--line);cursor:pointer}
.sw[aria-pressed="true"]{box-shadow:0 0 0 3px var(--ink)}

/* to-dos */
.quickadd{display:flex;gap:8px}
.quickadd .input{flex:1;min-width:0}
.trow{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center;padding:10px 14px;border-top:1px solid var(--line)}
.tbody{appearance:none;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:4px;padding:2px 0;min-width:0}
.trow.ck .nm{text-decoration:line-through;color:var(--muted)}
.prio{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--red);margin-right:6px;vertical-align:middle}
.due{font-size:.84rem;color:var(--muted);font-weight:700}
.due.late{color:var(--red)}
.cat-h.late{color:var(--red);background:var(--red-soft)}

/* patrimonio */
.hero{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;background:var(--acc-soft);border-radius:6px;padding:16px 18px}
.hero > div{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1 1 280px}
.hero .big{font-family:var(--f-display);font-size:2.3rem;font-weight:700;line-height:1.05;color:var(--acc);font-variant-numeric:tabular-nums}
.mid{font-family:var(--f-display);font-size:1.5rem;font-weight:700;font-variant-numeric:tabular-nums}
.owners .panel{display:flex;flex-direction:column;gap:2px}
.meter.bad .mv{color:var(--red)}
.succ summary{cursor:pointer;list-style-position:outside}
.succ[open] summary{margin-bottom:10px}
.succ ul{padding-left:20px;display:flex;flex-direction:column;gap:6px}
.tbl-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:6px}
.tbl{border-collapse:collapse;width:100%;font-size:.95rem}
.tbl th{font-size:.76rem;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);text-align:left;padding:10px 12px;background:var(--sunk);white-space:nowrap}
.tbl td{padding:9px 12px;border-top:1px solid var(--line);vertical-align:top}
.tbl .r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl .c{text-align:center}
.tbl.budget td,.tbl.budget th{padding:7px 10px;font-size:.88rem}
.pos{color:var(--olive);font-weight:700}
.neg{color:var(--red);font-weight:700}
.aval{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:none}
.card{appearance:none;font:inherit;color:inherit;text-align:left;cursor:pointer;width:100%;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:14px 16px;display:flex;flex-direction:column;gap:10px;box-shadow:none}
article.card{cursor:default}
.card-h{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.card-h strong{font-family:var(--f-display);font-size:1.2rem}
.bars{display:flex;flex-direction:column;gap:6px}
.barrow{display:grid;grid-template-columns:90px minmax(0,1fr) 100px;gap:8px;align-items:center;font-size:.9rem}
.bar{height:10px;background:var(--sunk);border-radius:5px;overflow:hidden;display:block}
.bar i{display:block;height:100%}
.tbl.split select{min-height:46px;font-size:.95rem}
.pcts{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:6px;margin-top:6px}
.pcts label{display:flex;flex-direction:column;gap:2px;font-size:.8rem;font-weight:700}
.pcts .input{min-height:42px}
.comments{display:flex;flex-direction:column;gap:8px}
.comments h3{font-size:1.05rem}
.cmt{background:var(--bg);border-radius:6px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.cmt-h{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cmt-new{display:flex;gap:8px;align-items:flex-end}
.cmt-new .textarea{min-height:60px;flex:1}
.agbody{white-space:normal;line-height:1.5}
.approvals{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.appr{font-size:.85rem;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--sunk);color:var(--muted)}
.appr.on{background:var(--olive-soft);color:var(--olive)}
.linkish{appearance:none;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer;padding:0;flex:1}

/* budget */
.chart{width:100%;height:auto;display:block}
.chart .b-cost{fill:var(--red);opacity:.75}
.chart .b-in{fill:var(--olive);opacity:.8}
.chart .cap{fill:none;stroke:var(--frost);stroke-width:2.5}
.chart .capd{fill:var(--frost)}
.chart .ax{font-size:11px;fill:var(--muted);text-anchor:middle;font-family:var(--f-body)}
.chart .axl{stroke:var(--line)}
.chart .zero{stroke:var(--red);stroke-dasharray:4 4}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.82rem;color:var(--muted);margin-top:6px}
.legend i{display:inline-block;width:14px;height:10px;border-radius:2px;margin-right:6px;vertical-align:middle}
.legend i.b-cost{background:var(--red);opacity:.75}
.legend i.b-in{background:var(--olive)}
.legend i.cap{background:var(--frost);height:3px}
.brow{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:flex-end;padding:10px 0;border-top:1px dashed var(--line)}
.brow:first-of-type{border-top:0}
.brow > .input{flex:1 1 220px}
.brow label{display:flex;flex-direction:column;gap:3px}
.brow label > span{font-size:.78rem;font-weight:700;color:var(--muted)}
.brow p{flex-basis:100%;margin:0}
.brow .input{min-height:46px;font-size:1rem}
.brow .x{min-height:46px}
.bname{display:flex;flex-direction:column;gap:2px;flex:1 1 200px}
.chk{flex-direction:row!important;align-items:center;gap:6px!important;font-size:.88rem;font-weight:700;min-height:46px}
.chk input{width:22px;height:22px}
.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.bgrid label{display:flex;flex-direction:column;gap:4px;font-size:.88rem;font-weight:700}
.input.num{font-variant-numeric:tabular-nums}

/* admin */
.matrix td,.matrix th{vertical-align:middle}
.mx{appearance:none;width:44px;height:44px;border-radius:6px;border:2px solid var(--line);background:var(--surface);color:var(--on-acc);font:inherit;font-size:1.3rem;font-weight:700;cursor:pointer}
.mx.on{background:var(--acc);border-color:var(--acc)}
.mx[disabled]{opacity:.6;cursor:default}
.matrix tr.off td{opacity:.5}

/* Mischia Carnera brand: logo marks (one-colour masks, coloured by --logo: Radicchio, or Polenta on Caffè in dark mode) */
.brandrow{display:flex;align-items:center;gap:12px;min-width:0}
.mark{display:block;flex:none;width:46px;aspect-ratio:968/766;background:var(--logo);-webkit-mask:url(brand/simbolo.png) center/contain no-repeat;mask:url(brand/simbolo.png) center/contain no-repeat}
.logo-nome{display:block;width:150px;aspect-ratio:986/322;background:var(--logo);-webkit-mask:url(brand/nome.png) center/contain no-repeat;mask:url(brand/nome.png) center/contain no-repeat}
.logo-completo{display:block;width:min(260px,72vw);aspect-ratio:984/996;margin:0 auto;background:var(--logo);-webkit-mask:url(brand/completo.png) center/contain no-repeat;mask:url(brand/completo.png) center/contain no-repeat}
.motto{display:flex;align-items:center;justify-content:center;gap:12px;font-weight:600;font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-top:18px;text-align:center}
.motto::before,.motto::after{content:"";height:2px;width:28px;background:var(--logo);flex:none}
@media (max-width:420px){.mark{width:36px}.brandrow{gap:9px}.logo-nome{width:124px}}

/* ---- Mischia Carnera brand layer (brand book v1.0): the look of a printed team book.
   Radicchio "jersey" header with the logo in Tovaglia and a Polenta stripe; flat cards with thin Filo borders and 6px corners;
   pills for choices and tags; Roboto Slab Black for titles and big numbers; spaced capitals only for short labels;
   Radicchio "pull" blocks for the key figure of a page; the motto closes every page. */
:root{--filo2:#D6C7B3}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--filo2:#5A483F}}
:root[data-theme="dark"]{--filo2:#5A483F}

/* header = the family jersey */
body::before{background:var(--radicchio)}
.top{background:var(--radicchio);color:var(--tovaglia);border-bottom:4px solid var(--polenta);--logo:var(--tovaglia)}
.top .brand,.fam .top .brand{color:var(--tovaglia);font-weight:900;letter-spacing:.005em}
.top .datel{color:rgba(250,246,239,.82)}
.top .icon-btn{background:transparent;border-color:rgba(250,246,239,.45);color:var(--tovaglia)}
.top .icon-btn[aria-pressed="true"]{background:var(--tovaglia);color:var(--radicchio);border-color:var(--tovaglia)}
.top .avatar{background:var(--tovaglia);color:var(--radicchio);font-family:var(--f-display);font-weight:800}
.top .sync{background:rgba(250,246,239,.18);color:var(--tovaglia)}
.top .sync[data-s="demo"]{background:var(--polenta);color:var(--caffe)}
.top :focus-visible{outline-color:var(--polenta)}

/* titles: slab, heavy, with a short Polenta rule under the page title */
main h1{font-weight:900;color:var(--pri);letter-spacing:-.005em}
main > h1::after,main > .stack > h1:first-child::after,.freezer-head h1::after,.login h1::after{content:"";display:block;width:36px;height:3px;background:var(--polenta);margin-top:8px}
h2,.sheet-title{font-weight:800}
.sheet-title{color:var(--pri)}
.dish h3,.cday-h h3,.day h3{font-weight:800}
.tile-b strong,.card-h strong{font-weight:800}

/* spaced capitals for short labels (dates, sections, table heads), like the motto */
.h-sm,.eyebrow,.cat-h,.subcat,.slot-m,.mhead span,.tbl th,.brow label > span{letter-spacing:.16em;font-weight:600}

/* big numbers in Roboto Slab */
.meter .mv,.hero .big,.mid{font-weight:900}
.frow2 .qty,.qty{font-family:var(--f-display);font-weight:800}
.stepper.sm strong,.qin{font-family:var(--f-display);font-weight:800}

/* flat cards with thin borders */
.btn,.opt,.pick,.gbtn,.input,.textarea,.search,.qbox,.icon-btn{border-color:var(--filo2)}
.btn.primary,.opt[aria-pressed="true"],.gbtn[aria-pressed="true"]{border-color:var(--pri)}
.btn.primary:hover{filter:brightness(1.08)}
.btn:not(.primary):not(.frost):hover,.opt:not([aria-pressed="true"]):hover,.pick:hover,.gbtn:not([aria-pressed="true"]):hover{border-color:var(--pri)}
:focus-visible,.input:focus,.textarea:focus,.search:focus,.qbox:focus-within{outline:3px solid var(--polenta);outline-offset:2px}

/* bottom tabs: a Radicchio bar on top of the current tab, no bubble */
.tab{font-weight:600;position:relative}
.tab .ico,.tab[aria-current="page"] .ico,.fam .tab[aria-current="page"] .ico{background:none}
.tab[aria-current="page"]::before{content:"";position:absolute;top:0;left:20%;right:20%;height:3px;border-radius:0 0 3px 3px;background:var(--pri)}

/* segmented switch (Calendario / Da fare / Per me): pills, the chosen one filled */
.seg3{background:transparent;padding:0;gap:6px}
.seg3 .opt{border:1.5px solid var(--filo2);background:var(--surface)}
.seg3 .opt[aria-pressed="true"]{background:var(--pri);border-color:var(--pri);color:var(--on-pri);box-shadow:none}
.seg3 .opt[aria-pressed="true"] .cnt{background:var(--on-pri);color:var(--pri)}

/* hub tiles: a Radicchio top rule, as in the brand book's three readings */
.tile{border-top:3px solid var(--pri)}
.tile-ico{background:var(--radicchio);color:var(--tovaglia)}
.tile .chev{color:var(--pri)}

/* "pull" blocks: the key figure of a page on Radicchio (Patrimonio, Budget, Admin), the freezer on Vigna (replaced Caffè as the strong colour, 24 Oct 2026) */
.hero,.fam .hero{background:var(--radicchio);color:var(--tovaglia)}
.hero .big{color:var(--tovaglia)}
.hero .muted,.hero .small,.hero p{color:rgba(250,246,239,.88)}
.hero .h-sm,.hero .eyebrow{color:var(--polenta)}
.hero b,.hero strong{color:var(--tovaglia)}
.hero .btn.primary,.fam .hero .btn.primary{background:var(--tovaglia);border-color:var(--tovaglia);color:var(--radicchio)}
.hero .btn:not(.primary){background:transparent;border-color:rgba(250,246,239,.5);color:var(--tovaglia)}
.hero .link{color:var(--tovaglia)}
.freezer-head{background:var(--vigna);color:#FFFFFF}
.freezer-head h1{color:#FFFFFF}
.freezer-head p,.freezer-head .muted{color:rgba(250,246,239,.88)}

/* banners and notes: Carta with a Polenta edge, like the open points in the brand book */
.banner,.fam .banner{background:var(--sunk);border-left:4px solid var(--polenta)}
.banner.frost{background:var(--frost-soft)}
.note{border-left:4px solid var(--filo2)}
.note.bad{border-left-color:var(--red)}
.gapsum{border-color:var(--red);border-width:2px}

/* sheet (bottom panel) and toast */
.sheet{border-top:4px solid var(--pri)}
.backdrop{background:rgba(43,32,28,.55)}
.toast{background:var(--caffe);color:var(--tovaglia);border-left:4px solid var(--polenta)}

/* chips and tags: pills */
.chip,.st,.tg,.pchip,.appr,.ok-pill{font-weight:600}
.chip.plan,.chip.bad,.st.bad{font-weight:700}

/* the motto closes every page */
main.wrap::after{content:"Si avanza solo insieme";display:block;width:max-content;max-width:100%;margin:18px auto 0;padding:0 42px;font-weight:600;font-size:.74rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);text-align:center;
  background:linear-gradient(var(--logo),var(--logo)) 0 50%/28px 2px no-repeat,linear-gradient(var(--logo),var(--logo)) 100% 50%/28px 2px no-repeat}
main.wrap:has(.login)::after{display:none}
.freezer-head{border:1px solid var(--vigna)}

/* time grid (Orario): classic week, 08–20 */
.tgrid-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:var(--surface);-webkit-overflow-scrolling:touch}
.tgrid{min-width:680px;font-size:.8rem}
.tg-row{display:grid;grid-template-columns:44px repeat(7,minmax(0,1fr))}
.tg-gut{position:sticky;left:0;z-index:3;background:var(--surface);border-right:1px solid var(--line)}
.tg-headrow{border-bottom:1px solid var(--line)}
.tg-dh{appearance:none;font:inherit;color:var(--muted);background:var(--surface);border:0;border-left:1px solid var(--line);border-top:3px solid transparent;padding:6px 8px 8px;text-align:left;cursor:pointer;display:flex;flex-direction:column;line-height:1.15}
.tg-dh b{font-family:var(--f-display);font-size:1.3rem;color:var(--ink);font-weight:800}
.tg-dh.is-today{border-top-color:var(--acc);color:var(--acc)}
.tg-dh.is-today b{color:var(--acc)}
.tg-adrow{border-bottom:1px solid var(--line);background:var(--sunk)}
.tg-adrow .tg-gut{background:var(--sunk);font-size:.66rem;color:var(--muted);padding:4px;line-height:1.1}
.tg-ad{border-left:1px solid var(--line);padding:3px;display:flex;flex-direction:column;gap:3px;min-height:28px}
.tg-body{position:relative}
.tg-body .tg-gut span{position:absolute;right:6px;transform:translateY(-50%);color:var(--muted);font-size:.72rem;font-variant-numeric:tabular-nums}
.tg-body .tg-gut span:first-child{transform:none;top:2px!important}
.tg-col{position:relative;border-left:1px solid var(--line);background-image:repeating-linear-gradient(to bottom,var(--line) 0 1px,transparent 1px var(--gh)),repeating-linear-gradient(to bottom,transparent 0 calc(var(--gh)/2),color-mix(in srgb,var(--line) 45%,transparent) calc(var(--gh)/2) calc(var(--gh)/2 + 1px),transparent calc(var(--gh)/2 + 1px) var(--gh))}
.tg-col.is-today{background-color:color-mix(in srgb,var(--acc) 5%,transparent)}
.tg-col.is-past{background-color:color-mix(in srgb,var(--sunk) 60%,transparent)}
.tg-slot{position:absolute;left:0;right:0;appearance:none;border:0;background:transparent;cursor:pointer;padding:0}
.tg-slot:hover{background:color-mix(in srgb,var(--acc) 8%,transparent)}
.tg-gap{position:absolute;left:0;right:0;appearance:none;border:0;border-left:3px solid var(--red);cursor:pointer;padding:3px 4px;text-align:left;font:inherit;font-size:.68rem;font-weight:700;color:var(--red);background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--red) 14%,transparent) 0 6px,transparent 6px 12px);overflow:hidden}
.tg-ev{position:absolute;z-index:1;appearance:none;font:inherit;text-align:left;cursor:pointer;color:var(--ink);background:color-mix(in srgb,var(--pc) 22%,var(--surface));border:0;border-left:4px solid var(--pc);border-radius:4px;padding:3px 5px;overflow:hidden;display:flex;flex-direction:column;gap:1px;line-height:1.2;box-shadow:0 0 0 1px var(--surface)}
.tg-ev:hover{background:color-mix(in srgb,var(--pc) 34%,var(--surface))}
.tg-ev .nm{font-weight:700;overflow:hidden;text-overflow:ellipsis}
.tg-ev .tm{font-size:.7rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tg-ev.short{flex-direction:row;gap:6px;align-items:center;white-space:nowrap}
.tg-ev.short .tm{display:none}
.tg-ev.ad{position:static;width:100%;white-space:nowrap;text-overflow:ellipsis;font-weight:700;font-size:.72rem}
.tg-now{position:absolute;left:0;right:0;z-index:2;height:2px;background:var(--acc);pointer-events:none}
.tg-now::before{content:"";position:absolute;left:-5px;top:-4px;width:10px;height:10px;border-radius:50%;background:var(--acc)}
.is-past .tg-ev{opacity:.7}
.tg-body .tg-gut span.last{transform:translateY(-100%)}

/* ---------- sites, logins and the personal questionnaire (25 Oct 2026) ---------- */
a.opt{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.opt.sm{min-height:38px;padding:6px 12px;font-size:.88rem}
.center{text-align:center}
.demo-bar{border-style:dashed}
.qz-prog{display:flex;align-items:center;gap:10px}
.qz-track{flex:1;height:8px;border-radius:999px;background:var(--line);overflow:hidden}
.qz-track i{display:block;height:100%;background:var(--pri);transition:width .3s}
#qz-pct{font-weight:700;min-width:3ch}
.qz-steps{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.qz-steps .opt{flex:0 0 auto}
.qz-q{display:flex;flex-direction:column;gap:8px;padding-top:14px;border-top:1px solid var(--line)}
.qz-q:first-of-type{border-top:0;padding-top:0}
.qz-label{font-weight:700}
.qz textarea{resize:vertical}
.qz-scale{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px}
.qz-pole{font-size:.9rem;font-weight:600}
.qz-pole.r{text-align:right}
.qz-dots{display:flex;gap:8px}
.qz-dot{appearance:none;width:30px;height:30px;border-radius:50%;border:2px solid var(--filo2,var(--line));background:var(--surface);cursor:pointer;padding:0}
.qz-dot[aria-pressed="true"]{background:var(--pri);border-color:var(--pri)}
.qz-colors{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}
.qz-sw{appearance:none;font:inherit;font-size:.82rem;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 4px;border:1.5px solid var(--filo2,var(--line));border-radius:6px;background:var(--surface);color:var(--ink);cursor:pointer}
.qz-sw i{width:36px;height:36px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.qz-sw[aria-pressed="true"]{border-color:var(--pri);box-shadow:0 0 0 2px var(--pri);font-weight:700}
@media (max-width:420px){.qz-scale{grid-template-columns:1fr 1fr}.qz-dots{grid-column:1 / -1;grid-row:2;justify-content:space-between}.qz-pole.r{grid-row:1;grid-column:2}}
.login a:not(.btn),.note a,.empty a,.small a{color:var(--pri);font-weight:700}

/* family home: "Prima cosa: le tue scelte di brand" (hub.js brandFirst), until the questionnaire is finished */
.brand-first{display:flex;flex-direction:column;gap:6px;background:var(--radicchio);color:var(--tovaglia);border-radius:6px;padding:16px 18px;text-decoration:none}
.brand-first .eyebrow{color:var(--polenta)}
.brand-first strong{font-family:var(--f-display);font-size:1.35rem;line-height:1.15}
.brand-first .bf-bar{height:6px;border-radius:3px;background:rgba(250,246,239,.25);overflow:hidden;margin-top:4px}
.brand-first .bf-bar i{display:block;height:100%;background:var(--polenta)}
.brand-first .bf-go{font-weight:700;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.brand-first .bf-go .mono{font-weight:400;font-size:.8rem;opacity:.8}
.brand-first:hover{filter:brightness(1.08)}