/* FreeCell — Additional Styles */

/* Top row: free cells left, foundations right */
.freecell-top-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 12px;
    gap: 16px;
}

.freecell-cells,
.freecell-foundations {
    display: flex;
    gap: 6px;
}

/* 8-column tableau */
.freecell-tableau {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 4px;
    padding: 10px 8px;
}

/* Slightly smaller cards for 8 cols */
#freecell-game {
    --syv-card-w: 80px;
    --syv-card-h: 115px;
    --syv-stack-offset: 22px;
}

#freecell-game .syvkabale-card,
#freecell-game .syvkabale-slot {
    width: var(--syv-card-w);
    height: var(--syv-card-h);
}

@media (max-width: 700px) {
    #freecell-game {
        --syv-card-w: 48px;
        --syv-card-h: 72px;
        --syv-stack-offset: 17px;
    }
    #freecell-game .syvkabale-card-center { font-size: 16px; }
    #freecell-game .syvkabale-card-rank { font-size: 10px; }
    #freecell-game .syvkabale-card-suit-small { font-size: 8px; }
    .freecell-cells, .freecell-foundations { gap: 3px; }
    .freecell-tableau { gap: 2px; padding: 6px 4px; }
    .freecell-top-row { padding: 6px 4px; gap: 8px; }
}