body.local-coreplatform-catalog #page-header,
body.local-coreplatform-lookup #page-header,
body.local-coreplatform-upload #page-header {
    display: none;
}

body.local-coreplatform-lookup,
body.local-coreplatform-lookup #page,
body.local-coreplatform-lookup #page-wrapper,
body.local-coreplatform-viewer,
body.local-coreplatform-viewer #page,
body.local-coreplatform-viewer #page-wrapper,
body.local-coreplatform-upload,
body.local-coreplatform-upload #page,
body.local-coreplatform-upload #page-wrapper {
    background: #f4f7fb;
}

body.local-coreplatform-lookup #page.drawers .main-inner,
body.local-coreplatform-lookup.limitedwidth #page.drawers .main-inner {
    background:
        linear-gradient(180deg, #f3f7fc 0%, #eef4fa 48%, #f6f8fb 100%);
    border-radius: 0;
    box-shadow: none;
    margin-top: 0;
    padding-top: clamp(18px, 2vw, 30px);
}

body.local-coreplatform-viewer #page.drawers .main-inner,
body.local-coreplatform-viewer.limitedwidth #page.drawers .main-inner {
    background: linear-gradient(180deg, #f3f7fc 0%, #eef4fa 54%, #f8fafc 100%);
    border-radius: 0;
    box-shadow: none;
    margin-top: 0;
    padding-top: clamp(16px, 2vw, 28px);
}

body.local-coreplatform-catalog #page.drawers .main-inner,
body.local-coreplatform-catalog.limitedwidth #page.drawers .main-inner,
body.local-coreplatform-lookup #page.drawers .main-inner,
body.local-coreplatform-lookup.limitedwidth #page.drawers .main-inner,
body.local-coreplatform-course #page.drawers .main-inner,
body.local-coreplatform-course.limitedwidth #page.drawers .main-inner,
body.local-coreplatform-upload #page.drawers .main-inner,
body.local-coreplatform-upload.limitedwidth #page.drawers .main-inner,
body.local-coreplatform-viewer #page.drawers .main-inner,
body.local-coreplatform-viewer.limitedwidth #page.drawers .main-inner {
    margin-left: auto;
    margin-right: auto;
    max-width: none;
    padding-left: clamp(18px, 2.6vw, 44px);
    padding-right: clamp(18px, 2.6vw, 44px);
    width: 100%;
}

body.local-coreplatform-catalog #region-main,
body.local-coreplatform-lookup #region-main,
body.local-coreplatform-course #region-main,
body.local-coreplatform-upload #region-main,
body.local-coreplatform-viewer #region-main {
    background: transparent;
    border: 0;
    padding: 0;
}

body.local-coreplatform-catalog #region-main > .card,
body.local-coreplatform-catalog #region-main > .card > .card-body,
body.local-coreplatform-lookup #region-main > .card,
body.local-coreplatform-lookup #region-main > .card > .card-body,
body.local-coreplatform-course #region-main > .card,
body.local-coreplatform-course #region-main > .card > .card-body,
body.local-coreplatform-upload #region-main > .card,
body.local-coreplatform-upload #region-main > .card > .card-body,
body.local-coreplatform-viewer #region-main > .card,
body.local-coreplatform-viewer #region-main > .card > .card-body {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
}

.cp-catalog {
    --cp-ink: #172033;
    --cp-muted: #5f6f85;
    --cp-border: #d9e1ec;
    --cp-soft: #f4f7fb;
    --cp-panel: #ffffff;
    --cp-blue: #1f5f9f;
    --cp-blue-dark: #154a7e;
    --cp-green: #2f7d64;
    --cp-font-sans: "Inter", "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif;
    --cp-shadow: 0 16px 34px rgba(20, 37, 63, 0.08);
    color: var(--cp-ink);
    font-family: var(--cp-font-sans);
    font-size: 15px;
    line-height: 1.5;
    margin: 0 auto;
    max-width: 1480px;
    padding: 30px 0 56px;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    width: 100%;
}

.cp-catalog button,
.cp-catalog input,
.cp-catalog select,
.cp-catalog textarea {
    font-family: inherit;
}

