.games-page-container{max-width:1000px;margin:0 auto}.text-center{text-align:center}.page-header{margin-bottom:var(--spacing-xl)}.back-link{color:var(--mute);margin-bottom:var(--spacing-xs);font-size:13px;display:inline-block}.back-link:hover{color:var(--ink)}.page-title{letter-spacing:-.03em;margin-bottom:4px;font-size:28px}.page-subtitle{color:var(--body);font-size:14px}.games-grid{gap:var(--spacing-lg);margin-top:var(--spacing-xl);grid-template-columns:repeat(3,1fr);display:grid}.game-card{text-align:center;background-color:var(--canvas-card);flex-direction:column;align-items:center;display:flex}.game-icon{margin-bottom:var(--spacing-sm);filter:drop-shadow(0 0 10px #3b82f626);font-size:48px;line-height:1}.game-card h3{margin-bottom:var(--spacing-xs);font-size:18px}.game-card p{margin-bottom:var(--spacing-md);flex-grow:1;font-size:13px;line-height:1.5}.game-meta-pills{gap:var(--spacing-xxs);margin-bottom:var(--spacing-lg);display:flex}.game-meta-pills .pill{border-radius:var(--rounded-full);border:1px solid var(--hairline);padding:3px 8px;font-size:10px;font-weight:600}.pill.xp-gain{color:#00dfd8;background-color:#00dfd80d;border-color:#00dfd833}.pill.timer-info{background-color:var(--canvas-soft);color:var(--body)}.game-play-screen{max-width:750px;margin:20px auto;animation:.3s fadeIn}.game-header-hud{border-bottom:1px solid var(--hairline);padding-bottom:var(--spacing-md);margin-bottom:var(--spacing-lg);justify-content:space-between;align-items:center;display:flex}.hud-item{align-items:center;gap:var(--spacing-xxs);display:flex}.hud-item .lbl{color:var(--mute);font-size:12px;font-weight:500}.hud-item .val{font-size:18px;font-weight:700;font-family:var(--font-mono)}.speed-question-zone{text-align:center;padding:var(--spacing-md) 0}.q-progress-mini{color:var(--mute);margin-bottom:var(--spacing-xs);font-size:12px;font-weight:500}.speed-q-display{margin-bottom:var(--spacing-xl);min-height:70px;font-size:20px;font-weight:600;line-height:1.4}.options-vertical-grid{gap:var(--spacing-xs);flex-direction:column;max-width:500px;margin:0 auto;display:flex}.speed-option-item{background-color:var(--canvas-soft);border:1px solid var(--hairline);border-radius:var(--rounded-md);padding:var(--spacing-md);cursor:pointer;transition:all var(--transition-fast);font-size:14px}.speed-option-item:hover{background-color:var(--canvas-soft-2);border-color:var(--hairline-strong);transform:translateY(-1px)}.matching-workspace{flex-direction:column;align-items:center;display:flex}.game-desc-hint{color:var(--body);margin-bottom:var(--spacing-lg);font-size:13px}.matching-grid{gap:var(--spacing-md);grid-template-columns:repeat(3,1fr);width:100%;display:grid}.match-grid-card{aspect-ratio:1.3;background-color:var(--canvas-soft);border:1px solid var(--hairline);border-radius:var(--rounded-md);padding:var(--spacing-sm);text-align:center;color:var(--ink);cursor:pointer;justify-content:center;align-items:center;font-size:12px;font-weight:500;line-height:1.4;transition:all .3s cubic-bezier(.16,1,.3,1);display:flex;overflow:hidden}.match-grid-card:hover{border-color:var(--hairline-strong);background-color:var(--canvas-soft-2);transform:translateY(-1px)}.match-grid-card.active-selected{background-color:#3b82f614;border-color:#3b82f6;transform:scale(.98)}.match-grid-card.matched{color:var(--success);cursor:default;pointer-events:none;opacity:.5;background-color:#10b9810d;border-color:#10b98133}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.shake-incorrect{border-color:var(--error);background-color:#ef44440d;animation:.4s ease-in-out shake}.typing-workspace{gap:var(--spacing-lg);flex-direction:column;display:flex}.typing-progress{font-size:11px;font-family:var(--font-mono);color:var(--mute);text-transform:uppercase}.typing-prompt-box{background-color:var(--canvas-soft);border:1px solid var(--hairline);padding:var(--spacing-lg);border-radius:var(--rounded-md)}.concept-lbl{color:var(--mute);text-transform:uppercase;font-size:11px}#typing-concept-title{margin:4px 0 var(--spacing-xxs) 0;font-size:22px}.concept-desc{color:var(--body);font-size:13px}.typing-input-area{gap:var(--spacing-xs);flex-direction:column;display:flex}.typing-input-area label{font-size:13px;font-weight:500}.font-mono-custom{letter-spacing:.02em;font-family:var(--font-mono)!important;font-size:15px!important}.syntax-tip{color:var(--mute);font-size:11px}.typing-feedback-box{padding:var(--spacing-sm);border-radius:var(--rounded-sm);border:1px solid var(--hairline);background-color:var(--canvas-soft)}.feedback-indicator{margin-bottom:2px;font-size:13px;font-weight:700}.feedback-indicator.correct{color:var(--success)}.feedback-indicator.incorrect{color:var(--error)}.feedback-correct-answer{color:var(--body);font-size:12px}.feedback-correct-answer code{font-family:var(--font-mono);color:#00dfd8}.typing-controls{justify-content:flex-end;display:flex}.go-stats-row{margin:var(--spacing-xl) 0;background-color:var(--canvas-soft);border:1px solid var(--hairline);border-radius:var(--rounded-md);justify-content:center;display:flex}.go-stat-box{padding:var(--spacing-md);text-align:center;flex-direction:column;flex:1;display:flex}.go-stat-box .val{font-size:28px;font-weight:800}.go-stat-box .lbl{color:var(--mute);text-transform:uppercase;margin-top:2px;font-size:11px}.justify-center{justify-content:center}@media (width<=768px){.games-grid{grid-template-columns:1fr}.matching-grid{grid-template-columns:1fr 1fr}}