/* Hallmark · genre: editorial · macrostructure: Split Studio · theme: locked「批改编辑部」
 * enrichment: E8 generated editorial photography · built-in ImageGen · CSS-cropped and colour-graded
 * nav: N3 Side-rail · footer: Ft2 Inline-rule · designed-as-app · studied: no
 */
/* Hallmark · pre-emit critique: P5 H5 E4 S5 R5 V5 */
/* Hallmark · contrast: pass (40–41) · nav: N3 · footer: Ft2 · slop: pass (42–45)
 * honest: pass (46) · chrome: pass (47) · tokens: pass (48) · responsive: pass (49)
 * mobile: pass (34, 49, 50–57) · icons: pass (30) */
/* 「作业本+红笔」v1.1：干净暖纸底（无纹理）、墨色正文、朱红笔为唯一彩色 accent。
   品质感 = 留白 + 层级 + hairline/轻投影 + 红笔克制。
   一切颜色/字体/间距引用 var(--token)，本文件不允许裸色值（token 定义在 tokens.css）。 */

/* ---------- Reset & 硬地板 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; }
body {
    overflow-x: clip;
    margin: 0;
    background: var(--color-paper);
    color: var(--color-ink);
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.7;            /* design.md · 中文正文行高 */
    line-break: strict;          /* 中文避头尾：标点禁行首 */
    -webkit-text-size-adjust: 100%;
}
img { max-width: 100%; height: auto; }

/* ---------- 标题 / 正文：层级拉开 ---------- */
h1, h2, h3 {
    font-style: normal;          /* 禁用斜体标题 */
    color: var(--color-ink);
    overflow-wrap: anywhere;
    text-wrap: balance;          /* 自动断行时选平衡点，不留孤字行 */
    min-width: 0;
}
h1 {                             /* 页面主标题：Display serif，一页一个 */
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.25;
    font-size: var(--text-xl);
    margin: var(--space-2xs) 0 var(--space-md);
}
h2 {                             /* 卡片标题：降回正文加粗，不抢戏 */
    font-family: var(--font-body);
    font-weight: 600;
    font-size: var(--text-md);
    line-height: 1.4;
    margin: 0 0 var(--space-xs);
}
h3 { font-family: var(--font-body); font-weight: 600; font-size: var(--text-sm); margin: 0 0 var(--space-2xs); }
p  { margin: 0 0 var(--space-xs); }
.muted { color: var(--color-ink-2); font-size: var(--text-sm); }
.num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
a { color: var(--color-accent); text-decoration-color: var(--color-rule); text-underline-offset: 3px; }
a:hover { text-decoration-color: var(--color-accent); }
a:active { color: var(--color-accent-deep); }
hr { border: none; border-top: 1px solid var(--color-rule); margin: var(--space-md) 0; }

/* ---------- 顶部细条（细而矮：品牌 + 身份/出口） ---------- */
.topbar {
    position: sticky; top: 0; z-index: var(--z-sticky-nav);
    display: flex; align-items: center; gap: var(--space-sm);
    padding: var(--space-3xs) var(--space-sm);
    background: var(--color-card);
    border-bottom: 1px solid var(--color-rule);
}
.topbar .brand {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-md);
    line-height: 1;
    letter-spacing: 0.01em;
    white-space: nowrap;
    text-decoration: none;
    color: var(--color-ink);
}
.topbar .brand::before {         /* 红笔点：全站唯一装饰 */
    content: "";
    display: inline-block;
    width: 0.55em; height: 0.55em;
    margin-right: var(--space-3xs);
    background: var(--color-accent);
    border-radius: 1px;
}
.topbar .spacer { flex: 1; }
.topbar a {
    color: var(--color-ink-2);
    text-decoration: none;
    font-size: var(--text-sm);
    line-height: 1;
    white-space: nowrap;
    padding: var(--space-3xs) 0;
}
@media (hover: hover) and (pointer: fine) {
    .topbar a:hover { color: var(--color-accent); }
}
.topbar .muted { font-size: var(--text-sm); white-space: nowrap; }

/* ---------- 容器：收窄，不铺满 ---------- */
.container {
    max-width: 42.5rem;          /* ≈680px */
    margin: 0 auto;
    padding: var(--space-lg) var(--space-sm) var(--space-xl);
}

/* ---------- 卡片：hairline + 极轻投影 + 充足留白 ---------- */
.card {
    background: var(--color-card);
    border: 1px solid var(--color-rule);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    padding: var(--space-md);
    margin-bottom: var(--space-md);
}
.list-item { display: block; text-decoration: none; color: var(--color-ink); }
@media (hover: hover) and (pointer: fine) {
    .list-item:hover {
        border-color: var(--color-accent);
        transition: border-color var(--dur-short) var(--ease-out);
    }
}
.list-item .muted { margin-top: var(--space-3xs); }

/* ---------- 行布局 ---------- */
.row { display: flex; gap: var(--space-2xs); flex-wrap: wrap; align-items: center; }
.spacer { flex: 1; }
.flex-1 { flex: 1; min-width: 0; }

/* ---------- 标签 / 状态：ink 系浅底，状态靠文字颜色 ---------- */
.tag {
    display: inline-block;
    font-size: var(--text-xs);
    line-height: 1.6;
    padding: 0 var(--space-2xs);
    border-radius: var(--radius-pill);
    background: var(--color-neutral-soft);
    color: var(--color-ink-2);
    border: 1px solid var(--color-rule);
    white-space: nowrap;
}
.tag.pending   { color: var(--color-warn-ink); }
.tag.published { color: var(--color-ok-ink); }
.tag.grading   { color: var(--color-accent-deep); }
.tag.failed    { color: var(--color-err-ink); }

