.hand-tiles{position:relative;display:grid;grid-template-columns:repeat(15,44px);grid-template-rows:repeat(2,61px);gap:4px;width:752px;max-width:calc(100% - 38px);box-sizing:border-box;overflow-x:auto;justify-content:start;margin-left:max(0px,calc((100% - 1060px)/2));margin-right:0;padding:15px 12px 22px;border:6px solid #5f4328;border-top-width:4px;border-radius:5px;background:linear-gradient(180deg,#ae8050 0,#8a6138 55%,#654426 100%);box-shadow:inset 0 4px 0 #d2a66d,inset 0 -5px 0 #3f2b1b,0 5px 12px rgba(0,0,0,.25);cursor:grab;touch-action:pan-y}
.hand-tiles.rack-moving{cursor:grabbing;user-select:none;outline:3px solid rgba(255,214,90,.45)}
.hand-tiles::after{content:"";position:absolute;left:7px;right:7px;bottom:7px;height:5px;border-radius:3px;background:rgba(44,28,16,.55);pointer-events:none}.rack-slot{width:44px;height:61px;border:1px dashed rgba(255,238,202,.18);border-radius:7px}.rack-slot.drop-target{outline:3px solid #59d69b;outline-offset:1px;background:rgba(89,214,155,.18)}.hand-tiles .tile{width:44px;height:61px;font-size:1.7rem;cursor:grab;user-select:none;margin:0}.hand-tiles .tile:active{cursor:grabbing}.hand-tiles .tile.dragging{opacity:.35}.hand-tiles .tile.selected{transform:translateY(-8px);border-color:#ffd65a!important;outline:3px solid #59d69b;outline-offset:1px;box-shadow:0 7px 12px rgba(0,0,0,.3)!important;z-index:4}.hand-tiles .tile.flipped{transform:rotate(180deg)}.hand-tiles .tile.flipped.selected{transform:translateY(-8px) rotate(180deg)}
.match-panel.classic-table .hand-tiles{width:752px;max-width:calc(100% - 38px);margin-left:max(0px,calc((100% - 1060px)/2));margin-right:0;padding:15px 12px 22px;border-width:6px;border-top-width:4px}
.rack-hint{text-align:center;margin:8px 0 0;color:var(--muted);font-size:.72rem}.classic-table .rack-hint{color:#5e6c64}
@media(max-width:520px){.hand-tiles,.match-panel.classic-table .hand-tiles{grid-template-columns:repeat(15,40px);grid-template-rows:repeat(2,57px);width:682px;max-width:calc(100% - 20px);margin-left:0;padding:12px 8px 19px;border-width:5px}.rack-slot{width:40px;height:57px}.hand-tiles .tile{width:40px;height:57px;font-size:1.7rem}.rack-hint{font-size:.66rem}}

/* Okey ıstakası: tek sıra, kontrollü örtüşme ve dar ekranlarda ölçekleme. */
.hand-tiles,.match-panel.classic-table .hand-tiles{display:flex;flex-wrap:nowrap;gap:0;overflow:hidden;width:100%;max-width:100%;box-sizing:border-box}
.hand-tiles .rack-slot{flex:1 1 0;min-width:0;width:auto;height:clamp(47px,8vw,61px);border:0;background:transparent}
.hand-tiles .tile{width:calc(100% + 8px);max-width:44px;height:100%;margin-right:-8px;font-size:clamp(1.05rem,3vw,1.7rem)}
@media(max-width:520px){.hand-tiles,.match-panel.classic-table .hand-tiles{display:flex;grid-template-columns:none;grid-template-rows:none;width:100%;max-width:100%;margin-left:0;padding:10px 7px 16px}.hand-tiles .rack-slot{width:auto;height:clamp(45px,15vw,57px)}.hand-tiles .tile{width:calc(100% + 6px);margin-right:-6px;font-size:clamp(1rem,5vw,1.45rem)}}

.hand-tiles .rack-slot{position:relative}.hand-tiles .rack-slot.rack-group-selected::after,.hand-tiles .rack-slot.rack-drop-preview::after{content:"";position:absolute;inset:1px;pointer-events:none;border:2px solid rgba(255,214,90,.9);border-radius:6px;z-index:5}.hand-tiles .rack-slot.rack-drop-preview::after{border-color:#59d69b;background:rgba(89,214,155,.12)}