/* /Components/TicTacToeBoard.razor.rz.scp.css */
.tic-board[b-xp43g9sf7x] {
    /* center the board block horizontally */
    margin: 0 auto;
}

.tic-square[b-xp43g9sf7x] {
    /* ensure buttons fill each grid cell and stay visually square */
    width: 100%;
    height: 100%;
    padding: 0;
    font-size: 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
/* /Pages/EscapeTheLab.razor.rz.scp.css */
/* Intro Screen */
.intro-wrapper[b-otuh1syyrr] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    position: relative;
}

.intro-card[b-otuh1syyrr] {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border: none;
}

.game-title[b-otuh1syyrr] {
    color: #667eea;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
    font-weight: bold;
}

.btn-game[b-otuh1syyrr] {
    margin: 10px;
    padding: 12px 30px;
    font-size: 1.1rem;
    border-radius: 25px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

    .btn-game:hover[b-otuh1syyrr] {
        transform: translateY(-2px);
        box-shadow: 0 6px 12px rgba(0,0,0,0.3);
    }

.intro-emojis[b-otuh1syyrr] {
    position: absolute;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
}

    .intro-emojis span[b-otuh1syyrr] {
        position: absolute;
        font-size: 3rem;
        animation: float-b-otuh1syyrr 3s ease-in-out infinite;
    }

.emoji-stack[b-otuh1syyrr] {
    top: 20%;
    left: 15%;
}

.helicopter[b-otuh1syyrr] {
    animation: fly-b-otuh1syyrr 15s linear infinite;
}

.lab[b-otuh1syyrr] {
    margin-left: -40px;
}

.person[b-otuh1syyrr] {
    top: 60%;
    right: 20%;
    animation-delay: 1s;
}

@keyframes float-b-otuh1syyrr {
    0%, 100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-15px);
    }
}

@keyframes fly-b-otuh1syyrr {
    0% {
        transform: translateX(-100vw);
    }

    100% {
        transform: translateX(100vw);
    }
}

/* Stats Display */
.stats-container[b-otuh1syyrr] {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
    padding: 10px;
}

.stat-card[b-otuh1syyrr] {
    background: white;
    border-radius: 15px;
    padding: 12px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    transition: transform 0.2s ease;
}

    .stat-card:hover[b-otuh1syyrr] {
        transform: translateY(-2px);
    }

