.pack-board{max-width:820px;margin:0 auto}.pack-canvas{display:block;width:100%;max-width:360px;height:auto;margin:auto;border-radius:12px}.pack-canvas:focus{outline:3px solid #bf7d25;outline-offset:3px}.pack-next{display:flex;align-items:center;justify-content:center;gap:12px}.pack-preview{display:grid;grid-template-columns:repeat(4,14px);gap:2px;background:#143039;padding:6px;border-radius:6px}.pack-preview i{width:14px;height:14px;border-radius:2px}.pack-hand{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px 0}.pack-pyramid-row{display:flex;justify-content:center;gap:4px;margin:4px 0}.pack-card{display:inline-flex;align-items:center;justify-content:center;min-width:0;width:clamp(32px,9vw,70px);height:clamp(48px,12vw,88px);padding:3px;border:2px solid #849c93!important;border-radius:8px;background:#fffdf6!important;color:#173a35!important;font-size:clamp(12px,2.5vw,18px);font-weight:700;white-space:normal;line-height:1.25;overflow-wrap:anywhere}.pack-card:disabled{opacity:.6;cursor:default}.pack-hand .pack-card{width:80px;height:100px}.pack-selected{outline:3px solid #c17b20;outline-offset:1px;transform:translateY(-2px)}.pack-red{color:#a72d45!important}.pack-gap{visibility:hidden}.pack-card:focus-visible{outline:3px solid #205fbb;outline-offset:2px}#controls label{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* Controles de bloques: misma distribución que las flechas del teclado. */
.pack-gesture-canvas{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#controls .pack-keypad{display:grid;grid-template-columns:repeat(3,minmax(64px,90px));gap:8px;justify-content:center;width:100%;margin:8px auto}
.pack-keypad .pack-key{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:60px;padding:8px;border-radius:10px;border-bottom:4px solid #163c30}
.pack-key kbd{font:700 24px/1.1 system-ui,sans-serif;color:inherit;background:none}
.pack-key span{font-size:12px;font-weight:500}
.pack-key-rotate{grid-column:2;grid-row:1}
.pack-key-left{grid-column:1;grid-row:2}
.pack-key-down{grid-column:2;grid-row:2}
.pack-key-right{grid-column:3;grid-row:2}
.pack-key-drop{grid-column:1 / 4;grid-row:3}
.pack-key-drop kbd{font-size:16px}
.pack-key:active{transform:translateY(2px)}
.pack-key:focus-visible{outline:3px solid #bf7d25;outline-offset:3px}

/* Distribución lateral según el espacio real del panel, incluso con anuncios. */
.blocks-container{container-type:inline-size}
.blocks-layout #controls{justify-content:center;align-items:center}
.blocks-layout #controls label{font-size:14px;justify-content:center}
.blocks-layout #controls select{max-width:100%;min-width:0;padding:7px;border:1px solid #9aac90;border-radius:8px;background:#f5f8ee;color:var(--ink)}
@container (min-width:660px){
 .blocks-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;column-gap:24px;align-items:center}
 .blocks-layout>*{grid-column:1 / -1;min-width:0}
 .blocks-layout>.board-scroll{grid-column:1;grid-row:auto;margin:0}
 .blocks-layout>#controls{grid-column:2;align-self:center;display:flex;flex-direction:column;margin:0;padding:18px 10px;background:#f3f8e9;border:1px solid #d5dfc9;border-radius:14px}
 .blocks-layout>.game-toolbar{grid-row:1}.blocks-layout>.game-help{grid-row:2}.blocks-layout>#save-status{grid-row:3}.blocks-layout>#instructions{grid-row:5}.blocks-layout>.board-scroll{grid-row:4}
 .blocks-layout>#controls{grid-row:4}
 .blocks-layout[data-controls-side="left"]{grid-template-columns:280px minmax(0,1fr)}
 .blocks-layout[data-controls-side="left"]>.board-scroll{grid-column:2}
 .blocks-layout[data-controls-side="left"]>#controls{grid-column:1}
 .blocks-layout #board{margin:0 auto}
 .blocks-layout #controls .pack-keypad{grid-template-columns:repeat(3,minmax(60px,1fr))}
}