/* Pagine web di StraKoffee Split, nello stile dell'app e del sito originale. */
:root { --crema: #f6ecd9; --crema-scura: #ecdcbf; --latte: #fffaf0; --caffe: #3b2418; --caffe-tenue: #7a5a48; --ciliegia: #c8102e; --ciliegia-scura: #9c0c24; --menta: #7fc8a9; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; color: var(--caffe); font-family: 'Fredoka', system-ui, sans-serif; line-height: 1.5;
  background: repeating-linear-gradient(90deg, var(--crema) 0 28px, var(--crema-scura) 28px 56px); }
main { max-width: 640px; margin: 0 auto; padding: 24px 16px 40px; display: flex; flex-direction: column; gap: 20px; }
.insegna { background: var(--ciliegia); color: var(--latte); border: 4px solid var(--latte); outline: 3px solid var(--ciliegia); border-radius: 22px;
  box-shadow: 6px 6px 0 var(--caffe); text-align: center; padding: 18px 14px 14px; margin: 6px; }
.insegna h1 { font-family: 'Pacifico', cursive; font-weight: 400; font-size: clamp(28px, 8vw, 40px); margin: 0;
  text-shadow: 3px 3px 0 var(--ciliegia-scura), 4px 4px 0 var(--caffe); }
.insegna p { margin: 4px 0 0; color: #ffe9d2; }
.card { background: var(--latte); border: 3px solid var(--caffe); border-radius: 18px; box-shadow: 5px 5px 0 var(--caffe); padding: 18px; }
.card h2 { margin: 0 0 10px; font-size: 20px; padding-bottom: 6px; border-bottom: 3px dotted var(--caffe-tenue); }
.btn { display: block; text-align: center; font-weight: 600; text-decoration: none; border: 3px solid var(--caffe); border-radius: 999px;
  padding: 11px 18px; background: var(--ciliegia); color: var(--latte); box-shadow: 3px 3px 0 var(--caffe); }
.btn.chiaro { background: var(--latte); color: var(--caffe); }
.codice { font-family: 'Courier New', monospace; font-weight: 700; font-size: 30px; letter-spacing: 3px; text-align: center;
  background: var(--crema); border: 2px dashed var(--caffe); border-radius: 12px; padding: 8px; margin: 10px 0; }
.nota { color: var(--caffe-tenue); font-size: 15px; }
.bozza { background: #fff6dc; border: 2px solid #c77d00; border-radius: 12px; padding: 10px 12px; font-weight: 600; color: #7a4d00; }
a { color: var(--ciliegia); font-weight: 600; }
footer { text-align: center; font-size: 14px; color: var(--caffe-tenue); }
[hidden] { display: none !important; }