.game-page { min-height:100vh; display:flex; flex-direction:column; padding-top:80px; }
    .game-hero { text-align:center; padding:3rem 2rem 1rem; }
    .game-title { font-family:'DM Serif Display',serif; font-size:clamp(2.5rem,6vw,4.5rem); line-height:1.05; color:var(--text); margin-bottom:.5rem; }
    .game-title em { font-style:italic; color:var(--accent); }
    .game-subtitle { font-family:'DM Mono',monospace; font-size:.8rem; color:var(--muted); letter-spacing:.08em; }
    .sw-controls { display:flex; justify-content:center; align-items:center; gap:2rem; padding:1.5rem 2rem; flex-wrap:wrap; }
    .sw-timer { font-family:'DM Mono',monospace; font-size:3rem; font-weight:500; color:var(--accent); min-width:5rem; text-align:center; line-height:1; transition:color .3s; }
    .sw-timer.warning { color:#f0a060; }
    .sw-timer.danger  { color:#f06060; }
    .sw-duration-group { display:flex; gap:.5rem; align-items:center; }
    .sw-duration-label { font-family:'DM Mono',monospace; font-size:.7rem; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; margin-right:.25rem; }
    .sw-dur-btn { font-family:'DM Mono',monospace; font-size:.8rem; padding:.4rem .9rem; border-radius:6px; border:1px solid var(--border); background:var(--surface); color:var(--muted); cursor:pointer; transition:border-color .2s,color .2s,background .2s; }
    .sw-dur-btn:hover,.sw-dur-btn.active { border-color:var(--accent); color:var(--accent); background:rgba(200,240,96,.06); }
    .sw-restart-btn { font-family:'DM Mono',monospace; font-size:.8rem; padding:.5rem 1.25rem; border-radius:6px; border:1px solid var(--border); background:var(--surface); color:var(--text); cursor:pointer; transition:border-color .2s,color .2s; }
    .sw-restart-btn:hover { border-color:var(--accent); color:var(--accent); }
    .sw-arena { max-width:900px; margin:0 auto; padding:0 2rem 2rem; width:100%; }
    .sw-words-container { position:relative; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); padding:1.75rem 2rem; margin-bottom:1.25rem; overflow:hidden; min-height:130px; cursor:text; user-select:none; }
    .sw-words-container::after { content:'Clicca qui o premi TAB per iniziare'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'DM Mono',monospace; font-size:.85rem; color:var(--muted); background:var(--surface); opacity:1; transition:opacity .3s; pointer-events:none; }
    .sw-words-container.active::after { opacity:0; pointer-events:none; }
    .sw-words-container.finished::after { content:''; opacity:0; }
    .sw-words { display:flex; flex-wrap:wrap; gap:.5rem .75rem; line-height:1.8; }
    
    .sw-word {
    font-family:'DM Mono', monospace;
    font-size:1.1rem;
    color:var(--muted);
    position:relative;
    padding:0 2px;
    border-radius:3px;
}

.sw-char {
    position:relative;
    display: inline-block;
}

    .sw-char.correct {
     color:var(--text); 
    }

    .sw-char.wrong {
    color:#f06060; 
    text-decoration:underline wavy #f06060; 
  }

    .sw-char.pending { 
    color:var(--muted); 
  }

    .sw-word.current-word {
    background:rgba(200,240,96,.06); 
  }

    .sw-char.cursor {
  position: relative;
}

.sw-char.cursor::before {
  content: '';
  position: absolute;
  left: -3px;
  top: 8%;
  width: 2px;
  height: 84%;
  background: #c8f060;
  border-radius: 2px;
  z-index: 999;
  pointer-events: none;
  animation: sw-cursor-blink 0.7s infinite;
}

@keyframes sw-cursor-blink {
  0%, 45% {
    opacity: 1;
  }

  46%, 100% {
    opacity: 0;
  }
}



    #sw-input { 
    position:absolute;
    opacity:0; 
    width:1px;
    height:1px; 
    pointer-events:none;
  }
  
    .sw-live-stats { display:flex; justify-content:center; gap:2rem; margin-bottom:1.25rem; flex-wrap:wrap; }
    .sw-stat-pill { display:flex; flex-direction:column; align-items:center; padding:.6rem 1.2rem; border:1px solid var(--border); border-radius:8px; background:var(--surface); min-width:80px; }
    .sw-stat-pill-val { font-family:'DM Mono',monospace; font-size:1.4rem; color:var(--text); font-weight:500; }
    .sw-stat-pill-label { font-family:'DM Mono',monospace; font-size:.65rem; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; }
    .sw-results { display:none; max-width:700px; margin:0 auto 3rem; padding:0 2rem; width:100%; animation:fadeUp .5s ease both; }
    .sw-results.show { display:block; }
    .sw-results-title { font-family:'DM Serif Display',serif; font-size:2rem; color:var(--text); text-align:center; margin-bottom:1.5rem; }
    .sw-results-title span { color:var(--accent); }
    .sw-results-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:1rem; margin-bottom:1.5rem; }
    .sw-result-card { border:1px solid var(--border); border-radius:var(--radius); padding:1.25rem; background:var(--surface); text-align:center; }
    .sw-result-card:first-child { border-color:var(--accent); }
    .sw-result-val { font-family:'DM Mono',monospace; font-size:2.5rem; font-weight:500; color:var(--accent); line-height:1; margin-bottom:.4rem; }
    .sw-result-card:nth-child(2) .sw-result-val { color:var(--accent2); }
    .sw-result-card:nth-child(3) .sw-result-val,.sw-result-card:nth-child(4) .sw-result-val { color:var(--text); }
    .sw-result-label { font-family:'DM Mono',monospace; font-size:.7rem; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; }
    .sw-results-actions { display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; }
    .sw-progress-bar { height:3px; background:var(--border); border-radius:2px; margin-bottom:1rem; overflow:hidden; }
    .sw-progress-fill { height:100%; background:linear-gradient(90deg,var(--accent),var(--accent2)); border-radius:2px; transition:width 1s linear; width:100%; }
    .sw-hint { text-align:center; font-family:'DM Mono',monospace; font-size:.72rem; color:var(--muted); padding-bottom:3rem; }
    .sw-hint kbd { border:1px solid var(--border); border-radius:4px; padding:.1rem .5rem; background:var(--surface); color:var(--text); font-family:'DM Mono',monospace; }
    .word-correct .sw-char { color:var(--text) !important; opacity:.5; }
    .word-wrong { text-decoration:underline wavy #f06060; }