/* ================================================================
   Physics Assessment Console · Admin Stylesheet
   Aesthetic: Technical Editorial — 深墨蓝 × 温暖纸白 × 电子蓝
   Typography: Instrument Serif (display) / IBM Plex Sans (UI) / IBM Plex Mono (data)
   ================================================================ */

/* ---------- Tokens ---------- */
:root {
    /* Brand */
    --c-primary: #1E88E5;
    --c-primary-600: #1565C0;
    --c-primary-700: #0D47A1;
    --c-primary-soft: rgba(30, 136, 229, 0.10);
    --c-primary-line: rgba(30, 136, 229, 0.22);
    --c-accent: #F59E0B;
    --c-accent-soft: rgba(245, 158, 11, 0.14);

    /* Ink */
    --c-ink: #0F1B2D;
    --c-ink-2: #24344D;
    --c-ink-3: #5A6B84;
    --c-ink-4: #8B9BB0;
    --c-ink-inverse: #F5F1E8;

    /* Paper */
    --c-paper: #F7F4ED;
    --c-paper-2: #FFFEFA;
    --c-paper-3: #EFEBE0;
    --c-line: #E2DCCE;
    --c-line-strong: #C9C1AE;

    /* Sidebar (deep ink) */
    --c-side: #0A1424;
    --c-side-2: #0F1D33;
    --c-side-line: rgba(255, 255, 255, 0.07);
    --c-side-ink: #A9BCD6;
    --c-side-ink-dim: #6A7F9E;

    /* Status */
    --c-success: #16A34A;
    --c-danger: #DC2626;
    --c-warning: #D97706;

    /* Level colors */
    --lv-A: #1E88E5;
    --lv-B: #14B8A6;
    --lv-C: #F59E0B;
    --lv-D: #EF4444;

    /* Type */
    --f-display: "Instrument Serif", "Noto Serif SC", Georgia, serif;
    --f-ui: "IBM Plex Sans", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
    --f-mono: "IBM Plex Mono", "SF Mono", Menlo, Consolas, monospace;

    /* Space */
    --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
    --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px;

    /* Shape */
    --r-sm: 4px; --r-md: 8px; --r-lg: 14px; --r-xl: 20px;

    /* Shadow */
    --sh-1: 0 1px 2px rgba(15, 27, 45, 0.05), 0 1px 3px rgba(15, 27, 45, 0.04);
    --sh-2: 0 2px 6px rgba(15, 27, 45, 0.06), 0 8px 24px rgba(15, 27, 45, 0.05);
    --sh-3: 0 10px 30px rgba(15, 27, 45, 0.10), 0 30px 60px rgba(15, 27, 45, 0.08);
    --sh-glow: 0 0 0 3px rgba(30, 136, 229, 0.18);

    --sidebar-w: 248px;
    --topbar-h: 62px;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
    font-family: var(--f-ui);
    font-size: 14px;
    line-height: 1.55;
    color: var(--c-ink);
    background: var(--c-paper);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}
button { font-family: inherit; cursor: pointer; }
input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { margin: 0; font-weight: 500; letter-spacing: -0.01em; }
p { margin: 0; }
table { border-collapse: collapse; width: 100%; }

.mono { font-family: var(--f-mono); font-feature-settings: "tnum" 1, "zero" 1; }
.serif-italic {
    font-family: var(--f-display);
    font-style: italic;
    font-weight: 400;
    color: var(--c-primary);
    letter-spacing: 0;
    padding: 0 2px;
}

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(15, 27, 45, 0.15); border-radius: 10px; border: 2px solid var(--c-paper); }
::-webkit-scrollbar-thumb:hover { background: rgba(15, 27, 45, 0.28); }

/* ================================================================
   LOGIN VIEW
   ================================================================ */
.login-view {
    position: fixed; inset: 0;
    display: grid; place-items: center;
    background: linear-gradient(140deg, #0A1424 0%, #122A47 55%, #0D3D6E 100%);
    padding: var(--s-6);
    overflow: hidden;
}
.login-backdrop { position: absolute; inset: 0; pointer-events: none; }
.grid-overlay {
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 40px 40px;
    mask-image: radial-gradient(ellipse at 50% 40%, #000 30%, transparent 75%);
}
.orbit {
    position: absolute; border-radius: 50%;
    border: 1px solid rgba(143, 199, 250, 0.18);
    animation: orbit-spin 60s linear infinite;
}
.orbit-a { width: 640px; height: 640px; right: -180px; top: -180px; }
.orbit-b { width: 460px; height: 460px; left: -140px; bottom: -140px; animation-duration: 90s; animation-direction: reverse; border-color: rgba(245, 158, 11, 0.14); }
.orbit::before {
    content: ""; position: absolute; width: 8px; height: 8px; border-radius: 50%;
    background: var(--c-primary); box-shadow: 0 0 20px var(--c-primary);
    top: 20px; left: 50%; transform: translateX(-50%);
}
.orbit-b::before { background: var(--c-accent); box-shadow: 0 0 20px var(--c-accent); }
@keyframes orbit-spin { to { transform: rotate(360deg); } }

.login-card {
    position: relative;
    width: 100%; max-width: 420px;
    background: rgba(10, 20, 36, 0.72);
    backdrop-filter: blur(28px) saturate(160%);
    -webkit-backdrop-filter: blur(28px) saturate(160%);
    border: 1px solid rgba(143, 199, 250, 0.18);
    border-radius: var(--r-xl);
    padding: var(--s-10) var(--s-8);
    color: var(--c-ink-inverse);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
    animation: card-in 700ms cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes card-in { from { opacity: 0; transform: translateY(24px) scale(0.98); } }

.login-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    font-family: var(--f-mono); font-size: 11px;
    letter-spacing: 0.12em; text-transform: uppercase;
    color: rgba(245, 241, 232, 0.55);
    padding: 5px 12px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
}
.login-title {
    font-size: 40px;
    line-height: 1.1;
    margin: var(--s-6) 0 var(--s-3);
    font-weight: 300;
    letter-spacing: -0.02em;
}
.login-title .serif-italic { color: var(--c-accent); padding-left: 8px; }
.login-sub {
    color: rgba(245, 241, 232, 0.55);
    font-size: 13px;
    line-height: 1.7;
    margin-bottom: var(--s-8);
}
.login-card .field-label {
    color: rgba(245, 241, 232, 0.6);
    font-family: var(--f-mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 8px;
    display: block;
}
.login-card input[type="password"] {
    width: 100%;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: var(--c-ink-inverse);
    padding: 12px 14px;
    border-radius: var(--r-md);
    outline: none;
    transition: all 200ms ease;
    font-family: var(--f-mono);
    font-size: 13px;
    letter-spacing: 0.04em;
}
.login-card input[type="password"]:focus {
    border-color: var(--c-primary);
    background: rgba(30, 136, 229, 0.08);
    box-shadow: 0 0 0 3px rgba(30, 136, 229, 0.2);
}
.login-error {
    margin-top: 12px;
    padding: 10px 12px;
    background: rgba(239, 68, 68, 0.12);
    border-left: 2px solid #EF4444;
    color: #FCA5A5;
    font-size: 12px;
    border-radius: 0 var(--r-sm) var(--r-sm) 0;
}
.login-card .btn-primary {
    margin-top: var(--s-6);
    background: var(--c-primary);
    color: #fff;
    border-color: var(--c-primary);
}
.login-card .btn-primary:hover { background: var(--c-primary-600); border-color: var(--c-primary-600); }
.login-foot {
    margin-top: var(--s-6);
    padding-top: var(--s-4);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    color: rgba(245, 241, 232, 0.35);
    font-size: 11px;
    text-align: center;
}
.dot-live {
    width: 6px; height: 6px; border-radius: 50%;
    background: #22C55E; box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.6);
    animation: pulse 2s ease-in-out infinite;
    display: inline-block;
}
@keyframes pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.5); }
    50% { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
}

/* ================================================================
   APP SHELL
   ================================================================ */
.app-view {
    display: grid;
    grid-template-columns: var(--sidebar-w) 1fr;
    min-height: 100vh;
    background:
        linear-gradient(var(--c-paper), var(--c-paper)) padding-box,
        radial-gradient(ellipse at top left, rgba(30, 136, 229, 0.06), transparent 60%),
        radial-gradient(ellipse at bottom right, rgba(245, 158, 11, 0.05), transparent 60%);
}

/* ---------- Sidebar ---------- */
.sidebar {
    position: sticky; top: 0;
    height: 100vh;
    background: linear-gradient(180deg, var(--c-side) 0%, var(--c-side-2) 100%);
    color: var(--c-side-ink);
    display: flex; flex-direction: column;
    padding: var(--s-6) var(--s-4);
    border-right: 1px solid rgba(0, 0, 0, 0.4);
    z-index: 20;
}
.sidebar::before {
    content: "";
    position: absolute; inset: 0;
    background-image: linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px);
    background-size: 100% 32px;
    pointer-events: none;
}
.brand { display: flex; align-items: center; gap: 12px; padding: 0 8px var(--s-6); position: relative; }
.brand::after {
    content: ""; position: absolute; left: 8px; right: 8px; bottom: 0;
    height: 1px; background: linear-gradient(90deg, transparent, rgba(143, 199, 250, 0.2), transparent);
}
.brand-mark { display: grid; place-items: center; animation: mark-spin 40s linear infinite; }
@keyframes mark-spin { to { transform: rotate(360deg); } }
.brand-title {
    font-family: var(--f-display);
    font-size: 22px;
    color: var(--c-ink-inverse);
    letter-spacing: -0.01em;
    line-height: 1;
}
.brand-sub {
    font-size: 9px;
    letter-spacing: 0.24em;
    color: var(--c-side-ink-dim);
    margin-top: 4px;
}

.nav { display: flex; flex-direction: column; gap: 4px; padding: var(--s-6) 0; flex: 1; position: relative; }
.nav-item {
    display: grid;
    grid-template-columns: 22px 20px 1fr;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    border-radius: var(--r-md);
    color: var(--c-side-ink);
    font-size: 13.5px;
    font-weight: 500;
    position: relative;
    transition: all 220ms cubic-bezier(0.16, 1, 0.3, 1);
    border: 1px solid transparent;
}
.nav-index { font-size: 10px; color: var(--c-side-ink-dim); letter-spacing: 0.08em; transition: color 220ms; }
.nav-ico { width: 18px; height: 18px; opacity: 0.75; transition: opacity 220ms, transform 220ms; }
.nav-item:hover { background: rgba(255, 255, 255, 0.04); color: var(--c-ink-inverse); }
.nav-item:hover .nav-ico { opacity: 1; transform: translateX(1px); }
.nav-item.is-active {
    background: linear-gradient(90deg, rgba(30, 136, 229, 0.16), rgba(30, 136, 229, 0.02));
    color: var(--c-ink-inverse);
    border-color: rgba(30, 136, 229, 0.25);
}
.nav-item.is-active .nav-index { color: var(--c-primary); }
.nav-item.is-active .nav-ico { opacity: 1; color: var(--c-primary); }
.nav-item.is-active::before {
    content: ""; position: absolute; left: -16px; top: 50%; transform: translateY(-50%);
    width: 3px; height: 22px; border-radius: 0 3px 3px 0;
    background: var(--c-primary);
    box-shadow: 0 0 12px var(--c-primary);
}