/* ---------- 按钮：8 态全做 ---------- */
.btn {
    display: inline-block;
    padding: var(--space-2xs) var(--space-sm);
    min-height: 2.75rem;                 /* 44px 触控地板，与输入框同高 */
    border: 1px solid var(--color-accent);
    border-radius: var(--radius-input);
    background: var(--color-accent);
    color: var(--color-accent-ink);      /* 红底白字走 token，不写死 white */
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;                 /* 按钮永不折两行 */
    transition: background-color var(--dur-short) var(--ease-out),
                border-color var(--dur-short) var(--ease-out),
                transform 100ms var(--ease-out);
}
@media (hover: hover) and (pointer: fine) {
    .btn:hover { background: var(--color-accent-deep); border-color: var(--color-accent-deep); }
}
.btn:active { transform: translateY(1px); }
.btn:focus { outline: none; }
.btn:focus-visible {
    outline: 2px solid var(--color-focus);   /* 红环即刻显示，无动画 */
    outline-offset: 3px;
}
.btn:disabled, .btn[aria-disabled="true"] {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
}
.btn.loading, .btn[aria-busy="true"] {       /* loading：标签可读 + 内联 spinner */
    cursor: progress;
    opacity: 0.85;
}
.btn.loading::after, .btn[aria-busy="true"]::after {
    content: "";
    display: inline-block;
    width: 0.9em; height: 0.9em;
    margin-left: var(--space-2xs);
    border: 2px solid var(--color-accent-ink);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    vertical-align: -0.1em;
}
.btn.error, .btn.is-error {                  /* error 态：深错误红 */
    background: var(--color-err);
    border-color: var(--color-err);
    color: var(--color-accent-ink);
}
.btn.success, .btn.is-success {              /* success 态：过关绿 */
    background: var(--color-ok);
    border-color: var(--color-ok);
    color: var(--color-accent-ink);
}
.btn.secondary {
    background: var(--color-card);
    color: var(--color-ink);
    border-color: var(--color-rule);
}
@media (hover: hover) and (pointer: fine) {
    .btn.secondary:hover {
        background: var(--color-paper-2);
        border-color: var(--color-ink-2);
        color: var(--color-ink);
    }
}
.btn.secondary.loading::after, .btn.secondary[aria-busy="true"]::after {
    border-color: var(--color-ink-2);
    border-top-color: transparent;
}
.btn.small {
    padding: var(--space-3xs) var(--space-xs);
    min-height: 2.25rem;
    font-size: var(--text-sm);
}
@media (pointer: coarse) {
    .btn { min-height: 3rem; }
}
form > .btn { margin-top: var(--space-xs); }
.row .btn { margin-top: 0; }

/* ---------- 表单 ---------- */
label {
    display: block;
    font-size: var(--text-sm);
    font-weight: 600;
    margin: var(--space-xs) 0 var(--space-3xs);
}
input[type=text], input[type=password], input[type=number], select, textarea {
    width: 100%;
    min-height: 2.75rem;                     /* 与按钮同高 */
    padding: var(--space-2xs) var(--space-xs);
    border: 1px solid var(--color-rule);     /* 1px 恒定，任何状态不变宽 */
    border-radius: var(--radius-input);
    outline: 2px solid transparent;          /* 预留 focus 环槽位，激活时零位移 */
    outline-offset: 1px;
    background: var(--color-card);
    color: var(--color-ink);
    font-size: 1rem;
    font-family: inherit;
    transition: background-color var(--dur-short) var(--ease-out),
                border-color var(--dur-short) var(--ease-out);
}
input::placeholder, textarea::placeholder { color: var(--color-ink-2); opacity: 0.75; }
@media (hover: hover) and (pointer: fine) {
    input[type=text]:hover, input[type=password]:hover, input[type=number]:hover,
    select:hover, textarea:hover { background: var(--color-paper-2); }
}
input[type=text]:focus-visible, input[type=password]:focus-visible,
input[type=number]:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 2px solid var(--color-focus);
    outline-offset: 1px;
    border-color: var(--color-ink-2);
}
input:disabled, select:disabled, textarea:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    background: var(--color-paper-2);
}
input[aria-invalid="true"], textarea[aria-invalid="true"], select[aria-invalid="true"] {
    border-color: var(--color-err);
}
textarea { min-height: 9rem; resize: vertical; line-height: 1.7; }
select { appearance: auto; }
input[type=file] {
    font-size: var(--text-sm);
    color: var(--color-ink-2);
    width: 100%;
}
input[type=file]::file-selector-button {
    margin-right: var(--space-2xs);
    padding: var(--space-3xs) var(--space-xs);
    min-height: 2.25rem;
    border: 1px solid var(--color-rule);
    border-radius: var(--radius-input);
    background: var(--color-card);
    color: var(--color-ink);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    cursor: pointer;
    transition: background-color var(--dur-short) var(--ease-out);
}
@media (hover: hover) and (pointer: fine) {
    input[type=file]::file-selector-button:hover { background: var(--color-paper-2); }
}
/* helper 槽位：空也占一行高，错误出现不撑动页面 */
.field { margin-bottom: var(--space-2xs); }
.field .helper, .helper {
    display: block;
    min-height: 1lh;
    font-size: var(--text-sm);
    color: var(--color-ink-2);
    margin-top: var(--space-3xs);
}
.helper.error { color: var(--color-err); }
input.num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; letter-spacing: 0.04em; }

/* ---------- flash 轻提示（silent success，无 toast 庆典） ---------- */
.flash-ok, .flash-error {
    border-radius: var(--radius-input);
    padding: var(--space-2xs) var(--space-xs);
    margin-bottom: var(--space-md);
    font-size: var(--text-sm);
}
.flash-ok    { background: var(--color-ok-soft);  color: var(--color-ok-ink);  border: 1px solid var(--color-ok); }
.flash-error { background: var(--color-err-soft); color: var(--color-err-ink); border: 1px solid var(--color-err); }

/* ---------- 反馈文书（干净的纸面 inset） ---------- */
.feedback {
    white-space: pre-wrap;
    word-break: break-word;
    overflow-wrap: anywhere;
    font-size: var(--text-sm);
    line-height: 1.7;
    background: var(--color-paper);
    border: 1px solid var(--color-rule);
    border-radius: var(--radius-input);
    padding: var(--space-sm) var(--space-md);
    max-width: 65ch;
}
.score-big {                       /* 分数大数字：Display serif 红笔色 */
    font-family: var(--font-display);
    font-variant-numeric: tabular-nums;
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--color-accent);
    line-height: 1;
}
.ai-note {
    background: var(--color-warn-soft);
    border: 1px solid var(--color-warn);
    color: var(--color-warn-ink);
    border-radius: var(--radius-input);
    padding: var(--space-2xs) var(--space-xs);
    margin: var(--space-3xs) 0 var(--space-md);
    font-size: var(--text-sm);
    line-height: 1.6;
}
.essay-img {
    display: block;
    max-width: 100%;
    border: 1px solid var(--color-rule);
    border-radius: var(--radius-input);
    cursor: zoom-in;
}
.progress-note { font-size: var(--text-sm); color: var(--color-ink-2); margin-bottom: 0; }

