@font-face{font-family:"Barlow";font-weight:400;font-display:swap;src:url(/fonts/barlow-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:500;font-display:swap;src:url(/fonts/barlow-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:600;font-display:swap;src:url(/fonts/barlow-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:600;font-display:swap;src:url(/fonts/barlow-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(/fonts/barlow-condensed-latin-700-normal.woff2) format("woff2")}

:root{
  --bg:#eceef1; --surface:#ffffff; --surface-2:#f4f5f7; --line:#d2d7dd;
  --fg:#18212b; --muted:#5a6572; --ink:#18212b; --ink-fg:#ffffff;
  --atp:#855600; --atp-bg:#fcefc6;
  --par:#17663a; --par-bg:#daf2e1;
  --fut:#1c5aa3; --fut-bg:#dce8f8;
  --frg:#74378a; --frg-bg:#eedff3;
  --rit:#0f6e6e; --rit-bg:#d6efee;
  --warn:#ae241c; --warn-bg:#fbe2df;
  --ok:#17663a; --ok-bg:#daf2e1;
  --display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --body:"Barlow","Segoe UI",system-ui,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#12171d; --surface:#1b222b; --surface-2:#232c37; --line:#35414e;
    --fg:#e8edf2; --muted:#9ba8b6; --ink:#e8edf2; --ink-fg:#12171d;
    --atp:#f2c661; --atp-bg:#3a2f12;
    --par:#7fd79b; --par-bg:#163322;
    --fut:#8fbcf2; --fut-bg:#172c47;
    --frg:#d6a5e8; --frg-bg:#35203e;
    --rit:#7fd6d3; --rit-bg:#123536;
    --warn:#ff9a92; --warn-bg:#45201d;
    --ok:#7fd79b; --ok-bg:#163322;
    color-scheme:dark;
  }
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0}
body{background:var(--bg);color:var(--fg);font-family:var(--body);font-size:15px;line-height:1.45;-webkit-text-size-adjust:100%}
h1,h2,h3,h4,p,ol,ul,dl,dd{margin:0}
h1{font-family:var(--display);font-weight:700;font-size:2rem;line-height:1}
h2{font-family:var(--display);font-weight:700;font-size:1.45rem;line-height:1.1}
h3{font-family:var(--display);font-weight:600;font-size:1.2rem;line-height:1.15}
a{color:inherit}
.muted{color:var(--muted)}
.code{font-family:var(--display);font-weight:700;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.eyebrow{font-size:.76rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:600}
.t-ATP{--c:var(--atp);--cb:var(--atp-bg)} .t-PAR{--c:var(--par);--cb:var(--par-bg)}
.t-FUT{--c:var(--fut);--cb:var(--fut-bg)} .t-FRG{--c:var(--frg);--cb:var(--frg-bg)}
.t-RIT{--c:var(--rit);--cb:var(--rit-bg)}

button,select,input{font:inherit;color:inherit}
button{cursor:pointer;border:1px solid var(--line);background:var(--surface);border-radius:4px;padding:6px 12px;font-weight:500}
button:hover{border-color:var(--muted)}
button:disabled{opacity:.5;cursor:default}
button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--fut);outline-offset:2px}
button.ink{background:var(--ink);color:var(--ink-fg);border-color:var(--ink)}
button.danger{color:var(--warn)}
button.armed{background:var(--warn);color:var(--surface);border-color:var(--warn)}
button.link{border:0;background:none;color:var(--muted);text-decoration:underline;padding:6px}
select,input[type=text],input[type=number],input[type=password],input[type=search]{border:1px solid var(--line);background:var(--surface);border-radius:4px;padding:6px 8px;min-width:0}

.chip{font-family:var(--display);font-weight:700;background:var(--cb,var(--surface-2));color:var(--c,var(--muted));border-radius:3px;padding:1px 7px;white-space:nowrap}
.chip.none{border:1px dashed var(--muted);font-family:var(--body);font-weight:500;font-size:.8rem;padding:2px 7px}
.empty{color:var(--muted);font-size:.9rem}
.err{color:var(--warn)}
.box-warn{background:var(--warn-bg);color:var(--warn);border-radius:4px;padding:8px 10px;font-size:.9rem}

/* PIN */
dialog.pin{width:100%;height:100%;max-width:none;max-height:none;margin:0;border:0;color:var(--fg)}
dialog.pin::backdrop{background:var(--bg)}
.pin{position:fixed;inset:0;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:16px;z-index:50}
.pin form{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:20px;display:flex;flex-direction:column;gap:10px;width:min(100%,320px)}
.pin input{font-size:1.4rem;text-align:center;letter-spacing:.3em}

/* toast */
.toast{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--ink-fg);padding:10px 16px;border-radius:6px;z-index:60;max-width:calc(100% - 32px);font-weight:500}
.toast.bad{background:var(--warn);color:var(--surface)}


/* ---------- IWS Ritiri ---------- */
:root{--brand-red:#c12737;--brand-green:#19764e;--todo:#855600;--todo-bg:#fcefc6;--done:#17663a;--done-bg:#daf2e1;--canc:#ae241c;--canc-bg:#fbe2df}
@media (prefers-color-scheme: dark){:root{--todo:#f2c661;--todo-bg:#3a2f12;--done:#7fd79b;--done-bg:#163322;--canc:#ff9a92;--canc-bg:#45201d}}
.st-todo{--c:var(--todo);--cb:var(--todo-bg)} .st-done{--c:var(--done);--cb:var(--done-bg)} .st-cancelled{--c:var(--canc);--cb:var(--canc-bg)}
.st-cancelled .cl{text-decoration:line-through}

/* finestre di dialogo */
dialog.dlg{border:1px solid var(--line);border-radius:8px;padding:0;background:var(--surface);color:var(--fg);width:min(560px,calc(100% - 24px));max-height:calc(100dvh - 24px);box-shadow:0 12px 40px #0004}
dialog.dlg::backdrop{background:#0006}
dialog.dlg form,dialog.dlg .in{display:flex;flex-direction:column;gap:12px;padding:18px}
dialog.dlg .acts{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:4px}
dialog.dlg .acts .sp{flex:1}
dialog.dlg h2{margin-bottom:2px}
.fld{display:flex;flex-direction:column;gap:3px;font-size:.9rem;color:var(--muted);font-weight:500}
.fld input,.fld select,.fld textarea{color:var(--fg);font-size:1rem;padding:8px 10px;border:1px solid var(--line);border-radius:4px;background:var(--surface);font-family:inherit}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:520px){.row2{grid-template-columns:1fr}}
textarea{resize:vertical}

/* suggerimenti rubrica */
.ac{position:relative}
.ac ul{position:absolute;left:0;right:0;top:100%;z-index:20;list-style:none;margin:2px 0 0;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:0 8px 24px #0003;max-height:280px;overflow:auto}
.ac li{padding:7px 9px;border-radius:4px;cursor:pointer;color:var(--fg);display:flex;flex-direction:column}
.ac li small{color:var(--muted)}
.ac li[aria-selected=true],.ac li:hover{background:var(--surface-2)}

/* tabelle */
table.t{width:100%;border-collapse:collapse;background:var(--surface);font-size:.92rem}
table.t th{text-align:left;font-size:.74rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600;padding:8px 10px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--surface);z-index:1}
table.t td{padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:top}
table.t tr:last-child td{border-bottom:0}
table.t .num{text-align:right;font-variant-numeric:tabular-nums}
.tablewrap{border:1px solid var(--line);border-radius:6px;overflow:auto;background:var(--surface)}
.nowrap{white-space:nowrap}

/* campanella */
.bell{position:relative;border:0;background:none;font-size:1.25rem;padding:6px 10px;color:inherit}
.bell .badge{position:absolute;top:0;right:0;min-width:18px;height:18px;border-radius:9px;background:var(--warn);color:#fff;font-size:.72rem;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 4px}
.npanel{position:fixed;z-index:40;right:12px;top:58px;width:min(380px,calc(100% - 24px));max-height:70vh;overflow:auto;background:var(--surface);color:var(--fg);border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 40px #0004}
.npanel h3{padding:12px 14px 6px}
.npanel ul{list-style:none;margin:0;padding:0 6px 8px}
.npanel li{padding:9px 8px;border-radius:5px;display:flex;flex-direction:column;gap:2px}
.npanel li.new{background:var(--todo-bg)}
.npanel li small{color:var(--muted)}