.sidebar-foot { padding-top: var(--s-4); border-top: 1px solid var(--c-side-line); position: relative; }
.status-line {
    display: flex; align-items: center; gap: 8px;
    font-size: 10.5px;
    color: var(--c-side-ink-dim);
    padding: 0 8px var(--s-3);
    letter-spacing: 0.05em;
}
.btn-logout {
    width: 100%;
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--r-md);
    color: var(--c-side-ink);
    font-size: 12.5px;
    transition: all 200ms;
}
.btn-logout:hover { background: rgba(239, 68, 68, 0.12); border-color: rgba(239, 68, 68, 0.3); color: #FCA5A5; }

/* ---------- Main ---------- */
.main { min-width: 0; display: flex; flex-direction: column; }

.topbar {
    position: sticky; top: 0;
    height: var(--topbar-h);
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 var(--s-8);
    background: rgba(247, 244, 237, 0.85);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid var(--c-line);
    z-index: 10;
}
.crumbs { display: flex; align-items: center; gap: 10px; font-size: 12.5px; }
.crumb-root { color: var(--c-ink-4); letter-spacing: 0.14em; font-size: 10.5px; }
.crumb-sep { color: var(--c-ink-4); }
.crumb-current { color: var(--c-ink); font-weight: 500; }
.topbar-right { display: flex; align-items: center; gap: var(--s-4); }
.clock {
    font-size: 11.5px;
    color: var(--c-ink-3);
    letter-spacing: 0.08em;
    padding: 5px 10px;
    background: var(--c-paper-2);
    border: 1px solid var(--c-line);
    border-radius: var(--r-sm);
}
.avatar {
    width: 32px; height: 32px; border-radius: 50%;
    display: grid; place-items: center;
    background: linear-gradient(140deg, var(--c-primary), var(--c-primary-700));
    color: #fff; font-weight: 600; font-size: 12px;
    letter-spacing: 0.05em;
    box-shadow: 0 2px 8px rgba(30, 136, 229, 0.35);
}

.content {
    padding: var(--s-8);
    flex: 1;
    background-image:
        linear-gradient(rgba(15, 27, 45, 0.028) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 27, 45, 0.028) 1px, transparent 1px);
    background-size: 32px 32px;
    background-position: -1px -1px;
}

/* ---------- Page head ---------- */
.page-head {
    display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-6);
    padding-bottom: var(--s-6);
    margin-bottom: var(--s-6);
    border-bottom: 1px solid var(--c-line);
    position: relative;
}
.page-head::after {
    content: ""; position: absolute; left: 0; bottom: -1px;
    width: 60px; height: 2px; background: var(--c-primary);
}
.eyebrow {
    font-size: 10px;
    letter-spacing: 0.22em;
    color: var(--c-ink-4);
    text-transform: uppercase;
    margin-bottom: 8px;
}
.page-title {
    font-size: 34px;
    line-height: 1.1;
    letter-spacing: -0.025em;
    font-weight: 400;
    color: var(--c-ink);
}
.page-desc { margin-top: 8px; color: var(--c-ink-3); font-size: 13.5px; max-width: 560px; }
.page-head-side { display: flex; align-items: center; gap: var(--s-3); }

/* ---------- Reveal animation ---------- */
.reveal {
    opacity: 0;
    transform: translateY(14px);
    animation: reveal 620ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
    animation-delay: var(--d, 0ms);
}
@keyframes reveal { to { opacity: 1; transform: none; } }