/* ---------- 表格：行高放宽、表头字重 500 ---------- */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm);
    font-variant-numeric: tabular-nums;
}
th, td {
    text-align: left;
    padding: var(--space-2xs);
    border-bottom: 1px solid var(--color-rule);
    white-space: nowrap;
}
td.wrap, td:first-child { white-space: normal; min-width: 6em; }
th { color: var(--color-ink-2); font-weight: 500; font-size: var(--text-xs); letter-spacing: 0.04em; }
tr:last-child td { border-bottom: none; }

/* ---------- 多稿轨迹 ---------- */
.traj { display: flex; flex-wrap: wrap; align-items: stretch; gap: var(--space-2xs); }
.traj-step {
    flex: 1;
    min-width: 0;
    flex-basis: 8rem;
    border: 1px solid var(--color-rule);
    border-radius: var(--radius-input);
    padding: var(--space-xs) var(--space-sm);
    background: var(--color-paper);
}
.traj-step.passed { border-color: var(--color-ok); background: var(--color-ok-soft); }
.traj-no { font-weight: 700; font-size: var(--text-sm); }
.traj-band { margin-top: var(--space-3xs); font-size: var(--text-sm); }
.traj-score { color: var(--color-ink-2); font-size: var(--text-xs); margin-top: var(--space-3xs); font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.traj-flags { margin-top: var(--space-2xs); }
.traj-arrow { align-self: center; color: var(--color-ink-2); font-size: var(--text-md); }
.passed-banner { border-color: var(--color-ok); background: var(--color-ok-soft); }
.passed-banner h2 { color: var(--color-ok-ink); }

/* 窄屏轨迹纵向排，箭头转成向下 */
@media (max-width: 40rem) {
    .traj { flex-direction: column; align-items: stretch; }
    .traj-step { flex-basis: auto; }
    .traj-arrow { transform: rotate(90deg); align-self: center; line-height: 1; }
}

/* ---------- 教师端：瓶颈 / 档位分布 ---------- */
.bottleneck-chip {
    border: 1px solid var(--color-rule);
    border-radius: var(--radius-input);
    padding: var(--space-xs) var(--space-sm);
    background: var(--color-paper);
    display: flex;
    flex-direction: column;
    gap: var(--space-3xs);
    min-width: 8rem;
}
.bottleneck-rank { font-size: var(--text-xs); color: var(--color-accent-deep); font-weight: 700; letter-spacing: 0.08em; }
.band-dist { display: flex; flex-direction: column; gap: var(--space-2xs); }
.band-row { display: flex; align-items: center; gap: var(--space-2xs); }
.band-label { min-width: 3.5rem; font-size: var(--text-sm); color: var(--color-ink-2); }
.band-bar {
    display: inline-block;
    background: var(--color-neutral-soft);
    color: var(--color-ink);
    border: 1px solid var(--color-rule);
    border-radius: var(--radius-input);
    padding: 0 var(--space-2xs);
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    font-size: var(--text-sm);
    font-weight: 600;
    min-width: 1.75rem;
    text-align: center;
}

/* ---------- 折叠 / spinner ---------- */
details summary {
    cursor: pointer;
    font-size: var(--text-sm);
}
@media (hover: hover) and (pointer: fine) {
    details summary:hover { color: var(--color-accent); }
}
summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.spinner {
    display: inline-block;
    width: 1rem; height: 1rem;
    border: 2px solid var(--color-rule);
    border-top-color: var(--color-accent);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    vertical-align: -0.15em;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- 入口页 Two Doors：排版撑场面，无纹理 ---------- */
.entry-head { text-align: center; margin: var(--space-xl) 0 var(--space-lg); }
.entry-head h1 {
    font-size: var(--text-display);
    line-height: 1.1;
    margin: 0 0 var(--space-xs);
}
.entry-head .lede {
    color: var(--color-ink-2);
    font-size: var(--text-md);
    margin: 0;
}
.doors {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-md);
}
@media (min-width: 40rem) {
    .doors { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-lg); }
}
.door {
    background: var(--color-card);
    border: 1px solid var(--color-rule);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    padding: var(--space-lg) var(--space-md) var(--space-md);
    display: flex;
    flex-direction: column;
    gap: var(--space-2xs);
}
.door h2 {
    font-family: var(--font-display);   /* 门上标题保留 serif，撑入口场面 */
    font-weight: 700;
    font-size: var(--text-lg);
    margin: 0;
}
.door p { margin: 0; flex: 1; }
.door .btn { margin-top: var(--space-md); align-self: stretch; }

/* ---------- 通用工具类 ---------- */
.mt-2xs { margin-top: var(--space-2xs); }
.mt-xs  { margin-top: var(--space-xs); }
.mt-sm  { margin-top: var(--space-sm); }
.w-narrow { max-width: 10rem; }
.nowrap { white-space: nowrap; }
.backlink { display: inline-block; margin-top: var(--space-sm); font-size: var(--text-sm); }

/* ---------- 焦点环（全局兜底，即刻显示） ---------- */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, summary:focus-visible {
    outline: 2px solid var(--color-focus);
    outline-offset: 2px;
}

/* ---------- Reduced motion：空间动效塌缩为 ≤150ms 透明度 ---------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: 150ms !important;
        transition-property: opacity, background-color, border-color !important;
    }
    .spinner, .btn.loading::after, .btn[aria-busy="true"]::after,
    .traj-arrow { animation: none !important; transform: none !important; }
}

/* ---------- 专项练习 + 上一稿建议卡（v1.3） ---------- */
.advice-card { border-color: var(--color-accent); }
.advice-list { margin: 0; padding-left: var(--space-lg); }
.advice-list li { margin-bottom: var(--space-2xs); }
.exercise-card { border-color: var(--color-accent); }
.exercise-card details summary { cursor: pointer; }

