/* Kherno Team, l'app dello staff dentro l'iPhone (team-app.js). Scura come l'app vera:
   colori e forme ripresi dal sistema Kherno (shared-ui), misure in --u. Dati di fantasia. */
.tt-app { --bg: #080A0E; --card: #12151B; --bordo: #242932; --fill: #1A1E26; --riga: #1C2128; --ink: #F3F5F8; --g4: #8A9199; --g5: #6E737D; --g6: #3C414B;
  --blu: #6E8CFF; --blu-f: #1B3BD9; --blu-w: #161B33; --verde: #3FBF8F; --verde-f: #0E7C56; --verde-w: #04231A; --rosso: #F2695E; --rosso-f: #B3261E; --giallo: #E0A33A;
  padding: 0 !important; gap: 0 !important; background: var(--bg) !important; color: var(--ink) !important; font-family: var(--font-body, sans-serif); }
.tt-app::before { color: #F3F5F8 !important; }
.tt-app::after { filter: invert(1); }
.tt-app button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform .12s; }
.tt-app button:active { transform: scale(.97); }
.tt-app svg { display: block; }
.tt-scr { position: absolute; inset: 0; display: flex; flex-direction: column; background: var(--bg); padding-top: calc(13 * var(--u)); transition: transform .42s cubic-bezier(.2, .8, .2, 1), opacity .3s; }
.tt-scr.via-dx { transform: translateX(100%); }
.tt-scr.via-sx { transform: translateX(-28%); opacity: .4; pointer-events: none; }
.tt-corpo { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; padding: 0 calc(5 * var(--u)) calc(30 * var(--u)); }
.tt-corpo::-webkit-scrollbar { display: none; }
.tt-head { display: flex; align-items: center; gap: calc(2.4 * var(--u)); padding: calc(1.6 * var(--u)) calc(5 * var(--u)) calc(3.4 * var(--u)); }
.tt-marchio { display: inline-flex; align-items: center; gap: calc(2 * var(--u)); font-family: var(--font-display, sans-serif); font-weight: 700; font-size: calc(4 * var(--u)); letter-spacing: .06em; }
.tt-marchio svg { width: calc(6.4 * var(--u)); height: calc(6.4 * var(--u)); color: var(--blu); }
.tt-marchio b { color: var(--blu); font-weight: 700; }
.tt-ibtn { margin-left: auto; width: calc(10 * var(--u)); height: calc(10 * var(--u)); border-radius: calc(2.6 * var(--u)) !important; background: var(--card) !important; border: 1px solid var(--fill) !important; display: grid !important; place-items: center; color: var(--g4) !important; }
.tt-ibtn + .tt-ibtn { margin-left: 0; }
.tt-ibtn svg { width: calc(4.2 * var(--u)); height: calc(4.2 * var(--u)); }
.tt-indietro { margin-left: 0; }
.tt-eyb { display: block; font-family: var(--font-mono, monospace); font-size: calc(2.7 * var(--u)); letter-spacing: .1em; text-transform: uppercase; color: var(--g5); }
.tt-t { font-family: var(--font-display, sans-serif); font-weight: 700; letter-spacing: -.035em; line-height: 1.08; }
.tt-card { background: var(--card); border: 1px solid var(--bordo); border-radius: calc(4.2 * var(--u)); padding: calc(4 * var(--u)); margin-bottom: calc(3 * var(--u)); }
.tt-num { font-family: var(--font-mono, monospace); font-variant-numeric: tabular-nums; }
/* splash e PIN */
.tt-splash { position: absolute; inset: 0; z-index: 9; background: var(--bg); display: grid; place-content: center; justify-items: center; gap: calc(5 * var(--u)); transition: opacity .5s; }
.tt-splash svg { width: calc(22 * var(--u)); color: var(--blu); }
.tt-splash svg circle { animation: tt-dot .5s cubic-bezier(.2, .9, .3, 1.3) both; }
.tt-splash svg circle:nth-of-type(2) { animation-delay: .1s; } .tt-splash svg circle:nth-of-type(3) { animation-delay: .2s; }
.tt-splash svg path { stroke-dasharray: 40; stroke-dashoffset: 40; animation: tt-draw .6s .35s ease forwards; }
.tt-splash span { font-weight: 700; font-size: calc(3.8 * var(--u)); letter-spacing: .16em; animation: tt-in .5s .8s both; }
.tt-splash span b { color: var(--blu); }
.tt-splash.via { opacity: 0; pointer-events: none; }
@keyframes tt-dot { from { transform: translateX(-12px); opacity: 0; } }
@keyframes tt-draw { to { stroke-dashoffset: 0; } }
@keyframes tt-in { from { opacity: 0; } }
.tt-pin { align-items: center; text-align: center; }
.tt-pin .tt-t { font-size: calc(7.6 * var(--u)); margin-top: calc(10 * var(--u)); }
.tt-pin p { color: var(--g5); font-size: calc(3.6 * var(--u)); margin: calc(1.6 * var(--u)) 0 calc(6 * var(--u)); }
.tt-punti { display: flex; gap: calc(4 * var(--u)); justify-content: center; margin-bottom: calc(8 * var(--u)); }
.tt-punti i { width: calc(4 * var(--u)); height: calc(4 * var(--u)); border-radius: 50%; border: 2px solid var(--bordo); transition: background .15s, border-color .15s; }
.tt-punti i.on { background: var(--blu); border-color: var(--blu); }
.tt-tast { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(3 * var(--u)); width: calc(78 * var(--u)); }
.tt-tast button { aspect-ratio: 1.25; border-radius: calc(4 * var(--u)) !important; background: var(--card) !important; border: 1px solid var(--bordo) !important; font-family: var(--font-display, sans-serif); font-weight: 600; font-size: calc(6 * var(--u)); display: grid !important; place-items: center; }
.tt-tast button.vuoto { visibility: hidden; }
.tt-tast svg { width: calc(5 * var(--u)); height: calc(5 * var(--u)); }
.tt-pin small { color: var(--g5); font-size: calc(3 * var(--u)); margin-top: calc(5 * var(--u)); }
/* barra a capsula */
.tt-tabs { position: absolute; z-index: 5; left: calc(4 * var(--u)); right: calc(4 * var(--u)); bottom: calc(5 * var(--u)); display: grid; grid-template-columns: repeat(4, 1fr);
  padding: calc(1 * var(--u)); border-radius: 99px; background: rgba(8, 10, 14, .55); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, .1); box-shadow: 0 12px 40px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .12); transition: opacity .3s, transform .3s; }
