/* Keep a learning activity on one surface. Inner teaching and answer review
   use headings and dividers; simulators and native answer controls keep their
   own boundaries. The main context also wins over page-specific legacy CSS. */

main .learning-lesson-page .lesson-resource-choice,
main .learning-lesson-page .lesson-resource-choice.is-current {
    padding: 0;
    border: 0;
    border-top: 1px solid var(--border-subtle);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
main .learning-lesson-page .lesson-resource-choice.is-current { border-top: 2px solid var(--state-info-border); }
main .learning-lesson-page .lesson-resource-choice > summary,
main .learning-lesson-page .lesson-resource-choice.is-current > summary { padding: 18px 0; }
main .learning-lesson-page .lesson-resource-choice.is-complete > summary {
    border: 0;
    border-radius: 0;
    background: transparent;
}
main .learning-lesson-page .lesson-resource-choice.is-complete .learning-block-heading h3 {
    color: var(--text-primary);
}
main .learning-lesson-page .lesson-resource-choice.is-complete .learning-block-heading > div > span {
    color: var(--state-success);
}
main .learning-lesson-page .lesson-block-body { padding: 0 0 20px; }
main .learning-lesson-page .lesson-guided-sequence { padding-top: 0; }
main .learning-lesson-page .lesson-resource-choice > summary::after {
    color: var(--text-secondary);
    background: transparent;
    border-radius: 0;
}
main .learning-lesson-page .learning-block-heading > div > span,
main .learning-lesson-page .lesson-sequence-step > header small,
main .learning-lesson-page .lesson-sequence-step > header > b,
main .learning-lesson-page .ccna-example-row strong {
    font-size: .875rem;
    letter-spacing: normal;
    text-transform: none;
}
main .learning-lesson-page :is(.section-kicker, .lesson-cli-label),
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .section-kicker {
    letter-spacing: normal;
    text-transform: none;
}

/* Reference material is a disclosure or a text row, rather than another card. */
main .learning-lesson-page :is(.lesson-personal-notes, .lesson-provider-links, .lesson-sources, .lesson-concept-section, .lesson-finish, .lesson-return-today) {
    padding-inline: 0;
    border: 0;
    border-block: 1px solid var(--border-subtle);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
main .learning-lesson-page .lesson-personal-notes > summary,
main .learning-lesson-page .lesson-sources > summary { padding-inline: 0; }
main .learning-lesson-page .lesson-personal-notes form,
main .learning-lesson-page .lesson-sources > div { padding-inline: 0; }
main .learning-lesson-page .lesson-sources a,
main .learning-lesson-page .lesson-source-record a {
    padding: 12px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    text-decoration: underline;
    text-underline-offset: 3px;
}
main .learning-lesson-page .lesson-sources a + a,
main .learning-lesson-page .lesson-source-record a + a { border-top: 1px solid var(--border-subtle); }
main .learning-lesson-page .lesson-inline-concepts,
main .learning-lesson-page .lesson-concept-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
}
main .learning-lesson-page .lesson-inline-concepts > div,
main .learning-lesson-page .lesson-concept-grid > div {
    min-height: 0;
    padding: 20px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
main .learning-lesson-page .lesson-inline-concepts > div + div,
main .learning-lesson-page .lesson-concept-grid > div + div { border-top: 1px solid var(--border-subtle); }
main .learning-lesson-page .lesson-concept-grid > div > span { position: static; display: block; margin-bottom: 6px; }
main .learning-lesson-page .lesson-inline-concepts h4,
main .learning-lesson-page .lesson-concept-grid h3 { font-size: 1.0625rem; }
main .learning-lesson-page .lesson-inline-concepts p,
main .learning-lesson-page .lesson-concept-grid p {
    max-width: 74ch;
    color: var(--text-secondary);
    font-size: 1rem;
    line-height: 1.7;
}
main .learning-lesson-page .lesson-support :is(.ccna-outcomes, .ccna-worked-example, .ccna-browser-exercise, .lesson-cli, .lesson-cli-practice, .lesson-workbench, .lesson-cli-topology, .lesson-cli-objectives) {
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
main .learning-lesson-page .lesson-support :is(.ccna-worked-example, .ccna-browser-exercise) {
    padding-top: 20px;
    border-top: 1px solid var(--border-subtle);
}
main .learning-lesson-page .lesson-practice-evidence section {
    padding: 14px 0;
    border: 0;
    border-top: 1px solid var(--border-subtle);
    border-radius: 0;
    background: transparent;
}
main .learning-lesson-page .lesson-block-check {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--border-subtle);
}
main .learning-lesson-page .lesson-block-check > h4 {
    margin: 0 0 6px;
    color: var(--text-primary);
    font-size: 1.0625rem;
    line-height: 1.5;
}
main .learning-lesson-page .lesson-block-check > p {
    margin: 0 0 16px;
    color: var(--text-secondary);
    font-size: .9375rem;
    line-height: 1.6;
}
main .learning-lesson-page .lesson-cli-independent [data-practice-kind="independent"] > header span {
    display: none; /* The required heading directly above already names this task. */
}

/* Related-concept links remain keyboard-accessible native disclosures. */
main :is(.learning-lesson-page, .learning-practice-page, .learning-result-page) .concept-connections,
main :is(.learning-lesson-page, .learning-practice-page, .learning-result-page) .concept-connections details {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
main :is(.learning-lesson-page, .learning-practice-page, .learning-result-page) .concept-connections details { border-top: 1px solid var(--border-subtle); }
main :is(.learning-lesson-page, .learning-practice-page, .learning-result-page) .concept-connections summary {
    min-height: 44px;
    padding: 12px 0;
    color: var(--text-primary);
}
main :is(.learning-lesson-page, .learning-practice-page, .learning-result-page) .concept-connections summary :is(span, strong) {
    color: var(--text-secondary);
    font-size: .875rem;
    letter-spacing: normal;
    text-transform: none;
}
main :is(.learning-lesson-page, .learning-practice-page, .learning-result-page) .concept-connections details > div { padding-inline: 0; }
main :is(.learning-lesson-page, .learning-practice-page, .learning-result-page) .concept-connections a {
    min-height: 44px;
    padding: 12px 0;
    border: 0;
    border-bottom: 1px solid var(--border-subtle);
    border-radius: 0;
    background: transparent;
}
main :is(.learning-lesson-page, .learning-practice-page, .learning-result-page) .concept-connections a :is(strong, span),
main :is(.learning-lesson-page, .learning-practice-page, .learning-result-page) .concept-connections details > div > p { font-size: .9375rem; line-height: 1.6; }

/* One question/task surface. Choice labels still have clear control boundaries. */
main .learning-practice-page .quiz-question-card,
main .learning-practice-page .practice-step-feedback,
main .lab-page .task-card,
main .learning-result-page .quiz-review-list > article,
main .pbq-attempt-page .pbq-attempt-results > article {
    border-color: var(--border-subtle);
    border-radius: 8px;
    background: var(--surface-card);
    box-shadow: none;
}
main .learning-practice-page .quiz-options label,
main .lab-page .choice-option { border-radius: 4px; font-size: 1rem; line-height: 1.55; }
main .lab-page .ordering-confirmation { margin: 0 20px 20px; min-height: 44px; }
main .learning-practice-page .practice-step-feedback h2 { font-size: 1.25rem; line-height: 1.5; }
main .learning-practice-page .practice-step-feedback > p { max-width: 74ch; font-size: 1rem; line-height: 1.7; }
main .learning-practice-page .quiz-submit-bar,
main .lab-page .submit-bar {
    padding: 20px 0;
    border: 0;
    border-top: 1px solid var(--border-subtle);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* Feedback lists and their options no longer add two enclosing surfaces. */
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-rationale-list,
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .structured-answer-feedback,
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .structured-order-feedback,
main :is(.pbq-attempt-page, .lab-page) .rationale-detail-list {
    gap: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
main .learning-practice-page .answer-rationale-list { padding: 0; }
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-rationale-list > div,
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .structured-answer-feedback > div {
    padding: 16px 0;
    border: 0;
    border-top: 1px solid var(--border-subtle);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-rationale-list p strong { font-size: 1rem; line-height: 1.5; }
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-rationale-list p small,
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .structured-answer-feedback small {
    color: var(--text-secondary);
    font-size: .9375rem;
    line-height: 1.65;
}
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-rationale-list > div > b {
    padding: 0;
    color: var(--text-secondary);
    border-radius: 0;
    background: transparent;
    font-size: .8125rem;
    line-height: 1.5;
    text-transform: none;
}
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-rationale-list > .correct-option > :is(span, b) { color: var(--state-success); }
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-rationale-list > .incorrect-option > span { color: var(--state-danger); }
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-glossary {
    padding: 0;
    color: var(--text-secondary);
    border: 0;
    border-top: 1px solid var(--border-subtle);
    border-radius: 0;
    background: transparent;
}
main .learning-practice-page .answer-glossary { margin-inline: 0; }
main .lab-page .task-feedback .answer-glossary { margin-inline: 0; }
main .learning-result-page .answer-other-choices { margin: 0 20px 16px 61px; }
main .learning-result-page .answer-other-choices .answer-rationale-list { padding: 0; }
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-glossary > summary {
    min-height: 44px;
    padding: 12px 0;
    color: var(--text-primary);
    font-size: .9375rem;
}
/* Native disclosure state uses the same unobtrusive cue in live and saved review. */
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) :is(.answer-other-choices, .answer-glossary) > summary {
    position: relative;
    padding-inline-end: 28px;
    list-style: none;
    line-height: 1.5;
    cursor: pointer;
}
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) :is(.answer-other-choices, .answer-glossary) > summary::-webkit-details-marker { display: none; }
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) :is(.answer-other-choices, .answer-glossary) > summary::after {
    content: "+";
    position: absolute;
    inset-inline-end: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    color: var(--text-secondary);
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
}
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) :is(.answer-other-choices, .answer-glossary)[open] > summary::after { content: "−"; }
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) :is(.answer-other-choices, .answer-glossary) > summary:focus-visible {
    outline: 3px solid var(--focus-ring);
    outline-offset: 3px;
}
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-glossary dl {
    padding: 0 0 16px;
    grid-template-columns: minmax(90px, .35fr) minmax(0, 1fr);
}
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-glossary dt,
main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-glossary dd {
    font-size: .9375rem;
    line-height: 1.65;
    text-transform: none;
}
main :is(.learning-result-page, .pbq-attempt-page) :is(.quiz-review-list, .pbq-attempt-results) dl > div {
    padding: 8px 0;
    border-radius: 0;
    background: transparent;
}
main :is(.learning-result-page, .pbq-attempt-page) :is(.quiz-review-list, .pbq-attempt-results) :is(header small, dt) {
    color: var(--text-secondary);
    font-size: .875rem;
    letter-spacing: normal;
    text-transform: none;
}
main .learning-result-page .quiz-review-list header > :is(span, b),
main .pbq-attempt-page .pbq-attempt-results header > span { color: var(--state-danger); background: var(--state-danger-soft); }
main .learning-result-page .quiz-review-list .correct header > :is(span, b),
main .pbq-attempt-page .pbq-attempt-results .correct header > span { color: var(--state-success); background: var(--state-success-soft); }
main .pbq-attempt-page .pbq-attempt-results .partial header > span { color: var(--state-warning); background: var(--state-warning-soft); }
main .learning-result-page .quiz-review-list header > b { font-size: .8125rem; text-transform: none; }
main :is(.learning-result-page, .pbq-attempt-page) :is(.quiz-review-list, .pbq-attempt-results) dd,
main :is(.learning-result-page, .pbq-attempt-page) :is(.quiz-review-list, .pbq-attempt-results) > article > p {
    color: var(--text-secondary);
    background: transparent;
    font-size: 1rem;
    line-height: 1.65;
}
main :is(.learning-result-page, .pbq-attempt-page) .response-timing-summary,
main .lab-page .timing-insight {
    border-color: var(--border-subtle);
    background: transparent;
}
main .learning-result-page .extra-learning .quiz-next-action {
    padding: 16px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}
main .learning-result-page .question-learning-targets { background: transparent; border-color: var(--border-subtle); }
main .learning-result-page .question-learning-targets > strong { color: var(--state-info); letter-spacing: normal; text-transform: none; }
main .learning-result-page .question-learning-targets a {
    padding-inline: 0;
    border: 0;
    border-bottom: 1px solid var(--border-subtle);
    border-radius: 0;
    background: transparent;
    color: var(--text-primary);
}
main .learning-result-page .question-learning-targets small { color: var(--state-info); }

/* PBQ metadata and history are compact supporting rows. */
main .pbq-result-hero.page-intro {
    color: var(--text-primary);
    background: var(--surface-page);
}
main .pbq-result-hero.page-intro h1 { color: var(--text-primary); }
main .pbq-result-hero.page-intro :is(p, .eyebrow, .quiz-result-score span) { color: var(--text-secondary); }
main .pbq-result-hero.page-intro .quiz-result-score strong { color: var(--state-danger); }
main .pbq-result-hero.page-intro.passing .quiz-result-score strong { color: var(--state-success); }
main .lab-page :is(.lab-meta-panel, .content-assurance),
main .pbq-attempt-page :is(.attempt-snapshot-note, .timing-method-note) {
    padding-inline: 0;
    color: var(--text-secondary);
    border: 0;
    border-block: 1px solid var(--border-subtle);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
/* Stored content fingerprints remain visible without widening phone pages. */
main .pbq-attempt-page .attempt-snapshot-note { overflow-wrap: anywhere; }
main .pbq-attempt-page :is(.attempt-explanation, .answer-rationale-list, .rationale-detail-list, .answer-glossary) code {
    color: inherit;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: .95em;
    white-space: normal;
    overflow-wrap: anywhere;
}
main .lab-page .task-header h3,
main .pbq-attempt-page .pbq-attempt-results h3 { color: var(--text-primary); font-size: 1.0625rem; line-height: 1.5; }
main .lab-page :is(.task-type, .point-badge, .evidence-type) { color: var(--text-secondary); font-size: .8125rem; letter-spacing: normal; text-transform: none; }
main .lab-page .task-feedback { background: transparent; }
main .lab-page .task-feedback p { color: var(--text-secondary); font-size: .9375rem; line-height: 1.65; }
main .lab-page .result-correct .feedback-heading strong { color: var(--state-success); }
main .lab-page .result-partial .feedback-heading strong { color: var(--state-warning); }
main .lab-page .result-incorrect .feedback-heading strong { color: var(--state-danger); }
main .lab-page .task-feedback .answer-rationale-list,
main .lab-page .task-feedback .rationale-detail-list { padding-inline: 0; }
main .lab-page .attempt-history-summary { gap: 0; border-block: 1px solid var(--border-subtle); }
main .lab-page .attempt-history-summary > article {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
main .lab-page .attempt-history-summary > article + article { border-left: 1px solid var(--border-subtle); }
main .lab-page .evidence-card { border-radius: 6px; box-shadow: none; }
main .lab-page .evidence-card h3 { font-size: .875rem; }

@media (max-width: 760px) {
    main .learning-lesson-page .lesson-cli-workspace:has(> .lesson-workbench) { display: flex; flex-direction: column; }
    main .learning-lesson-page .lesson-cli-workspace > .lesson-workbench { width: 100%; }
    main .learning-lesson-page .lesson-cli-workspace:has(> .lesson-workbench) > .lesson-cli-objectives {
        order: 1;
        width: 100%;
        padding-top: 16px;
        border-top: 1px solid var(--border-subtle);
    }
    main .lab-page .attempt-history-summary > article + article { border-left: 0; }
    main .pbq-attempt-page .timing-method-note { align-items: flex-start; flex-direction: column; gap: 6px; }
}
@media (max-width: 600px) {
    main .learning-practice-page .practice-step-feedback { padding: 16px; }
    main :is(.learning-result-page, .pbq-attempt-page) :is(.quiz-review-list, .pbq-attempt-results) header { grid-template-columns: 30px minmax(0, 1fr); padding-inline: 14px; }
    main :is(.learning-result-page, .pbq-attempt-page) :is(.quiz-review-list, .pbq-attempt-results) header > span { grid-column: 1; grid-row: 1; }
    main :is(.learning-result-page, .pbq-attempt-page) :is(.quiz-review-list, .pbq-attempt-results) header > b { grid-column: 2; grid-row: 1; justify-self: end; }
    main :is(.learning-result-page, .pbq-attempt-page) :is(.quiz-review-list, .pbq-attempt-results) header > div { grid-column: 1 / -1; grid-row: 2; }
    main :is(.learning-result-page, .pbq-attempt-page) :is(.answer-rationale-list, .structured-answer-feedback) { padding-inline: 14px; }
    main :is(.learning-result-page, .pbq-attempt-page) .answer-other-choices { margin-inline: 14px; }
    main :is(.learning-result-page, .pbq-attempt-page) .answer-other-choices .answer-rationale-list { padding-inline: 0; }
    main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) :is(.answer-rationale-list, .structured-answer-feedback) > div { grid-template-columns: 22px minmax(0, 1fr); gap: 6px 8px; }
    main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) :is(.answer-rationale-list, .structured-answer-feedback) > div > span { grid-column: 1; grid-row: 1; }
    main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-rationale-list > div > b { grid-column: 2; grid-row: 1; justify-self: start; }
    /* Status remains above the answer instead of taking width from its prose. */
    main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) :is(.answer-rationale-list, .structured-answer-feedback) > div > p { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
    main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-glossary { margin-inline: 14px; }
    main .learning-practice-page .answer-glossary { margin-inline: 0; }
    main .lab-page .task-feedback .answer-glossary { margin-inline: 0; }
    main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-glossary dl { grid-template-columns: minmax(0, 1fr); gap: 4px; }
    main :is(.learning-practice-page, .learning-result-page, .pbq-attempt-page, .lab-page) .answer-glossary dd + dt { margin-top: 12px; }
}