/* ========================================================================== */
/* v2 · Split Studio 应用层。旧规则保留作回退；以下规则是当前视觉契约。       */
/* ========================================================================== */

body {
    min-height: 100dvh;
    font-size: var(--text-base);
    line-height: 1.65;
    background: var(--color-paper);
    color: var(--color-ink);
}

body,
button,
input,
select,
textarea {
    font-family: var(--font-body);
}

p { margin: 0; }
a { color: var(--color-ink); }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: var(--rule-hair) solid var(--color-focus);
    outline-width: 2px;
    outline-offset: var(--space-2xs);
}

.skip-link {
    position: fixed;
    inset-block-start: var(--space-md);
    inset-inline-start: var(--space-md);
    z-index: var(--z-tooltip);
    padding: var(--space-sm) var(--space-md);
    background: var(--color-accent);
    color: var(--color-accent-ink);
    text-decoration: none;
    transform: translateY(-160%);
}
.skip-link:focus { transform: none; }

/* --- 入口：真正的 Split Studio --- */
.entry-page { background: var(--color-card); }
.entry-page .guestbar { display: none; }
.entry-page .container {
    max-width: none;
    min-height: 100svh;
    margin: 0;
    padding: 0;
}
.entry-studio {
    min-height: 100svh;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    background: var(--color-card);
    color: var(--color-ink);
}
.entry-visual {
    position: relative;
    min-width: 0;
    height: 38svh;
    margin: 0;
    overflow: clip;
    background: var(--color-rail);
    color: var(--color-rail-ink);
}
.entry-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--color-paper);
    opacity: 0.06;
    mix-blend-mode: multiply;
    pointer-events: none;
}
.entry-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 56% 60%;
    filter: saturate(0.72) contrast(1.05) sepia(0.08);
}
.entry-visual figcaption {
    position: absolute;
    inset-inline-start: var(--space-lg);
    inset-block-end: var(--space-lg);
    z-index: var(--z-raised);
    max-width: 45ch;
    color: var(--color-rail-ink);
    font-family: var(--font-display);
    font-size: var(--text-md);
    line-height: 1.25;
}
.entry-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: var(--space-lg);
}
.entry-brand,
.rail-brand {
    display: inline-flex;
    align-items: center;
    gap: var(--space-sm);
    width: fit-content;
    color: inherit;
    font-family: var(--font-display);
    font-size: var(--text-md);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    text-decoration: none;
    white-space: nowrap;
}
.entry-brand > span,
.rail-brand > span {
    display: inline-block;
    width: var(--space-sm);
    height: var(--space-sm);
    flex: 0 0 auto;
    background: var(--color-accent);
}
.entry-heading {
    display: grid;
    gap: var(--space-lg);
    padding-block: var(--space-2xl) var(--space-xl);
}
.entry-heading h1 {
    max-width: 7em;              /* 按中文字宽给：最长一段 6 字也能放下 */
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(var(--text-2xl), 13vw, var(--text-display));
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: -0.05em;
    word-break: keep-all;        /* 中文不随意断词，真要溢出才兜底 */
    overflow-wrap: anywhere;
}
.entry-heading p {
    max-width: 45ch;
    color: var(--color-ink-2);
    font-size: var(--text-md);
    line-height: 1.6;
}
.entry-routes {
    margin-block-start: auto;
    border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}
.entry-routes a {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: var(--space-md);
    align-items: center;
    min-height: 5.75rem;
    border-block-end: var(--rule-hair) solid var(--color-rule-strong);
    color: var(--color-ink);
    text-decoration: none;
}
.entry-routes .route-no {
    color: var(--color-ink-3);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
}
.entry-routes a > span:nth-child(2) {
    display: grid;
    gap: var(--space-2xs);
    min-width: 0;
}
.entry-routes strong {
    font-size: var(--text-md);
    line-height: 1.2;
}
.entry-routes small {
    color: var(--color-ink-2);
    font-size: var(--text-sm);
    line-height: 1.35;
}
.entry-routes b {
    font-family: var(--font-display);
    font-size: var(--text-lg);
    font-weight: 400;
    transition: transform var(--dur-short) var(--ease-out);
}
@media (hover: hover) and (pointer: fine) {
    .entry-routes a:hover b { transform: translateX(var(--space-xs)); }
}
.entry-foot {
    padding-block-start: var(--space-lg);
    color: var(--color-ink-3);
    font-size: var(--text-sm);
}

/* --- 访客页 --- */
.guestbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    min-height: 4.5rem;
    padding-inline: var(--space-md);
    border-block-end: var(--rule-hair) solid var(--color-rule);
    background: var(--color-paper);
    color: var(--color-ink);
}
.guestbar > a:last-child {
    color: var(--color-ink-2);
    text-decoration: none;
    white-space: nowrap;
}
.guest-page .container {
    max-width: var(--content-width);
    margin-inline: auto;
    padding: var(--space-xl) var(--space-md) var(--space-3xl);
}
.auth-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-xl);
}
.auth-intro { align-self: start; }
.auth-intro .section-note {
    margin-block-end: var(--space-lg);
    color: var(--color-accent);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
}
.auth-intro h1 { max-width: 12ch; }
.auth-form {
    padding-block-start: var(--space-lg);
    border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}
.privacy-note {
    margin-block-start: var(--space-md);
    color: var(--color-ink-3);
    font-size: var(--text-sm);
}

