/* ══════════════════════════════════════════════════════════════════════
   lue-manuale.css — Manuale del Viandante (libretto sfogliabile)
   Copertina + pagine sfogliabili; tab-icona in header; pagina piena.
   Scoped su #lue-manuale / #db-help-overlay.
   ══════════════════════════════════════════════════════════════════════ */

/* finestra piu' grande + altezza definita (necessaria allo scroll interno) */
#db-help-overlay .db-help-modal { width:min(1040px, 96vw); height:min(90vh, 860px); }
#db-help-overlay .db-help-body { padding:0; overflow:hidden; min-height:0; }

/* ---------------- header: brand + tab-icona + ricerca ---------------- */
#db-help-overlay .db-help-header { display:flex; align-items:center; justify-content:flex-start; gap:12px; flex-wrap:wrap; }
#db-help-overlay .lue-brand { flex:0 0 auto; }
#db-help-overlay .lue-tabs { display:flex; gap:6px; }
#db-help-overlay .lue-tab {
  position:relative; width:40px; height:32px; display:grid; place-items:center; cursor:pointer;
  background:rgba(200,160,40,.08); border:1px solid #4a3d20; border-radius:3px; color:#c2a24f; padding:0;
  transition:background .12s, color .12s, border-color .12s;
}
#db-help-overlay .lue-tab svg { width:21px; height:21px; }
#db-help-overlay .lue-tab:hover { color:#f0c94a; border-color:#c09820; background:rgba(200,160,40,.16); }
#db-help-overlay .lue-tab.on { background:#c09820; color:#1a1206; border-color:#c09820; }
#db-help-overlay .lue-tab:focus-visible { outline:2px solid #8fd0ff; outline-offset:2px; }
#db-help-overlay .lue-tip {
  position:absolute; top:calc(100% + 6px); left:50%; transform:translateX(-50%);
  background:#12101e; color:#f0c94a; border:1px solid #c09820; border-radius:3px;
  font:13px/1 Georgia, serif; letter-spacing:.02em; padding:4px 9px; white-space:nowrap;
  opacity:0; pointer-events:none; transition:opacity .12s; z-index:20; text-transform:none;
}
#db-help-overlay .lue-tab:hover .lue-tip, #db-help-overlay .lue-tab:focus-visible .lue-tip { opacity:1; }
#db-help-overlay .lue-q {
  margin-left:auto; width:160px; box-sizing:border-box; font:14px Georgia, serif; color:#e9dcc4;
  background:#1a1828; border:1px solid #4a3d20; border-radius:3px; padding:5px 9px;
}
#db-help-overlay .lue-q::placeholder { color:#8a7c62; }
#db-help-overlay .lue-q:focus { outline:none; border-color:#c09820; }

/* ---------------- contenitore libro ---------------- */
#lue-manuale {
  --paper:#e9ddc4; --ink:#2a2018; --ink-soft:#5f5140;
  --accent:#7a2e26; --rule:#b7a684; --gold:#c9a24a;
  --mono:"Courier New", monospace;
  position:relative; display:flex; flex-direction:column; height:100%; min-height:0;
  font-family:Georgia,"Times New Roman",serif; color:var(--ink);
}
#lue-manuale .lm-main { position:relative; flex:1; overflow-y:auto; overflow-x:hidden; min-height:0; background:var(--paper);
  scrollbar-width:thin; scrollbar-color:#b7a684 var(--paper); perspective:2000px; }
#lue-manuale .lm-vp { min-height:100%; }

/* ---- sfoglio a due strati ----
   La FOGLIA (.lm-leaf) è un clone della pagina uscente: ruota sulla costa
   (left = avanti, right = indietro) e sparisce oltre i 90° (backface hidden),
   scoprendo la pagina entrante (.lm-vp) che si assesta sotto. La velatura
   (.lm-leaf-sh) scurisce la carta mentre si solleva, per dare volume. */
#lue-manuale .lm-leaf {
  position:absolute; inset:0; z-index:5; overflow:hidden; background:var(--paper);
  backface-visibility:hidden; will-change:transform;
  box-shadow:0 6px 34px rgba(0,0,0,.45);
}
#lue-manuale .lm-leaf-pg { min-height:100%; }
#lue-manuale .lm-leaf-sh { position:absolute; inset:0; pointer-events:none; opacity:0; }
#lue-manuale .lm-leaf.leaf-n { transform-origin:left center;  animation:leafN 1.1s cubic-bezier(.4,.05,.35,1) forwards; }
#lue-manuale .lm-leaf.leaf-p { transform-origin:right center; animation:leafP 1.1s cubic-bezier(.4,.05,.35,1) forwards; }
#lue-manuale .lm-leaf.leaf-n .lm-leaf-sh { background:linear-gradient(90deg,  rgba(10,6,2,.02), rgba(10,6,2,.55) 92%); animation:shFade 1.1s ease-out forwards; }
#lue-manuale .lm-leaf.leaf-p .lm-leaf-sh { background:linear-gradient(270deg, rgba(10,6,2,.02), rgba(10,6,2,.55) 92%); animation:shFade 1.1s ease-out forwards; }
@keyframes leafN { 0% { transform:rotateY(0); } 100% { transform:rotateY(-172deg); } }
@keyframes leafP { 0% { transform:rotateY(0); } 100% { transform:rotateY(172deg); } }
@keyframes shFade { 0% { opacity:0; } 45% { opacity:1; } 100% { opacity:0; } }

