.ms {
  --bg: #F4F7F6; --surface: #FFFFFF; --surface-2: #EEF4F2; --fg: #14212A; --muted: #50606A;
  --line: #DCE5E2; --line-strong: #C3D0CC; --campo: #7B8C88;
  --accent: #0F766E; --accent-strong: #0B5E58; --accent-ink: #FFFFFF; --accent-soft: #E2F3F0; --accent-line: #9FD3CB; --focus: #0F766E;
  --ok: #17703A; --ok-soft: #E3F4E8; --warn: #8A5300; --warn-soft: #FFF1D2; --tip: #234E9A; --tip-soft: #E6EEFB;
  --c-test: #2E7D32; --c-test-bg: #E8F5E9; --c-test-ink: #1B5E20;
  --c-mappa: #7C3AED; --c-mappa-bg: #F3E8FF; --c-mappa-ink: #5B21B6;
  --c-riassunto: #5E35B1; --c-riassunto-bg: #EDE7F6; --c-riassunto-ink: #4527A0;
  --c-appunti: #0277BD; --c-appunti-bg: #E1F5FE; --c-appunti-ink: #01579B;
  --shadow: 0 1px 2px rgba(20, 40, 38, 0.05), 0 6px 18px rgba(20, 40, 38, 0.06);
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  background: var(--bg); color: var(--fg); font-family: var(--font); font-size: 16px; line-height: 1.5;
  padding-bottom: 56px; overflow-wrap: break-word;
}
.ms *, .ms *::before, .ms *::after { box-sizing: border-box; }
/* :where() lascia questi azzeramenti a specificità zero: ogni classe della sezione li può ridichiarare. */
.ms :where(h1, h2, h3, h4, p, ul, ol, dl, dd, dt, figure) { margin: 0; padding: 0; }
.ms :where(ul, ol) { list-style: none; }
.ms :where(h1, h2, h3, h4) { font-weight: 800; letter-spacing: -0.015em; color: var(--fg); }
.ms :where(a) { color: var(--accent-strong); }
/* i collegamenti dentro un testo si riconoscono anche senza il colore (WCAG 1.4.1): sottolineati */
.ms .ms-nota a, .ms .ms-link-utili a, .ms .ms-gratis a, .ms .ms-sotto a, .ms .ms-vuoto a { text-decoration: underline; text-underline-offset: 3px; }
.ms button, .ms input, .ms textarea, .ms summary { font: inherit; color: inherit; }
.ms button { cursor: pointer; }
.ms :focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.ms [hidden] { display: none !important; }
.ms .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ms .ms-svg { display: block; flex: 0 0 auto; }
.ms-gutter { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.ms-inner { max-width: 1180px; margin: 0 auto; }

/* Un colore per tipo, dichiarato una volta */
.ms .t-test { --tool: var(--c-test); --tool-bg: var(--c-test-bg); --tool-ink: var(--c-test-ink); }
.ms .t-mappa { --tool: var(--c-mappa); --tool-bg: var(--c-mappa-bg); --tool-ink: var(--c-mappa-ink); }
.ms .t-riassunto { --tool: var(--c-riassunto); --tool-bg: var(--c-riassunto-bg); --tool-ink: var(--c-riassunto-ink); }
.ms .t-appunti { --tool: var(--c-appunti); --tool-bg: var(--c-appunti-bg); --tool-ink: var(--c-appunti-ink); }
.ms .ms-ic { flex: 0 0 auto; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--tool, var(--accent)); color: #fff; }

/* Percorso */
.ms-bri { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; padding: 8px 0 4px; font-size: 13.5px; color: var(--muted); }
.ms-bri a { display: inline-flex; align-items: center; min-height: 36px; color: var(--muted); text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }
.ms-bri a:hover { color: var(--accent-strong); text-decoration-color: currentColor; }
.ms-bri-sep { color: var(--line-strong); }
.ms-bri [aria-current="page"] { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Titoli di sezione */
.ms-sez { margin-top: 30px; min-width: 0; }
.ms-sez > h2, .ms-h2 { font-size: 21px; line-height: 1.25; margin-bottom: 4px; }
.ms-sotto { color: var(--muted); font-size: 14.5px; line-height: 1.45; max-width: 62ch; margin-bottom: 12px; }
.ms-sez > h2 + .ms-grid, .ms-sez > h2 + .ms-lista { margin-top: 12px; }

/* ------------------------------------------------------------------------------------------
   La testata della pagina iniziale: un punto forte, la ricerca
   ------------------------------------------------------------------------------------------ */
.ms-hero { position: relative; margin-top: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); padding: 20px 18px 18px; }
.ms-hero-sfondo { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; pointer-events: none; }
.ms-hero-sfondo svg { position: absolute; right: -46px; top: -34px; width: 250px; height: auto; opacity: .55; }
.ms-hero-testo { position: relative; min-width: 0; }
.ms-sopra { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--accent-strong); }
.ms-sopra .ms-ic { width: 32px; height: 32px; border-radius: 10px; background: var(--accent); }
.ms-hero h1 { margin-top: 12px; font-size: 27px; line-height: 1.15; letter-spacing: -0.022em; max-width: 22ch; text-wrap: balance; }
.ms-promessa { margin-top: 8px; font-size: 16px; line-height: 1.5; color: var(--muted); max-width: 52ch; }
.ms-promessa b { color: var(--fg); font-variant-numeric: tabular-nums; }