/* ---------- Buttons ---------- */
.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 9px 16px;
    border-radius: var(--r-md);
    border: 1px solid transparent;
    font-size: 13px; font-weight: 500;
    transition: all 200ms cubic-bezier(0.16, 1, 0.3, 1);
    white-space: nowrap;
    line-height: 1.2;
}
.btn svg { flex-shrink: 0; }
.btn-primary { background: var(--c-primary); color: #fff; border-color: var(--c-primary); box-shadow: 0 2px 6px rgba(30, 136, 229, 0.28); }
.btn-primary:hover { background: var(--c-primary-600); border-color: var(--c-primary-600); transform: translateY(-1px); box-shadow: 0 4px 14px rgba(30, 136, 229, 0.36); }
.btn-primary:active { transform: translateY(0); }
.btn-quiet { background: var(--c-paper-2); color: var(--c-ink-2); border-color: var(--c-line); }
.btn-quiet:hover { border-color: var(--c-primary); color: var(--c-primary); background: var(--c-primary-soft); }
.btn-danger { background: var(--c-danger); color: #fff; border-color: var(--c-danger); }
.btn-danger:hover { background: #B91C1C; border-color: #B91C1C; }
.btn-block { width: 100%; padding: 13px 16px; font-size: 14px; }
.btn:disabled { opacity: 0.55; cursor: not-allowed; transform: none !important; }

.icon-btn {
    width: 32px; height: 32px; border-radius: 50%;
    display: grid; place-items: center;
    background: transparent; border: 1px solid transparent;
    color: var(--c-ink-3); font-size: 14px;
    transition: all 180ms;
}
.icon-btn:hover { background: var(--c-paper-3); color: var(--c-ink); border-color: var(--c-line); }

.file-btn { position: relative; overflow: hidden; }

.link-arrow {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12.5px; color: var(--c-primary);
    font-weight: 500;
    transition: gap 200ms;
}
.link-arrow:hover { gap: 10px; }

/* ================================================================
   DASHBOARD
   ================================================================ */
.stat-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--s-4);
    margin-bottom: var(--s-6);
}
.stat-card {
    background: var(--c-paper-2);
    border: 1px solid var(--c-line);
    border-radius: var(--r-lg);
    padding: var(--s-5) var(--s-6);
    position: relative;
    overflow: hidden;
    transition: all 300ms cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: var(--sh-1);
}
.stat-card::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
    background: linear-gradient(90deg, var(--c-primary), transparent);
    opacity: 0.6;
}
.stat-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--sh-2);
    border-color: var(--c-primary-line);
}
.stat-card.stat-accent { background: linear-gradient(140deg, #0A1424, #122A47); color: var(--c-ink-inverse); border-color: #0A1424; }
.stat-card.stat-accent::before { background: linear-gradient(90deg, var(--c-accent), transparent); opacity: 1; }
.stat-card.stat-accent .stat-label { color: rgba(245, 241, 232, 0.6); }
.stat-card.stat-accent .stat-foot { color: rgba(245, 241, 232, 0.4); border-color: rgba(255, 255, 255, 0.08); }
.stat-card.stat-accent .trend.up { color: #4ADE80; }

.stat-label {
    font-size: 11.5px;
    color: var(--c-ink-3);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 10px;
}
.stat-value {
    font-size: 42px;
    line-height: 1;
    font-weight: 500;
    color: var(--c-ink);
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
}
.stat-card.stat-accent .stat-value { color: var(--c-accent); }
.stat-foot {
    display: flex; justify-content: space-between; align-items: center;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed var(--c-line);
    font-size: 10.5px;
    color: var(--c-ink-4);
    letter-spacing: 0.1em;
}
.trend { font-weight: 500; letter-spacing: 0.02em; font-size: 11px; }
.trend.up { color: var(--c-success); }
.trend.neutral { color: var(--c-ink-4); }

/* ---------- Panels ---------- */
.dash-row {
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: var(--s-4);
    margin-bottom: var(--s-6);
}
.panel {
    background: var(--c-paper-2);
    border: 1px solid var(--c-line);
    border-radius: var(--r-lg);
    padding: var(--s-6);
    box-shadow: var(--sh-1);
    margin-bottom: var(--s-6);
}
.dash-row .panel { margin-bottom: 0; }
.panel-head {
    display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s-4);
    margin-bottom: var(--s-5);
    padding-bottom: var(--s-4);
    border-bottom: 1px solid var(--c-line);
}
.panel-eyebrow { font-size: 9.5px; letter-spacing: 0.22em; color: var(--c-ink-4); margin-bottom: 6px; }
.panel-title { font-size: 17px; font-weight: 500; color: var(--c-ink); letter-spacing: -0.01em; }
.panel-hint { font-size: 10.5px; color: var(--c-ink-4); letter-spacing: 0.14em; }

.legend { display: flex; flex-wrap: wrap; gap: 10px 14px; justify-content: flex-end; max-width: 200px; }
.legend-item { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--c-ink-3); }
.legend-dot { width: 8px; height: 8px; border-radius: 2px; }
.legend-value { font-family: var(--f-mono); color: var(--c-ink); font-weight: 500; font-size: 11.5px; }

/* Donut */
.donut-wrap { position: relative; display: grid; place-items: center; padding: var(--s-4) 0; }
#level-donut { max-width: 100%; }
.donut-center { position: absolute; text-align: center; pointer-events: none; }
.donut-center-label { font-size: 9.5px; letter-spacing: 0.2em; color: var(--c-ink-4); }
.donut-center-value { font-size: 30px; font-weight: 500; color: var(--c-ink); letter-spacing: -0.02em; margin-top: 2px; }

/* Trend chart */
.chart-wrap { height: 220px; position: relative; }
#trend-chart { width: 100%; height: 100%; display: block; }

/* Module bars */
.module-bars { display: flex; flex-direction: column; gap: 12px; }
.module-bar {
    display: grid;
    grid-template-columns: 80px 1fr 60px;
    align-items: center;
    gap: 14px;
    font-size: 13px;
}
.module-name { color: var(--c-ink-2); font-weight: 500; }
.module-track { height: 8px; background: var(--c-paper-3); border-radius: 4px; overflow: hidden; position: relative; }
.module-fill {
    height: 100%; border-radius: 4px;
    background: linear-gradient(90deg, var(--c-primary), #4EA8F5);
    transform-origin: left;
    animation: fill 900ms cubic-bezier(0.16, 1, 0.3) forwards;
    transform: scaleX(0);
}
.module-fill[data-module="电学"] { background: linear-gradient(90deg, #F59E0B, #FBBF24); }
.module-fill[data-module="光学"] { background: linear-gradient(90deg, #14B8A6, #2DD4BF); }
.module-fill[data-module="热学"] { background: linear-gradient(90deg, #EF4444, #F87171); }
.module-fill[data-module="声学"] { background: linear-gradient(90deg, #8B5CF6, #A78BFA); }
@keyframes fill { to { transform: scaleX(1); } }
.module-score { text-align: right; font-family: var(--f-mono); color: var(--c-ink); font-weight: 500; font-size: 13px; font-variant-numeric: tabular-nums; }

/* ================================================================
   TABLES
   ================================================================ */
.toolbar {
    display: flex; justify-content: space-between; align-items: center; gap: var(--s-4);
    padding: var(--s-4) var(--s-5);
    background: var(--c-paper-2);
    border: 1px solid var(--c-line);
    border-radius: var(--r-lg) var(--r-lg) 0 0;
    border-bottom: none;
    flex-wrap: wrap;
}
.toolbar-group { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; }
.toolbar-count { font-size: 11.5px; color: var(--c-ink-3); letter-spacing: 0.06em; }

.chip-select {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 10px 6px 12px;
    background: var(--c-paper);
    border: 1px solid var(--c-line);
    border-radius: var(--r-md);
    font-size: 12.5px;
    transition: all 180ms;
}
.chip-select:hover { border-color: var(--c-primary-line); }
.chip-select:focus-within { border-color: var(--c-primary); box-shadow: var(--sh-glow); }
.chip-select > span {
    font-size: 10px; letter-spacing: 0.12em;
    color: var(--c-ink-4); text-transform: uppercase;
}
.chip-select select, .chip-select input {
    background: transparent; border: none; outline: none;
    font-size: 12.5px; color: var(--c-ink);
    padding: 2px 0;
    cursor: pointer;
    font-family: var(--f-ui);
}
.chip-select select { padding-right: 6px; }
.chip-date input { cursor: text; font-family: var(--f-mono); font-size: 12px; }

.search {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 7px 12px;
    background: var(--c-paper);
    border: 1px solid var(--c-line);
    border-radius: var(--r-md);
    color: var(--c-ink-4);
    transition: all 180ms;
    min-width: 260px;
}
.search:focus-within { border-color: var(--c-primary); box-shadow: var(--sh-glow); background: var(--c-paper-2); }
.search input {
    flex: 1; background: transparent; border: none; outline: none;
    font-size: 12.5px; color: var(--c-ink);
    min-width: 0;
}
.search input::placeholder { color: var(--c-ink-4); }

.table-wrap {
    background: var(--c-paper-2);
    border: 1px solid var(--c-line);
    border-radius: 0 0 var(--r-lg) var(--r-lg);
    overflow: auto;
    box-shadow: var(--sh-1);
}
.panel .table-wrap { border-radius: var(--r-md); box-shadow: none; }
.table { font-size: 13px; }
.table thead th {
    text-align: left;
    padding: 12px var(--s-4);
    background: var(--c-paper-3);
    color: var(--c-ink-3);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--c-line-strong);
    white-space: nowrap;
    position: sticky; top: 0; z-index: 1;
}
.table tbody td {
    padding: 14px var(--s-4);
    border-bottom: 1px solid var(--c-line);
    vertical-align: middle;
    color: var(--c-ink-2);
}
.table tbody tr { transition: background 180ms; }
.table tbody tr:last-child td { border-bottom: none; }
.table tbody tr:hover { background: var(--c-primary-soft); }
.table-zebra tbody tr:nth-child(even) { background: rgba(239, 235, 224, 0.35); }
.table-zebra tbody tr:nth-child(even):hover { background: var(--c-primary-soft); }

.table .cell-id { font-family: var(--f-mono); font-size: 11.5px; color: var(--c-ink-4); }
.table .cell-preview { max-width: 480px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.table .cell-time { font-family: var(--f-mono); font-size: 11.5px; color: var(--c-ink-3); }

.tag {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.04em;
    border: 1px solid transparent;
    font-family: var(--f-mono);
}
.tag-module-力学 { background: rgba(30, 136, 229, 0.10); color: #1565C0; border-color: rgba(30, 136, 229, 0.22); }
.tag-module-电学 { background: rgba(245, 158, 11, 0.12); color: #B45309; border-color: rgba(245, 158, 11, 0.26); }
.tag-module-光学 { background: rgba(20, 184, 166, 0.12); color: #0F766E; border-color: rgba(20, 184, 166, 0.26); }
.tag-module-热学 { background: rgba(239, 68, 68, 0.10); color: #B91C1C; border-color: rgba(239, 68, 68, 0.24); }
.tag-module-声学 { background: rgba(139, 92, 246, 0.10); color: #6D28D9; border-color: rgba(139, 92, 246, 0.24); }

.tag-diff-easy { background: rgba(34, 197, 94, 0.10); color: #15803D; border-color: rgba(34, 197, 94, 0.24); }
.tag-diff-medium { background: rgba(245, 158, 11, 0.12); color: #B45309; border-color: rgba(245, 158, 11, 0.26); }
.tag-diff-hard { background: rgba(239, 68, 68, 0.10); color: #B91C1C; border-color: rgba(239, 68, 68, 0.24); }

.tag-level {
    display: inline-grid; place-items: center;
    width: 26px; height: 26px;
    border-radius: 6px;
    font-family: var(--f-mono);
    font-weight: 600; font-size: 12px;
    color: #fff;
    letter-spacing: 0;
}
.tag-level-A { background: var(--lv-A); box-shadow: 0 2px 6px rgba(30, 136, 229, 0.3); }
.tag-level-B { background: var(--lv-B); box-shadow: 0 2px 6px rgba(20, 184, 166, 0.3); }
.tag-level-C { background: var(--lv-C); box-shadow: 0 2px 6px rgba(245, 158, 11, 0.3); }
.tag-level-D { background: var(--lv-D); box-shadow: 0 2px 6px rgba(239, 68, 68, 0.3); }

.tag-status {
    font-family: var(--f-mono); font-size: 10.5px; letter-spacing: 0.08em;
    padding: 3px 8px; border-radius: var(--r-sm);
    background: rgba(22, 163, 74, 0.1); color: #15803D;
    border: 1px solid rgba(22, 163, 74, 0.22);
}
.tag-status.is-fail { background: rgba(239, 68, 68, 0.08); color: #B91C1C; border-color: rgba(239, 68, 68, 0.2); }

.tag-source {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 11.5px; color: var(--c-ink-3);
}
.tag-source::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c-primary); }
.tag-source[data-src="wecom"]::before { background: #14B8A6; }
.tag-source[data-src="h5"]::before { background: #F59E0B; }

.score-cell { font-family: var(--f-mono); font-weight: 500; font-size: 14px; color: var(--c-ink); font-variant-numeric: tabular-nums; }

.actions { display: inline-flex; gap: 6px; }
.action-btn {
    padding: 5px 10px;
    background: transparent;
    border: 1px solid var(--c-line);
    border-radius: var(--r-sm);
    font-size: 11.5px;
    color: var(--c-ink-3);
    transition: all 180ms;
    font-family: var(--f-ui);
}
.action-btn:hover { border-color: var(--c-primary); color: var(--c-primary); background: var(--c-primary-soft); }
.action-btn.is-danger:hover { border-color: var(--c-danger); color: var(--c-danger); background: rgba(239, 68, 68, 0.08); }

.empty {
    padding: var(--s-12) var(--s-6);
    text-align: center;
    color: var(--c-ink-4);
    font-size: 13px;
}
.empty-mark {
    font-family: var(--f-display);
    font-style: italic;
    font-size: 42px;
    color: var(--c-line-strong);
    line-height: 1;
    margin-bottom: 12px;
}

/* ---------- Pagination ---------- */
.pagination {
    display: flex; justify-content: space-between; align-items: center;
    padding: var(--s-4) var(--s-5);
    background: var(--c-paper-2);
    border: 1px solid var(--c-line);
    border-top: none;
    border-radius: 0 0 var(--r-lg) var(--r-lg);
    margin-bottom: var(--s-8);
    gap: var(--s-4);
    flex-wrap: wrap;
}
.pagination-info { font-size: 11.5px; color: var(--c-ink-3); font-family: var(--f-mono); letter-spacing: 0.04em; }
.pagination-ctrl { display: flex; gap: 4px; align-items: center; }
.page-btn {
    min-width: 32px; height: 32px;
    padding: 0 10px;
    background: var(--c-paper-2);
    border: 1px solid var(--c-line);
    border-radius: var(--r-sm);
    font-size: 12px; color: var(--c-ink-2);
    font-family: var(--f-mono);
    transition: all 180ms;
}
.page-btn:hover:not(:disabled):not(.is-active) { border-color: var(--c-primary); color: var(--c-primary); }
.page-btn.is-active { background: var(--c-primary); color: #fff; border-color: var(--c-primary); font-weight: 600; }
.page-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.page-ellipsis { padding: 0 4px; color: var(--c-ink-4); font-family: var(--f-mono); font-size: 12px; }

/* ================================================================
   MODALS
   ================================================================ */
.modal[hidden] { display: none !important; }
.modal {
    position: fixed; inset: 0;
    display: grid; place-items: center;
    z-index: 100;
    padding: var(--s-6);
    animation: fade 220ms ease;
}
@keyframes fade { from { opacity: 0; } }
.modal-mask {
    position: absolute; inset: 0;
    background: rgba(10, 20, 36, 0.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.modal-card {
    position: relative;
    background: var(--c-paper-2);
    border-radius: var(--r-xl);
    box-shadow: var(--sh-3);
    max-height: 90vh;
    display: flex; flex-direction: column;
    overflow: hidden;
    animation: modal-in 320ms cubic-bezier(0.16, 1, 0.3, 1);
    border: 1px solid var(--c-line);
}
@keyframes modal-in { from { opacity: 0; transform: translateY(20px) scale(0.97); } }
.modal-sm { width: 420px; }
.modal-lg { width: 680px; max-width: 100%; }

.modal-head {
    display: flex; justify-content: space-between; align-items: flex-start;
    padding: var(--s-5) var(--s-6);
    border-bottom: 1px solid var(--c-line);
    background: linear-gradient(180deg, var(--c-paper) 0%, var(--c-paper-2) 100%);
}
.modal-eyebrow { font-size: 10px; letter-spacing: 0.22em; color: var(--c-primary); margin-bottom: 4px; }
.modal-title { font-size: 20px; font-weight: 500; color: var(--c-ink); letter-spacing: -0.01em; }
.modal-body {
    padding: var(--s-6);
    overflow-y: auto;
    flex: 1;
}
.modal-foot {
    padding: var(--s-4) var(--s-6);
    border-top: 1px solid var(--c-line);
    display: flex; justify-content: flex-end; gap: var(--s-3);
    background: var(--c-paper);
}
.confirm-text { color: var(--c-ink-2); font-size: 14px; line-height: 1.7; }

/* ---------- Forms ---------- */
.form-row { margin-bottom: var(--s-5); }
.form-row:last-child { margin-bottom: 0; }
.form-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-4); }

.field { display: block; }
.field-label {
    display: block;
    font-size: 11px;
    letter-spacing: 0.14em;
    color: var(--c-ink-3);
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 8px;
    font-family: var(--f-mono);
}
.field-label em { color: var(--c-danger); font-style: normal; margin-left: 3px; }
.field input[type="text"],
.field input[type="date"],
.field select,
.field textarea {
    width: 100%;
    padding: 10px 12px;
    background: var(--c-paper-2);
    border: 1px solid var(--c-line);
    border-radius: var(--r-md);
    outline: none;
    font-size: 13.5px;
    color: var(--c-ink);
    transition: all 180ms;
    font-family: var(--f-ui);
    resize: vertical;
}
.field textarea { line-height: 1.6; min-height: 96px; }
.field input:focus, .field select:focus, .field textarea:focus {
    border-color: var(--c-primary);
    box-shadow: var(--sh-glow);
    background: #fff;
}
.field input::placeholder, .field textarea::placeholder { color: var(--c-ink-4); }

.options-row {
    background: var(--c-paper);
    border: 1px dashed var(--c-line-strong);
    border-radius: var(--r-md);
    padding: var(--s-4);
    display: flex; flex-direction: column; gap: 10px;
}
.option-item {
    display: grid;
    grid-template-columns: 32px 1fr 22px;
    align-items: center;
    gap: 12px;
}
.option-key {
    width: 32px; height: 32px;
    display: grid; place-items: center;
    background: var(--c-ink);
    color: var(--c-ink-inverse);
    border-radius: var(--r-sm);
    font-weight: 600; font-size: 13px;
    letter-spacing: 0;
}
.option-item input[type="text"] {
    padding: 9px 12px;
    background: var(--c-paper-2);
    border: 1px solid var(--c-line);
    border-radius: var(--r-md);
    outline: none;
    font-size: 13.5px;
    transition: all 180ms;
}
.option-item input[type="text"]:focus { border-color: var(--c-primary); box-shadow: var(--sh-glow); }
.option-radio {
    appearance: none; -webkit-appearance: none;
    width: 20px; height: 20px;
    border: 2px solid var(--c-line-strong);
    border-radius: 50%;
    cursor: pointer;
    transition: all 200ms;
    display: grid; place-items: center;
    margin: 0;
}
.option-radio:hover { border-color: var(--c-primary); }
.option-radio:checked { border-color: var(--c-primary); background: var(--c-primary); box-shadow: 0 0 0 3px rgba(30, 136, 229, 0.2); }
.option-radio:checked::after { content: ""; width: 6px; height: 6px; background: #fff; border-radius: 50%; }
.hint { font-size: 10.5px; color: var(--c-ink-4); letter-spacing: 0.06em; text-align: right; margin-top: 4px; }

/* Assessment detail */
.detail-hero {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-3);
    margin-bottom: var(--s-5);
    padding: var(--s-4);
    background: linear-gradient(140deg, #0A1424, #122A47);
    border-radius: var(--r-md);
    color: var(--c-ink-inverse);
}
.detail-hero-item { }
.detail-hero-label { font-family: var(--f-mono); font-size: 9.5px; letter-spacing: 0.2em; color: rgba(245, 241, 232, 0.5); margin-bottom: 6px; }
.detail-hero-value { font-family: var(--f-mono); font-size: 22px; font-weight: 500; color: var(--c-accent); letter-spacing: -0.01em; }
.detail-hero-value.small { font-size: 15px; color: var(--c-ink-inverse); }

.detail-section-title {
    font-family: var(--f-mono);
    font-size: 10.5px;
    letter-spacing: 0.2em;
    color: var(--c-ink-4);
    margin: var(--s-5) 0 var(--s-3);
    text-transform: uppercase;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--c-line);
}
.detail-modules { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.detail-module {
    padding: 12px;
    background: var(--c-paper);
    border: 1px solid var(--c-line);
    border-radius: var(--r-md);
}
.detail-module-name { font-size: 12px; color: var(--c-ink-3); margin-bottom: 4px; }
.detail-module-score { font-family: var(--f-mono); font-size: 18px; color: var(--c-ink); font-weight: 500; }

.answers-list { display: flex; flex-direction: column; gap: 8px; max-height: 300px; overflow-y: auto; padding-right: 4px; }
.answer-row {
    display: grid; grid-template-columns: 40px 1fr 60px 60px;
    align-items: center; gap: 10px;
    padding: 10px 12px;
    background: var(--c-paper);
    border: 1px solid var(--c-line);
    border-radius: var(--r-md);
    font-size: 12.5px;
    transition: all 180ms;
}
.answer-row:hover { border-color: var(--c-primary-line); }
.answer-row.is-wrong { border-left: 3px solid var(--c-danger); }
.answer-row.is-right { border-left: 3px solid var(--c-success); }
.answer-qid { font-family: var(--f-mono); font-size: 11px; color: var(--c-ink-4); }
.answer-content { color: var(--c-ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.answer-pick, .answer-correct { font-family: var(--f-mono); font-size: 12px; text-align: center; }
.answer-pick { color: var(--c-ink); font-weight: 600; }
.answer-correct { color: var(--c-ink-3); }

/* Loader */
.loader { display: flex; gap: 6px; justify-content: center; padding: var(--s-10) 0; }
.loader span {
    width: 8px; height: 8px; border-radius: 50%;
    background: var(--c-primary);
    animation: bounce 1.2s infinite ease-in-out;
}
.loader span:nth-child(2) { animation-delay: 0.15s; }
.loader span:nth-child(3) { animation-delay: 0.3s; }
@keyframes bounce { 0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; } 40% { transform: scale(1); opacity: 1; } }

/* ================================================================
   TOASTS
   ================================================================ */
.toast-stack {
    position: fixed; top: 20px; right: 20px;
    display: flex; flex-direction: column; gap: 10px;
    z-index: 200;
    pointer-events: none;
}
.toast {
    min-width: 260px; max-width: 380px;
    padding: 12px 16px;
    background: var(--c-ink);
    color: var(--c-ink-inverse);
    border-radius: var(--r-md);
    box-shadow: var(--sh-3);
    font-size: 13px;
    display: flex; align-items: center; gap: 10px;
    border-left: 3px solid var(--c-primary);
    animation: toast-in 300ms cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: auto;
}
.toast.is-success { border-left-color: var(--c-success); }
.toast.is-error { border-left-color: var(--c-danger); }
.toast.is-warning { border-left-color: var(--c-warning); }
.toast-icon { font-family: var(--f-mono); font-weight: 600; font-size: 14px; opacity: 0.9; }
.toast.is-out { animation: toast-out 240ms forwards; }
@keyframes toast-in { from { opacity: 0; transform: translateX(30px); } }
@keyframes toast-out { to { opacity: 0; transform: translateX(30px); } }

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 1280px) {
    .stat-grid { grid-template-columns: repeat(2, 1fr); }
    .dash-row { grid-template-columns: 1fr; }
    .detail-hero { grid-template-columns: repeat(2, 1fr); }
    .form-grid-3 { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
    :root { --sidebar-w: 68px; }
    .brand-text, .nav-label, .nav-index, .btn-logout span, .status-line span:not(.dot-live) { display: none; }
    .nav-item { grid-template-columns: 1fr; justify-items: center; padding: 14px 8px; }
    .brand { justify-content: center; padding: 0 0 var(--s-6); }
    .content { padding: var(--s-5); }
    .stat-grid { grid-template-columns: 1fr; }
    .page-title { font-size: 26px; }
    .page-head { flex-direction: column; align-items: flex-start; }
}

/* Utility */
.hidden { display: none !important; }

/* ================================================================
   THIRD-PARTY BANK · 第三方题库
   ================================================================ */
.tp-src {
    font-size: 10.5px; letter-spacing: 0.12em; color: var(--c-ink-4);
    padding: 5px 10px; border: 1px dashed var(--c-line-strong);
    border-radius: var(--r-sm); background: var(--c-paper-2);
}

/* 分段式 Tab */
.tp-tabs {
    display: inline-flex; gap: 2px; padding: 3px;
    background: var(--c-paper-3); border: 1px solid var(--c-line);
    border-radius: 999px; margin-bottom: var(--s-5);
}
.tp-tab {
    position: relative; padding: 8px 22px; border: none; background: transparent;
    border-radius: 999px; cursor: pointer; font-family: var(--f-ui);
    font-size: 13px; font-weight: 500; color: var(--c-ink-3);
    letter-spacing: 0.02em; transition: color 200ms, background 200ms, box-shadow 200ms;
}
.tp-tab:hover { color: var(--c-primary); }
.tp-tab.is-active {
    background: var(--c-paper-2); color: var(--c-primary); font-weight: 600;
    box-shadow: var(--sh-1);
}
.tp-panel[hidden] { display: none; }

/* 复选框 */
.tp-check {
    width: 15px; height: 15px; cursor: pointer;
    accent-color: var(--c-primary); vertical-align: middle;
}

/* 题型标签 */
.tp-type {
    background: var(--c-paper-3); color: var(--c-ink-3);
    border-color: var(--c-line); font-size: 10.5px;
}
.tp-type.is-choice {
    background: rgba(30, 136, 229, 0.10); color: #1565C0;
    border-color: rgba(30, 136, 229, 0.24);
}
.tp-yr { background: rgba(245, 158, 11, 0.12); color: #B45309; border-color: rgba(245, 158, 11, 0.24); }
.tp-rg { background: rgba(20, 184, 166, 0.10); color: #0F766E; border-color: rgba(20, 184, 166, 0.22); }

/* 知识点 chip */
.tp-kp {
    display: inline-block; padding: 2px 8px; margin: 1px 2px 1px 0;
    background: var(--c-primary-soft); color: var(--c-primary-700);
    border: 1px solid var(--c-primary-line); border-radius: var(--r-sm);
    font-size: 11px; line-height: 1.6; max-width: 200px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle;
}
.tp-kp-sec { background: var(--c-paper-3); color: var(--c-ink-3); border-color: var(--c-line); }
.tp-kp-empty { color: var(--c-ink-4); }
.tp-muted { color: var(--c-ink-4); font-style: italic; }

/* 不可导入行弱化 */
.tp-row-mute .cell-preview { color: var(--c-ink-3); }
.tp-row-mute { opacity: 0.72; }
.cell-preview[data-act="preview"] { cursor: pointer; }
.cell-preview[data-act="preview"]:hover { color: var(--c-primary); }

/* 选择操作栏 */
.tp-selectbar {
    display: flex; align-items: center; justify-content: space-between; gap: var(--s-4);
    padding: 12px 18px; margin-bottom: var(--s-4);
    background: linear-gradient(90deg, rgba(245, 158, 11, 0.10), rgba(245, 158, 11, 0.03));
    border: 1px solid rgba(245, 158, 11, 0.30); border-left: 3px solid var(--c-accent);
    border-radius: var(--r-md);
    animation: tp-bar-in 260ms cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes tp-bar-in { from { opacity: 0; transform: translateY(-8px); } }
.tp-selectbar-text { font-size: 13px; color: var(--c-ink-2); }
.tp-selectbar-text b { font-family: var(--f-mono); color: #B45309; font-size: 15px; }
.tp-selectbar-act { display: flex; gap: var(--s-3); align-items: center; }

/* 试卷卡片 */
.tp-papers {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: var(--s-4);
}
.tp-papers .loader, .tp-papers .empty { grid-column: 1 / -1; }
.tp-paper {
    background: var(--c-paper-2); border: 1px solid var(--c-line);
    border-radius: var(--r-lg); padding: var(--s-5);
    box-shadow: var(--sh-1); transition: transform 200ms, box-shadow 200ms, border-color 200ms;
    display: flex; flex-direction: column; gap: var(--s-3);
}
.tp-paper:hover { transform: translateY(-2px); box-shadow: var(--sh-2); border-color: var(--c-primary-line); }
.tp-paper-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--s-3); }
.tp-paper-name {
    font-size: 14.5px; font-weight: 500; color: var(--c-ink); line-height: 1.5;
    letter-spacing: -0.01em; margin: 0;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.tp-paper-qst {
    flex-shrink: 0; font-size: 11px; color: var(--c-primary-700);
    background: var(--c-primary-soft); border: 1px solid var(--c-primary-line);
    padding: 3px 9px; border-radius: 999px; white-space: nowrap;
}
.tp-paper-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.tp-paper-groups {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
    padding-top: var(--s-3); border-top: 1px dashed var(--c-line);
}
.tp-grp-label { font-size: 9.5px; letter-spacing: 0.16em; color: var(--c-ink-4); margin-right: 2px; }
.tp-grp {
    font-size: 11px; color: var(--c-ink-2); background: var(--c-paper-3);
    border: 1px solid var(--c-line); border-radius: var(--r-sm); padding: 2px 8px;
}
.tp-grp b { font-family: var(--f-mono); color: var(--c-primary-600); }
.tp-grp-more { font-size: 11px; color: var(--c-ink-4); font-family: var(--f-mono); }

/* 预览模态框 */
.tp-pv { display: flex; flex-direction: column; gap: var(--s-4); }
.tp-pv-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.tp-pv-label {
    font-size: 9.5px; letter-spacing: 0.2em; color: var(--c-ink-4);
    text-transform: uppercase; margin-bottom: 6px; display: block;
}
.tp-pv-content {
    font-size: 14px; line-height: 1.85; color: var(--c-ink);
    background: var(--c-paper); border: 1px solid var(--c-line);
    border-left: 3px solid var(--c-primary); border-radius: var(--r-md);
    padding: var(--s-4) var(--s-5); white-space: pre-wrap; word-break: break-word;
}
.tp-pv-options { display: flex; flex-direction: column; gap: var(--s-2); }
.tp-opt {
    display: flex; align-items: center; gap: var(--s-3);
    padding: 10px 14px; border: 1px solid var(--c-line);
    border-radius: var(--r-md); background: var(--c-paper-2);
    cursor: pointer; transition: border-color 180ms, background 180ms;
}
.tp-opt:not(.is-locked):hover { border-color: var(--c-primary); background: var(--c-primary-soft); }
.tp-opt.is-answer { border-color: rgba(22, 163, 74, 0.5); background: rgba(22, 163, 74, 0.07); }
.tp-opt.is-locked { cursor: default; }
.tp-opt-key {
    flex-shrink: 0; display: grid; place-items: center;
    width: 24px; height: 24px; border-radius: 6px;
    background: var(--c-paper-3); color: var(--c-ink-2);
    font-weight: 600; font-size: 12px; border: 1px solid var(--c-line);
}
.tp-opt.is-answer .tp-opt-key { background: var(--c-success); color: #fff; border-color: var(--c-success); }
.tp-opt-text { flex: 1; font-size: 13.5px; color: var(--c-ink-2); line-height: 1.6; }
.tp-opt-radio { accent-color: var(--c-primary); width: 15px; height: 15px; cursor: pointer; }
.tp-pv-row { display: flex; gap: var(--s-3); align-items: baseline; }
.tp-pv-row .tp-pv-label { margin-bottom: 0; flex-shrink: 0; width: 52px; }
.tp-pv-val { font-size: 13.5px; color: var(--c-ink-2); line-height: 1.7; flex: 1; }
.tp-ans-ok {
    display: inline-grid; place-items: center; min-width: 26px; height: 26px; padding: 0 8px;
    background: var(--c-success); color: #fff; border-radius: 6px;
    font-family: var(--f-mono); font-weight: 600; font-size: 14px;
}
.tp-ans-none { color: var(--c-warning); font-size: 12.5px; }
#tp-preview-import:disabled { opacity: 0.5; cursor: not-allowed; }

/* ================================================================
   IG · 录题审校（ingest）
   ================================================================ */
.ig-upload-panel { margin-bottom: var(--s-4); }
.ig-upload-row { display: flex; flex-wrap: wrap; gap: var(--s-4); align-items: flex-end; }
.ig-up-field { flex: 1; min-width: 220px; margin: 0; }
.ig-up-act { display: flex; align-items: center; gap: var(--s-2); padding-bottom: 2px; }
.ig-filehint { font-size: 11.5px; color: var(--c-ink-3); }

.ig-jobs { display: flex; flex-direction: column; gap: var(--s-3); }
.ig-job {
    background: var(--c-paper-2); border: 1px solid var(--c-line);
    border-radius: var(--r-lg); padding: var(--s-4) var(--s-5);
    box-shadow: var(--sh-1); transition: border-color 200ms, box-shadow 200ms;
}
.ig-job:hover { border-color: var(--c-primary-line); box-shadow: var(--sh-2); }
.ig-job-head { display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); }
.ig-job-title { display: flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; }
.ig-job-name { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; }
.ig-job-school { font-size: 11.5px; color: var(--c-ink-3); background: var(--c-paper-3); border-radius: 999px; padding: 2px 9px; }
.ig-job-time { font-size: 11.5px; color: var(--c-ink-4); }
.ig-badge {
    font-size: 11px; font-weight: 600; padding: 2px 10px; border-radius: 999px;
    border: 1px solid transparent; white-space: nowrap;
}
.ig-badge.is-processing { color: var(--c-primary-700); background: var(--c-primary-soft); border-color: var(--c-primary-line); }
.ig-badge.is-review { color: #92610A; background: var(--c-accent-soft); border-color: rgba(245, 158, 11, 0.35); }
.ig-badge.is-done { color: #166534; background: rgba(22, 163, 74, 0.10); border-color: rgba(22, 163, 74, 0.30); }
.ig-badge.is-failed { color: #991B1B; background: rgba(220, 38, 38, 0.08); border-color: rgba(220, 38, 38, 0.28); }
.ig-job-stats { display: flex; flex-wrap: wrap; gap: var(--s-4); margin-top: var(--s-3); font-size: 12.5px; color: var(--c-ink-3); }
.ig-stat b { font-weight: 600; color: var(--c-ink-2); }
.ig-stat.is-pending b { color: var(--c-warning); }
.ig-stat.is-pending.is-hot { color: #92610A; background: var(--c-accent-soft); border-radius: var(--r-sm); padding: 1px 8px; }
.ig-stat.is-pending.is-hot b { color: #B45309; }
.ig-stat.is-ok b { color: var(--c-success); }
.ig-stat.is-rej b { color: var(--c-danger); }
.ig-job-id { font-size: 11px; color: var(--c-ink-4); margin-left: auto; }
.ig-job-warn { margin-top: var(--s-3); }
.ig-warn-toggle {
    background: none; border: none; cursor: pointer; padding: 0;
    font-size: 12px; color: var(--c-warning); font-family: var(--f-ui);
}
.ig-warn-list { margin: 6px 0 0; padding-left: 18px; font-size: 12px; color: var(--c-ink-3); }
.ig-job-foot { display: flex; justify-content: flex-end; margin-top: var(--s-3); }

.ig-work-head { display: flex; align-items: center; gap: var(--s-4); margin-bottom: var(--s-3); flex-wrap: wrap; }
.ig-work-meta { display: flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; }
.ig-alldone {
    background: rgba(22, 163, 74, 0.10); border: 1px solid rgba(22, 163, 74, 0.35);
    color: #166534; border-radius: var(--r-md); padding: 10px 14px;
    font-size: 13px; font-weight: 500; margin-bottom: var(--s-3);
}
.ig-batchbar {
    display: flex; justify-content: space-between; align-items: center; gap: var(--s-3);
    flex-wrap: wrap; background: var(--c-paper-2); border: 1px solid var(--c-line);
    border-radius: var(--r-lg); padding: var(--s-3) var(--s-4); margin-bottom: var(--s-3);
    position: sticky; top: 0; z-index: 5; box-shadow: var(--sh-1);
}
.ig-qtabs { display: flex; gap: var(--s-2); }
.ig-qtab {
    border: 1px solid var(--c-line); background: var(--c-paper); color: var(--c-ink-3);
    border-radius: 999px; padding: 4px 14px; font-size: 12.5px; cursor: pointer;
    font-family: var(--f-ui); transition: all 160ms;
}
.ig-qtab:hover { border-color: var(--c-primary-line); color: var(--c-primary-600); }
.ig-qtab.is-active { background: var(--c-primary); border-color: var(--c-primary); color: #fff; font-weight: 500; }
.ig-batch { display: flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; }
.ig-batch-label { font-size: 12px; color: var(--c-ink-3); }
.ig-batch-label b { color: var(--c-primary-600); }
.ig-input {
    border: 1px solid var(--c-line); border-radius: var(--r-sm); background: var(--c-paper-2);
    padding: 5px 9px; font-size: 12.5px; color: var(--c-ink); font-family: var(--f-ui);
}
.ig-input:focus { outline: none; border-color: var(--c-primary); box-shadow: var(--sh-glow); }
.ig-bt-sel { min-width: 76px; }
.ig-bt-in { width: 96px; }
#ig-batch-approve:disabled { opacity: 0.45; cursor: not-allowed; }

.ig-qlist { display: flex; flex-direction: column; gap: var(--s-3); }
.ig-qcard {
    background: var(--c-paper-2); border: 1px solid var(--c-line);
    border-radius: var(--r-lg); box-shadow: var(--sh-1); overflow: hidden;
}
.ig-qcard.is-approved { border-left: 3px solid var(--c-success); }
.ig-qcard.is-rejected { border-left: 3px solid var(--c-danger); opacity: 0.85; }
.ig-qcard-head {
    display: flex; align-items: center; gap: var(--s-3);
    padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--c-line);
    background: var(--c-paper); flex-wrap: wrap;
}
.ig-check input { accent-color: var(--c-primary); width: 15px; height: 15px; cursor: pointer; }
.ig-qnum { font-size: 13px; font-weight: 600; color: var(--c-ink-2); }
.ig-qstatus { font-size: 11.5px; font-weight: 600; padding: 1px 9px; border-radius: 999px; }
.ig-qstatus.is-pending { color: #92610A; background: var(--c-accent-soft); }
.ig-qstatus.is-ok { color: #166534; background: rgba(22, 163, 74, 0.10); }
.ig-qstatus.is-rej { color: #991B1B; background: rgba(220, 38, 38, 0.08); }
.ig-linked { font-size: 11px; color: var(--c-primary-600); }
.ig-qcard-act { margin-left: auto; display: flex; gap: var(--s-2); }
.ig-qbody { display: grid; grid-template-columns: 1fr 300px; gap: var(--s-4); padding: var(--s-4); }
@media (max-width: 1100px) { .ig-qbody { grid-template-columns: 1fr; } }
.ig-qleft { min-width: 0; }
.ig-stem { font-size: 14px; line-height: 1.8; color: var(--c-ink); margin-bottom: var(--s-3); }
.ig-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 6px var(--s-4); margin-bottom: var(--s-3); }
@media (max-width: 760px) { .ig-opts { grid-template-columns: 1fr; } }
.ig-opt { display: flex; gap: var(--s-2); font-size: 13.5px; color: var(--c-ink-2); line-height: 1.7; }
.ig-optkey { flex-shrink: 0; font-weight: 600; color: var(--c-primary-600); }
.ig-aa { border-top: 1px dashed var(--c-line); padding-top: var(--s-3); display: flex; flex-direction: column; gap: 6px; }
.ig-aa-row { display: flex; gap: var(--s-3); align-items: baseline; font-size: 13px; }
.ig-aa-val { flex: 1; color: var(--c-ink-2); line-height: 1.7; }
.ig-ans { color: var(--c-success); font-size: 14px; }
.ig-muted { color: var(--c-ink-4); font-style: italic; }
.ig-elabel {
    font-size: 9.5px; letter-spacing: 0.16em; color: var(--c-ink-4);
    text-transform: uppercase; flex-shrink: 0; width: 52px;
}
.ig-ai-sug {
    display: flex; align-items: center; gap: var(--s-2); margin-top: 4px;
    background: var(--c-accent-soft); border-radius: var(--r-sm); padding: 3px 8px;
    font-size: 12px; color: var(--c-ink-2); width: fit-content; max-width: 100%;
}
.ig-ai-sug.inline { display: inline-flex; margin-left: var(--s-2); }
.ig-ai-tag { font-size: 9.5px; letter-spacing: 0.12em; color: #92610A; font-weight: 600; flex-shrink: 0; }
.ig-ai-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.ig-qright { border-left: 1px solid var(--c-line); padding-left: var(--s-4); display: flex; flex-direction: column; gap: var(--s-2); }
.ig-side-label { font-size: 9.5px; letter-spacing: 0.18em; color: var(--c-ink-4); text-transform: uppercase; margin-top: var(--s-2); }
.ig-crop-img {
    width: 100%; max-height: 220px; object-fit: contain; cursor: zoom-in;
    border: 1px solid var(--c-line); border-radius: var(--r-md); background: #fff;
}
.ig-noimg { font-size: 12px; color: var(--c-ink-4); font-style: italic; }
.ig-imgs { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.ig-thumb { position: relative; display: inline-block; }
.ig-thumb img {
    width: 64px; height: 64px; object-fit: cover; cursor: zoom-in;
    border: 1px solid var(--c-line); border-radius: var(--r-sm); background: #fff;
}
.ig-thumb-del {
    position: absolute; top: -6px; right: -6px; width: 18px; height: 18px;
    border-radius: 50%; border: none; background: var(--c-danger); color: #fff;
    font-size: 10px; cursor: pointer; display: grid; place-items: center; line-height: 1;
}
.ig-img-add { display: flex; gap: 6px; align-items: center; }
.ig-img-url { flex: 1; min-width: 0; }
.ig-img-pick { flex: 1; min-width: 0; }

.ig-tags { border-top: 1px solid var(--c-line); padding: var(--s-3) var(--s-4); display: flex; flex-direction: column; gap: 6px; background: var(--c-paper); }
.ig-tag-row { display: flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; }
.ig-tag-label { font-size: 11.5px; color: var(--c-ink-3); width: 44px; flex-shrink: 0; }
.ig-chip {
    font-size: 11.5px; padding: 2px 10px; border-radius: 999px;
    border: 1px solid var(--c-line); background: var(--c-paper-2); color: var(--c-ink-2);
}
.ig-chip.is-cur { border-color: var(--c-primary-line); background: var(--c-primary-soft); color: var(--c-primary-700); font-weight: 500; }
.ig-chip.is-empty { color: var(--c-ink-4); font-style: italic; }
.ig-chip.is-ai {
    border-color: rgba(245, 158, 11, 0.4); background: var(--c-accent-soft);
    color: #92610A; cursor: pointer; font-family: var(--f-ui);
}
.ig-chip.is-ai:hover { border-color: var(--c-accent); }
.ig-tag-row .ig-input { flex: 1; min-width: 120px; max-width: 260px; }
.ig-reject-reason {
    padding: var(--s-2) var(--s-4); font-size: 12px; color: #991B1B;
    background: rgba(220, 38, 38, 0.06); border-top: 1px solid rgba(220, 38, 38, 0.18);
}

.ig-editwrap { display: flex; flex-direction: column; gap: var(--s-2); }
.ig-editwrap .ig-elabel { width: auto; }
.ig-ta {
    width: 100%; border: 1px solid var(--c-line); border-radius: var(--r-sm);
    padding: 8px 10px; font-size: 13px; font-family: var(--f-ui); color: var(--c-ink);
    resize: vertical; background: var(--c-paper-2);
}
.ig-ta:focus, .ig-optedit input:focus { outline: none; border-color: var(--c-primary); box-shadow: var(--sh-glow); }
.ig-optedit { display: flex; flex-direction: column; gap: 6px; }
.ig-optedit-row { display: flex; gap: var(--s-2); align-items: center; }
.ig-optedit-row input {
    flex: 1; border: 1px solid var(--c-line); border-radius: var(--r-sm);
    padding: 5px 9px; font-size: 13px; font-family: var(--f-ui);
}
.ig-edit-aa { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-4); margin-top: var(--s-2); }
@media (max-width: 900px) { .ig-edit-aa { grid-template-columns: 1fr; } }
.ig-edit-col { display: flex; flex-direction: column; gap: var(--s-1); }
.ig-edit-col .ig-elabel { width: auto; }

.ig-lightbox {
    position: fixed; inset: 0; z-index: 300; background: rgba(10, 20, 36, 0.88);
    display: grid; place-items: center; cursor: zoom-out; padding: var(--s-8);
}
.ig-lightbox img { max-width: 94vw; max-height: 92vh; border-radius: var(--r-md); box-shadow: var(--sh-3); background: #fff; }

/* MathX 降级公式 */
.mx-fallback { color: var(--c-ink-2); background: var(--c-paper-3); border-radius: 3px; padding: 0 4px; font-size: 0.95em; }

/* ================================================================
   ST · 学员与班级（students）
   ================================================================ */
.st-tabs { display: flex; gap: var(--s-2); margin-bottom: var(--s-4); border-bottom: 1px solid var(--c-line); }
.st-tab {
    background: none; border: none; border-bottom: 2px solid transparent;
    padding: 8px 18px; font-size: 13.5px; color: var(--c-ink-3);
    cursor: pointer; font-family: var(--f-ui); transition: all 160ms;
}
.st-tab:hover { color: var(--c-primary-600); }
.st-tab.is-active { color: var(--c-primary-600); border-bottom-color: var(--c-primary); font-weight: 600; }
.st-gender { margin-left: 6px; color: var(--c-primary); font-size: 13px; }
.st-hours { font-weight: 600; color: var(--c-success); }
.st-hours.is-low { color: var(--c-warning); }
.st-hours.is-zero { color: var(--c-danger); }
.st-hours-sub { font-size: 11px; color: var(--c-ink-4); }
.st-sched {
    font-size: 12px; color: var(--c-ink-3); max-width: 220px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.scf-rows { display: flex; flex-direction: column; gap: 6px; margin-bottom: var(--s-2); }
.scf-row { display: flex; gap: var(--s-2); align-items: center; }
.scf-weekday, .scf-time, .scf-name {
    border: 1px solid var(--c-line); border-radius: var(--r-sm);
    padding: 6px 9px; font-size: 13px; font-family: var(--f-ui); background: var(--c-paper-2);
}
.scf-name { flex: 1; }
.scf-del { flex-shrink: 0; }

.st-detail { display: flex; flex-direction: column; gap: var(--s-3); }
.st-d-head { min-width: 0; }
.st-d-title { margin: 0; font-size: 17px; letter-spacing: -0.01em; }
.st-d-meta { display: flex; gap: var(--s-4); flex-wrap: wrap; font-size: 12px; color: var(--c-ink-3); margin-top: 2px; }
.st-d-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-4); }
@media (max-width: 1100px) { .st-d-grid { grid-template-columns: 1fr; } }
.st-d-grid .panel { margin: 0; }
.st-d-addbar { display: flex; gap: var(--s-2); margin-bottom: var(--s-3); }
.st-d-addbar .ig-input { flex: 1; }
.st-d-addlist { max-height: 300px; overflow-y: auto; display: flex; flex-direction: column; gap: 4px; }
.st-add-item {
    display: flex; align-items: center; gap: var(--s-2);
    padding: 6px 10px; border: 1px solid var(--c-line); border-radius: var(--r-md);
    cursor: pointer; background: var(--c-paper-2); transition: border-color 160ms;
}
.st-add-item:hover { border-color: var(--c-primary-line); }
.st-add-check { accent-color: var(--c-primary); width: 15px; height: 15px; }
.st-add-name { font-size: 13px; font-weight: 500; }
.st-add-sub { font-size: 11px; color: var(--c-ink-4); margin-left: auto; }
.st-add-empty { font-size: 12.5px; color: var(--c-ink-4); font-style: italic; padding: var(--s-3) 0; }
.st-d-attdate { display: flex; gap: var(--s-2); align-items: center; }
.st-d-atthint { font-size: 11.5px; color: var(--c-warning); margin-bottom: var(--s-2); min-height: 16px; }
.st-att-row {
    display: flex; align-items: center; gap: var(--s-3);
    padding: 6px 4px; border-bottom: 1px dashed var(--c-line);
}
.st-att-name { font-size: 13px; font-weight: 500; width: 80px; flex-shrink: 0; }
.st-att-opt {
    display: inline-flex; align-items: center; gap: 4px; cursor: pointer;
    font-size: 12px; color: var(--c-ink-3); border: 1px solid var(--c-line);
    border-radius: 999px; padding: 2px 10px; transition: all 140ms;
}
.st-att-opt input { accent-color: var(--c-primary); }
.st-att-opt.is-on.is-present { border-color: rgba(22, 163, 74, 0.5); background: rgba(22, 163, 74, 0.08); color: #166534; font-weight: 500; }
.st-att-opt.is-on.is-absent { border-color: rgba(220, 38, 38, 0.45); background: rgba(220, 38, 38, 0.06); color: #991B1B; font-weight: 500; }
.st-att-opt.is-on.is-leave { border-color: rgba(245, 158, 11, 0.5); background: var(--c-accent-soft); color: #92610A; font-weight: 500; }
.st-month-row {
    display: flex; align-items: center; gap: var(--s-3);
    padding: 6px 4px; border-bottom: 1px dashed var(--c-line); font-size: 12.5px;
}
.st-month-date { width: 96px; color: var(--c-ink-2); font-weight: 500; }
.st-month-c { font-size: 11.5px; padding: 1px 9px; border-radius: 999px; }
.st-month-c.is-present { color: #166534; background: rgba(22, 163, 74, 0.10); }
.st-month-c.is-absent { color: #991B1B; background: rgba(220, 38, 38, 0.08); }
.st-month-c.is-leave { color: #92610A; background: var(--c-accent-soft); }

/* ================================================================
   ZK · 题库检索（组卷网风格复刻，色值仅限本 section）
   ================================================================ */
.route[data-route="bank"] {
    --zk-blue: #2877ff;
    --zk-red: #f64e2c;
    --zk-txt: #333;
    --zk-txt2: #666;
    --zk-txt3: #999;
    --zk-line: #ececec;
    font-family: "Microsoft YaHei", "PingFang SC", Helvetica, Tahoma, sans-serif;
}
.zk-wrapper {
    max-width: 1200px; margin: 0 auto; display: flex; gap: 12px; align-items: flex-start;
}

/* ---------- 左树（264px） ---------- */
.zk-left {
    width: 264px; flex-shrink: 0; background: #fff; border-radius: 4px;
    position: sticky; top: 12px; max-height: calc(100vh - 110px);
    display: flex; flex-direction: column; overflow: hidden;
}
/* 模式切换（知识点 | 章节）分段控件 */
.zk-mode-tabs {
    display: flex; gap: 4px; padding: 8px 10px; flex-shrink: 0;
    border-bottom: 1px solid #f0f0f0; background: #fafbfc;
}
.zk-mode-tab {
    flex: 1; height: 28px; border: 1px solid #dfe3e8; border-radius: 3px;
    background: #fff; color: var(--zk-txt2); font-size: 13px; cursor: pointer;
    font-family: inherit; transition: all 140ms;
}
.zk-mode-tab:hover { color: var(--zk-blue); border-color: var(--zk-blue); }
.zk-mode-tab.is-active { background: var(--zk-blue); border-color: var(--zk-blue); color: #fff; font-weight: 600; }
/* 章节树：册次行加重 */
.zk-tnode.is-book { height: 32px; }
.zk-tnode.is-book .zk-tname { font-weight: 600; font-size: 13px; }
.zk-tnode.is-book .zk-ticon { background: var(--zk-blue); }
.zk-stage-tabs { display: flex; border-bottom: 1px solid #f0f0f0; flex-shrink: 0; }
.zk-stage-tab {
    flex: 1; height: 40px; border: none; background: none; cursor: pointer;
    font-size: 14px; color: var(--zk-txt2); font-family: inherit;
    border-bottom: 2px solid transparent; transition: all 140ms;
}
.zk-stage-tab:hover { color: var(--zk-blue); }
.zk-stage-tab.is-active { color: var(--zk-blue); font-weight: 600; border-bottom-color: var(--zk-blue); }
.zk-tree-search { padding: 10px 12px 6px; flex-shrink: 0; }
.zk-tree-search input {
    width: 100%; height: 22px; border: 1px solid #ddd; border-radius: 2px;
    padding: 0 6px; font-size: 12px; color: var(--zk-txt); font-family: inherit;
    box-sizing: content-box;
}
.zk-tree-search input:focus { outline: none; border-color: var(--zk-blue); }
.zk-tree {
    flex: 1; overflow-y: auto; padding: 4px 0 8px;
    --zk-indent: 20px;
}
.zk-tnode {
    position: relative; display: flex; align-items: center; gap: 6px;
    height: 28px; padding-right: 8px; cursor: pointer; user-select: none;
}
/* 缩进虚线引导线：每层一条，位置由 JS 按 depth 写入 --zk-guides（repeating-linear-gradient 列表） */
.zk-tnode::before {
    content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0;
    pointer-events: none;
    /* 引导线的定位/尺寸由 JS 按 depth 写入 --zk-guide-pos / --zk-guide-size（可继承的自定义属性），
       每条引导线为 1px 宽的竖虚线列，no-repeat 避免平铺成横向条纹（#22 修复） */
    background-image: var(--zk-guides, none);
    background-position: var(--zk-guide-pos, 0 0);
    background-size: var(--zk-guide-size, auto);
    background-repeat: no-repeat;
}
.zk-ticon {
    flex-shrink: 0; width: 14px; height: 14px; border-radius: 50%;
    background: #e7e7e7; color: #fff; font-size: 11px; line-height: 14px;
    text-align: center; font-weight: 600;
}
.zk-tnode.is-selected .zk-ticon { background: #fff; color: var(--zk-blue); }
.zk-tdot { flex-shrink: 0; width: 14px; text-align: center; color: #c8c8c8; font-size: 10px; }
.zk-tdot::after { content: '·'; }
.zk-tname {
    font-size: 13px; color: var(--zk-txt); overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap; flex: 1;
}
.zk-tnode:hover .zk-tname { color: var(--zk-blue); }
.zk-tnode.is-selected { background: var(--zk-blue); }
.zk-tnode.is-selected .zk-tname { color: #fff; }
.zk-tnode.is-selected .zk-tcount { color: #fff; }
.zk-tcount { font-size: 11px; color: var(--zk-txt3); flex-shrink: 0; }
.zk-tree-empty { padding: 16px 12px; font-size: 12px; color: var(--zk-txt3); text-align: center; }
.zk-tree-foot { padding: 8px 12px; border-top: 1px solid #f0f0f0; flex-shrink: 0; }
.zk-tree-clear {
    width: 100%; height: 26px; border: 1px solid #ddd; border-radius: 2px;
    background: #fff; color: var(--zk-txt2); font-size: 12px; cursor: pointer; font-family: inherit;
}
.zk-tree-clear:hover { border-color: var(--zk-blue); color: var(--zk-blue); }

/* ---------- 右栏（924px） ---------- */
.zk-right { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 12px; }

/* 筛选卡 */
.zk-filterbar { background: #fff; border-radius: 4px; padding: 0 20px; }
.zk-frow {
    display: flex; align-items: flex-start; min-height: 44px; padding: 11px 0;
    border-bottom: 1px dashed #f0f0f0; gap: 8px;
}
.zk-frow:last-child { border-bottom: none; }
.zk-flabel { font-size: 14px; color: var(--zk-txt3); flex-shrink: 0; line-height: 22px; }
.zk-fopts { display: flex; flex-wrap: wrap; gap: 0 24px; min-width: 0; }
.zk-opt { font-size: 14px; color: var(--zk-txt); line-height: 22px; cursor: pointer; white-space: nowrap; }
.zk-opt:hover { color: var(--zk-blue); }
.zk-opt.is-on { color: var(--zk-blue); font-weight: 500; }

/* 更多（来源）hover 下拉 */
.zk-more { position: relative; }
.zk-more-trigger {
    font-size: 14px; color: var(--zk-txt); line-height: 22px; cursor: pointer;
    padding: 0 8px; border-radius: 2px; display: inline-block;
}
.zk-more.is-active .zk-more-trigger, .zk-more:hover .zk-more-trigger {
    background: #f0f8ff; color: var(--zk-blue);
}
.zk-more-panel {
    position: absolute; top: 26px; left: 0; z-index: 40; min-width: 220px;
    background: #fff; border-radius: 4px; box-shadow: rgba(0, 0, 0, 0.1) 2px 2px 4px;
    padding: 6px 0; max-height: 320px; overflow-y: auto;
}
.zk-more-item { height: 32px; line-height: 32px; padding: 0 16px; font-size: 13px; color: var(--zk-txt); cursor: pointer; white-space: nowrap; }
.zk-more-item:hover { background: #f7f7f7; }
.zk-more-item.is-on { background: #f0f8ff; color: var(--zk-blue); }
.zk-more-reset {
    height: 32px; line-height: 32px; padding: 0 16px; font-size: 12px;
    color: var(--zk-blue); cursor: pointer; border-top: 1px solid #f0f0f0; margin-top: 4px;
}
.zk-more-reset:hover { background: #f0f8ff; }

/* 排序条 h50 */
.zk-sortbar {
    height: 50px; background: #fff; border-radius: 4px;
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 20px; gap: 12px;
}
.zk-sort-tabs { display: flex; gap: 24px; }
.zk-sort-tab { font-size: 14px; color: var(--zk-txt); cursor: pointer; line-height: 50px; }
.zk-sort-tab:hover { color: var(--zk-blue); }
.zk-sort-tab.is-on { color: var(--zk-blue); font-weight: 500; }
.zk-sort-right { display: flex; align-items: center; gap: 16px; }
.zk-kw {
    width: 160px; height: 26px; border: 1px solid #ddd; border-radius: 4px;
    padding: 0 8px; font-size: 12px; color: var(--zk-txt); font-family: inherit;
}
.zk-kw:focus { outline: none; border-color: var(--zk-blue); }
.zk-total { font-size: 12px; color: var(--zk-txt); white-space: nowrap; }
.zk-total b { color: var(--zk-red); font-weight: 600; }

/* 题目卡 */
.zk-card { background: #fff; border-radius: 4px; margin-bottom: 12px; }
.zk-card-src {
    display: inline-block; height: 24px; line-height: 24px; padding: 0 20px;
    background: #f0f8ff; color: var(--zk-blue); font-size: 12px;
    border-radius: 0 0 2px 0; max-width: 100%;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.zk-card-meta {
    height: 34px; display: flex; align-items: center; flex-wrap: nowrap;
    overflow: hidden; padding: 0 20px; font-size: 12px; color: var(--zk-txt2);
}
.zk-no { color: var(--zk-txt3); margin-right: 10px; flex-shrink: 0; }
.zk-chip { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--zk-txt3); font-size: 12px; }
.zk-chip-sep { color: var(--zk-line); margin: 0 10px; flex-shrink: 0; }
.zk-stem { padding: 0 20px; font-size: 14px; color: var(--zk-txt); line-height: 28px; }
.zk-opttable { width: calc(100% - 40px); margin: 4px 20px 0; border-collapse: collapse; table-layout: fixed; }
.zk-optcell {
    font-size: 14px; color: var(--zk-txt); line-height: 28px; padding: 2px 12px 2px 0;
    vertical-align: top; word-break: break-word;
}
.zk-optkey { color: var(--zk-txt); margin-right: 2px; }
.zk-qimgs { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px 20px 0; }
.zk-qimgs img { max-width: 260px; max-height: 180px; border: 1px solid #f0f0f0; border-radius: 2px; background: #fff; }
.zk-card-foot {
    height: 40px; margin-top: 8px; border-top: 1px solid #f4f9ff;
    display: flex; align-items: center; justify-content: space-between; padding: 0 20px;
}
.zk-foot-stat { font-size: 12px; color: var(--zk-txt3); }
.zk-foot-ops { display: flex; gap: 20px; }
.zk-op { font-size: 12px; color: var(--zk-blue); cursor: pointer; }
.zk-op:hover { text-decoration: underline; }
.zk-empty {
    background: #fff; border-radius: 4px; padding: 60px 20px;
    text-align: center; font-size: 13px; color: var(--zk-txt3);
}

/* 分页器 h38 居中 */
.zk-pager {
    height: 38px; display: flex; align-items: center; justify-content: center;
    gap: 6px; background: #fff; border-radius: 4px; flex-wrap: wrap;
}
.zk-pg {
    height: 22px; min-width: 22px; padding: 0 12px; border-radius: 8px;
    font-size: 14px; color: var(--zk-txt2); cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
}
.zk-pg:hover { color: var(--zk-blue); }
.zk-pg.is-cur { background: var(--zk-blue); color: #fff; cursor: default; }
.zk-pg-dots { color: var(--zk-txt3); font-size: 13px; padding: 0 2px; }
.zk-pg-nav { font-size: 13px; color: var(--zk-txt2); cursor: pointer; padding: 0 8px; height: 22px; display: inline-flex; align-items: center; }
.zk-pg-nav:hover { color: var(--zk-blue); }
.zk-pg-nav[data-dis] { color: #c8c8c8; cursor: default; pointer-events: none; }
.zk-pg-jump { font-size: 12px; color: var(--zk-txt2); display: inline-flex; align-items: center; gap: 4px; margin-left: 8px; }
.zk-pg-input {
    width: 34px; height: 22px; border: 1px solid #ddd; border-radius: 2px;
    text-align: center; font-size: 12px; color: var(--zk-txt);
}
.zk-pg-input:focus { outline: none; border-color: var(--zk-blue); }
.zk-pg-go { color: var(--zk-blue); cursor: pointer; font-size: 12px; }
.zk-pg-go:hover { text-decoration: underline; }

/* 详情模态框 */
.zk-d-head { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.zk-d-head span {
    font-size: 11.5px; padding: 2px 10px; border-radius: 999px;
    background: var(--c-paper-3); color: var(--c-ink-3); border: 1px solid var(--c-line);
}
.zk-d-head .zk-d-type { background: var(--c-primary-soft); color: var(--c-primary-700); border-color: var(--c-primary-line); }
.zk-d-aa { display: flex; gap: 10px; margin-top: 12px; align-items: baseline; }
.zk-d-label {
    flex-shrink: 0; font-size: 9.5px; letter-spacing: 0.16em; color: var(--c-ink-4);
    border: 1px solid var(--c-line); border-radius: var(--r-sm); padding: 1px 7px;
}
.zk-d-text { flex: 1; font-size: 13.5px; line-height: 1.8; color: var(--c-ink-2); }
.zk-d-src { margin-top: 14px; padding-top: 10px; border-top: 1px dashed var(--c-line); font-size: 11px; color: var(--c-ink-4); }
#zk-detail-body .zk-stem, #zk-detail-body .zk-opttable, #zk-detail-body .zk-qimgs { padding-left: 0; padding-right: 0; margin-left: 0; margin-right: 0; width: 100%; }

/* ================================================================
   TP · 第三方题库（#21：检索页对齐组卷网框架）
   —— zk- 结构类直接复用上方规则，此处仅提供：
      1) zk 色板变量在 thirdparty 路由下的副本（变量原本仅限 bank）；
      2) 第三方特有零件（课程选择/分面计数提示/题卡勾选/内联配图/lightbox）。
      全部限定在 [data-route="thirdparty"] 或 tp- 前缀下，不影响 bank。
   ================================================================ */
.route[data-route="thirdparty"] {
    --zk-blue: #2877ff;
    --zk-red: #f64e2c;
    --zk-txt: #333;
    --zk-txt2: #666;
    --zk-txt3: #999;
    --zk-line: #ececec;
}
.tp-zk {
    font-family: "Microsoft YaHei", "PingFang SC", Helvetica, Tahoma, sans-serif;
    --zk-blue: #2877ff;
    --zk-red: #f64e2c;
    --zk-txt: #333;
    --zk-txt2: #666;
    --zk-txt3: #999;
    --zk-line: #ececec;
}

/* ---------- 左栏：课程选择 ---------- */
.tp-course-box {
    display: flex; align-items: center; gap: 8px; padding: 10px 12px;
    border-bottom: 1px solid #f0f0f0; background: #fafbfc; flex-shrink: 0;
}
.tp-course-label { font-size: 9.5px; letter-spacing: 0.16em; color: #999; flex-shrink: 0; }
.tp-course-box select {
    flex: 1; min-width: 0; height: 26px; border: 1px solid #ddd; border-radius: 2px;
    background: #fff; color: var(--zk-txt); font-size: 12px; font-family: inherit; padding: 0 4px;
}
.tp-course-box select:focus { outline: none; border-color: var(--zk-blue); }

/* ---------- 筛选行：分面计数提示 / 上游不支持项置灰 ---------- */
.tp-fnote { font-size: 12px; color: var(--zk-txt3); line-height: 22px; }
.tp-fnote-warn { color: #B45309; }
.tp-zk .zk-opt.is-disabled,
.tp-zk .zk-sort-tab.is-disabled { color: #c8c8c8; cursor: not-allowed; }
.tp-zk .zk-opt.is-disabled:hover,
.tp-zk .zk-sort-tab.is-disabled:hover { color: #c8c8c8; }

/* ---------- 排序条：关键词搜索按钮 ---------- */
.tp-kwbtn {
    height: 26px; padding: 0 12px; border: 1px solid var(--zk-blue); border-radius: 4px;
    background: var(--zk-blue); color: #fff; font-size: 12px; cursor: pointer; font-family: inherit;
}
.tp-kwbtn:hover { background: #1c66e6; border-color: #1c66e6; }
.tp-kwbtn:disabled { opacity: 0.55; cursor: default; }
.tp-kwbtn.is-quiet { background: #fff; color: var(--zk-txt2); border-color: #ddd; }
.tp-kwbtn.is-quiet:hover { color: var(--zk-blue); border-color: var(--zk-blue); background: #fff; }

/* ---------- 选择栏（嵌入 zk-right，改为组卷网白底蓝调） ---------- */
.tp-zk .tp-selectbar {
    margin-bottom: 0; padding: 8px 20px; border-radius: 4px;
    background: #f0f8ff; border: 1px solid #d6e8ff; border-left: 3px solid var(--zk-blue);
}
.tp-zk .tp-selectbar-text b { color: var(--zk-blue); }
.tp-pickall {
    display: inline-flex; align-items: center; gap: 6px; font-size: 13px;
    color: var(--zk-txt2); cursor: pointer; white-space: nowrap;
}
.tp-pickall input { accent-color: var(--zk-blue); width: 14px; height: 14px; cursor: pointer; }

/* ---------- 题目卡：勾选 + 题型/结构 chip ---------- */
.tp-card.is-picked { box-shadow: inset 3px 0 0 var(--zk-blue); background: #fcfdff; }
.tp-pick {
    display: inline-flex; align-items: center; gap: 6px; font-size: 12px;
    color: var(--zk-txt3); cursor: pointer; user-select: none;
}
.tp-pick:hover { color: var(--zk-blue); }
.tp-pick.is-on { color: var(--zk-blue); }
.tp-pick input { accent-color: var(--zk-blue); width: 13px; height: 13px; cursor: pointer; }
.tp-zk .zk-chip.tp-chip-type { color: var(--zk-blue); }
.tp-zk .zk-chip.tp-chip-struct { color: #B45309; }

/* ---------- ② 内联配图：[图] 占位符原位渲染 ---------- */
.tp-inline-img {
    max-width: 320px; max-height: 220px; vertical-align: middle;
    margin: 2px 4px; padding: 2px; background: #fff;
    border: 1px solid #f0f0f0; border-radius: 2px; cursor: zoom-in;
}
.tp-inline-img:hover { border-color: var(--zk-blue); }
.tp-zk .zk-stem .tp-inline-img { max-width: 260px; max-height: 180px; }
/* 预览框内富文本：行高与图片适配 */
.tp-rich { font-size: 13.5px; line-height: 1.9; color: var(--c-ink-2); }
.tp-rich .tp-inline-img { max-width: 100%; max-height: 320px; display: block; margin: 6px auto; }
.tp-pv-content.tp-rich { max-width: 100%; }
.tp-lightbox { z-index: 300; }

/* ---------- 预览框：结构统计 / 答案录入 / 配图清单 ---------- */
.tp-pv-struct {
    font-size: 11px; color: var(--c-ink-4); background: var(--c-paper-3);
    border: 1px dashed var(--c-line); border-radius: var(--r-sm); padding: 5px 9px;
}
.tp-pv-row-top { align-items: flex-start; }
.tp-ans-input {
    width: 100%; margin-top: 6px; padding: 7px 9px; font-size: 13px; line-height: 1.7;
    font-family: var(--f-ui); color: var(--c-ink-1); background: #fff;
    border: 1px solid var(--c-line); border-radius: var(--r-sm); resize: vertical; box-sizing: border-box;
}
.tp-ans-input:focus { outline: none; border-color: var(--c-primary); }
.tp-pv-ans { white-space: pre-wrap; }
.tp-pv-gallery { display: flex; flex-wrap: wrap; gap: 10px; }
.tp-gitem { margin: 0; text-align: center; }
.tp-gitem img {
    max-width: 180px; max-height: 130px; padding: 3px; background: #fff;
    border: 1px solid var(--c-line); border-radius: var(--r-sm); cursor: zoom-in; display: block;
}
.tp-gitem img:hover { border-color: var(--c-primary); }
.tp-gitem figcaption { font-size: 10px; color: var(--c-ink-4); margin-top: 3px; }

/* ---------- 预览模态框页脚提示 ---------- */
.tp-foot-note { margin-right: auto; font-size: 12px; color: var(--c-ink-4); }

/* ---------- 窄屏：左右栏堆叠 ---------- */
@media (max-width: 1100px) {
    .tp-zk { flex-direction: column; }
    .tp-zk .zk-left { width: 100%; position: static; max-height: 320px; }
}