/* ==========================================================================
   Calendario (e "Oggi" nella home)
   Il colore del tipo di evento arriva in --c.
   ========================================================================== */
.cal-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap; margin-bottom: 22px; animation: rise 0.4s var(--ease) both; }
.cal-head h1 { margin: 0; }
.cal-voice[hidden] { display: none; }
.cal .card { margin: 0; animation: rise 0.45s var(--ease) both; }

/* --- barra: periodo, Oggi, vista --- */
.cal-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin-bottom: 14px; animation: rise 0.42s var(--ease) both; animation-delay: 30ms; }
.cal-nav { display: flex; align-items: center; gap: 6px; min-width: 0; flex: 1 1 280px; }
.cal-nav .nb-icon-btn { width: 36px; height: 36px; }
.cal-ptitle { margin: 0 0 0 8px; font-size: 21px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.cal-bar-r { display: flex; align-items: center; gap: 10px; }
.cal-bar-r [data-today].is-now { color: var(--ink-3); }
.cal-seg button { padding: 6px 14px; }
@media (max-width: 600px) {
  .cal-head { margin-bottom: 16px; flex-wrap: nowrap; align-items: center; }
  .cal-head h1 { font-size: 34px; min-width: 0; }
  .cal-head .nb-actions { flex-wrap: nowrap; flex: none; }
  .cal-head .btn { width: 42px; height: 42px; padding: 0; }
  .cal-head .btn svg { width: 19px; height: 19px; }
}
@media (max-width: 560px) {
  .cal-toolbar { gap: 10px; }
  .cal-nav { width: 100%; }
  .cal-ptitle { font-size: 19px; flex: 1; }
  .cal-bar-r { width: 100%; justify-content: space-between; }
  .cal-seg { flex: 1; min-width: 0; max-width: 340px; margin-left: auto; }
  /* più specifico di «.seg button» in mobile.css (15 px di lato col dito): le quattro viste stanno
     nella riga invece di spingere «Verifiche» fuori dallo schermo */
  .cal-bar-r .cal-seg button { flex: 1 1 auto; min-width: 0; padding: 6px 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
/* telefoni stretti (iPhone SE): il titolo si restringe, i pulsanti restano interi */
@media (max-width: 380px) {
  .cal-head h1 { font-size: 28px; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cal-head .nb-actions { gap: 6px; }
  .cal-head .btn { width: 38px; height: 38px; }
  .cal-seg { max-width: none; min-width: 0; }
  .cal-seg button { padding: 6px 4px; font-size: 13px; min-width: 0; }
}

/* cambio di periodo: scivola */
.cal-stage { position: relative; min-width: 0; }
.cal-stage.slide-l > * { animation: calL 0.32s var(--ease); }
.cal-stage.slide-r > * { animation: calR 0.32s var(--ease); }
.cal-stage.fade > * { animation: fadeIn 0.25s var(--ease); }
@keyframes calL { from { opacity: 0; transform: translateX(24px); } }
@keyframes calR { from { opacity: 0; transform: translateX(-24px); } }

/* --- mese --- */
.cal-month { padding: 14px; }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.cal-dow { text-align: center; font-size: 12px; font-weight: 600; color: var(--ink-3); padding: 4px 0 6px; text-transform: uppercase; letter-spacing: 0.04em; }
.cal-cell {
  position: relative; display: flex; flex-direction: column; align-items: stretch; gap: 3px;
  min-height: 96px; padding: 6px; border: 1px solid transparent; border-radius: 10px;
  background: var(--fill); color: var(--ink); font: inherit; text-align: left; cursor: pointer; overflow: hidden;
  transition: background 0.15s, border-color 0.15s, transform 0.15s var(--ease);
}
.cal-cell:hover { background: var(--fill-2); border-color: var(--stroke-2); }
.cal-cell:active { transform: scale(0.96); }
.cal-cell.out { opacity: 0.4; }
.cal-cell.sun .cal-n { color: var(--ko); }
.cal-n { font-size: 13.5px; font-weight: 600; font-variant-numeric: tabular-nums; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; }
.cal-cell.today .cal-n { background: var(--solid); color: var(--on-solid); }
.cal-chips { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cal-chip { display: flex; align-items: center; gap: 4px; min-width: 0; font-size: 11.5px; line-height: 1.25; padding: 1px 5px; border-radius: 5px; background: var(--fill-2); background: color-mix(in srgb, var(--c) 18%, transparent); }
.cal-chip i { width: 6px; height: 6px; border-radius: 50%; background: var(--c); flex: none; }
.cal-chip em { font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-chip u { text-decoration: none; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.cal-chip.done em { text-decoration: line-through; color: var(--ink-3); }
.cal-more { font-size: 11px; color: var(--ink-3); padding-left: 4px; }
@media (max-width: 640px) {
  .cal-month { padding: 8px; }
  .cal-grid { gap: 3px; }
  .cal-cell { min-height: 54px; padding: 4px 2px; align-items: center; }
  .cal-chips { flex-direction: row; justify-content: center; flex-wrap: wrap; gap: 3px; }
  .cal-chip { padding: 0; background: none; }
  .cal-chip em { display: none; }
  .cal-more { font-size: 10px; padding: 0; line-height: 6px; }
}

/* --- griglia oraria (giorno e settimana) --- */
.cal .tg-scroll {
  padding: 0; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain;
  max-height: max(380px, calc(100dvh - 300px - var(--sat, 0px)));
  -webkit-overflow-scrolling: touch;
}
.tg { --gut: 50px; position: relative; }
.tg-row { display: grid; grid-template-columns: var(--gut) repeat(var(--n), minmax(0, 1fr)); }
.tg-top { position: sticky; top: 0; z-index: 4; background: var(--sheet); border-bottom: 1px solid var(--stroke); border-radius: var(--r) var(--r) 0 0; }
.tg-gut { font-size: 11px; color: var(--ink-3); text-align: right; padding-right: 8px; line-height: 1.15; display: flex; align-items: center; justify-content: flex-end; }
.tg-dh { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 0 6px; border: 0; background: none; color: var(--ink-2); font: inherit; cursor: pointer; border-radius: 10px; transition: background 0.15s; }
.tg-dh:hover { background: var(--fill); }
.tg-dh small { font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink-3); }
.tg-dh b { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; font-size: 16px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.tg-dh.sun b { color: var(--ko); }
.tg-dh.today b { background: var(--solid); color: var(--on-solid); }
.tg-head + .tg-all { border-top: 1px solid var(--stroke); }
.tg-allc { min-width: 0; display: flex; flex-direction: column; gap: 3px; padding: 6px 3px; min-height: 36px; cursor: pointer; border-left: 1px solid var(--stroke); }
.tg-chip { display: block; width: 100%; text-align: left; border: 0; border-radius: 6px; padding: 3px 7px; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--ink); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: color-mix(in srgb, var(--c) 22%, var(--sheet)); box-shadow: inset 3px 0 0 var(--c); }
.tg-chip.done { text-decoration: line-through; color: var(--ink-3); }
.tg-hint { font-size: 12.5px; color: var(--ink-3); padding: 2px 4px; min-width: 0; }
.tg-body { position: relative; }
.tg-body > .tg-gut { position: relative; display: block; padding: 0; }
.tg-body > .tg-gut span { position: absolute; right: 8px; transform: translateY(-50%); font-variant-numeric: tabular-nums; }
.tg-col {
  position: relative; min-width: 0; border-left: 1px solid var(--stroke); cursor: copy;
  background-image: linear-gradient(var(--stroke) 1px, transparent 1px);
  background-size: 100% var(--hh); background-position: 0 -1px;
}
.tg-col.today { background-color: rgba(var(--ink-rgb), 0.018); }
.tg-les {
  position: absolute; left: 2px; right: 2px; border-radius: 6px; pointer-events: none; overflow: hidden;
  background: var(--fill); background: color-mix(in srgb, var(--c) 7%, transparent);
  box-shadow: inset 2px 0 0 color-mix(in srgb, var(--c) 45%, transparent);
}
.tg-les span { display: block; padding: 3px 6px; font-size: 11.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tg-ev {
  position: absolute; z-index: 2; margin-left: 2px; box-sizing: border-box; min-width: 0;
  display: flex; flex-direction: column; align-items: flex-start; gap: 1px; overflow: hidden;
  padding: 4px 7px; border: 0; border-radius: 7px; text-align: left; cursor: pointer; font: inherit; color: var(--ink);
  background: var(--fill-3); background: color-mix(in srgb, var(--c) 26%, var(--sheet));
  box-shadow: inset 3px 0 0 var(--c), 0 0 0 1px var(--sheet);
  animation: pop 0.28s var(--ease) both; animation-delay: calc(var(--k, 0) * 25ms);
  transition: filter 0.15s, transform 0.15s var(--ease);
}
.tg-ev:hover { filter: brightness(1.08); }
.tg-ev:active { transform: scale(0.97); }
.tg-ev b { font-size: 12.5px; font-weight: 600; line-height: 1.25; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tg-ev small { font-size: 11.5px; color: var(--ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.tg-ev.tiny { flex-direction: row; align-items: center; gap: 6px; padding-top: 0; padding-bottom: 0; }
.tg-ev.done b { text-decoration: line-through; color: var(--ink-3); }
.tg-day .tg-ev b { font-size: 14px; }
.tg-day .tg-ev small { font-size: 12.5px; }
.tg-now { position: absolute; left: -1px; right: 0; height: 2px; background: var(--ko); z-index: 3; pointer-events: none; transition: top 0.6s var(--ease); }
.tg-now::before { content: ""; position: absolute; left: -5px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: var(--ko); }
@media (max-width: 640px) { .tg { --gut: 42px; } .tg-day .tg-ev b { font-size: 13.5px; } }

/* settimana su schermi stretti: elenco per giorno */
.wk { display: grid; border-top: 1px solid var(--stroke); }
.wk-day { display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--stroke); animation: rise 0.35s var(--ease) both; animation-delay: calc(var(--i) * 30ms); }
.wk-dh { align-self: start; display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 4px 0; border: 0; background: none; color: var(--ink); font: inherit; cursor: pointer; border-radius: 12px; }
.wk-dh:active { background: var(--fill-2); }
.wk-dh small { font-size: 11.5px; font-weight: 600; color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.04em; }
.wk-dh b { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }
.wk-dh.sun b { color: var(--ko); }
.wk-day.today .wk-dh b { background: var(--solid); color: var(--on-solid); }
.wk-main { min-width: 0; display: grid; gap: 6px; align-content: start; padding-top: 2px; }
.wk-add { justify-self: start; display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px; border: 1px dashed var(--stroke-2); border-radius: 999px; background: none; color: var(--ink-3); font: inherit; font-size: 13px; cursor: pointer; }
.wk-add svg { width: 14px; height: 14px; }
.wk-add:active { background: var(--fill-2); }

/* riga delle lezioni */
.cal-les-line { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 10px; font-size: 12.5px; color: var(--ink-3); min-width: 0; }
.cal-les-line > span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.cal-les-line i { width: 6px; height: 6px; border-radius: 2px; background: var(--c); opacity: 0.8; }
.cal-les-t { font-variant-numeric: tabular-nums; color: var(--ink-2); }

/* --- finestra di un giorno --- */
.nb-modal.cal-daypop { width: min(480px, 100%); }
.cal-dp-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.cal-dp-head h3 { margin: 0; }
.cal-dp-head small { display: block; font-size: 12.5px; color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600; margin-bottom: 2px; }
.cal-dp-les { margin: 0 0 12px; padding: 9px 11px; border-radius: 10px; background: var(--fill); }
.cal-dp .cal-list { max-height: 50vh; overflow-y: auto; }
.cal-dp .cal-empty { margin: 8px 0; }
.cal-dp .nb-modal-actions { margin-top: 14px; }

.cal-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 12px; font-size: 12.5px; color: var(--ink-3); }
.cal-legend .cal-legend-les i { border-radius: 2px; background: var(--ink-4); }
.cal-legend span { display: inline-flex; align-items: center; gap: 6px; }
.cal-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--c); }

/* --- giorno scelto e liste --- */
.cal-day-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.cal-day-head h2 { margin: 0; font-size: 19px; }
.cal-day-head small { font-size: 12.5px; color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600; }
.cal-sub { display: flex; align-items: baseline; justify-content: space-between; margin: 18px 0 8px; font-size: 13px; font-weight: 600; color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.04em; }
.cal-sub a, .ht-card h3 a { font-size: 13px; font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--ink-2); }
.cal-empty { margin: 4px 0; font-size: 14px; color: var(--ink-3); list-style: none; }
.cal-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-width: none; }
.cal-ev { margin: 0; display: flex; align-items: stretch; gap: 10px; padding: 0; border-radius: 12px; background: var(--fill); animation: rise 0.3s var(--ease) both; transition: background 0.15s, opacity 0.2s; }
.cal-ev:hover { background: var(--fill-2); }
.cal-bar { width: 4px; flex: none; border-radius: 4px; margin: 8px 0 8px 8px; background: var(--c); }
.cal-check { flex: none; align-self: center; margin-left: 10px; width: 24px; height: 24px; border-radius: 7px; border: 1.8px solid var(--c); background: transparent; color: transparent; display: grid; place-items: center; cursor: pointer; padding: 0; transition: background 0.15s, transform 0.15s var(--ease); }
.cal-check svg { width: 15px; height: 15px; }
.cal-check:active { transform: scale(0.85); }
.cal-ev.done .cal-check { background: var(--c); color: #fff; }
.cal-ev.done .cal-check svg { animation: pop 0.25s var(--ease); }
.cal-ev.done b { text-decoration: line-through; color: var(--ink-3); }
.cal-ev-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; padding: 9px 12px 9px 0; border: 0; background: none; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.cal-ev-main b { display: flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 600; line-height: 1.3; }
.cal-rep svg { width: 14px; height: 14px; color: var(--ink-3); }
.cal-ev-main small { font-size: 13px; color: var(--ink-3); }
.cal-ev-notes { font-size: 13.5px; color: var(--ink-2); white-space: pre-wrap; margin-top: 2px; }
.cal-up { margin-top: 36px; animation: rise 0.5s var(--ease) both; animation-delay: 120ms; }
.cal-up h2 { margin-bottom: 12px; }
.cal-up-list { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }

/* lezioni del giorno */
.cal-lessons { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; max-width: none; }
.cal-lessons li { margin: 0; display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 10px; background: var(--fill-2); background: color-mix(in srgb, var(--c) 11%, transparent); box-shadow: inset 3px 0 0 var(--c); transition: opacity 0.2s; }
.cal-lessons li.past { opacity: 0.45; }
.cal-lessons li.now { background: color-mix(in srgb, var(--c) 24%, transparent); }
.cal-l-t { font-size: 13px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.cal-l-n { font-size: 14.5px; font-weight: 600; color: var(--ink); display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.cal-l-n a { color: inherit; text-decoration: none; }
.cal-l-n small { font-size: 12.5px; font-weight: 400; color: var(--ink-3); }
.cal-lessons em { font-style: normal; font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--c); }

/* --- finestra dell'evento --- */
.cal-form { display: grid; gap: 12px; }
.cal-form h3 { margin: 0 0 2px; }
.cal-title { font-size: 17px; }
.cal-types { display: flex; flex-wrap: wrap; gap: 6px; }
.cal-type { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--stroke-2); background: transparent; color: var(--ink-2); font: inherit; font-size: 14px; cursor: pointer; transition: background 0.15s, color 0.15s, border-color 0.15s, transform 0.15s var(--ease); }
.cal-type i { width: 8px; height: 8px; border-radius: 50%; background: var(--c); }
.cal-type:active { transform: scale(0.95); }
.cal-type.active { color: var(--ink); border-color: var(--c); background: color-mix(in srgb, var(--c) 16%, transparent); }
.cal-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cal-field { display: grid; gap: 4px; font-size: 13px; color: var(--ink-3); }
.cal-field .nb-input, .cal-form select.nb-input { width: 100%; min-height: 44px; }
.cal-notes { resize: vertical; min-height: 70px; line-height: 1.45; }
.cal-repeat { font-size: 14.5px; }

/* --- "Oggi" nella home --- */
.home-today { padding-top: 36px; }
.home-today-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.home-today-head h2 { margin: 0; }
.home-today-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
@media (max-width: 760px) { .home-today-grid { grid-template-columns: 1fr; } }
.ht-card { margin: 0; animation: rise 0.42s var(--ease) both; }
.ht-card + .ht-card { animation-delay: 60ms; }
.ht-card h3 { display: flex; align-items: baseline; justify-content: space-between; margin: 0 0 10px; font-size: 13px; font-weight: 600; color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.04em; }
.ht-card .cal-sub { margin-top: 18px; }

/* ==========================================================================
   Orario: modifica
   ========================================================================== */
.or-head-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.or-head-row h1 { margin: 0; }
.or-editing .or-grid-wrap { display: block !important; overflow-x: auto; }
.or-editing .or-grid { min-width: 600px; }
.or-edit-cell { width: 100%; border: 0; font: inherit; text-align: left; cursor: pointer; color: var(--ink); transition: transform 0.15s var(--ease), background 0.15s; }
.or-edit-cell:active { transform: scale(0.96); }
.or-edit-cell.or-free { background: transparent; box-shadow: inset 0 0 0 1.5px var(--stroke-2); color: var(--ink-3); font-size: 20px; align-items: center; }
.or-edit-cell.or-free:hover { background: var(--fill); }
.or-editing .or-cell { animation: pop 0.25s var(--ease) both; }
.or-time-btn { display: block; width: 100%; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; border-radius: 6px; }
.or-time-btn:hover b { text-decoration: underline; text-underline-offset: 3px; }
.or-edit-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.or-swatch { display: block; width: 22px; height: 22px; margin: 6px; border-radius: 50%; background: var(--c); }
.or-swatch.big { width: 30px; height: 30px; margin: 0; border: 0; padding: 0; cursor: pointer; flex: none; }
.or-color-menu { min-width: 0; }
.or-color-menu .ui-menu-label { display: none; }
.or-subj-list { display: grid; gap: 6px; max-height: 60vh; overflow: auto; }
.or-subj-row { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 12px; background: var(--fill); }
.or-subj-n { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.or-subj-n b { font-weight: 600; }
.or-subj-n small { font-size: 12.5px; color: var(--ink-3); }

/* prossime lezioni della materia (finestra dell'evento) */
.cal-next { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: -2px; font-size: 13px; color: var(--ink-3); animation: rise 0.25s var(--ease) both; }
.cal-next[hidden] { display: none; }
.cal-next > span { width: 100%; }
.cal-next-chip { height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--stroke-2); background: var(--fill); color: var(--ink); font: inherit; font-size: 13.5px; cursor: pointer; transition: background 0.15s, transform 0.15s var(--ease); }
.cal-next-chip:active { transform: scale(0.95); }
.cal-next-chip.active { background: var(--solid); color: var(--on-solid); border-color: transparent; }
.cal-study { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.cal-bell.on { border-color: var(--ink-3); }
.cal-notify .callout { margin: 10px 0; font-size: 14px; }
.cal-notify .small-note { margin-top: 8px; }

/* Safari su iPhone/iPad: data e ora hanno una larghezza minima loro e uscivano
   dalla colonna sovrapponendosi; qui stanno nella griglia, tutti alti uguali */
.cal-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.cal-field { min-width: 0; }
.cal-field .nb-input, .cal-form select.nb-input {
  display: block; box-sizing: border-box; width: 100%; min-width: 0; max-width: 100%;
  height: 48px; min-height: 48px; margin: 0; padding: 0 12px; line-height: 46px;
  -webkit-appearance: none; appearance: none;
}
.cal-form select.nb-input {
  padding-right: 34px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%23888' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 12px;
}
/* data e ora: pulsanti che aprono i selettori (js/pickers.js) */
.cal-field .cal-pick { display: flex; align-items: center; gap: 9px; text-align: left; cursor: pointer; color: var(--ink); line-height: 1.2; transition: border-color 0.15s, background 0.15s; }
.cal-pick:hover { background: var(--fill-2); }
.cal-pick:focus-visible { border-color: var(--ink-3); }
.cal-pick svg { width: 17px; height: 17px; flex: none; color: var(--ink-3); }
.cal-pick b { font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.cal-pick.empty b { color: var(--ink-4); }

@media (prefers-reduced-motion: reduce) {
  .cal-stage > *, .tg-ev, .wk-day { animation: none !important; }
  .tg-now { transition: none; }
}

/* --- vista Verifiche: settimane con il carico, striscia dei mesi --- */
.cal-legend[hidden], .cal-up[hidden] { display: none; }
.ts { display: grid; gap: 14px; }
/* carico: un solo colore, dal chiaro allo scuro (h0 libero … h4 molto pesante) */
.ts { --h0: rgba(var(--ink-rgb), 0.07); --h1: color-mix(in srgb, #ff9f0a 58%, transparent); --h2: color-mix(in srgb, #ff6a2a 62%, transparent); --h3: color-mix(in srgb, #ff453a 82%, transparent); --h4: #d70015; }
.ts-hc.h0 { background: var(--h0); } .ts-hc.h1 { background: var(--h1); } .ts-hc.h2 { background: var(--h2); } .ts-hc.h3 { background: var(--h3); } .ts-hc.h4 { background: var(--h4); }
.ts-strip { padding: 12px 14px; display: grid; gap: 8px; }
.ts-month { display: grid; grid-template-columns: 54px minmax(0, 1fr); align-items: center; gap: 10px; }
.ts-mlab { display: flex; align-items: baseline; gap: 6px; }
.ts-mlab b { font-size: 14px; font-weight: 650; }
.ts-mlab small { font-size: 12px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.ts-cells { display: grid; grid-template-columns: repeat(31, minmax(0, 1fr)); gap: 3px; }
.ts-hc { display: block; height: 22px; min-width: 0; padding: 0; border: 0; border-radius: 5px; cursor: pointer; transition: transform 0.15s var(--ease); }
.ts-hc:hover { transform: scale(1.15); }
.ts-hc.sun { opacity: 0.55; }
.ts-hc.out { opacity: 0.35; }
.ts-hc.today { box-shadow: 0 0 0 2px var(--ink); }
.ts-scale { display: flex; align-items: center; justify-content: flex-end; gap: 4px; font-size: 11.5px; color: var(--ink-3); }
.ts-scale .ts-hc { width: 12px; height: 12px; border-radius: 3px; cursor: default; }
.ts-scale span { margin: 0 4px; }
.ts-sum { margin: 2px 2px 0; font-size: 14px; color: var(--ink-2); }
.ts-cv { display: inline-block; padding: 0 7px; border-radius: 999px; font-size: 11.5px; font-weight: 600; color: var(--ink-2); background: rgba(var(--ink-rgb), 0.08); }
.ts-week { animation: rise 0.35s var(--ease) both; animation-delay: calc(var(--w, 0) * 30ms); }
.ts-week.gone { opacity: 0.6; }
.ts-wh { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 2px 8px; }
.ts-wh > div { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; }
.ts-wh b { font-size: 16px; font-weight: 650; }
.ts-wh small { font-size: 13px; color: var(--ink-3); }
.ts-week.empty .ts-wh { margin-bottom: 0; padding: 8px 12px; border-radius: 12px; background: rgba(var(--ink-rgb), 0.035); }
.ts-week.empty .ts-wh b { font-size: 14px; font-weight: 550; color: var(--ink-2); }
.ts-load { display: inline-flex; align-items: center; gap: 8px; flex: none; }
.ts-load em { font-style: normal; font-size: 12.5px; color: var(--ink-3); white-space: nowrap; }
.ts-bars { display: inline-flex; gap: 2px; }
.ts-bars i { width: 6px; height: 14px; border-radius: 2px; background: var(--h0); }
.ts-load.h1 .ts-bars i.on { background: var(--h1); }
.ts-load.h2 .ts-bars i.on { background: var(--h2); }
.ts-load.h3 .ts-bars i.on { background: var(--h3); }
.ts-load.h4 .ts-bars i.on { background: var(--h4); }
.ts-load.h3 em, .ts-load.h4 em { color: var(--ko); font-weight: 600; }
.ts-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-width: none; }
.ts-row {
  margin: 0; display: flex; align-items: center; gap: 10px; padding: 6px 8px 6px 6px; border-radius: 14px;
  background: var(--card); box-shadow: inset 3px 0 0 var(--c), inset 0 0 0 0.5px var(--card-edge);
  transition: background 0.15s, opacity 0.2s;
}
.ts-row:hover { background: var(--fill-2); }
.ts-day { flex: none; width: 44px; display: grid; justify-items: center; padding: 4px 0; margin-left: 4px; border-radius: 10px; background: color-mix(in srgb, var(--c) 14%, transparent); }
.ts-day small { font-size: 11px; color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.04em; }
.ts-day b { font-family: var(--font-display); font-size: 19px; line-height: 1.1; }
.ts-main { flex: 1; min-width: 0; display: grid; gap: 3px; padding: 6px 0; border: 0; background: none; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.ts-main b { font-size: 15px; font-weight: 600; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ts-main small { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 13px; color: var(--ink-3); }
.ts-type { font-size: 11.5px; font-weight: 650; padding: 0 7px; border-radius: 999px; }
.ts-type.t-verifica { color: #ff6961; background: rgba(255, 69, 58, 0.14); }
.ts-type.t-interrogazione { color: #ffb340; background: rgba(255, 159, 10, 0.15); }
:root[data-theme="light"] .ts-type.t-verifica { color: #c9302c; }
:root[data-theme="light"] .ts-type.t-interrogazione { color: #b86200; }
.ts-until { flex: none; font-size: 12.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ts-until.soon, .ts-u2.soon { color: var(--ko); font-weight: 600; }
.ts-u2 { display: none; }
.ts-check { flex: none; width: 32px; height: 32px; padding: 0; border-radius: 50%; border: 1.6px solid rgba(var(--ink-rgb), 0.3); background: transparent; color: transparent; display: grid; place-items: center; cursor: pointer; transition: background 0.2s, border-color 0.2s, transform 0.3s var(--spring); }
.ts-check svg { width: 16px; height: 16px; }
.ts-check:hover { color: var(--ink-3); }
.ts-check:active { transform: scale(0.85); }
.ts-row.done { opacity: 0.55; }
.ts-row.done .ts-main b { text-decoration: line-through; text-decoration-color: var(--ink-4); }
.ts-row.done .ts-check { background: var(--solid); border-color: var(--solid); color: var(--on-solid); }
.ts-row.past:not(.done) .ts-until { color: var(--ink-4); }
@media (max-width: 560px) {
  .ts-strip { padding: 10px 12px; }
  .ts-month { grid-template-columns: 44px minmax(0, 1fr); gap: 8px; }
  .ts-cells { gap: 2px; }
  .ts-hc { height: 18px; border-radius: 4px; }
  .ts-until { display: none; }
  .ts-u2 { display: inline; }
  .ts-load em { font-size: 12px; }
}