/* pagina entrante: parte inclinata/scura sotto la foglia, poi si distende */
#lue-manuale .lm-vp.page-in-n { animation:pageInN 1.1s cubic-bezier(.2,.7,.2,1) both; transform-origin:left center; }
#lue-manuale .lm-vp.page-in-p { animation:pageInP 1.1s cubic-bezier(.2,.7,.2,1) both; transform-origin:right center; }
@keyframes pageInN { 0% { transform:rotateY(16deg); filter:brightness(.72); } 55% { filter:brightness(.9); } 100% { transform:none; filter:none; } }
@keyframes pageInP { 0% { transform:rotateY(-16deg); filter:brightness(.72); } 55% { filter:brightness(.9); } 100% { transform:none; filter:none; } }

/* frecce di sfoglio */
#lue-manuale .lm-prev, #lue-manuale .lm-next {
  position:absolute; top:calc(50% - 13px); transform:translateY(-50%); z-index:6;
  width:44px; height:66px; display:grid; place-items:center; cursor:pointer;
  background:rgba(18,16,30,.5); color:#e9dcc4; border:1px solid #4a3d20; font-size:26px;
  transition:background .14s, color .14s;
}
#lue-manuale .lm-prev { left:0; border-left:0; border-radius:0 4px 4px 0; }
#lue-manuale .lm-next { right:0; border-right:0; border-radius:4px 0 0 4px; }
#lue-manuale .lm-prev:hover, #lue-manuale .lm-next:hover { background:rgba(18,16,30,.82); color:#f0c94a; }
#lue-manuale .lm-prev:disabled, #lue-manuale .lm-next:disabled { opacity:.22; cursor:default; }
#lue-manuale .lm-foot { flex:0 0 auto; height:26px; display:grid; place-items:center;
  font:11px/1 Georgia,serif; letter-spacing:.16em; text-transform:uppercase; color:#8a7c62;
  background:#12101e; border-top:1px solid #2a2030; }

/* ---------------- copertina ---------------- */
#lue-manuale .lm-cover { min-height:100%; display:grid; place-items:center; padding:48px 60px; text-align:center;
  background:radial-gradient(120% 90% at 50% 0%, #201732, #130d20 68%, #0c0813); color:#e9ddc4; }
#lue-manuale .lm-cover-in { max-width:540px; }
#lue-manuale .lm-emblem svg { width:160px; height:106px; }
#lue-manuale .lm-cv-k { letter-spacing:.34em; text-transform:uppercase; font-size:12px; color:#b79a5a; margin-top:12px; }
#lue-manuale .lm-cv-t { font:700 clamp(40px,7vw,66px)/1 Georgia,serif; color:#ecdfbf; margin:6px 0 2px; letter-spacing:.01em; text-wrap:balance; }
#lue-manuale .lm-cv-s { font-style:italic; font-size:21px; color:var(--gold); }
#lue-manuale .lm-cv-rule { width:120px; height:1px; background:var(--gold); opacity:.55; margin:20px auto; }
#lue-manuale .lm-cv-e { font-size:12.5px; letter-spacing:.18em; text-transform:uppercase; color:#9a8a6a; }
#lue-manuale .lm-cv-hint { margin-top:28px; font-size:13px; color:#8a7c62; font-style:italic; }

/* ---------------- pagina di carta ---------------- */
#lue-manuale .lm-page {
  display:block; column-count:initial; columns:initial;
  position:relative; padding:26px clamp(52px,6vw,80px) 40px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  background-blend-mode:multiply; color:var(--ink);
}
#lue-manuale .lm-head { display:flex; justify-content:space-between; align-items:baseline; gap:12px;
  font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft);
  border-bottom:1px solid var(--rule); padding-bottom:7px; margin-bottom:16px; }
#lue-manuale .lm-folio { font-variant-numeric:tabular-nums; white-space:nowrap; }
#lue-manuale .lm-chap { color:var(--accent); font-size:12px; letter-spacing:.1em; text-transform:uppercase; margin:0 0 4px; font-weight:700; }
#lue-manuale .lm-title { font-size:clamp(26px,3.6vw,38px); line-height:1.07; margin:0 0 12px; text-wrap:balance; letter-spacing:-.01em; color:#3a2c1c; }

