:root{
  --sfondo:#0b1116; --sfondo2:#121b22; --pannello:#16222b; --pannello2:#1c2b36;
  --bordo:#2c4150; --testo:#e6e1d6; --testo2:#a9b6bd; --oro:#d8b46a; --oro2:#f0d193;
  --acqua:#5fa8a0; --sangue:#c05a4e; --verde:#6f9a5e; --raggio:14px;
  --ombra:0 6px 18px rgba(0,0,0,.45);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;height:100%;height:100dvh;overflow:hidden;background:var(--sfondo);color:var(--testo);
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  font-size:16px;line-height:1.5;overscroll-behavior:none}
body{user-select:none;-webkit-user-select:none}
input,textarea,select{user-select:text;-webkit-user-select:text}
#app{max-width:560px;margin:0 auto;min-height:100%;height:100vh;height:100dvh;overflow:hidden;position:relative;
  padding-bottom:env(safe-area-inset-bottom);box-shadow:0 0 60px rgba(0,0,0,.6);display:flex;flex-direction:column}
.nascosto{display:none !important}
.schermo{display:flex;flex-direction:column;height:100vh;height:100dvh;min-height:0;overflow:hidden;
  padding:calc(10px + env(safe-area-inset-top)) 12px calc(10px + env(safe-area-inset-bottom))}
h1,h2,h3{margin:0 0 .4em;font-weight:600}
h1{font-size:1.7rem;color:var(--oro2)}
h2{font-size:1.25rem;color:var(--oro)}
p{margin:0 0 .8em}
.piccolo{font-size:.8rem;color:var(--testo2)}
.evidenzia{color:var(--oro2)}
button{font-family:inherit;font-size:1rem;color:var(--testo);background:var(--pannello2);
  border:1px solid var(--bordo);border-radius:12px;padding:12px 14px;min-height:48px;
  width:100%;text-align:left;cursor:pointer}
button:active{transform:scale(.985)}
button:disabled{opacity:.4}
.btn-primario{background:linear-gradient(180deg,#3a2f18,#241d10);border-color:var(--oro);color:var(--oro2);
  text-align:center;font-weight:600}
.btn-lista{margin-bottom:8px;text-align:center}
.riga-bottoni{display:flex;gap:8px}
.riga-bottoni button{flex:1}
#schermo-titolo{position:relative;justify-content:center;align-items:stretch;text-align:center;
  background:radial-gradient(120% 80% at 50% 0%,#1b2c36 0%,#0b1116 70%)}
#schermo-titolo .marchio{font-size:3.4rem;line-height:1;margin-bottom:.1em}
#schermo-titolo h1{margin-bottom:.1em}
#schermo-titolo .sottotitolo{color:var(--testo2);font-size:.9rem;margin-bottom:1.2em;font-style:italic}
#schermo-titolo .menu{display:flex;flex-direction:column;gap:10px;max-width:340px;margin:0 auto;width:100%}
#schermo-titolo .crediti{position:absolute;bottom:14px;left:0;right:0;font-size:.68rem;color:#5b6b74;padding:0 16px}
.menu-fisso{position:fixed;top:calc(10px + env(safe-area-inset-top,0px));right:10px;z-index:41;
  width:34px;height:34px;padding:0;border-radius:10px;display:flex;align-items:center;justify-content:center;
  background:rgba(18,26,32,.72);border:1px solid var(--bordo);color:var(--testo);opacity:.86}
.segnala-fisso{
  position:fixed;top:calc(56px + env(safe-area-inset-top, 0px));right:10px;z-index:40;
  width:34px;height:34px;padding:0;border-radius:50%;line-height:1;
  font-size:.95rem;display:flex;align-items:center;justify-content:center;
  background:rgba(18,26,32,.72);border:1px solid var(--bordo);
  color:var(--testo);opacity:.76;cursor:pointer}
.segnala-fisso:active{opacity:1;transform:scale(.94)}
#modale{position:fixed;inset:0;background:rgba(4,8,10,.86);z-index:50;display:flex;
  align-items:flex-end;justify-content:center;padding:0}
#modale .contenuto-modale{background:var(--sfondo2);border:1px solid var(--bordo);border-radius:16px 16px 0 0;
  width:100%;max-width:560px;max-height:82vh;display:flex;flex-direction:column;
  padding:14px 14px calc(14px + env(safe-area-inset-bottom))}
#modale .corpo-modale{overflow-y:auto;flex:1;margin:10px 0}
.anteprima-segnalazione{max-height:180px;overflow-y:auto;background:#0d1516;border:1px solid var(--bordo);border-radius:10px;
  padding:10px 12px;font-size:.78rem;line-height:1.5;color:var(--testo2);white-space:pre-wrap;word-break:break-word;margin:8px 0}
.versione-app{margin-top:10px;font-size:.72rem;color:var(--testo2);opacity:.7}
#toast{position:fixed;left:50%;top:18px;transform:translateX(-50%);z-index:60;
  background:#1d2a24;border:1px solid var(--oro);color:var(--oro2);padding:10px 16px;border-radius:12px;
  font-size:.9rem;box-shadow:var(--ombra);max-width:90%;text-align:center}
#schermo-dadi.nascosto,#schermo-azione.nascosto{display:none}
.disclaimer{font-size:.72rem;color:#7a8a92;margin:0 auto 1.4em;max-width:340px;line-height:1.4}
