/* Digesta — modern, legal-oriented dark theme.
   Ink-black background, brass/gold accent (the classic legal register),
   editorial serif for headings, clean sans for the working UI. System fonts
   only, so first paint is instant. */
:root{
  --bg:#0b0e12;            /* ink */
  --bg2:#0e1217;
  --panel:#12171e;        /* parchment-in-the-dark */
  --panel2:#171d26;
  --line:#222c38;
  --line2:#2c3947;
  --fg:#e9edf2;
  --muted:#8d9bab;
  --brass:#c8a04a;        /* legal gold */
  --brass-dim:#9a7a33;
  --accent:#6db3e6;
  --ok:#5cc08a; --err:#e0707c; --warn:#e0bd6a;
  --radius:12px;
  --shadow:0 8px 28px rgba(0,0,0,.45);
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;color:var(--fg);font:15px/1.6 var(--sans);
  background:
    radial-gradient(1100px 600px at 80% -10%,rgba(200,160,74,.07),transparent 60%),
    radial-gradient(900px 500px at -10% 110%,rgba(109,179,230,.06),transparent 55%),
    var(--bg);
  background-attachment:fixed;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--accent);text-decoration:none;transition:color .12s}
a:hover{color:#9bcdf2}
code{background:#070a0d;border:1px solid var(--line);padding:1px 6px;border-radius:5px;
  font:.86em ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:var(--brass)}
.container{max-width:1040px;margin:0 auto;padding:30px 22px 70px}
h1{font:600 1.9rem/1.2 var(--serif);letter-spacing:.2px;margin:.1em 0 .25em}
h2{font:600 1.15rem/1.3 var(--serif);margin:0 0 .7em;color:#f1ece1}
h3{font:600 1.05rem var(--serif);margin:0}
.muted{color:var(--muted)} .small{font-size:.85em}

/* ---- top bar ---- */
.topbar{
  display:flex;align-items:center;gap:22px;padding:13px 26px;
  background:linear-gradient(180deg,rgba(18,23,30,.96),rgba(13,17,22,.92));
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(8px);position:sticky;top:0;z-index:20}
.brand{font:600 1.22rem var(--serif);color:#f3ecdc;letter-spacing:.3px}
.brand:hover{color:#fff}
.topbar nav{display:flex;gap:4px;margin-left:10px}
.topbar nav a{color:var(--muted);padding:6px 12px;border-radius:8px;font-size:.92rem}
.topbar nav a:hover{color:var(--fg);background:rgba(255,255,255,.04)}
.topbar .logout{margin-left:auto;display:flex;align-items:center;gap:12px}
.who{color:var(--muted);font-size:.88em}
.who::before{content:"●";color:var(--ok);margin-right:6px;font-size:.7em;vertical-align:middle}

/* ---- buttons ---- */
button{
  background:linear-gradient(180deg,#1d2632,#161d26);
  color:var(--fg);border:1px solid var(--line2);padding:8px 15px;border-radius:9px;
  cursor:pointer;font:500 .92rem var(--sans);transition:.14s;white-space:nowrap}
button:hover{border-color:var(--brass-dim);background:linear-gradient(180deg,#232e3b,#1a222c)}
button:active{transform:translateY(1px)}
#btn-download,#nu-create,#tok-create,#f-apply,.login-card button,#meta-close~*{}
#btn-download,#nu-create,#tok-create,#f-apply{
  background:linear-gradient(180deg,var(--brass),var(--brass-dim));
  color:#1a1306;border-color:var(--brass);font-weight:600}
#btn-download:hover,#nu-create:hover,#tok-create:hover,#f-apply:hover{
  background:linear-gradient(180deg,#d8b15c,#a9852f);border-color:#d8b15c}
button.secondary{background:#151b23}
button.danger{background:linear-gradient(180deg,#3a2125,#2a1619);border-color:#5a2f34;color:#f0c2c6}
button.danger:hover{border-color:var(--err)}

input,select{
  background:#070a0d;border:1px solid var(--line);color:var(--fg);
  padding:8px 11px;border-radius:9px;font:.92rem var(--sans);transition:.14s}
input:focus,select:focus{outline:none;border-color:var(--brass-dim);
  box-shadow:0 0 0 3px rgba(200,160,74,.13)}
label{display:inline-flex;flex-direction:column;gap:5px;font-size:.82em;color:var(--muted)}
label.check{flex-direction:row;align-items:center;gap:8px;color:var(--fg);font-size:.9em}
.row{display:flex;gap:11px;align-items:center;margin:13px 0;flex-wrap:wrap}
.row.wrap{flex-wrap:wrap}

/* ---- panels & cards ---- */
.panel{
  background:linear-gradient(180deg,var(--panel),var(--bg2));
  border:1px solid var(--line);border-radius:var(--radius);
  padding:18px 20px;margin:18px 0;box-shadow:var(--shadow)}
.panel h2{padding-bottom:.5em;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:8px}
.panel h2::before{content:"";width:3px;height:1.05em;background:var(--brass);
  border-radius:2px;display:inline-block}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:18px}
.card{
  display:block;background:linear-gradient(180deg,var(--panel),var(--bg2));
  border:1px solid var(--line);border-radius:var(--radius);padding:20px;
  color:var(--fg);position:relative;overflow:hidden;transition:.16s;box-shadow:var(--shadow)}
.card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;
  background:linear-gradient(var(--brass),var(--brass-dim));opacity:.0;transition:.16s}
.card:hover{border-color:var(--line2);transform:translateY(-2px);text-decoration:none}
.card:hover::before{opacity:1}
.card h3{margin-bottom:8px;color:#f3ecdc}
.card p{color:var(--muted);font-size:.9em;margin:0 0 12px}
.badge{display:inline-block;background:rgba(200,160,74,.1);border:1px solid var(--brass-dim);
  padding:3px 10px;border-radius:20px;font-size:.76em;color:var(--brass)}
/* stato di salute di un provider nella tabella Providers */
.badge-ok{background:rgba(90,170,110,.12);border-color:rgba(90,170,110,.55);color:#7fc493}
.badge-warn{background:rgba(214,158,46,.12);border-color:rgba(214,158,46,.55);color:#e0b25a}
.badge-block{background:rgba(200,70,70,.14);border-color:rgba(200,70,70,.6);color:#e08585}

/* ---- facets ---- */
.shortcuts{margin:4px 0 0;align-items:center}
.shortcuts button{padding:5px 12px;font-size:.85rem}
.cfg-h{margin:16px 0 4px;font:600 .74rem var(--sans);color:var(--brass);
  text-transform:uppercase;letter-spacing:.08em;border-top:1px solid var(--line);padding-top:12px}
.cfg-h:first-of-type{border-top:0;padding-top:0}
.snippet{font-size:.88rem;color:#cdd6e0;margin:6px 0;line-height:1.55}
.dropzone{border:2px dashed var(--line2);border-radius:10px;padding:26px;text-align:center;
  margin:14px 0;background:#0b0f12;transition:.15s}
.dropzone.over{border-color:var(--brass);background:rgba(200,160,74,.06)}
.bar{height:5px;background:#0b0f12;border:1px solid var(--line);border-radius:6px;
  overflow:hidden;margin:6px 0 2px;max-width:420px}
.bar span{display:block;height:100%;background:linear-gradient(90deg,var(--brass-dim),var(--brass));transition:width .4s}
.bar span.indet{width:35% !important;animation:indet 1.2s linear infinite;background:linear-gradient(90deg,transparent,var(--brass),transparent)}
@keyframes indet{0%{margin-left:-35%}100%{margin-left:100%}}
.op-line{font-size:.85rem;color:#e7edf1;margin:4px 0 2px}
.err-line{color:#ff8a8a;font-size:.82em;margin-top:4px;white-space:normal;word-break:break-word}
.st-paused{color:var(--accent);border-color:rgba(109,179,230,.4)}
.node-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;background:var(--muted)}
.node-dot.on{background:var(--ok)} .node-dot.off{background:var(--err)}
.facets{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin:12px 0}
.facet h4{margin:0 0 7px;font:600 .72rem var(--sans);color:var(--brass);
  text-transform:uppercase;letter-spacing:.09em}
.facet .opts{max-height:170px;overflow:auto;border:1px solid var(--line);
  border-radius:9px;padding:8px 10px;background:#070a0d}
.facet .opts label{flex-direction:row;align-items:center;gap:7px;color:var(--fg);
  font-size:.88em;padding:3px 0}
.facet .opts::-webkit-scrollbar{width:8px}
.facet .opts::-webkit-scrollbar-thumb{background:var(--line2);border-radius:8px}

/* ---- tables & rows ---- */
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{text-align:left;padding:10px 11px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--brass);font:600 .72rem var(--sans);text-transform:uppercase;letter-spacing:.07em}
tr:hover td{background:rgba(255,255,255,.015)}
.doc-row{display:flex;gap:10px;align-items:center;justify-content:space-between;
  padding:11px 2px;border-bottom:1px solid var(--line)}
.doc-row:last-child{border-bottom:0}
.doc-row strong{font:600 .98rem var(--serif)}
.meta-line{font-size:.82em;color:var(--muted);margin-top:3px}
.actions{display:flex;gap:7px;flex-shrink:0}
.actions button{padding:6px 11px;font-size:.82rem}
.tag{font-size:.74em;padding:2px 9px;border-radius:20px;border:1px solid var(--line2)}
.st-done{color:var(--ok);border-color:rgba(92,192,138,.4)}
.st-error{color:var(--err);border-color:rgba(224,112,124,.4)}
.st-running{color:var(--warn);border-color:rgba(224,189,106,.4)}
.st-queued,.st-cancelled{color:var(--muted)}

/* ---- login ---- */
.login-card{
  max-width:380px;margin:10vh auto;background:linear-gradient(180deg,var(--panel),var(--bg2));
  border:1px solid var(--line);border-radius:16px;padding:34px 32px;box-shadow:var(--shadow);
  position:relative;overflow:hidden}
.login-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,transparent,var(--brass),transparent)}
.login-card h1{text-align:center;margin-bottom:2px}
.login-card>.muted{text-align:center}
.login-card form{display:flex;flex-direction:column;gap:15px;margin-top:20px}
.login-card label{color:var(--fg);font-size:.85em}
.login-card button{padding:11px;background:linear-gradient(180deg,var(--brass),var(--brass-dim));
  color:#1a1306;border-color:var(--brass);font-weight:600;font-size:.98rem}
.login-card button:hover{background:linear-gradient(180deg,#d8b15c,#a9852f)}

/* ---- misc ---- */
.alert{background:linear-gradient(180deg,#2e2024,#241619);border:1px solid #54343a;
  color:#f3c7cc;padding:10px 14px;border-radius:9px;margin:10px 0;word-break:break-all;
  box-shadow:var(--shadow)}
pre.meta{background:#070a0d;border:1px solid var(--line);border-radius:9px;
  padding:14px;max-height:60vh;overflow:auto;
  font:.82rem ui-monospace,Menlo,Consolas,monospace;color:#cdd6e0}
dialog{background:linear-gradient(180deg,var(--panel),var(--bg2));color:var(--fg);
  border:1px solid var(--line2);border-radius:14px;max-width:700px;width:90%;
  padding:22px;box-shadow:var(--shadow)}
dialog::backdrop{background:rgba(4,6,9,.7);backdrop-filter:blur(3px)}
::selection{background:rgba(200,160,74,.3)}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-thumb{background:var(--line2);border-radius:8px;border:2px solid var(--bg)}
::-webkit-scrollbar-track{background:transparent}

/* ---- dashboard ---- */
.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:4px}
.hero .sub{color:var(--muted);max-width:640px;margin:.2em 0 0}
.quick{display:flex;gap:9px;flex-wrap:wrap}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:13px;margin:18px 0 6px}
/* I sette riquadri raccontano due storie diverse: i primi tre come sta andando
   l'acquisizione, gli altri quattro com'e' messo il corpus. In fila unica si
   leggevano come un unico elenco e il confine non si vedeva. */
.stats-riga{margin:14px 0 4px}
.stats-riga .stats{margin:6px 0 0}
.stats-eti{color:var(--muted);font-size:.72rem;text-transform:uppercase;
  letter-spacing:.12em;padding-left:2px}
.stats-3{grid-template-columns:repeat(3,1fr)}
.stats-4{grid-template-columns:repeat(4,1fr)}
.stat{background:linear-gradient(180deg,var(--panel),var(--bg2));border:1px solid var(--line);
  border-radius:var(--radius);padding:15px 17px;position:relative;overflow:hidden}
.stat::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;
  background:linear-gradient(var(--brass),var(--brass-dim))}
.stat .n{font:600 1.7rem/1.1 var(--serif);color:#f3ecdc;letter-spacing:.3px}
.stat .l{color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;margin-top:3px}
.stat .x{color:var(--brass);font-size:.78rem;margin-top:2px}

/* source accordion (compact, expandable) */
.acc{border:1px solid var(--line);border-radius:10px;margin:9px 0;overflow:hidden;
  background:linear-gradient(180deg,var(--panel),var(--bg2))}
.acc-head{display:flex;align-items:center;gap:12px;padding:11px 15px;cursor:pointer;user-select:none}
.acc-head:hover{background:rgba(255,255,255,.025)}
.acc-head .chev{color:var(--brass);transition:transform .18s;font-size:.8rem;width:12px}
.acc.open .chev{transform:rotate(90deg)}
.acc-head .nm{font:600 1rem var(--serif);color:#f3ecdc;flex:0 0 auto}
.acc-head .mini{margin-left:auto;display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.mini .b{font-size:.74rem;color:var(--muted);white-space:nowrap}
.mini .b b{color:var(--fg);font-weight:600}
.mini .b.vec b{color:var(--brass)}
.acc-body{display:none;padding:4px 15px 15px;border-top:1px solid var(--line)}
.acc.open .acc-body{display:block}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:10px;margin:12px 0}
.statgrid .c .n{font:600 1.15rem var(--serif);color:#f1ece1}
.statgrid .c .l{color:var(--muted);font-size:.74rem}
.qa{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.qa button,.qa a.btn{padding:6px 12px;font-size:.84rem}
a.btn{display:inline-block;background:linear-gradient(180deg,#1d2632,#161d26);
  color:var(--fg);border:1px solid var(--line2);border-radius:9px;font:500 .92rem var(--sans)}
a.btn:hover{border-color:var(--brass-dim);text-decoration:none}
.grp-title{font:600 .82rem var(--sans);text-transform:uppercase;letter-spacing:.08em;
  color:var(--brass);margin:20px 0 2px}

/* --- Ricerca page: full-width + faceted layout ------------------------- */
.container.fullwidth{max-width:none;padding-left:26px;padding-right:26px}
.ricerca-head{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.ricerca-head input{padding:8px 11px}
.ricerca-head .grow{flex:1;min-width:300px;font-size:1.02rem}
.ricerca-head label{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:.85rem}
.ricerca-layout{display:flex;gap:20px;align-items:flex-start}
.facets-bar{flex:0 0 280px;position:sticky;top:12px;max-height:calc(100vh - 40px);
  overflow-y:auto;overflow-x:hidden;padding-right:6px}
.facets-bar .facet-group{margin-bottom:16px}
.facets-bar .facet-group h4{margin:.2em 0 .5em;color:var(--brass);font-size:.72rem;
  text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--line);padding-bottom:3px}
.ricerca-results{flex:1;min-width:0}
.toggle{display:inline-block;margin:3px 4px 0 0;padding:3px 10px;border-radius:20px;
  border:1px solid var(--line2);background:#151b23;color:var(--fg);cursor:pointer;
  font-size:.78rem;line-height:1.5;transition:all .12s}
.toggle:hover{border-color:var(--brass-dim)}
.toggle.active{background:linear-gradient(180deg,#e0bd6a,#c8a04a);border-color:var(--brass);color:#171d26;font-weight:600}
@media(max-width:820px){.ricerca-layout{flex-direction:column}.facets-bar{position:static;flex-basis:auto;max-height:none;width:100%}}

/* --- result rows: wide clickable left, compact actions right ----------- */
.result-row{display:flex;flex-direction:column;gap:6px;align-items:stretch}
.result-main{min-width:0}
.result-title{display:block;font-weight:600;color:var(--fg);cursor:pointer;text-decoration:none;line-height:1.4}
.result-title:hover{color:var(--brass);text-decoration:underline}
.result-snippet{color:var(--muted);font-size:.88em;margin:.3em 0;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.result-actions{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px;margin-top:2px}
.result-actions button{padding:3px 11px;font-size:.74rem}
.facet-more{margin-top:4px}
.facet-more>summary{cursor:pointer;color:var(--accent);font-size:.76rem;margin:4px 0}

/* dashboard: foldable group (TAR) */
.grp-fold>summary{cursor:pointer;list-style:none}
.grp-fold>summary::-webkit-details-marker{display:none}
.grp-fold>summary::before{content:"▶ ";color:var(--brass);font-size:.8em}
.grp-fold[open]>summary::before{content:"▼ "}

/* login-needed banner (session-scoped providers) */
.login-banner{background:linear-gradient(180deg,#3a2f14,#241d0e);border-bottom:1px solid var(--brass-dim);
  color:var(--warn);padding:8px 20px;font-size:.9rem;text-align:center}
.login-banner a{color:var(--brass);font-weight:700;text-decoration:underline}

/* global SPID/CIE login dialog */
.login-dialog{max-width:min(920px,94vw);border:1px solid var(--line2);border-radius:12px;
  background:var(--panel);color:var(--fg);padding:18px}
.login-dialog::backdrop{background:rgba(0,0,0,.55)}
.link-btn{background:none;border:none;color:var(--brass);font-weight:700;text-decoration:underline;
  cursor:pointer;padding:0;font:inherit}
.link-btn:disabled{color:var(--muted);text-decoration:none;cursor:default}

/* spinner (QR generation, etc.) */
.spinner{width:46px;height:46px;border:4px solid #d8d8d8;border-top-color:var(--brass,#b8860b);
  border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* --- Distributed-download volunteers page --- */
.stat .k{display:block;color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em}
.stat b{font:600 1.6rem/1.1 var(--serif);color:var(--fg)}
code.token{font-size:.82rem;background:#070a0d}
.new-token{margin-top:10px;padding:10px;border:1px dashed var(--brass-dim);border-radius:8px}
.new-token .token{font-size:.92rem;color:var(--brass)}
button.linkish{background:none;border:0;color:var(--accent);cursor:pointer;font-size:.78rem;padding:0 0 0 8px;text-decoration:underline}
.vstatus{font-weight:600;font-size:.85rem}
.vstatus.v-ok{color:var(--ok)}
.vstatus.v-warn{color:var(--warn)}
.vstatus.v-err{color:var(--err)}
.vstatus.v-muted{color:var(--muted)}
a.button{display:inline-block;text-decoration:none;background:linear-gradient(180deg,#1d2632,#161d26);
  color:var(--fg);border:1px solid var(--line2);padding:8px 15px;border-radius:9px;
  font:500 .92rem var(--sans);transition:.14s}
a.button:hover{border-color:var(--brass-dim);background:linear-gradient(180deg,#232e3b,#1a222c)}
select.cat-select{max-width:16em;font-size:.85rem}
a.button.small,button.small{padding:4px 10px;font-size:.8rem}

/* Volontari — compact volunteer rows (merge token/version/pausa etc.) */
.vname{font-weight:600;color:var(--fg)}
.vmeta{color:var(--muted);font-size:.76rem;margin-top:3px;display:flex;flex-wrap:wrap;
  gap:2px 9px;align-items:center}
.vmeta code.token{font-size:.76rem;padding:0 5px}
.vmeta .sep{opacity:.5}
.ndone{font:600 1.05rem var(--serif);color:#f1ece1}
#vol-table td{vertical-align:top}
#vol-table .cat-select{max-width:15em}
#vol-table .actions{flex-direction:column;align-items:stretch;gap:5px}
#vol-table .actions .button,#vol-table .actions button{text-align:center}

/* Volontari — download-stats chart (no library; brass/accent theme) */
.chart .cap{color:var(--muted);font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;margin:2px 0 9px}
.vbars{display:flex;flex-direction:column;gap:7px}
.vbar{display:grid;grid-template-columns:minmax(72px,150px) 1fr auto;gap:10px;align-items:center}
.vbar .nm{color:var(--fg);font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vbar .tk{height:13px;background:#0b0f12;border:1px solid var(--line);border-radius:7px;overflow:hidden}
.vbar .tk>i{display:block;height:100%;min-width:2px;border-radius:7px 0 0 7px;
  background:linear-gradient(90deg,var(--brass-dim),var(--brass));transition:width .4s}
.vbar .vn{font:600 .9rem var(--sans);color:#f3ecdc;min-width:3.2em;text-align:right}
.vbar .vn small{color:var(--accent);font-weight:600;margin-left:5px;font-size:.8em}
.daybars{display:flex;align-items:flex-end;gap:4px;height:96px;margin-top:2px}
.daybars .d{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.daybars .d>i{display:block;width:100%;max-width:24px;min-height:2px;border-radius:3px 3px 0 0;
  background:linear-gradient(180deg,var(--accent),#3d7fb0);transition:height .4s}
.daybars .d>span{color:var(--muted);font-size:.64rem;margin-top:5px}
.daybars .d.today>i{background:linear-gradient(180deg,var(--brass),var(--brass-dim))}

/* ============================================================= *
 *  Mobile / responsive
 *  Goal: no page-level horizontal scroll on phones. Wide tables
 *  scroll inside their own container; the top bar folds its nav
 *  into a scrollable strip; inputs never overflow the viewport.
 * ============================================================= */

/* Any table that can get wide is wrapped in .tbl-wrap so it scrolls
   inside itself instead of pushing the whole page sideways. */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.tbl-wrap>table{min-width:max-content}
img,svg,canvas{max-width:100%;height:auto}

@media(max-width:820px){
  .container{padding:22px 16px 60px}
  .container.fullwidth{padding-left:16px;padding-right:16px}
}

@media(max-width:720px){
  h1{font-size:1.55rem}
  h2{font-size:1.05rem}
  body{font-size:14.5px}

  /* Top bar: brand + logout stay on the first line, nav becomes a
     full-width horizontally-scrollable strip below them. */
  .topbar{gap:8px 12px;padding:10px 14px;flex-wrap:wrap}
  .topbar nav{order:3;width:100%;margin-left:0;gap:2px;overflow-x:auto;
    flex-wrap:nowrap;-webkit-overflow-scrolling:touch;padding-bottom:2px}
  .topbar nav::-webkit-scrollbar{height:0}
  .topbar nav a{white-space:nowrap;padding:6px 10px}
  .topbar .logout{margin-left:auto;gap:8px}
  .brand{font-size:1.1rem}

  /* Forms/inputs must never be wider than the screen. Several inputs carry
     inline min-width (e.g. 280–320px) for desktop — override it here so they
     can shrink instead of forcing a horizontal scroll. */
  input,select,textarea{max-width:100%}
  .row input,.row select,.ricerca-head input{min-width:0 !important}
  .row>label{min-width:0}
  label input,label select{max-width:100%}
  .ricerca-head .grow{min-width:0}
  .ricerca-head input,.ricerca-head [id^="f-"]{width:100%}

  .panel{padding:15px 14px;margin:14px 0}
  .cards{grid-template-columns:1fr}

  /* Chart: labels can shrink, keep bars readable */
  .vbar{grid-template-columns:minmax(60px,90px) 1fr auto;gap:8px}
  .daybars{height:80px}
}

@media(max-width:480px){
  .container{padding:18px 12px 54px}
  .container.fullwidth{padding-left:12px;padding-right:12px}
  h1{font-size:1.4rem}
  .stats,.stats-3,.stats-4{grid-template-columns:1fr 1fr}
  .disp-status,#disp-status{gap:12px !important}
  /* Buttons in a row get comfortable tap targets and wrap freely */
  .row button,.row a.button,.row .button{flex:1 1 auto}
  .daybars .d>span{font-size:.58rem}
}

/* ---- postazione di etichettatura del gold-set --------------------------- */
/* Il tema e' scuro: qui si usano le variabili, non colori fissi. La prima
   versione aveva fondi chiari col testo chiaro del tema e non si leggeva. */
.gold-wrap{display:grid;grid-template-columns:1fr 460px;gap:1rem;align-items:start;
  position:relative}
/* Testo chiuso: i campi prendono tutta la larghezza e si dispongono su piu'
   colonne — centocinquanta caselle su una sola colonna sono tanto scorrere. */
.gold-wrap.testo-chiuso{grid-template-columns:1fr}
.gold-wrap.testo-chiuso .gold-testo{display:none}
.gold-wrap.testo-chiuso .gold-campi{max-height:none;padding-right:0}
.gold-wrap.testo-chiuso .gold-campi .campo{break-inside:avoid}
@media (min-width:1100px){
  .gold-wrap.testo-chiuso .gold-campi{columns:2;column-gap:1.6rem}
}
@media (min-width:1700px){
  .gold-wrap.testo-chiuso .gold-campi{columns:3}
}
/* Il pulsante sta in chiaro sopra il pannello, non appeso a un angolo: se non
   si vede, la funzione non esiste. */
.barra-strumenti{margin:.2rem 0 .6rem}
.piega{font-size:.85rem;font-weight:600;padding:.35rem .9rem;
  border:1px solid var(--brass);border-radius:var(--radius);
  background:transparent;color:var(--brass);cursor:pointer}
.piega:hover{background:var(--brass);color:#12171e}
.piega.chiuso{border-style:dashed}
.piega-icona{font-size:.7rem;vertical-align:.05em}
.gold-testo{max-height:78vh;overflow:auto;font-size:.88rem;line-height:1.62;
  padding:1rem 1.2rem;color:var(--fg);background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius)}
.gold-testo p{margin:0 0 .7rem;text-align:justify;hyphens:auto}
.gold-testo .md-h{font:600 .95rem/1.3 var(--serif);color:var(--brass);
  margin:1.1rem 0 .5rem;text-transform:none;letter-spacing:.01em}
.gold-testo li{margin:.15rem 0 .15rem 1.1rem}
.gold-testo .md-tab{border-collapse:collapse;margin:.5rem 0 .8rem;font-size:.84rem}
.gold-testo .md-tab td{padding:.12rem .9rem .12rem 0;color:var(--fg);border:0}
.gold-testo strong{color:#f3ecdc}
.gold-testo::selection,.gold-testo *::selection{background:var(--brass);color:#12171e}
.gold-campi{max-height:78vh;overflow:auto;padding:.2rem .5rem .2rem 0}
.gold-campi .campo{padding:.5rem .55rem;border-bottom:1px solid var(--line);
  background:var(--panel);border-left:2px solid transparent}
.gold-campi .campo:hover{background:var(--panel2)}
.gold-campi .campo.da-ridefinire{border-left-color:var(--warn);background:#1c1a12}
.gold-campi label{display:block;font-size:.8rem;font-weight:600;color:var(--fg);
  margin-bottom:.25rem}
.gold-campi .tier{font-weight:400;color:var(--muted);font-size:.72rem;margin-left:.35rem}
/* Il numero della domanda nel foglio dei giuristi. Sta a sinistra del nome e
   in colonna, cosi' l'occhio scorre l'elenco senza inciampare nei nomi lunghi. */
.gold-campi .n-domanda{display:inline-block;min-width:2.2em;margin-right:.4rem;
  color:var(--muted);font-variant-numeric:tabular-nums;font-size:.78rem;text-align:right}
.gold-campi input[type=text],.gold-campi select{width:100%;padding:.3rem .4rem;
  font-size:.82rem;color:var(--fg);background:var(--bg2);
  border:1px solid var(--line2);border-radius:6px}
.gold-campi input[type=text]:focus,.gold-campi select:focus{outline:none;
  border-color:var(--brass);box-shadow:0 0 0 2px rgba(200,160,74,.18)}
.gold-campi input::placeholder{color:var(--muted);opacity:.7}
.span-riga{display:flex;gap:.45rem;align-items:center;margin-top:.3rem}
.span-riga button{font-size:.72rem;padding:.18rem .45rem;color:var(--fg);
  background:var(--panel2);border:1px solid var(--line2);border-radius:5px;cursor:pointer}
.span-riga button:hover{border-color:var(--brass)}
.span-testo{font-size:.72rem;color:var(--brass);font-style:italic;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.proposte{margin-top:.3rem;display:flex;gap:.3rem;flex-wrap:wrap}
.proposta{font-size:.72rem;color:var(--fg);background:var(--bg2);
  border:1px solid var(--line2);border-radius:4px;padding:.08rem .35rem}
.chip.warn{background:rgba(224,189,106,.14);border-color:var(--warn);color:var(--warn)}
.chip.vit{background:rgba(92,192,138,.14);border-color:var(--ok);color:var(--ok)}
.chip.due{background:rgba(109,179,230,.14);border-color:var(--accent);color:var(--accent);
  font-weight:400}
.gruppo{font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:var(--brass);
  margin:1rem 0 .3rem;border-bottom:1px solid var(--line);padding-bottom:.2rem}
.nota{border-left:2.5px solid var(--brass);background:var(--panel);color:var(--fg);
  padding:.6rem .9rem;margin:.8rem 0;font-size:.88rem;border-radius:0 6px 6px 0}
/* modalita' voto */
.campo.unanime{border-left-color:var(--ok)}
.opzioni{display:flex;flex-direction:column;gap:.18rem;margin-top:.25rem}
.opz{display:flex;align-items:center;gap:.45rem;font-size:.8rem;padding:.15rem .3rem;
  border-radius:5px;cursor:pointer;color:var(--fg)}
.opz:hover{background:var(--panel2)}
.opz .val{font-weight:600}
.opz .chi{color:var(--muted);font-size:.72rem}
.opz .libero{flex:1;font-size:.78rem;padding:.15rem .3rem;color:var(--fg);
  background:var(--bg2);border:1px solid var(--line2);border-radius:5px}
#defs textarea{width:100%;margin-top:.3rem;padding:.45rem .55rem;font:inherit;font-size:.84rem;
  line-height:1.5;color:var(--fg);background:var(--bg2);border:1px solid var(--line2);
  border-radius:6px;resize:vertical}
#defs textarea:focus{outline:none;border-color:var(--brass);
  box-shadow:0 0 0 2px rgba(200,160,74,.18)}
.apri-def{font-size:.72rem;padding:.18rem .45rem;color:var(--muted);
  background:transparent;border:1px solid var(--line2);border-radius:5px;cursor:pointer}
.apri-def:hover{color:var(--brass);border-color:var(--brass)}
.def-box{margin-top:.4rem;padding:.5rem;background:var(--bg2);border:1px solid var(--line2);
  border-left:2px solid var(--brass);border-radius:0 6px 6px 0}
.def-box textarea{width:100%;font:inherit;font-size:.8rem;line-height:1.45;color:var(--fg);
  background:var(--panel);border:1px solid var(--line2);border-radius:5px;
  padding:.4rem .5rem;resize:vertical}
.def-box textarea:focus{outline:none;border-color:var(--brass)}
.salva-def{font-size:.72rem;padding:.18rem .45rem;color:var(--fg);background:var(--panel2);
  border:1px solid var(--line2);border-radius:5px;cursor:pointer}
.salva-def:hover{border-color:var(--brass)}
.apri-def.salvata{color:var(--brass);border-color:var(--brass-dim)}
.def-esempio{font-size:.74rem;color:var(--muted);margin-bottom:.3rem}
.def-esempio code{color:var(--brass);background:transparent;padding:0}

/* «non applicabile»: il campo resta visibile ma spento. Nasconderlo avrebbe
   tolto a chi etichetta la possibilita' di accorgersi che la maschera sbaglia,
   e la maschera e' una regola per famiglia, non una verita' sul documento. */
.gold-campi .campo.non-app{opacity:.55;border-left-color:#6b6b6b}
.gold-campi .campo.non-app input,
.gold-campi .campo.non-app select{background:#1a1a1a;color:#777;font-style:italic}
.gold-campi .campo.non-app .usa-sel{display:none}
.gold-campi .segna-na{font-size:.75rem;padding:.1rem .4rem;opacity:.8}
.gold-campi .campo.non-app .segna-na{opacity:1;background:#3a3320;border-color:#b58900}


/* Il «?» accanto a ogni campo del gold-set: che cos'e' e come si scrive. */
.aiuto-campo {
  margin-left: .4rem; width: 1.35rem; height: 1.35rem; padding: 0;
  border-radius: 50%; border: 1px solid var(--bordo, #bbb);
  background: transparent; color: inherit; cursor: pointer;
  font-size: .8rem; line-height: 1; opacity: .65;
}
.aiuto-campo:hover, .aiuto-campo.aperto { opacity: 1; background: rgba(127,127,127,.15); }
.aiuto-box {
  margin: .35rem 0 .5rem; padding: .6rem .75rem; border-radius: 6px;
  background: rgba(127,127,127,.09); border-left: 3px solid rgba(127,127,127,.45);
  font-size: .88rem; line-height: 1.45;
}
.aiuto-box p { margin: .3rem 0; }
.aiuto-box code { padding: .05rem .3rem; border-radius: 3px; background: rgba(127,127,127,.18); }
.aiuto-att { opacity: .85; }
.aiuto-vuoto { opacity: .75; font-size: .84rem; }
.def-sola-lettura { font-size: .85rem; opacity: .8; }

.pdf-originale { margin: .3rem 0 .5rem; }
.pdf-originale a { font-weight: 600; }

/* Il passo si puo' selezionare nel testo o scrivere a mano: col pannello del
   testo chiuso la selezione non c'e', ma lo span resta obbligatorio. */
.span-scritto{flex:1 1 14rem;min-width:8rem;font-size:.8rem;padding:.15rem .4rem;
  border:1px solid var(--line);border-radius:var(--radius);
  background:transparent;color:inherit}
.span-scritto:placeholder-shown{opacity:.75}

/* Il pulsante di salvataggio non puo' stare in fondo a centocinquanta campi:
   resta appiccicato al bordo inferiore del modulo, sempre raggiungibile. */
.barra-salva{position:sticky;bottom:0;z-index:3;display:flex;align-items:center;
  gap:.9rem;flex-wrap:wrap;margin-top:1rem;padding:.7rem .9rem;
  background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);box-shadow:0 -6px 14px rgba(0,0,0,.28)}
.btn.grande{font-size:1rem;font-weight:700;padding:.6rem 1.4rem;
  background:var(--brass);color:#12171e;border:0;border-radius:var(--radius);
  cursor:pointer;letter-spacing:.01em}
.btn.grande:hover{filter:brightness(1.12)}
.btn.grande:active{transform:translateY(1px)}
#conta{opacity:.85}

/* Da dove viene un valore proposto da un modello: il passo del provvedimento,
   il modello che l'ha detto e con quanta confidenza. Confermare un numero
   senza vedere la riga da cui viene non e' una verifica. */
.da-dove{margin-left:.4rem;font-size:.72rem;padding:.05rem .4rem;
  border:1px solid var(--line);border-radius:var(--radius);
  background:transparent;color:inherit;cursor:pointer;opacity:.7}
.da-dove:hover{opacity:1;background:rgba(127,127,127,.16)}
.provenienza{margin:.15rem 0 .5rem 1.7rem;font-size:.78rem;line-height:1.45}
.prov-riga{display:flex;gap:.5rem;align-items:baseline;flex-wrap:wrap;
  padding:.12rem 0;border-left:2px solid rgba(127,127,127,.3);padding-left:.55rem}
.prov-modello{font-weight:600;opacity:.9;min-width:9rem}
.prov-conf{opacity:.7;font-variant-numeric:tabular-nums}
.prov-passo{opacity:.85;cursor:pointer;text-decoration:underline dotted}
.prov-passo:hover{opacity:1;color:var(--brass)}
mark.passo-trovato{background:var(--brass);color:#12171e;border-radius:2px;
  padding:0 .1em}

/* Avviso di versione: la scheda e' rimasta aperta attraverso un rilascio. */
#avviso-versione{position:fixed;left:0;right:0;bottom:0;z-index:99;
  padding:.7rem 1rem;text-align:center;font-size:.9rem;
  background:#b58900;color:#12171e;box-shadow:0 -4px 14px rgba(0,0,0,.35)}
#avviso-versione button{margin-left:.8rem;padding:.25rem .8rem;font-weight:700;
  border:0;border-radius:4px;background:#12171e;color:#f3ecdc;cursor:pointer}

/* Un valore senza passo viene azzerato al salvataggio: si vede mentre si
   lavora, non in un riquadro alla fine quando l'ora e' gia' andata. */
.campo.senza-passo .span-scritto{border-color:#c0392b;background:rgba(192,57,43,.09)}
.campo.senza-passo .span-scritto::placeholder{color:#e08a7f;opacity:1}
.perdita{color:#e0705f}

/* L'esempio nel «?»: le due caselle affiancate, perche' quella che si sbaglia
   e' la seconda. */
.esempio-doppio{margin:.4rem 0;padding:.45rem .6rem;border-radius:5px;
  background:rgba(181,137,0,.10);border-left:3px solid var(--brass)}
.esempio-doppio > div{display:flex;gap:.5rem;align-items:baseline;
  padding:.12rem 0;flex-wrap:wrap}
.esempio-doppio .et{min-width:12.5rem;opacity:.75;font-size:.78rem}
.esempio-doppio code{background:rgba(127,127,127,.2);padding:.05rem .35rem;
  border-radius:3px;white-space:pre-wrap}
/* Campo a elenco: la casella e' alta, e il testo va a capo come si scrive. */
textarea.lista{width:100%;font:inherit;font-size:.86rem;line-height:1.4;
  padding:.35rem .5rem;border:1px solid var(--line);border-radius:var(--radius);
  background:transparent;color:inherit;resize:vertical}
textarea.span-scritto.lista{margin-top:.3rem}
.campo.senza-passo textarea.span-scritto{border-color:#c0392b;
  background:rgba(192,57,43,.09)}