/* ECDS Word Scramble v2.0 */

.ecds-scramble-board { max-width: 560px; margin: 0 auto; }

.ecds-sc-progress {
    height: 6px; background: #e2e8f0; border-radius: 3px; margin-bottom: 18px; overflow: hidden;
}
.ecds-sc-bar { height: 100%; background: var(--ecds-secondary); border-radius: 3px; transition: width .4s ease; }

.ecds-sc-qnum {
    font-size: 13px; font-weight: 700; color: var(--ecds-text-muted);
    text-transform: uppercase; letter-spacing: .5px; margin-bottom: 14px;
}

.ecds-sc-hint {
    background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px;
    padding: 10px 14px; font-size: 14px; color: #92400e;
    margin-bottom: 20px; font-weight: 600;
}

/* Answer slots */
.ecds-sc-answer-slots {
    display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
    margin-bottom: 24px;
}

.ecds-sc-slot {
    width: 46px; height: 52px;
    border-bottom: 3px solid var(--ecds-border-dark);
    display: flex; align-items: center; justify-content: center;
    font-size: 24px; font-weight: 800;
    color: var(--ecds-text);
    transition: border-color .15s, background .15s;
    border-radius: 4px 4px 0 0;
}

.ecds-sc-slot.filled { border-color: var(--ecds-primary); background: #f0f4ff; }
.ecds-sc-slot.ecds-sc-correct-slot { border-color: var(--ecds-success); background: #d1fae5; }

/* Tiles row */
.ecds-sc-tiles-row {
    display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px;
}

.ecds-sc-tile {
    width: 46px; height: 52px;
    font-size: 22px; font-weight: 800;
    background: #fff;
    border: 2px solid var(--ecds-border-dark);
    border-radius: 8px;
    cursor: pointer;
    transition: transform .12s, background .15s, border-color .15s, opacity .15s;
    color: var(--ecds-text);
    box-shadow: 0 2px 4px rgba(0,0,0,.08);
}

.ecds-sc-tile:hover:not(.ecds-sc-used) {
    transform: translateY(-3px) scale(1.06);
    border-color: var(--ecds-primary);
    background: #f0f4ff;
}

.ecds-sc-tile.ecds-sc-used {
    opacity: .3; cursor: default; transform: none;
}

/* Actions */
.ecds-sc-actions { display: flex; gap: 10px; justify-content: center; margin-bottom: 12px; }

/* Feedback */
.ecds-sc-feedback {
    text-align: center; font-size: 16px; font-weight: 700;
    min-height: 24px; transition: color .15s;
}
.ecds-sc-correct { color: var(--ecds-success); }
.ecds-sc-wrong   { color: var(--ecds-danger); }

/* Result */
.ecds-sc-result { text-align: center; padding: 20px; }
.ecds-sc-result h3 { font-size: 26px; margin: 0 0 8px; }
.ecds-sc-final { font-size: 22px; font-weight: 800; color: var(--ecds-primary); }
