:root{--board-width:10;--board-height:20;--cell-gap:1px;--board-padding:5px;--cell-size:28px;--next-cell-size:20px}.tetris-card{max-width:100%;overflow:hidden;padding:1rem!important}.tetris-layout{flex-direction:column;gap:1.5rem;min-width:0;display:flex}.tetris-game-info{flex:100%;order:2;min-width:0}.tetris-main-area{flex-direction:column;order:1;align-items:center;width:100%;min-width:0;display:flex}.tetris-board-container{padding:var(--board-padding);box-sizing:border-box;background:#1d1f27;border:3px solid #555;border-radius:8px;max-width:100%;position:relative;overflow:hidden;box-shadow:inset 0 0 10px #000000b3}.tetris-board{grid-template-columns:repeat(var(--board-width), var(--cell-size));grid-template-rows:repeat(var(--board-height), var(--cell-size));gap:var(--cell-gap);max-width:100%;display:grid}.tetris-cell{width:var(--cell-size);height:var(--cell-size)}.tetris-cell.empty{background:#282c34}.tetris-cell.filled{border:1px solid #ffffff1a;box-shadow:inset 2px 2px 4px #ffffff4d,inset -2px -2px 4px #0000004d}.tetris-side-panel{flex-wrap:wrap;justify-content:space-around;gap:1rem;width:100%;min-width:0;margin-bottom:1rem;display:flex}.next-piece-container,.hold-piece-container{text-align:center;background:#1a1a2ecc;border-radius:8px;flex:1;min-width:0;padding:.8rem}.next-piece-container h4,.hold-piece-container h4{color:#e0e0e0;margin:0 0 .8rem;font-size:.9em}.next-piece-grid{grid-template-columns:repeat(4, var(--next-cell-size));grid-template-rows:repeat(4, var(--next-cell-size));gap:1px;margin:0 auto;display:grid}.next-piece-cell{width:var(--next-cell-size);height:var(--next-cell-size)}.next-piece-cell.empty{background:0 0}.tetris-start-screen,.tetris-game-over,.tetris-pause-overlay{z-index:10;color:#fff;text-align:center;background:#000000d9;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;padding:1rem;display:flex;position:absolute;inset:0}.controls-info{text-align:left;justify-content:space-around;gap:1.5rem;width:100%;max-width:400px;margin-top:1.5rem;display:flex}.controls-section h4{color:#0ff;border-bottom:1px solid #00ffff4d;margin:0 0 .8rem;padding-bottom:.5rem;font-size:1.1em}.controls-section ul{margin:0;padding:0;list-style:none}.controls-section li{color:#ecf0f1;margin-bottom:.5rem;font-size:.95em}kbd{color:#34495e;white-space:nowrap;background-color:#ecf0f1;border:1px solid #bdc3c7;border-radius:3px;padding:2px 4px;font-family:monospace;font-size:.85em;font-weight:700;box-shadow:0 1px 1px #0003,inset 0 2px #ffffffb3}.mobile-controls{-webkit-user-select:none;user-select:none;box-sizing:border-box;touch-action:manipulation;background:#0000001a;border-radius:12px;flex-direction:column;gap:1rem;width:100%;max-width:320px;margin-top:1.5rem;padding:1rem;display:none}.control-row{justify-content:center;gap:1rem;min-width:0;display:flex}@media (width>=992px){:root{--cell-size:30px;--next-cell-size:22px}.tetris-layout{flex-direction:row;align-items:flex-start}.tetris-game-info{flex-basis:320px;order:2}.tetris-main-area{flex-direction:row;order:1;align-items:flex-start;gap:1.5rem}.tetris-side-panel{flex-direction:column;order:1;width:auto;margin-bottom:0;margin-right:1.5rem}}@media (width<=480px){:root{--cell-size:clamp(22px, calc((100vw - 96px) / 10), 28px);--next-cell-size:calc(var(--cell-size) * .7)}.tetris-card{padding:.75rem!important}.tetris-side-panel{gap:.5rem}.next-piece-container,.hold-piece-container{padding:.55rem}.mobile-controls{max-width:100%;padding:.75rem}.control-row{gap:.5rem}.controls-info{flex-direction:column;gap:1rem}}@media (hover:none) and (pointer:coarse){.mobile-controls{display:flex!important}}@media (hover:hover) and (pointer:fine){.mobile-controls{display:none!important}}