.ms-ricerca { position: relative; margin-top: 16px; max-width: 640px; }
.ms-campo { display: flex; align-items: center; gap: 8px; min-height: 56px; padding: 4px 4px 4px 14px; background: var(--surface); border: 1.5px solid var(--campo); border-radius: 15px; }
.ms-campo:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(15, 118, 110, .2); }
.ms-campo > .ms-svg { color: var(--accent); }
.ms-campo input { flex: 1 1 auto; min-width: 0; min-height: 46px; border: 0; outline: 0; background: transparent; font-size: 17px; padding: 0 2px; -webkit-appearance: none; appearance: none; }
.ms-campo input::placeholder { color: var(--muted); opacity: 1; }
.ms-campo input::-webkit-search-cancel-button { -webkit-appearance: none; }
.ms-campo button { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; min-width: 46px; padding: 0 12px; border: 0; border-radius: 11px; background: var(--accent); color: var(--accent-ink); font-weight: 700; font-size: 15.5px; }
.ms-campo button span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ms-campo > .ms-svg { display: none; }
.ms-campo button:hover { background: var(--accent-strong); }
.ms-prova { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 12px; font-size: 14px; color: var(--muted); }
.ms-prova a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border-radius: 999px; background: var(--accent-soft); border: 1px solid var(--accent-line); color: var(--accent-strong); font-weight: 600; text-decoration: none; }
.ms-prova a:hover { background: #D3ECE8; }

.ms-sugg { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 40; max-height: min(62vh, 440px); overflow: auto; padding: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 16px 40px rgba(20, 40, 38, .2); }
.ms-sugg a { display: flex; align-items: center; gap: 11px; min-height: 52px; padding: 7px 9px; border-radius: 11px; color: var(--fg); text-decoration: none; }
.ms-sugg a .ms-ic { width: 34px; height: 34px; border-radius: 10px; }
.ms-sugg a:hover, .ms-sugg a[aria-selected="true"] { background: var(--accent-soft); }
.ms-sugg .t { display: block; font-weight: 700; font-size: 15px; line-height: 1.3; }
.ms-sugg .m { display: block; font-size: 12.5px; color: var(--muted); }
.ms-sugg .tutti { min-height: 46px; font-weight: 700; color: var(--accent-strong); justify-content: space-between; }
.ms-sugg .vuoto { padding: 12px; font-size: 14.5px; color: var(--muted); }

/* ------------------------------------------------------------------------------------------
   Pagina iniziale: i quattro tipi, le scuole, le materie
   ------------------------------------------------------------------------------------------ */
.ms-tipi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ms-tipo { display: grid; gap: 5px; align-content: start; min-height: 148px; padding: 12px; border-radius: 16px; background: var(--tool-bg); border: 1px solid transparent; color: var(--fg); text-decoration: none; }
.ms-tipo:hover { border-color: var(--tool); }
.ms-tipo b { font-size: 16px; line-height: 1.2; margin-top: 3px; }
.ms-tipo .n { font-size: 13px; font-weight: 800; color: var(--tool-ink); font-variant-numeric: tabular-nums; }
.ms-tipo .riga { font-size: 13px; line-height: 1.38; color: var(--muted); }
.ms-tipo .riga, .ms-tipo b, .ms-tipo .n { min-width: 0; }

.ms-grid { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); }
.ms-scuole { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
.ms-scuola { position: relative; display: grid; gap: 8px; align-content: start; padding: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; }
.ms-scuola:hover { border-color: var(--accent-line); box-shadow: var(--shadow); }
.ms-scuola-testa { display: flex; align-items: center; gap: 11px; }
.ms-scuola .ms-ic { background: var(--accent-soft); color: var(--accent-strong); }
.ms-scuola h3 { font-size: 19px; line-height: 1.15; }
.ms-scuola h3 a { color: var(--fg); text-decoration: none; }
.ms-scuola h3 a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.ms-scuola .n { font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
.ms-scuola .n b { color: var(--fg); }
.ms-esempi { font-size: 13.5px; line-height: 1.45; color: var(--muted); }
.ms-esempi i { font-style: normal; color: var(--fg); font-weight: 600; }
.ms-chip-classi { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 6px; }
.ms-chip-classi a { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 11px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--fg); font-size: 13.5px; font-weight: 600; text-decoration: none; }
.ms-chip-classi a:hover { border-color: var(--accent); color: var(--accent-strong); }
.ms-chip-classi span { font-size: 12px; font-weight: 700; color: var(--muted); font-variant-numeric: tabular-nums; }

.ms-materie { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ms-materia { display: grid; gap: 3px; align-content: start; min-width: 0; padding: 12px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; color: var(--fg); text-decoration: none; }
.ms-materia:hover { border-color: var(--accent-line); box-shadow: var(--shadow); }
.ms-materia .ms-ic { background: var(--accent-soft); color: var(--accent-strong); margin-bottom: 4px; }
.ms-materia b { font-size: 15.5px; line-height: 1.25; }
.ms-materia .n { font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
.ms-mix { display: flex; flex-wrap: wrap; gap: 3px 9px; margin-top: 2px; font-size: 12px; font-weight: 700; color: var(--muted); font-variant-numeric: tabular-nums; }
.ms-mix span { display: inline-flex; align-items: center; gap: 4px; }
.ms-mix i { width: 8px; height: 8px; border-radius: 50%; background: var(--tool); }
.ms-materia .es { margin-top: 5px; font-size: 12.5px; line-height: 1.4; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ms-minori { display: flex; flex-wrap: wrap; gap: 6px 8px; margin-top: 12px; font-size: 13.5px; color: var(--muted); align-items: center; }
.ms-minori a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--fg); font-weight: 600; text-decoration: none; }

/* ------------------------------------------------------------------------------------------
   Le carte dei materiali e gli elenchi
   ------------------------------------------------------------------------------------------ */
.ms-lista { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); align-items: start; }
.ms-lista-titolo { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin-top: 16px; padding-bottom: 4px; border-bottom: 2px solid var(--line); }
.ms-lista-titolo:first-child { margin-top: 0; }
.ms-lista-titolo h2 { font-size: 20px; line-height: 1.25; }
.ms-lista-titolo h2 a { color: var(--fg); text-decoration: none; }
.ms-lista-titolo h2 a:hover { color: var(--accent-strong); text-decoration: underline; text-underline-offset: 3px; }
.ms-lista-titolo .n { font-size: 13.5px; font-weight: 600; color: var(--muted); font-variant-numeric: tabular-nums; }
.ms-lista-titolo .tutti { margin-left: auto; font-size: 13.5px; font-weight: 700; }

.ms-carta { position: relative; display: flex; gap: 12px; align-items: flex-start; min-width: 0; padding: 12px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; }
.ms-carta:hover { border-color: var(--tool); box-shadow: var(--shadow); }
.ms-carta-corpo { flex: 1 1 auto; min-width: 0; display: grid; gap: 4px; }
.ms-carta .meta { display: flex; flex-wrap: wrap; align-items: center; gap: 1px 8px; font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--tool-ink); }
.ms-carta .meta span:not(:last-child)::after { content: '·'; margin-left: 8px; opacity: .7; }
.ms-carta .meta span:not(:first-child) { color: var(--muted); font-weight: 700; }
.ms-carta h3 { font-size: 16.5px; line-height: 1.3; font-weight: 700; letter-spacing: -0.005em; }
.ms-carta h3 a { color: var(--fg); text-decoration: none; }
.ms-carta h3 a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.ms-carta .anteprima { font-size: 14px; line-height: 1.45; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ms-carta .anteprima.domanda::before { content: '«'; }
.ms-carta .anteprima.domanda::after { content: '»'; }
.ms-carta:has(h3 a:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.ms-carta h3 a:focus-visible { outline: none; }
@supports not selector(:has(a)) { .ms-carta h3 a:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; } }
.ms-carta.compatta .anteprima { -webkit-line-clamp: 1; }
.ms-rami-mini { display: flex; flex-wrap: wrap; gap: 5px; max-height: 58px; overflow: hidden; }
.ms-rami-mini span { flex: 0 1 auto; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 2px 9px; border-radius: 999px; background: var(--tool-bg); color: var(--tool-ink); font-size: 12.5px; font-weight: 600; }
.ms-rami-mini .altri { flex: 0 0 auto; background: transparent; color: var(--muted); padding-left: 2px; padding-right: 2px; }
.ms-varianti { position: relative; z-index: 1; margin-top: 2px; }
.ms-varianti summary { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; font-size: 13.5px; font-weight: 700; color: var(--accent-strong); cursor: pointer; list-style: none; }
.ms-varianti summary::-webkit-details-marker { display: none; }
.ms-varianti summary .ms-svg { transition: transform .15s; }
.ms-varianti[open] summary .ms-svg { transform: rotate(180deg); }
.ms-varianti ul { border-top: 1px solid var(--line); }
.ms-varianti li a { display: block; padding: 9px 0; border-bottom: 1px solid var(--line); color: var(--fg); text-decoration: none; font-size: 14px; line-height: 1.4; }
.ms-varianti li a:hover { color: var(--accent-strong); }
.ms-varianti li small { display: block; color: var(--muted); font-size: 12.5px; }

/* Filtri */
.ms-filtri { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin: 14px 0 6px; }
.ms-filtro { min-width: 0; display: grid; gap: 4px; }
.ms-etichetta { font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.ms-scroller { display: flex; gap: 8px; min-width: 0; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.ms-pill { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 6px 13px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--fg); font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.ms-pill:hover { border-color: var(--accent); }
.ms-pill span { font-size: 12px; font-weight: 700; color: var(--muted); font-variant-numeric: tabular-nums; }
.ms-pill[aria-current="page"] { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.ms-pill[aria-current="page"] span { color: #fff; opacity: .88; }

/* Pagine */
.ms-pagine { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 22px 0 0; }
.ms-pagine a, .ms-pagine span { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--fg); font-weight: 700; font-size: 15px; text-decoration: none; font-variant-numeric: tabular-nums; }
.ms-pagine a:hover { border-color: var(--accent); }
.ms-pagine [aria-current="page"] { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.ms-pagine .punti { border-color: transparent; background: transparent; min-width: 24px; padding: 0 2px; }

/* La testata degli elenchi */
.ms-testa-elenco { margin-top: 6px; padding: 18px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow); }
.ms-testa-elenco h1 { font-size: 25px; line-height: 1.18; letter-spacing: -0.02em; text-wrap: balance; }
.ms-testa-elenco .intro { margin-top: 8px; color: var(--muted); font-size: 15.5px; line-height: 1.55; max-width: 70ch; }
.ms-testa-elenco .ms-ricerca { margin-top: 14px; }
.ms-link-utili { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 12px; font-size: 14px; font-weight: 600; }
.ms-vuoto { padding: 22px 16px; background: var(--surface); border: 1px dashed var(--line-strong); border-radius: 16px; color: var(--muted); }
.ms-vuoto b { color: var(--fg); }

/* La pagina di una materia: un riquadro per tipo */
.ms-riquadro { margin-top: 26px; }
.ms-riquadro-testa { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ms-riquadro-testa .ms-ic { width: 34px; height: 34px; }
.ms-riquadro-testa h2 { font-size: 20px; line-height: 1.2; }
.ms-riquadro-testa .n { color: var(--muted); font-weight: 600; font-size: 14px; font-variant-numeric: tabular-nums; }
.ms-vedi-tutti { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; min-height: 44px; padding: 0 16px; border-radius: 12px; border: 1.5px solid var(--tool); background: var(--surface); color: var(--tool-ink); font-weight: 700; font-size: 15px; text-decoration: none; }
.ms-vedi-tutti:hover { background: var(--tool-bg); }

/* ------------------------------------------------------------------------------------------
   Un materiale: testata, colonna principale e colonna a lato
   ------------------------------------------------------------------------------------------ */
.ms-vista { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin-top: 8px; align-items: start; }
.ms-principale { min-width: 0; display: grid; gap: 14px; }
.ms-testa { padding: 18px 16px; background: var(--surface); border: 1px solid var(--line); border-top: 5px solid var(--tool); border-radius: 18px; box-shadow: var(--shadow); }
.ms-etichetta-tipo { display: inline-flex; align-items: center; gap: 8px; padding: 3px 12px 3px 4px; border-radius: 999px; background: var(--tool-bg); color: var(--tool-ink); font-size: 12.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ms-etichetta-tipo .ms-ic { width: 26px; height: 26px; border-radius: 50%; }
.ms-testa h1 { margin-top: 10px; font-size: 26px; line-height: 1.17; letter-spacing: -0.022em; text-wrap: balance; }
.ms-meta { display: flex; flex-wrap: wrap; gap: 2px 14px; margin-top: 10px; font-size: 14px; color: var(--muted); }
.ms-meta li { display: inline-flex; align-items: center; gap: 5px; }
.ms-meta a { color: var(--accent-strong); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--accent-line); }
.ms-ai-nota { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line); font-size: 13.5px; line-height: 1.45; color: var(--muted); }
.ms-ai-nota .ms-svg { margin-top: 1px; color: var(--tip); }
.ms-salta { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; min-height: 40px; font-weight: 700; font-size: 14.5px; color: var(--tool-ink); }

.ms-lato { min-width: 0; display: grid; gap: 14px; align-content: start; }
.ms-scheda { padding: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; display: grid; gap: 10px; }
.ms-scheda h2 { font-size: 17px; line-height: 1.25; }
.ms-scheda p { font-size: 14.5px; line-height: 1.5; color: var(--muted); }
.ms-scheda.forte { background: var(--tool-bg); border-color: transparent; }
.ms-scheda.forte p { color: #3A4A52; }
.ms-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; padding: 0 20px; border: 0; border-radius: 13px; background: var(--accent); color: var(--accent-ink); font-weight: 700; font-size: 16px; line-height: 1.2; text-align: center; text-decoration: none; }
.ms-btn:hover { background: var(--accent-strong); color: var(--accent-ink); }
.ms-btn.sec { background: var(--surface); color: var(--accent-strong); border: 1.5px solid var(--accent-line); }
.ms-btn.sec:hover { background: var(--accent-soft); }
.ms-btn.tool { background: var(--tool); }
.ms-btn.tool:hover { filter: brightness(.9); }
.ms-btn:visited { color: var(--accent-ink); }
.ms-btn.sec:visited { color: var(--accent-strong); }
.ms-gratis { font-size: 13px; line-height: 1.4; color: var(--muted); }
.ms-condividi { display: flex; flex-wrap: wrap; gap: 8px; }
.ms-condividi a, .ms-condividi button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--fg); font-size: 14.5px; font-weight: 600; text-decoration: none; }
.ms-condividi a.wa { background: #E7F7EC; border-color: #A8DCB8; color: #14532D; }
.ms-condividi a:hover, .ms-condividi button:hover { border-color: var(--accent); }

/* Sotto il materiale: vicini, strade, fai il tuo, nota */
.ms-sotto-vista { margin-top: 30px; display: grid; gap: 28px; }
.ms-versioni { display: grid; gap: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 4px 14px; }
.ms-versioni li + li { border-top: 1px solid var(--line); }
.ms-versioni a { display: grid; gap: 1px; min-height: 52px; padding: 9px 0; color: var(--fg); text-decoration: none; }
.ms-versioni .t { font-weight: 700; font-size: 15.5px; line-height: 1.3; }
.ms-versioni .m { font-size: 13px; line-height: 1.4; color: var(--muted); }
.ms-versioni a:hover .t { color: var(--accent-strong); text-decoration: underline; text-underline-offset: 3px; }
.ms-strade { display: flex; flex-wrap: wrap; gap: 8px; }
.ms-strade a { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--fg); font-size: 14px; font-weight: 600; text-decoration: none; }
.ms-strade a:hover { border-color: var(--accent); color: var(--accent-strong); }
.ms-nota { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; padding: 14px 16px; background: var(--surface-2); border-radius: 14px; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.ms-nota p { flex: 1 1 280px; }
.ms-link { background: none; border: 0; padding: 0; min-height: 44px; display: inline-flex; align-items: center; gap: 6px; color: var(--accent-strong); font-weight: 700; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }

.ms-crea { display: grid; gap: 14px; padding: 18px 16px; background: var(--accent-soft); border: 1px solid var(--accent-line); border-radius: 20px; }
.ms-crea h2 { font-size: 21px; line-height: 1.22; }
.ms-crea p { font-size: 15.5px; line-height: 1.5; color: #2F4A49; max-width: 58ch; }
.ms-crea .azioni { display: grid; gap: 10px; align-content: start; }
.ms-strumenti { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ms-strumenti a { display: flex; align-items: center; gap: 9px; min-height: 48px; padding: 6px 10px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); color: var(--fg); font-size: 14px; font-weight: 700; line-height: 1.2; text-decoration: none; }
.ms-strumenti a:hover { border-color: var(--tool); }
.ms-strumenti .ms-ic { width: 28px; height: 28px; border-radius: 9px; }
.ms-account { padding: 16px; background: var(--fg); color: #F4F7F6; border-radius: 18px; display: grid; gap: 8px; }
.ms-account h2 { color: #fff; font-size: 19px; }
.ms-account p, .ms-account li { font-size: 14.5px; line-height: 1.45; color: #DCE5E2; }
.ms-account ul { display: grid; gap: 3px; margin: 2px 0 6px; }
.ms-account li { display: flex; gap: 8px; align-items: flex-start; }
.ms-account li .ms-svg { color: #7DD3C7; margin-top: 2px; }
.ms-account .ms-btn { background: #fff; color: var(--accent-strong); justify-self: start; }
.ms-account .ms-btn:hover { background: #E2F3F0; color: var(--accent-strong); }

/* Segnala */
dialog.ms-dialogo { width: min(30rem, calc(100% - 24px)); max-height: calc(100% - 24px); padding: 20px; border: 0; border-radius: 18px; background: #fff; color: #14212A; box-shadow: 0 24px 60px rgba(0, 0, 0, .3); font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; }
dialog.ms-dialogo::backdrop { background: rgba(20, 33, 42, .6); }
.ms-dialogo * { box-sizing: border-box; }
.ms-dialogo h2 { font-size: 19px; line-height: 1.25; font-weight: 800; margin: 0 0 6px; }
.ms-dialogo p { margin: 0; }
.ms-dialogo .nota { font-size: 14px; line-height: 1.45; color: #50606A; margin-bottom: 8px; }
.ms-dialogo label { display: flex; gap: 10px; align-items: flex-start; min-height: 44px; padding: 8px 0; font-size: 15px; line-height: 1.4; cursor: pointer; }
.ms-dialogo input[type="radio"] { width: 20px; height: 20px; margin-top: 1px; accent-color: #0F766E; flex: 0 0 auto; }
.ms-dialogo textarea, .ms-dialogo input[type="email"] { display: block; width: 100%; margin-top: 8px; padding: 10px 12px; border: 1.5px solid #7B8C88; border-radius: 11px; font: inherit; font-size: 16px; color: #14212A; background: #fff; }
.ms-dialogo .riga { display: flex; gap: 8px; justify-content: flex-end; margin-top: 14px; }
.ms-dialogo .riga button { min-height: 46px; padding: 0 18px; border-radius: 12px; font-weight: 700; font-size: 15px; border: 1.5px solid #C3D0CC; background: #fff; color: #14212A; }
.ms-dialogo .riga button[type="submit"] { background: #0F766E; border-color: #0F766E; color: #fff; }
.ms-dialogo .esito { margin-top: 10px; font-size: 14.5px; font-weight: 600; color: #17703A; }
.ms-dialogo .esito.errore { color: #9B1C1C; }

/* ------------------------------------------------------------------------------------------
   Il test, da fare nella pagina
   ------------------------------------------------------------------------------------------ */
.ms-test { display: grid; gap: 14px; min-width: 0; }
.ms-guida { padding: 12px 14px; border-radius: 14px; background: var(--c-test-bg); color: #24402A; font-size: 15px; line-height: 1.5; }
.ms-guida b { color: var(--c-test-ink); }
.ms-avanza { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 700; color: var(--muted); }
.ms-avanza .barra { flex: 1 1 auto; display: flex; gap: 5px; }
.ms-avanza .barra i { flex: 1 1 0; height: 8px; border-radius: 99px; background: var(--line); transition: background .2s; }
.ms-avanza .barra i.fatta { background: var(--c-test); }
.ms-avanza output { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--fg); }
.ms-domande { display: grid; gap: 14px; }
.ms-dom { display: grid; gap: 12px; padding: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; scroll-margin-top: 84px; }
.ms-dom.fatta { border-color: #A8D2AB; }
.ms-dom-testa { display: flex; gap: 12px; align-items: flex-start; }
.ms-num { flex: 0 0 auto; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; background: var(--c-test-bg); color: var(--c-test-ink); font-weight: 800; font-size: 16px; font-variant-numeric: tabular-nums; }
.ms-dom.fatta .ms-num { background: var(--c-test); color: #fff; }
.ms-dom-testo { font-size: 17.5px; line-height: 1.45; font-weight: 700; letter-spacing: -0.005em; }
.ms-dom-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 5px; font-size: 12.5px; font-weight: 700; color: var(--muted); }
.ms-dom-meta .diff { padding: 1px 9px; border-radius: 99px; background: var(--surface-2); letter-spacing: .02em; }
.ms-dom-meta .diff.facile { background: var(--ok-soft); color: #14532D; }
.ms-dom-meta .diff.medio { background: var(--warn-soft); color: #6B4200; }
.ms-dom-meta .diff.difficile { background: #FDE8E8; color: #8A1C1C; }
.ms-risposta { display: block; width: 100%; min-height: 104px; resize: vertical; padding: 12px; background: #fff; border: 1.5px solid var(--campo); border-radius: 13px; font-size: 16px; line-height: 1.5; }
.ms-risposta:focus { outline: 3px solid rgba(15, 118, 110, .28); outline-offset: 0; border-color: var(--accent); }

.ms-acc { border-radius: 13px; }
.ms-acc > summary { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 14px; border: 1px solid var(--line-strong); border-radius: 13px; background: var(--surface); font-weight: 700; font-size: 15px; cursor: pointer; list-style: none; }
.ms-acc > summary::-webkit-details-marker { display: none; }
.ms-acc > summary .ms-svg:first-child { color: var(--tip); }
.ms-acc > summary .chev { margin-left: auto; color: var(--muted); transition: transform .15s; }
.ms-acc[open] > summary .chev { transform: rotate(180deg); }
.ms-acc > summary:hover { border-color: var(--accent); }
.ms-acc.aiuto[open] > summary { background: var(--tip-soft); border-color: #A9BFE6; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.ms-acc.doveva > summary .ms-svg:first-child { color: var(--ok); }
.ms-acc.doveva[open] > summary { background: var(--ok-soft); border-color: #A8D2AB; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.ms-acc.doveva[data-bloccato] > summary { background: var(--surface-2); color: var(--muted); border-style: dashed; }
.ms-acc.doveva[data-bloccato] > summary .ms-svg:first-child { color: var(--muted); }
.ms-pannello { padding: 12px 14px 14px; border: 1px solid; border-top: 0; border-radius: 0 0 13px 13px; font-size: 15px; line-height: 1.55; }
.ms-acc.aiuto .ms-pannello { background: var(--tip-soft); border-color: #A9BFE6; color: #1E3B73; }
.ms-acc.doveva .ms-pannello { background: var(--ok-soft); border-color: #A8D2AB; color: #14391F; }
.ms-pannello p + p { margin-top: 6px; }
.ms-pannello b { font-weight: 800; }
.ms-sblocca { margin-top: -6px; font-size: 13px; color: var(--muted); }
.ms-sblocca.avviso { color: var(--warn); font-weight: 700; }
.ms-idee { display: grid; gap: 4px; margin-top: 6px; }
.ms-idee label { display: flex; align-items: flex-start; gap: 10px; min-height: 40px; padding: 5px 0; cursor: pointer; }
.ms-idee input { flex: 0 0 auto; width: 22px; height: 22px; margin-top: 1px; accent-color: var(--ok); }
.ms-idee-conta { margin-top: 8px; font-size: 13.5px; font-weight: 700; color: var(--ok); }

.ms-barra { position: sticky; bottom: 10px; z-index: 20; display: flex; align-items: center; gap: 12px; justify-content: space-between; padding: 10px 10px 10px 14px; background: rgba(255, 255, 255, .97); border: 1px solid var(--line-strong); border-radius: 16px; box-shadow: 0 10px 30px rgba(20, 40, 38, .18); }
.ms-barra .stato { min-width: 0; font-size: 14px; line-height: 1.3; font-weight: 700; }
.ms-barra .stato small { display: block; font-size: 12px; font-weight: 500; color: var(--muted); }
.ms-barra .ms-btn { flex: 0 0 auto; min-height: 46px; padding: 0 16px; font-size: 15px; }
.ms-esito .puntini { display: flex; gap: 5px; }
.ms-esito .puntini i { flex: 1 1 0; height: 8px; border-radius: 99px; background: var(--line); }
.ms-esito .puntini i.fatta { background: var(--c-test); }
.ms-esito .num { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--fg); }
.ms-esito .rifai { justify-self: start; }

/* ------------------------------------------------------------------------------------------
   La mappa
   ------------------------------------------------------------------------------------------ */
.ms-mappa-barra { display: flex; gap: 8px; }
.ms-mappa-barra button { display: inline-flex; align-items: center; gap: 7px; min-height: 42px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); font-size: 14px; font-weight: 700; color: var(--fg); }
.ms-mappa-barra button:hover { border-color: var(--c-mappa); color: var(--c-mappa-ink); }
.ms-albero { padding: 14px 12px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; }
.ms-centro { position: relative; display: grid; gap: 2px; padding: 14px 16px; border-radius: 16px; background: var(--c-mappa); color: #fff; }
.ms-centro small { font-size: 11.5px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; opacity: .9; }
.ms-centro b { font-size: 19px; line-height: 1.25; font-weight: 800; letter-spacing: -0.01em; }
.ms-rami { margin: 0 0 0 20px; padding: 18px 0 0 24px; }
.ms-ramo { position: relative; padding-bottom: 12px; --b: #0F766E; --b-bg: #E2F3F0; --b-ink: #0B5E58; --b-line: #9FD3CB; }
.ms-ramo.b2 { --b: #1D5FA8; --b-bg: #E6EEFB; --b-ink: #17488A; --b-line: #A9C4EC; }
.ms-ramo.b3 { --b: #A35F00; --b-bg: #FFF4D6; --b-ink: #7A4600; --b-line: #E9C57A; }
.ms-ramo.b4 { --b: #B4235A; --b-bg: #FDE8F0; --b-ink: #8C1747; --b-line: #F0A9C6; }
.ms-ramo.b5 { --b: #2E7D32; --b-bg: #E8F5E9; --b-ink: #1B5E20; --b-line: #A5D3A8; }
.ms-ramo.b6 { --b: #6D4AC9; --b-bg: #EFEAFB; --b-ink: #4B2FA0; --b-line: #C4B5F0; }
/* il tronco (grigio) e il ramo (colorato) che arriva al riquadro */
.ms-ramo::before { content: ''; position: absolute; left: -25px; top: -18px; bottom: 0; width: 2px; background: var(--line-strong); }
.ms-ramo:last-child::before { bottom: auto; height: calc(18px + 26px); }
.ms-ramo::after { content: ''; position: absolute; left: -24px; top: 25px; width: 24px; height: 2px; background: var(--b); }
.ms-tog { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.ms-nodo-wrap { border: 1.5px solid var(--b); background: var(--b-bg); border-radius: 14px; }
.ms-nodo { display: flex; align-items: center; gap: 10px; min-height: 50px; padding: 8px 12px; color: var(--b-ink); font-weight: 800; font-size: 16px; line-height: 1.3; cursor: pointer; }
.ms-nodo-t { flex: 1 1 auto; min-width: 0; }
.ms-nodo-n { flex: 0 0 auto; padding: 1px 9px; border-radius: 99px; background: var(--b); color: #fff; font-size: 12px; font-weight: 700; white-space: nowrap; }
.ms-nodo .chev { flex: 0 0 auto; transition: transform .15s; }
.ms-tog:checked ~ .ms-nodo-wrap .chev { transform: rotate(180deg); }
.ms-tog:focus-visible ~ .ms-nodo-wrap { outline: 3px solid var(--focus); outline-offset: 2px; }
.ms-def { display: none; padding: 0 12px 12px; font-size: 14.5px; line-height: 1.55; color: #26323A; }
.ms-tog:checked ~ .ms-nodo-wrap .ms-def { display: block; }
.ms-figli { display: none; position: relative; margin: 10px 0 0 10px; padding-left: 18px; gap: 8px; }
.ms-tog:checked ~ .ms-figli { display: grid; }
.ms-figli li { position: relative; display: grid; gap: 1px; padding: 8px 12px; background: var(--surface); border: 1px solid var(--b-line); border-left: 4px solid var(--b); border-radius: 11px; }
.ms-figli li::before { content: ''; position: absolute; left: -19px; top: 0; bottom: -9px; width: 2px; background: var(--b-line); }
.ms-figli li:first-child::before { top: -12px; }
.ms-figli li:last-child::before { bottom: auto; height: 22px; }
.ms-figli li:first-child:last-child::before { top: -12px; height: 34px; }
.ms-figli li::after { content: ''; position: absolute; left: -19px; top: 21px; width: 19px; height: 2px; background: var(--b-line); }
.ms-figli b { font-size: 15px; line-height: 1.3; }
.ms-figli span { font-size: 14.5px; line-height: 1.5; color: var(--muted); }
.ms-idee-chiave { display: grid; gap: 8px; padding: 14px; background: var(--c-mappa-bg); border-radius: 16px; }
.ms-idee-chiave h2 { font-size: 17px; color: var(--c-mappa-ink); }
.ms-punti { display: grid; gap: 7px; max-width: 40rem; }
.ms-punti li { position: relative; padding-left: 26px; font-size: 16px; line-height: 1.55; }
.ms-punti li::before { content: ''; position: absolute; left: 3px; top: .42em; width: 11px; height: 6px; border-left: 2.5px solid var(--tool, var(--accent)); border-bottom: 2.5px solid var(--tool, var(--accent)); transform: rotate(-45deg); }

/* ------------------------------------------------------------------------------------------
   Riassunto e appunti: da leggere bene
   ------------------------------------------------------------------------------------------ */
.ms-lettura { padding: 18px 16px 8px; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; }
.ms-lead { font-size: 18.5px; line-height: 1.6; font-weight: 500; color: #1C2B33; max-width: 40rem; }
.ms-sezione { margin-top: 26px; scroll-margin-top: 84px; }
.ms-sezione h2 { font-size: 22px; line-height: 1.25; margin-bottom: 8px; }
.ms-testo p { font-size: 17.5px; line-height: 1.72; max-width: 40rem; color: #1C2B33; }
.ms-testo p + p { margin-top: 1em; }
.ms-evidenza { display: flex; gap: 10px; align-items: flex-start; margin: 14px 0 0; padding: 12px 14px; max-width: 40rem; border-left: 4px solid var(--tool); border-radius: 0 12px 12px 0; background: var(--tool-bg); font-size: 16.5px; line-height: 1.55; font-weight: 600; color: var(--tool-ink); }
.ms-evidenza .ms-svg { margin-top: 3px; }
.ms-ricorda { margin-top: 26px; padding: 14px 16px; border-radius: 16px; background: var(--tool-bg); }
.ms-ricorda h2 { display: flex; align-items: center; gap: 9px; font-size: 19px; color: var(--tool-ink); margin-bottom: 10px; }
.ms-parole { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 22px; }
.ms-parole li { padding: 4px 12px; border-radius: 99px; background: var(--tool-bg); color: var(--tool-ink); font-size: 13.5px; font-weight: 700; }
.ms-parole-titolo { margin-top: 24px; font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.ms-glossario { display: grid; gap: 0; max-width: 40rem; }
.ms-glossario div { padding: 10px 0; border-top: 1px solid var(--line); }
.ms-glossario div:first-child { border-top: 0; padding-top: 0; }
.ms-glossario dt { font-size: 16px; font-weight: 800; color: var(--tool-ink); }
.ms-glossario dd { margin-top: 2px; font-size: 16px; line-height: 1.55; color: #1C2B33; }
.ms-sintesi { margin-top: 26px; padding: 14px 16px; border-radius: 16px; background: var(--surface-2); max-width: 40rem; }
.ms-sintesi h2 { font-size: 17px; margin-bottom: 6px; }
.ms-sintesi p { font-size: 16.5px; line-height: 1.6; }
.ms-toc { display: none; }
.ms-toc ol { display: grid; gap: 2px; counter-reset: toc; }
.ms-toc a { display: flex; gap: 9px; align-items: baseline; min-height: 34px; padding: 4px 0; color: var(--fg); font-size: 14.5px; line-height: 1.35; text-decoration: none; }
.ms-toc a::before { counter-increment: toc; content: counter(toc); flex: 0 0 auto; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 7px; background: var(--tool-bg); color: var(--tool-ink); font-size: 12px; font-weight: 800; }
.ms-toc a:hover { color: var(--tool-ink); text-decoration: underline; }

/* ------------------------------------------------------------------------------------------
   Schermi più larghi
   ------------------------------------------------------------------------------------------ */
@media (min-width: 480px) {
  .ms-campo { padding-left: 16px; }
  .ms-campo > .ms-svg { display: block; }
  .ms-campo button { padding: 0 20px; }
  .ms-campo button span { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; }
  .ms-campo button .ms-svg { display: none; }
}
@media (min-width: 720px) {
  .ms { padding-bottom: 72px; }
  .ms-hero { padding: 30px 30px 28px; }
  .ms-hero h1 { font-size: 38px; max-width: 20ch; }
  .ms-promessa { font-size: 17.5px; }
  .ms-hero-sfondo svg { right: -10px; top: -14px; width: 340px; opacity: 1; }
  .ms-tipi { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
  .ms-tipo { min-height: 164px; padding: 14px; }
  .ms-scuole { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .ms-materie { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .ms-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .ms-testa-elenco { padding: 26px 28px; }
  .ms-testa-elenco h1 { font-size: 32px; }
  .ms-crea { padding: 24px; }
  .ms-testa { padding: 24px 26px; }
  .ms-testa h1 { font-size: 34px; }
  .ms-lettura { padding: 26px 28px 14px; }
  .ms-strumenti { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
  .ms-crea .ms-strumenti { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  .ms-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}
@media (min-width: 960px) {
  .ms-filtri { gap: 12px; }
  .ms-scroller { flex-wrap: wrap; overflow: visible; }
  .ms-sez { margin-top: 44px; }
  .ms-sez > h2, .ms-h2 { font-size: 25px; }
  .ms-vista { grid-template-columns: minmax(0, 1fr) 330px; gap: 32px; margin-top: 14px; }
  .ms-principale { gap: 18px; }
  .ms-lato { position: sticky; top: 84px; }
  .ms-toc { display: grid; }
  .ms-barra { display: none; }
  .ms-crea { grid-template-columns: minmax(0, 1fr) minmax(0, 420px); align-items: center; gap: 28px; }
  .ms-sotto-vista { gap: 40px; margin-top: 44px; }
  .ms-materie { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ms-scuole { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ms-account { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 24px; }
  .ms-account .ms-btn { grid-column: 2; grid-row: 1 / span 3; }

  /* La mappa: ogni ramo ha i suoi sotto-rami accanto, a destra, collegati da linee */
  .ms-mappa-barra { display: none; }
  .ms-albero { padding: 22px 24px 14px; }
  .ms-centro { padding: 18px 22px; border-radius: 18px; }
  .ms-centro b { font-size: 22px; }
  .ms-ramo { display: grid; grid-template-columns: minmax(230px, 300px) minmax(0, 1fr); column-gap: 44px; align-items: start; padding-bottom: 16px; }
  .ms-nodo-wrap { position: relative; grid-column: 1; }
  .ms-nodo-wrap::after { content: ''; position: absolute; left: 100%; top: 23px; width: 44px; height: 2px; background: var(--b); }
  .ms-nodo { cursor: default; }
  .ms-nodo .chev, .ms-tog { display: none; }
  .ms-def { display: block; }
  .ms-figli { display: grid; grid-column: 2; grid-row: 1; margin: 0; padding-left: 20px; }
  .ms-figli li::before { left: -21px; }
  .ms-figli li::after { left: -21px; width: 21px; }
}
@media (min-width: 1100px) {
  .ms-lista.tre { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  .ms *, .ms *::before, .ms *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* Chi stampa vuole il materiale: via menu, piè di pagina, inviti e pulsanti. */
@media print {
  nav[role="navigation"], nav[role="navigation"] + .h-16, footer, .ms-bri, .ms-lato, .ms-barra, .ms-sotto-vista, .ms-mappa-barra, .ms-salta, .ms-ricerca, #auth-save-invite, #auth-muro-studente { display: none !important; }
  html, body, .ms { background: #fff !important; }
  .ms-vista { display: block; }
  .ms-testa, .ms-lettura, .ms-albero, .ms-dom { border: 0; box-shadow: none; }
  .ms-dom { break-inside: avoid; padding-bottom: 2.4cm; border-bottom: 1px solid #ccc; }
  .ms-def { display: block !important; }
  .ms-figli { display: grid !important; }
  .ms-acc { display: none; }
}

/* 28/10/2026 (revisione del blocco 4b): il messaggio «Scrivi prima la tua risposta» è una regione sempre
   presente per il lettore di schermo; vuota non occupa spazio. */
.ms-sblocca:empty { margin: 0; padding: 0; min-height: 0; }
/* Sul telefono il disegno della testata passava dietro il titolo. */
@media (max-width: 479px) { .ms-hero-sfondo { display: none; } }