/* LumorowLMS — Complete the Sentences */
.llmsb-cs-block { border: 2px solid var(--llmsb-primary); border-radius: 12px; overflow: hidden; background: #fff; padding: 28px; }

.llmsb-cs-instruction {
    font-size: .95rem; font-style: italic; color: var(--llmsb-mid); line-height: 1.65;
    margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid var(--llmsb-border);
}

/* Word Bank — sits between the instructions and the sentences. */
.llmsb-cs-wordbank {
    background: var(--llmsb-primary-pale);
    border: 1px solid var(--llmsb-primary);
    border-radius: var(--llmsb-radius);
    padding: 14px 18px 16px;
    margin: 0 0 22px;
}
.llmsb-cs-wordbank-label {
    font-family: 'DM Sans', sans-serif;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--llmsb-primary-dk);
    margin-bottom: 10px;
}
.llmsb-cs-wordbank-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.llmsb-cs-wordbank-item {
    background: #fff;
    border: 1px solid var(--llmsb-primary);
    color: var(--llmsb-primary-dk);
    padding: 6px 14px;
    border-radius: 999px;
    font-size: .92rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

/* Sentence rows */
.llmsb-cs-sentences { display: flex; flex-direction: column; gap: 0; }
.llmsb-cs-row {
    display: flex; align-items: baseline; gap: 10px;
    padding: 14px 18px; border-radius: 8px;
    font-size: 1rem; line-height: 1.9;
    transition: background .15s;
}
.llmsb-cs-row:nth-child(odd) { background: #fafaf8; }
.llmsb-cs-row:hover { background: #f5f5f0; }
.llmsb-cs-row.llmsb-cs-correct { background: #f0fdf4; }
.llmsb-cs-row.llmsb-cs-wrong   { background: #fff8f8; }

.llmsb-cs-num {
    font-family: 'DM Sans', sans-serif; font-weight: 700;
    color: var(--llmsb-primary); min-width: 24px; flex-shrink: 0;
    font-size: .9rem;
}
.llmsb-cs-text { flex: 1; }

/* Auto-expanding blank — CSS grid mirror technique */
.llmsb-cs-blank {
    display: inline-grid;
    min-width: 10ch;
    vertical-align: baseline;
    position: relative;
    margin: 0 2px;
}
/* The hidden sizer mirrors the input value to set the width */
.llmsb-cs-blank::after {
    content: attr(data-value) '\00a0'; /* non-breaking space ensures minimum */
    grid-area: 1 / 1;
    visibility: hidden;
    white-space: pre;
    font: inherit;
    padding: 0 4px;
    pointer-events: none;
}
.llmsb-cs-input {
    grid-area: 1 / 1;
    width: 100%;
    min-width: 10ch;
    border: none;
    border-bottom: 2px solid #c9c9c0;
    background: transparent;
    font: inherit;
    color: var(--llmsb-dark);
    padding: 0 4px;
    outline: none;
    transition: border-color .2s;
    caret-color: var(--llmsb-primary);
}
.llmsb-cs-input:focus { border-bottom-color: var(--llmsb-primary); }
.llmsb-cs-input.correct { border-bottom-color: var(--llmsb-correct); color: var(--llmsb-correct); }
.llmsb-cs-input.wrong   { border-bottom-color: var(--llmsb-wrong);   color: var(--llmsb-wrong);   }
.llmsb-cs-input:disabled { opacity: .8; }

/* Feedback */
.llmsb-cs-feedback {
    display: block; font-size: .78rem; color: var(--llmsb-wrong);
    margin-top: 4px; padding-left: 34px; font-style: italic;
    font-family: 'DM Sans', sans-serif;
}

/* Score */
.llmsb-cs-score { margin-top: 16px; }