/* --- App rail 与移动导航 --- */
.app-rail { display: none; }
.mobile-topbar {
    position: sticky;
    inset-block-start: 0;
    z-index: var(--z-sticky-nav);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    min-height: 4.25rem;
    padding-inline: var(--space-md);
    border-block-end: var(--rule-hair) solid var(--color-rule);
    background: var(--color-paper);
    color: var(--color-ink);
}
.mobile-menu { position: relative; }
.mobile-menu summary {
    display: grid;
    place-items: center;
    min-width: 3.25rem;
    min-height: 2.75rem;
    padding-inline: var(--space-sm);
    border: var(--rule-hair) solid var(--color-rule-strong);
    border-radius: var(--radius-input);
    list-style: none;
    color: var(--color-ink);
    font-size: var(--text-sm);
    white-space: nowrap;
}
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu nav {
    position: absolute;
    inset-block-start: calc(100% + var(--space-xs));
    inset-inline-end: 0;
    z-index: var(--z-dropdown);
    display: grid;
    min-width: 12rem;
    padding: var(--space-xs);
    border: var(--rule-hair) solid var(--color-rule);
    background: var(--color-card);
    color: var(--color-ink);
    box-shadow: var(--shadow-card);
}
.mobile-menu nav strong,
.mobile-menu nav a {
    padding: var(--space-sm) var(--space-md);
    color: var(--color-ink);
    text-decoration: none;
    white-space: nowrap;
}
.mobile-menu nav strong { color: var(--color-ink-3); font-size: var(--text-sm); }
.app-page .container {
    max-width: var(--content-width);
    margin: 0;
    padding: var(--space-xl) var(--space-md) var(--space-3xl);
}

/* --- 页面排版 --- */
.page-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-lg);
    align-items: end;
    margin-block-end: var(--space-2xl);
}
.page-head > div { min-width: 0; }
.page-head h1 {
    max-width: 19ch;
    margin: var(--space-xs) 0 0;
    font-family: var(--font-display);
    font-size: clamp(var(--text-2xl), 7vw, var(--text-3xl));
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -0.04em;
    overflow-wrap: anywhere;
}
.page-head p {
    max-width: 48ch;
    margin-block-start: var(--space-sm);
    color: var(--color-ink-2);
    font-size: var(--text-base);
}
.page-head .page-context {
    margin: 0;
    color: var(--color-ink-3);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
}
.page-head > .btn { justify-self: start; }
.assignment-title .backlink,
.review-head .backlink {
    margin: 0 0 var(--space-md);
    color: var(--color-ink-3);
    font-size: var(--text-sm);
    text-decoration: none;
    white-space: nowrap;
}
.assignment-title .backlink::before,
.review-head .backlink::before {
    content: "←";
    margin-inline-end: var(--space-xs);
}
.section-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-xs);
    margin-block-end: var(--space-lg);
}
.section-head h2 {
    margin: 0;
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
}
.section-head p {
    color: var(--color-ink-2);
    font-size: var(--text-sm);
}
.meta-line {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs);
    align-items: center;
}
.tag {
    padding: var(--space-2xs) var(--space-sm);
    border-color: var(--color-rule);
    background: var(--color-neutral-soft);
    color: var(--color-ink-2);
    font-size: var(--text-xs);
    line-height: 1.5;
}
.tag.pending { color: var(--color-warn-ink); }
.tag.published { color: var(--color-ok-ink); }
.tag.failed { color: var(--color-err-ink); }

/* --- 按钮与表单：字号放大，状态完整 --- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-xs);
    min-height: 3rem;
    padding: var(--space-sm) var(--space-lg);
    border-width: var(--rule-hair);
    border-radius: var(--radius-input);
    font-size: var(--text-base);
    font-weight: 700;
    white-space: nowrap;
}
.btn-wide { width: 100%; }
.btn.small { min-height: 2.75rem; padding: var(--space-xs) var(--space-md); font-size: var(--text-sm); }
.btn.loading,
.btn[aria-busy="true"] { opacity: 0.72; }
.btn.error,
.btn.is-error { background: var(--color-err); color: var(--color-accent-ink); border-color: var(--color-err); }
.btn.success,
.btn.is-success { background: var(--color-ok); color: var(--color-accent-ink); border-color: var(--color-ok); }

label,
.field-label {
    display: block;
    margin: 0 0 var(--space-xs);
    color: var(--color-ink);
    font-size: var(--text-sm);
    font-weight: 700;
}
.field { margin-block-end: var(--space-lg); }
input[type=text],
input[type=password],
input[type=number],
select,
textarea {
    min-height: 3rem;
    padding: var(--space-sm) var(--space-md);
    border: var(--rule-hair) solid var(--color-rule-strong);
    border-radius: var(--radius-input);
    background: var(--color-card);
    color: var(--color-ink);
    font-size: var(--text-base);
    line-height: 1.55;
}
input::placeholder,
textarea::placeholder { color: var(--color-ink-3); opacity: 1; }
textarea { min-height: 12rem; }
.helper { color: var(--color-ink-3); font-size: var(--text-sm); }
.file-native {
    position: absolute;
    inline-size: var(--rule-hair);
    block-size: var(--rule-hair);
    opacity: 0;
    pointer-events: none;
}
.file-drop {
    display: grid;
    gap: var(--space-xs);
    min-height: 8rem;
    margin: 0;
    padding: var(--space-lg);
    border: var(--rule-hair) dashed var(--color-rule-strong);
    border-radius: var(--radius-input);
    background: var(--color-paper);
    color: var(--color-ink);
    cursor: pointer;
    place-content: center;
    text-align: center;
}
.file-drop strong { font-size: var(--text-base); }
.file-drop span { color: var(--color-ink-3); font-size: var(--text-sm); font-weight: 400; }
.file-drop.compact { min-height: 6rem; margin-block-end: var(--space-sm); }
.file-drop:active { border-color: var(--color-accent); background: var(--color-paper-2); }
.file-drop:has(+ .file-native:focus-visible) {
    outline: 2px solid var(--color-focus);
    outline-offset: var(--space-2xs);
}
.file-native:focus-visible + .helper { color: var(--color-focus); }
fieldset {
    min-width: 0;
    margin: 0;
    padding: var(--space-xl) 0;
    border: 0;
    border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}
legend {
    padding: 0;
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 700;
}
.field-pair { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-lg); }
.form-sheet { max-width: 52rem; }
.form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-lg);
    align-items: center;
    justify-content: space-between;
    padding-block-start: var(--space-lg);
    border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}
.form-actions > span { color: var(--color-ink-2); font-size: var(--text-sm); }

/* --- 任务账本与数据表 --- */
.task-ledger { border-block-start: var(--rule-hair) solid var(--color-rule-strong); }
.task-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: var(--space-md);
    align-items: center;
    min-height: 7rem;
    padding-block: var(--space-lg);
    border-block-end: var(--rule-hair) solid var(--color-rule-strong);
    color: var(--color-ink);
    text-decoration: none;
}
.task-kind {
    align-self: start;
    color: var(--color-ink-3);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
}
.task-main { display: grid; gap: var(--space-xs); min-width: 0; }
.task-main strong { font-size: var(--text-md); line-height: 1.35; }
.task-main small { color: var(--color-ink-2); font-size: var(--text-sm); line-height: 1.55; }
.task-state { color: var(--color-ink-2); font-size: var(--text-sm); white-space: nowrap; }
.task-arrow { display: none; }
.ledger-group,
.dashboard-section,
.progress-section,
.submission-section,
.feedback-section,
.exercise-card,
.practice-callout,
.essay-source,
.teacher-decision,
.ai-review {
    padding-block: var(--space-xl);
    border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}