.score-card[b-otuh1syyrr] {
    background: linear-gradient(135deg, #ffeaa7 0%, #fdcb6e 100%);
}

.level-card[b-otuh1syyrr] {
    background: linear-gradient(135deg, #74b9ff 0%, #0984e3 100%);
    color: white;
}

.time-card[b-otuh1syyrr] {
    background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%);
    color: white;
}

.powerup-card[b-otuh1syyrr] {
    background: linear-gradient(135deg, #fd79a8 0%, #e84393 100%);
    color: white;
}

.stat-icon[b-otuh1syyrr] {
    font-size: 2rem;
}

.stat-content[b-otuh1syyrr] {
    display: flex;
    flex-direction: column;
}

.stat-label[b-otuh1syyrr] {
    font-size: 0.75rem;
    opacity: 0.8;
    font-weight: 600;
}

.stat-value[b-otuh1syyrr] {
    font-size: 1.2rem;
    font-weight: bold;
}

.combo-badge[b-otuh1syyrr] {
    font-size: 0.9rem;
    font-weight: bold;
    animation: bounce-b-otuh1syyrr 0.5s ease infinite;
}

.message-box[b-otuh1syyrr] {
    border-radius: 15px;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
    margin: 10px auto;
    max-width: 600px;
}

/* Game Board */
.game-board-container[b-otuh1syyrr] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 20px;
    padding: 20px;
    margin: 20px auto;
    max-width: fit-content;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

.board[b-otuh1syyrr] {
    display: grid;
    grid-template-columns: repeat(14, 46px);
    gap: 4px;
    padding: 10px;
    background: rgba(255,255,255,0.1);
    border-radius: 15px;
}

.cell[b-otuh1syyrr] {
    width: 46px;
    height: 46px;
    font-size: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
    border-radius: 8px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

    .cell:hover[b-otuh1syyrr] {
        transform: scale(1.05);
    }

.player-cell[b-otuh1syyrr] {
    background: linear-gradient(135deg, #ffeaa7 0%, #fdcb6e 100%);
    animation: glow-player-b-otuh1syyrr 1.5s ease-in-out infinite alternate;
}

.scientist-cell[b-otuh1syyrr] {
    background: linear-gradient(135deg, #ff7675 0%, #d63031 100%);
}

.pot-highlight[b-otuh1syyrr] {
    background: linear-gradient(135deg, #ffeaa7 0%, #fdcb6e 100%);
    animation: glow-b-otuh1syyrr 1.5s ease-in-out infinite alternate;
}

.powerup-cell[b-otuh1syyrr] {
    animation: pulse-b-otuh1syyrr 1s ease-in-out infinite;
    background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%);
}

@keyframes glow-b-otuh1syyrr {
    from {
        box-shadow: 0 0 10px #ffeaa7, 0 0 20px #fdcb6e;
    }

    to {
        box-shadow: 0 0 20px #fdcb6e, 0 0 30px #ff9f1a;
    }
}

@keyframes glow-player-b-otuh1syyrr {
    from {
        box-shadow: 0 0 10px #74b9ff, 0 0 20px #0984e3;
    }

    to {
        box-shadow: 0 0 20px #0984e3, 0 0 30px #6c5ce7;
    }
}

.cell-shake[b-otuh1syyrr] {
    animation: shake-b-otuh1syyrr 0.3s ease;
}

@keyframes shake-b-otuh1syyrr {
    0%, 100% {
        transform: translate(0, 0);
    }

    25% {
        transform: translate(-2px, 2px);
    }

    75% {
        transform: translate(2px, -2px);
    }
}

/* Controls */
.controls-container[b-otuh1syyrr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin: 20px 0;
}

.controls-row[b-otuh1syyrr] {
    display: flex;
    gap: 10px;
}

.btn-control[b-otuh1syyrr] {
    width: 60px;
    height: 60px;
    font-size: 1.5rem;
    border-radius: 12px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    transition: all 0.2s ease;
}

    .btn-control:hover[b-otuh1syyrr] {
        transform: translateY(-3px);
        box-shadow: 0 6px 12px rgba(0,0,0,0.3);
    }

    .btn-control:active[b-otuh1syyrr] {
        transform: translateY(0);
    }

.btn-up[b-otuh1syyrr] {
    margin-bottom: 5px;
}

/* Inventory Section */
.inventory-section[b-otuh1syyrr] {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
    margin: 20px;
}

.inventory-card[b-otuh1syyrr] {
    background: white;
    border-radius: 15px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    padding: 15px;
    min-width: 300px;
}

.inventory-header[b-otuh1syyrr] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
    margin-bottom: 15px;
}

    .inventory-header h3[b-otuh1syyrr] {
        margin: 0;
        font-size: 1.2rem;
    }

.equipment-slots[b-otuh1syyrr] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 15px;
}

.equip-slot[b-otuh1syyrr] {
    width: 50px;
    height: 50px;
    font-size: 1.5rem;
    border: 3px solid #ddd;
    border-radius: 10px;
    background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
    transition: all 0.3s ease;
    cursor: pointer;
}

    .equip-slot:hover[b-otuh1syyrr] {
        transform: scale(1.1);
        border-color: #667eea;
    }

.equipped-active[b-otuh1syyrr] {
    border-color: #00b894 !important;
    border-width: 4px !important;
    box-shadow: 0 0 15px rgba(0, 184, 148, 0.5);
}

.weapon-display[b-otuh1syyrr] {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 10px;
}

.weapon-icon[b-otuh1syyrr] {
    font-size: 2rem;
}

.btn-weapon[b-otuh1syyrr] {
    background: linear-gradient(135deg, #00b894 0%, #00cec9 100%);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 10px;
    font-weight: bold;
    transition: all 0.3s ease;
    box-shadow: 0 3px 8px rgba(0,0,0,0.2);
}

    .btn-weapon:hover[b-otuh1syyrr] {
        transform: translateY(-2px);
        box-shadow: 0 5px 12px rgba(0,0,0,0.3);
    }

.backpack-button-container[b-otuh1syyrr] {
    display: flex;
    justify-content: center;
    padding: 20px;
}

.btn-backpack[b-otuh1syyrr] {
    position: relative;
    background: linear-gradient(135deg, #ffeaa7 0%, #fdcb6e 100%);
    border: none;
    width: 100px;
    height: 100px;
    border-radius: 20px;
    font-size: 3rem;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

    .btn-backpack:hover[b-otuh1syyrr] {
        transform: scale(1.1) rotate(5deg);
    }

.backpack-icon[b-otuh1syyrr] {
    display: block;
}

.item-count[b-otuh1syyrr] {
    position: absolute;
    top: 5px;
    right: 5px;
    background: #d63031;
    color: white;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    font-weight: bold;
}

/* Modals */
.backpack-modal[b-otuh1syyrr], .recipe-modal[b-otuh1syyrr] {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    animation: fadeIn-b-otuh1syyrr 0.3s ease;
}

.backpack-content[b-otuh1syyrr], .recipe-content[b-otuh1syyrr] {
    background: white;
    padding: 20px;
    border-radius: 20px;
    min-width: 350px;
    max-width: 600px;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 10px 40px rgba(0,0,0,0.3);
    animation: slideUp-b-otuh1syyrr 0.3s ease;
}

.modal-header-custom[b-otuh1syyrr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid #667eea;
}

    .modal-header-custom h4[b-otuh1syyrr] {
        margin: 0;
        color: #667eea;
    }

.btn-close-modal[b-otuh1syyrr] {
    background: #ff7675;
    color: white;
    border: none;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    font-size: 1.2rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .btn-close-modal:hover[b-otuh1syyrr] {
        background: #d63031;
        transform: rotate(90deg);
    }

.inventory-count[b-otuh1syyrr] {
    background: linear-gradient(135deg, #74b9ff 0%, #0984e3 100%);
    color: white;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
    margin-bottom: 15px;
    font-weight: bold;
}

.backpack-items[b-otuh1syyrr] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    margin: 20px 0;
}

.backpack-item[b-otuh1syyrr] {
    width: 60px;
    height: 60px;
    font-size: 2rem;
    border: 2px solid #ddd;
    border-radius: 12px;
    background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
    cursor: pointer;
    transition: all 0.3s ease;
}

    .backpack-item:hover[b-otuh1syyrr] {
        transform: scale(1.15);
        border-color: #667eea;
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

.equipment-slots-modal[b-otuh1syyrr] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 10px;
}

.equip-slot-modal[b-otuh1syyrr] {
    width: 55px;
    height: 55px;
    font-size: 1.8rem;
    border: 3px solid #ddd;
    border-radius: 10px;
    background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
    transition: all 0.3s ease;
    cursor: pointer;
}

    .equip-slot-modal:hover[b-otuh1syyrr] {
        transform: scale(1.1);
        border-color: #667eea;
    }

.section-title[b-otuh1syyrr] {
    font-size: 1.1rem;
    font-weight: bold;
    color: #667eea;
    margin: 20px 0 10px 0;
    padding-bottom: 5px;
    border-bottom: 2px solid #667eea;
}

.weapon-list[b-otuh1syyrr] {
    list-style: none;
    padding: 0;
}

    .weapon-list li[b-otuh1syyrr] {
        padding: 8px;
        background: #f5f5f5;
        border-radius: 8px;
        margin-bottom: 5px;
        font-size: 1.1rem;
    }

.empty-message[b-otuh1syyrr] {
    text-align: center;
    color: #999;
    font-style: italic;
    padding: 20px;
}

.recipe-description[b-otuh1syyrr] {
    color: #666;
    margin-bottom: 20px;
}

.recipe-ingredients[b-otuh1syyrr] {
    background: #f5f5f5;
    padding: 15px;
    border-radius: 12px;
}

    .recipe-ingredients ul[b-otuh1syyrr] {
        margin: 10px 0 0 0;
        padding-left: 20px;
    }

    .recipe-ingredients li[b-otuh1syyrr] {
        padding: 5px 0;
        font-size: 1.05rem;
    }

/* Animations */
.pulse-animation[b-otuh1syyrr] {
    animation: pulse-b-otuh1syyrr 1s ease-in-out infinite;
}

@keyframes pulse-b-otuh1syyrr {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.05);
        opacity: 0.9;
    }
}

@keyframes bounce-b-otuh1syyrr {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }
}

@keyframes fadeIn-b-otuh1syyrr {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideUp-b-otuh1syyrr {
    from {
        transform: translateY(50px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Responsive */
@media (max-width: 768px) {
    .board[b-otuh1syyrr] {
        grid-template-columns: repeat(14, 38px);
        gap: 3px;
    }

    .cell[b-otuh1syyrr] {
        width: 38px;
        height: 38px;
        font-size: 22px;
    }

    .game-board-container[b-otuh1syyrr] {
        padding: 10px;
    }

    .stats-container[b-otuh1syyrr] {
        gap: 8px;
    }

    .stat-card[b-otuh1syyrr] {
        padding: 8px 12px;
    }
}
/* /Pages/GameMaker-line.razor.rz.scp.css */
.gm-code-app[b-b1pazsu7xq] {
    height: 85vh;
    min-height: 570px;
    display: flex;
    flex-direction: column;
    font-family: Segoe UI, Arial, sans-serif;
    color: #263342;
}

    .gm-code-app .gm-header[b-b1pazsu7xq] {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
        padding: 9px 12px;
        background: #f8fafc;
        border: 1px solid #dce3eb;
        border-radius: 8px 8px 0 0;
    }

    .gm-code-app .gm-project-select[b-b1pazsu7xq] {
        width: 175px;
    }

    .gm-code-app .gm-status[b-b1pazsu7xq] {
        flex: 1;
        text-align: right;
        font-size: 12px;
        color: #64748b;
    }

    .gm-code-app .gm-layout[b-b1pazsu7xq] {
        flex: 1;
        min-height: 0;
        display: flex;
        gap: 10px;
        padding-top: 10px;
    }

    .gm-code-app .gm-panel[b-b1pazsu7xq] {
        background: #fff;
        border: 1px solid #dee2e6;
        border-radius: 8px;
        padding: 10px;
        overflow: auto;
    }

    .gm-code-app .gm-left[b-b1pazsu7xq] {
        width: 260px;
        min-width: 225px;
        flex-shrink: 0;
    }

    .gm-code-app .gm-center[b-b1pazsu7xq] {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        border: 1px solid #dee2e6;
        border-radius: 8px;
    }

    .gm-code-app .gm-sidebar-tabs[b-b1pazsu7xq] {
        display: flex;
        gap: 5px;
        border-bottom: 1px solid #dce3eb;
        padding-bottom: 8px;
    }

    .gm-code-app .gm-sidebar-tab[b-b1pazsu7xq] {
        flex: 1;
        border: 0;
        border-radius: 5px;
        background: transparent;
        padding: 8px;
        font-size: 13px;
        color: #64748b;
    }

        .gm-code-app .gm-sidebar-tab.active[b-b1pazsu7xq] {
            background: #dbeafe;
            color: #1d4ed8;
            font-weight: 600;
        }

    .gm-code-app .gm-section-title[b-b1pazsu7xq] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 14px 0 6px;
        color: #64748b;
        font-size: 12px;
        font-weight: 600;
        text-transform: uppercase;
    }

    .gm-code-app .gm-nav[b-b1pazsu7xq] {
        padding: 7px 9px;
        border-radius: 5px;
        font-size: 13px;
        cursor: pointer;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

        .gm-code-app .gm-nav:hover[b-b1pazsu7xq] {
            background: #eef3ff;
        }

        .gm-code-app .gm-nav.active[b-b1pazsu7xq] {
            background: #dbeafe;
            color: #1d4ed8;
            font-weight: 600;
        }

    .gm-code-app .gm-property-editor label[b-b1pazsu7xq] {
        display: block;
        margin: 10px 0 3px;
        font-size: 12px;
        font-weight: 600;
        color: #556070;
    }

    .gm-code-app .gm-properties-actions[b-b1pazsu7xq] {
        display: flex;
        gap: 6px;
        margin-top: 15px;
        flex-wrap: wrap;
    }

/* Editor tabs */

.gm-code-tabs[b-b1pazsu7xq] {
    display: flex;
    align-items: stretch;
    overflow-x: auto;
    background: #f1f5f9;
    border-bottom: 1px solid #cbd5e1;
    min-height: 40px;
}

.gm-code-tab[b-b1pazsu7xq] {
    flex-shrink: 0;
    padding: 9px 15px;
    border: 0;
    border-right: 1px solid #dce3eb;
    background: transparent;
    color: #64748b;
    font-size: 12px;
    white-space: nowrap;
}

    .gm-code-tab:hover[b-b1pazsu7xq] {
        background: #e2e8f0;
    }

    .gm-code-tab.active[b-b1pazsu7xq] {
        background: #192333;
        color: #fff;
        border-top: 2px solid #60a5fa;
    }

/* Editor toolbar */

.gm-code-toolbar[b-b1pazsu7xq] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 12px;
    font-size: 12px;
    color: #64748b;
    background: #f8fafc;
}

    .gm-code-toolbar button[b-b1pazsu7xq] {
        margin-left: auto;
    }

/* Main code editing area */

.gm-code-workspace[b-b1pazsu7xq] {
    flex: 1;
    min-height: 0;
    display: flex;
    background: #192333;
    overflow: hidden;
    color: #e2e8f0;
}

.gm-code-line-numbers[b-b1pazsu7xq] {
    flex-shrink: 0;
    min-width: 54px;
    padding: 14px 12px;
    background: #151e2b;
    border-right: 1px solid #334155;
    color: #64748b;
    text-align: right;
    font: 13px/21px Consolas, monospace;
    user-select: none;
    overflow: hidden;
}

.gm-code-input[b-b1pazsu7xq] {
    flex: 1;
    width: 100%;
    min-width: 0;
    height: 100%;
    padding: 14px 16px;
    border: none;
    outline: none;
    resize: none;
    background: transparent;
    color: #e2e8f0;
    font: 13px/21px Consolas, monospace;
    white-space: pre;
    overflow: auto;
    tab-size: 4;
}

    .gm-code-input[b-b1pazsu7xq]::selection {
        background: #2563eb80;
    }

.gm-code-footer[b-b1pazsu7xq] {
    display: flex;
    justify-content: space-between;
    padding: 7px 12px;
    border-top: 1px solid #dce3eb;
    background: #f8fafc;
    font-size: 11px;
    color: #64748b;
}

/* Preview modal */

.gm-code-preview-modal[b-b1pazsu7xq] {
    width: min(1100px, 96vw);
    height: min(850px, 92vh);
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 15px 55px #0006;
}

    .gm-code-preview-modal .gm-modal-header[b-b1pazsu7xq] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 16px;
        background: #f8fafc;
        border-bottom: 1px solid #dce3eb;
    }

.gm-code-preview[b-b1pazsu7xq] {
    flex: 1;
    width: 100%;
    border: 0;
    background: white;
}

.gm-modal-backdrop[b-b1pazsu7xq] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    background: #0009;
}

@media (max-width: 750px) {
    .gm-code-app[b-b1pazsu7xq] {
        height: auto;
        min-height: 80vh;
    }

        .gm-code-app .gm-layout[b-b1pazsu7xq] {
            flex-direction: column;
        }

        .gm-code-app .gm-left[b-b1pazsu7xq] {
            width: 100%;
            max-height: 240px;
        }

        .gm-code-app .gm-center[b-b1pazsu7xq] {
            min-height: 570px;
        }

        .gm-code-app .gm-status[b-b1pazsu7xq] {
            text-align: left;
        }
}

.gm-indent[b-b1pazsu7xq] {
    padding-left: 24px;
}

.gm-monaco[b-b1pazsu7xq] {
    flex: 1;
    min-width: 0;
    min-height: 0;
    width: 100%;
    height: 100%;
}
/* /Pages/GameMaker.razor.rz.scp.css */
.gm-app[b-jl6t16h74b] {
    height: 85vh;
    min-height: 570px;
    display: flex;
    flex-direction: column;
    font-family: Segoe UI,Arial,sans-serif;
    color: #263342
}

.gm-header[b-jl6t16h74b] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    background: #f8fafc;
    border: 1px solid #dce3eb;
    border-radius: 8px 8px 0 0;
    flex-wrap: wrap
}

    .gm-header strong[b-jl6t16h74b] {
        margin-right: 6px;
        white-space: nowrap
    }

.gm-project-select[b-jl6t16h74b] {
    width: 175px
}

.gm-status[b-jl6t16h74b] {
    font-size: 12px;
    color: #64748b;
    flex: 1;
    text-align: right
}

.gm-layout[b-jl6t16h74b] {
    flex: 1;
    min-height: 0;
    display: flex;
    gap: 10px;
    padding-top: 10px
}

.gm-panel[b-jl6t16h74b] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 2px 6px #0000000a;
    padding: 10px;
    overflow: auto
}

.gm-left[b-jl6t16h74b] {
    width: 260px;
    min-width: 225px;
    flex-shrink: 0
}

.gm-center[b-jl6t16h74b] {
    min-width: 0;
    flex: 1;
    border: 1px solid #dee2e6;
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    overflow: hidden;
    background: #fff
}

.gm-sidebar-tabs[b-jl6t16h74b] {
    display: flex;
    gap: 5px;
    border-bottom: 1px solid #dce3eb;
    margin: -4px -4px 12px;
    padding: 4px
}

.gm-sidebar-tab[b-jl6t16h74b] {
    border: 0;
    background: transparent;
    padding: 8px 11px;
    font-size: 13px;
    color: #64748b;
    border-radius: 5px;
    flex: 1
}

    .gm-sidebar-tab.active[b-jl6t16h74b] {
        background: #dbeafe;
        color: #1d4ed8;
        font-weight: 600
    }

.gm-section-title[b-jl6t16h74b] {
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    color: #64748b;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 16px 0 5px
}

    .gm-section-title button[b-jl6t16h74b] {
        padding: 0
    }

.gm-nav[b-jl6t16h74b] {
    padding: 6px 8px;
    font-size: 13px;
    border-radius: 5px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

    .gm-nav:hover[b-jl6t16h74b] {
        background: #eef3ff
    }

    .gm-nav.active[b-jl6t16h74b] {
        background: #dbeafe;
        color: #1d4ed8;
        font-weight: 600
    }

.gm-palette[b-jl6t16h74b] {
    display: flex;
    gap: 6px;
    padding: 9px;
    background: #f8fafc;
    border-bottom: 1px solid #dce3eb;
    overflow: auto;
    flex-wrap: wrap;
    max-height: 155px;
    align-content: flex-start
}

.gm-search[b-jl6t16h74b] {
    width: 170px;
    height: 32px
}

.gm-tool[b-jl6t16h74b] {
    border: 1px solid #cbd5e1;
    border-radius: 5px;
    background: white;
    padding: 5px 9px;
    font-size: 12px;
    cursor: grab
}

    .gm-tool:hover[b-jl6t16h74b] {
        background: #e7f1ff
    }

.gm-custom-tool[b-jl6t16h74b] {
    border-color: #a78bfa;
    background: #f5f3ff
}

.gm-canvas-scroll[b-jl6t16h74b] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    background: #e9eef4;
    padding: 22px
}

.gm-canvas[b-jl6t16h74b] {
    position: relative;
    background-color: #fff;
    background-image: linear-gradient(#edf1f5 1px,transparent 1px),linear-gradient(90deg,#edf1f5 1px,transparent 1px);
    background-size: 20px 20px;
    box-shadow: 0 2px 12px #0002;
    flex-shrink: 0
}

.gm-element[b-jl6t16h74b] {
    position: absolute;
    box-sizing: border-box;
    border: 1px solid #aeb9c8;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: move;
    overflow: visible;
    word-break: break-word;
    text-align: center;
    padding: 3px
}

.gm-element-selected[b-jl6t16h74b] {
    outline: 2px solid #2563eb;
    outline-offset: 2px
}

.gm-resize-handle[b-jl6t16h74b] {
    position: absolute;
    right: -6px;
    bottom: -6px;
    width: 13px;
    height: 13px;
    background: #2563eb;
    border: 2px solid #fff;
    border-radius: 50%;
    cursor: nwse-resize;
    z-index: 4
}

.gm-footer[b-jl6t16h74b] {
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
    padding: 6px 10px;
    color: #64748b;
    font-size: 11px
}

.gm-property-editor label[b-jl6t16h74b] {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #556070;
    margin-top: 10px;
    margin-bottom: 3px
}

.gm-property-editor .gm-two[b-jl6t16h74b] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px
}

.gm-property-editor .form-check label[b-jl6t16h74b] {
    display: inline;
    font-weight: 400;
    margin: 0
}

.gm-properties-actions[b-jl6t16h74b] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 15px
}

.gm-logic[b-jl6t16h74b] {
    flex: 1;
    overflow: auto;
    padding: 18px
}

.gm-rule[b-jl6t16h74b] {
    max-width: 980px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #f8fafc;
    padding: 12px;
    margin-bottom: 14px
}

.gm-event-block[b-jl6t16h74b], .gm-action-block[b-jl6t16h74b] {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    padding: 9px;
    border-radius: 7px
}

.gm-event-block[b-jl6t16h74b] {
    background: #fef3c7
}

.gm-action-block[b-jl6t16h74b] {
    background: #dbeafe;
    margin: 6px 0 0 22px
}

    .gm-event-block strong[b-jl6t16h74b], .gm-action-block strong[b-jl6t16h74b] {
        font-size: 12px;
        min-width: 45px
    }

.gm-rule select[b-jl6t16h74b] {
    width: auto;
    min-width: 120px;
    max-width: 210px
}

.gm-rule input[b-jl6t16h74b] {
    width: 180px
}

.gm-asset-row[b-jl6t16h74b] {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 9px;
    border-bottom: 1px solid #eee
}

    .gm-asset-row span[b-jl6t16h74b] {
        flex: 1;
        color: #64748b;
        font-size: 12px
    }

.gm-modal-backdrop[b-jl6t16h74b] {
    position: fixed;
    inset: 0;
    background: #0009;
    z-index: 2000;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px
}

.gm-modal[b-jl6t16h74b] {
    background: #fff;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    max-width: 98vw;
    max-height: 96vh;
    box-shadow: 0 15px 55px #0006;
    overflow: hidden
}

.gm-modal-header[b-jl6t16h74b] {
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: space-between;
    padding: 12px 16px;
    background: #f8fafc;
    border-bottom: 1px solid #dce3eb
}

.gm-modal-body[b-jl6t16h74b] {
    overflow: auto;
    background: #dce4ee;
    padding: 20px
}

.gm-run-canvas[b-jl6t16h74b] {
    background-image: none
}

.gm-runtime-element[b-jl6t16h74b] {
    cursor: pointer
}

.gm-modal-message[b-jl6t16h74b] {
    padding: 12px 16px;
    background: #dbeafe;
    display: flex;
    justify-content: space-between;
    gap: 10px
}

@media(max-width:750px) {
    .gm-app[b-jl6t16h74b] {
        height: auto;
        min-height: 80vh
    }

    .gm-layout[b-jl6t16h74b] {
        flex-direction: column
    }

    .gm-left[b-jl6t16h74b] {
        width: 100%;
        max-height: 240px
    }

    .gm-center[b-jl6t16h74b] {
        min-height: 570px
    }

    .gm-status[b-jl6t16h74b] {
        text-align: left
    }

    .gm-palette[b-jl6t16h74b] {
        max-height: 130px
    }
}

/* Pixel-art creator and contextual blocks */
.gm-image-editor[b-jl6t16h74b] {
    max-width: 100%;
}

.gm-image-toolbar[b-jl6t16h74b] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 12px 0;
}

    .gm-image-toolbar .form-select[b-jl6t16h74b] {
        max-width: 170px;
    }

    .gm-image-toolbar .form-control[b-jl6t16h74b] {
        max-width: 220px;
    }

.gm-pixel-board[b-jl6t16h74b] {
    display: grid;
    grid-template-columns: repeat(var(--gm-grid-size), minmax(0,1fr));
    width: min(640px,90%);
    aspect-ratio: 1;
    border: 1px solid #9ca3af;
    background-color: white;
    background-image: linear-gradient(45deg,#eee 25%,transparent 25%),linear-gradient(-45deg,#eee 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#eee 75%),linear-gradient(-45deg,transparent 75%,#eee 75%);
    background-size: 18px 18px;
    background-position: 0 0,0 9px,9px -9px,-9px 0;
    user-select: none;
    touch-action: none;
}

.gm-pixel-cell[b-jl6t16h74b] {
    min-width: 0;
    min-height: 0;
    border: 1px solid rgba(120,120,120,.13);
    cursor: crosshair;
}

.gm-block-summary[b-jl6t16h74b] {
    font-size: .8rem;
    font-weight: 600;
    border-left: 3px solid #6f42c1;
    padding: 7px 11px;
    margin-top: 10px;
    background: #f7f2ff;
    overflow-wrap: anywhere;
}

    .gm-block-summary div[b-jl6t16h74b] {
        margin-top: 3px;
        color: #285c3d;
    }

.gm-action-color[b-jl6t16h74b] {
    width: 40px;
    min-width: 40px;
    height: 31px;
    padding: 2px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.gm-action-value[b-jl6t16h74b] {
    min-width: 100px;
}

.gm-check-line[b-jl6t16h74b] {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-top: 10px;
}
/* /Pages/Index.razor.rz.scp.css */
max-width:50px;[b-jo6m5v4hb9]
/* /Pages/IndexName.razor.rz.scp.css */
max-width:50px;[b-sbqg6f4n65]
/* /Pages/Jewel.razor.rz.scp.css */
.jewel-layout[b-sinw2kll00] {
    display: grid;
    grid-template-columns: minmax(0, 490px) 230px;
    align-items: start;
    justify-content: center;
    gap: 14px;
    max-width: 780px;
    margin: 12px auto;
    color: #f8fafc;
    font-family: system-ui, sans-serif;
}

.jewel-game[b-sinw2kll00], .game-sidebar[b-sinw2kll00] {
    min-width: 0;
    margin: 20px;
    padding: 12px;
    border: 1px solid #3d527a;
    border-radius: 18px;
    background: linear-gradient(145deg, #172744, #081223);
    box-shadow: 0 16px 40px #0004;
}

.game-title[b-sinw2kll00] {
    text-align: center;
    color: #f8d878;
    font-size: clamp(20px, 3vw, 28px);
    letter-spacing: 2px;
    font-weight: 900;
    text-shadow: 0 0 16px #eab30855;
}

.phase-label[b-sinw2kll00] {
    text-align: center;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 1.6px;
    color: #9bdcf9;
    margin: 9px 0 18px;
}

.board-frame[b-sinw2kll00] {
    padding: 8px;
    border: 3px solid #8096b5;
    border-radius: 14px;
    background: #081122;
    box-shadow: inset 0 2px 9px #0009, 0 10px 20px #0005;
}

.jewel-board[b-sinw2kll00] {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 8px;
    background: #071227;
}

.board-background[b-sinw2kll00] {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    grid-template-rows: repeat(8, minmax(0, 1fr));
}

.board-slot[b-sinw2kll00] {
    display: block;
    width: auto;
    min-width: 0;
    min-height: 0;
    margin: 2px;
    padding: 0;
    border-radius: 7px;
    border: 1px solid #6a88aa49;
    background: linear-gradient(145deg, #253954, #111d34 68%, #091224);
    box-shadow: inset 0 2px 2px #ffffff0c, inset 0 -3px 5px #0008;
}

    .board-slot:disabled[b-sinw2kll00] {
        opacity: 1;
    }

    .board-slot.placeable[b-sinw2kll00] {
        cursor: pointer;
        border: 1px dashed #fce58a;
        background: #2b4260;
    }

        .board-slot.placeable:hover[b-sinw2kll00] {
            background: #506684;
            box-shadow: 0 0 12px #facc1580;
        }

.gem-piece[b-sinw2kll00] {
    position: absolute;
    width: 12.5%;
    height: 12.5%;
    box-sizing: border-box;
    border: 0;
    margin: 0;
    padding: 5px;
    display: grid;
    place-items: center;
    background: transparent;
    cursor: pointer;
    z-index: 1;
    transition: top 350ms cubic-bezier(.22,.7,.25,1), left 230ms ease;
    -webkit-tap-highlight-color: transparent;
}

    .gem-piece[b-sinw2kll00]::before {
        content: "";
        position: absolute;
        inset: 2px;
        border-radius: 9px;
        border: 1px solid #ffffff19;
        background: linear-gradient(145deg, #ffffff15, #ffffff04 50%, #00000029);
    }

    .gem-piece:disabled[b-sinw2kll00] {
        opacity: 1;
        cursor: default;
    }

    .gem-piece.selected[b-sinw2kll00]::before {
        outline: 3px solid #fde68a;
        outline-offset: -2px;
        background: #facc1530;
    }

.gem-svg[b-sinw2kll00] {
    position: relative;
    width: 96%;
    height: 96%;
    overflow: visible;
    filter: drop-shadow(0 4px 3px #0009);
    transition: transform 180ms ease, filter 180ms ease;
}

.gem-piece:not(:disabled):hover .gem-svg[b-sinw2kll00] {
    transform: scale(1.09);
    filter: drop-shadow(0 0 7px #fff7);
}

.gem-piece.selected .gem-svg[b-sinw2kll00] {
    transform: scale(1.09);
}

.kind-0[b-sinw2kll00] {
    --deep: #700b29;
    --dark: #b31440;
    --base: #ec2858;
    --light: #ff7999;
    --bright: #ffd4df;
    --edge: #ffa0b8;
}

.kind-1[b-sinw2kll00] {
    --deep: #112b76;
    --dark: #194cb1;
    --base: #2678ed;
    --light: #75c0ff;
    --bright: #d0f0ff;
    --edge: #9abaff;
}

.kind-2[b-sinw2kll00] {
    --deep: #064c35;
    --dark: #08734b;
    --base: #10ac6d;
    --light: #5deab0;
    --bright: #caffea;
    --edge: #8ceac1;
}

.kind-3[b-sinw2kll00] {
    --deep: #7d3b0a;
    --dark: #b06a0d;
    --base: #f0a719;
    --light: #ffda67;
    --bright: #fff2ae;
    --edge: #ffdf85;
}

.kind-4[b-sinw2kll00] {
    --deep: #451174;
    --dark: #6a2fa5;
    --base: #a449df;
    --light: #d694ff;
    --bright: #f2daff;
    --edge: #dda3ff;
}

.kind-5[b-sinw2kll00] {
    --deep: #12596f;
    --dark: #168ea9;
    --base: #2cc6df;
    --light: #9aeafa;
    --bright: #effdff;
    --edge: #b5f2fc;
}

.facet-outline[b-sinw2kll00] {
    fill: var(--deep);
    stroke: var(--edge);
    stroke-width: 2;
}

.facet-top[b-sinw2kll00] {
    fill: var(--bright);
}

.facet-upper-left[b-sinw2kll00] {
    fill: var(--light);
}

.facet-upper-right[b-sinw2kll00] {
    fill: var(--base);
}

.facet-left[b-sinw2kll00] {
    fill: var(--dark);
}

.facet-right[b-sinw2kll00] {
    fill: var(--deep);
}

.facet-lower-left[b-sinw2kll00] {
    fill: var(--base);
}

.facet-lower-right[b-sinw2kll00] {
    fill: var(--dark);
}

.facet-bottom[b-sinw2kll00] {
    fill: var(--dark);
}

.facet-base[b-sinw2kll00] {
    fill: var(--base);
}

.facet-center-top[b-sinw2kll00] {
    fill: var(--light);
}

.facet-center-left[b-sinw2kll00] {
    fill: var(--base);
}

.facet-center-right[b-sinw2kll00] {
    fill: var(--dark);
}

.facet-center-bottom[b-sinw2kll00] {
    fill: var(--light);
    opacity: .75;
}

.gem-glint[b-sinw2kll00] {
    fill: white;
    opacity: .85;
}

.gem-piece.special .gem-svg[b-sinw2kll00] {
    filter: brightness(1.2) drop-shadow(0 0 7px #fef08a);
}

.gem-piece.special:not(.removing) .gem-svg[b-sinw2kll00] {
    animation: gem-pulse-b-sinw2kll00 1.8s ease-in-out infinite;
}

.gem-piece.rainbow-gem .gem-svg[b-sinw2kll00] {
    filter: saturate(2.2) drop-shadow(0 0 11px #ffffff);
    animation: rainbow-cycle-b-sinw2kll00 2.2s linear infinite;
}

@keyframes rainbow-cycle-b-sinw2kll00 {
    0% {
        filter: saturate(2.2) hue-rotate(0deg) drop-shadow(0 0 11px #ffffff);
    }

    100% {
        filter: saturate(2.2) hue-rotate(360deg) drop-shadow(0 0 11px #ffffff);
    }
}

.power-symbol[b-sinw2kll00] {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: clamp(16px, 2.6vw, 29px);
    color: white;
    font-weight: 1000;
    z-index: 2;
    text-shadow: 0 1px 4px #000, 0 0 9px #facc15, 0 0 4px #000;
    pointer-events: none;
}

.gem-piece.removing[b-sinw2kll00] {
    z-index: 5;
    pointer-events: none;
}

    .gem-piece.removing .gem-svg[b-sinw2kll00] {
        animation: gem-disappear-b-sinw2kll00 280ms ease-in forwards;
    }

    .gem-piece.removing[b-sinw2kll00]::after {
        content: "";
        position: absolute;
        inset: 5px;
        border-radius: 50%;
        background: #ffffffa8;
        filter: blur(10px);
        animation: glow-burst-b-sinw2kll00 280ms ease-out forwards;
    }

@keyframes gem-pulse-b-sinw2kll00 {
    0%,100% {
        filter: brightness(1.1) drop-shadow(0 0 4px #facc15);
    }

    50% {
        filter: brightness(1.55) drop-shadow(0 0 12px #fde68a);
    }
}

@keyframes gem-disappear-b-sinw2kll00 {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    40% {
        transform: scale(1.24);
        opacity: 1;
        filter: brightness(2);
    }

    100% {
        transform: scale(.1) rotate(17deg);
        opacity: 0;
    }
}

@keyframes glow-burst-b-sinw2kll00 {
    0% {
        transform: scale(.4);
        opacity: 0;
    }

    50% {
        transform: scale(1.35);
        opacity: 1;
    }

    100% {
        transform: scale(1.8);
        opacity: 0;
    }
}

.game-message[b-sinw2kll00] {
    min-height: 25px;
    margin-top: 16px;
    text-align: center;
    color: #fce08a;
    font-weight: 600;
    font-size: 13px;
}

.game-sidebar[b-sinw2kll00] {
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.sidebar-title[b-sinw2kll00] {
    text-align: center;
    color: #f7d874;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1.3px;
}

.panel-box[b-sinw2kll00] {
    padding: 12px;
    text-align: center;
    border-radius: 11px;
    background: #ffffff0b;
    border: 1px solid #ffffff17;
}

    .panel-box.compact[b-sinw2kll00] {
        padding: 8px;
    }

.panel-label[b-sinw2kll00] {
    font-size: 10px;
    color: #a8bad4;
    letter-spacing: 1.5px;
    font-weight: 800;
}

.score-value[b-sinw2kll00] {
    font-size: 32px;
    font-weight: 900;
    color: #f8d777;
}

.moves-value[b-sinw2kll00] {
    font-size: 24px;
    font-weight: 800;
}

.progress-track[b-sinw2kll00] {
    height: 11px;
    margin-top: 10px;
    border-radius: 12px;
    background: #050c19;
    border: 1px solid #536783;
    overflow: hidden;
}

.progress-fill[b-sinw2kll00] {
    height: 100%;
    background: linear-gradient(90deg, #098acd, #78e5ff);
    border-radius: inherit;
    transition: width 350ms ease;
}

.progress-text[b-sinw2kll00] {
    margin-top: 7px;
    font-size: 11px;
    color: #cbd5e1;
}

.challenge-panel[b-sinw2kll00] {
    padding: 12px;
    border: 2px solid #d7af42;
    border-radius: 12px;
    background: linear-gradient(160deg, #443416, #1a243a);
}

.challenge-title[b-sinw2kll00] {
    text-align: center;
    color: #ffe89a;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: 1px;
}

.challenge-subtitle[b-sinw2kll00] {
    margin-top: 8px;
    font-size: 11px;
    color: #e8dbb9;
    text-align: center;
}

.challenge-count[b-sinw2kll00] {
    color: #fff0b0;
    font-size: 22px;
    font-weight: 800;
    text-align: center;
    margin-top: 10px;
}

.challenge-actions[b-sinw2kll00] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
    margin-top: 13px;
}

    .challenge-actions button[b-sinw2kll00] {
        border: 1px solid #d4aa43;
        border-radius: 8px;
        padding: 9px 5px;
        background: #443b2c;
        color: #ffeaa2;
        font-weight: 700;
        font-size: 11px;
        cursor: pointer;
    }

        .challenge-actions button:hover:not(:disabled)[b-sinw2kll00] {
            background: #655331;
        }

        .challenge-actions button:disabled[b-sinw2kll00] {
            opacity: .5;
        }

.collection-help[b-sinw2kll00] {
    color: #adbed6;
    font-size: 11px;
    text-align: center;
}

.inventory-grid[b-sinw2kll00] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
}

.inventory-button[b-sinw2kll00] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-radius: 8px;
    border: 1px solid #75819b;
    padding: 6px 3px;
    background: #2b3e5b;
    color: white;
    cursor: pointer;
}

    .inventory-button:disabled[b-sinw2kll00] {
        opacity: .5;
        cursor: default;
    }

    .inventory-button.active[b-sinw2kll00] {
        border: 2px solid #facc15;
        background: #52607a;
        box-shadow: 0 0 12px #facc1566;
    }

.inventory-gem[b-sinw2kll00] {
    width: 24px;
    height: 24px;
    display: block;
    flex: 0 0 24px;
    clip-path: polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%);
    background: linear-gradient(135deg, var(--bright), var(--base) 45%, var(--deep));
    box-shadow: inset 0 0 7px #fff8;
}

.inventory-count[b-sinw2kll00] {
    font-size: 14px;
    font-weight: 800;
}

.power-legend[b-sinw2kll00] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    color: #d7e2f3;
    font-size: 11px;
}

    .power-legend > div[b-sinw2kll00] {
        display: flex;
        align-items: center;
        gap: 8px;
        background: #ffffff0c;
        padding: 7px;
        border-radius: 8px;
    }

.power-icon[b-sinw2kll00] {
    display: grid;
    place-items: center;
    min-width: 44px;
    padding: 5px;
    border-radius: 6px;
    background: #34517a;
    font-weight: 900;
    color: #ffe7a2;
}

.restart-button[b-sinw2kll00] {
    padding: 12px;
    border: 1px solid #ebc967;
    border-radius: 9px;
    background: linear-gradient(#d5a947, #967022);
    color: white;
    font-weight: 800;
    cursor: pointer;
}

    .restart-button:hover:not(:disabled)[b-sinw2kll00] {
        filter: brightness(1.13);
    }

    .restart-button:disabled[b-sinw2kll00] {
        opacity: .5;
    }

.bomb-outline[b-sinw2kll00] {
    fill: #1a1a2e;
    stroke: white;
    stroke-width: 2;
}

.bomb-core[b-sinw2kll00] {
    fill: #ff2d55;
    animation: rainbow-cycle-b-sinw2kll00 1.6s linear infinite;
}

.bomb-legend-icon[b-sinw2kll00] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #1a1a2e;
    border: 2px solid white;
}

.bomb-legend-core[b-sinw2kll00] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ff2d55;
    animation: rainbow-cycle-b-sinw2kll00 1.6s linear infinite;
}

@media (max-width: 780px) {
    .jewel-layout[b-sinw2kll00] {
        max-width: 610px;
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        margin: 10px auto;
    }

    .game-sidebar[b-sinw2kll00] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .game-sidebar > .sidebar-title[b-sinw2kll00], .collection-help[b-sinw2kll00], .inventory-grid[b-sinw2kll00], .power-legend[b-sinw2kll00], .challenge-panel[b-sinw2kll00], .restart-button[b-sinw2kll00] {
            grid-column: 1 / -1;
        }
}

@media (max-width: 460px) {
    .jewel-game[b-sinw2kll00], .game-sidebar[b-sinw2kll00] {
        padding: 10px;
    }

    .gem-piece[b-sinw2kll00] {
        padding: 2px;
    }

    .power-symbol[b-sinw2kll00] {
        font-size: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gem-piece[b-sinw2kll00], .gem-svg[b-sinw2kll00], .progress-fill[b-sinw2kll00] {
        transition: none;
    }

        .gem-piece.special:not(.removing) .gem-svg[b-sinw2kll00], .gem-piece.removing .gem-svg[b-sinw2kll00], .gem-piece.removing[b-sinw2kll00]::after {
            animation: none;
        }
}

/* Shape silhouettes also distinguish colors for color-blind accessibility. */
.inventory-button.kind-0 .inventory-gem[b-sinw2kll00] {
    clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}

.inventory-button.kind-1 .inventory-gem[b-sinw2kll00] {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.inventory-button.kind-2 .inventory-gem[b-sinw2kll00] {
    clip-path: polygon(28% 0, 72% 0, 100% 28%, 100% 72%, 72% 100%, 28% 100%, 0 72%, 0 28%);
}

.inventory-button.kind-3 .inventory-gem[b-sinw2kll00] {
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.inventory-button.kind-4 .inventory-gem[b-sinw2kll00] {
    clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
    border-radius: 48%;
}

.inventory-button.kind-5 .inventory-gem[b-sinw2kll00] {
    clip-path: circle(49% at 50% 50%);
}

/* Compact desktop board and native mouse/touch swipe controls. */
.jewel-board[b-sinw2kll00] {
    touch-action: none;
    user-select: none;
}

.gem-piece[b-sinw2kll00] {
    touch-action: none;
    user-select: none;
}

.board-slot[b-sinw2kll00] {
    touch-action: none;
}

.gem-svg[b-sinw2kll00], .power-symbol[b-sinw2kll00] {
    pointer-events: none;
}

@media (min-width: 781px) {
    .jewel-layout[b-sinw2kll00] {
        width: min(100%, 780px);
    }
}

.game-overlay[b-sinw2kll00] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.35);
    z-index: 9999;
}

.game-card[b-sinw2kll00] {
    min-width: 240px;
    border-radius: 8px;
}


/* Responsive, centered game + true right-hand sidebar on large screens. */
@media (min-width: 781px) {
    .jewel-layout[b-sinw2kll00] {
        display: grid;
        grid-template-columns: minmax(0, 490px) 250px;
        align-items: start;
        gap: 18px;
        width: min(100%, 790px);
        max-width: 790px;
        margin: 12px auto;
    }

    .jewel-game[b-sinw2kll00], .game-sidebar[b-sinw2kll00] {
        margin: 0;
    }

    .game-sidebar[b-sinw2kll00] {
        grid-column: 2;
        grid-row: 1;
    }

    .jewel-game[b-sinw2kll00] {
        grid-column: 1;
        grid-row: 1;
    }
}

/* Jewel-inspired ornate level and challenge dialog. */
.game-overlay[b-sinw2kll00] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(2, 7, 23, .76);
    backdrop-filter: blur(6px);
    z-index: 9999;
}

.jewel-dialog[b-sinw2kll00] {
    position: relative;
    width: min(100%, 445px);
    padding: 30px 28px 27px;
    overflow: hidden;
    border: 3px solid #dfbc65;
    border-radius: 22px;
    background: radial-gradient(ellipse at 50% 0%, #37599d 0%, #182c61 45%, #0b1737 100%);
    box-shadow: 0 0 0 5px #0b1c3d, 0 0 0 7px #987436, 0 24px 70px #000c, inset 0 0 35px #66a5ff24;
    color: #fff4cc;
    text-align: center;
    font-family: Georgia, 'Times New Roman', serif;
    animation: jewel-dialog-enter-b-sinw2kll00 .22s ease-out both;
}

    .jewel-dialog[b-sinw2kll00]::before, .jewel-dialog[b-sinw2kll00]::after {
        content: '✦';
        position: absolute;
        top: 13px;
        color: #e9bf67;
        font-size: 22px;
    }

    .jewel-dialog[b-sinw2kll00]::before {
        left: 17px;
    }

    .jewel-dialog[b-sinw2kll00]::after {
        right: 17px;
    }

.dialog-flourish[b-sinw2kll00] {
    color: #f0ca73;
    font-size: 20px;
    letter-spacing: 8px;
    margin-bottom: 13px;
}

.dialog-eyebrow[b-sinw2kll00] {
    font: 800 12px/1.5 system-ui, sans-serif;
    letter-spacing: 3px;
    color: #bde6ff;
}

.jewel-dialog h2[b-sinw2kll00] {
    margin: 6px 0 12px;
    color: #ffe49c;
    font-size: clamp(25px, 5vw, 35px);
    text-shadow: 0 3px 1px #5c3c17, 0 0 17px #eec45a5c;
}

.dialog-gem[b-sinw2kll00] {
    margin: 7px auto 10px;
    font-size: 43px;
    line-height: 1.1;
    color: #91edff;
    text-shadow: 0 0 14px #3ad4ff, 0 0 25px #45b9ff;
}

.jewel-dialog p[b-sinw2kll00] {
    margin: 10px 0;
    font-size: 17px;
    line-height: 1.4;
}

.jewel-dialog .dialog-hint[b-sinw2kll00] {
    color: #c7d9f2;
    font: 14px/1.5 system-ui, sans-serif;
}

.dialog-score[b-sinw2kll00] {
    padding: 12px 16px;
    background: #020c2580;
    border: 1px solid #a7bde34d;
    border-radius: 12px;
}

    .dialog-score strong[b-sinw2kll00] {
        color: #ffe08c;
        display: block;
        font: 800 28px system-ui, sans-serif;
    }

.dialog-button[b-sinw2kll00] {
    margin-top: 19px;
    min-width: 190px;
    padding: 12px 24px;
    border: 2px solid #fff1b0;
    border-radius: 24px;
    background: linear-gradient(#ffe595, #e8b44b 55%, #a96f20);
    color: #472a05;
    font: 900 15px system-ui, sans-serif;
    box-shadow: 0 3px 0 #684014, 0 5px 18px #0008;
    cursor: pointer;
}

    .dialog-button:hover[b-sinw2kll00] {
        filter: brightness(1.12);
    }

    .dialog-button:focus-visible[b-sinw2kll00] {
        outline: 3px solid #b7e8ff;
        outline-offset: 4px;
    }

    .dialog-button:disabled[b-sinw2kll00] {
        opacity: .5;
        cursor: default;
    }

@keyframes jewel-dialog-enter-b-sinw2kll00 {
    from {
        transform: scale(.92) translateY(10px);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .jewel-dialog[b-sinw2kll00] {
        animation: none;
    }
}
/* /Pages/MorseCode.razor.rz.scp.css */
.bulb[b-lfysgwgc2p] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: #ffd54f;
    margin: 0 auto;
    transition: background-color 0.1s;
}

.bulb-on[b-lfysgwgc2p] {
    background-color: #ffd54f;
    box-shadow: 0 0 40px 15px #ffe066;
}

@media (max-width: 900px) { /* stack buttons on small screens */
    .action-button[b-lfysgwgc2p] {
        border: 1px solid #5c7189;
        background: #27384a;
        color: white;
        border-radius: 7px;
        padding: 10px 15px;
        cursor: pointer;
        font-weight: 600;
        display: block;
        width: 100%;
        margin: 0 10px 10px 10px;
    }

        .action-button:hover:not(:disabled)[b-lfysgwgc2p] {
            background: #344b62;
        }

        .action-button:disabled[b-lfysgwgc2p] {
            opacity: .45;
            cursor: default;
        }

    .btn[b-lfysgwgc2p] {
        display: block;
        width: 100%;
        margin: 0 10px 10px 10px;
    }
}

.action-button[b-lfysgwgc2p] {
    border: 1px solid #5c7189;
    background: #27384a;
    color: white;
    border-radius: 7px;
    padding: 10px 15px;
    cursor: pointer;
    font-weight: 600;
}

    .action-button:hover:not(:disabled)[b-lfysgwgc2p] {
        background: #344b62;
    }

    .action-button:disabled[b-lfysgwgc2p] {
        opacity: .45;
        cursor: default;
    }

pre[b-lfysgwgc2p] {
    background: transparent;
    color: #fff;
    font-size: 0.95rem;
}
/* /Pages/TerritoryBattle.razor.rz.scp.css */
*[b-vlr8d2e5h8] {
    box-sizing: border-box;
}

.game-shell[b-vlr8d2e5h8] {
    min-height: 100vh;
    padding: 24px;
    background: radial-gradient(circle at top, #263649 0%, #131b25 45%, #0b1017 100%);
    color: #e9eef5;
    font-family: Arial, Helvetica, sans-serif;
}

.game-header[b-vlr8d2e5h8] {
    max-width: 1500px;
    margin: 0 auto 16px auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .game-header h1[b-vlr8d2e5h8] {
        margin: 0;
        font-size: 31px;
        letter-spacing: .4px;
    }

@media (max-width: 900px) {
    .game-layout[b-vlr8d2e5h8] {
        grid-template-columns: 1fr;
    }

    .game-header[b-vlr8d2e5h8] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .center-panel[b-vlr8d2e5h8] {
        min-width: 0;
    }

    .game-board[b-vlr8d2e5h8] {
        overflow-x: auto;
        max-width: 100%;
    }
}

.subtitle[b-vlr8d2e5h8] {
    margin-top: 4px;
    color: #9eabb9;
    font-size: 14px;
}

.new-game-button[b-vlr8d2e5h8],
.action-button[b-vlr8d2e5h8] {
    border: 1px solid #5c7189;
    background: #27384a;
    color: white;
    border-radius: 7px;
    padding: 10px 15px;
    cursor: pointer;
    font-weight: 600;
}

    .new-game-button:hover[b-vlr8d2e5h8],
    .action-button:hover:not(:disabled)[b-vlr8d2e5h8] {
        background: #344b62;
    }

    .action-button:disabled[b-vlr8d2e5h8] {
        opacity: .45;
        cursor: default;
    }

.game-message[b-vlr8d2e5h8] {
    max-width: 1500px;
    margin: 0 auto 15px auto;
    padding: 11px 16px;
    background: #213143;
    border: 1px solid #445c74;
    border-radius: 7px;
    text-align: center;
    font-weight: 600;
}

.game-layout[b-vlr8d2e5h8] {
    max-width: 1500px;
    margin: auto;
    display: grid;
    grid-template-columns: 230px auto 245px;
    gap: 18px;
    align-items: start;
}

@media (max-width: 900px) {
    .game-layout[b-vlr8d2e5h8] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .game-layout[b-vlr8d2e5h8] {
        grid-template-columns: 1fr;
    }

    .game-header[b-vlr8d2e5h8] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
}

.left-panel[b-vlr8d2e5h8],
.right-panel[b-vlr8d2e5h8] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

@media (max-width: 1394px) {
    .right-panel[b-vlr8d2e5h8] {
        flex-direction: row;
        gap: 12px;
        overflow-x: auto;
    }
}

.status-card[b-vlr8d2e5h8] {
    background: rgba(23, 32, 43, .95);
    border: 1px solid #34475a;
    border-radius: 9px;
    padding: 14px;
    box-shadow: 0 8px 20px rgba(0,0,0,.18);
}

.player-card.human[b-vlr8d2e5h8] {
    border-top: 3px solid #36a2ff;
}

.player-card.enemy[b-vlr8d2e5h8] {
    border-top: 3px solid #e15050;
}

.status-title[b-vlr8d2e5h8] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    margin-bottom: 13px;
}

.player-dot[b-vlr8d2e5h8] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

.human-dot[b-vlr8d2e5h8] {
    background: #36a2ff;
}

.enemy-dot[b-vlr8d2e5h8] {
    background: #e15050;
}

.stats-grid[b-vlr8d2e5h8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

    .stats-grid > div[b-vlr8d2e5h8] {
        display: flex;
        flex-direction: column;
    }

.stat-label[b-vlr8d2e5h8] {
    color: #98a6b4;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.stats-grid strong[b-vlr8d2e5h8] {
    margin-top: 3px;
    font-size: 19px;
}

.phase[b-vlr8d2e5h8],
.reinforcement-box[b-vlr8d2e5h8] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.reinforcement-box[b-vlr8d2e5h8] {
    padding: 8px;
    background: #192b3c;
    border-radius: 5px;
}

.button-stack[b-vlr8d2e5h8] {
    margin-top: 12px;
}

    .button-stack button[b-vlr8d2e5h8] {
        width: 100%;
    }

.formula[b-vlr8d2e5h8] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 13px;
}

    .formula div[b-vlr8d2e5h8] {
        display: flex;
        justify-content: space-between;
    }

.help-small[b-vlr8d2e5h8] {
    font-size: 11px;
    color: #95a2ae;
    margin: 11px 0 0;
}

.center-panel[b-vlr8d2e5h8] {
    min-width: 620px;
}

.map-toolbar[b-vlr8d2e5h8] {
    min-height: 43px;
    background: #17212d;
    border: 1px solid #34475a;
    border-radius: 8px;
    margin-bottom: 9px;
    padding: 11px 14px;
    color: #b9c6d2;
    font-size: 13px;
}

    .map-toolbar strong[b-vlr8d2e5h8] {
        color: white;
    }

.game-board[b-vlr8d2e5h8] {
    display: grid;
    grid-auto-rows: 58px;
    gap: 4px;
    padding: 12px;
    width: max-content;
    background: #0c1219;
    border: 1px solid #3b4b5b;
    border-radius: 9px;
    box-shadow: 0 15px 30px rgba(0,0,0,.25);
}

.map-tile[b-vlr8d2e5h8] {
    width: 58px;
    height: 58px;
    position: relative;
    border-radius: 5px;
    border-width: 3px;
    border-style: solid;
    font-family: inherit;
    color: white;
    cursor: pointer;
    transition: transform .1s ease, filter .1s ease, box-shadow .1s ease;
}

    .map-tile:hover:not(:disabled)[b-vlr8d2e5h8] {
        transform: scale(1.06);
        z-index: 5;
        filter: brightness(1.18);
    }

.human-tile[b-vlr8d2e5h8] {
    border-color: #299cff;
    background: linear-gradient(135deg, #1f4262, #172b3c);
}

.enemy-tile[b-vlr8d2e5h8] {
    border-color: #e34c4c;
    background: linear-gradient(135deg, #633131, #3e2225);
}

.neutral-tile[b-vlr8d2e5h8] {
    border-color: #8c949d;
    background: linear-gradient(135deg, #464d54, #30363c);
}

.mountain-tile[b-vlr8d2e5h8] {
    border-color: #4c5258;
    background: linear-gradient(135deg, #30353b, #181c21);
    cursor: default;
}

.city-tile[b-vlr8d2e5h8] {
    box-shadow: inset 0 0 12px rgba(255, 210, 65, .25);
}

.selected-tile[b-vlr8d2e5h8] {
    box-shadow: 0 0 0 3px #f6e162, 0 0 16px #e9d547;
    transform: scale(1.04);
    z-index: 4;
}

.units[b-vlr8d2e5h8] {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 19px;
    font-weight: 800;
    text-shadow: 0 2px 4px black;
}

.city-icon[b-vlr8d2e5h8] {
    position: absolute;
    top: 2px;
    left: 5px;
    color: #ffd95c;
    font-size: 14px;
    z-index: 2;
}

.neutral-label[b-vlr8d2e5h8] {
    position: absolute;
    bottom: 2px;
    right: 4px;
    font-size: 8px;
    opacity: .5;
}

.mountain[b-vlr8d2e5h8] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    font-size: 25px;
    color: #89929c;
}

.legend[b-vlr8d2e5h8] {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    font-size: 12px;
    color: #aeb9c5;
}

    .legend > div[b-vlr8d2e5h8] {
        display: flex;
        align-items: center;
        gap: 6px;
    }

.legend-box[b-vlr8d2e5h8] {
    display: inline-block;
    width: 16px;
    height: 16px;
    background: #293542;
    border: 3px solid;
    border-radius: 2px;
}

.human-border[b-vlr8d2e5h8] {
    border-color: #299cff;
}

.enemy-border[b-vlr8d2e5h8] {
    border-color: #e34c4c;
}

.neutral-border[b-vlr8d2e5h8] {
    border-color: #8c949d;
}

.legend-symbol[b-vlr8d2e5h8] {
    color: #ffd95c;
    font-size: 17px;
}

.selected-info[b-vlr8d2e5h8] {
    display: flex;
    flex-direction: column;
    gap: 9px;
    font-size: 13px;
}

    .selected-info div[b-vlr8d2e5h8] {
        display: flex;
        justify-content: space-between;
    }

.muted[b-vlr8d2e5h8] {
    color: #98a6b4;
    font-size: 13px;
    line-height: 1.45;
    margin-bottom: 0;
}

.rules[b-vlr8d2e5h8] {
    padding-left: 18px;
    margin: 0;
    color: #bbc5cf;
    font-size: 12px;
    line-height: 1.6;
}

.event-log[b-vlr8d2e5h8] {
    max-height: 260px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.event-item[b-vlr8d2e5h8] {
    font-size: 11px;
    color: #aab6c1;
    border-bottom: 1px solid #293745;
    padding: 5px 0;
}