:root{
  --arancio:#ff7a00;
  --arancio-scuro:#e85d00;
  --nero:#1a1a1a;
  --bianco:#ffffff;
}
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  font-family:"Segoe UI",Arial,sans-serif;
  font-size:18px;
  background:var(--bianco);
  color:var(--nero);
  display:flex;
  flex-direction:column;
  min-height:100vh;
  min-height:100dvh;
  height:100dvh;
  overflow:hidden;
}
header{
  text-align:center;
  padding:24px 16px 8px;
}
header img{
  max-width:180px;
  height:auto;
}
header h1{
  color:var(--arancio);
  margin:12px 0 2px;
  font-size:2rem;
}
header .sub{
  color:var(--nero);
  font-size:1.05rem;
  opacity:.75;
}
.privacy{
  max-width:680px;
  margin:8px auto 0;
  text-align:center;
  font-size:.95rem;
  color:var(--arancio-scuro);
  padding:0 16px;
}
.privacy a{color:var(--arancio-scuro);font-weight:bold;}
.privacy a:hover{text-decoration:none;}

/* Pagina privacy: layout scorrevole, non a tutta altezza */
body.page{
  height:auto;
  min-height:100vh;
  min-height:100dvh;
  overflow:auto;
}
.page-main{
  flex:1;
  width:100%;
  max-width:760px;
  margin:0 auto;
  padding:8px 20px 40px;
}
.page-main h2{
  color:var(--arancio);
  font-size:1.5rem;
  margin:28px 0 10px;
}
.page-main h2:first-child{margin-top:8px;}
.page-main p,.page-main li{
  font-size:1.05rem;
  line-height:1.6;
}
.page-main ul{padding-left:22px;}
.page-main li{margin:6px 0;}
.page-main strong{color:var(--nero);}
.torna{
  display:inline-block;
  margin:28px 0 8px;
  background:var(--arancio);
  color:var(--bianco);
  padding:13px 26px;
  border-radius:10px;
  font-size:1.1rem;
  font-weight:bold;
  text-decoration:none;
  transition:background .15s;
}
.torna:hover{background:var(--arancio-scuro);}
main{
  flex:1;
  width:100%;
  max-width:680px;
  margin:0 auto;
  padding:16px;
  display:flex;
  flex-direction:column;
  min-height:0;
}
#chat{
  flex:1;
  border:2px solid var(--arancio);
  border-radius:14px;
  padding:16px;
  overflow-y:auto;
  min-height:0;
  background:var(--bianco);
}
.msg{
  margin:8px 0;
  padding:11px 16px;
  border-radius:14px;
  max-width:80%;
  font-size:1.1rem;
  line-height:1.45;
  word-wrap:break-word;
}
.msg.user{
  background:var(--nero);
  color:var(--bianco);
  margin-left:auto;
  border-bottom-right-radius:4px;
}
.msg.dino{
  background:var(--arancio);
  color:var(--bianco);
  margin-right:auto;
  border-bottom-left-radius:4px;
}
.msg.dino.thinking{opacity:.7;font-style:italic;}
form#chatform{
  display:flex;
  gap:8px;
  margin-top:14px;
}
#domanda{
  flex:1;
  min-width:0;
  width:100%;
  padding:13px 16px;
  border:2px solid var(--nero);
  border-radius:10px;
  font-size:1.1rem;
  outline:none;
}
#domanda:focus{border-color:var(--arancio);}
button{
  background:var(--arancio);
  color:var(--bianco);
  border:none;
  flex:0 0 auto;
  padding:0 22px;
  border-radius:10px;
  font-size:1.1rem;
  font-weight:bold;
  white-space:nowrap;
  cursor:pointer;
  transition:background .15s;
}
button:hover{background:var(--arancio-scuro);}
footer{
  text-align:center;
  padding:18px;
  font-size:.95rem;
  color:var(--nero);
  border-top:1px solid #eee;
}
footer .by{color:var(--nero);}
footer .by a{color:var(--arancio);font-weight:bold;text-decoration:none;}
footer .by a:hover{text-decoration:underline;}
footer .libro{
  display:inline-block;
  margin-left:14px;
  color:var(--arancio);
  font-weight:bold;
  text-decoration:none;
  white-space:nowrap;
}
footer .libro:hover{text-decoration:underline;}

/* Mobile: tutto in una schermata, niente scroll di pagina */
@media (max-height:760px), (max-width:600px){
  header{padding:12px 16px 4px;}
  header img{max-width:120px;}
  header h1{font-size:1.6rem;margin:6px 0 1px;}
  header .sub{font-size:.95rem;}
  .privacy{font-size:.8rem;margin-top:4px;line-height:1.3;}
  main{padding:10px;}
  #chat{padding:12px;}
  .msg{font-size:1rem;padding:9px 13px;}
  form#chatform{margin-top:10px;}
  footer{padding:10px;font-size:.85rem;}
}