.ledger-group + .ledger-group,
.dashboard-section + .dashboard-section { margin-block-start: var(--space-lg); }

table,
tbody { display: block; width: 100%; }
tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-sm) var(--space-md);
    padding-block: var(--space-lg);
    border-block-end: var(--rule-hair) solid var(--color-rule);
}
tr:has(th) { display: none; }
td,
th {
    display: block;
    min-width: 0;
    padding: 0;
    border: 0;
    white-space: normal;
    font-size: var(--text-sm);
}
td::before {
    content: attr(data-label);
    display: block;
    margin-block-end: var(--space-2xs);
    color: var(--color-ink-3);
    font-size: var(--text-xs);
    font-weight: 400;
}
td:first-child {
    grid-column: 1 / -1;
    font-size: var(--text-base);
    font-weight: 700;
}
td:last-child { align-self: end; justify-self: end; }
.row-action {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    color: var(--color-accent-deep);
    font-weight: 700;
    text-decoration-color: var(--color-accent);
    white-space: nowrap;
}
.inline-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-md);
    align-items: end;
    margin-block-start: var(--space-xl);
    padding-block-start: var(--space-lg);
    border-block-start: var(--rule-hair) solid var(--color-rule);
}
.inline-form .field { margin: 0; }

/* --- 摘要与班级洞察 --- */
.summary-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-block: var(--rule-hair) solid var(--color-rule-strong);
    margin-block-end: var(--space-2xl);
}
.summary-strip > div {
    display: flex;
    flex-direction: column-reverse;
    gap: var(--space-xs);
    min-width: 0;
    padding: var(--space-lg) var(--space-md);
    border-inline-end: var(--rule-hair) solid var(--color-rule);
}
.summary-strip > div:nth-child(2n) { border-inline-end: 0; }
.summary-strip dt { color: var(--color-ink-3); font-size: var(--text-sm); }
.summary-strip dd {
    margin: 0;
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    font-weight: 700;
    line-height: 1;
}
.summary-strip .summary-urgent dd { color: var(--color-accent); }
.summary-strip.compact { margin-block: var(--space-xl) 0; }
.overview-lead { margin-block-end: var(--space-lg); }
.insight-list { margin: 0; padding: 0; list-style: none; border-block-start: var(--rule-hair) solid var(--color-rule); }
.insight-list li {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: var(--space-md);
    align-items: center;
    padding-block: var(--space-lg);
    border-block-end: var(--rule-hair) solid var(--color-rule);
}
.insight-list li > span:first-child { color: var(--color-accent); font-size: var(--text-xs); }
.insight-list li > span:last-child { color: var(--color-ink-2); font-size: var(--text-sm); }
.band-row { display: grid; grid-template-columns: 5rem minmax(0, 1fr) auto; gap: var(--space-md); }
.band-label { min-width: 0; }
progress {
    width: 100%;
    height: var(--space-sm);
    border: 0;
    border-radius: var(--radius-pill);
    background: var(--color-neutral-soft);
    color: var(--color-accent);
    overflow: clip;
}
progress::-webkit-progress-bar { background: var(--color-neutral-soft); }
progress::-webkit-progress-value { background: var(--color-accent); }
progress::-moz-progress-bar { background: var(--color-accent); }

/* --- 作文任务与修改轨迹 --- */
.assignment-brief {
    margin-block-end: var(--space-xl);
    padding: var(--space-xl);
    background: var(--color-card);
    color: var(--color-ink);
    box-shadow: var(--shadow-card);
}
.assignment-brief h2 {
    margin: var(--space-xl) 0 var(--space-sm);
    font-family: var(--font-display);
    font-size: var(--text-xl);
}
.prompt-copy {
    max-width: 70ch;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-size: var(--text-base);
    line-height: 1.75;
}
.brief-foot {
    margin-block-start: var(--space-lg);
    padding-block-start: var(--space-md);
    border-block-start: var(--rule-hair) solid var(--color-rule);
    color: var(--color-ink-2);
    font-size: var(--text-sm);
}
.compact-brief { padding: var(--space-lg); }
.traj {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: draft;
}
.traj-step {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-xs) var(--space-md);
    min-width: 0;
    padding: var(--space-lg) 0 var(--space-lg) var(--space-xl);
    border: 0;
    border-block-start: var(--rule-hair) solid var(--color-rule);
    border-radius: 0;
    background: transparent;
    color: var(--color-ink);
}
.traj-step::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: var(--space-lg);
    width: var(--space-sm);
    height: var(--space-sm);
    border: var(--rule-hair) solid var(--color-rule-strong);
    border-radius: var(--radius-pill);
    background: var(--color-paper);
}
.traj-step.passed { border-color: var(--color-ok); background: transparent; color: var(--color-ink); }
.traj-step.passed::before { background: var(--color-ok); border-color: var(--color-ok); }
.traj-no { font-size: var(--text-base); }
.traj-band { grid-column: 1; color: var(--color-ink-2); }
.traj-score { grid-column: 2; grid-row: 1; color: var(--color-ink); font-size: var(--text-base); }
.traj-flags { grid-column: 1 / -1; }
.traj-arrow { display: none; }

