:root {
      --paper: #f6f4ef;
      --panel: #fffdfa;
      --ink: #17213b;
      --muted: #778092;
      --line: #e5e1d8;
      --blue: #4169e1;
      --blue-soft: #eaf0ff;
      --green: #68b884;
      --green-soft: #edf8f1;
      --red: #d84a43;
      --amber: #d99b2b;
      --amber-soft: #fff5d8;
      --shadow: 0 14px 38px rgba(36, 31, 24, .1);
      --radius: 8px;
      --layout-gap: 18px;
      --nav-width: 172px;
      --left-pane: 62%;
      --layout-columns: minmax(420px, var(--left-pane)) minmax(320px, 1fr);
      font-family: "Inter", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
    }

    * {
      box-sizing: border-box;
    }

    [hidden] {
      display: none !important;
    }

    body {
      margin: 0;
      color: var(--ink);
      background: var(--paper);
      min-height: 100vh;
    }

    button,
    textarea,
    input {
      font: inherit;
    }

    .app {
      width: 100%;
      min-width: 0;
      min-height: 100vh;
      padding: 20px 24px 28px;
      display: flex;
      flex-direction: column;
    }

    .site-footer {
      margin-top: auto;
      padding: 28px 16px 0;
      text-align: center;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.6;
    }

    .site-footer a {
      color: inherit;
      text-decoration: none;
    }

    .site-footer a:hover {
      color: var(--blue);
      text-decoration: underline;
    }

    .shell {
      max-width: 1680px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: var(--nav-width) minmax(0, 1fr);
      gap: 0;
      align-items: start;
      position: relative;
    }

    .nav-resizer {
      position: absolute;
      top: 0;
      bottom: 0;
      left: var(--nav-width);
      width: 14px;
      transform: translateX(-50%);
      border: 0;
      padding: 0;
      background: transparent;
      cursor: col-resize;
      z-index: 4;
      touch-action: none;
      user-select: none;
    }

    .nav-resizer::before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 6px;
      width: 2px;
      border-radius: 999px;
      background: rgba(119, 128, 146, .35);
      transition: background .16s ease, width .16s ease, left .16s ease;
    }

    .nav-resizer:hover::before,
    body.resizing-nav .nav-resizer::before {
      left: 5px;
      width: 4px;
      background: rgba(65, 105, 225, .72);
    }

    .side-nav {
      position: sticky;
      top: 0;
      z-index: 6;
      min-height: 100vh;
      padding: 20px 14px;
      border-right: 1px solid var(--line);
      background: rgba(255, 253, 250, .72);
      backdrop-filter: blur(12px);
      display: grid;
      align-content: start;
      gap: 14px;
    }

    .nav-head {
      display: grid;
      gap: 8px;
      padding-bottom: 12px;
      border-bottom: 1px solid var(--line);
    }

    .brand-mark {
      font-family: Georgia, "Times New Roman", "Songti SC", serif;
      font-size: 24px;
      font-weight: 700;
      padding: 8px 8px 0;
    }

    .brand-compact {
      display: none;
    }

    .nav-toggle {
      position: absolute;
      top: 50vh;
      right: -17px;
      width: 34px;
      height: 34px;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: #fff;
      color: #40516d;
      cursor: pointer;
      padding: 0;
      z-index: 10;
      display: grid;
      place-items: center;
      box-shadow: 0 10px 24px rgba(36, 31, 24, .14);
      transform: translateY(-50%);
      transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease;
    }

    .nav-toggle:hover {
      border-color: rgba(65, 105, 225, .45);
      background: var(--blue-soft);
      color: var(--blue);
      box-shadow: 0 14px 28px rgba(65, 105, 225, .18);
      transform: translateY(-50%) scale(1.04);
    }

    .nav-toggle:focus-visible {
      outline: 3px solid rgba(65, 105, 225, .22);
      outline-offset: 3px;
    }

    .nav-toggle::before {
      content: "";
      width: 9px;
      height: 9px;
      border-left: 2px solid currentColor;
      border-bottom: 2px solid currentColor;
      transform: translateX(2px) rotate(45deg);
    }

    .shell.nav-collapsed .nav-toggle::before {
      transform: translateX(-2px) rotate(225deg);
    }

    .nav-list {
      display: grid;
      gap: 6px;
    }

    .nav-item {
      border: 0;
      border-radius: 7px;
      background: transparent;
      color: #4b5568;
      cursor: pointer;
      min-height: 42px;
      padding: 0 12px;
      text-align: left;
      font-weight: 900;
    }

    .nav-item.active {
      background: var(--blue);
      color: #fff;
      box-shadow: 0 8px 22px rgba(65, 105, 225, .22);
    }

    .shell.nav-collapsed {
      grid-template-columns: 40px minmax(0, 1fr);
    }

    .shell.nav-collapsed .side-nav {
      padding: 20px 2px 16px;
      gap: 10px;
    }

    .shell.nav-collapsed .nav-resizer {
      display: none;
    }

    .shell.nav-collapsed .nav-head {
      padding-bottom: 10px;
    }

    .shell.nav-collapsed .brand-mark {
      width: 100%;
      overflow: hidden;
      white-space: nowrap;
      padding: 8px 0 0 5px;
      text-align: left;
      font-size: 24px;
    }

    .shell.nav-collapsed .brand-full {
      display: inline;
    }

    .shell.nav-collapsed .brand-compact {
      display: none;
    }

    .shell.nav-collapsed .nav-toggle {
      right: -17px;
    }

    .shell.nav-collapsed .nav-list {
      display: none;
    }

    .page {
      display: none;
    }

    .page.active {
      display: block;
    }

    #page-solve {
      position: relative;
    }

    .page-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

    .page-panel {
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: 22px;
      display: grid;
      gap: 12px;
      align-content: start;
      min-width: 0;
    }

    .page-panel.wide {
      grid-column: 1 / -1;
    }

    .page-panel h2,
    .page-panel h3 {
      margin: 0;
      font-family: Georgia, "Times New Roman", "Songti SC", serif;
      letter-spacing: 0;
    }

    .page-panel p {
      margin: 0;
      color: #4d586d;
      line-height: 1.75;
    }

    .page-list {
      display: grid;
      gap: 10px;
    }

    .list-pager {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 800;
      margin-top: 12px;
    }

    .list-pager[hidden] {
      display: none;
    }

    .list-pager button {
      min-height: 32px;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: #fff;
      color: var(--ink);
      padding: 0 12px;
      font: inherit;
      cursor: pointer;
    }

    .list-pager button:disabled {
      cursor: not-allowed;
      opacity: .45;
    }

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

    .stat-item {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 14px;
      display: grid;
      gap: 6px;
    }

    .stat-number {
      font-size: 28px;
      font-weight: 900;
      color: var(--blue);
      font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    }

    .hero {
      display: flex;
      justify-content: space-between;
      gap: 18px;
      align-items: flex-end;
      margin-bottom: 14px;
    }

    h1 {
      margin: 0 0 8px;
      font-family: Georgia, "Times New Roman", "Songti SC", serif;
      font-size: clamp(20px, 1.8vw, 28px);
      font-weight: 600;
      letter-spacing: 0;
    }

    .subtitle {
      margin: 0;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.6;
    }

    .subtitle[hidden] {
      display: none;
    }

    .subtitle-meta {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }

    .hero-actions {
      display: grid;
      gap: 8px;
      justify-items: end;
    }

    .auth-user {
      display: inline-flex;
      gap: 8px;
      align-items: center;
      color: var(--muted);
      font-size: 13px;
      font-weight: 800;
    }

    .auth-user[hidden] {
      display: none;
    }

    .auth-link {
      border: 0;
      background: transparent;
      color: var(--blue);
      cursor: pointer;
      padding: 0;
      font-weight: 900;
    }

    .auth-user-name {
      color: var(--muted);
    }

    .auth-user-name:hover {
      color: var(--blue);
    }

    .user-center-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
      gap: 18px;
      align-items: start;
    }

    .user-password-panel {
      width: 100%;
      max-width: 340px;
      padding: 18px 20px;
      gap: 10px;
      justify-self: end;
    }

    .user-center-section-head {
      display: flex;
      justify-content: space-between;
      align-items: start;
      gap: 16px;
    }

    .token-usage-groups {
      display: grid;
      gap: 20px;
    }

    .token-balance-row {
      min-height: 66px;
      padding: 14px 18px;
      border: 1px solid rgba(65, 105, 225, .28);
      border-radius: 8px;
      background: var(--blue-soft);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
    }

    .token-balance-row span {
      color: var(--muted);
      font-size: 15px;
      font-weight: 900;
    }

    .token-balance-row strong {
      color: var(--blue);
      font-size: clamp(26px, 3vw, 38px);
      line-height: 1;
      overflow-wrap: anywhere;
      text-align: right;
    }

    .token-usage-group {
      display: grid;
      gap: 10px;
    }

    .token-usage-group h3 {
      margin: 0;
      color: var(--ink);
      font-size: 16px;
    }

    .token-stat-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .token-stat-grid.today {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .token-stat-card {
      min-height: 112px;
      padding: 18px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fbfaf7;
      display: grid;
      gap: 10px;
      align-content: center;
    }

    .token-stat-card.primary {
      border-color: rgba(65, 105, 225, .28);
      background: var(--blue-soft);
    }

    .token-stat-card span {
      color: var(--muted);
      font-size: 13px;
      font-weight: 850;
    }

    .token-stat-card strong {
      color: var(--ink);
      font-size: clamp(26px, 3vw, 38px);
      line-height: 1;
      overflow-wrap: anywhere;
    }

    .token-stat-card.primary strong {
      color: var(--blue);
    }

    .user-center-note {
      font-size: 13px;
    }

    .user-center-note.error,
    .user-password-message.error {
      color: var(--red);
    }

    .user-password-form {
      display: grid;
      gap: 10px;
    }

    .user-password-form label {
      display: grid;
      gap: 7px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 850;
    }

    .user-password-form input {
      width: 100%;
      min-height: 38px;
      padding: 7px 10px;
      border: 1px solid var(--line);
      border-radius: 7px;
      color: var(--ink);
      background: #fff;
      outline: none;
    }

    .user-password-form input:focus {
      border-color: rgba(65, 105, 225, .62);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .12);
    }

    .user-password-message {
      min-height: 20px;
      font-size: 13px;
      font-weight: 800;
      line-height: 1.5;
    }

    .user-password-message.success {
      color: #247344;
    }

    .user-password-form .btn {
      justify-content: center;
    }

    .auth-screen {
      position: fixed;
      inset: 0;
      z-index: 20;
      display: grid;
      place-items: center;
      padding: 24px;
      background: rgba(246, 244, 239, .92);
      backdrop-filter: blur(10px);
    }

    .auth-screen.hidden {
      display: none;
    }

    .auth-card {
      width: min(430px, 100%);
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: 0 24px 70px rgba(23, 33, 59, .18);
      padding: 24px;
      display: grid;
      gap: 14px;
    }

    .auth-card h2 {
      margin: 0;
      font-family: Georgia, "Times New Roman", "Songti SC", serif;
      font-size: 28px;
      letter-spacing: 0;
    }

    .auth-card p {
      margin: 0;
      color: var(--muted);
      line-height: 1.65;
    }

    .auth-form {
      display: grid;
      gap: 12px;
    }

    .auth-form label {
      display: grid;
      gap: 7px;
      color: #39435a;
      font-weight: 800;
    }

    .auth-form input {
      width: 100%;
      height: 42px;
      border: 1px solid var(--line);
      border-radius: 6px;
      background: #fff;
      color: var(--ink);
      padding: 0 12px;
      outline: none;
    }

    .auth-form input:focus {
      border-color: rgba(65, 105, 225, .62);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .12);
    }

    .auth-error {
      color: #a34038;
      font-size: 13px;
      font-weight: 800;
      min-height: 18px;
    }

    #authSubmit {
      justify-content: center;
      text-align: center;
    }

    .auth-test-account {
      padding-top: 13px;
      border-top: 1px solid var(--line);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
      gap: 10px;
      text-align: center;
      font-size: 15px;
      font-weight: 700;
    }

    .auth-test-account strong {
      color: #4565ec;
      font-size: 16px;
      font-weight: 900;
      letter-spacing: .02em;
      user-select: all;
    }

    .auth-test-account > span {
      color: #b35f68;
    }

    .auth-test-account .auth-test-account-copy {
      min-width: 160px;
      min-height: 34px;
      padding: 6px 12px;
      border-color: rgba(69, 101, 236, .28);
      background: rgba(69, 101, 236, .08);
      color: #4565ec;
      font-size: 13px;
      font-weight: 900;
      justify-content: center;
      text-align: center;
    }

    .auth-test-account .auth-test-account-copy:hover {
      border-color: rgba(69, 101, 236, .5);
      background: rgba(69, 101, 236, .14);
      color: #3859e2;
    }

    .app.auth-locked {
      pointer-events: none;
      user-select: none;
    }

    .composer {
      margin-bottom: 14px;
    }

    .primary-column > .composer {
      margin-bottom: 0;
    }

    .composer label {
      display: block;
      color: #39435a;
      font-weight: 700;
      margin-bottom: 8px;
    }

    .problem-entry-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 8px;
    }

    .composer .problem-entry-head > label {
      margin: 0;
    }

    .composer-grid {
      display: grid;
      grid-template-columns: var(--layout-columns);
      gap: var(--layout-gap);
      align-items: stretch;
    }

    .problem-entry,
    .composer-tools {
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: 14px;
    }

    .speech-active {
      border-color: rgba(65, 105, 225, .72) !important;
      background: #f7f9ff !important;
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .14), var(--shadow) !important;
    }

    .composer-tools {
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      gap: 8px;
    }

    .history-box {
      border-top: 1px solid var(--line);
      padding-top: 8px;
      display: grid;
      gap: 6px;
      min-height: 0;
    }

    .history-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
    }

    .collapse-toggle {
      border: 0;
      background: transparent;
      color: #39435a;
      cursor: pointer;
      padding: 0;
      font-weight: 900;
      display: inline-flex;
      align-items: center;
      gap: 7px;
    }

    .collapse-toggle::before {
      content: "▸";
      color: var(--muted);
      font-size: 13px;
      transition: transform .16s ease;
    }

    .collapsible.open .collapse-toggle::before {
      transform: rotate(90deg);
    }

    .collapsible:not(.open) .history-list,
    .collapsible:not(.open) .mistake-list {
      display: none;
    }

    .history-list {
      display: grid;
      gap: 7px;
      max-height: 188px;
      overflow: auto;
      padding-right: 2px;
    }

    .history-empty {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.55;
      padding: 8px 0;
    }

    .history-item {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 9px 10px;
      display: grid;
      gap: 6px;
      cursor: pointer;
      text-align: left;
    }

    .history-item:hover {
      border-color: rgba(65, 105, 225, .45);
      background: #fbfcff;
    }

    .history-item.active {
      border-color: rgba(65, 105, 225, .72);
      background: #f4f7ff;
    }

    .history-title {
      color: var(--ink);
      font-weight: 800;
      line-height: 1.45;
      font-size: 13px;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .history-title-preview {
      display: grid;
      gap: 5px;
      -webkit-line-clamp: unset;
      overflow: visible;
    }

    .history-preview-stem {
      min-width: 0;
    }

    .history-preview-stem > p {
      margin: 0;
      color: inherit;
      line-height: inherit;
    }

    .history-title-clamped {
      display: block;
      max-height: 2.9em;
      overflow: hidden;
    }

    .history-title-clamped .history-preview-stem > p {
      display: inline;
    }

    .history-title-clamped .history-preview-stem > p + p::before {
      content: " ";
    }

    .mistake-list .history-title-preview {
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .mistake-list .history-item.mistake-expanded .history-title-preview {
      display: grid;
      -webkit-line-clamp: unset;
      overflow: visible;
    }

    .history-item .mistake-question-detail {
      display: grid;
      gap: 8px;
      max-height: none;
      overflow: visible;
      text-align: left;
      font-weight: 700;
    }

    .history-meta {
      color: var(--muted);
      font-size: 12px;
      display: flex;
      justify-content: space-between;
      gap: 8px;
      align-items: center;
    }

    .mistake-review-meta {
      min-width: 0;
      display: grid;
      gap: 3px;
      text-align: left;
      line-height: 1.45;
    }

    .mistake-review-meta > span:first-child {
      color: #52627e;
      font-weight: 800;
    }

    .history-delete {
      border: 0;
      background: transparent;
      color: #9a4b45;
      cursor: pointer;
      padding: 0;
      font-size: 12px;
      font-weight: 800;
    }

    .history-actions {
      display: inline-flex;
      gap: 10px;
      align-items: center;
      justify-content: flex-end;
      flex-shrink: 0;
    }

    .history-edit {
      border: 0;
      background: transparent;
      color: var(--brand);
      cursor: pointer;
      padding: 0;
      font-size: 12px;
      font-weight: 800;
    }

    .history-action-pill {
      display: inline-flex;
      min-height: 30px;
      align-items: center;
      justify-content: center;
      border: 1px solid rgba(65, 105, 225, .25);
      border-radius: 999px;
      background: #f4f7ff;
      color: var(--brand);
      cursor: pointer;
      padding: 0 12px;
      font-size: 13px;
      font-weight: 900;
      white-space: nowrap;
    }

    .history-action-pill.secondary {
      border-color: rgba(38, 115, 77, .24);
      background: #f2fbf6;
      color: #26734d;
    }

    .history-action-pill.danger {
      border-color: rgba(154, 75, 69, .25);
      background: #fff3f2;
      color: #9a4b45;
    }

    .history-action-pill.export {
      border-color: rgba(104, 83, 36, .24);
      background: #fff8df;
      color: #85611b;
    }

    .history-action-pill:hover {
      filter: brightness(.98);
    }

    .history-practice {
      border: 0;
      background: transparent;
      color: #26734d;
      cursor: pointer;
      padding: 0;
      font-size: 12px;
      font-weight: 800;
    }

    .mistake-box {
      border-top: 1px solid var(--line);
      padding-top: 8px;
      display: grid;
      gap: 6px;
    }

    .mistake-list {
      display: grid;
      gap: 7px;
      max-height: 148px;
      overflow: auto;
      padding-right: 2px;
    }

    .practice-panel {
      display: none;
    }

    .practice-panel.show {
      display: block;
    }

    .choice-list {
      display: grid;
      gap: 9px;
      margin-top: 10px;
    }

    .choice-option {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 10px 12px;
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 10px;
      align-items: start;
      text-align: left;
      cursor: pointer;
      line-height: 1.55;
    }

    .choice-option.selected {
      border-color: rgba(65, 105, 225, .65);
      background: var(--blue-soft);
    }

    .choice-letter {
      width: 26px;
      height: 26px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: #10224d;
      color: #fff;
      font-weight: 900;
      font-size: 13px;
    }

    .practice-actions {
      display: flex;
      gap: 8px;
      align-items: center;
      flex-wrap: wrap;
      margin-top: 12px;
    }

    .practice-feedback {
      color: var(--muted);
      font-weight: 800;
      line-height: 1.65;
    }

    .practice-feedback.wrong {
      color: #a34038;
    }

    .practice-feedback.correct {
      color: #247344;
    }

    .practice-next {
      display: none;
    }

    .practice-next.show {
      display: inline-flex;
    }

    .train-source {
      margin-top: 12px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fbfaf7;
      padding: 12px;
      color: var(--muted);
      font-weight: 800;
      line-height: 1.55;
      min-width: 0;
      white-space: normal;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .train-source-label {
      display: block;
      margin-bottom: 6px;
      color: #5f6b82;
    }

    .train-source-stem {
      color: var(--ink);
      white-space: pre-wrap;
    }

    .train-source-choices {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 6px 16px;
      margin-top: 8px;
    }

    .train-source-choice {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 8px;
      align-items: start;
      min-width: 0;
    }

    .train-source-choice b {
      color: var(--ink);
    }

    .train-source-choice span {
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .similar-board {
      display: grid;
      gap: 12px;
    }

    .similar-card {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      padding: 16px;
      display: grid;
      gap: 12px;
    }

    .similar-card-head {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      align-items: center;
      color: var(--muted);
      font-size: 13px;
      font-weight: 900;
    }

    .similar-problem {
      color: var(--ink);
      font-weight: 850;
      line-height: 1.65;
      white-space: pre-wrap;
    }

    .similar-choices {
      display: grid;
      gap: 8px;
    }

    .choice-two-column-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px 12px;
    }

    .similar-choice {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 9px 11px;
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 9px;
      align-items: start;
      text-align: left;
      cursor: pointer;
      line-height: 1.55;
    }

    .choice-two-column-grid .similar-choice {
      min-width: 0;
    }

    .choice-two-column-grid .similar-choice > span:last-child {
      min-width: 0;
    }

    .similar-choice.selected {
      border-color: rgba(65, 105, 225, .65);
      background: var(--blue-soft);
    }

    .similar-choice.correct {
      border-color: rgba(36, 115, 68, .45);
      background: rgba(104, 184, 132, .13);
    }

    .similar-choice.wrong {
      border-color: rgba(163, 64, 56, .45);
      background: rgba(209, 74, 63, .09);
    }

    .similar-feedback {
      min-height: 22px;
      color: var(--muted);
      font-weight: 850;
      line-height: 1.6;
    }

    .similar-feedback.wrong {
      color: #a34038;
    }

    .similar-feedback.correct {
      color: #247344;
    }

    .paper-uploader {
      display: grid;
      gap: 10px;
    }

    .paper-uploader-area {
      display: grid;
      gap: 10px;
      grid-column: 1 / -1;
    }

    .paper-input-frame {
      min-height: 230px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      display: grid;
      align-items: center;
      padding: 12px;
      cursor: pointer;
      caret-color: transparent;
      outline: none;
    }

    .paper-input-frame:focus-within,
    .paper-input-frame:hover {
      border-color: rgba(65, 105, 225, .62);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .12);
    }

    .paper-preview {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
      align-items: stretch;
      min-height: 206px;
      border: 1px dashed #cfc8ba;
      border-radius: 6px;
      background: #fbfaf7;
      color: var(--muted);
      font-weight: 850;
      line-height: 1.7;
      text-align: center;
      padding: 12px;
      gap: 10px;
    }

    .paper-placeholder {
      display: grid;
      gap: 4px;
      place-items: center;
      grid-column: 1 / -1;
    }

    .paper-preview.show .paper-placeholder {
      display: none;
    }

    #paperPreviewList {
      display: contents;
    }

    .paper-page-card {
      position: relative;
      min-height: 168px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 34px 8px 8px;
      display: grid;
      gap: 8px;
      align-content: start;
    }

    .paper-page-card img {
      width: 100%;
      height: 128px;
      object-fit: contain;
      border-radius: 6px;
      background: #f8f8f8;
      cursor: zoom-in;
    }

    .paper-page-order {
      position: absolute;
      top: 8px;
      left: 8px;
      border-radius: 999px;
      background: var(--ink);
      color: #fff;
      padding: 3px 8px;
      font-size: 12px;
      font-weight: 900;
    }

    .paper-page-tools {
      position: absolute;
      top: 6px;
      right: 6px;
      display: flex;
      gap: 4px;
    }

    .paper-page-tool {
      width: 26px;
      height: 26px;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: rgba(255, 255, 255, .94);
      color: var(--ink);
      cursor: pointer;
      display: grid;
      place-items: center;
      font-weight: 900;
      font-size: 14px;
    }

    .paper-page-tool:disabled {
      opacity: .38;
      cursor: not-allowed;
    }

    .paper-page-name {
      color: var(--muted);
      font-size: 12px;
      font-weight: 800;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .paper-status {
      color: var(--muted);
      font-weight: 800;
      line-height: 1.6;
    }

    .paper-board {
      display: grid;
      gap: 14px;
    }

    .paper-library-list {
      grid-template-columns: 1fr;
      gap: 10px;
    }

    .paper-library-card {
      position: relative;
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fff;
      padding: 13px;
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 10px;
      align-items: start;
      text-align: left;
      cursor: pointer;
      box-shadow: 0 10px 28px rgba(36, 31, 24, .06);
      transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
    }

    .paper-library-card:hover {
      transform: translateY(-2px);
      border-color: rgba(65, 105, 225, .5);
      box-shadow: 0 16px 34px rgba(36, 31, 24, .1);
      background: #fffefe;
    }

    .paper-library-card.active {
      border-color: rgba(65, 105, 225, .75);
      background: linear-gradient(135deg, #fff, #f5f8ff);
      box-shadow: 0 16px 36px rgba(65, 105, 225, .14);
    }

    .paper-library-main {
      min-width: 0;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 6px 14px;
      align-items: center;
    }

    .paper-library-head {
      grid-column: 1;
      display: block;
    }

    .paper-library-title {
      color: var(--ink);
      font-size: 16px;
      line-height: 1.4;
      font-weight: 950;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .paper-library-time {
      display: inline-flex;
      align-items: center;
      min-height: 26px;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: #fbfaf7;
      color: var(--muted);
      font-size: 12px;
      font-weight: 900;
      white-space: nowrap;
      padding: 0 9px;
    }

    .paper-library-meta {
      grid-column: 1;
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
      align-items: center;
    }

    .paper-library-chip {
      min-height: 26px;
      display: inline-flex;
      align-items: center;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: #fbfaf7;
      color: #566176;
      padding: 0 9px;
      font-size: 12px;
      font-weight: 900;
      white-space: nowrap;
    }

    .paper-library-chip.strong {
      border-color: rgba(65, 105, 225, .22);
      background: var(--blue-soft);
      color: var(--blue);
    }

    .paper-library-chip.score {
      border-color: rgba(217, 155, 43, .28);
      background: var(--amber-soft);
      color: #85611b;
    }

    .paper-library-summary {
      grid-column: 1;
      color: #596579;
      font-size: 13px;
      line-height: 1.55;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .paper-library-time-text {
      color: var(--muted);
      font-weight: 850;
    }

    .paper-library-actions {
      grid-column: 2;
      grid-row: 1 / span 3;
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      flex-wrap: wrap;
      padding-top: 2px;
      min-width: 300px;
    }

    .paper-library-actions .history-action-pill {
      min-height: 32px;
      padding: 0 12px;
      border-radius: 7px;
    }

    .paper-library-toolbar {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }

    .paper-library-toolbar [data-back-paper-library] {
      margin-right: auto;
    }

    .paper-question-choice-layout-control {
      width: fit-content;
      min-height: 34px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin: 0 0 10px auto;
      padding: 0 8px 0 11px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #f8faff;
      color: var(--muted);
      font-size: 12px;
      font-weight: 850;
    }

    .paper-question-choice-layout-control select {
      min-height: 28px;
      border: 0;
      background: transparent;
      color: var(--ink);
      font: inherit;
      font-weight: 900;
      outline: none;
      cursor: pointer;
    }

    .paper-view-panel {
      gap: 16px;
    }

    .paper-view-head {
      display: flex;
      justify-content: space-between;
      align-items: start;
      gap: 16px;
      border-bottom: 1px solid var(--line);
      padding-bottom: 14px;
    }

    .paper-view-head p {
      margin-top: 6px;
    }

    .paper-view-board {
      max-width: 1120px;
      width: 100%;
      margin: 0 auto;
    }

    .exam-paper {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fff;
      box-shadow: var(--shadow);
      padding: clamp(22px, 3vw, 42px);
      color: var(--ink);
      display: grid;
      gap: 22px;
      font-family: "Songti SC", "STSong", "Times New Roman", serif;
    }

    .exam-paper-title {
      text-align: center;
      display: grid;
      gap: 8px;
      padding-bottom: 14px;
      border-bottom: 1px solid var(--line);
    }

    .exam-paper-title h2 {
      font-size: clamp(24px, 3vw, 34px);
      line-height: 1.25;
      margin: 0;
      letter-spacing: 0;
    }

    .exam-paper-meta,
    .exam-paper-note {
      color: var(--muted);
      font-size: 14px;
      font-weight: 800;
      line-height: 1.6;
    }

    .exam-section {
      display: grid;
      gap: 16px;
    }

    .exam-section-title {
      color: var(--ink);
      font-size: 21px;
      font-weight: 950;
      line-height: 1.45;
      padding: 6px 0 8px;
      border-bottom: 2px solid #e6ded2;
    }

    .exam-section-instruction {
      margin-top: -8px;
      color: var(--muted);
      font-size: 15px;
      font-weight: 750;
      line-height: 1.7;
    }

    .exam-question {
      display: grid;
      gap: 10px;
      break-inside: avoid;
      page-break-inside: avoid;
    }

    .exam-question-main {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 8px;
      align-items: start;
      color: var(--ink);
      font-size: 18px;
      font-weight: 850;
      line-height: 1.85;
    }

    .exam-question-number {
      min-width: 2em;
      font-weight: 950;
    }

    .exam-question-score {
      color: var(--muted);
      font-size: .86em;
      font-weight: 800;
      white-space: nowrap;
    }

    .exam-question-body {
      min-width: 0;
    }

    .exam-question-body > p {
      margin: 0 0 8px;
      line-height: inherit;
    }

    .exam-question-body > p:last-child {
      margin-bottom: 0;
    }

    .exam-question-body > :first-child {
      margin-top: 0;
    }

    .exam-source-image {
      display: grid;
      place-items: center;
      padding: 2px 0 6px;
    }

    .exam-source-image img {
      max-width: min(78%, 560px);
      max-height: 300px;
      object-fit: contain;
      cursor: zoom-in;
      background: #fff;
    }

    .exam-choice-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px 36px;
      margin-left: 2.2em;
      font-size: 17px;
      font-weight: 700;
      line-height: 1.75;
    }

    .paper-choice-row-layout {
      grid-template-columns: repeat(var(--paper-choice-columns, 2), minmax(0, 1fr)) !important;
    }

    .exam-choice {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 8px;
      align-items: start;
      min-width: 0;
    }

    .exam-choice b {
      color: var(--ink);
      font-weight: 850;
    }

    .exam-paper .latex-choice-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .paper-view-board .exam-paper .paper-choice-row-layout {
      gap: 20px 52px;
      margin-top: 18px;
      margin-bottom: 22px;
    }

    .paper-view-board .exam-paper .paper-choice-row-layout .latex-choice,
    .paper-view-board .exam-paper .paper-choice-row-layout .exam-choice {
      align-items: flex-start;
      min-height: 34px;
      line-height: 1.8;
    }

    .exam-paper .latex-choice b {
      color: var(--ink);
      font-weight: 850;
    }

    .exam-paper .markdown-table-wrap {
      overflow-x: auto;
      margin: 12px 0 10px;
      border: 1px solid #e2dcd2;
      border-radius: 7px;
      background: #fff;
    }

    .exam-paper table.markdown-table {
      width: 100%;
      min-width: min(620px, 100%);
      border-collapse: collapse;
      table-layout: auto;
      font-family: "Songti SC", "STSong", "Times New Roman", serif;
      font-size: 16px;
      line-height: 1.7;
    }

    .exam-paper table.markdown-table th,
    .exam-paper table.markdown-table td {
      border: 1px solid #e2dcd2;
      padding: 10px 12px;
      vertical-align: middle;
      text-align: left;
      word-break: normal;
      overflow-wrap: break-word;
    }

    .exam-paper table.markdown-table th {
      background: #f7f3ea;
      color: var(--ink);
      font-weight: 900;
    }

    .exam-paper table.markdown-table th:first-child,
    .exam-paper table.markdown-table td:first-child {
      width: 6.5em;
      white-space: nowrap;
      text-align: center;
      font-weight: 900;
    }

    .exam-answer-space {
      min-height: 170px;
      border-bottom: 1px solid #ddd5ca;
      background:
        repeating-linear-gradient(
          to bottom,
          transparent 0,
          transparent 35px,
          rgba(221, 213, 202, .82) 36px
        );
      margin: 8px 0 4px 2.2em;
    }

    .exam-answer-space.long {
      min-height: 260px;
    }

    .exam-answer-space.chinese-dictation-space {
      min-height: 90px;
    }

    .exam-answer-space.chinese-medium-space {
      min-height: 170px;
    }

    .exam-answer-space.chinese-reading-space {
      min-height: 280px;
    }

    .exam-question.chinese-writing-question {
      break-inside: auto;
      page-break-inside: auto;
    }

    .exam-writing-space-label {
      margin: 8px 0 0 2.2em;
      color: var(--muted);
      font-size: 13px;
      font-weight: 800;
    }

    .exam-answer-space.chinese-writing-space {
      min-height: 720px;
      border: 1px solid #d5cec3;
      background-image:
        linear-gradient(to right, rgba(213, 206, 195, .76) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(213, 206, 195, .76) 1px, transparent 1px);
      background-size: 28px 28px;
    }

    .assemble-grid {
      grid-template-columns: minmax(360px, .9fr) minmax(420px, 1.1fr);
      align-items: start;
    }

    .assemble-filters {
      grid-template-columns: repeat(4, minmax(130px, 1fr));
      margin-bottom: 0;
    }

    .assemble-actions {
      display: flex;
      gap: 8px;
      align-items: end;
      flex-wrap: wrap;
    }

    .assemble-pool-panel,
    .assemble-basket-panel {
      min-height: 0;
    }

    .assemble-pool-panel {
      align-self: stretch;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      height: var(--assemble-pool-height, clamp(620px, calc(100vh - 250px), 860px));
      min-height: clamp(620px, calc(100vh - 250px), 860px);
    }

    .assemble-panel-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
    }

    .assemble-panel-head h2 {
      margin: 0;
    }

    .assemble-panel-note {
      color: var(--muted);
      font-size: 12px;
      font-weight: 850;
      line-height: 1.5;
    }

    .assemble-basket-toolbar {
      display: flex;
      gap: 8px;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
    }

    .assemble-basket-actions,
    .assemble-preview-tools {
      display: flex;
      gap: 8px;
      align-items: center;
      flex-wrap: wrap;
    }

    .assemble-preview-tools {
      justify-content: flex-end;
    }

    .assemble-mini-btn {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: var(--ink);
      min-height: 30px;
      padding: 5px 9px;
      font: inherit;
      font-size: 12px;
      font-weight: 900;
      cursor: pointer;
    }

    .assemble-mini-btn:hover:not(:disabled) {
      border-color: rgba(65, 105, 225, .45);
      background: var(--blue-soft);
    }

    .assemble-mini-btn:disabled {
      opacity: .45;
      cursor: not-allowed;
    }

    .assemble-mini-btn.danger {
      color: var(--danger);
      border-color: rgba(178, 69, 55, .28);
    }

    .assemble-candidate-list {
      display: grid;
      align-content: start;
      gap: 8px;
      min-height: 0;
      max-height: none;
      overflow: auto;
      padding-right: 4px;
    }

    .assemble-question-card {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 10px;
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 10px;
      align-items: start;
      cursor: pointer;
    }

    .assemble-question-card:hover {
      border-color: rgba(65, 105, 225, .42);
      background: #fbfcff;
    }

    .assemble-question-card.active {
      border-color: rgba(65, 105, 225, .65);
      background: var(--blue-soft);
    }

    .assemble-question-card input {
      margin-top: 4px;
    }

    .assemble-question-body {
      display: grid;
      gap: 5px;
      min-width: 0;
    }

    .assemble-question-title {
      color: var(--ink);
      font-weight: 900;
      line-height: 1.45;
    }

    .assemble-question-meta {
      color: var(--muted);
      font-size: 12px;
      font-weight: 850;
      line-height: 1.45;
    }

    .assemble-question-meta.strong {
      color: var(--blue);
    }

    .assemble-preview-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
    }

    .assemble-preview-head .paper-question-head {
      flex: 1;
      min-width: 220px;
    }

    .assemble-basket-panel .exam-paper {
      gap: 18px;
      padding: clamp(20px, 2.4vw, 30px);
    }

    .assemble-basket-panel .exam-paper-title h2 {
      font-size: clamp(22px, 2.4vw, 28px);
    }

    .assemble-basket-panel .exam-question-main {
      font-size: 16px;
    }

    .assemble-basket-panel .exam-choice-grid {
      gap: 8px 22px;
      font-size: 15px;
    }

    .assemble-question-tools {
      display: flex;
      justify-content: flex-end;
      gap: 6px;
      flex-wrap: wrap;
      font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif;
    }

    .single-question-item {
      display: grid;
      gap: 8px;
    }

    .single-question-filters {
      display: grid;
      grid-template-columns: minmax(180px, 1.5fr) repeat(6, minmax(100px, 1fr)) auto;
      gap: 10px;
      align-items: end;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fbfaf7;
      margin-bottom: 12px;
    }

    .single-question-filters label {
      display: grid;
      gap: 6px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 900;
    }

    .single-question-filters label > span {
      display: block;
    }

    .single-question-filters input,
    .single-question-filters select {
      width: 100%;
      min-height: 36px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: var(--ink);
      padding: 7px 9px;
      font: inherit;
      outline: none;
    }

    .single-filter-actions {
      display: flex;
      gap: 8px;
      align-items: center;
    }

    .single-filter-actions .btn {
      white-space: nowrap;
    }

    .single-question-filters.similar-filters {
      grid-template-columns: repeat(3, minmax(130px, 1fr)) auto;
    }

    .public-library-tabs {
      display: flex;
      gap: 8px;
      margin-bottom: 12px;
    }

    .single-question-filters.public-library-filters {
      grid-template-columns: minmax(180px, 1.5fr) repeat(6, minmax(96px, 1fr)) auto;
    }

    .single-question-filters.public-library-filters.paper-mode {
      grid-template-columns: minmax(180px, 1.5fr) repeat(4, minmax(96px, 1fr)) auto;
    }

    .management-public-library-grid {
      display: block;
    }

    .management-public-library-subtabs {
      display: inline-flex;
      gap: 4px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #f6f4ef;
      padding: 3px;
      margin-bottom: 14px;
    }

    .management-public-library-subtab {
      border: 0;
      border-radius: 6px;
      background: transparent;
      color: var(--muted);
      padding: 8px 18px;
      font: inherit;
      font-size: 13px;
      font-weight: 900;
      cursor: pointer;
    }

    .management-public-library-subtab.active {
      background: #fff;
      color: var(--brand);
      box-shadow: 0 1px 4px rgba(33, 44, 72, .12);
    }

    .management-public-library-section {
      border: 1px solid rgba(65, 105, 225, .22);
      border-radius: 8px;
      background: #fff;
      padding: 14px;
      min-width: 0;
    }

    .management-public-library-section[hidden] {
      display: none;
    }

    .public-library-publish {
      display: block;
      background: var(--blue-soft);
    }

    .management-public-section-head {
      display: grid;
      gap: 10px;
      margin-bottom: 12px;
    }

    .management-public-filter-grid {
      display: grid;
      grid-template-columns: minmax(180px, 1.5fr) repeat(4, minmax(100px, 1fr)) auto;
      gap: 8px;
      align-items: end;
    }

    .management-public-filter-grid label {
      display: grid;
      gap: 5px;
      min-width: 0;
      color: var(--muted);
      font-size: 12px;
      font-weight: 900;
    }

    .management-public-filter-grid input,
    .management-public-filter-grid select {
      width: 100%;
      min-width: 0;
    }

    .management-public-publish-actions {
      display: flex;
      justify-content: flex-end;
      margin-top: 12px;
    }

    .management-public-library-list {
      margin-top: 0;
      max-height: 520px;
      overflow: auto;
    }

    .public-library-publish[hidden] {
      display: none;
    }

    .public-source-picker {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      overflow: hidden;
    }

    .public-source-toolbar {
      min-height: 38px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      border-bottom: 1px solid var(--line);
      background: #fbfaf7;
      color: var(--muted);
      padding: 6px 10px;
      font-size: 12px;
      font-weight: 900;
    }

    .public-source-batch-actions {
      display: inline-flex;
      gap: 6px;
    }

    .public-source-batch-actions[hidden] {
      display: none;
    }

    .public-source-batch-actions button {
      border: 0;
      background: transparent;
      color: var(--brand);
      padding: 2px 4px;
      font: inherit;
      cursor: pointer;
    }

    .public-source-list {
      max-height: 460px;
      display: grid;
      overflow: auto;
    }

    .public-source-choice {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 9px;
      align-items: start;
      border-bottom: 1px solid #eeeae2;
      padding: 9px 10px;
      cursor: pointer;
    }

    .public-source-choice:last-child {
      border-bottom: 0;
    }

    .public-source-choice:hover {
      background: #f7f9ff;
    }

    .public-source-choice input {
      margin-top: 3px;
    }

    .public-source-choice span {
      min-width: 0;
      display: grid;
      gap: 3px;
    }

    .public-source-choice strong {
      color: var(--ink);
      font-size: 13px;
      line-height: 1.45;
    }

    .public-source-choice small {
      color: var(--muted);
      font-size: 11px;
      line-height: 1.4;
    }

    .public-library-card {
      cursor: default;
    }

    .public-library-card[data-public-item] {
      cursor: pointer;
    }

    .public-library-detail {
      border-top: 1px solid var(--line);
      padding-top: 14px;
      overflow: auto;
    }

    .public-library-detail[hidden] {
      display: none;
    }

    .public-single-preview,
    .public-paper-preview {
      border-radius: 8px;
      background: #fbfaf7;
      padding: 14px;
    }

    .public-answer-title {
      margin: 14px 0 8px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 900;
    }

    @media (max-width: 1100px) {
      .single-question-filters.public-library-filters {
        grid-template-columns: repeat(3, minmax(140px, 1fr));
      }

      .management-public-filter-grid {
        grid-template-columns: repeat(3, minmax(140px, 1fr));
      }

    }

    .single-question-filters.mistake-filters {
      grid-template-columns: repeat(5, minmax(110px, 1fr)) auto;
    }

    .similar-filter-actions {
      display: flex;
      gap: 8px;
      align-items: end;
      justify-content: flex-end;
      flex-wrap: nowrap;
    }

    .similar-filter-actions .btn {
      white-space: nowrap;
    }

    .single-question-filters.assemble-filters {
      grid-template-columns: repeat(6, minmax(110px, 1fr));
    }

    .single-question-filters.assemble-filters .assemble-actions {
      grid-column: 1 / -1;
      justify-content: flex-end;
      align-items: center;
      padding-top: 2px;
    }

    .single-question-detail {
      padding-left: 12px;
      border-left: 3px solid rgba(65, 105, 225, .22);
    }

    .single-question-edit-form {
      display: grid;
      gap: 12px;
    }

    .single-question-edit-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
    }

    .single-question-edit-form label {
      display: grid;
      gap: 6px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 900;
    }

    .single-question-edit-form input,
    .single-question-edit-form select,
    .single-question-edit-form textarea {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: var(--ink);
      padding: 9px 10px;
      line-height: 1.55;
      outline: none;
      font: inherit;
    }

    .single-question-edit-form textarea {
      min-height: 86px;
      resize: vertical;
    }

    .single-search-select {
      position: relative;
    }

    .single-search-select::after {
      content: "⌄";
      position: absolute;
      top: 50%;
      right: 10px;
      color: var(--muted);
      font-size: 14px;
      pointer-events: none;
      transform: translateY(-56%);
    }

    .single-search-select input {
      padding-right: 30px;
    }

    .single-search-options {
      position: absolute;
      z-index: 30;
      top: calc(100% + 4px);
      right: 0;
      left: 0;
      max-height: 220px;
      overflow-y: auto;
      padding: 4px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fff;
      box-shadow: 0 10px 26px rgba(28, 39, 70, .15);
    }

    .single-search-options button {
      display: block;
      width: 100%;
      padding: 8px 9px;
      border: 0;
      border-radius: 5px;
      background: transparent;
      color: var(--ink);
      text-align: left;
      cursor: pointer;
    }

    .single-search-options button[hidden] {
      display: none;
    }

    .single-search-options button:hover,
    .single-search-options button:focus-visible {
      background: rgba(65, 105, 225, .1);
      outline: none;
    }

    .single-search-options.empty::after {
      content: "没有匹配项，可直接保留输入内容";
      display: block;
      padding: 8px 9px;
      color: var(--muted);
      font-weight: 500;
    }

    .single-question-edit-form .parse-textarea,
    .single-question-edit-form .parse-preview {
      min-height: 0;
      height: 240px;
    }

    .single-question-edit-form .parse-editor-panel:nth-child(1),
    .single-question-edit-form .parse-editor-panel:nth-child(2),
    .single-question-edit-form .parse-editor-panel:nth-child(3),
    .single-question-edit-form .parse-editor-panel:nth-child(4) {
      min-height: 0;
    }

    .single-question-edit-form .parse-textarea.solution,
    .single-question-edit-form .parse-preview.solution {
      min-height: 0;
      height: 180px;
    }

    .math-symbol-toolbar {
      position: relative;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      min-height: 36px;
    }

    .math-symbol-trigger {
      min-height: 36px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: var(--ink);
      padding: 7px 12px;
      font: 900 14px/1 Inter, "PingFang SC", "Microsoft YaHei", sans-serif;
      cursor: pointer;
    }

    .math-symbol-trigger:hover,
    .math-symbol-trigger.active {
      border-color: rgba(65, 105, 225, .5);
      background: var(--blue-soft);
    }

    .math-symbol-popover {
      position: absolute;
      z-index: 20;
      top: calc(100% + 6px);
      left: 0;
      width: min(440px, calc(100vw - 360px));
      box-shadow: 0 14px 38px rgba(36, 31, 24, .16);
    }

    .math-symbol-popover[hidden] {
      display: none;
    }

    .math-symbol-panel {
      display: grid;
      gap: 10px;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fbfaf7;
    }

    .math-symbol-tabs {
      display: flex;
      gap: 4px;
      padding: 3px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #f1eee8;
    }

    .math-symbol-tab {
      flex: 1;
      min-height: 30px;
      border: 0;
      border-radius: 6px;
      background: transparent;
      color: var(--muted);
      font: 900 14px/1 Inter, "PingFang SC", "Microsoft YaHei", sans-serif;
      cursor: pointer;
    }

    .math-symbol-tab.active {
      background: #fff;
      color: var(--ink);
      box-shadow: 0 1px 4px rgba(36, 31, 24, .08);
    }

    .math-symbol-page[hidden] {
      display: none;
    }

    .math-symbol-page {
      max-height: 230px;
      overflow-y: auto;
      padding-right: 2px;
    }

    .math-symbol-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(42px, 1fr));
      gap: 6px;
    }

    .math-symbol-button {
      width: 100%;
      min-width: 0;
      height: 34px;
      border: 1px solid var(--line);
      border-radius: 6px;
      background: #fff;
      color: var(--ink);
      font: 800 15px/1 Georgia, "Times New Roman", "Songti SC", serif;
      font-weight: 900;
      cursor: pointer;
    }

    .math-symbol-button.wide {
      grid-column: span 2;
    }

    .math-symbol-button:hover {
      border-color: rgba(65, 105, 225, .5);
      background: var(--blue-soft);
    }

    .single-question-edit-grid .math-symbol-toolbar {
      align-self: end;
    }

    .single-question-edit-tools {
      align-self: end;
      display: flex;
      grid-column: span 2;
      align-items: center;
      gap: 6px;
      min-width: 0;
      flex-wrap: wrap;
    }

    .single-question-edit-tools .math-symbol-toolbar,
    .single-question-edit-tools .single-question-edit-actions {
      min-height: 32px;
    }

    .single-question-edit-tools .math-symbol-trigger,
    .single-question-edit-tools .single-question-ai-btn,
    .single-question-edit-tools .single-question-edit-actions .btn {
      height: 32px;
      min-height: 32px;
      border-color: rgba(36, 31, 24, .14);
      padding: 5px 10px;
      font-size: 13px;
      line-height: 1;
      box-sizing: border-box;
    }

    .single-question-edit-tools .math-symbol-trigger:hover,
    .single-question-edit-tools .math-symbol-trigger.active,
    .single-question-edit-tools .single-question-ai-btn:hover:not(:disabled),
    .single-question-edit-tools .single-question-edit-actions .btn:hover:not(:disabled) {
      border-color: rgba(65, 105, 225, .26);
      box-shadow: 0 4px 10px rgba(20, 30, 56, .08);
    }

    .single-question-edit-tools .math-symbol-trigger {
      font-weight: 500;
    }

    .single-question-ai-btn {
      align-self: end;
      justify-self: start;
      min-height: 36px;
      padding: 7px 14px;
      white-space: nowrap;
    }

    .single-question-edit-actions {
      align-self: end;
      justify-self: start;
      display: flex;
      gap: 6px;
      min-height: 36px;
      align-items: center;
    }

    .single-question-edit-actions .btn {
      min-height: 36px;
      padding: 7px 14px;
      white-space: nowrap;
    }

    @media (max-width: 900px) {
      .paper-library-list {
        grid-template-columns: 1fr;
      }

      .paper-library-card {
        grid-template-columns: 1fr;
      }

      .paper-library-main {
        grid-template-columns: 1fr;
      }

      .paper-library-head {
        display: grid;
      }

      .paper-library-actions {
        grid-column: 1;
        grid-row: auto;
        justify-content: flex-start;
        min-width: 0;
      }

      .single-question-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .single-filter-actions {
        grid-column: 1 / -1;
        justify-content: flex-end;
      }

      .single-question-filters.similar-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .similar-filter-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
        flex-wrap: wrap;
      }

      .assemble-grid,
      .assemble-filters {
        grid-template-columns: 1fr;
      }

      .single-question-filters.assemble-filters {
        grid-template-columns: 1fr;
      }

      .single-question-edit-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .single-question-edit-tools {
        grid-column: 1 / -1;
      }

      .math-symbol-popover {
        position: static;
        width: 100%;
        margin-top: 8px;
      }

      .parse-editor-grid {
        grid-template-columns: 1fr;
      }

      .parse-textarea,
      .parse-preview {
        height: 300px;
      }

      .parse-textarea.solution,
      .parse-preview.solution {
        height: 200px;
      }
    }

    .paper-question {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      box-shadow: var(--shadow);
      padding: 18px;
      display: grid;
      gap: 12px;
    }

    .paper-source-image {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fbfaf7;
      padding: 10px;
      display: grid;
      gap: 8px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 850;
    }

    .paper-source-image img {
      width: 100%;
      max-height: 260px;
      object-fit: contain;
      border-radius: 6px;
      background: #fff;
      cursor: zoom-in;
    }

    .paper-question-head {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      align-items: center;
      color: var(--muted);
      font-size: 13px;
      font-weight: 900;
    }

    .paper-stem {
      color: var(--ink);
      font-weight: 850;
      line-height: 1.7;
      white-space: pre-wrap;
    }

    .paper-answer-input {
      width: 100%;
      min-height: 76px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: var(--ink);
      padding: 10px 12px;
      line-height: 1.6;
      resize: vertical;
      outline: none;
    }

    .paper-answer-input:focus {
      border-color: rgba(65, 105, 225, .62);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .12);
    }

    .paper-practice-grade-model {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
      margin-top: 12px;
      padding: 12px 14px;
      border: 1px solid #dce6f8;
      border-radius: 10px;
      background: #f7f9ff;
      color: var(--muted);
      font-size: 13px;
      font-weight: 750;
    }

    .paper-practice-grade-model label {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      color: var(--ink);
    }

    .paper-practice-grade-model select {
      min-width: 130px;
      border: 1px solid #cfdaed;
      border-radius: 8px;
      background: #fff;
      color: var(--ink);
      padding: 8px 10px;
      font: inherit;
    }

    .english-grade-panel {
      display: grid;
      gap: 12px;
      margin-top: 14px;
      padding: 16px;
      border: 1px solid #d9e3f6;
      border-radius: 12px;
      background: linear-gradient(145deg, #f6f8ff, #fcfdff);
      color: #26364d;
    }

    .english-grade-panel.meets_expectations {
      border-color: #bfe1ce;
      background: linear-gradient(145deg, #f0fbf5, #fbfffd);
    }

    .english-grade-panel.partially_meets {
      border-color: #ead9a9;
      background: linear-gradient(145deg, #fffbef, #fffefa);
    }

    .english-grade-panel.needs_improvement {
      border-color: #efc9c5;
      background: linear-gradient(145deg, #fff6f5, #fffdfd);
    }

    .english-grade-head,
    .english-grade-actions,
    .english-grade-title {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }

    .english-grade-head {
      justify-content: space-between;
    }

    .english-grade-title span,
    .english-grade-model,
    .english-grade-note {
      color: var(--muted);
      font-size: 13px;
      font-weight: 750;
    }

    .english-grade-note {
      margin: 0;
      line-height: 1.7;
    }

    .english-grade-summary {
      font-weight: 800;
      line-height: 1.75;
    }

    .english-grade-section,
    .english-grade-criteria,
    .english-grade-improvements {
      display: grid;
      gap: 8px;
    }

    .english-grade-section ul {
      margin: 0;
      padding-left: 20px;
      line-height: 1.7;
    }

    .english-grade-criteria,
    .english-grade-improvements {
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    }

    .english-grade-criteria > div,
    .english-grade-improvements > div,
    .english-grade-corrected > div {
      padding: 11px 12px;
      border: 1px solid rgba(130, 151, 190, .2);
      border-radius: 9px;
      background: rgba(255, 255, 255, .76);
      line-height: 1.7;
    }

    .english-grade-criteria span,
    .english-grade-improvements span {
      font-weight: 850;
    }

    .english-grade-criteria p,
    .english-grade-improvements p {
      margin: 5px 0 0;
    }

    .paper-explanation {
      display: none;
      border: 1px solid #d9e5d9;
      border-radius: 7px;
      background: #f7fbf7;
      padding: 12px;
      line-height: 1.7;
      color: #26364d;
    }

    .paper-explanation.show {
      display: grid;
      gap: 8px;
    }

    .paper-explanation-content p,
    .paper-explanation-step p {
      margin: 0;
    }

    .paper-explanation-steps,
    .paper-explanation-step {
      display: grid;
      gap: 6px;
    }

    .parse-shell {
      display: grid;
      gap: 10px;
    }

    .parse-topbar {
      padding: 0;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
    }

    .parse-title {
      display: grid;
      gap: 6px;
    }

    .parse-title h2 {
      display: none;
      margin: 0;
      font-family: Georgia, "Times New Roman", "Songti SC", serif;
      letter-spacing: 0;
    }

    .parse-title p {
      display: none;
      margin: 0;
      color: var(--muted);
      line-height: 1.6;
      font-weight: 750;
    }

    .parse-actions {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 8px;
    }

    .parse-question-strip {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 8px 10px;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 10px;
      align-items: center;
    }

    .parse-question-strip h3 {
      margin: 0;
      font-size: 14px;
      letter-spacing: 0;
    }

    .parse-meta {
      display: grid;
      grid-template-columns: minmax(160px, 220px) minmax(150px, 190px);
      gap: 8px;
    }

    .parse-meta input,
    .parse-meta select {
      min-width: 0;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: var(--ink);
      padding: 9px 10px;
      font-weight: 850;
      outline: none;
    }

    .parse-meta input:focus,
    .parse-meta select:focus,
    .parse-textarea:focus {
      border-color: rgba(65, 105, 225, .62);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .12);
    }

    .parse-textarea.drag-over {
      border-color: rgba(65, 105, 225, .72);
      background: #eef4ff;
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .14);
    }

    .parse-meta input::placeholder {
      color: #aeb6c5;
      font-weight: 750;
    }

    @media (max-width: 760px) {
      .parse-meta {
        grid-template-columns: minmax(0, 1fr);
      }
    }

    .parse-alert {
      display: inline-flex;
      align-items: center;
      justify-self: start;
      max-width: min(760px, 100%);
      min-height: 32px;
      border-radius: 999px;
      background: var(--blue-soft);
      color: #294da8;
      padding: 7px 12px;
      font-weight: 850;
      line-height: 1.45;
      overflow-wrap: anywhere;
      text-align: left;
    }

    .parse-alert.green {
      background: var(--green-soft);
      color: #247344;
    }

    .parse-alert.amber {
      background: var(--amber-soft);
      color: #8a5d00;
    }

    .parse-alert.red {
      background: rgba(209, 74, 63, .12);
      color: #a34038;
    }

    .parse-workbench {
      display: grid;
      grid-template-columns: 300px minmax(0, 1fr);
      gap: 12px;
      align-items: start;
    }

    .parse-workbench.manual-mode {
      grid-template-columns: minmax(0, 1fr);
    }

    .parse-workbench.manual-mode .parse-side {
      display: none;
    }

    .parse-side,
    .parse-main-card {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--panel);
      box-shadow: var(--shadow);
    }

    .parse-side {
      position: sticky;
      top: 14px;
      padding: 10px;
      display: grid;
      gap: 10px;
    }

    .parse-side-section {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 9px;
      display: grid;
      gap: 8px;
    }

    .parse-side-section.is-hidden {
      display: none !important;
    }

    .parse-side-section h3 {
      margin: 0;
      font-size: 14px;
      letter-spacing: 0;
    }

    .parse-side-field {
      display: grid;
      gap: 5px;
    }

    .parse-side-field label {
      color: var(--muted);
      font-size: 12px;
      font-weight: 900;
    }

    .parse-side-field input {
      width: 100%;
      min-height: 36px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: var(--ink);
      padding: 0 10px;
      font-weight: 850;
      outline: none;
    }

    .parse-side-field input:focus {
      border-color: rgba(65, 105, 225, .62);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .12);
    }

    .parse-side-field input::placeholder {
      color: #aeb6c5;
      font-weight: 750;
    }

    .parse-stat-list {
      display: grid;
      gap: 6px;
    }

    .parse-stat {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      border-radius: 7px;
      background: #f8f9fc;
      padding: 8px 10px;
      color: #4b5568;
      font-size: 13px;
      font-weight: 850;
    }

    .parse-stat.warning {
      background: var(--amber-soft);
      color: #8a651f;
    }

    .parse-upload {
      min-height: 132px;
      border: 1px dashed #cfc8ba;
      border-radius: 7px;
      background: #fbfaf7;
      color: var(--muted);
      padding: 10px;
      display: grid;
      gap: 8px;
      align-content: center;
      text-align: center;
      cursor: pointer;
      caret-color: transparent;
      outline: none;
      font-size: 13px;
      font-weight: 850;
      line-height: 1.6;
    }

    .parse-upload:hover,
    .parse-upload:focus-within,
    .parse-upload.drag-over {
      border-color: rgba(65, 105, 225, .62);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .12);
    }

    .parse-upload.drag-over {
      background: #eef4ff;
      color: #2d4f9e;
    }

    .parse-thumb-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .parse-images-loading {
      grid-column: 1 / -1;
      min-height: 112px;
      display: grid;
      place-items: center;
      align-content: center;
      gap: 7px;
      border: 1px solid #d9e2f5;
      border-radius: 7px;
      background: #f5f8ff;
      color: #405170;
      text-align: center;
    }

    .parse-images-loading small {
      color: var(--muted);
      font-weight: 700;
    }

    .parse-images-loading-spinner {
      width: 24px;
      height: 24px;
      border: 3px solid #d7e0f3;
      border-top-color: var(--primary);
      border-radius: 50%;
      animation: parse-image-loading-spin .8s linear infinite;
    }

    @keyframes parse-image-loading-spin {
      to { transform: rotate(360deg); }
    }

    .parse-thumb {
      position: relative;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 22px 6px 6px;
      display: grid;
      gap: 5px;
      min-height: 112px;
    }

    .parse-thumb img {
      width: 100%;
      height: 78px;
      object-fit: contain;
      border-radius: 5px;
      background: #f7f7f7;
      cursor: zoom-in;
    }

    .parse-thumb span {
      position: absolute;
      top: 5px;
      left: 6px;
      font-size: 11px;
      color: var(--muted);
      font-weight: 900;
    }

    .parse-thumb-remove {
      position: absolute;
      top: 4px;
      right: 5px;
      width: 22px;
      height: 22px;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: #fff;
      color: #8b2d2d;
      cursor: pointer;
      font-size: 14px;
      line-height: 1;
      font-weight: 900;
    }

    .parse-thumb-remove:hover {
      border-color: #c94b4b;
      background: #fff1f1;
    }

    .parse-upload-actions {
      display: grid;
      grid-template-columns: minmax(170px, 1fr) minmax(86px, .55fr);
      gap: 8px;
    }

    .parse-upload-actions .btn {
      width: 100%;
      justify-content: center;
    }

    #parseChooseImageBtn {
      grid-column: 1;
      grid-row: 1;
    }

    #parseSaveBtn {
      grid-column: 1;
      grid-row: 2;
    }

    #parseClearImagesBtn {
      grid-column: 2;
      grid-row: 1;
    }

    #parseAnalyzeBtn {
      grid-column: 2;
      grid-row: 2;
    }

    .parse-question-list {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      min-width: 0;
    }

    .parse-q-chip {
      border: 1px solid var(--line);
      border-radius: 999px;
      background: #fff;
      color: #4b5568;
      min-height: 30px;
      padding: 0 10px;
      cursor: pointer;
      font-size: 12px;
      font-weight: 900;
    }

    .parse-q-chip.active {
      background: var(--blue);
      color: #fff;
      border-color: var(--blue);
    }

    .parse-q-chip.success {
      background: #ecfdf3;
      color: #217347;
      border-color: rgba(59, 140, 92, .35);
    }

    .parse-q-chip.warning {
      background: #fff7df;
      color: #9a6a12;
      border-color: rgba(209, 151, 45, .45);
    }

    .parse-q-chip:disabled {
      cursor: not-allowed;
      opacity: .6;
    }

    .parse-q-remove {
      border-color: rgba(201, 75, 75, .35);
      color: #a34038;
      padding: 0 9px;
    }

    .parse-q-remove:hover {
      background: #fff1f1;
      border-color: #c94b4b;
    }

    .parse-main-card {
      padding: 12px;
      display: grid;
      gap: 10px;
    }

    .parse-question-head {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      align-items: center;
      border-bottom: 1px solid var(--line);
      padding-bottom: 9px;
    }

    .parse-question-title-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      min-width: 0;
    }

    .parse-symbol-slot {
      position: relative;
    }

    .parse-symbol-slot .math-symbol-trigger {
      font-weight: 500;
    }

    .parse-symbol-slot .math-symbol-popover {
      right: 0;
      left: auto;
      width: min(440px, calc(100vw - 48px));
    }

    .parse-question-head strong {
      font-size: 18px;
    }

    .parse-badge {
      border-radius: 999px;
      background: var(--amber-soft);
      color: #8a651f;
      padding: 6px 10px;
      font-size: 12px;
      font-weight: 900;
    }

    .manual-meta-panel {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
      gap: 10px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fbfaf7;
      padding: 10px;
    }

    .manual-meta-panel.is-hidden {
      display: none;
    }

    .manual-meta-field {
      display: grid;
      gap: 5px;
      min-width: 0;
    }

    .manual-meta-field.is-hidden {
      display: none;
    }

    .manual-meta-field label {
      color: var(--muted);
      font-size: 12px;
      font-weight: 900;
    }

    .manual-meta-field select,
    .manual-meta-field input,
    .manual-meta-field textarea {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: var(--ink);
      min-height: 36px;
      padding: 0 10px;
      font-weight: 800;
      outline: none;
    }

    .manual-meta-field select:focus,
    .manual-meta-field input:focus,
    .manual-meta-field textarea:focus {
      border-color: rgba(65, 105, 225, .62);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .12);
    }

    .manual-meta-field textarea {
      min-height: 132px;
      padding: 10px;
      line-height: 1.65;
      resize: vertical;
      font-weight: 650;
    }

    .english-material-assignment-field,
    .english-material-field {
      grid-column: 1 / -1;
    }

    .chinese-section-field {
      grid-column: span 2;
    }

    #parseChineseSectionInstructionField {
      grid-column: 1 / -1;
    }

    #parseChineseSectionInstructionInput {
      min-height: 76px;
    }

    .manual-meta-help {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.5;
    }

    .english-question-material {
      display: grid;
      gap: 8px;
      padding: 14px 16px;
      border: 1px solid #d8e1f4;
      border-radius: 8px;
      background: #f8faff;
      color: var(--ink);
      font-family: "Times New Roman", "Noto Serif SC", serif;
      line-height: 1.75;
    }

    .english-question-material-title {
      font-size: 1.05em;
    }

    .english-question-material-instruction {
      color: var(--muted);
      font-weight: 750;
      white-space: pre-wrap;
    }

    .english-question-material-text {
      font-weight: 600;
      white-space: pre-wrap;
      overflow-wrap: anywhere;
    }

    .single-question-material-field {
      grid-column: 1 / -1;
    }

    .single-question-material-field.is-hidden {
      display: none;
    }

    .single-question-material-field textarea {
      min-height: 150px;
      resize: vertical;
      font-family: "Times New Roman", "Noto Serif SC", serif;
      line-height: 1.65;
    }

    .parse-editor-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: 10px;
      align-items: stretch;
      grid-auto-rows: minmax(0, auto);
    }

    .parse-editor-panel {
      display: grid;
      grid-template-rows: 32px minmax(0, 1fr);
      gap: 8px;
      min-width: 0;
      min-height: 0;
    }

    .parse-editor-panel h3 {
      margin: 0;
      font-size: 14px;
      letter-spacing: 0;
      min-height: 32px;
      display: flex;
      align-items: center;
    }

    .parse-editor-head {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
    }

    .parse-editor-head h3 {
      margin: 0;
    }

    .parse-editor-head .btn {
      min-height: 30px;
      padding: 0 11px;
      font-size: 12px;
    }

    .parse-textarea {
      width: 100%;
      min-height: 0;
      height: 360px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: #25304a;
      padding: 12px;
      line-height: 1.6;
      resize: none;
      overflow: auto;
      outline: none;
      font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-size: 13px;
    }

    .parse-textarea[readonly] {
      background: #f8f9fc;
      color: #697386;
      cursor: default;
    }

    .parse-textarea.solution {
      height: 220px;
    }

    .parse-preview {
      min-height: 0;
      height: 360px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 16px;
      line-height: 1.8;
      color: #27324a;
      overflow: auto;
    }

    .parse-preview.solution {
      height: 220px;
    }

    .parse-preview h4,
    .parse-preview h5 {
      margin: 0 0 10px;
      color: #16213b;
      line-height: 1.45;
    }

    .parse-preview h4 {
      font-size: 20px;
    }

    .parse-preview h5 {
      font-size: 17px;
    }

    .parse-preview .markdown-table-wrap {
      overflow-x: auto;
      margin: 12px 0;
      border: 1px solid #e2dcd2;
      border-radius: 7px;
      background: #fff;
    }

    .parse-preview table.markdown-table {
      width: 100%;
      border-collapse: collapse;
      min-width: 520px;
      font-size: 15px;
      line-height: 1.65;
    }

    .parse-preview table.markdown-table th,
    .parse-preview table.markdown-table td {
      border: 1px solid #e2dcd2;
      padding: 10px 12px;
      vertical-align: top;
      text-align: left;
    }

    .parse-preview table.markdown-table th {
      background: #f7f3ea;
      color: #16213b;
      font-weight: 800;
    }

    /* 原生 Word 题目可能包含长材料、实验步骤和多列表格，预览区完整展开。 */
    .parse-preview.native-word-preview {
      height: auto;
      min-height: 360px;
      overflow: visible;
    }

    .parse-textarea.native-word-content {
      min-height: 360px;
      overflow-y: hidden;
      resize: vertical;
    }

    .parse-preview.native-word-preview .markdown-table-wrap {
      max-width: 100%;
      overflow-x: visible;
    }

    .parse-preview.native-word-preview table.markdown-table {
      width: 100%;
      min-width: 0;
      table-layout: fixed;
      font-size: 13px;
      line-height: 1.55;
    }

    .parse-preview.native-word-preview table.markdown-table th,
    .parse-preview.native-word-preview table.markdown-table td {
      padding: 8px 6px;
      white-space: normal;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .parse-preview.native-word-preview table.markdown-table th:first-child,
    .parse-preview.native-word-preview table.markdown-table td:first-child {
      width: 52px;
      text-align: center;
    }

    .parse-editor-panel:nth-child(1),
    .parse-editor-panel:nth-child(2) {
      min-height: 400px;
    }

    .parse-editor-panel:nth-child(3),
    .parse-editor-panel:nth-child(4) {
      min-height: 260px;
    }

    .manual-crop-modal {
      position: fixed;
      inset: 0;
      z-index: 90;
      background: rgba(20, 28, 44, .72);
      display: none;
      align-items: center;
      justify-content: center;
      padding: 24px;
    }

    .manual-crop-modal.show {
      display: flex;
    }

    .manual-crop-panel {
      width: min(1120px, 96vw);
      max-height: 92vh;
      background: #fff;
      border-radius: 8px;
      box-shadow: 0 24px 70px rgba(14, 21, 37, .28);
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      overflow: hidden;
    }

    .question-vision-mode-panel {
      width: min(520px, calc(100vw - 32px));
      padding: 24px;
      border-radius: 20px;
      background: #fff;
      box-shadow: 0 24px 70px rgba(35, 52, 95, 0.24);
    }

    .parse-choice-edit-panel {
      width: min(620px, calc(100vw - 32px));
      padding: 24px;
      border-radius: 20px;
      background: #fff;
      box-shadow: 0 24px 70px rgba(35, 52, 95, .24);
    }

    .parse-choice-edit-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 18px;
    }

    .parse-choice-edit-head strong {
      color: var(--ink);
      font-size: 20px;
    }

    .parse-choice-edit-close {
      width: 34px;
      height: 34px;
      border: 0;
      border-radius: 50%;
      background: #f2f5fb;
      color: var(--muted);
      cursor: pointer;
      font-size: 22px;
      line-height: 1;
    }

    .parse-choice-edit-actions {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
    }

    .parse-choice-edit-actions .btn {
      min-height: 42px;
      padding: 9px 12px;
    }

    .parse-choice-text-editor {
      display: grid;
      gap: 9px;
      margin-top: 18px;
      padding-top: 18px;
      border-top: 1px solid #e4eaf5;
    }

    .parse-choice-text-editor[hidden] {
      display: none;
    }

    .parse-choice-text-editor label {
      color: #46536d;
      font-size: 13px;
      font-weight: 850;
    }

    .parse-choice-text-editor textarea {
      width: 100%;
      min-height: 112px;
      padding: 12px 13px;
      border: 1px solid #dfe6f2;
      border-radius: 11px;
      resize: vertical;
      color: var(--ink);
      font-family: "Times New Roman", "Songti SC", serif;
      line-height: 1.65;
    }

    .parse-choice-text-editor > span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.55;
    }

    .parse-choice-text-actions {
      display: flex;
      justify-content: flex-end;
      gap: 9px;
    }

    .parse-choice-preview-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px 12px;
      margin-top: 14px;
    }

    .parse-choice-preview-item {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 9px;
      align-items: center;
      min-width: 0;
      min-height: 48px;
      padding: 10px 12px;
      border: 1px solid #dfe6f2;
      border-radius: 11px;
      background: #fbfcff;
      color: var(--ink);
      cursor: pointer;
      text-align: left;
    }

    button.parse-choice-preview-item:hover,
    button.parse-choice-preview-item:focus-visible {
      border-color: rgba(76, 111, 255, .55);
      background: #f2f5ff;
      outline: none;
      box-shadow: 0 6px 16px rgba(76, 111, 255, .1);
    }

    .parse-choice-preview-item.is-static {
      cursor: default;
    }

    .parse-choice-preview-item.is-choice-image-pick-mode {
      border-color: #ef9b3d;
      background: #fffaf2;
      box-shadow: 0 0 0 3px rgba(239, 155, 61, .12);
    }

    .parse-choice-preview-item.is-choice-image-pick-mode [data-latex-image-wrapper].is-choice-image-pick-target {
      outline: 2px dashed #ef8a24;
      outline-offset: 3px;
      cursor: pointer;
      transition: outline-color .15s ease, filter .15s ease, transform .15s ease;
    }

    .parse-choice-preview-item.is-choice-image-pick-mode [data-latex-image-wrapper].is-choice-image-pick-target:hover {
      outline-color: #d9680d;
      filter: drop-shadow(0 3px 6px rgba(217, 104, 13, .2));
      transform: translateY(-1px);
    }

    .parse-choice-preview-label {
      display: inline-flex;
      width: 30px;
      height: 30px;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      background: linear-gradient(135deg, #607dce, #4f64a8);
      color: #fff;
      font-weight: 900;
    }

    .parse-choice-preview-content {
      min-width: 0;
      line-height: 1.6;
    }

    .parse-choice-preview-content:empty::after {
      content: "空选项";
      color: #a1aabd;
      font-size: 13px;
    }

    .question-vision-mode-head {
      margin-bottom: 18px;
      color: var(--ink);
      font-size: 20px;
    }

    .question-vision-mode-options {
      display: grid;
      gap: 12px;
    }

    .question-vision-mode-option {
      display: flex;
      gap: 12px;
      align-items: flex-start;
      padding: 16px;
      border: 1px solid #dfe6f5;
      border-radius: 14px;
      cursor: pointer;
    }

    .question-vision-mode-option:has(input:checked) {
      border-color: var(--primary);
      background: #f3f6ff;
    }

    .question-vision-mode-option input {
      margin-top: 4px;
    }

    .question-vision-mode-option span {
      display: grid;
      gap: 4px;
    }

    .question-vision-mode-option small {
      color: var(--muted);
    }

    .question-vision-mode-actions {
      display: flex;
      justify-content: flex-end;
      gap: 10px;
      margin-top: 22px;
    }

    .paper-export-format-panel {
      position: relative;
      width: min(560px, calc(100vw - 32px));
      padding: 28px;
      border-radius: 22px;
      background: #fff;
      box-shadow: 0 24px 70px rgba(35, 52, 95, 0.24);
    }

    .paper-export-format-close {
      position: absolute;
      top: 16px;
      right: 16px;
      width: 34px;
      height: 34px;
      border: 0;
      border-radius: 50%;
      background: #f2f5fb;
      color: var(--muted);
      cursor: pointer;
      font-size: 22px;
      line-height: 1;
    }

    .paper-export-format-close:hover {
      background: #e8edf8;
      color: var(--ink);
    }

    .paper-export-format-head {
      display: grid;
      gap: 6px;
      padding-right: 44px;
      margin-bottom: 20px;
    }

    .paper-export-format-head strong {
      color: var(--ink);
      font-size: 22px;
    }

    .paper-export-format-head span {
      color: var(--muted);
      font-size: 14px;
    }

    .paper-export-format-options {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

    .paper-export-format-option {
      display: flex;
      align-items: center;
      gap: 14px;
      min-height: 112px;
      padding: 18px;
      border: 1px solid #dfe6f5;
      border-radius: 16px;
      background: #fff;
      color: var(--ink);
      cursor: pointer;
      text-align: left;
      transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
    }

    .paper-export-format-option:hover,
    .paper-export-format-option:focus-visible {
      transform: translateY(-2px);
      border-color: var(--primary);
      box-shadow: 0 10px 24px rgba(75, 103, 230, 0.13);
      outline: none;
    }

    .paper-export-format-option > span:last-child {
      display: grid;
      gap: 5px;
    }

    .paper-export-format-option strong {
      font-size: 16px;
    }

    .paper-export-format-option small {
      color: var(--muted);
      line-height: 1.45;
    }

    .paper-export-format-icon {
      display: inline-flex;
      flex: 0 0 48px;
      width: 48px;
      height: 48px;
      align-items: center;
      justify-content: center;
      border-radius: 13px;
      color: #fff;
      font-size: 15px;
      font-weight: 900;
      letter-spacing: -.02em;
    }

    .paper-export-format-option.pdf .paper-export-format-icon {
      background: linear-gradient(135deg, #f06767, #d94a55);
    }

    .paper-export-format-option.word .paper-export-format-icon {
      background: linear-gradient(135deg, #4f80e8, #3159bd);
      font-size: 22px;
    }

    @media (max-width: 560px) {
      .paper-export-format-panel {
        padding: 24px 20px;
      }

      .paper-export-format-options {
        grid-template-columns: 1fr;
      }

      .paper-export-format-option {
        min-height: 92px;
      }
    }

    .manual-crop-head,
    .manual-crop-actions {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      align-items: center;
      padding: 12px 14px;
      border-bottom: 1px solid var(--line);
    }

    .manual-crop-actions {
      border-top: 1px solid var(--line);
      border-bottom: 0;
    }

    .manual-crop-head strong {
      font-size: 16px;
    }

    .manual-crop-tools {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
      justify-content: flex-end;
    }

    .manual-crop-zoom {
      display: inline-flex;
      gap: 6px;
      align-items: center;
      padding: 4px;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: #fbfaf7;
    }

    .manual-crop-page {
      display: inline-flex;
      gap: 8px;
      align-items: center;
      color: var(--muted);
      font-size: 13px;
      font-weight: 900;
    }

    .manual-crop-page select {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      padding: 7px 9px;
      font: inherit;
      color: var(--ink);
    }

    .manual-crop-stage {
      position: relative;
      overflow: auto;
      background: #f7f7f4;
      padding: 14px;
      cursor: crosshair;
      user-select: none;
    }

    .manual-crop-image-wrap {
      position: relative;
      width: fit-content;
      margin: 0 auto;
      line-height: 0;
    }

    .manual-crop-image-wrap img {
      max-width: min(1000px, 88vw);
      max-height: 70vh;
      width: auto;
      height: auto;
      background: #fff;
      box-shadow: 0 0 0 1px var(--line);
      pointer-events: none;
    }

    .manual-crop-selection {
      position: absolute;
      border: 2px solid var(--blue);
      background: rgba(65, 105, 225, .16);
      box-shadow: 0 0 0 9999px rgba(20, 28, 44, .18);
      display: none;
      pointer-events: none;
    }

    .manual-crop-selection.show {
      display: block;
    }

    .latex-choice-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px 24px;
      margin: 12px 0;
    }

    .latex-choice {
      display: flex;
      gap: 8px;
      align-items: baseline;
      font-weight: 850;
    }

    .latex-choice b {
      color: var(--blue);
    }

    .latex-image {
      display: grid;
      place-items: center;
      position: relative;
      margin: 14px auto 4px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fbfaf7;
      padding: 10px;
      max-width: 520px;
    }

    .latex-image.is-user-sized {
      width: var(--latex-block-image-width);
      max-width: 100%;
    }

    .latex-image.is-user-sized img {
      height: auto;
      max-height: none;
    }

    .latex-image img {
      width: 100%;
      max-height: 260px;
      object-fit: contain;
      cursor: zoom-in;
    }

    .latex-inline-image {
      display: inline-flex;
      align-items: center;
      position: relative;
      max-width: 100%;
      margin: 0 .08em;
      vertical-align: -.12em;
      line-height: 1;
    }

    .latex-inline-image img {
      display: inline-block;
      width: auto;
      height: var(--latex-inline-image-height, 1.2em);
      max-width: min(100%, 420px);
      max-height: var(--latex-inline-image-height, 1.2em);
      object-fit: contain;
      vertical-align: baseline;
    }

    .parse-preview [data-latex-image-wrapper] [data-parse-rendered-image] {
      cursor: pointer;
    }

    .parse-preview [data-latex-image-wrapper].is-resize-selected {
      outline: 2px solid #4b70ed;
      outline-offset: 3px;
    }

    .parse-preview [data-latex-image-wrapper].is-resizing {
      user-select: none;
    }

    .parse-image-resize-handle {
      position: absolute;
      z-index: 3;
      width: 12px;
      height: 12px;
      border: 2px solid #fff;
      border-radius: 3px;
      background: #4267df;
      box-shadow: 0 1px 5px rgba(38, 62, 135, .35);
      touch-action: none;
    }

    .latex-inline-image .parse-image-resize-handle {
      width: 8px;
      height: 8px;
      border-width: 1px;
    }

    .parse-image-resize-handle.nw {
      top: 0;
      left: 0;
      cursor: nwse-resize;
      transform: translate(-50%, -50%);
    }

    .parse-image-resize-handle.ne {
      top: 0;
      right: 0;
      cursor: nesw-resize;
      transform: translate(50%, -50%);
    }

    .parse-image-resize-handle.sw {
      bottom: 0;
      left: 0;
      cursor: nesw-resize;
      transform: translate(-50%, 50%);
    }

    .parse-image-resize-handle.se {
      right: 0;
      bottom: 0;
      cursor: nwse-resize;
      transform: translate(50%, 50%);
    }

    math msqrt > *,
    math mroot > *:first-child {
      padding-top: .16em;
    }

    .math-frac {
      display: inline-grid;
      grid-template-rows: auto auto;
      vertical-align: middle;
      text-align: center;
      line-height: 1.05;
      margin: 0 2px;
    }

    .math-frac > span:first-child {
      border-bottom: 1px solid currentColor;
      padding: 0 3px 1px;
    }

    .math-frac > span:last-child {
      padding: 1px 3px 0;
    }

    .math-sqrt {
      display: inline-flex;
      align-items: flex-end;
      vertical-align: -0.12em;
      margin: 0 2px;
      line-height: 1;
      font-family: Georgia, "Times New Roman", serif;
      font-style: normal;
    }

    .math-sqrt-symbol {
      font-size: 1.28em;
      line-height: .86;
      transform: translateY(.05em);
    }

    .math-root-index {
      align-self: flex-start;
      font-size: .58em;
      line-height: 1;
      margin-right: -.18em;
      transform: translate(.12em, -.24em);
    }

    .math-sqrt-radicand {
      display: inline-block;
      border-top: 2px solid currentColor;
      padding: .08em .08em 0 .12em;
      min-width: .62em;
      line-height: 1.05;
      transform: translateX(-.02em);
    }

    .math-cases {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      vertical-align: middle;
      margin: 0 4px;
      font-family: Georgia, "Times New Roman", serif;
    }

    .math-cases-brace {
      font-size: 2.35em;
      line-height: .9;
      font-style: normal;
    }

    .math-cases-lines {
      display: inline-grid;
      gap: 2px;
      line-height: 1.18;
    }

    .math-inline {
      font-family: Georgia, "Times New Roman", serif;
      font-style: italic;
      white-space: nowrap;
    }

    .math-blank {
      display: inline-block;
      min-width: 5.5em;
      border-bottom: 2px solid currentColor;
      transform: translateY(-.08em);
    }

    .math-underline {
      display: inline-block;
      border-bottom: 1.6px solid currentColor;
      line-height: 1.05;
      padding: 0 .08em;
    }

    .math-overline {
      display: inline-block;
      border-top: 1.6px solid currentColor;
      line-height: 1.05;
      padding: .03em .08em 0;
    }

    .math-vector {
      display: inline-block;
      line-height: 1.05;
    }

    .math-vector::after {
      content: "\20D7";
      margin-left: -.2em;
    }

    .math-hat {
      display: inline-block;
      position: relative;
      padding-top: .12em;
    }

    .math-hat::before {
      content: "^";
      position: absolute;
      left: 50%;
      top: -.42em;
      transform: translateX(-50%);
      font-size: .85em;
      line-height: 1;
    }

    .failure-details {
      display: none;
      margin-top: 10px;
      border: 1px solid #f1c7c7;
      border-radius: 7px;
      background: #fff8f8;
      color: #713131;
      overflow: hidden;
    }

    .failure-details.show {
      display: block;
    }

    .failure-details summary {
      cursor: pointer;
      padding: 10px 12px;
      font-weight: 900;
      color: #8a2f2f;
      list-style-position: inside;
    }

    .failure-detail-body {
      display: grid;
      gap: 8px;
      padding: 0 12px 12px;
      font-size: 13px;
      line-height: 1.65;
    }

    .failure-detail-row {
      display: grid;
      grid-template-columns: 76px 1fr;
      gap: 10px;
    }

    .failure-detail-label {
      color: #9a5a5a;
      font-weight: 850;
    }

    .failure-detail-value {
      color: #582727;
      word-break: break-word;
      white-space: pre-wrap;
    }

    .problem-input-frame {
      border: 1px solid var(--line);
      border-radius: 6px;
      background: #fff;
      overflow: hidden;
    }

    .problem-input-frame:focus-within {
      border-color: rgba(65, 105, 225, .62);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .12);
    }

    .problem-input-frame.previewing textarea,
    .problem-input-frame.previewing .image-attachment {
      display: none;
    }

    .solve-question-preview {
      min-height: 122px;
      max-height: 380px;
      overflow: auto;
      padding: 14px 16px;
      color: #27324a;
      line-height: 1.8;
      background: #fff;
    }

    .solve-question-preview[hidden] {
      display: none;
    }

    .solve-question-preview p {
      margin: 0 0 10px;
    }

    .solve-question-preview p:last-child {
      margin-bottom: 0;
    }

    textarea {
      width: 100%;
      min-height: 122px;
      resize: vertical;
      border: 0;
      border-radius: 0;
      color: var(--ink);
      background: transparent;
      line-height: 1.65;
      padding: 11px 12px;
      outline: none;
      display: block;
    }

    textarea:focus {
      box-shadow: none;
    }

    .actions {
      display: flex;
      gap: 8px;
      align-items: center;
      flex-wrap: wrap;
      margin-top: 10px;
    }

    .upload-box {
      margin-top: 10px;
      border: 1px dashed #cfc8ba;
      border-radius: 7px;
      background: #fbfaf7;
      padding: 10px;
      display: grid;
      gap: 9px;
    }

    .upload-row {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }

    .upload-status {
      display: inline-flex;
      align-items: center;
      max-width: min(520px, 100%);
      min-height: 32px;
      border-radius: 999px;
      background: var(--blue-soft);
      color: #294da8;
      font-size: 13px;
      font-weight: 800;
      line-height: 1.45;
      padding: 7px 12px;
      overflow-wrap: anywhere;
      text-align: left;
    }

    .upload-status.green {
      background: var(--green-soft);
      color: #247344;
    }

    .upload-status.amber {
      background: var(--amber-soft);
      color: #8a5d00;
    }

    .upload-status.red {
      background: rgba(209, 74, 63, .12);
      color: #a34038;
    }

    .paste-hint {
      color: #526071;
      font-size: 13px;
      line-height: 1.5;
    }

    .image-attachment {
      position: relative;
      display: none;
      margin: 0 12px 12px;
      width: min(100%, 520px);
      border: 1px solid #d7d1c7;
      border-radius: 6px;
      background: #fbfaf7;
      padding: 8px;
    }

    .image-attachment.show {
      display: block;
    }

    .image-preview {
      max-height: 126px;
      max-width: 100%;
      border-radius: 6px;
      object-fit: contain;
      background: #fff;
      display: block;
      cursor: zoom-in;
    }

    .remove-image {
      position: absolute;
      top: 6px;
      right: 6px;
      width: 30px;
      height: 30px;
      border-radius: 50%;
      border: 1px solid rgba(23, 33, 59, .15);
      background: rgba(255, 255, 255, .94);
      color: var(--ink);
      cursor: pointer;
      display: grid;
      place-items: center;
      font-weight: 900;
      box-shadow: 0 4px 12px rgba(23, 33, 59, .12);
    }

    .student-controls {
      display: flex;
      justify-content: flex-start;
      gap: 12px;
      align-items: center;
      flex-wrap: wrap;
    }

    .segmented {
      display: inline-flex;
      gap: 4px;
      padding: 4px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #f8f7f3;
    }

    .segmented button {
      border: 0;
      border-radius: 5px;
      background: transparent;
      color: #596274;
      height: 30px;
      padding: 0 11px;
      cursor: pointer;
      font-weight: 800;
    }

    .segmented button.active {
      background: #fff;
      color: var(--blue);
      box-shadow: 0 1px 6px rgba(36, 31, 24, .08);
    }

    .btn {
      border: 1px solid var(--line);
      border-radius: 6px;
      background: #fff;
      color: var(--ink);
      height: 38px;
      padding: 0 13px;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      white-space: nowrap;
      transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease;
      will-change: transform;
    }

    .btn:hover:not(:disabled) {
      transform: translateY(-2px) scale(1.015);
      box-shadow: 0 7px 16px rgba(20, 30, 56, .12);
      border-color: rgba(65, 105, 225, .42);
    }

    .btn:disabled {
      opacity: .52;
      cursor: not-allowed;
      transform: none;
      box-shadow: none;
    }

    .btn.primary {
      border-color: #244fc5;
      background: var(--blue);
      color: #fff;
      font-weight: 700;
    }

    .btn.icon {
      width: 38px;
      padding: 0;
      justify-content: center;
      font-size: 18px;
    }

    .btn:active {
      transform: translateY(1px);
      box-shadow: 0 2px 8px rgba(20, 30, 56, .10);
    }

    @media (prefers-reduced-motion: reduce) {
      .btn {
        transition: none;
      }

      .btn:hover,
      .btn:active {
        transform: none;
      }
    }

    .insight-strip {
      display: grid;
      grid-template-columns: 1fr;
      gap: 10px;
      margin-bottom: 0;
    }

    .flow-keypoint {
      display: grid;
      gap: 10px;
    }

    .flow-keypoint:empty {
      display: none;
    }

    .lesson-column .insight-strip {
      border-top: 1px solid var(--line);
      padding-top: 14px;
    }

    .insight-card {
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: 14px 16px;
      min-width: 0;
    }

    .insight-card .mini-label {
      margin-bottom: 8px;
    }

    .parameter-card {
      display: grid;
      gap: 8px;
    }

    .voice-panel {
      display: grid;
      gap: 5px;
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: 7px 10px;
    }

    .voice-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
      color: #39435a;
      font-weight: 800;
      font-size: 13px;
    }

    .voice-status {
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
      text-align: right;
    }

    .voice-controls {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
      align-items: center;
    }

    .voice-controls .btn {
      height: 26px;
      padding: 0 9px;
      font-size: 12px;
    }

    .rate-control {
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 7px;
      align-items: center;
      color: var(--muted);
      font-size: 11px;
      font-weight: 800;
    }

    .rate-control input[type="range"] {
      height: 14px;
    }

    .workspace {
      display: grid;
      grid-template-columns: var(--layout-columns);
      gap: var(--layout-gap);
      align-items: start;
    }

    .column-resizer {
      position: absolute;
      top: 0;
      bottom: 0;
      left: calc(var(--left-pane) + (var(--layout-gap) / 2));
      width: 16px;
      transform: translateX(-50%);
      border: 0;
      padding: 0;
      background: transparent;
      cursor: col-resize;
      z-index: 3;
      touch-action: none;
      user-select: none;
    }

    .column-resizer::before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 7px;
      width: 2px;
      border-radius: 999px;
      background: rgba(119, 128, 146, .28);
      transition: background .16s ease, width .16s ease, left .16s ease;
    }

    .column-resizer:hover::before,
    body.resizing-layout .column-resizer::before {
      left: 6px;
      width: 4px;
      background: rgba(65, 105, 225, .72);
    }

    .stage {
      min-width: 0;
      position: sticky;
      top: 16px;
      align-self: start;
      max-height: calc(100vh - 24px);
    }

    .lesson-column .stage {
      position: sticky;
      top: 16px;
      max-height: none;
    }

    .section-head {
      display: flex;
      justify-content: space-between;
      gap: 14px;
      align-items: center;
      margin-bottom: 10px;
    }

    .section-head h2 {
      margin: 0;
      font-family: Georgia, "Times New Roman", "Songti SC", serif;
      font-size: 23px;
      letter-spacing: 0;
    }

    .chart-shell {
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      overflow: hidden;
      position: relative;
    }

    .visual-fallback {
      display: none;
      min-height: 360px;
      padding: 18px;
      align-content: start;
      gap: 14px;
      background: #fff;
    }

    .visual-fallback.show {
      display: grid;
    }

    .visual-fallback img {
      max-width: 100%;
      max-height: 280px;
      object-fit: contain;
      border: 1px solid var(--line);
      border-radius: 6px;
      background: #fff;
      cursor: zoom-in;
    }

    .visual-note {
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fbfaf7;
      padding: 14px 16px;
      color: #33405a;
      line-height: 1.75;
      font-weight: 700;
      white-space: pre-wrap;
    }

    .chart-shell.text-mode canvas,
    .chart-shell.text-mode .chart-tools {
      display: none;
    }

    canvas {
      width: 100%;
      height: clamp(360px, calc(100vh - 98px), 640px);
      min-height: 360px;
      display: block;
      background: #fff;
    }

    .lesson-column canvas {
      height: clamp(320px, 42vh, 460px);
      min-height: 320px;
    }

    .lesson-column .visual-fallback {
      min-height: 320px;
    }

    .chart-tools {
      position: absolute;
      right: 18px;
      bottom: 18px;
      display: flex;
      gap: 4px;
      padding: 4px;
      border-radius: 6px;
      background: rgba(255, 255, 255, .82);
      border: 1px solid rgba(229, 225, 216, .92);
      backdrop-filter: blur(8px);
    }

    .legend {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      align-items: center;
      justify-content: flex-end;
      padding: 0;
      color: #364158;
      font-weight: 700;
      font-size: 13px;
    }

    .legend span {
      display: inline-flex;
      gap: 6px;
      align-items: center;
      white-space: nowrap;
    }

    .swatch {
      width: 24px;
      height: 4px;
      border-radius: 999px;
      display: inline-block;
    }

    .primary-column,
    .lesson-column {
      display: grid;
      gap: 14px;
      align-content: start;
    }

    .lesson-column {
      gap: 10px;
    }

    #page-solve .lesson-column > .composer-tools,
    #page-solve #problemPanel {
      display: none;
    }

    .panel {
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: 22px;
    }

    .panel h2 {
      margin: 0 0 15px;
      padding-bottom: 13px;
      border-bottom: 1px solid var(--line);
      font-family: Georgia, "Times New Roman", "Songti SC", serif;
      font-size: 24px;
      letter-spacing: 0;
    }

    .flow-panel {
      align-self: start;
      min-height: 360px;
    }

    .flow-panel .steps {
      gap: 14px;
    }

    .flow-panel {
      max-height: clamp(520px, calc(100vh - 24px), 760px);
      overflow: auto;
    }

    .flow-locked {
      border: 1px dashed #cfc8ba;
      border-radius: 7px;
      background: #fbfaf7;
      padding: 16px;
      color: var(--muted);
      line-height: 1.7;
      font-weight: 800;
    }

    .field-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      align-items: center;
      color: var(--muted);
      font-weight: 700;
    }

    input[type="range"] {
      width: 100%;
      accent-color: var(--blue);
    }

    .value-readout {
      color: var(--blue);
      font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-size: 22px;
      font-weight: 800;
      min-width: 68px;
      text-align: right;
    }

    .mini-card {
      margin-top: 0;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: linear-gradient(180deg, #fff, #fbfcff);
      padding: 14px 16px;
    }

    .mini-label {
      color: var(--muted);
      font-weight: 700;
      margin-bottom: 7px;
    }

    .result {
      color: #54a16e;
      font-size: 24px;
      font-weight: 800;
    }

    .answer-toggle {
      margin-top: 12px;
    }

    .mono {
      font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-weight: 800;
      line-height: 1.55;
    }

    .problem-text {
      line-height: 1.75;
      font-size: 16px;
    }

    .tags {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-top: 12px;
    }

    .tag {
      border-radius: 999px;
      background: var(--blue-soft);
      color: #294da8;
      font-size: 13px;
      font-weight: 800;
      padding: 7px 11px;
    }

    .tag.green {
      background: var(--green-soft);
      color: #247344;
    }

    .tag.amber {
      background: var(--amber-soft);
      color: #8a5d00;
    }

    .tag.red {
      background: rgba(209, 74, 63, .12);
      color: #a34038;
    }

    .tag.similar-progress-tag {
      max-width: min(520px, 100%);
      overflow-wrap: anywhere;
      text-align: left;
      justify-self: start;
      align-self: start;
    }

    .steps {
      display: grid;
      gap: 12px;
    }

    .step {
      display: grid;
      grid-template-columns: 36px 1fr;
      gap: 12px;
      align-items: start;
      border: 1px solid transparent;
      border-radius: 8px;
      padding: 8px;
      margin: -8px;
      transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
    }

    .badge {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      background: #10224d;
      color: #fff;
      display: grid;
      place-items: center;
      font-weight: 800;
      box-shadow: 0 6px 15px rgba(16, 34, 77, .22);
    }

    .step strong {
      display: block;
      font-size: 17px;
      margin-bottom: 5px;
    }

    .step p {
      margin: 0;
      color: #3e4658;
      line-height: 1.7;
    }

    .notice {
      background: #fff8e8;
      border: 1px solid #f0dcae;
      border-radius: 7px;
      color: #6f541d;
      padding: 12px 14px;
      line-height: 1.7;
      margin-top: 12px;
    }

    .export-box {
      position: fixed;
      inset: auto 24px 24px auto;
      max-width: min(460px, calc(100vw - 48px));
      background: #17213b;
      color: #fff;
      border-radius: 8px;
      padding: 13px 14px;
      box-shadow: 0 18px 48px rgba(23, 33, 59, .28);
      opacity: 0;
      transform: translateY(12px);
      pointer-events: none;
      transition: .18s ease;
    }

    .export-box.show {
      opacity: 1;
      transform: translateY(0);
    }

    .image-lightbox {
      position: fixed;
      inset: 0;
      z-index: 40;
      display: none;
      place-items: center;
      padding: 66px 28px 28px;
      background: rgba(18, 24, 39, .78);
      backdrop-filter: blur(10px);
      overflow: auto;
    }

    .image-lightbox.show {
      display: grid;
    }

    .image-lightbox img {
      max-width: min(1180px, 96vw);
      max-height: calc(100vh - 100px);
      object-fit: contain;
      border-radius: 8px;
      background: #fff;
      box-shadow: 0 24px 80px rgba(0, 0, 0, .34);
      cursor: zoom-in;
      transform: scale(var(--lightbox-zoom, 1));
      transform-origin: center center;
      transition: transform .14s ease;
    }

    .image-lightbox.zoomed img {
      cursor: zoom-out;
    }

    .lightbox-tools {
      position: fixed;
      top: 18px;
      right: 70px;
      z-index: 42;
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px;
      border: 1px solid rgba(255, 255, 255, .28);
      border-radius: 999px;
      background: rgba(255, 255, 255, .92);
      box-shadow: 0 12px 36px rgba(0, 0, 0, .18);
    }

    .lightbox-tool {
      width: 34px;
      height: 34px;
      border: 0;
      border-radius: 50%;
      background: transparent;
      color: var(--ink);
      font-size: 18px;
      font-weight: 900;
      cursor: pointer;
      display: grid;
      place-items: center;
    }

    .lightbox-tool:hover {
      background: rgba(37, 99, 235, .1);
      color: var(--blue);
    }

    .lightbox-zoom-value {
      min-width: 50px;
      text-align: center;
      color: var(--muted);
      font-size: 13px;
      font-weight: 800;
    }

    .lightbox-close {
      position: fixed;
      top: 18px;
      right: 18px;
      width: 42px;
      height: 42px;
      border-radius: 50%;
      border: 1px solid rgba(255, 255, 255, .34);
      background: rgba(255, 255, 255, .92);
      color: var(--ink);
      cursor: pointer;
      display: grid;
      place-items: center;
      font-size: 24px;
      font-weight: 900;
      box-shadow: 0 12px 36px rgba(0, 0, 0, .22);
    }

    @media (max-width: 560px) {
      .manual-meta-panel {
        grid-template-columns: 1fr;
      }

      .lightbox-tools {
        right: 18px;
        top: 68px;
      }
    }

    @media (max-width: 1060px) {
      .shell {
        grid-template-columns: 1fr;
      }

      .shell.nav-collapsed {
        grid-template-columns: 1fr;
      }

      .side-nav {
        position: static;
        min-height: auto;
        border-right: 0;
        border-bottom: 1px solid var(--line);
      }

      .shell.nav-collapsed .side-nav {
        padding: 20px 14px;
      }

      .nav-resizer {
        display: none;
      }

      .nav-head {
        border-bottom: 0;
        padding-bottom: 0;
      }

      .brand-mark {
        border-bottom: 0;
        padding-bottom: 0;
      }

      .shell.nav-collapsed .brand-mark {
        padding: 8px 8px 0;
        text-align: left;
        font-size: 24px;
      }

      .shell.nav-collapsed .brand-full {
        display: inline;
      }

      .shell.nav-collapsed .brand-compact {
        display: none;
      }

      .nav-toggle {
        display: none;
      }

      .nav-list {
        display: flex;
        overflow: auto;
        padding-bottom: 2px;
      }

      .shell.nav-collapsed .nav-list {
        display: flex;
      }

      .nav-item {
        white-space: nowrap;
      }

      .shell.nav-collapsed .nav-item {
        display: block;
        min-height: 42px;
        padding: 0 12px;
        text-align: left;
        font-size: inherit;
      }

      .hero,
      .composer-grid,
      .workspace {
        grid-template-columns: 1fr;
      }

      .column-resizer {
        display: none;
      }

      .hero {
        display: block;
      }

      .subtitle-meta {
        justify-content: flex-start;
        margin-top: 10px;
      }

      .hero-actions {
        justify-items: start;
        margin-top: 10px;
      }

      .section-head {
        display: grid;
        gap: 8px;
      }

      .stage {
        position: static;
        max-height: none;
      }

      .flow-panel {
        max-height: none;
        overflow: visible;
      }

      .legend {
        justify-content: flex-start;
      }

      .composer-tools {
        padding: 14px;
      }

      .page-grid,
      .stat-grid {
        grid-template-columns: 1fr;
      }

      .user-center-grid {
        grid-template-columns: 1fr;
      }

    }

    @media (max-width: 720px) {
      .app {
        padding: 16px;
      }

      .token-stat-grid {
        grid-template-columns: 1fr;
      }

      .token-stat-grid.today {
        grid-template-columns: 1fr;
      }

      .manual-meta-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      h1 {
        font-size: 27px;
      }

      .composer {
        padding: 12px;
        margin-bottom: 10px;
      }

      .composer-grid {
        gap: 10px;
      }

      .composer-tools {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
      }

      .composer-tools > div:first-child {
        grid-column: auto;
        display: grid;
        align-items: stretch;
        gap: 6px;
      }

      .composer-tools label {
        margin: 0;
      }

      .composer-tools .actions {
        gap: 7px;
      }

      textarea {
        min-height: 86px;
      }

      .insight-card {
        padding: 12px;
      }

      .voice-panel {
        padding: 12px;
      }

      .voice-controls .btn {
        flex: 1 1 auto;
        justify-content: center;
      }

      .result {
        font-size: 20px;
      }

      .mono {
        font-size: 14px;
      }

      canvas {
        min-height: 340px;
        height: 48vh;
      }

      .panel {
        padding: 18px;
      }
    }

    #page-userManagement {
      min-width: 0;
    }

    #userManagementRoot {
      display: grid;
      gap: 14px;
      min-width: 0;
    }

    .management-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 4px;
      width: fit-content;
      padding: 3px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fff;
    }

    .management-tab {
      min-width: 92px;
      min-height: 38px;
      padding: 7px 16px;
      border: 0;
      border-radius: 6px;
      background: transparent;
      color: #566176;
      cursor: pointer;
    }

    .management-tab.active {
      background: var(--blue-soft);
      color: #244ebf;
      font-weight: 700;
    }

    .management-panel {
      min-width: 0;
      border-top: 1px solid var(--line);
      background: var(--panel);
    }

    .management-panel[hidden],
    .management-check[hidden],
    .management-form-grid label[hidden] {
      display: none !important;
    }

    .management-toolbar {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 12px;
      padding: 16px 0 12px;
    }

    .management-filters {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      min-width: 0;
    }

    .management-filters input,
    .management-filters select,
    .management-form-grid input,
    .management-form-grid select,
    .management-field input {
      min-height: 40px;
      border: 1px solid var(--line);
      border-radius: 6px;
      background: #fff;
      color: var(--ink);
      font: inherit;
      outline: none;
    }

    .management-filters input,
    .management-filters select {
      min-width: 150px;
      padding: 8px 10px;
    }

    .management-filters input:focus,
    .management-filters select:focus,
    .management-form-grid input:focus,
    .management-form-grid select:focus,
    .management-field input:focus {
      border-color: rgba(65, 105, 225, .65);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .1);
    }

    .management-summary {
      padding: 0 0 10px;
      color: var(--muted);
      font-size: 14px;
    }

    .management-table-wrap {
      min-width: 0;
      overflow-x: auto;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fff;
    }

    .management-table {
      width: 100%;
      min-width: 1080px;
      border-collapse: collapse;
      table-layout: auto;
    }

    .management-table.management-knowledge-table {
      min-width: 760px;
    }

    .management-table th,
    .management-table td {
      padding: 12px 14px;
      border-bottom: 1px solid #ece9e2;
      text-align: left;
      vertical-align: middle;
      white-space: nowrap;
    }

    .management-table th {
      color: #667187;
      background: #faf9f6;
      font-size: 13px;
      font-weight: 700;
    }

    .management-table tbody tr:last-child td {
      border-bottom: 0;
    }

    .management-table tbody tr:hover {
      background: #fcfcfa;
    }

    .management-current {
      display: inline-block;
      margin-left: 8px;
      color: #3158bd;
      font-size: 12px;
      font-weight: 500;
    }

    .management-status {
      display: inline-block;
      padding: 3px 8px;
      border-radius: 6px;
      font-size: 13px;
      font-weight: 700;
    }

    .management-status.success {
      color: #267747;
      background: var(--green-soft);
    }

    .management-status.danger {
      color: #a23b35;
      background: #fbecea;
    }

    .management-status.muted {
      color: #687184;
      background: #f0f1f3;
    }

    .management-row-actions {
      display: flex;
      gap: 6px;
    }

    .btn.compact {
      min-height: 34px;
      padding: 5px 10px;
      font-size: 13px;
    }

    .btn.danger-outline {
      border-color: rgba(216, 74, 67, .45);
      color: #b33e38;
    }

    .management-empty {
      height: 96px;
      color: var(--muted);
      text-align: center !important;
    }

    .management-empty.error,
    .management-form-error {
      color: #b33e38;
    }

    .management-pagination {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      padding-top: 12px;
      color: var(--muted);
      font-size: 14px;
    }

    .management-dialog {
      width: min(620px, calc(100vw - 32px));
      max-height: calc(100vh - 40px);
      padding: 0;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      color: var(--ink);
      box-shadow: var(--shadow);
    }

    .management-dialog::backdrop {
      background: rgba(23, 33, 59, .38);
    }

    .required-password-dialog {
      width: min(500px, calc(100vw - 32px));
    }

    .management-dialog form {
      display: grid;
      gap: 16px;
      padding: 20px;
    }

    .management-dialog-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding-bottom: 12px;
      border-bottom: 1px solid var(--line);
    }

    .management-dialog-head h2 {
      margin: 0;
      font-size: 20px;
    }

    .management-dialog-close {
      width: 34px;
      height: 34px;
      padding: 0;
      border: 0;
      background: transparent;
      color: #697388;
      cursor: pointer;
      font-size: 24px;
      line-height: 1;
    }

    .management-form-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

    .management-form-grid.single-column {
      grid-template-columns: 1fr;
    }

    .management-form-grid label,
    .management-field {
      display: grid;
      gap: 7px;
      color: #5f6a80;
      font-size: 14px;
      font-weight: 700;
    }

    .management-form-grid input,
    .management-form-grid select,
    .management-field input {
      width: 100%;
      padding: 9px 11px;
    }

    .management-check {
      display: flex;
      align-items: center;
      gap: 8px;
      color: #525d72;
      font-size: 14px;
    }

    .management-check input {
      width: 17px;
      height: 17px;
    }

    .management-dialog-copy {
      margin: 0;
      color: #59647a;
    }

    .management-form-error {
      min-height: 20px;
      font-size: 14px;
    }

    .management-dialog-actions {
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      padding-top: 4px;
    }

    @media (max-width: 820px) {
      .management-toolbar {
        align-items: stretch;
        flex-direction: column;
      }

      .management-filters {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .management-filters input,
      .management-filters select {
        width: 100%;
        min-width: 0;
      }

      .management-form-grid {
        grid-template-columns: 1fr;
      }
    }

    /* First visual refresh: a lighter, more focused teaching workspace. */
    :root {
      --paper: #f4f7ff;
      --panel: rgba(255, 255, 255, .9);
      --ink: #202a44;
      --muted: #74809a;
      --line: #e3e9f5;
      --blue: #4c6fff;
      --blue-soft: #eef2ff;
      --green: #50b985;
      --green-soft: #edfbf4;
      --red: #dd5a65;
      --amber: #f1a23d;
      --amber-soft: #fff6e5;
      --orange: #ff8a45;
      --orange-dark: #f56d36;
      --violet: #8a71f6;
      --cyan: #4dbed3;
      --surface-glass: rgba(255, 255, 255, .78);
      --shadow: 0 16px 44px rgba(55, 73, 122, .09);
      --shadow-sm: 0 7px 22px rgba(55, 73, 122, .07);
      --shadow-md: 0 18px 48px rgba(55, 73, 122, .12);
      --radius: 15px;
      --nav-width: 172px;
    }

    body {
      background:
        radial-gradient(circle at 7% 4%, rgba(188, 219, 255, .58), transparent 28%),
        radial-gradient(circle at 92% 8%, rgba(227, 209, 255, .52), transparent 25%),
        radial-gradient(circle at 82% 86%, rgba(255, 224, 197, .44), transparent 26%),
        linear-gradient(145deg, #f8fbff 0%, #f5f6ff 48%, #fff9f6 100%);
      background-attachment: fixed;
    }

    button,
    textarea,
    input,
    select {
      font-family: "Inter", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
    }

    .shell {
      max-width: 1780px;
      gap: 18px;
    }

    .app {
      padding: 24px 28px 34px 10px;
    }

    .side-nav {
      top: 16px;
      min-height: calc(100vh - 32px);
      margin: 16px 0 16px 16px;
      padding: 18px 12px;
      border: 1px solid rgba(224, 231, 245, .92);
      border-radius: 20px;
      background: rgba(255, 255, 255, .76);
      box-shadow: 0 18px 54px rgba(68, 82, 128, .1);
      backdrop-filter: blur(22px) saturate(135%);
      -webkit-backdrop-filter: blur(22px) saturate(135%);
      gap: 16px;
    }

    .nav-head {
      padding: 0 4px 15px;
      border-color: rgba(220, 227, 241, .8);
    }

    .brand-mark,
    .shell.nav-collapsed .brand-mark {
      padding: 8px 8px 2px;
      font-family: "Inter", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
      font-size: 23px;
      font-weight: 950;
      letter-spacing: -.04em;
      color: #263454;
    }

    .brand-mark::after {
      content: "";
      display: inline-block;
      width: 9px;
      height: 9px;
      margin-left: 7px;
      border-radius: 3px;
      background: linear-gradient(135deg, var(--orange), #ffbb68);
      box-shadow: 0 4px 10px rgba(255, 138, 69, .3);
      vertical-align: 2px;
    }

    .nav-list {
      gap: 5px;
    }

    .nav-item {
      position: relative;
      min-height: 45px;
      padding: 0 13px 0 40px;
      border-radius: 12px;
      color: #56627a;
      font-size: 14px;
      font-weight: 850;
      transition: color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
    }

    .nav-item::before {
      content: "";
      position: absolute;
      left: 15px;
      top: 50%;
      width: 12px;
      height: 12px;
      border: 2px solid #a9b4c9;
      border-radius: 4px;
      transform: translateY(-50%) rotate(45deg);
      transition: border-color .18s ease, background .18s ease, transform .18s ease;
    }

    .nav-item:hover:not(.active) {
      color: var(--blue);
      background: rgba(238, 242, 255, .82);
      transform: translateX(2px);
    }

    .nav-item:hover:not(.active)::before {
      border-color: var(--blue);
      transform: translateY(-50%) rotate(45deg) scale(1.08);
    }

    .nav-item.active {
      background: linear-gradient(135deg, #5579ff 0%, #4566ea 100%);
      color: #fff;
      box-shadow: 0 11px 24px rgba(76, 111, 255, .25);
    }

    .nav-item.active::before {
      border-color: rgba(255, 255, 255, .95);
      background: rgba(255, 255, 255, .22);
    }

    .nav-item:focus-visible {
      outline: 3px solid rgba(76, 111, 255, .22);
      outline-offset: 2px;
    }

    .nav-toggle {
      right: -18px;
      width: 36px;
      height: 36px;
      border-color: #dfe6f3;
      color: #687693;
      box-shadow: 0 10px 28px rgba(55, 73, 122, .16);
    }

    .nav-resizer {
      left: calc(var(--nav-width) + 9px);
    }

    .nav-resizer::before {
      background: rgba(151, 164, 190, .22);
    }

    .hero {
      min-height: 72px;
      margin-bottom: 18px;
      padding: 3px 2px 0;
      align-items: center;
    }

    h1,
    .page-panel h2,
    .page-panel h3,
    .parse-title h2 {
      font-family: "Inter", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
      letter-spacing: -.025em;
    }

    h1 {
      margin-bottom: 7px;
      color: #263454;
      font-size: clamp(24px, 2vw, 31px);
      font-weight: 950;
    }

    .subtitle {
      color: #7a879f;
      font-size: 14px;
      font-weight: 650;
    }

    .auth-user {
      min-height: 38px;
      padding: 0 5px 0 12px;
      border: 1px solid rgba(224, 231, 244, .86);
      border-radius: 999px;
      background: rgba(255, 255, 255, .72);
      box-shadow: var(--shadow-sm);
    }

    .auth-link {
      min-height: 29px;
      padding: 0 9px;
      border-radius: 999px;
    }

    .auth-link:hover {
      background: var(--blue-soft);
    }

    .page-grid {
      gap: 18px;
    }

    .page-panel {
      padding: 22px;
      border-color: rgba(224, 231, 244, .9);
      border-radius: 18px;
      background: rgba(255, 255, 255, .84);
      box-shadow: var(--shadow);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
    }

    .page-panel h2,
    .page-panel h3 {
      color: #2b3857;
      font-weight: 900;
    }

    input,
    select,
    textarea {
      accent-color: var(--blue);
    }

    .single-question-filters,
    .manual-meta-panel {
      padding: 15px;
      border-color: #e4eaf6;
      border-radius: 14px;
      background: linear-gradient(135deg, rgba(244, 248, 255, .95), rgba(250, 247, 255, .88));
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92);
      gap: 12px;
      margin-bottom: 17px;
    }

    .single-question-filters label,
    .manual-meta-field label,
    .parse-side-field label {
      color: #71809b;
      font-weight: 800;
    }

    .single-question-filters input,
    .single-question-filters select,
    .manual-meta-field input,
    .manual-meta-field select,
    .parse-meta input,
    .parse-meta select,
    .parse-side-field input {
      min-height: 42px;
      border-color: #dfe6f2;
      border-radius: 10px;
      background: rgba(255, 255, 255, .94);
      box-shadow: 0 3px 10px rgba(63, 78, 118, .035);
      transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
    }

    .single-question-filters input:focus,
    .single-question-filters select:focus,
    .manual-meta-field input:focus,
    .manual-meta-field select:focus,
    .parse-meta input:focus,
    .parse-meta select:focus,
    .parse-side-field input:focus,
    .paper-answer-input:focus,
    .parse-textarea:focus {
      border-color: rgba(76, 111, 255, .66);
      background: #fff;
      box-shadow: 0 0 0 4px rgba(76, 111, 255, .11);
      outline: none;
    }

    .btn {
      height: 40px;
      min-height: 40px;
      padding: 0 15px;
      border-color: #dfe6f2;
      border-radius: 10px;
      background: rgba(255, 255, 255, .94);
      color: #44516d;
      font-size: 13px;
      font-weight: 800;
      box-shadow: 0 4px 12px rgba(55, 73, 122, .045);
    }

    .btn:hover:not(:disabled) {
      border-color: rgba(76, 111, 255, .42);
      background: #fff;
      color: var(--blue);
      box-shadow: 0 9px 22px rgba(55, 73, 122, .12);
      transform: translateY(-2px);
    }

    .btn.primary,
    #parseSaveBtn,
    #parseCurrentSaveBtn {
      border-color: transparent;
      background: linear-gradient(135deg, #5579ff, #4566e9);
      color: #fff;
      box-shadow: 0 9px 20px rgba(76, 111, 255, .22);
    }

    #parseAnalyzeBtn,
    #parseCurrentAiSolveBtn,
    #manualAiSolveBtn {
      border-color: transparent;
      background: linear-gradient(135deg, #ff9b52, var(--orange-dark));
      color: #fff;
      box-shadow: 0 9px 20px rgba(245, 109, 54, .22);
    }

    .btn.primary:hover:not(:disabled),
    #parseSaveBtn:hover:not(:disabled),
    #parseCurrentSaveBtn:hover:not(:disabled),
    #parseAnalyzeBtn:hover:not(:disabled),
    #parseCurrentAiSolveBtn:hover:not(:disabled),
    #manualAiSolveBtn:hover:not(:disabled) {
      border-color: transparent;
      color: #fff;
      filter: saturate(1.06);
    }

    .btn.primary:hover:not(:disabled),
    #parseSaveBtn:hover:not(:disabled),
    #parseCurrentSaveBtn:hover:not(:disabled) {
      background: linear-gradient(135deg, #6384ff, #3859dc);
      color: #fff;
    }

    #parseAnalyzeBtn:hover:not(:disabled),
    #parseCurrentAiSolveBtn:hover:not(:disabled),
    #manualAiSolveBtn:hover:not(:disabled) {
      background: linear-gradient(135deg, #ffa55f, #ea5f2d);
      color: #fff;
    }

    .btn.danger {
      border-color: rgba(221, 90, 101, .24);
      background: #fff8f8;
      color: #bd4f5a;
      box-shadow: none;
    }

    .history-empty {
      min-height: 116px;
      padding: 28px;
      border: 1px dashed #d9e2f2;
      border-radius: 14px;
      background: linear-gradient(135deg, rgba(244, 248, 255, .82), rgba(255, 249, 244, .72));
      color: #8390a7;
      display: grid;
      place-items: center;
      text-align: center;
      line-height: 1.75;
    }

    /* Paper library */
    #page-paper .page-panel {
      padding: 20px;
    }

    .library-subject-tabs {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
      padding: 0 8px;
      border-bottom: 1px solid #e3e9f4;
      overflow-x: auto;
      scrollbar-width: thin;
    }

    .library-subject-tab {
      position: relative;
      flex: 0 0 auto;
      min-width: 82px;
      min-height: 46px;
      padding: 0 20px;
      border: 0;
      border-radius: 11px 11px 0 0;
      background: transparent;
      color: #6c7890;
      font: inherit;
      font-size: 15px;
      font-weight: 800;
      cursor: pointer;
      transition: color .18s ease, background .18s ease, transform .18s ease;
    }

    .library-subject-tab::after {
      content: "";
      position: absolute;
      left: 20px;
      right: 20px;
      bottom: -1px;
      height: 3px;
      border-radius: 999px 999px 0 0;
      background: linear-gradient(90deg, #6985ff, #4363ef);
      opacity: 0;
      transform: scaleX(.4);
      transition: opacity .18s ease, transform .18s ease;
    }

    .library-subject-tab:hover {
      background: linear-gradient(180deg, rgba(86, 116, 246, .08), rgba(86, 116, 246, .025));
      color: #44577f;
    }

    .library-subject-tab.active {
      background: linear-gradient(180deg, rgba(76, 111, 255, .13), rgba(76, 111, 255, .035));
      color: #4565ec;
      text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
    }

    .library-subject-tab.active::after {
      opacity: 1;
      transform: scaleX(1);
    }

    .library-subject-tab.active:hover {
      color: #3859e2;
    }

    .library-subject-tab:focus-visible {
      outline: 3px solid rgba(76, 111, 255, .2);
      outline-offset: 2px;
    }

    .paper-library-list {
      gap: 12px;
    }

    .paper-library-card {
      padding: 16px 17px;
      border-color: #e2e8f3;
      border-radius: 15px;
      background: rgba(255, 255, 255, .88);
      box-shadow: 0 8px 24px rgba(55, 73, 122, .065);
    }

    .paper-library-card::before {
      content: "";
      position: absolute;
      left: 0;
      top: 17px;
      bottom: 17px;
      width: 4px;
      border-radius: 0 6px 6px 0;
      background: linear-gradient(180deg, var(--blue), var(--violet));
      opacity: 0;
      transform: scaleY(.55);
      transition: opacity .18s ease, transform .18s ease;
    }

    .paper-library-card:hover,
    .paper-library-card.active {
      border-color: rgba(76, 111, 255, .38);
      background: #fff;
      box-shadow: 0 16px 36px rgba(55, 73, 122, .12);
    }

    .paper-library-card:hover::before,
    .paper-library-card.active::before {
      opacity: 1;
      transform: scaleY(1);
    }

    .paper-library-title {
      color: #2b3857;
      font-size: 16px;
      font-weight: 900;
    }

    .paper-library-chip {
      min-height: 25px;
      border-color: transparent;
      background: #f0f4fb;
      color: #66738d;
      font-weight: 800;
    }

    .paper-library-chip.score {
      border-color: transparent;
      background: #fff2df;
      color: #b06b21;
    }

    .paper-library-time-text {
      color: #929db1;
      font-weight: 700;
    }

    .paper-library-actions .history-action-pill {
      min-height: 34px;
      padding: 0 13px;
      border-radius: 9px;
      border-color: #e0e7f2;
      background: #f8faff;
      color: #53617c;
      font-weight: 800;
    }

    .paper-library-actions .history-action-pill.secondary {
      border-color: rgba(76, 111, 255, .2);
      background: var(--blue-soft);
      color: var(--blue);
    }

    .paper-library-actions .history-action-pill.export {
      border-color: rgba(80, 185, 133, .2);
      background: var(--green-soft);
      color: #31855e;
    }

    .paper-library-actions .history-action-pill.danger {
      border-color: rgba(221, 90, 101, .18);
      background: #fff7f8;
      color: #bd4f5a;
    }

    /* Paper parsing workbench */
    .parse-shell {
      gap: 14px;
    }

    .parse-alert {
      min-height: 38px;
      padding: 8px 15px;
      border: 1px solid rgba(76, 111, 255, .1);
      border-radius: 11px;
      background: linear-gradient(135deg, #edf3ff, #f4f0ff);
      color: #4962a0;
      font-size: 13px;
      font-weight: 750;
      box-shadow: 0 6px 18px rgba(76, 111, 255, .07);
    }

    .parse-topbar {
      min-height: 52px;
      padding: 7px 9px;
      border: 1px solid rgba(224, 231, 244, .88);
      border-radius: 14px;
      background: rgba(255, 255, 255, .7);
      box-shadow: var(--shadow-sm);
    }

    .parse-meta {
      grid-template-columns: minmax(130px, 165px) minmax(190px, 245px) minmax(170px, 210px);
    }

    .parse-workbench {
      grid-template-columns: 312px minmax(0, 1fr);
      gap: 15px;
    }

    .parse-side,
    .parse-main-card {
      border-color: rgba(224, 231, 244, .92);
      border-radius: 17px;
      background: rgba(255, 255, 255, .86);
      box-shadow: var(--shadow);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    .parse-side {
      top: 16px;
      padding: 12px;
      gap: 12px;
    }

    .parse-side-section {
      padding: 12px;
      border-color: #e5ebf5;
      border-radius: 13px;
      background: rgba(255, 255, 255, .9);
    }

    .parse-upload {
      min-height: 154px;
      padding: 18px 12px;
      border: 1.5px dashed #c9d7f1;
      border-radius: 13px;
      background:
        radial-gradient(circle at 15% 15%, rgba(192, 220, 255, .42), transparent 38%),
        linear-gradient(145deg, #f7faff, #fbf8ff);
      color: #70809d;
      font-size: 13px;
      font-weight: 750;
    }

    .parse-upload::before {
      content: "＋";
      width: 43px;
      height: 43px;
      margin: 0 auto 2px;
      border-radius: 13px;
      display: grid;
      place-items: center;
      background: linear-gradient(135deg, #e5edff, #efe9ff);
      color: var(--blue);
      font-size: 25px;
      font-weight: 500;
      box-shadow: inset 0 0 0 1px rgba(76, 111, 255, .09);
    }

    .parse-upload:has(.parse-thumb) {
      padding: 10px;
    }

    .parse-upload:has(.parse-thumb)::before {
      display: none;
    }

    .parse-upload-actions {
      gap: 9px;
    }

    .parse-stat-list {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .parse-stat {
      min-height: 66px;
      padding: 10px;
      border: 1px solid #e5ebf6;
      border-radius: 11px;
      background: linear-gradient(145deg, #f2f6ff, #fafcff);
      display: grid;
      align-content: center;
      gap: 4px;
      color: #71809a;
    }

    .parse-stat strong {
      color: var(--blue);
      font-size: 20px;
    }

    .parse-stat.warning {
      border-color: #f6e6c9;
      background: linear-gradient(145deg, #fff8e9, #fffdf8);
    }

    .parse-stat.warning strong {
      color: #d7892b;
    }

    .parse-main-card {
      padding: 15px;
      gap: 13px;
    }

    .parse-question-strip {
      min-height: 50px;
      padding: 9px 12px;
      border-color: #e5ebf5;
      border-radius: 12px;
      background: linear-gradient(135deg, #f7f9ff, #fbf9ff);
    }

    .parse-question-list .history-empty {
      min-height: auto;
      padding: 0;
      border: 0;
      border-radius: 0;
      background: transparent;
      display: block;
      color: #8c98ad;
      text-align: left;
    }

    .parse-q-chip {
      min-height: 31px;
      border-color: #dfe6f3;
      background: #fff;
      color: #64718b;
    }

    .parse-q-chip.active {
      border-color: transparent;
      background: linear-gradient(135deg, var(--blue), #6e67e9);
      box-shadow: 0 6px 14px rgba(76, 111, 255, .2);
    }

    .parse-question-head {
      padding: 2px 1px 12px;
      border-color: #e8edf5;
    }

    .parse-question-head strong {
      color: #2c3958;
      font-size: 17px;
    }

    .parse-badge {
      background: #fff1df;
      color: #b66d24;
      font-weight: 850;
    }

    .parse-editor-grid {
      gap: 13px;
    }

    .parse-paper-editor-grid {
      grid-template-columns:
        minmax(0, var(--parse-editor-left, 50fr))
        13px
        minmax(0, var(--parse-editor-right, 50fr));
      column-gap: 0;
      row-gap: 13px;
    }

    .parse-paper-editor-grid > .parse-editor-panel:nth-child(1) {
      grid-column: 1;
      grid-row: 1;
    }

    .parse-paper-editor-grid > .parse-editor-panel:nth-child(2) {
      grid-column: 3;
      grid-row: 1;
    }

    .parse-paper-editor-grid > .parse-editor-panel:nth-child(3) {
      grid-column: 1;
      grid-row: 2;
    }

    .parse-paper-editor-grid > .parse-editor-panel:nth-child(4) {
      grid-column: 3;
      grid-row: 2;
    }

    .parse-column-resizer {
      position: relative;
      grid-column: 2;
      grid-row: 1 / 3;
      width: 13px;
      min-width: 13px;
      height: 100%;
      border: 0;
      padding: 0;
      background: transparent;
      cursor: col-resize;
      touch-action: none;
      user-select: none;
    }

    .parse-column-resizer::before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 6px;
      width: 2px;
      border-radius: 999px;
      background: rgba(119, 128, 146, .35);
      transition: left .16s ease, width .16s ease, background .16s ease, box-shadow .16s ease;
    }

    .parse-column-resizer:hover::before,
    .parse-column-resizer:focus-visible::before,
    body.resizing-parse-editor .parse-column-resizer::before {
      left: 5px;
      width: 4px;
      background: rgba(65, 105, 225, .72);
      box-shadow: 0 0 0 3px rgba(65, 105, 225, .08);
    }

    .parse-column-resizer:focus-visible {
      outline: none;
    }

    body.resizing-parse-editor,
    body.resizing-parse-editor * {
      cursor: col-resize !important;
      user-select: none !important;
    }

    .parse-editor-panel {
      padding: 12px;
      border: 1px solid #e5ebf4;
      border-radius: 13px;
      background: rgba(249, 251, 255, .8);
      gap: 9px;
    }

    .parse-editor-panel h3 {
      color: #46536d;
      font-size: 13px;
      font-weight: 850;
    }

    .parse-textarea,
    .parse-preview {
      border-color: #dfe6f2;
      border-radius: 10px;
      background: #fff;
      box-shadow: inset 0 1px 3px rgba(55, 73, 122, .035);
    }

    .parse-textarea[readonly] {
      background: #f6f8fc;
    }

    /* Practice cards */
    #page-paperPractice .page-panel {
      min-height: calc(100vh - 145px);
      padding: clamp(18px, 2.5vw, 30px);
    }

    #page-paperPractice .paper-board {
      width: min(100%, 1160px);
      margin: 0 auto;
      gap: 18px;
    }

    #page-paperPractice .history-empty {
      min-height: 360px;
      position: relative;
      padding-top: 120px;
      font-size: 15px;
      font-weight: 750;
    }

    #page-paperPractice .history-empty::before {
      content: "";
      position: absolute;
      top: 74px;
      left: 50%;
      width: 48px;
      height: 58px;
      border: 2px solid #9fb4e5;
      border-radius: 10px;
      background: linear-gradient(145deg, #fff, #eef3ff);
      box-shadow: 10px 10px 0 #e9e2ff;
      transform: translateX(-50%) rotate(-4deg);
    }

    .paper-question {
      padding: clamp(18px, 2vw, 26px);
      border-color: #e1e8f3;
      border-radius: 17px;
      background: rgba(255, 255, 255, .93);
      box-shadow: var(--shadow-sm);
      gap: 16px;
    }

    .paper-question:first-child {
      background:
        radial-gradient(circle at 92% 15%, rgba(224, 213, 255, .45), transparent 30%),
        linear-gradient(135deg, #f1f6ff, #fffafd);
      border-color: rgba(76, 111, 255, .14);
    }

    .paper-question-head {
      color: #78859c;
      font-weight: 800;
    }

    .paper-practice-section {
      display: grid;
      gap: 5px;
      margin: 10px 2px -2px;
      padding: 14px 18px;
      border-left: 4px solid #4c6fff;
      border-radius: 0 12px 12px 0;
      background: linear-gradient(90deg, #eef3ff, rgba(255, 255, 255, .72));
      color: #263554;
    }

    .paper-practice-section strong {
      font-size: 18px;
      line-height: 1.45;
    }

    .paper-practice-section span {
      color: #72809a;
      font-size: 13px;
      font-weight: 750;
      line-height: 1.6;
    }

    .paper-stem {
      color: #2f3a55;
      font-size: 16px;
      line-height: 1.85;
    }

    .paper-answer-input {
      min-height: 104px;
      padding: 14px 15px;
      border-color: #dfe6f2;
      border-radius: 11px;
      background: #fbfcff;
    }

    .paper-answer-input.english-task-answer,
    .paper-answer-input.english-translation-answer {
      min-height: 138px;
      font-family: "Times New Roman", "Songti SC", serif;
      line-height: 1.75;
    }

    .paper-answer-input.english-writing-answer {
      min-height: 230px;
      font-family: "Times New Roman", "Songti SC", serif;
      font-size: 16px;
      line-height: 1.9;
    }

    .paper-answer-input.chinese-subjective-answer,
    .paper-answer-input.chinese-dictation-answer {
      min-height: 148px;
      font-family: "Songti SC", "STSong", serif;
      line-height: 1.85;
    }

    .paper-answer-input.chinese-writing-answer {
      min-height: 280px;
      font-family: "Songti SC", "STSong", serif;
      font-size: 16px;
      line-height: 1.9;
    }

    .chinese-writing-count {
      margin-top: -4px;
      color: #7b8498;
      font-size: 13px;
      font-weight: 700;
      text-align: right;
    }

    .chinese-writing-count.warning {
      color: #c66a24;
    }

    .chinese-writing-count.ok {
      color: #33815d;
    }

    .chinese-answer-fields {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
      margin-top: 16px;
      padding: 16px;
      border: 1px solid #d9e3f5;
      border-radius: 16px;
      background: #f8faff;
    }

    .chinese-answer-fields.is-hidden {
      display: none;
    }

    .chinese-answer-fields label {
      display: grid;
      gap: 8px;
      color: #34415a;
      font-weight: 700;
    }

    .chinese-answer-fields textarea {
      min-height: 150px;
      padding: 12px 14px;
      border: 1px solid #ccd8ed;
      border-radius: 12px;
      background: #fff;
      color: #27334c;
      font: inherit;
      font-weight: 400;
      line-height: 1.7;
      resize: vertical;
    }

    .chinese-answer-guide {
      display: grid;
      gap: 12px;
      margin-top: 14px;
    }

    .chinese-answer-guide-section {
      display: grid;
      gap: 6px;
      padding: 12px 14px;
      border-left: 4px solid #7897e8;
      border-radius: 8px;
      background: #f5f8ff;
    }

    .chinese-answer-guide-section > strong {
      color: #2f477f;
    }

    .mistake-chinese-answer-guide {
      margin-top: 16px;
    }

    .paper-reference-answer-content {
      padding: 12px 14px;
      border: 1px solid rgba(89, 163, 126, .22);
      border-radius: 10px;
      background: rgba(255, 255, 255, .72);
      color: #2f4b3d;
      font-family: "Times New Roman", "Songti SC", serif;
      line-height: 1.8;
      white-space: pre-wrap;
    }

    @media (max-width: 900px) {
      .chinese-answer-fields {
        grid-template-columns: 1fr;
      }
    }

    .similar-choice {
      border-color: #e0e7f2;
      border-radius: 12px;
      background: #fbfcff;
    }

    .similar-choice:hover,
    .similar-choice.selected {
      border-color: rgba(76, 111, 255, .45);
      background: var(--blue-soft);
    }

    .choice-letter {
      background: linear-gradient(135deg, #607dce, #4f64a8);
    }

    .practice-feedback {
      color: #7f8ba1;
      font-weight: 750;
    }

    .paper-explanation {
      padding: 18px;
      border-color: #cfe9dc;
      border-radius: 12px;
      background: linear-gradient(145deg, #f0fbf5, #fbfffd);
    }

    .site-footer {
      color: #97a1b3;
    }

    @media (max-width: 1260px) {
      .paper-library-main {
        grid-template-columns: 1fr;
      }

      .paper-library-actions {
        grid-column: 1;
        grid-row: auto;
        justify-content: flex-start;
        min-width: 0;
        margin-top: 4px;
      }

      .parse-workbench {
        grid-template-columns: 278px minmax(0, 1fr);
      }
    }

    @media (max-width: 1060px) {
      .shell {
        gap: 0;
      }

      .side-nav {
        margin: 10px;
        min-height: auto;
        border: 1px solid rgba(224, 231, 245, .92);
        border-radius: 16px;
        padding: 12px;
      }

      .nav-head {
        padding-bottom: 4px;
      }

      .nav-list {
        gap: 6px;
      }

      .nav-item {
        padding: 0 15px;
      }

      .nav-item::before {
        display: none;
      }

      .app {
        padding: 12px 18px 28px;
      }
    }

    @media (max-width: 900px) {
      .parse-workbench {
        grid-template-columns: 1fr;
      }

      .parse-paper-editor-grid {
        grid-template-columns: 1fr;
        gap: 13px;
      }

      .parse-paper-editor-grid > .parse-editor-panel:nth-child(1),
      .parse-paper-editor-grid > .parse-editor-panel:nth-child(2),
      .parse-paper-editor-grid > .parse-editor-panel:nth-child(3),
      .parse-paper-editor-grid > .parse-editor-panel:nth-child(4) {
        grid-column: 1;
        grid-row: auto;
      }

      .parse-column-resizer {
        display: none;
      }

      .parse-side {
        position: static;
      }

      .parse-stat-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 720px) {
      .app {
        padding: 10px 12px 24px;
      }

      .hero {
        min-height: 58px;
        margin-bottom: 12px;
      }

      h1 {
        font-size: 24px;
      }

      .page-panel,
      #page-paper .page-panel {
        padding: 14px;
        border-radius: 15px;
      }

      .single-question-filters {
        padding: 12px;
      }

      .library-subject-tabs {
        margin: 0 -4px;
        padding: 0 2px;
        gap: 4px;
      }

      .library-subject-tab {
        min-width: 68px;
        min-height: 42px;
        padding: 0 14px;
      }

      .library-subject-tab::after {
        left: 14px;
        right: 14px;
      }

      .parse-topbar,
      .parse-meta {
        grid-template-columns: 1fr;
      }

      .parse-main-card {
        padding: 11px;
      }

      .parse-question-head {
        align-items: flex-start;
        flex-direction: column;
      }

      .parse-editor-panel {
        padding: 9px;
      }

      .paper-library-actions .history-action-pill {
        flex: 1 1 auto;
        justify-content: center;
      }

      .choice-two-column-grid {
        grid-template-columns: 1fr;
      }

      .choice-two-column-grid.paper-choice-row-layout {
        grid-template-columns: repeat(var(--paper-choice-columns, 2), minmax(0, 1fr));
      }

      .parse-choice-edit-actions,
      .parse-choice-preview-grid {
        grid-template-columns: 1fr;
      }
    }