.crossword-wrapper {
        width: 100%;
        overflow-x: auto;
        margin-top: 20px;
    }
    .crossword-grid {
        display: inline-grid;
        border: 2px solid #333;
        background: #fff;
        --cell-size: 40px;
    }
    .crossword-cell {
        width: var(--cell-size);
        height: var(--cell-size);
        border: 1px solid #999;
        text-align: center;
        vertical-align: middle;
        font-size: calc(var(--cell-size) * 0.5);
        font-weight: bold;
        background: #fff;
        position: relative;
        cursor: pointer;
        transition: background 0.1s;
        box-sizing: border-box;
    }
    .crossword-cell.black {
        background: #333;
        cursor: default;
    }
    .crossword-cell .cell-number {
        position: absolute;
        top: 1px;
        left: 3px;
        font-size: calc(var(--cell-size) * 0.25);
        font-weight: normal;
        color: #555;
        pointer-events: none;
    }
    .crossword-cell input {
        width: 100%;
        height: 100%;
        border: none;
        text-align: center;
        font-size: calc(var(--cell-size) * 0.5);
        font-weight: bold;
        background: transparent;
        text-transform: uppercase;
        outline: none;
        padding: 0;
        margin: 0;
        cursor: pointer;
        position: relative;
        z-index: 1;
        box-sizing: border-box;
    }
    .crossword-cell input:focus {
        background: #e0f0ff;
    }
    .crossword-cell.active-word {
        background: #ffeb3b !important;
    }
    .crossword-cell.active-word input {
        background: transparent !important;
    }
    .crossword-cell.active-cell {
        background: #64b5f6 !important;
    }
    .crossword-cell.active-cell input {
        background: transparent !important;
    }
    .crossword-cell.correct,
    .crossword-cell.correct.active-word,
    .crossword-cell.correct.active-cell {
        background: #a5d6a7 !important;
        cursor: not-allowed;
    }
    .crossword-cell.correct input,
    .crossword-cell.correct.active-word input,
    .crossword-cell.correct.active-cell input {
        background: transparent !important;
        cursor: not-allowed;
    }
    .crossword-cell.wrong input {
        background: #ef9a9a;
    }
    .crossword-questions {
        display: flex;
        flex-wrap: wrap;
        gap: 30px;
        margin-top: 15px;
    }
    .crossword-questions > div {
        flex: 1 1 250px;
    }
    .crossword-questions h4 {
        margin: 5px 0;
    }
    .crossword-questions ul {
        list-style: none;
        padding-left: 0;
    }
    .crossword-questions li {
        margin-bottom: 4px;
    }
    .crossword-questions .q-number {
        font-weight: bold;
        margin-right: 5px;
        min-width: 24px;
    }
    .crossword-container{
        padding: 25px;
        background: #e7f1fa;
        border-radius: 10px;
        border: 1px solid #b4c2cf;
    }