.advice-card {
    margin-block: var(--space-xl);
    padding: var(--space-xl);
    border: var(--rule-hair) solid var(--color-rule-strong);
    background: var(--color-card);
    color: var(--color-ink);
}
.advice-list { margin: 0; padding-inline-start: var(--space-lg); }
.advice-list li { margin-block-end: var(--space-md); padding-inline-start: var(--space-xs); }
.rewrite-task {
    display: grid;
    gap: var(--space-xs);
    margin-block-start: var(--space-lg);
    padding-block-start: var(--space-lg);
    border-block-start: var(--rule-hair) solid var(--color-rule);
}
.rewrite-task strong { color: var(--color-accent-deep); font-size: var(--text-sm); }
.note-line { margin-block-start: var(--space-lg); color: var(--color-ink-3); font-size: var(--text-sm); }
.submission-form { max-width: 52rem; }

.status-banner {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-lg);
    align-items: center;
    justify-content: space-between;
    margin-block: var(--space-xl);
    padding: var(--space-lg);
    border: var(--rule-hair) solid var(--color-rule-strong);
    background: var(--color-card);
    color: var(--color-ink);
}
.status-banner h2 { margin: 0 0 var(--space-xs); font-family: var(--font-display); font-size: var(--text-lg); }
.status-banner p { color: var(--color-ink-2); }
.status-banner.passed-banner { border-color: var(--color-ok); background: var(--color-ok-soft); color: var(--color-ok-ink); }
.status-banner.passed-banner p { color: var(--color-ok-ink); }
.status-banner.error-banner { border-color: var(--color-err); background: var(--color-err-soft); color: var(--color-err-ink); }
.status-banner.error-banner p { color: var(--color-err-ink); }
.status-mark {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border: var(--rule-hair) solid currentColor;
    border-radius: var(--radius-pill);
    font-family: var(--font-display);
    font-size: var(--text-md);
}

/* --- 学生批改结果 --- */
.transcript-block { margin-block-end: var(--space-xl); }
.result-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-lg);
    align-items: end;
    padding-block: var(--space-xl);
    border-block: var(--rule-hair) solid var(--color-rule-strong);
}
.result-score { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: baseline; }
.score-big { font-size: clamp(var(--text-3xl), 13vw, var(--text-display)); color: var(--color-accent); }
.result-status { justify-self: start; }
.result-status p { margin-block-start: var(--space-xs); color: var(--color-ink-2); font-size: var(--text-sm); }
.teacher-comment {
    display: grid;
    gap: var(--space-xs);
    grid-column: 1 / -1;
    padding-block-start: var(--space-lg);
    border-block-start: var(--rule-hair) solid var(--color-rule);
}
.teacher-comment strong { color: var(--color-accent-deep); font-size: var(--text-sm); }
.result-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); }
.feedback {
    max-width: none;
    padding: var(--space-lg);
    border-color: var(--color-rule);
    background: var(--color-paper);
    color: var(--color-ink);
    font-size: var(--text-base);
    line-height: 1.78;
}
.feedback-main { min-height: 10rem; }
.practice-callout p { color: var(--color-ink-2); }
.essay-source .feedback { background: var(--color-card); }
.sticky-action {
    position: sticky;
    inset-block-end: var(--space-md);
    z-index: var(--z-sticky);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    margin-block-start: var(--space-xl);
    padding: var(--space-sm) var(--space-sm) var(--space-sm) var(--space-md);
    border: var(--rule-hair) solid var(--color-rule-strong);
    background: var(--color-card);
    color: var(--color-ink);
    box-shadow: var(--shadow-card);
}
.sticky-action > span { color: var(--color-ink-2); font-size: var(--text-sm); }

/* --- 教师审阅：双栏 --- */
.review-head > .tag { justify-self: start; align-self: center; }
.review-meta {
    display: grid;
    gap: var(--space-md);
    margin-block-end: var(--space-xl);
    padding-block: var(--space-lg);
    border-block: var(--rule-hair) solid var(--color-rule-strong);
}
.review-meta p { color: var(--color-ink-2); font-size: var(--text-sm); }
.review-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2xl); }
.review-source,
.review-work { min-width: 0; }
.review-source > section { padding-block: var(--space-xl); border-block-start: var(--rule-hair) solid var(--color-rule-strong); }
.review-prompt .prompt-copy { font-size: var(--text-sm); }
.ai-note { margin-block: 0 var(--space-lg); padding: var(--space-md); font-size: var(--text-sm); }
.decision-primary {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-lg);
    align-items: center;
    justify-content: space-between;
    padding-block: var(--space-lg);
    border-block: var(--rule-hair) solid var(--color-rule);
}
.override-fields { margin-block-start: var(--space-lg); }

.empty-state {
    max-width: 40rem;
    padding: var(--space-xl) 0;
    border-block: var(--rule-hair) solid var(--color-rule-strong);
}
.empty-state strong { font-family: var(--font-display); font-size: var(--text-lg); }
.empty-state p { margin-block-start: var(--space-xs); color: var(--color-ink-2); }

details summary {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    min-height: 2.75rem;
    align-items: center;
    color: var(--color-ink);
    font-size: var(--text-base);
}
details summary span { color: var(--color-ink-3); font-size: var(--text-sm); }

