.ks-table-wrap {
    padding: 0 2rem;
    overflow-x: auto;
}

.ks-lessons-wrap {
    padding: 0 2rem 1rem;
    display: grid;
    gap: 0.9rem;
}

.ks-page-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin: 0 0 1rem;
}

.ks-page-copy {
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
}

.ks-page-overline {
    color: var(--ks-text-muted);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ks-page-title {
    margin: 0;
    color: var(--ks-text-primary);
}

.ks-page-action-button {
    flex-shrink: 0;
}

.ks-lesson-card {
    border: 1px solid rgba(255, 255, 255, 0.06);
    background: linear-gradient(180deg, rgba(61, 48, 36, 0.88), rgba(40, 31, 22, 0.94));
    border-radius: 1.25rem;
    padding: 1rem 1.1rem;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.2);
}

.ks-lesson-card-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.85rem;
}

.ks-lesson-card-title {
    margin: 0;
    font-size: 1.2rem;
}

.ks-lesson-card-dances {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.ks-lesson-dance-pill {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.2rem;
    min-width: 12rem;
    padding: 0.25rem;
    text-align: left;
    --md-outlined-button-container-shape: 20px;
    --md-outlined-button-label-text-color: var(--ks-text-primary);
    --md-outlined-button-outline-color: rgba(255, 255, 255, 0.12);
}

.ks-lesson-dance-pill span {
    display: block;
}

.ks-lesson-dance-region {
    color: var(--ks-text-secondary);
    font-size: 0.78rem;
}

.ks-empty-state {
    border: 1px dashed var(--ks-border);
    background: rgba(255, 255, 255, 0.03);
    color: var(--ks-text-secondary);
    border-radius: 1.25rem;
    padding: 1.1rem;
}

.ks-app-main {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}