#lue-manuale .lm-cmdrow { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 0 18px; }
#lue-manuale .lm-cmdrow .lbl { font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); margin-right:2px; }
#lue-manuale .lm-cmdrow .c { font-family:var(--mono); font-size:12px; color:var(--accent);
  background:rgba(122,46,38,.09); border:1px solid var(--rule); padding:2px 8px; border-radius:2px; }

#lue-manuale .lm-plate { display:block; margin:0 0 20px; border:1px solid var(--rule); background:#0c0a0f; padding:10px; max-width:440px; }
#lue-manuale .lm-plate img { display:block; width:100%; height:auto; }
#lue-manuale .lm-plate figcaption { margin-top:7px; font-size:12px; font-style:italic; color:#c9b59a; text-align:center; }
#lue-manuale .lm-ph { position:relative; aspect-ratio:3/2; display:grid; place-items:center; text-align:center; background:#0a0810; border:1px dashed rgba(201,181,154,.4); overflow:hidden; }
#lue-manuale .lm-ph svg { position:absolute; inset:0; width:100%; height:100%; opacity:.26; }
#lue-manuale .lm-ph .lm-lbl { position:relative; z-index:2; color:#c9b59a; font-family:var(--mono); font-size:11px; line-height:1.5; padding:6px; }
#lue-manuale .lm-ph .lm-lbl b { display:block; font-size:12px; letter-spacing:.12em; color:#e6d3b0; margin-bottom:3px; }
#lue-manuale .lm-ph .lm-lbl code { color:var(--gold); background:rgba(201,162,74,.12); padding:1px 5px; }

/* corpo migrato: blocco singolo, righe leggibili, testo scuro */
#lue-manuale .lm-body { display:block; column-count:initial; columns:initial; font-size:15.5px; line-height:1.62; color:var(--ink); }
#lue-manuale .lm-body > p, #lue-manuale .lm-body > div, #lue-manuale .lm-body > h3,
#lue-manuale .lm-body > h4, #lue-manuale .lm-body > ul, #lue-manuale .lm-body > ol,
#lue-manuale .lm-body > table { display:block; float:none; width:auto; clear:both; }
#lue-manuale .lm-body > *:first-child { margin-top:0; }
#lue-manuale .lm-body p, #lue-manuale .lm-body ul, #lue-manuale .lm-body ol { max-width:70ch; }
#lue-manuale .lm-body p { margin:0 0 13px; }
#lue-manuale .lm-body p.db-help-note { color:var(--ink-soft); }
#lue-manuale .lm-body h4 { font-size:16px; font-weight:700; margin:22px 0 9px; color:#3a2c22; border-left:4px solid var(--accent); padding-left:10px; }
#lue-manuale .lm-body h3.m-sub { font-size:18px; margin:26px 0 11px; color:var(--accent); border-bottom:1px solid var(--rule); padding-bottom:5px; }
#lue-manuale .lm-body ul, #lue-manuale .lm-body ol { margin:0 0 13px; padding-left:22px; }
#lue-manuale .lm-body li { margin:4px 0; }
#lue-manuale .lm-body strong { color:#3a2c22; }
#lue-manuale .lm-body em { color:var(--ink-soft); }
#lue-manuale .lm-body a { color:var(--accent); text-underline-offset:2px; }

#lue-manuale .lm-tablewrap { overflow-x:auto; margin:8px 0 18px; max-width:100%; }
#lue-manuale .lm-body table { border-collapse:collapse; width:100%; table-layout:auto; border:1px solid var(--rule); font-size:14px; }
#lue-manuale .lm-body td { padding:8px 12px; border-top:1px solid var(--rule); vertical-align:top; color:var(--ink); }
#lue-manuale .lm-body tr:first-child td { border-top:0; }
#lue-manuale .lm-body tr:nth-child(even) td { background:rgba(0,0,0,.035); }
#lue-manuale .lm-body td.db-help-cmd { font-family:var(--mono); color:var(--accent); font-weight:700; white-space:nowrap; width:1%; min-width:0; padding-right:16px; }

#lue-manuale .lm-hit { background:#f2d24a; color:#2a2018; border-radius:2px; padding:0 1px; }
#lue-manuale .lm-error { padding:24px; color:#7a2e26; font-family:var(--mono); }

@media (max-width:640px) {
  #db-help-overlay .lue-q { width:120px; }
  #lue-manuale .lm-prev, #lue-manuale .lm-next { width:34px; height:56px; font-size:22px; }
  #lue-manuale .lm-page { padding:22px 42px 34px; }
  #lue-manuale .lm-plate { max-width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  #lue-manuale .lm-vp.page-in-n, #lue-manuale .lm-vp.page-in-p { animation:none; }
  #lue-manuale .lm-leaf { display:none; }
}