@media (min-width: 40rem) {
    .guestbar { padding-inline: var(--space-xl); }
    .entry-copy { padding: var(--space-xl); }
    .guest-page .container,
    .app-page .container { padding-inline: var(--space-xl); }
    .auth-layout { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr); gap: var(--space-2xl); }
    .auth-form { padding-block-start: var(--space-2xl); }
    .page-head { grid-template-columns: minmax(0, 1fr) auto; }
    .page-head > .btn { justify-self: end; }
    .section-head { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
    .section-head p { justify-self: end; }
    .field-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .summary-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .summary-strip.compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .summary-strip > div:nth-child(2n) { border-inline-end: var(--rule-hair) solid var(--color-rule); }
    .summary-strip > div:last-child { border-inline-end: 0; }
    .task-row { grid-template-columns: 4rem minmax(0, 1fr) auto auto; gap: var(--space-lg); }
    .task-arrow { display: block; font-family: var(--font-display); font-size: var(--text-lg); }
    .result-summary { grid-template-columns: minmax(0, 1fr) auto; }
    .result-status { justify-self: end; text-align: end; }
    .inline-form { grid-template-columns: minmax(0, 0.7fr) minmax(0, 1fr) auto; }

    table { display: table; }
    tbody { display: table-row-group; }
    tr { display: table-row; padding: 0; border: 0; }
    tr:has(th) { display: table-row; }
    td,
    th {
        display: table-cell;
        padding: var(--space-md) var(--space-sm);
        border-block-end: var(--rule-hair) solid var(--color-rule);
        font-size: var(--text-sm);
        vertical-align: middle;
    }
    th { color: var(--color-ink-3); font-weight: 400; }
    td::before { display: none; }
    td:first-child { grid-column: auto; font-size: var(--text-sm); font-weight: 400; }
    td:last-child { justify-self: auto; }
    .row-action { min-height: 2.5rem; }
    .traj { grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); }
    .traj-step { padding-inline: var(--space-lg); border-inline-start: var(--rule-hair) solid var(--color-rule); }
    .traj-step::before { display: none; }
}

@media (min-width: 60rem) {
    .entry-studio { grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.06fr); }
    .entry-visual { height: 100svh; }
    .entry-visual figcaption { inset-inline-start: var(--space-2xl); inset-block-end: var(--space-2xl); font-size: var(--text-lg); }
    .entry-copy { min-height: 100svh; padding: var(--space-2xl) var(--space-3xl); }
    .entry-heading { padding-block: var(--space-3xl) var(--space-2xl); }
    .entry-heading h1 { font-size: var(--text-display); }

    .mobile-topbar { display: none; }
    .app-rail {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: var(--z-sticky-nav);
        display: flex;
        flex-direction: column;
        width: var(--rail-width);
        min-height: 100dvh;
        padding: var(--space-xl);
        background: var(--color-rail);
        color: var(--color-rail-ink);
    }
    .app-rail .rail-brand { color: var(--color-rail-ink); }
    .rail-message { display: grid; gap: var(--space-xs); margin-block: var(--space-3xl) var(--space-xl); }
    .rail-message p { max-width: 45ch; font-family: var(--font-display); font-size: var(--text-lg); line-height: 1.3; }
    .rail-message strong { margin-block-start: var(--space-lg); color: var(--color-rail-ink); }
    .rail-message span { color: var(--color-rail-muted); font-size: var(--text-sm); }
    .rail-nav { display: grid; }
    .rail-nav a {
        display: grid;
        grid-template-columns: 2.25rem minmax(0, 1fr);
        gap: var(--space-sm);
        align-items: center;
        min-height: 3.5rem;
        border-block-end: var(--rule-hair) solid color-mix(in oklch, var(--color-rail-ink) 18%, transparent);
        color: var(--color-rail-muted);
        text-decoration: none;
        white-space: nowrap;
    }
    .rail-nav a span { font-family: var(--font-mono); font-size: var(--text-xs); }
    .rail-nav a.active { color: var(--color-rail-ink); }
    .rail-nav a.active span { color: var(--color-accent); }
    .rail-foot { display: grid; gap: var(--space-xs); margin-block-start: auto; color: var(--color-rail-muted); font-size: var(--text-sm); }
    .rail-foot a { color: var(--color-rail-ink); text-decoration-color: var(--color-rail-muted); white-space: nowrap; }

    .app-page .container {
        max-width: none;
        min-height: 100dvh;
        margin-inline-start: var(--rail-width);
        padding: var(--space-2xl) var(--space-2xl) var(--space-4xl);
    }
    .app-page .container > * { max-width: var(--content-width); margin-inline: auto; }
    .review-layout { grid-template-columns: minmax(18rem, 0.8fr) minmax(0, 1.2fr); align-items: start; }
    .review-source { position: sticky; inset-block-start: var(--space-2xl); }
    .result-layout { grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.65fr); align-items: start; }
    .essay-source { position: sticky; inset-block-start: var(--space-xl); }
}

@media (min-width: 90rem) {
    .app-page .container { padding-inline: var(--space-3xl); }
    .review-layout { gap: var(--space-3xl); }
}

@media (prefers-reduced-motion: reduce) {
    .entry-routes b,
    .skip-link { transition-duration: 0ms; }
    .entry-routes b,
    .btn:active { transform: none !important; }
}


/* --- 教研功能包（追加，不改既有规则） --- */
.coach-tools {
    padding-block: var(--space-xl);
    border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}
.coach-tool {
    padding-block: var(--space-lg);
    border-block-start: var(--rule-hair) solid var(--color-rule);
}
.coach-tool-head {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
    align-items: center;
    justify-content: space-between;
}
.coach-tool-head strong { font-size: var(--text-base); }
.coach-tool-head form { margin: 0; }
.model-essay-form { margin-block-start: var(--space-lg); }
.model-essay-gen { margin-block-start: var(--space-md); }

/* 学生端：订正/润色/范文对比 */
.version-block {
    padding-block: var(--space-xl);
    border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}
.version-block + .version-block { margin-block-start: var(--space-lg); }

/* 学生端：素材本 */
.material-group {
    padding-block: var(--space-xl);
    border-block-start: var(--rule-hair) solid var(--color-rule-strong);
}
.material-group + .material-group { margin-block-start: var(--space-lg); }
.material-item {
    padding-block: var(--space-md);
    border-block-start: var(--rule-hair) solid var(--color-rule);
}
.material-item:first-of-type { border-block-start: 0; }


/* --- 账号权限体系与班级管理（追加，不改既有规则） --- */
.row-form { margin: 0; display: inline-flex; gap: var(--space-xs); align-items: center; flex-wrap: wrap; }
.row-form input[type=text] { min-height: 2.75rem; width: 9rem; font-size: var(--text-sm); }
.btn.danger { border-color: var(--color-err); color: var(--color-err); background: transparent; }
.btn.danger:hover { background: var(--color-err-soft, var(--color-paper-2)); }
.account-actions { display: flex; gap: var(--space-sm); align-items: center; flex-wrap: wrap; }
.account-new-form { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 40rem) {
    .account-new-form { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; }
}