/* Number Cages Specific Styles */

/* Cage Borders */
.puzzle-cell.b-t {
    border-top: 3px solid var(--text-primary) !important;
}

.puzzle-cell.b-b {
    border-bottom: 3px solid var(--text-primary) !important;
}

.puzzle-cell.b-l {
    border-left: 3px solid var(--text-primary) !important;
}

.puzzle-cell.b-r {
    border-right: 3px solid var(--text-primary) !important;
}

/* .puzzle-cell.cage-active uses common run-highlight if updated, or specialized override below */
.puzzle-cell.cage-active {
    background-color: rgba(255, 107, 107, 0.15) !important;
    z-index: 8;
}

/* Cage Clue */
.cage-clue {
    position: absolute;
    top: 2px;
    left: 2px;
    font-size: 11px;
    font-family: var(--fontH);
    font-weight: 400;
    color: var(--text-primary);
    opacity: 0.85;
    z-index: 2;
    line-height: 1;
    pointer-events: none;
}

/* Mobile Adjustments for Clues */
@media (max-width: 600px) {
    .cage-clue {
        font-size: clamp(8px, 4cqi, 11px);
    }

    .puzzle-cell.b-t {
        border-top-width: 2px !important;
    }

    .puzzle-cell.b-b {
        border-bottom-width: 2px !important;
    }

    .puzzle-cell.b-l {
        border-left-width: 2px !important;
    }

    .puzzle-cell.b-r {
        border-right-width: 2px !important;
    }
}

/* Cage Background Colors */
.puzzle-cell.cage-c0,
.puzzle-cell.cage-c1,
.puzzle-cell.cage-c2,
.puzzle-cell.cage-c3,
.puzzle-cell.cage-c4 {
    /* Currently all same background, but kept for extensibility */
    background: var(--bg-primary);
}