:root {
  --navy: #13243b;
  --navy-2: #1b3252;
  --primary: #2563eb;
  --primary-dark: #1d4ed8;
  --primary-soft: #eaf1ff;
  --cyan: #0ea5a8;
  --bg: #f4f7fb;
  --surface: #ffffff;
  --line: #e4eaf2;
  --text: #182437;
  --muted: #66758a;
  --success: #15803d;
  --success-soft: #eaf7ee;
  --warning: #b45309;
  --warning-soft: #fff5df;
  --danger: #c23939;
  --danger-soft: #fff0f0;
  --shadow: 0 8px 30px rgba(24, 45, 76, .07);
  --radius: 14px;
}

* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body { margin: 0; color: var(--text); background: var(--bg); font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", Arial, sans-serif; font-size: 14px; line-height: 1.65; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-dark); }
img { max-width: 100%; }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3, h4 { line-height: 1.35; }
:focus-visible { outline: 3px solid rgba(37, 99, 235, .28); outline-offset: 2px; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.text-success { color: var(--success); }
.text-danger { color: var(--danger); }
.text-warning { color: var(--warning); }
.mono { font-family: Consolas, monospace; }
.nowrap { white-space: nowrap; }

.boot-screen { min-height: 100vh; display: grid; place-content: center; justify-items: center; color: var(--muted); }
.brand-mark { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg, #3b82f6, #1d4ed8); font-size: 23px; font-weight: 800; box-shadow: 0 8px 22px rgba(37, 99, 235, .28); }

.login-page { min-height: 100vh; display: grid; grid-template-columns: minmax(420px, 1.15fr) minmax(440px, .85fr); background: #fff; }
.login-hero { position: relative; overflow: hidden; padding: 54px 64px; color: #fff; background: radial-gradient(circle at 85% 12%, rgba(39, 196, 204, .3), transparent 28%), radial-gradient(circle at 15% 90%, rgba(64, 125, 255, .35), transparent 36%), linear-gradient(145deg, #0f2038, #193c64 70%, #145369); display: flex; flex-direction: column; }
.login-hero::after { content: ""; position: absolute; width: 420px; height: 420px; right: -180px; bottom: -170px; border: 1px solid rgba(255, 255, 255, .13); border-radius: 50%; box-shadow: 0 0 0 60px rgba(255, 255, 255, .025), 0 0 0 120px rgba(255, 255, 255, .02); }
.login-brand { display: flex; align-items: center; gap: 13px; font-size: 19px; font-weight: 700; letter-spacing: .5px; }
.login-brand .brand-mark { background: rgba(255, 255, 255, .14); box-shadow: none; border: 1px solid rgba(255, 255, 255, .22); }
.hero-content { margin: auto 0; max-width: 650px; position: relative; z-index: 1; }
.hero-eyebrow { display: inline-flex; padding: 5px 12px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 30px; color: #bfe7ff; font-size: 12px; letter-spacing: 1px; }
.hero-content h1 { margin: 24px 0 20px; font-size: clamp(34px, 4.2vw, 54px); letter-spacing: 1px; }
.hero-content > p { color: #c5d6e9; font-size: 16px; max-width: 560px; }
.hero-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 35px; }
.hero-flow span { padding: 8px 12px; border-radius: 8px; background: rgba(255, 255, 255, .08); color: #e5f1ff; }
.hero-flow i { color: #73cbd4; font-style: normal; }
.login-footer { color: #90a8c2; font-size: 12px; position: relative; z-index: 1; }
.login-panel { display: grid; place-items: center; padding: 40px 56px; }
.login-box { width: min(410px, 100%); }
.login-box h2 { margin-bottom: 8px; font-size: 28px; }
.login-box > p { color: var(--muted); margin-bottom: 30px; }
.demo-accounts { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line); }
.demo-accounts p { margin-bottom: 10px; color: var(--muted); font-size: 12px; }
.demo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.demo-account { padding: 9px 5px; color: #40516a; background: #f7f9fc; border: 1px solid var(--line); border-radius: 8px; font-size: 12px; }
.demo-account:hover { color: var(--primary); border-color: #b8cdf5; background: var(--primary-soft); }
.login-note { margin-top: 20px; color: #8a97a8; font-size: 12px; text-align: center; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 244px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; color: #d9e5f2; background: linear-gradient(180deg, var(--navy), #102238); z-index: 30; }
.sidebar-brand { height: 76px; display: flex; align-items: center; gap: 11px; padding: 0 24px; border-bottom: 1px solid rgba(255, 255, 255, .07); }
.sidebar-brand .brand-mark { width: 37px; height: 37px; border-radius: 10px; font-size: 19px; }
.sidebar-brand strong { display: block; color: #fff; font-size: 16px; }
.sidebar-brand small { display: block; color: #7f9bb8; font-size: 10px; letter-spacing: 1.5px; }
.sidebar-school { margin: 18px 16px 10px; padding: 11px 12px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 9px; background: rgba(255, 255, 255, .035); color: #a9bed3; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidebar-nav { flex: 1; padding: 12px; overflow-y: auto; }
.nav-label { padding: 12px 12px 7px; color: #6f8ca9; font-size: 10px; letter-spacing: 1.5px; }
.nav-item { width: 100%; display: flex; align-items: center; gap: 12px; padding: 11px 13px; margin: 3px 0; border: 0; border-radius: 9px; color: #a9bdd1; background: transparent; text-align: left; transition: .18s ease; }
.nav-item svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.8; }
.nav-item:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.nav-item.active { color: #fff; background: linear-gradient(90deg, rgba(52, 121, 240, .85), rgba(52, 121, 240, .55)); box-shadow: 0 5px 16px rgba(0, 0, 0, .14); }
.sidebar-user { margin: 12px; padding: 13px; display: flex; align-items: center; gap: 10px; border-top: 1px solid rgba(255, 255, 255, .08); }
.avatar { width: 35px; height: 35px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: #dce9ff; color: #2455a4; font-weight: 700; }
.sidebar-user .avatar { background: rgba(108, 173, 255, .17); color: #a9d2ff; }
.sidebar-user-info { flex: 1; min-width: 0; }
.sidebar-user-info strong, .sidebar-user-info small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user-info strong { color: #f1f6fb; font-size: 13px; }
.sidebar-user-info small { color: #7f99b4; font-size: 11px; }
.icon-button { width: 34px; height: 34px; display: inline-grid; place-items: center; border: 0; border-radius: 8px; color: var(--muted); background: transparent; }
.icon-button:hover { background: rgba(128, 148, 173, .12); color: var(--primary); }
.icon-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.sidebar .icon-button { color: #88a0ba; }

.main { min-width: 0; }
.topbar { height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 32px; border-bottom: 1px solid var(--line); background: rgba(255, 255, 255, .92); position: sticky; top: 0; z-index: 20; backdrop-filter: blur(12px); }
.topbar-title { font-size: 15px; font-weight: 650; }
.topbar-subtitle { color: var(--muted); font-size: 12px; }
.topbar-right { display: flex; align-items: center; gap: 12px; }
.role-pill { padding: 4px 10px; border-radius: 20px; color: #426084; background: #f1f5fa; font-size: 12px; }
.mobile-menu { display: none; }
.content { max-width: 1540px; margin: 0 auto; padding: 28px 32px 48px; }
.page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.page-head h1 { margin-bottom: 6px; font-size: 25px; letter-spacing: -.3px; }
.page-head p { margin: 0; color: var(--muted); }
.page-actions { display: flex; gap: 9px; flex-wrap: wrap; }

.btn { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 8px 16px; border: 1px solid transparent; border-radius: 8px; font-weight: 600; font-size: 13px; transition: .16s ease; }
.btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-primary { color: #fff; background: var(--primary); border-color: var(--primary); box-shadow: 0 4px 12px rgba(37, 99, 235, .15); }
.btn-primary:hover:not(:disabled) { color: #fff; background: var(--primary-dark); border-color: var(--primary-dark); transform: translateY(-1px); }
.btn-secondary { color: #40516a; background: #fff; border-color: #d8e0eb; }
.btn-secondary:hover:not(:disabled) { color: var(--primary); border-color: #a9c2ee; background: #f9fbff; }
.btn-soft { color: var(--primary); background: var(--primary-soft); border-color: transparent; }
.btn-soft:hover { color: var(--primary-dark); background: #dfeaff; }
.btn-danger { color: var(--danger); background: var(--danger-soft); }
.btn-sm { min-height: 31px; padding: 5px 10px; font-size: 12px; }
.btn-lg { min-height: 45px; padding: 11px 23px; }
.btn-block { width: 100%; }

.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 2px 5px rgba(22, 44, 72, .015); }
.card-body { padding: 22px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 21px; border-bottom: 1px solid var(--line); }
.card-head h2, .card-head h3 { margin: 0; font-size: 16px; }
.card-head p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.stack { display: grid; gap: 18px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.stat-card { position: relative; overflow: hidden; padding: 20px 21px; }
.stat-card::after { content: ""; position: absolute; right: -25px; top: -25px; width: 85px; height: 85px; border-radius: 50%; background: var(--primary-soft); }
.stat-label { color: var(--muted); font-size: 12px; }
.stat-value { margin-top: 5px; font-size: 30px; font-weight: 750; letter-spacing: -.5px; }
.stat-unit { margin-left: 4px; color: var(--muted); font-size: 12px; font-weight: 400; }
.stat-foot { margin-top: 6px; color: #8a96a8; font-size: 11px; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.form-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.field { display: grid; gap: 6px; min-width: 0; }
.field > label, .field-label { color: #46556b; font-size: 12px; font-weight: 600; }
.input, .select, .textarea { width: 100%; min-height: 39px; padding: 8px 11px; color: var(--text); border: 1px solid #d8e1ec; border-radius: 8px; background: #fff; transition: .16s ease; }
.textarea { min-height: 85px; resize: vertical; }
.input:focus, .select:focus, .textarea:focus { outline: 0; border-color: #78a5ef; box-shadow: 0 0 0 3px rgba(37, 99, 235, .09); }
.input::placeholder, .textarea::placeholder { color: #9aa7b7; }
.form-hint { color: var(--muted); font-size: 11px; }
.form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.check-line { display: flex; align-items: center; gap: 8px; color: #46556b; }
.check-line input { accent-color: var(--primary); }

.tabs { display: inline-flex; gap: 4px; padding: 4px; border-radius: 10px; background: #eaf0f7; }
.tab { padding: 7px 15px; border: 0; border-radius: 7px; color: #607087; background: transparent; font-size: 12px; }
.tab:hover { color: var(--primary); }
.tab.active { color: var(--primary); background: #fff; box-shadow: 0 2px 7px rgba(32, 56, 88, .09); font-weight: 650; }
.subject-tabs { margin-bottom: 17px; }
.filter-card { padding: 18px 20px; margin-bottom: 18px; }
.filter-row { display: grid; grid-template-columns: repeat(5, minmax(110px, 1fr)); gap: 11px; align-items: end; }
.filter-row > .btn { grid-column: 1 / -1; width: 100%; white-space: nowrap; }
.smart-panel { margin-top: 16px; padding: 17px; border-radius: 10px; background: #f5f8ff; border: 1px solid #dce7fb; }
.smart-counts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 12px; }
.chapter-checks { max-height: 145px; overflow-y: auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 5px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }

.compose-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 20px; align-items: start; }
.basket { position: sticky; top: 90px; }
.basket-count { display: inline-grid; min-width: 22px; height: 22px; place-items: center; padding: 0 6px; border-radius: 20px; background: var(--primary-soft); color: var(--primary); font-size: 11px; }
.basket-list { max-height: 450px; overflow-y: auto; }
.basket-item { display: flex; align-items: flex-start; gap: 9px; padding: 12px 0; border-bottom: 1px dashed var(--line); }
.basket-item:last-child { border-bottom: 0; }
.basket-number { flex: 0 0 auto; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 6px; background: #f0f4fa; color: #53647a; font-size: 11px; }
.basket-text { flex: 1; min-width: 0; font-size: 12px; }
.basket-text p { margin: 0 0 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.basket-footer { padding-top: 15px; border-top: 1px solid var(--line); }

.question-list { display: grid; gap: 13px; }
.question-card { padding: 19px 20px; }
.question-top { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; }
.question-number { color: #40506a; font-weight: 700; margin-right: 3px; }
.badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 5px; color: #53657d; background: #f0f4f8; font-size: 10px; white-space: nowrap; }
.badge-blue { color: #2458b8; background: #eaf1ff; }
.badge-green { color: #187341; background: #eaf7ee; }
.badge-orange { color: #a3570a; background: #fff2dc; }
.badge-red { color: #b43b3b; background: #ffeded; }
.question-stem { margin-bottom: 11px; color: #25334a; line-height: 1.85; white-space: pre-wrap; }
.question-meta { display: flex; flex-wrap: wrap; gap: 12px; color: #8a96a6; font-size: 11px; }
.question-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 13px; padding-top: 12px; border-top: 1px dashed var(--line); }
.answer-detail { margin-top: 13px; padding: 12px 14px; border-radius: 8px; background: #f6f8fb; color: #4b5c72; font-size: 12px; }
.answer-detail p { margin: 4px 0; }
.option-list { display: grid; gap: 7px; margin: 12px 0; }
.option-row { display: flex; align-items: flex-start; gap: 9px; padding: 9px 12px; border: 1px solid #e1e7f0; border-radius: 8px; background: #fff; cursor: pointer; transition: .14s ease; }
.option-row:hover { border-color: #aac4ef; background: #f9fbff; }
.option-row:has(input:checked) { color: #174fae; border-color: #74a2ed; background: #f0f5ff; }
.option-row input { margin-top: 5px; accent-color: var(--primary); }
.option-key { font-weight: 700; }
.answer-fill { max-width: 440px; }

.empty { padding: 48px 20px; text-align: center; color: var(--muted); }
.empty-icon { width: 52px; height: 52px; margin: 0 auto 13px; display: grid; place-items: center; border-radius: 15px; background: #edf2f8; color: #8292a6; font-size: 23px; }
.empty h3 { color: #4d5d72; font-size: 15px; margin-bottom: 6px; }
.loading { padding: 45px; text-align: center; color: var(--muted); }
.spinner { display: inline-block; width: 22px; height: 22px; margin-right: 8px; border: 2px solid #d8e3f2; border-top-color: var(--primary); border-radius: 50%; vertical-align: middle; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { padding: 12px 15px; color: #6d7c8f; background: #f7f9fc; font-size: 11px; font-weight: 650; text-align: left; white-space: nowrap; }
td { padding: 13px 15px; border-bottom: 1px solid #edf1f6; vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fbfcfe; }
.table-title { color: #27364c; font-weight: 650; }
.table-actions { display: flex; gap: 7px; flex-wrap: wrap; }
.list-row { display: flex; align-items: center; gap: 15px; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.list-row:last-child { border-bottom: 0; }
.list-main { flex: 1; min-width: 0; }
.list-main h3 { margin: 0 0 5px; font-size: 14px; }
.list-main p { margin: 0; color: var(--muted); font-size: 12px; }
.list-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.paper-icon, .resource-icon { width: 43px; height: 48px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 8px; color: #2760be; background: #eaf1ff; font-size: 12px; font-weight: 750; }
.resource-icon { color: #147c7e; background: #e7f7f6; }

.paper-editor-head { padding: 22px; margin-bottom: 18px; }
.paper-question { display: grid; grid-template-columns: 32px minmax(0, 1fr) 90px 95px; gap: 12px; align-items: start; padding: 17px 20px; border-bottom: 1px solid var(--line); }
.paper-question:last-child { border-bottom: 0; }
.paper-question .question-stem { margin: 0; }
.order-buttons { display: flex; gap: 3px; }
.score-input { min-height: 34px; padding: 5px 8px; }

.assignment-banner { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 23px; margin-bottom: 20px; color: #fff; border-radius: var(--radius); background: linear-gradient(110deg, #1b3c67, #245aa0); }
.assignment-banner h2 { margin-bottom: 6px; }
.assignment-banner p { margin: 0; color: #c2d7ef; }
.assignment-banner .badge { color: #e6f4ff; background: rgba(255, 255, 255, .13); }
.answer-progress { position: sticky; top: 84px; z-index: 10; padding: 12px 18px; margin-bottom: 17px; display: flex; align-items: center; gap: 14px; box-shadow: var(--shadow); }
.progress-track { flex: 1; height: 7px; overflow: hidden; border-radius: 10px; background: #e8edf4; }
.progress-bar { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--primary), #39a2c4); transition: width .25s ease; }
.answer-submit-bar { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 18px 20px; margin-top: 18px; box-shadow: var(--shadow); }
.save-status { color: var(--muted); font-size: 12px; }

.score-hero { display: grid; grid-template-columns: auto 1fr; gap: 30px; align-items: center; padding: 28px; margin-bottom: 20px; background: linear-gradient(120deg, #fff, #f2f7ff); }
.score-ring { width: 130px; height: 130px; display: grid; place-content: center; text-align: center; border-radius: 50%; background: conic-gradient(var(--primary) var(--score-percent), #e2eaf4 0); position: relative; }
.score-ring::after { content: ""; position: absolute; inset: 10px; border-radius: 50%; background: #fff; }
.score-ring > div { position: relative; z-index: 1; }
.score-number { font-size: 36px; font-weight: 750; line-height: 1.1; }
.score-total { color: var(--muted); font-size: 12px; }
.kp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.kp-card { padding: 16px; border: 1px solid var(--line); border-radius: 10px; }
.kp-head { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 9px; }
.kp-head strong { font-size: 13px; }
.kp-rate { color: var(--primary); font-weight: 700; }
.bar-track { height: 8px; border-radius: 10px; background: #edf1f6; overflow: hidden; }
.bar-fill { height: 100%; min-width: 2px; border-radius: inherit; background: var(--primary); }
.bar-fill.good { background: #22a06b; }
.bar-fill.medium { background: #e5a23b; }
.bar-fill.low { background: #e05a5a; }

.chart { min-height: 205px; display: flex; align-items: flex-end; gap: 16px; padding: 24px 12px 5px; }
.chart-column { flex: 1; height: 170px; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 6px; }
.chart-value { color: #53647b; font-size: 11px; }
.chart-bar { width: min(45px, 70%); min-height: 3px; border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, #4c8df0, #2663ce); }
.chart-label { color: var(--muted); font-size: 10px; white-space: nowrap; }
.heat-cell { display: inline-block; min-width: 65px; padding: 4px 8px; border-radius: 6px; text-align: center; font-weight: 650; font-size: 11px; }
.heat-good { color: #166c42; background: #e5f6eb; }
.heat-medium { color: #99600c; background: #fff1d9; }
.heat-low { color: #ac3838; background: #ffe7e7; }

.resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.resource-card { padding: 21px; }
.resource-card .resource-icon { margin-bottom: 15px; }
.resource-card h3 { margin-bottom: 7px; font-size: 15px; }
.resource-card p { color: var(--muted); font-size: 12px; }
.resource-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--line); }

.notice { padding: 13px 15px; border: 1px solid #d9e7fb; border-radius: 9px; color: #3b5d88; background: #f1f6fe; font-size: 12px; }
.notice-warning { color: #86520c; background: #fff8e9; border-color: #f4dfb8; }
.notice-danger { color: #a43b3b; background: #fff2f2; border-color: #f2d1d1; }
.divider { height: 1px; margin: 20px 0; background: var(--line); }
.inline-list { display: flex; flex-wrap: wrap; gap: 8px; }
.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 8px; }
.mt-2 { margin-top: 16px; }
.mt-3 { margin-top: 24px; }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 8px; }
.mb-2 { margin-bottom: 16px; }
.w-100 { width: 100%; }

.toast { position: fixed; left: 50%; bottom: 30px; z-index: 100; max-width: min(480px, calc(100vw - 32px)); padding: 11px 18px; border-radius: 9px; color: #fff; background: #20344f; box-shadow: 0 8px 30px rgba(14, 29, 48, .25); opacity: 0; pointer-events: none; transform: translate(-50%, 15px); transition: .22s ease; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.toast.error { background: #a83c3c; }
.toast.success { background: #197049; }
.sidebar-backdrop { display: none; }

@media (max-width: 1250px) {
  .filter-row { grid-template-columns: repeat(3, minmax(120px, 1fr)); }
  .resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .compose-layout { grid-template-columns: minmax(0, 1fr) 280px; }
}

@media (max-width: 1000px) {
  .login-page { grid-template-columns: 1fr 1fr; }
  .login-hero { padding: 40px; }
  .compose-layout { grid-template-columns: 1fr; }
  .basket { position: static; }
  .basket-list { max-height: 260px; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-3 { grid-template-columns: 1fr; }
  .grid-3 > [style*="grid-column"] { grid-column: span 1 !important; }
}

@media (max-width: 780px) {
  .login-page { display: block; background: var(--bg); }
  .login-hero { min-height: 270px; padding: 28px 25px; }
  .hero-content { margin: 35px 0 0; }
  .hero-content h1 { margin: 14px 0 10px; font-size: 31px; }
  .hero-content > p { font-size: 13px; margin-bottom: 0; }
  .hero-flow, .login-footer { display: none; }
  .login-panel { margin-top: -22px; padding: 0 18px 35px; position: relative; z-index: 2; }
  .login-box { padding: 27px 23px; border-radius: 15px; background: #fff; box-shadow: var(--shadow); }
  .app-shell { display: block; }
  .sidebar { position: fixed; left: 0; transform: translateX(-102%); width: 244px; transition: transform .22s ease; }
  .sidebar.open { transform: translateX(0); }
  .sidebar-backdrop { position: fixed; inset: 0; z-index: 25; background: rgba(10, 25, 42, .48); }
  .sidebar-backdrop.show { display: block; }
  .mobile-menu { display: inline-grid; }
  .topbar { height: 60px; padding: 0 16px; }
  .topbar-subtitle, .role-pill { display: none; }
  .content { padding: 20px 16px 40px; }
  .page-head { display: block; }
  .page-head h1 { font-size: 22px; }
  .page-actions { margin-top: 13px; }
  .filter-row, .form-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-2, .kp-grid { grid-template-columns: 1fr; }
  .paper-question { grid-template-columns: 26px minmax(0, 1fr) 70px; }
  .paper-question .order-buttons { grid-column: 2 / -1; }
  .assignment-banner { display: block; }
  .assignment-banner .page-actions { margin-top: 15px; }
  .score-hero { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .resource-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .stats-grid { gap: 10px; }
  .stat-card { padding: 15px; }
  .stat-value { font-size: 25px; }
  .filter-row, .form-grid, .form-grid-3, .smart-counts { grid-template-columns: 1fr; }
  .chapter-checks { grid-template-columns: 1fr; }
  .card-body { padding: 17px; }
  .question-card { padding: 16px; }
  .question-actions { align-items: flex-start; flex-direction: column; }
  .answer-submit-bar { align-items: stretch; flex-direction: column; }
  .answer-submit-bar .btn { width: 100%; }
  .list-row { align-items: flex-start; flex-wrap: wrap; }
  .list-actions { width: 100%; }
  .chart { gap: 5px; }
}

@media print {
  .sidebar, .topbar, .page-actions, .btn, .answer-submit-bar { display: none !important; }
  .app-shell { display: block; }
  .content { padding: 0; }
  .card { border: 0; box-shadow: none; }
}


.studio-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.studio-summary > div { display: flex; align-items: baseline; gap: 10px; padding: 18px 21px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.studio-summary strong { color: var(--primary); font-size: 25px; }
.studio-summary span { color: var(--muted); font-size: 12px; }
.studio-search-card { padding: 18px 20px; margin-bottom: 24px; }
.studio-group { margin-bottom: 25px; }
.studio-group-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px; }
.studio-group-head h2 { margin: 0; font-size: 17px; }
.studio-group-head span { color: var(--muted); font-size: 12px; }
.studio-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.studio-tool { min-height: 160px; display: flex; align-items: flex-start; gap: 12px; padding: 17px; border: 1px solid var(--line); border-radius: 12px; color: var(--text); background: var(--surface); text-align: left; transition: .16s ease; }
.studio-tool:hover { border-color: #a9c2ee; box-shadow: var(--shadow); transform: translateY(-2px); }
.studio-tool-icon { width: 35px; height: 35px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); font-weight: 700; }
.studio-tool strong, .studio-tool small, .studio-tool em { display: block; }
.studio-tool strong { margin-bottom: 7px; font-size: 14px; }
.studio-tool small { color: var(--muted); font-size: 11px; line-height: 1.6; }
.studio-tool em { margin-top: 8px; color: #738399; font-size: 10px; font-style: normal; line-height: 1.5; }
.studio-layout { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 18px; align-items: start; }
.studio-editor-card { min-width: 0; }
.studio-editor { min-height: 520px; font-family: "Microsoft YaHei", "PingFang SC", sans-serif; line-height: 1.8; }
.studio-actions { flex-wrap: wrap; }
.studio-action-spacer { flex: 1; }

@media (max-width: 1250px) {
  .studio-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1000px) {
  .studio-layout { grid-template-columns: 1fr; }
  .studio-editor { min-height: 400px; }
}

@media (max-width: 780px) {
  .studio-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .studio-tool { min-height: 140px; }
}

@media (max-width: 480px) {
  .studio-summary, .studio-grid { grid-template-columns: 1fr; }
  .studio-tool { min-height: 0; }
  .studio-actions { align-items: stretch; flex-direction: column; }
  .studio-actions .btn { width: 100%; }
  .studio-action-spacer { display: none; }
}


.textbook-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 18px; padding: 17px 20px; margin-bottom: 18px; }
.textbook-toolbar .field { flex: 1; max-width: 520px; }
.toolbar-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.textbook-layout { display: grid; grid-template-columns: 245px minmax(0, 1fr) 295px; gap: 16px; align-items: start; }
.textbook-tree-panel, .textbook-profile-panel { position: sticky; top: 88px; }
.textbook-tree { display: grid; gap: 5px; max-height: 540px; overflow-y: auto; margin-bottom: 16px; }
.textbook-tree-node { display: grid; gap: 3px; width: 100%; padding: 10px 10px; border: 0; border-radius: 8px; color: var(--text); background: transparent; text-align: left; }
.textbook-tree-node:hover, .textbook-tree-node.active { color: var(--primary); background: var(--primary-soft); }
.textbook-tree-node small { color: var(--muted); font-size: 10px; }
.textbook-content-editor { min-height: 390px; font-family: "Microsoft YaHei", sans-serif; line-height: 1.8; }
.textbook-actions { flex-wrap: wrap; }
.textbook-profile-panel .textarea { min-height: 70px; }
.dialog { width: min(650px, calc(100vw - 30px)); max-height: 88vh; padding: 0; border: 1px solid var(--line); border-radius: 14px; color: var(--text); background: #fff; box-shadow: 0 24px 70px rgba(13, 35, 58, .25); }
.dialog-wide { width: min(1000px, calc(100vw - 30px)); }
.dialog::backdrop { background: rgba(12, 28, 46, .5); }
.dialog-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.dialog-head h2 { margin: 0; font-size: 17px; }
.dialog-body { max-height: calc(88vh - 65px); overflow-y: auto; padding: 20px; }
.toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.version-diff { max-height: 260px; overflow: auto; padding: 12px; border-radius: 8px; background: #f3f6fa; white-space: pre-wrap; font-size: 11px; }
.textbook-source-card { margin-bottom: 12px; }
.card-head-inline { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.textbook-source-card p { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }

@media (max-width: 1250px) {
  .textbook-layout { grid-template-columns: 220px minmax(0, 1fr); }
  .textbook-profile-panel { position: static; grid-column: 1 / -1; }
}
@media (max-width: 780px) {
  .textbook-toolbar { display: block; }
  .toolbar-actions { margin-top: 12px; }
  .textbook-layout { grid-template-columns: 1fr; }
  .textbook-tree-panel { position: static; }
  .textbook-content-editor { min-height: 320px; }
}

.textbook-entry { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.textbook-entry p { margin: 4px 0 0; }
@media (max-width: 480px) { .textbook-entry { align-items: flex-start; flex-direction: column; } }

.textbook-page-head .eyebrow { color: var(--primary); font-size: 11px; font-weight: 700; letter-spacing: .16em; margin-bottom: 8px; }
.textbook-page-head h1 { margin-bottom: 6px; }
.textbook-page-head p { font-size: 12px; }
.textbook-tree-panel .panel-title { gap: 8px; }
.textbook-tree-panel .panel-title h2 { font-size: 16px; }
.textbook-tree-panel .panel-title .btn { white-space: nowrap; }
.textbook-empty-editor { display: grid; min-height: 260px; place-items: center; border: 1px dashed #cbd9e8; border-radius: 10px; background: #fbfdff; }
.textbook-empty-editor .empty { width: 100%; }
@media (max-width: 780px) {
  .textbook-page-head { display: block; }
  .textbook-page-head .page-actions { margin-top: 12px; }
  .textbook-page-head .page-actions .btn { width: 100%; }
}


.textbook-simple-head, .textbook-stepper, .textbook-simple-card { max-width: 1100px; margin-left: auto; margin-right: auto; }
.textbook-simple-head h1 { margin-bottom: 6px; }
.textbook-simple-head .eyebrow { color: var(--primary); font-size: 10px; font-weight: 700; letter-spacing: .12em; margin-bottom: 7px; }
.textbook-stepper { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 18px; }
.textbook-step { display: grid; grid-template-columns: 32px 1fr; gap: 2px 9px; align-items: center; padding: 13px 15px; border: 1px solid var(--line); border-radius: 11px; color: var(--muted); background: #fff; text-align: left; }
.textbook-step>span { grid-row: 1 / 3; display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; color: var(--primary); background: var(--primary-soft); font-weight: 700; }
.textbook-step strong { color: var(--text); font-size: 13px; }
.textbook-step small { font-size: 10px; }
.textbook-step.active { border-color: #8bb0ed; background: var(--primary-soft); }
.textbook-step.active>span { color: #fff; background: var(--primary); }
.textbook-simple-card { min-height: 430px; padding: 26px; }
.textbook-guide-message { margin-bottom: 22px; padding: 16px 18px; border-left: 4px solid var(--primary); border-radius: 9px; background: var(--primary-soft); }
.textbook-guide-message strong { color: var(--navy); font-size: 17px; }
.textbook-guide-message p { margin: 6px 0 0; color: var(--muted); }
.textbook-advanced { padding: 12px 14px; border: 1px solid var(--line); border-radius: 9px; background: #f8fafc; }
.textbook-advanced summary { color: var(--primary); cursor: pointer; font-size: 12px; font-weight: 600; }
.textbook-chapter-list { display: grid; gap: 10px; }
.textbook-chapter { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 14px 15px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.textbook-chapter.active { border-color: #91b4e9; background: #f5f8ff; }
.textbook-chapter-number { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); font-weight: 700; }
.textbook-chapter strong, .textbook-chapter small { display: block; }
.textbook-chapter small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.textbook-chapter-actions { display: flex; gap: 10px; margin-top: 18px; }
.textbook-writing-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; margin-bottom: 17px; }
.textbook-writing-top h2 { margin: 7px 0 3px; }
.textbook-writing-top .select { max-width: 320px; }
.textbook-chat { margin-top: 22px; padding: 18px; border: 1px solid #d6e5f7; border-radius: 12px; background: #f7faff; }
.textbook-chat-title { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 13px; }
.textbook-chat-title span { color: var(--muted); font-size: 11px; }
.textbook-chat-messages { display: grid; gap: 9px; max-height: 260px; overflow-y: auto; margin-bottom: 14px; }
.textbook-chat-message { max-width: 85%; padding: 12px 14px; border-radius: 10px; }
.textbook-chat-message p { margin: 4px 0 0; white-space: pre-wrap; }
.textbook-chat-message.assistant { color: #31536f; background: #fff; }
.textbook-chat-message.user { margin-left: auto; color: #fff; background: var(--primary); }
.textbook-export-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; margin-bottom: 20px; }
.textbook-export-stats>div { padding: 18px; border: 1px solid var(--line); border-radius: 10px; text-align: center; background: #fff; }
.textbook-export-stats strong, .textbook-export-stats span { display: block; }
.textbook-export-stats strong { color: var(--primary); font-size: 26px; }
.textbook-export-stats span { color: var(--muted); font-size: 11px; }
.textbook-export-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.textbook-check-result { margin-top: 20px; padding: 16px; border-radius: 10px; background: var(--primary-soft); }
.textbook-check-result h3 { margin-top: 0; }
.textbook-welcome { display: grid; min-height: 370px; place-content: center; justify-items: center; text-align: center; }
.textbook-welcome-mark { display: grid; width: 54px; height: 54px; place-items: center; border-radius: 15px; color: #fff; background: var(--primary); font-size: 25px; font-weight: 700; }
.textbook-welcome h2 { margin: 18px 0 6px; }
.textbook-welcome p { max-width: 520px; color: var(--muted); }
.textbook-welcome .btn { margin-top: 15px; }

@media (max-width: 780px) {
  .textbook-stepper { grid-template-columns: repeat(2, 1fr); }
  .textbook-simple-card { padding: 18px; }
  .textbook-chapter { grid-template-columns: 32px minmax(0, 1fr); }
  .textbook-chapter .btn { grid-column: 1 / -1; width: 100%; }
  .textbook-writing-top { display: block; }
  .textbook-writing-top .select { max-width: none; margin-top: 10px; }
  .textbook-chat-title { display: block; }
  .textbook-chat-title span { display: block; margin-top: 4px; }
  .textbook-chat-message { max-width: 95%; }
}

.textbook-component-select { margin-bottom: 14px; padding: 10px 12px; border: 1px solid #d6e5f7; border-radius: 9px; background: #fff; }
.textbook-component-select summary { color: var(--primary); cursor: pointer; font-size: 12px; font-weight: 600; }
.textbook-component-select .form-hint { display: block; margin-top: 8px; }

.compose-subject-card { margin-bottom: 16px; padding: 16px 20px; }
.compose-subject-card .field { max-width: 620px; }
.compose-subject-card .form-hint { display: block; margin-top: 7px; }
#teacher-subjects { min-height: 240px; }
#teacher-subjects optgroup { color: var(--navy); font-weight: 700; }
#teacher-subjects option { padding: 5px 8px; font-weight: 400; }

.textbook-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; max-width: 1100px; margin: 0 auto 20px; padding: 23px 26px; border: 1px solid #dce7f6; border-radius: 16px; background: linear-gradient(135deg, #fff 35%, #eef5ff); box-shadow: 0 8px 24px rgba(30, 70, 120, .05); }
.textbook-hero-main { display: flex; align-items: center; gap: 17px; }
.textbook-hero-icon { display: grid; width: 50px; height: 50px; flex: 0 0 auto; place-items: center; border-radius: 14px; color: #fff; background: linear-gradient(145deg, #3b82f6, #2158c9); box-shadow: 0 8px 18px rgba(37, 99, 235, .2); }
.textbook-hero-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.textbook-hero-badge { display: inline-flex; padding: 2px 9px; border-radius: 20px; color: #2459b4; background: #e2edff; font-size: 10px; font-weight: 650; }
.textbook-hero h1 { margin: 6px 0 4px; color: #142a46; font-size: 25px; }
.textbook-hero p { margin: 0; color: var(--muted); font-size: 12px; }
.textbook-hero .btn { flex: 0 0 auto; min-height: 42px; }
.textbook-stepper { padding: 6px; border: 1px solid #e2e9f2; border-radius: 14px; background: #edf2f8; }
.textbook-step { min-height: 68px; border-color: transparent; background: transparent; }
.textbook-step.active { border-color: #d6e3f6; background: #fff; box-shadow: 0 4px 14px rgba(32, 65, 108, .08); }
.textbook-step.completed>span { color: #18734a; background: #e4f5eb; }
.textbook-simple-card { padding: 0; overflow: hidden; border-color: #dfe7f1; box-shadow: 0 8px 26px rgba(26, 54, 89, .04); }
.textbook-form-head { display: flex; align-items: center; gap: 13px; padding: 21px 26px; border-bottom: 1px solid var(--line); background: #fbfdff; }
.textbook-form-head>span { padding: 4px 10px; border-radius: 7px; color: var(--primary); background: var(--primary-soft); font-size: 11px; font-weight: 700; }
.textbook-form-head h2 { margin: 0; color: #172b47; font-size: 18px; }
.textbook-form-head p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.textbook-form-section { margin: 22px 26px; padding: 20px; border: 1px solid #e5ebf3; border-radius: 12px; background: #fbfcfe; }
.textbook-section-title { display: flex; align-items: center; gap: 9px; margin-bottom: 17px; color: #273c56; }
.textbook-section-title>span { display: grid; width: 23px; height: 23px; place-items: center; border-radius: 7px; color: #2c64bb; background: #e8f0fd; font-size: 11px; }
.textbook-section-title strong { font-size: 13px; }
.textbook-form-section .input, .textbook-form-section .select, .textbook-form-section .textarea { background: #fff; }
#textbook-profile-form>.textbook-advanced { margin: 0 26px 20px; background: #fbfcfe; }
.textbook-form-actions { margin-top: 0; padding: 17px 26px; border-top: 1px solid var(--line); background: #fbfdff; }

@media (max-width: 780px) {
  .textbook-hero { align-items: flex-start; padding: 20px; }
  .textbook-hero-main { align-items: flex-start; }
  .textbook-hero-icon { width: 42px; height: 42px; }
  .textbook-hero h1 { font-size: 22px; }
  .textbook-hero>.btn { align-self: center; }
  .textbook-form-head { padding: 18px; }
  .textbook-form-section { margin: 17px 18px; padding: 16px; }
  #textbook-profile-form>.textbook-advanced { margin: 0 18px 18px; }
  .textbook-form-actions { padding: 15px 18px; }
}
.textbook-section-title small { margin-left: auto; color: var(--muted); font-size: 10px; font-weight: 400; }
.textbook-aligned-fields { align-items: start; }
.textbook-aligned-fields .field { grid-template-rows: 22px 42px; gap: 7px; }
.textbook-aligned-fields .field>label { display: flex; align-items: center; margin: 0; }
.textbook-aligned-fields .select { height: 42px; min-height: 42px; }

@media (max-width: 780px) {
  .textbook-section-title { flex-wrap: wrap; }
  .textbook-section-title small { width: 100%; margin: 2px 0 0 32px; }
}
@media (max-width: 520px) {
  .textbook-hero { flex-direction: column; }
  .textbook-hero>.btn { width: 100%; }
  .textbook-form-actions { flex-direction: column-reverse; }
  .textbook-form-actions .btn { width: 100%; }
}

.teacher-uploads { margin: 13px 0; padding: 14px; border: 1px dashed #bfd0e5; border-radius: 10px; background: #fff; }
.teacher-upload-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.teacher-upload-head strong { color: #263c57; font-size: 12px; }
.teacher-upload-head p { margin: 2px 0 0; color: var(--muted); font-size: 10px; }
.teacher-upload-action { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; margin-top: 11px; }
.teacher-upload-action .input { padding: 4px 8px; font-size: 11px; }
.teacher-upload-list { max-height: 180px; margin-top: 8px; overflow-y: auto; }
.teacher-upload-item { display: grid; grid-template-columns: minmax(0, 1fr) auto 30px; gap: 8px; align-items: center; padding: 6px 0; border-top: 1px solid #edf1f6; }
.teacher-upload-item label { display: flex; align-items: center; gap: 7px; min-width: 0; font-size: 11px; }
.teacher-upload-item label span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.teacher-upload-item input { accent-color: var(--primary); }
.teacher-upload-item small { color: var(--muted); font-size: 10px; white-space: nowrap; }
.textbook-step-assistant { margin: 22px 26px 26px; }
.textbook-chat-title>div { display: flex; align-items: center; gap: 10px; }
.textbook-chat-title>div>strong { color: #1c3452; }
.textbook-step-assistant .form-grid { margin-top: 14px; }
.textbook-step-assistant .btn-block { margin-top: 14px; }
@media (max-width: 780px) {
  .teacher-upload-action { grid-template-columns: 1fr; }
  .teacher-upload-action .btn { width: 100%; }
  .textbook-step-assistant { margin: 17px 18px 18px; }
  .textbook-chat-title>div { align-items: flex-start; flex-direction: column; }
}

.studio-version-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 18px; }
#studio-version-list { display: grid; gap: 6px; align-content: start; max-height: 480px; overflow-y: auto; }
#studio-version-list .list-row { width: 100%; border: 1px solid var(--line); text-align: left; background: #fff; }
#studio-version-content { min-height: 300px; max-height: 480px; white-space: pre-wrap; }
@media (max-width: 700px) { .studio-version-layout { grid-template-columns: 1fr; } }

.studio-data-import { padding: 13px; border: 1px solid #d9e5f5; border-radius: 10px; background: #f6f9ff; }
.studio-data-import>strong { display: block; margin-bottom: 9px; color: #29486d; font-size: 12px; }
.studio-data-import .form-hint { display: block; margin-top: 7px; }
.studio-data-import .form-grid { align-items: center; }
.studio-visual-image { display: block; width: 100%; height: auto; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.studio-editable-table { min-width: 650px; }
.studio-editable-table td { padding: 5px; }
.studio-editable-table .input { min-height: 34px; padding: 5px 8px; font-size: 11px; }
.question-quality { padding: 12px 14px; border-radius: 9px; background: #f3f6fa; }
.question-quality strong, .question-quality span { display: block; }
.question-quality span { margin-top: 4px; color: var(--muted); font-size: 11px; }
.question-quality ul { margin: 8px 0 0; padding-left: 20px; }
.quality-pass { color: var(--success); background: var(--success-soft); }
.quality-fail { color: var(--danger); background: var(--danger-soft); }
.studio-ppt-preview { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.studio-slide-preview { position: relative; min-height: 160px; padding: 18px; border: 1px solid var(--line); border-left: 5px solid #2563eb; border-radius: 10px; background: #eaf1ff; }
.studio-slide-preview>span { color: var(--muted); font-size: 10px; }
.studio-slide-preview h3 { margin: 7px 0 10px; font-size: 16px; }
.studio-slide-preview p { margin: 4px 0; font-size: 11px; }
.studio-slide-preview.theme-green { border-left-color: #0f766e; background: #e7f6f1; }
.studio-slide-preview.theme-orange { border-left-color: #c25717; background: #fff2e4; }
.slide-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.layout-image-right .slide-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(80px, 40%); gap: 12px; align-items: start; }
.slide-image { display: block; width: 100%; max-height: 140px; object-fit: contain; border-radius: 7px; background: #fff; }
.slide-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 12px; }
.slide-controls .select { min-height: 30px; padding: 3px 6px; font-size: 10px; }
.studio-slide-preview.anim-fade { animation: slideFade .25s ease-in; }
.studio-slide-preview.anim-push { animation: slidePush .25s ease-out; }
.studio-slide-preview.anim-wipe { animation: slideWipe .25s ease-out; }
@keyframes slideFade { from { opacity: .35; } to { opacity: 1; } }
@keyframes slidePush { from { transform: translateX(14px); opacity: .5; } to { transform: translateX(0); opacity: 1; } }
@keyframes slideWipe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
.textbook-apply-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 13px; padding-top: 13px; border-top: 1px solid #dce7f5; }
.mind-tree { margin: 0; padding-left: 22px; list-style: none; }
.mind-tree .mind-tree { margin-left: 20px; border-left: 1px solid #c9d9ee; }
.mind-node { display: grid; grid-template-columns: 26px minmax(120px, 1fr) 30px 32px 32px 32px; gap: 5px; align-items: center; max-width: 620px; margin: 6px 0; padding: 6px; border: 1px solid #cddcf0; border-radius: 9px; background: #f8fbff; cursor: grab; }
.mind-drag-handle { display: flex; align-items: center; justify-content: center; height: 26px; border-radius: 6px; color: var(--primary); background: var(--primary-soft); font-size: 12px; user-select: none; }
#studio-mindmap-editor { position: relative; }
.mind-links-svg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
#studio-mindmap-editor .mind-tree { position: relative; z-index: 1; }
.mind-node:active { cursor: grabbing; touch-action: none; }
.mind-node .input { min-height: 32px; padding: 4px 8px; font-size: 12px; }
.mind-toggle { width: 24px; height: 24px; border: 0; border-radius: 6px; color: var(--primary); background: var(--primary-soft); }
.collaboration-panel { margin-top: 18px; }
.comment-item { padding: 11px 0; border-bottom: 1px solid var(--line); }
.comment-item>div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.comment-item strong { display: flex; align-items: center; gap: 8px; }
.comment-item time { color: var(--muted); font-size: 10px; }
.comment-item p { margin: 6px 0; white-space: pre-wrap; }
.textbook-image-picker { margin: 18px 0; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: #f8fbff; }
.publication-dialog { width: min(940px, calc(100vw - 24px)); }
#textbook-publication-pages { padding: 24px; background: #dfe5ec; }
.publication-page { width: min(100%, 620px); min-height: 780px; margin: 0 auto 24px; padding: 62px 58px; background: #fff; box-shadow: 0 5px 20px rgba(25, 42, 65, .12); }
.publication-page h2 { margin-bottom: 24px; font-size: 22px; }
.publication-page p { line-height: 1.9; }
.publication-page img { display: block; max-width: 100%; max-height: 420px; margin: 20px auto; object-fit: contain; }
.publication-cover { display: grid; align-content: center; text-align: center; }
.publication-cover h1 { font-size: 32px; }
.publication-cover span { color: var(--primary); letter-spacing: .3em; }
@media (max-width: 650px) { .publication-page { min-height: 620px; padding: 32px 24px; } }