.cp-catalog-hero {
    align-items: stretch;
    background: linear-gradient(135deg, #eef5fb 0%, #ffffff 56%, #eef8f4 100%);
    border: 1px solid var(--cp-border);
    border-radius: 8px;
    box-shadow: var(--cp-shadow);
    display: grid;
    gap: clamp(24px, 3vw, 46px);
    grid-template-columns: minmax(390px, 1fr) minmax(430px, .95fr);
    margin-bottom: 20px;
    padding: clamp(24px, 3vw, 38px);
}

.cp-eyebrow {
    color: var(--cp-blue);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.cp-title {
    color: var(--cp-ink);
    font-size: clamp(34px, 2.7vw, 46px);
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.12;
    margin: 0;
}

.cp-subtitle {
    color: var(--cp-muted);
    font-size: 16px;
    margin: 12px 0 0;
    max-width: 760px;
}

.cp-course-meta,
.cp-hero-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.cp-action-hint {
    color: var(--cp-muted);
    font-size: 13px;
    max-width: 520px;
}

.cp-course-upload-card {
    align-items: center;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid #dbe6f3;
    border-radius: 8px;
    box-shadow: 0 10px 22px rgba(20, 37, 63, 0.05);
    display: flex;
    flex-wrap: wrap;
    gap: 12px 14px;
    margin-top: 18px;
    padding: 14px 16px;
}

.cp-course-upload-card .cp-action-hint {
    color: #52657d;
    flex: 1 1 320px;
    font-family: "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    margin: 0;
    max-width: 760px;
}

.cp-course-upload-button {
    align-items: center;
    display: inline-flex;
    flex: 0 0 auto;
    font-family: "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    gap: 8px;
    justify-content: center;
    letter-spacing: 0;
    line-height: 1.2;
    min-height: 44px;
    padding-left: 22px;
    padding-right: 22px;
    text-transform: none;
}

.cp-course-upload-button::before {
    content: none;
    display: none;
}

.cp-notice {
    background: #f0f7fd;
    border: 1px solid #c5dff2;
    border-radius: 8px;
    color: #16466f;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 18px;
    padding: 12px 14px;
}

.cp-notice--warning {
    background: #fff8e6;
    border-color: #ecd38b;
    color: #755515;
}

.cp-notice--danger {
    background: #fff1f2;
    border-color: #f0b8c0;
    color: #9f1239;
}

.cp-notice--success {
    background: #eef8f4;
    border-color: #b8dfcf;
    color: #17624c;
}

.cp-review-submit-panel {
    align-items: center;
    background: linear-gradient(135deg, #eef8f4 0%, #ffffff 62%, #f2f7ff 100%);
    border: 1px solid #b8dfcf;
    border-radius: 8px;
    box-shadow: 0 12px 26px rgba(20, 37, 63, 0.06);
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(0, 1fr) auto;
    margin-bottom: 18px;
    padding: 18px 20px;
}

.cp-review-submit-panel__copy {
    min-width: 0;
}

.cp-review-submit-panel h2 {
    color: #143a2f;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 5px;
}

.cp-review-submit-panel p {
    color: #416151;
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
}

.cp-review-submit-form,
.cp-card-review-form {
    margin: 0;
}

.cp-review-submit-button {
    min-height: 40px;
    white-space: nowrap;
}

.cp-catalog-hero__stats {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cp-stat {
    background: rgba(255, 255, 255, .78);
    border: 1px solid rgba(217, 225, 236, .9);
    border-radius: 8px;
    min-height: 128px;
    min-width: 0;
    padding: 16px 18px;
}

.cp-stat__label {
    color: var(--cp-muted);
    display: block;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.cp-stat__value {
    color: var(--cp-ink);
    display: block;
    font-size: 24px;
    line-height: 1;
}

.cp-lookup-shell {
    max-width: 1520px;
    padding-top: 8px;
}

.cp-lookup-hero {
    background:
        linear-gradient(135deg, #f7fbff 0%, #ffffff 54%, #eef8f4 100%);
    border-color: #cfdced;
    box-shadow: 0 22px 46px rgba(25, 45, 76, 0.09);
    grid-template-columns: minmax(0, 1.15fr) minmax(450px, .85fr);
    margin-bottom: 22px;
    overflow: hidden;
    padding: clamp(30px, 3vw, 44px);
    position: relative;
}

.cp-lookup-hero::before {
    background: linear-gradient(180deg, #1f5f9f 0%, #2f7d64 100%);
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    top: 0;
    width: 4px;
}

.cp-lookup-hero .cp-catalog-hero__copy,
.cp-lookup-hero .cp-catalog-hero__stats {
    position: relative;
    z-index: 1;
}

.cp-lookup-hero .cp-title {
    font-size: clamp(38px, 3vw, 54px);
    letter-spacing: 0;
}

.cp-lookup-hero .cp-subtitle {
    color: #52657f;
    font-size: 17px;
    line-height: 1.62;
    max-width: 760px;
}

.cp-lookup-hero .cp-catalog-hero__stats {
    align-self: center;
    gap: 14px;
}

.cp-lookup-hero .cp-stat {
    background: rgba(255, 255, 255, .86);
    border-color: #d7e2f0;
    box-shadow: 0 12px 24px rgba(25, 45, 76, 0.055);
    min-height: 132px;
    padding: 18px 20px;
}

.cp-lookup-hero .cp-stat__value {
    font-size: 25px;
}

.cp-lookup-hero__actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.cp-lookup-access {
    background: #ffffff;
    border-color: #c9dced;
    color: #1d4f80;
    box-shadow: 0 8px 18px rgba(31, 95, 159, .08);
    padding: 8px 12px;
}

.cp-lookup-section {
    background: var(--cp-panel);
    border: 1px solid #d4dfed;
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(25, 45, 76, 0.07);
    margin-bottom: 22px;
    overflow: hidden;
}

.cp-lookup-section__header {
    background: #fff;
    border-bottom: 1px solid #e5ebf3;
    padding: 24px 28px;
}

.cp-lookup-section__title {
    color: var(--cp-ink);
    font-size: 23px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.25;
    margin: 0;
}

.cp-lookup-section__desc {
    color: #5e6e86;
    font-size: 16px;
    line-height: 1.5;
    margin: 6px 0 0;
}

.cp-lookup-section__body {
    background: linear-gradient(180deg, #fbfdff 0%, #f7faff 100%);
    padding: 24px 28px 28px;
}

.cp-scope-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.cp-scope-chip {
    background: #ffffff;
    border: 1px solid #d5e0ee;
    border-radius: 999px;
    box-shadow: 0 8px 18px rgba(25, 45, 76, 0.045);
    color: #4f6078;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.25;
    padding: 10px 17px;
}

.cp-scope-note {
    color: var(--cp-muted);
    font-size: 14px;
    font-weight: 600;
}

.cp-lookup-form-grid {
    display: grid;
    gap: 18px 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cp-lookup-form-grid .cp-search-field:first-child {
    grid-column: span 2;
}

.cp-lookup-search-panel .cp-field-label {
    color: var(--cp-ink);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 8px;
    text-transform: none;
}

.cp-lookup-search-panel .cp-search-input,
.cp-lookup-search-panel .cp-select {
    background: #fff;
    border-color: #d3deee;
    border-radius: 8px;
    box-shadow: 0 9px 18px rgba(25, 45, 76, 0.05);
    font-size: 15px;
    min-height: 48px;
}

.cp-lookup-search-panel .cp-search-input:focus,
.cp-lookup-search-panel .cp-select:focus {
    border-color: #6f8ed9;
    box-shadow: 0 0 0 .18rem rgba(76, 107, 203, .16), 0 10px 20px rgba(25, 45, 76, 0.06);
}

.cp-lookup-search-panel .cp-filter-actions {
    align-items: center;
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

.cp-lookup-search-panel .cp-primary-button {
    min-width: 118px;
}

.cp-lookup-search-panel .cp-reset-link {
    background: #ffffff;
    border: 1px solid #d9e1ec;
    border-radius: 8px;
    color: #243247;
    min-height: 42px;
    padding: 9px 16px;
    text-decoration: none;
}

.cp-lookup-search-panel .cp-active-filters {
    background: #f7faff;
    border-top: 1px solid #e5ebf3;
    margin: 0;
    padding: 0 28px 22px;
}

.cp-filter-panel {
    background: var(--cp-panel);
    border: 1px solid var(--cp-border);
    border-radius: 8px;
    box-shadow: 0 10px 26px rgba(20, 37, 63, 0.06);
    margin-bottom: 24px;
    padding: 18px 20px;
}

.cp-search-row {
    align-items: end;
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(360px, 1fr) minmax(220px, 260px) minmax(190px, 230px) minmax(124px, max-content);
}

.cp-lookup-search-row {
    grid-template-columns: minmax(300px, 1.2fr) minmax(190px, 240px) minmax(190px, 230px) minmax(170px, 210px) minmax(112px, max-content);
}

.cp-filter-panel--lookup {
    border-color: #d5e0ef;
    box-shadow: 0 14px 34px rgba(20, 37, 63, 0.07);
}

.cp-search-field,
.cp-filter-field,
.cp-filter-actions {
    min-width: 0;
}

.cp-field-label {
    color: var(--cp-muted);
    display: block;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.cp-search-input,
.cp-select {
    border-color: #b9c4d4;
    min-height: 44px;
    width: 100%;
}

.cp-course-code-input {
    text-transform: uppercase;
}

.cp-primary-button,
.cp-open-button {
    background: var(--cp-blue);
    border-color: var(--cp-blue);
    border-radius: 8px;
    font-weight: 600;
    min-height: 42px;
    padding-left: 18px;
    padding-right: 18px;
    white-space: nowrap;
}

.cp-primary-button:hover,
.cp-open-button:hover {
    background: var(--cp-blue-dark);
    border-color: var(--cp-blue-dark);
}

.cp-filter-actions {
    align-items: center;
    display: flex;
    gap: 8px;
    min-height: 44px;
    white-space: nowrap;
}

.cp-filter-actions .cp-primary-button {
    min-width: 124px;
}

.cp-reset-link {
    color: var(--cp-muted);
    font-weight: 700;
}

.cp-active-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.cp-chip {
    background: #edf4fb;
    border: 1px solid #c9dced;
    border-radius: 999px;
    color: #16466f;
    font-size: 13px;
    font-weight: 700;
    padding: 6px 10px;
}

.cp-results-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin: 10px 0 16px;
}

.cp-section-title {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0;
    margin: 0;
}

.cp-results-count {
    color: var(--cp-muted);
    font-size: 14px;
}

.cp-resource-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.cp-resource-card {
    background: var(--cp-panel);
    border: 1px solid var(--cp-border);
    border-radius: 8px;
    box-shadow: 0 8px 22px rgba(20, 37, 63, 0.05);
    display: flex;
    flex-direction: column;
    min-height: 300px;
    padding: 20px;
}

.cp-lookup-card {
    border-color: #d8e2ef;
    box-shadow: 0 12px 28px rgba(25, 45, 76, 0.06);
    min-height: 285px;
    overflow: hidden;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.cp-lookup-card:hover {
    border-color: #b9cde6;
    box-shadow: 0 18px 38px rgba(25, 45, 76, 0.1);
    transform: translateY(-2px);
}

.cp-lookup-card .cp-type-badge {
    background: #f0f6ff;
    color: #1d4f80;
}

.cp-lookup-card .cp-status-badge {
    background: #ebf8f2;
    color: #1f6d56;
}

.cp-lookup-card .cp-card-actions {
    background: #f8fbff;
    margin: 0 -20px -20px;
    padding: 14px 20px 18px;
}

.cp-lookup-card .cp-open-button {
    box-shadow: 0 10px 20px rgba(31, 95, 159, .15);
}

.cp-lookup-grid {
    gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.cp-lookup-list {
    display: grid;
    gap: 14px;
}

.cp-lookup-row {
    align-items: flex-start;
    background: #fff;
    border: 1px solid #d8e2ef;
    border-radius: 8px;
    box-shadow: 0 12px 28px rgba(25, 45, 76, 0.055);
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 168px;
    padding: 22px;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.cp-lookup-row:hover {
    border-color: #b8cce6;
    box-shadow: 0 18px 38px rgba(25, 45, 76, 0.095);
    transform: translateY(-1px);
}

.cp-lookup-row__content {
    min-width: 0;
}

.cp-lookup-row__title {
    color: var(--cp-ink);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.25;
    margin: 0 0 6px;
}

.cp-lookup-row__code {
    color: #52657f;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 12px;
}

.cp-lookup-row__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 12px;
}

.cp-type-badge--neutral {
    background: #f8fbff;
    color: #52657f;
}

.cp-type-badge--scope {
    background: #f7fbff;
    color: #5d6c84;
    max-width: 100%;
}

.cp-lookup-row__summary {
    color: #34445a;
    font-size: 16px;
    line-height: 1.55;
    margin: 0 0 12px;
}

.cp-lookup-row__metrics {
    align-items: center;
    color: #52657f;
    display: flex;
    flex-wrap: wrap;
    font-size: 14px;
    gap: 8px 20px;
}

.cp-lookup-metric strong {
    color: #172033;
    font-weight: 700;
}

.cp-lookup-row__action {
    align-items: flex-start;
    display: flex;
    justify-content: flex-end;
    min-width: 150px;
}

.cp-lookup-read-button {
    align-items: center;
    background: var(--cp-blue);
    border-color: var(--cp-blue);
    box-shadow: 0 10px 22px rgba(20, 37, 63, .10);
    display: inline-flex;
    font-size: 17px;
    justify-content: center;
    line-height: 1.2;
    min-height: 48px;
    min-width: 150px;
    padding: 0 22px;
    text-align: center;
}

.cp-lookup-read-button:hover {
    background: var(--cp-blue-dark);
    border-color: var(--cp-blue-dark);
}

body.local-coreplatform-lookup .cp-results-head {
    background: rgba(255, 255, 255, .76);
    border: 1px solid #e1e8f2;
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(25, 45, 76, 0.045);
    margin: 8px 0 18px;
    padding: 16px 18px;
}

.cp-resource-card__top {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: space-between;
    margin-bottom: 14px;
}

.cp-type-badge,
.cp-status-badge {
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    padding: 6px 9px;
}

.cp-type-badge {
    background: #eef5fb;
    color: #16466f;
}

.cp-status-badge {
    background: #eef8f4;
    color: var(--cp-green);
}

.cp-card-title {
    color: var(--cp-ink);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.35;
    margin: 0 0 10px;
}

.cp-card-meta {
    color: var(--cp-muted);
    display: flex;
    flex-wrap: wrap;
    font-size: 13px;
    gap: 7px 12px;
    margin-bottom: 12px;
}

.cp-card-summary {
    color: #34445a;
    flex: 1 1 auto;
    font-size: 14px;
    line-height: 1.55;
    margin: 0 0 16px;
}

.cp-card-summary--muted {
    color: #7a8797;
}

.cp-card-actions {
    align-items: center;
    border-top: 1px solid #edf1f6;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    padding-top: 14px;
}

.cp-card-review-form {
    flex: 0 0 auto;
}

.cp-card-code {
    color: var(--cp-muted);
    font-size: 12px;
    font-weight: 700;
    max-width: 150px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cp-open-button {
    flex: 0 0 auto;
    min-width: 132px;
    text-align: center;
}

.cp-secondary-button {
    background: #eef2f7;
    border-color: #eef2f7;
    border-radius: 8px;
    color: #172033;
    font-weight: 600;
    min-height: 42px;
    padding-left: 18px;
    padding-right: 18px;
    white-space: nowrap;
}

.cp-secondary-button:hover {
    background: #e2e8f0;
    border-color: #e2e8f0;
    color: #111827;
}

.cp-viewer-shell {
    max-width: 1740px;
    padding-bottom: 40px;
    padding-top: 10px;
}

.cp-viewer-panel {
    background: var(--cp-panel);
    border: 1px solid #cedbeb;
    border-radius: 8px;
    box-shadow: 0 22px 54px rgba(20, 37, 63, 0.10);
    overflow: hidden;
}

.cp-viewer-topbar {
    align-items: start;
    background:
        linear-gradient(135deg, #f7fbff 0%, #ffffff 58%, #eef8f4 100%);
    border-bottom: 1px solid #d7e3f1;
    display: grid;
    gap: clamp(18px, 2.6vw, 38px);
    grid-template-columns: minmax(0, 1fr) minmax(300px, auto);
    padding: clamp(22px, 2.6vw, 34px);
}

.cp-viewer-titleblock {
    min-width: 0;
    padding-top: 2px;
}

.cp-viewer-title {
    color: var(--cp-ink);
    font-size: clamp(32px, 3vw, 46px);
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.08;
    margin: 0;
    max-width: 980px;
}

.cp-viewer-meta {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.cp-viewer-meta .cp-chip {
    background: rgba(255, 255, 255, 0.86);
    border-color: #c6d8ee;
    color: #123c70;
    font-size: 13px;
    min-height: 38px;
    padding: 8px 12px;
}

.cp-viewer-stats {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.cp-viewer-stat {
    align-items: center;
    background: #ffffff;
    border: 1px solid #d9e4f2;
    border-radius: 999px;
    box-shadow: 0 8px 18px rgba(20, 37, 63, 0.055);
    display: inline-flex;
    gap: 5px;
    justify-content: center;
    line-height: 1.2;
    min-height: 40px;
    padding: 8px 16px;
    white-space: nowrap;
}

.cp-viewer-stat__value {
    color: #172033;
    font-size: 16px;
    font-weight: 800;
}

.cp-viewer-stat__label {
    color: #65718a;
    font-size: 14px;
    font-weight: 700;
}

.cp-viewer-actions {
    align-items: center;
    align-self: start;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid #d8e3f0;
    border-radius: 8px;
    box-shadow: 0 10px 22px rgba(20, 37, 63, 0.06);
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
    padding: 10px;
}

.cp-viewer-actions .btn {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-size: 15px;
    font-weight: 700;
    justify-content: center;
    line-height: 1.2;
    min-height: 48px;
    padding-left: 22px;
    padding-right: 22px;
}

.cp-viewer-actions .cp-secondary-button {
    background: #e7ecf3;
    border-color: #e7ecf3;
    color: #142033;
}

.cp-viewer-actions .cp-secondary-button:hover {
    background: #dce4ef;
    border-color: #dce4ef;
}

.cp-viewer-actions .cp-primary-button {
    background: #3156b7;
    border-color: #3156b7;
    box-shadow: 0 12px 26px rgba(49, 86, 183, 0.22);
}

.cp-viewer-actions .cp-primary-button:hover {
    background: #2748a3;
    border-color: #2748a3;
}

.cp-viewer-framewrap {
    background:
        linear-gradient(180deg, #eaf0f8 0%, #f5f8fc 100%);
    min-height: min(1120px, calc(100vh - 230px));
    padding: clamp(12px, 1.5vw, 20px);
}

.cp-viewer-frame {
    background: #fff;
    border: 1px solid #d4dfed;
    border-radius: 8px;
    box-shadow: 0 18px 38px rgba(20, 37, 63, 0.10);
    display: block;
    height: max(760px, calc(100vh - 250px));
    width: 100%;
}

.cp-viewer-hint {
    background: #f8fbff;
    border-top: 1px solid #e1e8f2;
    color: #667085;
    font-size: 13px;
    margin: 0;
    padding: 10px clamp(18px, 2vw, 30px) 14px;
}

.cp-upload-shell {
    max-width: 1320px;
    padding-bottom: 70px;
    padding-top: 22px;
}

.cp-upload-hero {
    align-items: center;
    border-color: #d3dfef;
    border-radius: 8px;
    box-shadow: 0 18px 40px rgba(20, 37, 63, 0.075);
    margin-bottom: 18px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: clamp(22px, 2.4vw, 32px);
}

.cp-upload-side {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.cp-upload-form {
    background: var(--cp-panel);
    border: 1px solid #dbe6f3;
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(20, 37, 63, 0.06);
    display: grid;
    gap: 0;
    overflow: hidden;
}

.cp-form-section {
    background: #fbfdff;
    border: 0;
    border-bottom: 1px solid #e6edf5;
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
    padding: 0;
}

.cp-form-section-title {
    background: #fff;
    border-bottom: 1px solid #e6edf5;
    color: var(--cp-ink);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0;
    margin: 0;
    padding: 18px 28px;
}

.cp-form-grid {
    display: grid;
    gap: 20px 24px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 26px 28px 30px;
}

.cp-form-field {
    min-width: 0;
}

.cp-form-field--wide {
    grid-column: 1 / -1;
}

.cp-upload-form .cp-input,
.cp-upload-form .cp-select,
.cp-upload-form .cp-textarea,
.cp-upload-form .cp-file-input {
    background: #fff;
    border-color: #d3deee;
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(20, 37, 63, 0.035);
    min-height: 44px;
    width: 100%;
}

.cp-upload-form .cp-input:focus,
.cp-upload-form .cp-textarea:focus,
.cp-upload-form .cp-select:focus {
    border-color: #5b7fd7;
    box-shadow: 0 0 0 .18rem rgba(62, 93, 188, .16);
}

.cp-textarea {
    min-height: 112px;
    resize: vertical;
}

.cp-readonly-box {
    background: #f4f7fb;
    border: 1px solid #d6e0ef;
    border-radius: 8px;
    color: #203047;
    font-weight: 600;
    min-height: 44px;
    padding: 12px 14px;
}

.cp-field-help {
    color: var(--cp-muted);
    font-size: 12px;
    margin: 8px 0 0;
}

.cp-charter-section {
    background: #fff;
    border-bottom: 0;
}

.cp-charter-brief {
    align-items: center;
    background: linear-gradient(135deg, #f1f7ff 0%, #ffffff 100%);
    border: 0;
    border-left: 4px solid #5b7fd7;
    border-radius: 8px;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) auto;
    margin: 24px 28px 18px;
    padding: 18px 22px;
}

.cp-charter-brief__copy {
    display: grid;
    gap: 4px;
}

.cp-charter-brief__copy strong {
    color: #173e68;
    font-size: 15px;
    font-weight: 600;
}

.cp-charter-brief__copy span {
    color: #46617d;
    font-size: 14px;
}

.cp-charter-brief .cp-secondary-button {
    background: #fff;
    border-color: #c8d7ed;
    color: #1f4d7d;
    box-shadow: 0 8px 18px rgba(31, 95, 159, .08);
}

.cp-charter-content {
    background: #fffde8;
    border: 1px solid #e5d77a;
    border-radius: 10px;
    color: #34445a;
    line-height: 1.55;
    max-height: min(70vh, 680px);
    overflow: auto;
    padding: 18px 22px;
}

.cp-charter-content h1,
.cp-charter-content h2,
.cp-charter-content h3,
.cp-charter-content h4 {
    color: #203047;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0;
    margin: 12px 0 8px;
}

.cp-charter-content p,
.cp-charter-content ul,
.cp-charter-content ol {
    margin-bottom: 8px;
}

.cp-charter-section .cp-check-row {
    background: #fbfdff;
    border: 1px solid #dbe6f3;
    border-radius: 8px;
    margin-bottom: 28px;
    margin-left: 28px;
    margin-right: 28px;
    padding: 18px 20px;
    box-shadow: 0 8px 20px rgba(20, 37, 63, 0.035);
}

.cp-program-picker {
    background: #fff;
    border: 1px solid #e1e8f2;
    border-radius: 8px;
    display: grid;
    gap: 12px;
    padding: 14px;
}

.cp-program-scope {
    background: transparent;
    border: 0;
    border-radius: 0;
    display: block;
    padding: 0;
}

.cp-program-current {
    background: linear-gradient(135deg, #f3f8ff 0%, #ffffff 66%, #f2fbf7 100%);
    border: 1px solid #d9e7f7;
    border-radius: 8px;
    box-shadow: 0 10px 22px rgba(20, 37, 63, 0.04);
    margin-bottom: 14px;
    padding: 22px 24px;
}

.cp-program-current__label {
    color: #637089;
    font-family: "Be Vietnam Pro", "Inter", "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0 !important;
    line-height: 1.35;
    margin-bottom: 7px;
    text-transform: none !important;
}

.cp-program-current__title {
    color: var(--cp-ink);
    font-family: "Be Vietnam Pro", "Inter", "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 21px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.35;
}

.cp-program-current__meta {
    color: var(--cp-muted);
    font-size: 14px;
    line-height: 1.5;
    margin-top: 8px;
}

.cp-program-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.cp-program-preview__chip {
    background: rgba(255, 255, 255, .86);
    border: 1px solid #d6e0ef;
    border-radius: 999px;
    color: #31506f;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
    max-width: 100%;
    overflow: hidden;
    padding: 6px 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cp-program-editor {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none !important;
    display: inline-block;
    max-width: 100%;
    overflow: visible;
    padding: 0 !important;
    width: fit-content !important;
}

.cp-program-editor__summary {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #d5e0ef;
    border-radius: 999px;
    color: #31506f;
    cursor: pointer;
    display: inline-flex !important;
    font-family: "Be Vietnam Pro", "Inter", "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    justify-content: flex-start;
    letter-spacing: 0 !important;
    line-height: 1.35;
    min-height: 42px;
    max-width: 100%;
    padding: 9px 15px;
    text-transform: none !important;
    white-space: normal;
    width: fit-content !important;
    box-shadow: 0 6px 14px rgba(20, 37, 63, 0.035);
}

.cp-program-editor__summary::-webkit-details-marker {
    display: none;
}

.cp-program-editor__summary::marker {
    content: "";
}

.cp-program-editor__summary::after {
    border-bottom: 2px solid currentColor;
    border-right: 2px solid currentColor;
    content: "";
    height: 8px;
    margin-left: 14px;
    opacity: .72;
    transform: rotate(45deg);
    transition: transform .16s ease;
    width: 8px;
}

.cp-program-editor[open] .cp-program-editor__summary::after {
    transform: rotate(-135deg);
}

.cp-program-editor[open] .cp-program-editor__summary {
    background: #eef6ff;
    border-color: #b8cbea;
    color: #23476d;
}

.cp-program-editor[open] {
    display: block;
    width: 100% !important;
}

.cp-program-editor__hint {
    color: var(--cp-muted);
    font-size: 13px;
    margin: 12px 2px 12px;
}

.cp-program-editor .cp-program-picker {
    border: 1px solid #e1e8f2;
    border-radius: 8px;
    box-shadow: 0 10px 22px rgba(20, 37, 63, .045);
    margin-top: 12px;
}

.cp-program-toolbar {
    display: block;
    margin: 0;
}

.cp-program-search {
    background: #fff;
}

.cp-program-list {
    background: #fff;
    border: 1px solid #dce5f2;
    border-radius: 8px;
    display: grid;
    gap: 10px;
    max-height: 330px;
    overflow: auto;
    padding: 10px;
}

.cp-program-option {
    align-items: center;
    background: #fff;
    border: 1px solid #d6e0ef;
    border-radius: 8px;
    cursor: pointer;
    display: grid;
    gap: 12px;
    grid-template-columns: 18px minmax(0, 1fr);
    margin: 0;
    min-height: 72px;
    padding: 12px 14px;
    transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.cp-program-option:hover {
    border-color: #a9c3e1;
    box-shadow: 0 8px 18px rgba(20, 37, 63, .06);
    transform: translateY(-1px);
}

.cp-program-option.is-selected {
    background: #eef5ff;
    border-color: #6d83df;
    box-shadow: inset 4px 0 0 #5b6fd8, 0 8px 18px rgba(20, 37, 63, .06);
}

.cp-program-option--common {
    background: linear-gradient(135deg, #eef7ff 0%, #ffffff 62%, #eef8f4 100%);
    border-color: #b9d4f0;
    min-height: 74px;
}

.cp-program-option--common.is-selected {
    background: linear-gradient(135deg, #e8f1ff 0%, #ffffff 64%, #eaf8f2 100%);
    border-color: #4f67d8;
}

.cp-program-option--external {
    background: #fffdf7;
    border-color: #ead7a2;
}

.cp-program-option--external .cp-program-option__meta {
    color: #7a5a17;
}

.cp-program-option--external.is-selected {
    background: #fff8e8;
    border-color: #d09a2d;
    box-shadow: inset 4px 0 0 #d09a2d, 0 8px 18px rgba(20, 37, 63, .06);
}

.cp-program-option input {
    accent-color: #4d63c9;
    height: 16px;
    margin: 0;
    width: 16px;
}

.cp-program-option__body {
    min-width: 0;
}

.cp-program-option__code,
.cp-program-option__name,
.cp-program-option__meta {
    display: block;
}

.cp-program-option__code {
    color: var(--cp-blue);
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 3px;
}

.cp-program-option__name {
    color: #203047;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

.cp-program-option__meta {
    color: var(--cp-muted);
    font-size: 13px;
    margin-top: 4px;
}

.cp-program-empty {
    color: var(--cp-muted);
    font-size: 13px;
    font-weight: 600;
    padding: 12px 4px 2px;
}

.cp-check-row {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: 18px minmax(0, 1fr);
}

.cp-check-row input {
    accent-color: #4d63c9;
    height: 16px;
    margin: 0;
    width: 16px;
}

.cp-check-row label {
    color: #203047;
    font-weight: 600;
    line-height: 1.45;
    margin: 0;
}

.cp-form-actions {
    align-items: center;
    background: #fbfdff;
    border-top: 1px solid #e6edf5;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
    padding: 18px 28px;
    position: sticky;
    bottom: 0;
    z-index: 2;
}

.cp-modal-open {
    overflow: hidden;
}

.cp-modal[hidden] {
    display: none;
}

.cp-modal {
    align-items: stretch;
    background: rgba(22, 29, 43, .58);
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    padding: clamp(14px, 2vw, 28px);
    position: fixed;
    right: 0;
    top: 0;
    z-index: 11000;
}

.cp-modal__dialog {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    height: min(94vh, 980px);
    margin: auto;
    max-height: none;
    max-width: 1740px;
    overflow: hidden;
    width: min(98vw, 1740px);
}

.cp-modal__head,
.cp-modal__foot {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 18px clamp(22px, 3vw, 36px);
}

.cp-modal__head {
    border-bottom: 1px solid #e6edf5;
}

.cp-modal__foot {
    border-top: 1px solid #e6edf5;
    color: var(--cp-muted);
    font-size: 13px;
}

.cp-modal__title {
    color: var(--cp-ink);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0;
    margin: 0;
}

.cp-modal__subtitle {
    color: var(--cp-muted);
    font-size: 13px;
    margin: 6px 0 0;
}

.cp-modal__body {
    border-left: 0;
    border-radius: 0;
    border-right: 0;
}

.cp-modal__body.cp-charter-content {
    border-bottom: 0;
    border-top: 0;
    font-size: 15px;
    max-height: none;
    min-height: 0;
    padding: 24px clamp(24px, 3vw, 44px);
}

.cp-pagination {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: center;
    margin-top: 24px;
}

.cp-pagination__label {
    color: var(--cp-muted);
    font-weight: 700;
}

.cp-empty-state {
    background: var(--cp-panel);
    border: 1px dashed #b9c4d4;
    border-radius: 8px;
    margin-top: 18px;
    padding: 32px;
    text-align: center;
}

.cp-empty-state--error {
    border-color: #f1b8c0;
    background: #fff7f8;
}

.cp-empty-state--restricted {
    background: linear-gradient(135deg, #f8fbff 0%, #ffffff 62%, #eef8f4 100%);
    border: 1px solid #c9dced;
    box-shadow: 0 14px 34px rgba(20, 37, 63, 0.07);
}

.cp-empty-state h2 {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 8px;
}

.cp-empty-state p {
    color: var(--cp-muted);
    margin: 0 auto 16px;
    max-width: 620px;
}

.cp-empty-state__actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}

@media (max-width: 1180px) {
    .cp-catalog-hero,
    .cp-search-row,
    .cp-lookup-search-row {
        grid-template-columns: 1fr;
    }

    .cp-review-submit-panel {
        grid-template-columns: 1fr;
    }

    .cp-catalog-hero__stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cp-filter-actions {
        justify-content: flex-start;
    }

    .cp-viewer-topbar {
        grid-template-columns: 1fr;
    }

    .cp-viewer-actions {
        justify-content: flex-start;
        width: 100%;
    }

    .cp-upload-hero,
    .cp-form-grid,
    .cp-lookup-form-grid,
    .cp-charter-brief,
    .cp-program-toolbar {
        grid-template-columns: 1fr;
    }

    .cp-lookup-form-grid .cp-search-field:first-child {
        grid-column: auto;
    }

    .cp-lookup-row {
        grid-template-columns: 1fr;
    }

    .cp-lookup-row__action {
        justify-content: flex-start;
    }

    .cp-upload-side,
    .cp-form-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 700px) {
    .cp-catalog {
        padding-top: 18px;
    }

    .cp-catalog-hero,
    .cp-filter-panel,
    .cp-resource-card {
        padding: 16px;
    }

    .cp-upload-hero {
        padding: 18px;
    }

    .cp-catalog-hero__stats,
    .cp-resource-grid,
    .cp-lookup-grid {
        grid-template-columns: 1fr;
    }

    .cp-results-head,
    .cp-card-actions,
    .cp-pagination {
        align-items: stretch;
        flex-direction: column;
    }

    .cp-open-button,
    .cp-lookup-read-button,
    .cp-review-submit-button,
    .cp-viewer-actions .btn,
    .cp-pagination .btn {
        width: 100%;
    }

    .cp-lookup-row {
        padding: 16px;
    }

    .cp-lookup-row__title {
        font-size: 20px;
    }

    .cp-viewer-topbar,
    .cp-viewer-framewrap {
        padding: 12px;
    }

    .cp-viewer-stats {
        align-items: stretch;
        flex-direction: column;
    }

    .cp-viewer-stat {
        width: 100%;
    }

    .cp-viewer-frame {
        height: 72vh;
    }

    .cp-upload-side .btn,
    .cp-form-actions .btn,
    .cp-course-upload-button {
        width: 100%;
    }

    .cp-course-upload-card {
        align-items: stretch;
        flex-direction: column;
    }

    .cp-course-upload-card .cp-action-hint {
        flex-basis: auto;
    }

    .cp-form-grid {
        padding: 16px;
    }

    .cp-lookup-section__header,
    .cp-lookup-section__body {
        padding: 16px;
    }

    .cp-form-section-title {
        padding: 14px 16px;
    }

    .cp-program-list {
        max-height: 300px;
    }

    .cp-charter-brief {
        margin: 16px;
    }

    .cp-charter-section .cp-check-row {
        margin-left: 16px;
        margin-right: 16px;
    }

    .cp-modal {
        padding: 10px;
    }

    .cp-modal__dialog {
        height: calc(100vh - 20px);
        max-height: calc(100vh - 20px);
        width: 100%;
    }

    .cp-modal__head,
    .cp-modal__foot {
        align-items: stretch;
        flex-direction: column;
    }

    .cp-modal__head .btn,
    .cp-modal__foot .btn {
        width: 100%;
    }
}