/* Volantino MD · stile "morbido" (superfici bianche, angoli arrotondati, controlli tondi) con accento arancio New Target */
:root{
  --bg:#F7F5F2; --card:#FFFFFF; --ink:#1E1B18; --ink2:#4A443E; --muted:#645E57; --line:#E8E3DC; --line2:#F1EDE8;
  --acc:#BC5520;        /* pulsanti e testo su bianco (contrasto 4.8:1) */
  --acc-fill:#E07B3C;   /* barre, punti, bordi attivi */
  --acc-tint:#FCEEE5; --acc-tint2:#FFF8F3; --acc-ink:#8A3C14; --acc-line:#F2C9AE;
  --ok:#155C39; --ok-bg:#E5F4EC; --ok-dot:#1F7A4D;
  --warn:#6E5200; --warn-bg:#FFF5D6; --warn-line:#EBD48C; --warn-dot:#C49A00;
  --err:#8E1B12; --err-bg:#FDE8E6; --err-line:#EDB8B2; --err-dot:#B42318;
  --neutral-bg:#F1EEEA;
  --r:20px; --r-sm:14px;
  --font:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif; --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 var(--font)}
a{color:var(--acc)} a:hover{color:var(--acc-ink)}
h1{font-size:30px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
h2{font-size:16px;margin:0}
p{margin:0}
.muted{color:var(--muted)} .small{font-size:13px} .mono{font-family:var(--mono)}
.sr{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
:focus-visible{outline:2px solid var(--acc-fill);outline-offset:2px}

/* testata */
header.top{background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
header.top .in{max-width:1240px;margin:0 auto;padding:12px 24px;display:flex;flex-wrap:wrap;align-items:center;gap:20px}
.logo{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-weight:700;font-size:16px}
.logo .mk{width:34px;height:34px;border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700}
nav.main{display:flex;flex-wrap:wrap;gap:4px;flex:1 1 auto}
nav.main a{padding:9px 14px;border-radius:999px;color:var(--ink2);text-decoration:none;font-weight:500}
nav.main a:hover{background:var(--line2);color:var(--ink)}
nav.main a.on{background:var(--acc-tint);color:var(--acc-ink);font-weight:600}
.tag{font-size:11px;padding:2px 7px;border-radius:999px;background:var(--neutral-bg);color:var(--muted);margin-left:4px;font-weight:500}
.account{position:relative}
.account>summary{list-style:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;display:grid;place-items:center;font-weight:600;cursor:pointer}
.account>summary::-webkit-details-marker{display:none}
.account .menu{position:absolute;right:0;top:48px;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:14px;width:280px;box-shadow:0 12px 32px rgba(30,27,24,.12);display:flex;flex-direction:column;gap:10px;z-index:20}

main.wrap{max-width:1240px;margin:0 auto;padding:32px 24px 56px}
.head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:24px}
.head .sub{color:var(--muted);margin-top:6px}
.eyebrow{color:var(--muted);font-size:14px;margin-bottom:4px}
.cols{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start}
.cols>.main-col{flex:999 1 560px;min-width:0}
.cols>.side{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px}
.card.sm{padding:20px}
.stack{display:flex;flex-direction:column;gap:12px}
.stack-l{display:flex;flex-direction:column;gap:26px}
.flash{max-width:1240px;margin:16px auto 0;padding:12px 16px;border-radius:var(--r-sm);background:var(--acc-tint);color:var(--acc-ink)}
.flash.err{background:var(--err-bg);color:var(--err)}

/* controlli */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:46px;padding:0 22px;border-radius:999px;border:0;background:var(--acc);color:#fff;font:600 15px var(--font);text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{background:#A84A1A;color:#fff}
.btn:disabled{opacity:.6;cursor:default}
.btn.lg{height:54px;padding:0 30px;font-size:16px}
.btn.sec{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.sec:hover{background:var(--line2)}
.btn.danger{background:#fff;color:var(--err);border:1px solid var(--err-line)}
.btn.danger:hover{background:var(--err-bg)}
.btn.sm{height:38px;padding:0 14px;font-size:14px}
.ibtn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;display:grid;place-items:center;color:var(--ink);cursor:pointer;text-decoration:none}
.ibtn:hover{background:var(--line2)}
.chip{height:44px;padding:0 20px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);font:500 15px var(--font);cursor:pointer;display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.chip:hover{background:var(--line2);color:var(--ink)}
.chip.on,.chip[aria-pressed=true]{border:1.5px solid var(--acc-fill);background:var(--acc-tint);color:var(--acc-ink);font-weight:600}
.chip.sm{height:36px;padding:0 14px;font-size:13px}
.chip.dark{background:var(--ink);color:#fff;border-color:var(--ink)}
input[type=text],input[type=password],input[type=number],input[type=search],select,textarea{height:44px;border-radius:12px;border:1px solid var(--line);padding:0 14px;font:15px var(--font);color:var(--ink);background:#fff;width:100%}
textarea{height:auto;padding:12px 14px;resize:vertical;border-radius:var(--r-sm)}
select{appearance:auto}
input:focus,textarea:focus,select:focus{outline:2px solid var(--acc-fill);outline-offset:0;border-color:transparent}
label.field{display:flex;flex-direction:column;gap:6px;font-weight:600}
.opt{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);cursor:pointer}
.opt input[type=checkbox],.opt input[type=radio]{width:18px;height:18px;margin-top:2px;accent-color:var(--acc)}
.opt b{display:block;font-weight:600}
.opt .muted{font-size:13px}
.num{width:26px;height:26px;border-radius:50%;background:var(--acc-tint);color:var(--acc-ink);font-weight:700;font-size:13px;display:grid;place-items:center;flex:none}
.sec-title{display:flex;align-items:center;gap:10px}
.sec-title h2{font-size:17px}

/* avvisi */
.note{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--r-sm);font-size:14px;background:var(--neutral-bg);color:var(--ink2)}
.note svg{flex:none;margin-top:1px}
.note.ok{background:var(--ok-bg);color:var(--ok)}
.note.warn{background:var(--warn-bg);color:var(--warn)}
.note.err{background:var(--err-bg);color:var(--err)}
.note.acc{background:var(--acc-tint);color:var(--acc-ink)}
.note .act{margin-top:10px}
.note .btn.sec{height:38px;font-size:14px}

/* pillole di stato */
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:4px 10px;border-radius:999px;font-weight:600;white-space:nowrap}
.pill.s-completata{background:var(--ok-bg);color:var(--ok)}
.pill.s-avvisi{background:var(--warn-bg);color:var(--warn)}
.pill.s-errore,.pill.s-interrotta{background:var(--err-bg);color:var(--err)}
.pill.s-corso{background:var(--acc-tint);color:var(--acc-ink)}
.pill.s-coda{background:var(--neutral-bg);color:var(--ink2)}
.dot{width:10px;height:10px;border-radius:50%;flex:none;background:var(--muted)}
.dot.s-completata{background:var(--ok-dot)} .dot.s-avvisi{background:var(--warn-dot)} .dot.s-errore,.dot.s-interrotta{background:var(--err-dot)} .dot.s-corso{background:var(--acc-fill)}

/* home */
.drop{border:1.5px dashed var(--acc-line);border-radius:16px;background:var(--acc-tint2);padding:22px;display:flex;flex-wrap:wrap;align-items:center;gap:16px;cursor:pointer;transition:background .15s}
.drop.on{background:var(--acc-tint);border-color:var(--acc-fill)}
.drop .fi{width:46px;height:46px;border-radius:12px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;flex:none}
.drop .tx{flex:1 1 240px;min-width:0}
.drop .tx b{display:block}
.footbar{display:flex;flex-wrap:wrap;gap:16px;align-items:center;border-top:1px solid var(--line2);padding-top:22px}
.recent{display:flex;align-items:center;gap:12px;padding:10px;margin:0 -10px;border-radius:12px;text-decoration:none;color:var(--ink)}
.recent:hover{background:var(--bg);color:var(--ink)}
.recent .t{flex:1;min-width:0}
.recent .t b{display:block;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recent .t span{color:var(--muted);font-size:13px}

/* avanzamento */
.bar{height:8px;border-radius:999px;background:var(--line);overflow:hidden}
.bar>i{display:block;height:100%;background:var(--acc-fill);border-radius:999px;width:0;transition:width .4s}
.status-pill{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;font-weight:600}
.steps{list-style:none;margin:0;padding:8px 24px;background:#fff;border:1px solid var(--line);border-radius:var(--r)}
.step{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--line2);align-items:flex-start}
.step:last-child{border-bottom:0}
.step .ico{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;box-sizing:border-box}
.step .bd{flex:1;min-width:0}
.step .t{font-weight:600}
.step .d{font-size:14px;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere}
.step .tm{color:var(--muted);font-size:13px;white-space:nowrap}
.step.ok .ico{background:var(--ok-bg);color:var(--ok)}
.step.avviso .ico{background:var(--warn-bg);color:var(--warn)}
.step.avviso .d{color:var(--warn)}
.step.errore .ico{background:var(--err-bg);color:var(--err)}
.step.errore .d{color:var(--err)}
.step.attesa,.step.saltato{color:var(--muted)}
.step.attesa .t,.step.saltato .t{color:var(--ink2)}
.step.attesa .ico,.step.saltato .ico{border:1.5px solid #D6D0C8}
.step.saltato .ico{color:var(--muted)}
.step.corso{background:var(--acc-tint2);border:1px solid var(--acc-line);border-radius:16px;margin:6px -12px;padding:16px 12px}
.step.corso .t{font-weight:700}
.step.corso .d{color:var(--ink2)}
.step.corso .ico{border:3px solid var(--acc-line);border-top-color:var(--acc-fill);animation:giro 1s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.step.corso .ico{animation:none}.bar>i{transition:none}}
details.log{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 20px}
details.log summary{font-weight:600;cursor:pointer}
pre.log{margin:12px 0 0;font:12px/1.6 var(--mono);color:var(--ink2);white-space:pre-wrap;max-height:320px;overflow:auto;background:var(--bg);border-radius:12px;padding:12px}

/* risultato */
.ok-badge{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;flex:none}
.zip-card{border-radius:24px;padding:32px;display:flex;flex-direction:column;gap:24px}
.zip-head{display:flex;flex-wrap:wrap;align-items:center;gap:20px}
.zip-ic{width:64px;height:64px;border-radius:18px;background:var(--acc-tint);display:grid;place-items:center;flex:none}
.zip-head .tx{flex:1 1 260px;min-width:0}
.zip-head .tx b{font-size:19px;display:block}
.zip-head .mono{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.tree{border:1px solid var(--line2);border-radius:16px;padding:6px 18px;font-size:14px}
.tree .it{display:flex;gap:14px;padding:12px 0;border-bottom:1px solid var(--line2);align-items:center}
.tree .it:last-child{border-bottom:0}
.tree .it>span{flex:1;min-width:0}
.tree .it>span:first-child{flex:none;display:flex}
.tree .it .muted{display:block}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:640px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi{background:var(--bg);border-radius:var(--r-sm);padding:14px}
.kpi b{display:block;font-size:24px;line-height:1.2}
.kpi span{color:var(--muted);font-size:13px}
.files{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.files a{font-size:14px}

/* tabella storico */
.table-box{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow-x:auto}
table.list{width:100%;min-width:860px;border-collapse:collapse;font-size:14px}
table.list th{text-align:left;color:var(--muted);font-size:13px;font-weight:600;padding:14px 8px}
table.list td{padding:14px 8px;border-top:1px solid var(--line2);vertical-align:middle}
table.list th:first-child,table.list td:first-child{padding-left:20px}
table.list th:last-child,table.list td:last-child{padding-right:20px;text-align:right;white-space:nowrap}
table.list td .muted{display:block;font-size:13px}
table.list a.act{font-weight:600;margin-left:14px}
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.search{flex:1 1 280px;display:flex;align-items:center;gap:10px;height:46px;padding:0 16px;border-radius:999px;background:#fff;border:1px solid var(--line)}
.search input{border:0;height:40px;padding:0;outline:none}
.search input:focus{outline:none}
.filters select{width:auto;height:46px;border-radius:999px;padding:0 14px}
.sep{width:1px;height:22px;background:var(--line);margin:0 6px}

/* revisione */
.rev-bar .in{gap:16px}
.rev-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:700px){.rev-grid{grid-template-columns:1fr}}
.rev-fig{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px;display:flex;flex-direction:column;gap:10px}
.rev-fig figcaption{font-weight:600;font-size:14px;color:var(--ink2)}
.rev-img{height:min(56vh,460px);border-radius:var(--r-sm);display:grid;place-items:center;overflow:hidden;border:1px solid var(--line2);background:#fff}
.rev-img img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.rev-img.chk{background:repeating-conic-gradient(#E8E4DE 0% 25%,#fff 0% 50%) 0 0/20px 20px}
.strip{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 6px}
.strip button{flex:none;width:150px;padding:10px;border-radius:var(--r-sm);border:1px solid var(--line);background:#fff;text-align:left;font:13px var(--font);cursor:pointer;color:var(--ink)}
.strip button[aria-current=true]{border:2px solid var(--acc-fill);padding:9px}
.strip button b{display:block}
.st-dec{color:var(--warn)} .st-ok{color:var(--ok)} .st-rif{color:var(--acc-ink)} .st-none{color:var(--muted)}
.rev-side{display:flex;flex-direction:column;gap:18px}
.rev-side .sku{font-size:24px;font-weight:700}
fieldset.metodi{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
fieldset.metodi legend{font-weight:600;margin-bottom:8px;padding:0}
fieldset.metodi .opt{align-items:center;padding:10px 12px}
fieldset.metodi .opt:has(input:checked){border:1.5px solid var(--acc-fill);background:var(--acc-tint2)}
fieldset.metodi .opt .muted{font-size:13px}
.rev-foot{border-top:1px solid var(--line2);padding-top:14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
.kbd{font:12px var(--mono);border:1px solid var(--line);border-radius:6px;padding:1px 6px;background:#fff}

/* login */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.login{width:100%;max-width:400px}

@media (max-width:640px){
  h1{font-size:25px}
  main.wrap{padding:24px 16px 48px}
  header.top .in{padding:12px 16px;gap:12px}
  .card{padding:20px} .zip-card{padding:22px}
  .steps{padding:4px 16px}
}
.chip:has(input:checked){border:1.5px solid var(--acc-fill);background:var(--acc-tint);color:var(--acc-ink);font-weight:600}
.chip:has(input:focus-visible){outline:2px solid var(--acc-fill);outline-offset:2px}
.account{margin-left:auto}
@media (max-width:640px){
  nav.main{order:3;flex:1 1 100%;flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:0 12px}
  nav.main a{white-space:nowrap}
}

/* riepilogo: righe "da fare" */
.todo{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line2);font-size:14px}
#guarda-l>.todo:first-child{border-top:0}
details.todo{display:block}
details.todo summary{display:flex;align-items:center;gap:12px;list-style:none;cursor:pointer}
details.todo summary::-webkit-details-marker{display:none}
.todo .tn{min-width:36px;height:30px;padding:0 8px;border-radius:999px;display:grid;place-items:center;font-weight:700;font-size:14px;flex:none}
.todo.warn .tn{background:var(--warn-bg);color:var(--warn)}
.todo.err .tn{background:var(--err-bg);color:var(--err)}
.todo.ok .tn{background:var(--ok-bg);color:var(--ok)}
.todo .tt{flex:1;min-width:0}
.todo .more{color:var(--acc);font-weight:600;font-size:13px}
details.todo[open] .more{color:var(--muted)}
.todo .lst{margin:8px 0 2px 48px;font:12px/1.6 var(--mono);color:var(--ink2);overflow-wrap:anywhere;max-height:180px;overflow:auto}
.todo .btn.sm{height:34px}
/* revisione: sfondo a scelta dietro il ritaglio */
.bgsel{display:flex;gap:6px;align-items:center}
.bgsel button{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);cursor:pointer;padding:0}
.bgsel button[aria-pressed=true]{outline:2px solid var(--acc-fill);outline-offset:2px}
.rev-img.bg-chk{background:repeating-conic-gradient(#E8E4DE 0% 25%,#fff 0% 50%) 0 0/20px 20px}
.rev-img.bg-bianco{background:#fff}
.rev-img.bg-scuro{background:#2B2724}
.rev-img.bg-arancio{background:#F6D5C0}