.tt-tabs.via { opacity: 0; transform: translateY(40%); pointer-events: none; }
.tt-tabs button { position: relative; display: grid !important; justify-items: center; gap: calc(.6 * var(--u)); padding: calc(2 * var(--u)) 0 !important; border-radius: 99px !important; color: var(--g4) !important; font-size: calc(2.6 * var(--u)); }
.tt-tabs button svg { width: calc(5.2 * var(--u)); height: calc(5.2 * var(--u)); }
.tt-tabs button.on { color: var(--blu) !important; font-weight: 700; background: rgba(255, 255, 255, .1) !important; }
.tt-badge { position: absolute; top: calc(1 * var(--u)); left: 56%; min-width: calc(4.4 * var(--u)); height: calc(4.4 * var(--u)); border-radius: 99px; background: var(--rosso-f); color: #fff; font-size: calc(2.6 * var(--u)); font-weight: 700; display: grid; place-items: center; padding: 0 calc(1 * var(--u)); }
/* home */
.tt-ciao { font-size: calc(6.6 * var(--u)); margin: calc(1 * var(--u)) 0 calc(.6 * var(--u)); }
.tt-data { color: var(--g4); font-size: calc(3.6 * var(--u)); margin-bottom: calc(4 * var(--u)); }
.tt-turno { background: var(--blu-f); color: #fff; border-radius: calc(6.5 * var(--u)); padding: calc(5 * var(--u)); margin-bottom: calc(5 * var(--u)); }
.tt-turno .su { display: flex; justify-content: space-between; align-items: center; font-size: calc(3.7 * var(--u)); color: rgba(255, 255, 255, .85); }
.tt-pill { display: inline-flex; align-items: center; gap: calc(1.2 * var(--u)); border-radius: 99px; padding: calc(1 * var(--u)) calc(2.6 * var(--u)); font-size: calc(3 * var(--u)); font-weight: 600; background: rgba(255, 255, 255, .2); color: #fff; }
.tt-pill.in { background: #fff; color: var(--blu-f); }
.tt-pill.in::before { content: ""; width: calc(1.6 * var(--u)); height: calc(1.6 * var(--u)); border-radius: 50%; background: var(--verde); }
.tt-orario { font-family: var(--font-display, sans-serif); font-weight: 700; letter-spacing: -.035em; font-size: calc(10 * var(--u)); line-height: 1; margin: calc(3 * var(--u)) 0 calc(1.6 * var(--u)); }
.tt-turno .ruolo { font-size: calc(3.7 * var(--u)); }
.tt-turno .giu { display: flex; justify-content: space-between; align-items: center; margin-top: calc(4.4 * var(--u)); gap: calc(2 * var(--u)); font-size: calc(3.3 * var(--u)); color: rgba(255, 255, 255, .85); }
.tt-timbra { display: inline-flex !important; align-items: center; gap: calc(1.6 * var(--u)); background: #fff !important; color: var(--blu-f) !important; font-weight: 700; font-size: calc(3.6 * var(--u)); border-radius: calc(4 * var(--u)) !important; padding: calc(2.6 * var(--u)) calc(3.6 * var(--u)) !important; white-space: nowrap; }
.tt-timbra svg { width: calc(4.2 * var(--u)); height: calc(4.2 * var(--u)); }
.tt-sez { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: calc(3 * var(--u)); }
.tt-sez .tt-t { font-size: calc(5 * var(--u)); }
.tt-sez button { color: var(--blu) !important; font-size: calc(3.2 * var(--u)); font-weight: 600; }
.tt-pref { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(2.4 * var(--u)); margin-bottom: calc(5 * var(--u)); }
.tt-pref button { background: var(--card) !important; border: 1px solid var(--bordo) !important; border-radius: calc(4 * var(--u)) !important; padding: calc(3.6 * var(--u)) calc(1 * var(--u)) !important; display: grid !important; justify-items: center; gap: calc(1.6 * var(--u)); font-size: calc(3 * var(--u)); text-align: center; line-height: 1.2; }
.tt-pref svg { width: calc(6.4 * var(--u)); height: calc(6.4 * var(--u)); color: var(--blu); }
.tt-big { font-family: var(--font-display, sans-serif); font-weight: 700; letter-spacing: -.035em; line-height: 1; font-size: calc(7.6 * var(--u)); }
.tt-barra { height: calc(.7 * var(--u)); border-radius: 9px; background: var(--fill); margin: calc(2.4 * var(--u)) 0 calc(1.6 * var(--u)); overflow: hidden; }
.tt-barra i { display: block; height: 100%; background: var(--verde-f); border-radius: 9px; }
.tt-sub { color: var(--g4); font-size: calc(3.2 * var(--u)); }
.tt-riga { display: flex !important; align-items: center; gap: calc(3 * var(--u)); width: 100%; text-align: left; }
.tt-riga .tile { flex: 0 0 auto; width: calc(10 * var(--u)); height: calc(10 * var(--u)); border-radius: calc(2.4 * var(--u)); background: var(--blu-w); color: var(--blu); display: grid; place-items: center; }
.tt-riga .tile svg { width: calc(5 * var(--u)); height: calc(5 * var(--u)); }
.tt-riga .tile.v { background: rgba(14, 124, 86, .25); color: var(--verde); }
.tt-riga span.t { flex: 1; display: grid; gap: calc(.4 * var(--u)); }
.tt-riga b { font-size: calc(3.8 * var(--u)); font-weight: 600; }
.tt-riga small { color: var(--g4); font-size: calc(3 * var(--u)); }
.tt-riga > svg { width: calc(4 * var(--u)); height: calc(4 * var(--u)); color: var(--g5); }
.tt-chip { font-family: var(--font-mono, monospace); font-size: calc(2.6 * var(--u)); padding: calc(1 * var(--u)) calc(2.2 * var(--u)); border-radius: 99px; background: var(--fill); color: #C3C8D2; white-space: nowrap; }
.tt-chip.tardi { background: #2E0907; color: var(--rosso); }
/* funzioni */
.tt-griglia { display: grid; grid-template-columns: 1fr 1fr; gap: calc(3 * var(--u)); }
.tt-griglia button { height: calc(30 * var(--u)); background: var(--card) !important; border: 1px solid var(--bordo) !important; border-radius: calc(4 * var(--u)) !important; display: grid !important; place-content: center; justify-items: center; gap: calc(2.4 * var(--u)); font-family: var(--font-display, sans-serif); font-weight: 600; font-size: calc(3.3 * var(--u)); }
.tt-griglia .tile { width: calc(12 * var(--u)); height: calc(12 * var(--u)); border-radius: calc(2.4 * var(--u)); background: var(--blu-w); color: var(--blu); display: grid; place-items: center; }
.tt-griglia .tile svg { width: calc(6 * var(--u)); height: calc(6 * var(--u)); }
/* presenza */
.tt-stato { display: flex; gap: calc(2.6 * var(--u)); align-items: center; border-radius: calc(4 * var(--u)); padding: calc(3.4 * var(--u)); margin: calc(3 * var(--u)) 0; font-size: calc(3.4 * var(--u)); background: var(--card); border: 1px solid var(--bordo); color: var(--g4); }
.tt-stato.in { background: var(--verde-w); border-color: #07382A; color: #9fe3c7; }
.tt-stato b { color: var(--ink); }
.tt-stato svg { flex: 0 0 auto; width: calc(5 * var(--u)); height: calc(5 * var(--u)); }
.tt-eu { display: grid; grid-template-columns: 1fr 1fr; gap: calc(3 * var(--u)); margin-bottom: calc(3 * var(--u)); }
.tt-eu button { height: calc(32 * var(--u)); border-radius: calc(4 * var(--u)) !important; display: grid !important; place-content: center; justify-items: center; gap: calc(1.2 * var(--u)); color: #fff !important; font-family: var(--font-display, sans-serif); font-weight: 600; font-size: calc(4.2 * var(--u)); letter-spacing: .04em; transition: opacity .3s, background .3s; }
.tt-eu button svg { width: calc(7 * var(--u)); height: calc(7 * var(--u)); }
.tt-eu button small { font-size: calc(2.5 * var(--u)); letter-spacing: .08em; text-transform: uppercase; opacity: .8; font-family: var(--font-body, sans-serif); font-weight: 500; }
.tt-eu .entra { background: var(--verde-f) !important; box-shadow: 0 0 0 2px #0E7C56; }
.tt-eu .esci { background: var(--rosso-f) !important; }
.tt-eu button:disabled { background: var(--card) !important; border: 1px solid var(--fill) !important; color: var(--g5) !important; opacity: .4; box-shadow: none; cursor: default; }
.tt-ok { display: flex; gap: calc(2.4 * var(--u)); align-items: center; background: var(--verde-w); border: 1px solid #07382A; color: #9fe3c7; border-radius: calc(4 * var(--u)); padding: calc(3 * var(--u)); font-size: calc(3.4 * var(--u)); margin-bottom: calc(3 * var(--u)); animation: tt-in .4s both; }
.tt-ok svg { width: calc(5 * var(--u)); height: calc(5 * var(--u)); flex: 0 0 auto; }
.tt-tim { display: flex; align-items: center; gap: calc(2.6 * var(--u)); background: var(--card); border: 1px solid var(--bordo); border-radius: calc(3.4 * var(--u)); padding: calc(2.8 * var(--u)) calc(3.4 * var(--u)); margin-bottom: calc(2 * var(--u)); font-size: calc(3.4 * var(--u)); }
.tt-tim svg { width: calc(4.6 * var(--u)); height: calc(4.6 * var(--u)); }
.tt-tim .r { margin-left: auto; text-align: right; font-family: var(--font-mono, monospace); font-size: calc(3.2 * var(--u)); }
.tt-tim .r small { display: block; color: var(--g5); font-size: calc(2.6 * var(--u)); }
/* sala */
.tt-zone { display: flex; gap: calc(2 * var(--u)); margin-bottom: calc(3.4 * var(--u)); }
.tt-zone button { border-radius: 99px !important; padding: calc(1.8 * var(--u)) calc(3.6 * var(--u)) !important; background: var(--card) !important; color: var(--g4) !important; font-size: calc(3.2 * var(--u)); font-weight: 600; }
.tt-zone button.on { background: var(--blu-f) !important; color: #fff !important; }
.tt-tavoli { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(3 * var(--u)); }
.tt-tav { aspect-ratio: 1; border-radius: calc(4 * var(--u)) !important; background: var(--card) !important; border: 1px solid var(--fill) !important; padding: calc(3 * var(--u)) !important; display: flex !important; flex-direction: column; justify-content: space-between; text-align: left; position: relative; }
.tt-tav b { font-family: var(--font-display, sans-serif); font-weight: 600; font-size: calc(5.4 * var(--u)); }
.tt-tav small { display: flex; justify-content: space-between; align-items: center; color: var(--g4); font-family: var(--font-mono, monospace); font-size: calc(2.8 * var(--u)); }
.tt-tav small em { font-style: normal; font-weight: 700; color: var(--blu); }
.tt-tav.aperto { background: #242932 !important; border-color: var(--g6) !important; }
.tt-tav.pronto { background: rgba(14, 124, 86, .15) !important; border-color: rgba(14, 124, 86, .6) !important; }
.tt-tav.pronto small em { color: var(--verde); }
.tt-tav.conto { background: rgba(179, 38, 30, .15) !important; border-color: rgba(179, 38, 30, .6) !important; }
.tt-tav.conto small em { color: var(--rosso); }
.tt-tav .min { position: absolute; top: calc(3 * var(--u)); right: calc(3 * var(--u)); font-family: var(--font-mono, monospace); font-weight: 700; font-size: calc(2.8 * var(--u)); color: var(--g4); }
.tt-tav.pronto .min { color: var(--verde); } .tt-tav.conto .min { color: var(--rosso); }
.tt-leg { display: flex; gap: calc(2 * var(--u)); flex-wrap: wrap; margin-top: calc(4 * var(--u)); color: var(--ink); font-size: calc(3.7 * var(--u)); font-weight: 600; }
.tt-leg span { display: inline-flex; align-items: center; gap: calc(1.6 * var(--u)); padding: calc(1.4 * var(--u)) calc(3 * var(--u)); border-radius: 99px; background: var(--card); border: 1px solid var(--bordo); }
.tt-leg i { display: inline-block; width: calc(3.2 * var(--u)); height: calc(3.2 * var(--u)); border-radius: 50%; flex: 0 0 auto; }
/* turni, ore, mance */
.tt-seg { display: flex; gap: calc(1.6 * var(--u)); margin-bottom: calc(3.4 * var(--u)); }
.tt-seg span { border-radius: 99px; padding: calc(1.6 * var(--u)) calc(3 * var(--u)); background: var(--fill); color: var(--g4); font-size: calc(3 * var(--u)); font-weight: 600; }
.tt-seg span.on { background: #F2F3F6; color: #0A0C11; }
.tt-sett { border-radius: calc(4 * var(--u)); padding: calc(3.4 * var(--u)); border: 1px solid var(--fill); background: var(--card); margin-bottom: calc(3 * var(--u)); }
.tt-sett.ora { border-color: #07382A; }
.tt-sett .top { display: flex; justify-content: space-between; font-size: calc(3.4 * var(--u)); font-weight: 600; margin-bottom: calc(2.6 * var(--u)); }
.tt-sett .top b { color: var(--verde); } .tt-sett .top em { font-style: normal; color: var(--blu); }
.tt-giorni { display: grid; grid-template-columns: repeat(7, 1fr); gap: calc(1.2 * var(--u)); }
.tt-giorni div { border-radius: calc(1.6 * var(--u)); padding: calc(1.4 * var(--u)) 0; text-align: center; font-size: calc(2.4 * var(--u)); display: grid; gap: calc(.4 * var(--u)); border: 1px dashed var(--g6); color: var(--g5); }
.tt-giorni div.l { border: 1px solid #07382A; background: rgba(4, 35, 26, .5); color: var(--ink); }
.tt-giorni .g { font-family: var(--font-mono, monospace); opacity: .7; }
.tt-giorni .a { color: var(--verde); } .tt-giorni .b { color: var(--rosso); }
.tt-stat { display: grid; grid-template-columns: 1fr 1fr; gap: calc(2.6 * var(--u)); margin-bottom: calc(3 * var(--u)); }
.tt-stat div { border-radius: calc(4 * var(--u)); padding: calc(3.6 * var(--u)); background: var(--card); border: 1px solid var(--bordo); display: grid; gap: calc(1 * var(--u)); }
.tt-stat small { font-family: var(--font-mono, monospace); font-size: calc(2.5 * var(--u)); text-transform: uppercase; letter-spacing: .06em; color: var(--g5); }
.tt-stat b { font-family: var(--font-display, sans-serif); font-size: calc(6 * var(--u)); letter-spacing: -.03em; }
.tt-stat .v { color: var(--verde); } .tt-stat .s { color: #7dd3fc; } .tt-stat .bl { color: var(--blu); } .tt-stat .vi { color: #a78bfa; }
.tt-lista > div { display: flex; justify-content: space-between; align-items: center; padding: calc(2.8 * var(--u)) 0; border-bottom: 1px solid var(--riga); font-size: calc(3.3 * var(--u)); }
.tt-lista small { display: block; color: var(--g5); font-size: calc(2.7 * var(--u)); margin-top: calc(.4 * var(--u)); }
.tt-lista em { font-style: normal; font-family: var(--font-display, sans-serif); font-weight: 600; color: var(--blu); }
/* chat */
.tt-canale { display: flex !important; gap: calc(3 * var(--u)); align-items: center; width: 100%; text-align: left; background: var(--card) !important; border: 1px solid var(--bordo) !important; border-radius: calc(4 * var(--u)) !important; padding: calc(3 * var(--u)) !important; margin-bottom: calc(2.4 * var(--u)); }
.tt-canale .tile { flex: 0 0 auto; width: calc(11 * var(--u)); height: calc(11 * var(--u)); border-radius: calc(3 * var(--u)); background: var(--blu-w); color: var(--blu); display: grid; place-items: center; }
.tt-canale .tile svg { width: calc(5.4 * var(--u)); height: calc(5.4 * var(--u)); }
.tt-canale span.t { flex: 1; min-width: 0; display: grid; gap: calc(.6 * var(--u)); }
.tt-canale b { font-size: calc(3.8 * var(--u)); display: flex; justify-content: space-between; }
.tt-canale b i { font-style: normal; font-family: var(--font-mono, monospace); font-weight: 400; color: var(--g5); font-size: calc(2.7 * var(--u)); }
.tt-canale small { color: var(--g4); font-size: calc(3.1 * var(--u)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-canale .tt-badge { position: static; }
.tt-msgs { display: grid; gap: calc(2 * var(--u)); align-content: end; min-height: 100%; }
.tt-msg { max-width: 78%; padding: calc(2.6 * var(--u)) calc(3.4 * var(--u)); border-radius: calc(4 * var(--u)); font-size: calc(3.4 * var(--u)); line-height: 1.35; background: var(--card); border: 1px solid var(--riga); justify-self: start; animation: tt-in .3s both; }
.tt-msg small { display: block; color: var(--g4); font-size: calc(2.6 * var(--u)); margin-bottom: calc(.6 * var(--u)); }
.tt-msg.mio { justify-self: end; background: var(--blu-f); border-color: var(--blu-f); border-bottom-right-radius: calc(1 * var(--u)); color: #fff; }
.tt-scrivi { position: absolute; left: 0; right: 0; bottom: 0; display: flex; gap: calc(2 * var(--u)); padding: calc(2.6 * var(--u)) calc(4 * var(--u)) calc(7 * var(--u)); background: var(--bg); border-top: 1px solid var(--riga); }
.tt-scrivi input { flex: 1; min-width: 0; background: var(--card); border: 1px solid var(--bordo); border-radius: 99px; color: var(--ink); font: inherit; font-size: calc(3.6 * var(--u)); padding: calc(2.6 * var(--u)) calc(3.6 * var(--u)); outline: 0; }
.tt-scrivi input::placeholder { color: var(--g5); }
.tt-scrivi button { width: calc(11 * var(--u)); height: calc(11 * var(--u)); border-radius: 50% !important; background: var(--blu-f) !important; color: #fff !important; display: grid !important; place-items: center; }
.tt-scrivi svg { width: calc(4.6 * var(--u)); height: calc(4.6 * var(--u)); }
/* panoramica */
.tt-kpi { display: grid; grid-template-columns: 1fr 1fr; gap: calc(2.6 * var(--u)); margin-bottom: calc(3 * var(--u)); }
.tt-kpi div { background: var(--card); border: 1px solid var(--bordo); border-radius: calc(4 * var(--u)); padding: calc(3.4 * var(--u)); display: grid; gap: calc(1 * var(--u)); }
.tt-kpi small { color: var(--g4); font-size: calc(3 * var(--u)); }
.tt-kpi b { font-family: var(--font-display, sans-serif); font-size: calc(6 * var(--u)); letter-spacing: -.03em; }
.tt-kpi em { font-style: normal; font-weight: 700; font-size: calc(3 * var(--u)); color: var(--verde); }
.tt-kpi i { font-style: normal; color: var(--g5); font-size: calc(2.5 * var(--u)); }
.tt-ce > div { display: flex; justify-content: space-between; align-items: center; padding: calc(2.6 * var(--u)) 0; border-bottom: 1px solid var(--riga); font-size: calc(3.3 * var(--u)); }
.tt-ce small { display: block; color: var(--g5); font-size: calc(2.6 * var(--u)); }
.tt-ce .m { background: rgba(7, 56, 42, .4); border: 1px solid rgba(6, 95, 70, .6); border-radius: calc(3 * var(--u)); padding: calc(3 * var(--u)); margin-top: calc(2.4 * var(--u)); border-bottom: 1px solid rgba(6, 95, 70, .6); }
.tt-ce .m b { color: var(--verde); font-size: calc(4.4 * var(--u)); }
.tt-spark { width: 100%; height: calc(22 * var(--u)); }

/* ---------- PIN grande e chiaro */
.tt-pin .tt-t { font-size: calc(7 * var(--u)) !important; margin-top: calc(6 * var(--u)) !important; }
.tt-qualsiasi { color: var(--blu); }
.tt-pin p { margin: calc(1.6 * var(--u)) 0 calc(3 * var(--u)) !important; font-size: calc(3.8 * var(--u)) !important; color: var(--g4) !important; }
.tt-esempio { font-size: calc(3.6 * var(--u)); color: var(--g4); margin-bottom: calc(5 * var(--u)); }
.tt-esempio b { font-family: var(--font-mono, monospace); color: var(--ink); font-size: calc(5 * var(--u)); letter-spacing: .1em; margin-left: calc(1 * var(--u)); }
.tt-punti { gap: calc(5 * var(--u)) !important; margin-bottom: calc(6 * var(--u)) !important; }
.tt-punti i { width: calc(5.4 * var(--u)) !important; height: calc(5.4 * var(--u)) !important; }
.tt-auto { margin-top: calc(5 * var(--u)); background: var(--blu-f) !important; color: #fff !important; border-radius: 99px !important; padding: calc(3 * var(--u)) calc(6 * var(--u)) !important; font-weight: 700; font-size: calc(3.8 * var(--u)); box-shadow: 0 0 0 calc(1.2 * var(--u)) rgba(110, 140, 255, .25); }
/* ---------- tema chiaro (come SettingsScreen dell'app) */
.tt-app.chiaro { --bg: #FAFAFB; --card: #FFFFFF; --bordo: #E4E7EC; --fill: #F2F3F6; --riga: #EEF0F4; --ink: #0A0C11; --g4: #3C414B; --g5: #6E737D; --g6: #9AA0AA;
  --blu: #1B3BD9; --blu-f: #1B3BD9; --blu-w: #EEF1FF; --verde: #0E7C56; --verde-w: #E9F6F0; --rosso: #B3261E; color: var(--ink) !important; }
.tt-app.chiaro::before { color: #0A0C11 !important; } .tt-app.chiaro::after { filter: none; }
.tt-app.chiaro .tt-card, .tt-app.chiaro .tt-tast button, .tt-app.chiaro .tt-pref button, .tt-app.chiaro .tt-griglia button { box-shadow: 0 1px 2px rgba(10, 12, 17, .06), 0 4px 12px rgba(10, 12, 17, .04); }
.tt-app.chiaro .tt-tabs { background: rgba(250, 250, 251, .8); border-color: rgba(10, 12, 17, .08); box-shadow: 0 12px 30px rgba(10, 12, 17, .12); }
.tt-app.chiaro .tt-tabs button.on { background: rgba(27, 59, 217, .08) !important; }
.tt-app.chiaro .tt-stato.in, .tt-app.chiaro .tt-ok { background: #E9F6F0; border-color: #bfe6d3; color: #0E7C56; }
.tt-app.chiaro .tt-seg span.on { background: #0A0C11; color: #fff; }
.tt-app.chiaro .tt-tav.aperto { background: #E4E7EC !important; border-color: #C9CED6 !important; }
.tt-app.chiaro .tt-chip { color: #3C414B; }
.tt-tema { display: grid; grid-template-columns: 1fr 1fr; gap: calc(1.4 * var(--u)); margin-top: calc(3.4 * var(--u)); padding: calc(1 * var(--u)); border-radius: calc(3 * var(--u)); background: var(--fill); }
.tt-tema button { border-radius: calc(2.4 * var(--u)) !important; padding: calc(2.4 * var(--u)) 0 !important; font-weight: 600; font-size: calc(3.6 * var(--u)); color: var(--g4) !important; }
.tt-tema button.on { background: var(--card) !important; color: var(--ink) !important; box-shadow: 0 1px 3px rgba(0, 0, 0, .2); }
/* ---------- foglio dal basso (coperti, comanda) */
.tt-velo { position: absolute; inset: 0; z-index: 7; background: rgba(0, 0, 0, .55); opacity: 0; pointer-events: none; transition: opacity .3s; }
.tt-velo.on { opacity: 1; pointer-events: auto; }
.tt-foglio { position: absolute; left: 0; right: 0; bottom: 0; z-index: 8; background: var(--card); border-radius: calc(6.5 * var(--u)) calc(6.5 * var(--u)) 0 0; padding: calc(5 * var(--u)) calc(5 * var(--u)) calc(9 * var(--u));
  display: grid; gap: calc(2 * var(--u)); transform: translateY(105%); transition: transform .4s cubic-bezier(.2, .8, .2, 1); max-height: 80%; overflow-y: auto; border-top: 1px solid var(--bordo); }
.tt-foglio.on { transform: none; }
.tt-cta { width: 100%; background: var(--blu-f) !important; color: #fff !important; border-radius: calc(3.4 * var(--u)) !important; padding: calc(3.6 * var(--u)) !important; font-weight: 700; font-size: calc(4 * var(--u)); display: inline-flex !important; justify-content: center; align-items: center; gap: calc(1.6 * var(--u)); margin-top: calc(2 * var(--u)); }
.tt-cta svg { width: calc(4.4 * var(--u)); height: calc(4.4 * var(--u)); }
.tt-cta.verde { background: #10b981 !important; }
.tt-cta:disabled { opacity: .4; }
.tt-cop { display: flex; justify-content: center; align-items: center; gap: calc(6 * var(--u)); margin: calc(3 * var(--u)) 0; }
.tt-cop button { width: calc(14 * var(--u)); height: calc(14 * var(--u)); border-radius: 50% !important; background: var(--fill) !important; font-size: calc(7 * var(--u)); display: grid !important; place-items: center; }
.tt-cop b { font-family: var(--font-display, sans-serif); font-size: calc(15 * var(--u)); min-width: calc(14 * var(--u)); text-align: center; }
.tt-fatto { display: grid; justify-items: center; gap: calc(2 * var(--u)); text-align: center; padding: calc(3 * var(--u)) 0; }
.tt-fatto i { width: calc(15 * var(--u)); height: calc(15 * var(--u)); border-radius: 50%; background: var(--verde-f); color: #fff; display: grid; place-items: center; font-style: normal; font-size: calc(7 * var(--u)); font-weight: 700; animation: tt-in .4s both; }
.tt-fatto b { font-size: calc(5 * var(--u)); }
/* ---------- comanda */
.tt-catg { overflow-x: auto; scrollbar-width: none; }
.tt-catg button { white-space: nowrap; flex: 0 0 auto; }
.tt-piatti { display: grid; grid-template-columns: 1fr 1fr; gap: calc(2.6 * var(--u)); }
.tt-piatti button { min-height: calc(22 * var(--u)); background: var(--card) !important; border: 1px solid var(--bordo) !important; border-radius: calc(4 * var(--u)) !important; padding: calc(3 * var(--u)) !important; display: flex !important; flex-direction: column; justify-content: space-between; text-align: left; }
.tt-piatti b { font-size: calc(3.6 * var(--u)); font-weight: 600; }
.tt-piatti span { font-family: var(--font-mono, monospace); color: var(--blu); font-size: calc(3.2 * var(--u)); }
.tt-barcomanda { position: absolute; left: calc(4 * var(--u)); right: calc(4 * var(--u)); bottom: calc(6 * var(--u)); z-index: 4; display: flex !important; justify-content: space-between; align-items: center;
  background: var(--blu-f) !important; color: #fff !important; border-radius: calc(4 * var(--u)) !important; padding: calc(3.6 * var(--u)) calc(4.4 * var(--u)) !important; font-size: calc(3.6 * var(--u)); font-weight: 600; box-shadow: 0 10px 30px rgba(27, 59, 217, .4); }
.tt-barcomanda b { font-family: var(--font-mono, monospace); font-size: calc(4.2 * var(--u)); }
.tt-barcomanda:disabled { opacity: .45; }
.tt-righe { display: grid; gap: calc(1.6 * var(--u)); margin: calc(2 * var(--u)) 0; }
.tt-righe div { display: flex; align-items: center; gap: calc(2.4 * var(--u)); padding: calc(2 * var(--u)) 0; border-bottom: 1px solid var(--riga); font-size: calc(3.6 * var(--u)); }
.tt-righe button { width: calc(8 * var(--u)); height: calc(8 * var(--u)); border-radius: 50% !important; background: var(--fill) !important; display: grid !important; place-items: center; font-size: calc(5 * var(--u)); }
.tt-righe b { color: var(--blu); }
.tt-righe span { flex: 1; }
.tt-righe em { font-style: normal; font-family: var(--font-mono, monospace); }
.tt-tot { display: flex; justify-content: space-between; align-items: baseline; font-size: calc(3.6 * var(--u)); color: var(--g4); }
.tt-tot b { font-family: var(--font-display, sans-serif); font-size: calc(7 * var(--u)); color: var(--ink); }
/* ---------- calendario task e regia */
.tt-due { display: grid; grid-template-columns: 1fr 1fr; gap: calc(2.4 * var(--u)); margin-bottom: calc(3 * var(--u)); }
.tt-due button { background: var(--card) !important; border: 1px solid var(--bordo) !important; border-radius: calc(3.4 * var(--u)) !important; padding: calc(2.8 * var(--u)) !important; display: inline-flex !important; gap: calc(1.6 * var(--u)); justify-content: center; align-items: center; font-weight: 600; font-size: calc(3.4 * var(--u)); }
.tt-due svg { width: calc(4.4 * var(--u)); height: calc(4.4 * var(--u)); color: var(--blu); }
.tt-mese { background: var(--card); border: 1px solid var(--bordo); border-radius: calc(4 * var(--u)); padding: calc(3 * var(--u)); }
.tt-mese > b { display: block; text-align: center; font-size: calc(3.6 * var(--u)); margin-bottom: calc(2 * var(--u)); }
.tt-gg { display: grid; grid-template-columns: repeat(7, 1fr); gap: calc(1 * var(--u)); }
.tt-gg em { font-style: normal; text-align: center; font-size: calc(2.6 * var(--u)); color: var(--g5); }
.tt-gg span { position: relative; aspect-ratio: 1; border: 1px solid var(--riga); border-radius: calc(1.4 * var(--u)); font-size: calc(2.6 * var(--u)); color: var(--g4); padding: calc(.6 * var(--u)); }
.tt-gg span.vuoto { border: 0; }
.tt-gg span.pass { opacity: .4; }
.tt-gg span.sel { border-color: var(--blu); background: var(--blu-w); color: var(--blu); font-weight: 700; }
.tt-gg span i { position: absolute; right: calc(.6 * var(--u)); bottom: calc(.6 * var(--u)); font-style: normal; font-size: calc(2.2 * var(--u)); background: var(--rosso-f); color: #fff; border-radius: 99px; padding: 0 calc(1 * var(--u)); }
.tt-task { position: relative; width: 100%; display: flex !important; align-items: flex-start; gap: calc(2 * var(--u)); text-align: left; background: var(--card) !important; border: 1px solid var(--bordo) !important; border-radius: calc(3.4 * var(--u)) !important;
  padding: calc(3 * var(--u)) calc(3 * var(--u)) calc(3 * var(--u)) calc(4.6 * var(--u)) !important; margin-bottom: calc(2 * var(--u)); overflow: hidden; }
.tt-task::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: calc(1.2 * var(--u)); background: var(--pr); }
.tt-task .t { flex: 1; display: grid; gap: calc(.8 * var(--u)); }
.tt-task b { font-size: calc(3.8 * var(--u)); }
.tt-task small { font-size: calc(2.9 * var(--u)); color: var(--g4); font-family: var(--font-mono, monospace); }
.tt-task small.st { font-family: var(--font-body, sans-serif); color: var(--g5); }
.tt-task small.st.ok { color: var(--verde); }
.tt-task.fatta b { text-decoration: line-through; opacity: .6; }
.tt-task .pri, .tt-taskdett .pri { font-family: var(--font-mono, monospace); font-size: calc(2.4 * var(--u)); font-weight: 700; color: var(--pr); border: 1px solid var(--pr); border-radius: 99px; padding: calc(.4 * var(--u)) calc(1.6 * var(--u)); white-space: nowrap; }
.tt-taskdett { position: relative; display: grid; gap: calc(1.4 * var(--u)); padding-left: calc(5 * var(--u)) !important; overflow: hidden; }
.tt-taskdett::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: calc(1.2 * var(--u)); background: var(--pr); }
.tt-taskdett .pri { justify-self: start; }
.tt-desc { font-size: calc(3.6 * var(--u)); color: var(--g4); margin: calc(1 * var(--u)) 0 calc(3 * var(--u)); }
.tt-btn2 { width: 100%; background: var(--card) !important; border: 1px solid var(--bordo) !important; border-radius: calc(3.4 * var(--u)) !important; padding: calc(3 * var(--u)) !important; font-weight: 600; font-size: calc(3.6 * var(--u)); margin-bottom: calc(3 * var(--u)); }
.tt-fotobox { background: var(--card); border: 1px dashed var(--g6); border-radius: calc(4 * var(--u)); padding: calc(3.4 * var(--u)); margin-bottom: calc(2 * var(--u)); display: grid; gap: calc(2 * var(--u)); }
.tt-scatta { display: inline-flex !important; align-items: center; gap: calc(1.6 * var(--u)); color: var(--blu) !important; font-weight: 600; font-size: calc(3.6 * var(--u)); }
.tt-scatta svg { width: calc(5 * var(--u)); height: calc(5 * var(--u)); }
/* la «foto» di verifica: un'illustrazione (cassonetto della carta con i cartoni piegati), non una foto vera */
.tt-foto { height: calc(40 * var(--u)); border-radius: calc(3 * var(--u)); animation: tt-in .4s both;
  background: radial-gradient(circle at 78% 22%, #ffe8a3 0 6%, transparent 7%), linear-gradient(transparent 62%, #4b5563 62% 64%, transparent 64%),
    linear-gradient(90deg, transparent 18%, #1d4ed8 18% 62%, transparent 62%) 0 58% / 100% 36% no-repeat,
    linear-gradient(90deg, transparent 22%, #c08a4b 22% 40%, #d6a265 40% 58%, transparent 58%) 0 30% / 100% 22% no-repeat,
    linear-gradient(#93c5fd, #dbeafe 60%, #9ca3af 60%); }
.tt-err { display: flex; gap: calc(1.6 * var(--u)); align-items: center; background: #2E0907; border: 1px solid #5c1410; color: #F2695E; border-radius: calc(3 * var(--u)); padding: calc(2.6 * var(--u)) calc(3 * var(--u)); font-size: calc(3.3 * var(--u)); }
.tt-err svg { width: calc(4.4 * var(--u)); height: calc(4.4 * var(--u)); flex: 0 0 auto; }
.tt-err[hidden] { display: none; }
.tt-card.spento { opacity: .65; }
/* ---------- andamento */
.tt-live { display: flex; gap: calc(3 * var(--u)); align-items: center; }
.tt-live .q { flex: 0 0 auto; width: calc(12 * var(--u)); height: calc(12 * var(--u)); border-radius: calc(3 * var(--u)); display: grid; place-items: center; color: #fff; }
.tt-live .q svg { width: calc(6 * var(--u)); height: calc(6 * var(--u)); }
.tt-live > span:last-child { display: grid; gap: calc(.6 * var(--u)); }
.tt-live small { font-family: var(--font-mono, monospace); font-size: calc(2.6 * var(--u)); text-transform: uppercase; letter-spacing: .06em; color: var(--g5); }
.tt-live b { font-family: var(--font-display, sans-serif); font-size: calc(6.4 * var(--u)); letter-spacing: -.03em; }
.tt-live i { font-style: normal; color: var(--g4); font-size: calc(2.9 * var(--u)); }
/* ---------- inventario */
.tt-cerca { background: var(--card); border: 1px solid var(--bordo); border-radius: calc(3 * var(--u)); padding: calc(2.8 * var(--u)) calc(3.4 * var(--u)); color: var(--g5); font-size: calc(3.4 * var(--u)); margin-bottom: calc(3 * var(--u)); }
.tt-art { display: flex; align-items: center; justify-content: space-between; gap: calc(2 * var(--u)); background: var(--card); border: 1px solid var(--bordo); border-radius: calc(3.4 * var(--u)); padding: calc(2.6 * var(--u)) calc(3 * var(--u)); margin-bottom: calc(1.8 * var(--u)); font-size: calc(3.4 * var(--u)); }
.tt-art.contato { border-color: #07382A; }
.tt-art .cnt { display: inline-flex; align-items: center; gap: calc(1.6 * var(--u)); }
.tt-art .cnt button { width: calc(7.4 * var(--u)); height: calc(7.4 * var(--u)); border-radius: 50% !important; background: var(--fill) !important; display: grid !important; place-items: center; font-size: calc(4.6 * var(--u)); }
.tt-art .cnt em { font-style: normal; font-family: var(--font-mono, monospace); min-width: calc(6 * var(--u)); text-align: center; font-weight: 700; }
.tt-art .cnt small { font-family: var(--font-mono, monospace); color: var(--g5); font-size: calc(2.6 * var(--u)); width: calc(7 * var(--u)); }
.tt-invia { margin-left: auto; border-radius: calc(2.4 * var(--u)) !important; padding: calc(2 * var(--u)) calc(3.4 * var(--u)) !important; background: var(--fill) !important; color: var(--g5) !important; font-weight: 700; font-size: calc(3.2 * var(--u)); }
.tt-invia.on { background: var(--verde-f) !important; color: #fff !important; }
/* ---------- HACCP */
.tt-pill.okp { background: rgba(14, 124, 86, .2); color: var(--verde); }
.tt-pill.dafare { background: var(--blu-w); color: var(--blu); }
.tt-canale .tt-pill { flex: 0 0 auto; }
.tt-num-in { width: 100%; background: var(--card); border: 1px solid var(--bordo); border-radius: calc(3.4 * var(--u)); color: var(--ink); font: inherit; font-size: calc(7 * var(--u)); padding: calc(3 * var(--u)); margin-top: calc(1.6 * var(--u)); outline: 0; }
.tt-note { width: 100%; background: var(--card); border: 1px solid var(--bordo); border-radius: calc(3 * var(--u)); color: var(--ink); font: inherit; font-size: calc(3.4 * var(--u)); padding: calc(2.4 * var(--u)); margin: calc(1.6 * var(--u)) 0 calc(3 * var(--u)); resize: none; }
.tt-sino { display: grid; grid-template-columns: 1fr 1fr; gap: calc(2 * var(--u)); margin-top: calc(1.6 * var(--u)); }
.tt-sino button { background: var(--card) !important; border: 1px solid var(--bordo) !important; border-radius: calc(3 * var(--u)) !important; padding: calc(3 * var(--u)) !important; font-weight: 700; font-size: calc(3.6 * var(--u)); }
.tt-sino .si.on { background: var(--verde-f) !important; color: #fff !important; border-color: var(--verde-f) !important; }
.tt-sino .no.on { background: var(--rosso-f) !important; color: #fff !important; border-color: var(--rosso-f) !important; }
/* ---------- lotti */
.tt-lotto { background: var(--card); border: 1px solid var(--bordo); border-radius: calc(4 * var(--u)); margin-bottom: calc(2.4 * var(--u)); }
.tt-lotto summary { list-style: none; display: flex; gap: calc(2.6 * var(--u)); align-items: center; padding: calc(3 * var(--u)); cursor: pointer; }
.tt-lotto summary::-webkit-details-marker { display: none; }
.tt-lotto .ic { flex: 0 0 auto; width: calc(9 * var(--u)); height: calc(9 * var(--u)); border-radius: calc(2.4 * var(--u)); display: grid; place-items: center; font-size: calc(4.6 * var(--u)); }
.tt-lotto .t { display: grid; gap: calc(.5 * var(--u)); }
.tt-lotto b { font-size: calc(3.8 * var(--u)); }
.tt-lotto small { font-size: calc(2.9 * var(--u)); color: var(--g4); }
.tt-lotto small b { font-size: inherit; color: var(--ink); }
.tt-lotto em { font-style: normal; }
.tt-lotto em.rosso { color: var(--rosso); font-weight: 700; } .tt-lotto em.blu { color: var(--blu); }
.tt-lotto-d { display: grid; gap: calc(1.2 * var(--u)); padding: 0 calc(3 * var(--u)) calc(3 * var(--u)); font-size: calc(3.1 * var(--u)); color: var(--g4); }
.tt-lotto-d .tt-due { margin: calc(1.6 * var(--u)) 0 0; }
/* i paragrafi dentro l'app non prendono le misure dei paragrafi della pagina (es. .pp-spot p) */
.tz-scr.tt-app p { font-size: calc(3.4 * var(--u)); line-height: 1.4; max-width: none; margin: 0; color: inherit; }
.tz-scr.tt-app .tt-desc { font-size: calc(3.6 * var(--u)); color: var(--g4); margin: calc(1 * var(--u)) 0 calc(3 * var(--u)); }
.tz-scr.tt-app p.tt-sub { color: var(--g4); font-size: calc(3 * var(--u)); }
.tz-scr.tt-app.chiaro .tt-err { background: #FDECEA; border-color: #f5c2bd; color: #B3261E; }

/* timbratura ferma nei racconti scorrendo (presenzaDemo): fuori servizio, poi «in» quando si timbra */
.tt-demo .tt-corpo { overflow: hidden; padding-bottom: calc(6 * var(--u)); }
.tt-demo .tt-bt { height: calc(32 * var(--u)); border-radius: calc(4 * var(--u)); display: grid; place-content: center; justify-items: center; gap: calc(1.2 * var(--u)); color: #fff; font-weight: 700; font-size: calc(3.6 * var(--u)); letter-spacing: .04em; transition: background .4s, opacity .4s, transform .25s; }
.tt-demo .tt-bt svg { width: calc(7 * var(--u)); height: calc(7 * var(--u)); }
.tt-demo .tt-bt small { font-size: calc(2.5 * var(--u)); letter-spacing: .08em; text-transform: uppercase; opacity: .8; font-weight: 500; }
.tt-demo .entra { background: var(--verde-f); box-shadow: 0 0 0 2px #0E7C56; }
.tt-demo .esci { background: var(--card); border: 1px solid var(--fill); color: var(--g5); opacity: .4; }
.tt-demo.in .entra { background: var(--card); border: 1px solid var(--fill); color: var(--g5); opacity: .4; box-shadow: none; }
.tt-demo.in .esci { background: var(--rosso-f); border: 0; color: #fff; opacity: 1; }
.tt-demo .dopo, .tt-demo.in .prima { display: none; }
.tt-demo.in .dopo { display: block; }
.tt-demo.in .tt-stato.dopo, .tt-demo.in .tt-ok.dopo { display: flex; }
.tt-demo .tt-eu .esci, .tt-demo.in .tt-eu .entra { background: var(--card) !important; }
.tt-demo.in .tt-eu .esci { background: var(--rosso-f) !important; }