/* ═══════════════════════════════════════════════════════════════════
   平台运营控制台 — 页面特有样式（复用 workbench-shell.css 令牌）
   ═══════════════════════════════════════════════════════════════════ */
/* 面板切换 */
.cop-panel { display:none; }
.cop-panel.active { display:block; }
/* 卡片数字 */
.cop-card-value { font-size:32px; color:var(--wb-text); }
/* Section */
.cop-section { margin-top:18px; }
.cop-section h2 { margin:0 0 .5rem; font-size:17px; color:var(--wb-text); }
.cop-section h3 { margin:0 0 .4rem; font-size:15px; color:var(--wb-text-secondary); }
/* 内容列表 */
.cop-list { list-style:none; padding:0; margin:0; }
.cop-list .cop-list-row { display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--wb-muted); }
.cop-list .cop-list-label { flex:1; font-weight:700; color:var(--wb-text); font-size:14px; }
.cop-list .cop-list-meta { display:flex; flex-wrap:wrap; gap:8px; }
.cop-list .cop-list-meta span { border:1px solid var(--wb-border-strong); border-radius:var(--wb-radius-full); padding:2px 10px; font-size:12px; color:var(--wb-text-muted); background:var(--wb-bg); }
/* 网格 */
.cop-grid { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:12px; margin-bottom:14px; }
.cop-grid.two { grid-template-columns:1fr 1fr; }
/* 卡片 */
.cop-card { background:var(--wb-surface); border:1px solid var(--wb-border); border-radius:var(--wb-radius-lg); padding:16px; box-shadow:var(--wb-shadow-sm); }
.cop-card-label { margin:0 0 4px; font-size:12px; color:var(--wb-text-muted); font-weight:600; }
/* 辅助 */
.cop-muted { color:var(--wb-text-muted); font-size:13px; }
.cop-callout { background:var(--wb-bg); border:1px solid var(--wb-border); border-radius:var(--wb-radius-lg); padding:16px; }
/* Hero */
.cop-hero {
    display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:center;
    border-bottom:1px solid var(--wb-border); padding:22px;
    background:radial-gradient(circle at 12% 18%, var(--wb-primary-ghost), transparent 26%), linear-gradient(135deg, rgba(255,255,255,.96) 0%, rgba(242,242,239,.92) 100%);
    box-shadow:0 14px 32px rgba(31,31,29,.06);
}
.cop-kicker { margin:0 0 8px; color:var(--wb-primary); font-weight:800; font-size:13px; letter-spacing:.08em; }
.cop-hero h2 { margin:0; font-size:32px; line-height:1.2; color:var(--wb-text); }
.cop-hero p { margin:10px 0 0; max-width:760px; color:var(--wb-text-muted); line-height:1.75; }
.cop-primary { border:0; border-radius:var(--wb-radius-full); background:var(--wb-primary); color:#fff; cursor:pointer; padding:14px 18px; font-size:15px; font-weight:800; white-space:nowrap; box-shadow:0 14px 30px rgba(31,31,29,.18); }
.cop-primary:hover { background:var(--wb-primary-hover); }
/* 前场 */
.cop-frontstage { margin:12px 14px 0; border:1px solid var(--wb-border); border-radius:18px; background:linear-gradient(135deg,var(--wb-surface) 0%,var(--wb-bg) 100%); padding:16px; box-shadow:var(--wb-shadow-lg); }
.cop-frontstage-grid { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px; align-items:center; }
.cop-frontstage-role { margin:0 0 6px; color:var(--wb-primary); font-size:13px; font-weight:800; letter-spacing:.06em; }
.cop-frontstage h2 { margin:0; font-size:24px; color:var(--wb-text); }
.cop-frontstage p { margin:8px 0 0; color:var(--wb-text-muted); line-height:1.65; }
.cop-frontstage-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.cop-frontstage-secondary, .cop-frontstage-path button { border:1px solid var(--wb-border-strong); border-radius:var(--wb-radius-full); background:var(--wb-surface); color:var(--wb-text-secondary); cursor:pointer; padding:10px 13px; font-weight:800; }
.cop-frontstage-path { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.cop-expand-toggle { display:block; width:100%; margin:.75rem 0 0; padding:.5rem 1rem; background:none; border:1px dashed var(--wb-border); border-radius:6px; color:var(--wb-text-muted); cursor:pointer; font-size:.85rem; text-align:center; transition:background var(--wb-transition-fast); }
.cop-expand-toggle:hover { background:var(--wb-muted); }
/* Workspace Switcher */
.cop-ws-switcher { position:sticky; top:0; z-index:50; display:flex; align-items:center; gap:4px; padding:6px 14px; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); border-bottom:1px solid var(--wb-border-light); }
.cop-ws-label { font-size:11px; color:var(--wb-text-sub); margin-right:6px; white-space:nowrap; }
.cop-ws-pill { display:inline-flex; align-items:center; gap:5px; padding:3px 12px; border-radius:20px; font-size:12px; font-weight:500; text-decoration:none; color:var(--wb-text-secondary); background:var(--wb-sidebar-bg); border:1px solid transparent; transition:all var(--wb-transition-fast); white-space:nowrap; }
.cop-ws-pill:hover { background:var(--wb-primary-light); color:var(--wb-primary); }
.cop-ws-pill.active { background:var(--wb-primary); color:#fff; }
.cop-ws-dot { width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.5; flex-shrink:0; }
/* Filter btn */
.cop-filter-btn { padding:.35rem .85rem; border:1.5px solid var(--wb-border); border-radius:99px; background:transparent; color:var(--wb-text); cursor:pointer; font-size:.82rem; transition:background var(--wb-transition-fast), border-color var(--wb-transition-fast), color var(--wb-transition-fast); }
.cop-filter-btn.active, .cop-filter-btn:hover { background:var(--wb-primary); border-color:var(--wb-primary); color:#fff; }
/* 行动表单 */
.cop-action-form { background:var(--wb-muted); border:1px solid var(--wb-border); border-radius:var(--wb-radius-lg); padding:16px; }
.cop-action-form fieldset { border:0; margin:0 0 12px; padding:0; display:flex; flex-wrap:wrap; gap:12px; }
.cop-action-form legend { font-weight:800; font-size:14px; color:var(--wb-text); margin-bottom:6px; }
.cop-action-form label { display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--wb-text-muted); font-weight:600; }
.cop-action-form input, .cop-action-form select, .cop-action-form textarea { border:1px solid var(--wb-border-strong); border-radius:var(--wb-radius-sm); padding:6px 10px; font-size:13px; background:var(--wb-surface); }
.cop-action-form button[type="submit"] { border:0; border-radius:var(--wb-radius-full); background:var(--wb-primary); color:#fff; cursor:pointer; padding:8px 18px; font-weight:800; }
/* 审核队列 */
.cop-review-queue { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }
.cop-review-queue-col { background:var(--wb-surface); border:1px solid var(--wb-border); border-radius:var(--wb-radius-md); padding:12px; }
/* Responsive */
/* 全局导航偏移：course-admin 嵌在 base.html _partial_nav 下方 */
.wb-shell.has-global-nav,
.cop-shell.has-global-nav {
    padding-top: 0; /* 导航高度由 wb-shell 的 h-screen 内化 */
}
.cop-shell {
    display:grid; grid-template-columns:240px 1fr; height:100vh; overflow:hidden;
}
.cop-sidebar {
    background:var(--wb-sidebar-bg,#f4f3f0); border-right:1px solid var(--wb-border,#e6e4df);
    overflow-y:auto; padding:0;
}
.cop-content {
    overflow-y:auto; padding:0;
}
@media (max-width:860px) {
    .cop-shell { grid-template-columns:1fr; height:auto; min-height:calc(100vh - 64px); overflow:visible; }
    .cop-sidebar { position:relative; top:auto; height:auto; border-right:0; border-bottom:1px solid var(--wb-border); overflow-x:auto; }
    .cop-content { height:auto; }
    .cop-hero, .cop-frontstage-grid, .cop-grid.two { grid-template-columns:1fr; }
    .cop-frontstage { margin:10px 12px 0; }
    .cop-frontstage-actions { justify-content:flex-start; }
}
    .cop-action-form label {
        display: grid;
        gap: 4px;
        color: #5f5d58;
        font-size: 12px;
        font-weight: 800;
    }
    .cop-action-form input,
    .cop-action-form select,
    .cop-action-form textarea {
        width: 100%;
        border: 1px solid #d8d5cc;
        border-radius: 10px;
        padding: 9px 10px;
        color: #1f1f1d;
        background: #fff;
        font: inherit;
    }
    .cop-action-form button {
        width: max-content;
        border: 0;
        border-radius: 999px;
        padding: 10px 14px;
        background: #5f55d6;
        color: #fff;
        cursor: pointer;
        font-weight: 800;
    }
    .cop-panel {
        display: none;
        margin-top: 0;
        padding: 12px 14px 14px;
    }
    .cop-panel.active {
        display: block;
    }
    .cop-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 10px;
    }
    .cop-grid.two {
        grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
    }
    .cop-card,
    .cop-section {
        border: 1px solid #e6e4df;
        border-radius: 14px;
        background: #fff;
        padding: 14px;
        box-shadow: 0 10px 24px rgba(31,31,29,.04);
    }
    .cop-card-label {
        margin: 0 0 8px;
        color: #6f6d68;
        font-size: 13px;
    }
    .cop-card-value {
        font-size: 30px;
        color: #1f1f1d;
        line-height: 1;
    }
    .cop-section {
        margin-top: 10px;
    }
    .cop-section h2 {
        margin: 0 0 12px;
        font-size: 20px;
        color: #1f1f1d;
    }
    .cop-section h3 {
        margin: 0 0 10px;
        font-size: 15px;
        color: #1f1f1d;
    }
    .cop-list {
        display: grid;
        gap: 10px;
    }
    .cop-item {
        border: 1px solid #e6e4df;
        border-radius: 12px;
        padding: 13px;
        background: #fbfbfa;
    }
    .cop-item h3 {
        margin: 0 0 6px;
        font-size: 15px;
        color: #1f1f1d;
    }
    .cop-item p {
        margin: 0;
        color: #6f6d68;
        font-size: 13px;
        line-height: 1.6;
    }
    .cop-chip-row {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 8px;
    }
    .cop-chip {
        border-radius: 999px;
        background: #f2f2ef;
        color: #6f6d68;
        padding: 4px 8px;
        font-size: 12px;
    }
    .cop-muted {
        color: #6f6d68;
    }
    .cop-playbook {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(240px, .45fr);
        gap: 10px;
        margin-top: 10px;
    }
    .cop-callout {
        border: 1px solid #dfdcd4;
        border-radius: 16px;
        background: linear-gradient(135deg, #fff 0%, #f7f6f1 100%);
        padding: 16px;
    }
    .cop-callout h2 {
        margin: 0 0 8px;
        font-size: 20px;
        color: #1f1f1d;
    }
    .cop-callout p {
        margin: 0;
        color: #5f5d58;
        line-height: 1.75;
    }
    .cop-path {
        counter-reset: cop-step;
    }
    .cop-path .cop-item h3::before {
        counter-increment: cop-step;
        content: counter(cop-step);
        display: inline-flex;
        width: 22px;
        height: 22px;
        margin-right: 8px;
        border-radius: 999px;
        align-items: center;
        justify-content: center;
        background: #1f1f1d;
        color: #fff;
        font-size: 12px;
        vertical-align: 1px;
    }
    @media (max-width: 860px) {
        body {
            overflow: auto;
        }
        .cop-shell {
            grid-template-columns: 1fr;
            height: auto;
            min-height: calc(100vh - 64px);
            overflow: visible;
        }
        .cop-sidebar {
            position: relative;
            top: auto;
            height: auto;
            border-right: 0;
            border-bottom: 1px solid #e6e4df;
            overflow-x: auto;
        }
        .cop-content {
            height: auto;
        }
        .cop-hero,
        .cop-playbook,
        .cop-frontstage-grid,
        .cop-grid.two {
            grid-template-columns: 1fr;
        }
        .cop-frontstage {
            margin: 10px 12px 0;
        }
        .cop-frontstage-actions {
            justify-content: flex-start;
        }
        .cop-brand p {
            display: none;
        }
        .cop-nav-button {
            min-width: 128px;
        }
    }
    .cop-expand-toggle {
        display: block;
        width: 100%;
        margin: 0.75rem 0 0;
        padding: 0.5rem 1rem;
        background: none;
        border: 1px dashed var(--cop-border, #ddd);
        border-radius: 6px;
        color: var(--cop-muted, #666);
        cursor: pointer;
        font-size: 0.85rem;
        text-align: center;
        transition: background 0.15s;
    }
    .cop-expand-toggle:hover { background: var(--cop-hover, #f5f5f5); }
/* Phase 2: Course market, drawer, filter buttons, provider materials */
.cop-filter-btn {
    padding: .35rem .85rem;
    border: 1.5px solid var(--cop-border, #e2e8f0);
    border-radius: 99px;
    background: transparent;
    color: var(--cop-fg, #1a202c);
    cursor: pointer;
    font-size: .82rem;
    transition: background .15s, border-color .15s, color .15s;
}
.cop-filter-btn.active,
.cop-filter-btn:hover {
    background: var(--cop-accent, #3b82f6);
    border-color: var(--cop-accent, #3b82f6);
    color: #fff;
}
.cop-course-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
}
/* Drawer */
.cop-drawer {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: 380px;
    max-width: 95vw;
    background: #fff;
    border-left: 1.5px solid var(--cop-border, #e2e8f0);
    box-shadow: -4px 0 24px rgba(0,0,0,.1);
    z-index: 200;
    transform: translateX(110%);
    transition: transform .2s ease;
    display: flex;
    flex-direction: column;
}
.cop-drawer[aria-hidden="false"] { transform: translateX(0); }
.cop-drawer-inner { padding: 1.5rem; flex: 1; overflow-y: auto; position: relative; }
.cop-drawer-close {
    position: absolute;
    top: 1rem; right: 1rem;
    background: none;
    border: none;
    font-size: 1.2rem;
    cursor: pointer;
    color: #64748b;
}
.cop-drawer-actions { padding: 1rem 1.5rem; border-top: 1px solid var(--cop-border, #e2e8f0); }
/* Material checklist */
.cop-material-item {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    padding: .6rem 0;
    border-bottom: 1px solid #f1f5f9;
}
.cop-material-item .cop-material-icon { font-size: 1.1rem; flex-shrink: 0; margin-top: .05rem; }
.cop-material-required { color: #e03e2d; font-size: .72rem; font-weight: 600; }
.cop-material-optional { color: #64748b; font-size: .72rem; }

/* ===== Wave C: onboarding step active states ===== */
.cop-onboarding-steps {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    margin-bottom: .5rem;
}
.cop-onboarding-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .3rem;
}
.cop-onboarding-step-circle {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #f4f3f0;
    border: 2px solid #e6e4df;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .78rem;
    font-weight: 700;
    color: #8c8a83;
    transition: background .3s, color .3s, border-color .3s;
}
.cop-onboarding-step-circle.active { background: #3b82f6; color: #fff; border-color: #3b82f6; }
.cop-onboarding-step-circle.done { background: #16a34a; color: #fff; border-color: #16a34a; }
.cop-onboarding-step-label {
    font-size: .78rem;
    color: #585650;
    white-space: nowrap;
}
.cop-onboarding-step-connector {
    width: 40px;
    height: 2px;
    background: #e6e4df;
    margin: 0 .5rem;
    flex-shrink: 0;
}
.cop-onboarding-step-connector.done { background: #16a34a; }

/* ===== Wave C: review queue ===== */
.cop-review-queue {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.cop-review-queue-col {
    background: #fff;
    border: 1px solid #e6e4df;
    border-radius: 12px;
    padding: 1rem;
}
.cop-review-queue-col h3 { margin: 0 0 .6rem; font-size: .85rem; color: #8c8a83; }
.cop-review-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .6rem 0;
    border-bottom: 1px solid #f4f3f0;
}
.cop-review-item:last-child { border-bottom: 0; }
.cop-review-actions { display: flex; gap: .35rem; }
.cop-review-action-btn {
    font-size: .7rem;
    font-weight: 700;
    padding: .25rem .65rem;
    border-radius: 999px;
    border: 1.5px solid;
    cursor: pointer;
    background: #fff;
    transition: background .15s, color .15s;
}
.cop-review-action-btn.approve { border-color: #16a34a; color: #16a34a; }
.cop-review-action-btn.approve:hover { background: #16a34a; color: #fff; }
.cop-review-action-btn.rework { border-color: #d97706; color: #d97706; }
.cop-review-action-btn.rework:hover { background: #d97706; color: #fff; }
.cop-review-action-btn.reject { border-color: #dc2626; color: #dc2626; }
.cop-review-action-btn.reject:hover { background: #dc2626; color: #fff; }

/* ===== Wave B: course cards ===== */
.cop-course-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
    margin-top: .5rem;
}
.cop-course-card {
    background: #fff;
    border: 1.5px solid #e6e4df;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow .15s, border-color .15s, transform .15s;
    cursor: pointer;
}
.cop-course-card:hover {
    box-shadow: 0 6px 24px rgba(95,85,214,.10);
    border-color: #c4bff2;
    transform: translateY(-2px);
}
.cop-course-card-cover {
    width: 100%;
    height: 140px;
    background: linear-gradient(135deg, #eceaff 0%, #f4f3f0 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #5f55d6;
    font-size: 2.2rem;
}
.cop-course-card-body {
    padding: .85rem 1rem 1rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: .35rem;
}
.cop-course-card h3 { margin: 0; font-size: .85rem; font-weight: 700; color: #292824; line-height: 1.35; }
.cop-course-card-tags { display: flex; flex-wrap: wrap; gap: .35rem; }
.cop-course-card-tag {
    font-size: .65rem;
    font-weight: 600;
    padding: .15rem .5rem;
    border-radius: 999px;
    background: #eceaff;
    color: #5f55d6;
}
.cop-course-card-tag.age { background: #f0fdf4; color: #166534; }
.cop-course-card-tag.runtime { background: #fef3c7; color: #92400e; }
.cop-course-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: auto;
    padding-top: .5rem;
    border-top: 1px solid #f1f5f9;
}
.cop-course-card-provider { font-size: .7rem; color: #8c8a83; }
.cop-course-card-apply-btn {
    font-size: .7rem;
    font-weight: 700;
    padding: .3rem .75rem;
    border-radius: 999px;
    border: 1.5px solid #5f55d6;
    background: #fff;
    color: #5f55d6;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.cop-course-card-apply-btn:hover { background: #5f55d6; color: #fff; }

/* ===== Wave B: course catalog filter ===== */
.cop-market-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem;
    margin: .5rem 0 .8rem;
}
.cop-filter-chip-label { font-size: .72rem; color: #8c8a83; margin-right: .2rem; }
.cop-filter-chip {
    font-size: .72rem;
    font-weight: 600;
    padding: .25rem .65rem;
    border-radius: 999px;
    background: #f4f3f0;
    border: 1.5px solid transparent;
    cursor: pointer;
    color: #585650;
    transition: background .15s, color .15s, border-color .15s;
}
.cop-filter-chip:hover { background: #eceaff; color: #5f55d6; }
.cop-filter-chip.active { background: #5f55d6; color: #fff; border-color: #5f55d6; }

/* ===== Wave D: progress bar ===== */
.cop-progress-bar { height: 6px; background: #e6e4df; border-radius: 999px; overflow: hidden; }
.cop-progress-fill { height: 100%; background: #3b82f6; border-radius: 999px; transition: width .3s ease; }
.cop-training-badge { font-size: .72rem; font-weight: 600; padding: .15rem .5rem; border-radius: 999px; }
.cop-training-badge.done { background: #dcfce7; color: #166534; }
.cop-training-badge.active { background: #dbeafe; color: #1e40af; }

/* ===== Wave B: my courses ===== */
.cop-my-courses-groups { display: flex; flex-direction: column; gap: .8rem; }
.cop-my-courses-group h3 { font-size: .78rem; color: #8c8a83; margin: 0 0 .4rem; }

/* Drawer cover */
.cop-drawer-cover { width: 100%; height: 180px; display: flex; align-items: center; justify-content: center; border-radius: 12px; margin-bottom: 8px; }

/* ===== Wave B: drawer ===== */
.cop-drawer {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: 380px;
    max-width: 95vw;
    background: #fff;
    border-left: 1.5px solid var(--cop-border, #e2e8f0);
    box-shadow: -4px 0 24px rgba(0,0,0,.1);
    z-index: 200;
    transform: translateX(110%);
    transition: transform .2s ease;
    display: flex;
    flex-direction: column;
}
.cop-drawer[aria-hidden="false"] { transform: translateX(0); }
.cop-drawer-inner { padding: 1.5rem; flex: 1; overflow-y: auto; position: relative; }
.cop-drawer-close {
    position: absolute;
    top: 1rem; right: 1rem;
    background: none;
    border: none;
    font-size: 1.2rem;
    cursor: pointer;
    color: #64748b;
}
.cop-drawer-actions { padding: 1rem 1.5rem; border-top: 1px solid var(--cop-border, #e2e8f0); }
.cop-drawer-section { margin-bottom: 1.5rem; }
.cop-drawer-section h4 { font-size: .78rem; color: #8c8a83; margin: 0 0 .3rem; }
.cop-drawer-section p { margin: 0; font-size: .82rem; color: #292824; }
.cop-drawer-commitment { color: #16a34a; font-size: .75rem; }

/* ===== Material checklist ===== */
.cop-material-item {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    padding: .6rem 0;
    border-bottom: 1px solid #f1f5f9;
}
.cop-material-item .cop-material-icon { font-size: 1.1rem; flex-shrink: 0; margin-top: .05rem; }
.cop-material-required { color: #e03e2d; font-size: .72rem; font-weight: 600; }
.cop-material-optional { color: #64748b; font-size: .72rem; }

/* ===== Wave E: certificate cards ===== */
.cop-cert-card {
    display: flex;
    align-items: center;
    gap: .75rem;
    background: #fff;
    border: 1px solid #e6e4df;
    border-radius: 12px;
    padding: .9rem 1rem;
    margin-bottom: .6rem;
    transition: box-shadow .15s;
}
.cop-cert-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,.06); }
.cop-cert-card-badge { font-size: 1.8rem; flex-shrink: 0; }
.cop-cert-card-body { flex: 1; min-width: 0; }
.cop-cert-card-body h4 { margin: 0 0 .15rem; font-size: .85rem; color: #292824; }
.cop-cert-card-meta { margin: 0; font-size: .72rem; color: #8c8a83; }
.cop-cert-card-actions { display: flex; gap: .35rem; flex-shrink: 0; }
.cop-cert-action-btn {
    font-size: .7rem;
    font-weight: 700;
    padding: .25rem .65rem;
    border-radius: 999px;
    border: 1.5px solid #c4bff2;
    background: #fff;
    color: #5f55d6;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s, color .15s;
}
.cop-cert-action-btn:hover { background: #5f55d6; color: #fff; }
.cop-cert-action-btn.download { border-color: #16a34a; color: #16a34a; }
.cop-cert-action-btn.download:hover { background: #16a34a; color: #fff; }

/* ── Workspace Switcher ─────────────────────────────────────── */
.cop-ws-switcher {
    position: sticky;
    top: 0;
    z-index: 200;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid #ece9e3;
    margin-bottom: 0;
}
.cop-ws-label { font-size: 11px; color: #8c8a83; margin-right: 6px; white-space: nowrap; }
.cop-ws-pill {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 3px 12px; border-radius: 20px; font-size: 12px; font-weight: 500;
    text-decoration: none; color: #585650; background: #f4f3f0;
    border: 1px solid transparent; transition: all .15s; white-space: nowrap;
}
.cop-ws-pill:hover { background: #eceaff; color: #3e3794; }
.cop-ws-pill.active { background: #5f55d6; color: #fff; border-color: #4a41c0; }
.cop-ws-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .5; flex-shrink: 0; }