:root{--color-bg-primary:#08080d;--color-bg-secondary:#0f0f16;--color-surface:#161620;--color-accent-primary:#a63ce0;--color-accent-secondary:#5b6ce0;--color-accent-tertiary:#17b7d6;--color-btn-primary:#9c1fc7;--color-text-primary:#f4f4f8;--color-text-secondary:#c9cdd6;--color-success:#3de8b0;--color-error:#ff5c7a;--color-border:#242433;--piece-i:var(--color-accent-tertiary);--piece-o:#e0c93c;--piece-t:var(--color-accent-primary);--piece-s:var(--color-success);--piece-z:var(--color-error);--piece-j:var(--color-accent-secondary);--piece-l:#e0813c;--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--radius-md:8px;--radius-lg:14px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--color-bg-primary);color:var(--color-text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;overscroll-behavior:none}a{color:inherit}button,input{font-family:inherit}.gradient-title{background:linear-gradient(90deg, var(--color-accent-primary), var(--color-accent-secondary));color:#0000;-webkit-background-clip:text;background-clip:text;font-weight:800}.btn{border-radius:var(--radius-md);cursor:pointer;border:none;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;transition:transform .1s,opacity .15s}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-btn-primary);color:var(--color-text-primary)}.btn-secondary{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border)}.btn-outline{color:var(--color-text-secondary);border:1px solid var(--color-border);background:0 0}.panel{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.text-secondary{color:var(--color-text-secondary)}.error-text{color:var(--color-error)}.success-text{color:var(--color-success)}.screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;min-height:100%;padding:1.5rem;display:flex}.field{text-align:left;flex-direction:column;gap:.4rem;width:100%;max-width:320px;display:flex}.field input{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);padding:.65rem .9rem;font-size:1rem}.field input:focus{outline:2px solid var(--color-accent-tertiary);outline-offset:1px}.next-piece-preview{flex-direction:column;align-items:center;gap:.4rem;padding:.75rem;display:flex}.next-piece-label{text-transform:uppercase;letter-spacing:.05em;font-size:.75rem}.next-piece-grid{gap:2px;display:grid}.next-piece-cell{border-radius:3px}.score-panel{flex-direction:column;gap:.5rem;min-width:140px;padding:.9rem 1.1rem;display:flex}.score-panel .player-name{color:var(--color-text-primary);text-overflow:ellipsis;white-space:nowrap;font-weight:700;overflow:hidden}.score-panel .stat-row{justify-content:space-between;font-size:.9rem;display:flex}.score-panel .stat-row .value{color:var(--color-accent-tertiary);font-weight:700}.game-board-column{flex-direction:column;align-items:center;gap:.75rem;display:flex}.game-side-panel{flex-direction:column;gap:.75rem;display:flex}.game-play-area{flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:1rem;display:flex}.board-wrapper{border-radius:var(--radius-md);touch-action:none;line-height:0;position:relative;overflow:hidden}.board-wrapper.readonly{opacity:.92}.controls-hint{text-align:center;max-width:480px;padding:.5rem 1rem}.split-screen{flex-flow:wrap;justify-content:center;align-items:flex-start;gap:2rem;display:flex}@media (width<=600px){.split-screen{flex-direction:column;align-items:center}}.overlay{text-align:center;background:#08080dd9;flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:1rem;display:flex;position:absolute;inset:0}
