/*
 * QueenK Development Crossword Territory
 * ========================================
 *
 * The yellow editor frame is the containing block.
 *
 * The physical crossword matrix is an ordinary absolute child
 * pinned to local coordinate 0,0.
 *
 * Resizing the territory does NOT reposition the matrix.
 */


.queenk-layout-debug
.queenk-layout-frame.queenk-dev-crossword-territory {
    /*
     * layout-overlay owns the actual frame geometry.
     *
     * The existing fixed positioning is retained because this
     * editor operates in viewport coordinates.
     */
    position:
        fixed;

    /*
     * Establish an isolated layout containing block.
     */
    contain:
        layout;

    /*
     * Do not clip the matrix or editor handles while debugging.
     */
    overflow:
        visible;
}


/*
 * Physical 20 x 12 crossword matrix.
 *
 * IMPORTANT:
 * Its dimensions come from crossword-fixed-grid.css.
 */
.queenk-layout-debug
.queenk-dev-crossword-territory
> #answer-area.crossword-fixed-grid.queenk-dev-crossword-hosted {
    position:
        absolute !important;

    left:
        0 !important;

    top:
        0 !important;

    right:
        auto !important;

    bottom:
        auto !important;

    display:
        grid !important;

    width:
        max-content !important;

    height:
        max-content !important;

    max-width:
        none !important;

    max-height:
        none !important;

    margin:
        0 !important;

    transform:
        none !important;

    justify-content:
        start !important;

    align-content:
        start !important;

    justify-self:
        auto !important;

    align-self:
        auto !important;

    overflow:
        visible !important;

    z-index:
        1;
}


/*
 * Editor chrome always remains above the matrix.
 */
.queenk-layout-debug
.queenk-dev-crossword-territory
> .queenk-layout-frame__title {
    z-index:
        100;
}


.queenk-layout-debug
.queenk-dev-crossword-territory
> .queenk-layout-resize {
    z-index:
        100;
}
