:root {
  --paper: #f2ecdf;
  --paper-deep: #e8dece;
  --surface: #fbf8f1;
  --surface-strong: #fffdf8;
  --ink: #27231e;
  --ink-soft: #504a42;
  --muted: #655e55;
  --line: #d8cdbd;
  --line-strong: #938575;
  --accent: #a13b2e;
  --accent-deep: #78291f;
  --accent-pale: #f1ded7;
  --green: #39624c;
  --green-pale: #dfeadf;
  --amber: #8a601e;
  --amber-pale: #f4e8c9;
  --danger: #8f2f2f;
  --danger-pale: #f2dcdc;
  --shadow: 0 20px 60px rgb(68 51 35 / 10%);
  --sans: "Noto Sans CJK SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  --serif: "Noto Serif CJK SC", "Songti SC", "STSong", "SimSun", ui-serif, serif;
}

* {
  box-sizing: border-box;
}

html {
  color-scheme: light;
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 15px/1.7 var(--sans);
  text-rendering: optimizeLegibility;
}

body::before {
  position: fixed;
  z-index: -1;
  inset: 0 auto 0 max(22px, calc((100vw - 1240px) / 2));
  width: 1px;
  background: rgb(161 59 46 / 22%);
  content: "";
}

a {
  color: var(--accent-deep);
  text-decoration-color: rgb(120 41 31 / 35%);
  text-underline-offset: 0.2em;
}

a:hover {
  color: var(--accent);
  text-decoration-color: currentColor;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1,
h2,
h3 {
  font-family: var(--serif);
  font-weight: 600;
  line-height: 1.25;
}

h1 {
  margin-bottom: 0.7rem;
  font-size: clamp(2.4rem, 7vw, 5.4rem);
  letter-spacing: -0.055em;
}

h2 {
  margin-bottom: 0.85rem;
  font-size: clamp(1.45rem, 3vw, 2.1rem);
  letter-spacing: -0.025em;
}

h3 {
  margin-bottom: 0.55rem;
  font-size: 1.12rem;
}

button,
input,
select {
  font: inherit;
}

button,
.button-link {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--accent-deep);
  border-radius: 2px;
  margin: 0;
  background: var(--accent-deep);
  color: #fffaf3;
  cursor: pointer;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.65rem 1.15rem;
  text-decoration: none;
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease, transform 140ms ease;
}

button:hover,
.button-link:hover {
  border-color: var(--accent);
  background: var(--accent);
  color: white;
  transform: translateY(-1px);
}

button:disabled {
  cursor: default;
  opacity: 0.55;
  transform: none;
}

.button-secondary {
  border-color: var(--line-strong);
  background: transparent;
  color: var(--ink);
}

.button-secondary:hover {
  border-color: var(--ink);
  background: var(--ink);
}

.button-danger,
.reject-candidate {
  border-color: var(--danger);
  background: transparent;
  color: var(--danger);
}

.button-danger:hover,
.reject-candidate:hover {
  border-color: var(--danger);
  background: var(--danger);
}

input,
select {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line-strong);
  border-radius: 2px;
  outline: 0;
  background: var(--surface-strong);
  color: var(--ink);
  padding: 0.72rem 0.8rem;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

input:focus,
select:focus,
button:focus-visible,
a:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

input:focus,
select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgb(161 59 46 / 10%);
  outline: 0;
}

input::placeholder {
  color: #746b60;
}

label {
  display: grid;
  gap: 0.3rem;
  color: var(--ink-soft);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}

code {
  border-radius: 2px;
  background: var(--paper-deep);
  color: var(--accent-deep);
  font-size: 0.84em;
  overflow-wrap: anywhere;
  padding: 0.14rem 0.32rem;
}

.shell {
  width: min(1160px, calc(100% - 3rem));
  margin-inline: auto;
}

.site-header {
  border-bottom: 1px solid var(--line);
  background: rgb(242 236 223 / 94%);
}

.nav-shell {
  min-height: 5.4rem;
  display: grid;
  grid-template-columns: minmax(230px, 1fr) auto auto;
  align-items: center;
  gap: 2rem;
}

.brand {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 0.8rem;
  color: var(--ink);
  text-decoration: none;
}

.brand:hover {
  color: var(--ink);
}

.brand-mark {
  width: 2.6rem;
  height: 3.25rem;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid var(--accent);
  background: var(--accent);
  color: white;
  font: 700 1.2rem var(--serif);
  box-shadow: 4px 4px 0 var(--paper-deep);
}

.brand-name,
.brand-tagline {
  display: block;
}

.brand-name {
  font: 600 1.05rem/1.2 var(--serif);
  letter-spacing: 0.02em;
}

.brand-tagline {
  margin-top: 0.2rem;
  color: var(--muted);
  font-size: 0.65rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.main-nav {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.main-nav a {
  border-bottom: 2px solid transparent;
  color: var(--ink-soft);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 1.8rem 0.75rem 1.65rem;
  text-decoration: none;
}

.main-nav a:hover,
.main-nav a[aria-current="page"] {
  border-color: var(--accent);
  color: var(--accent-deep);
}

.logout-form {
  margin: 0;
}

.logout-form button {
  min-height: auto;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 0.78rem;
  padding: 0.5rem;
}

.logout-form button:hover {
  background: transparent;
  color: var(--accent);
  transform: none;
}

.page {
  padding-block: clamp(2.7rem, 7vw, 6rem) 5rem;
}

.page-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 0.42fr);
  align-items: end;
  gap: 2rem;
  margin-bottom: clamp(2.2rem, 5vw, 4rem);
}

.page-heading h1 {
  max-width: 800px;
}

.page-heading .lead {
  max-width: 35rem;
}

.eyebrow {
  margin-bottom: 0.7rem;
  color: var(--accent);
  font-size: 0.71rem;
  font-weight: 800;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}

.lead {
  color: var(--ink-soft);
  font-size: 1rem;
  line-height: 1.85;
}

.folio {
  justify-self: end;
  border-left: 1px solid var(--line-strong);
  color: var(--muted);
  font: italic 0.92rem/1.7 var(--serif);
  padding-left: 1.4rem;
}

.section-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--line);
  margin-bottom: 1.4rem;
  padding-bottom: 0.8rem;
}

.section-heading h2,
.section-heading h3 {
  margin: 0;
}

.section-note,
.muted {
  color: var(--muted);
  font-size: 0.84rem;
}

.paper-panel {
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: var(--shadow);
  padding: clamp(1.25rem, 3vw, 2rem);
}

.ruled-panel {
  border-top: 3px solid var(--ink);
  border-bottom: 1px solid var(--line-strong);
  background: rgb(251 248 241 / 55%);
  padding: 1.6rem 0;
}

.home-hero {
  min-height: 31rem;
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(260px, 0.5fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 6rem);
  border-bottom: 1px solid var(--line-strong);
  padding-block: clamp(3rem, 9vw, 7rem);
}

.home-hero h1 em {
  color: var(--accent);
  font-style: normal;
}

.hero-copy {
  max-width: 40rem;
}

.hero-ledger {
  border-top: 3px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  margin: 0;
}

.hero-ledger div {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  border-bottom: 1px solid var(--line);
  gap: 1rem;
  padding: 1.1rem 0;
}

.hero-ledger div:last-child {
  border-bottom: 0;
}

.hero-ledger dt {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.hero-ledger dd {
  margin: 0;
  font: 600 2rem/1 var(--serif);
}

.search-stage {
  padding-block: clamp(3rem, 7vw, 5.5rem);
}

.search-stage .section-heading {
  border: 0;
  margin-bottom: 1rem;
}

.search-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  border-bottom: 2px solid var(--ink);
  gap: 1rem;
  padding-bottom: 0.8rem;
}

.search-bar input {
  border: 0;
  background: transparent;
  font: 500 clamp(1.4rem, 4vw, 2.25rem)/1.2 var(--serif);
  padding: 0.45rem 0;
}

.search-bar input:focus {
  box-shadow: none;
}

.search-bar button {
  min-width: 7rem;
}

#search-errors,
.error {
  color: var(--danger);
}

#search-errors:empty,
#upload-message:empty,
#acquisition-message:empty {
  display: none;
}

#search-errors,
#upload-message,
#acquisition-message {
  margin: 0.9rem 0 0;
}

.result-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: 2rem;
  background: var(--line);
}

.result-grid > .empty-state {
  grid-column: 1 / -1;
  margin: 0;
  background: var(--surface);
}

.candidate {
  position: relative;
  min-width: 0;
  background: var(--surface);
  padding: 1.35rem;
}

.search-result {
  min-height: 13rem;
}

.candidate img,
.candidate-cover-placeholder {
  width: 72px;
  height: 105px;
  float: right;
  margin: 0 0 1rem 1rem;
  border: 1px solid var(--line);
  object-fit: cover;
  box-shadow: 4px 5px 0 var(--paper-deep);
}

.candidate-cover-placeholder {
  display: grid;
  place-items: center;
  background: var(--paper);
  color: var(--muted);
  font-size: 0.66rem;
  line-height: 1.3;
  padding: 0.4rem;
  text-align: center;
}

.candidate-group {
  grid-column: 1 / -1;
  background: var(--surface);
}

.candidate-group > summary {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.35rem;
  border-left: 3px solid var(--accent);
  cursor: pointer;
  list-style-position: inside;
}

.candidate-group > summary strong {
  font: 600 1.05rem/1.4 var(--serif);
}

.candidate-group > summary span {
  color: var(--muted);
  font-size: 0.75rem;
  text-align: right;
}

.candidate-group-items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border-top: 1px solid var(--line);
  background: var(--line);
}

.candidate-title {
  margin-bottom: 0.45rem;
  font: 600 1.12rem/1.45 var(--serif);
}

.source-badge {
  display: inline-block;
  border-bottom: 1px solid var(--accent);
  margin-bottom: 0.75rem;
  color: var(--accent-deep);
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  padding-bottom: 0.15rem;
  text-transform: uppercase;
}

.candidate-meta,
.candidate-attribution,
.strong-anchors {
  color: var(--muted);
  font-size: 0.76rem;
}

.candidate-meta,
.candidate-attribution {
  margin-bottom: 0.45rem;
}

.candidate-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.9rem;
  margin-bottom: 0.55rem;
  color: var(--ink-soft);
  font-size: 0.76rem;
}

.candidate-facts span {
  overflow-wrap: anywhere;
}

.candidate-facts strong {
  color: var(--muted);
  font-weight: 700;
}

.candidate-actions {
  display: flex;
  clear: both;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
  margin-top: 1rem;
}

.candidate-actions select {
  width: auto;
  min-width: 10rem;
  flex: 1 1 12rem;
}

.candidate-actions button,
.candidate-source-link {
  min-height: 2.35rem;
  font-size: 0.76rem;
  padding: 0.45rem 0.75rem;
}

.candidate-source-link {
  display: inline-flex;
  align-items: center;
  border-bottom: 1px solid currentColor;
  font-weight: 700;
  text-decoration: none;
}

.home-columns {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 1.5rem;
  padding-bottom: 5rem;
}

.upload-drop {
  display: grid;
  min-height: 12rem;
  place-items: center;
  border: 1px dashed var(--line-strong);
  background: var(--surface-strong);
  padding: 1.25rem;
  text-align: center;
}

.upload-drop input[type="file"] {
  border: 0;
  background: transparent;
  padding: 0;
}

.shelf-list,
.plain-list,
.task-list,
.binding-list,
.volume-list,
.publication-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.shelf-list li,
.plain-list li,
.binding-list li,
.volume-list li,
.publication-list li {
  border-bottom: 1px solid var(--line);
  padding: 0.8rem 0;
}

.shelf-list li:last-child,
.plain-list li:last-child,
.binding-list li:last-child,
.volume-list li:last-child,
.publication-list li:last-child {
  border-bottom: 0;
}

.empty-state {
  border: 1px dashed var(--line-strong);
  color: var(--muted);
  padding: 2.5rem 1.25rem;
  text-align: center;
}

.work-stack,
.book-stack,
.candidate-stack {
  display: grid;
  gap: 1.4rem;
}

.work-sheet {
  display: grid;
  grid-template-columns: 5rem minmax(0, 1fr);
  border-top: 3px solid var(--ink);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.work-index,
.book-index {
  border-right: 1px solid var(--line);
  color: var(--accent);
  font: 600 1.5rem/1 var(--serif);
  padding: 1.65rem 1rem;
  text-align: center;
  writing-mode: vertical-rl;
}

.work-content {
  min-width: 0;
  padding: clamp(1.25rem, 3vw, 2rem);
}

.work-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.5rem;
  border-bottom: 1px solid var(--line);
  padding-bottom: 1.15rem;
}

.work-header h2 {
  margin-bottom: 0.35rem;
}

.work-meta {
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
}

.source-line {
  margin: 1rem 0 0;
  color: var(--ink-soft);
  font-size: 0.84rem;
}

.work-columns {
  display: grid;
  grid-template-columns: minmax(0, 0.65fr) minmax(0, 1.35fr);
  gap: 2rem;
  padding-top: 1.4rem;
}

.subsection h3 {
  border-bottom: 1px solid var(--line);
  padding-bottom: 0.55rem;
}

.inline-form,
.form-grid {
  display: grid;
  gap: 0.75rem;
  margin-top: 1rem;
}

.inline-form {
  grid-template-columns: minmax(90px, 0.45fr) minmax(0, 1fr) auto;
  align-items: end;
}

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

.form-grid .full,
.form-actions {
  grid-column: 1 / -1;
}

.form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.seek-form {
  display: grid;
  min-width: 220px;
  grid-template-columns: minmax(130px, 1fr) auto;
  align-items: end;
  gap: 0.65rem;
}

.seek-form button {
  min-height: 2.65rem;
  font-size: 0.76rem;
}

.book-card {
  display: grid;
  grid-template-columns: 4rem minmax(0, 1fr);
  border: 1px solid var(--line);
  background: var(--surface);
}

.book-index {
  background: var(--ink);
  color: var(--paper);
}

.book-content {
  min-width: 0;
  padding: 1.4rem;
}

.book-topline {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 1rem;
}

.book-topline h2 {
  margin-bottom: 0.3rem;
  font-size: 1.35rem;
}

.book-filename {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 0.78rem;
  overflow-wrap: anywhere;
}

.book-actions {
  border-top: 1px solid var(--line);
  margin-top: 1.1rem;
  padding-top: 0.9rem;
}

.book-actions summary {
  width: fit-content;
  color: var(--accent-deep);
  cursor: pointer;
  font-weight: 700;
}

.book-actions[open] summary {
  margin-bottom: 1rem;
}

.book-action-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(220px, 0.75fr);
  gap: 1.25rem;
}

.binding-form,
.outbox-form,
.approve-form,
.review-form,
#direct-form {
  display: grid;
  gap: 0.75rem;
}

.binding-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.binding-form button {
  grid-column: 1 / -1;
}

.outbox-form {
  align-content: start;
}

.status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--line-strong);
  margin-bottom: 1.5rem;
}

.status-cell {
  min-height: 8.7rem;
  border-right: 1px solid var(--line);
  background: var(--surface);
  padding: 1.15rem;
}

.status-cell:last-child {
  border-right: 0;
}

.status-label {
  display: block;
  margin-bottom: 1.5rem;
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.11em;
}

.status-value {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font: 600 1.12rem var(--serif);
}

.status-dot {
  width: 0.52rem;
  height: 0.52rem;
  border-radius: 50%;
  background: var(--green);
}

.status-dot.off {
  background: var(--line-strong);
}

.acquisition-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--line);
  margin-bottom: 2rem;
  padding-bottom: 1.3rem;
}

.acquisition-toolbar p {
  max-width: 48rem;
  margin: 0;
  color: var(--muted);
  font-size: 0.83rem;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: 1.5rem;
  margin-bottom: 1.5rem;
}

.task-list li {
  display: grid;
  grid-template-columns: 4.4rem minmax(0, 1fr) auto;
  align-items: center;
  border-bottom: 1px solid var(--line);
  gap: 0.75rem;
  padding: 0.85rem 0;
}

.task-list li:last-child {
  border-bottom: 0;
}

.task-id {
  color: var(--muted);
  font: 600 0.82rem var(--serif);
}

.task-copy {
  min-width: 0;
  color: var(--ink-soft);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.task-list button {
  min-height: 2rem;
  font-size: 0.72rem;
  padding: 0.35rem 0.65rem;
}

.task-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.45rem;
}

.task-list .task-copy:only-child {
  grid-column: 1 / -1;
}

.candidate-card {
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.candidate-card .candidate-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 1rem;
  border-bottom: 1px solid var(--line);
  padding: 1.25rem 1.4rem;
}

.candidate-card .candidate-body {
  padding: 1.3rem 1.4rem;
}

.candidate-head h3 {
  margin: 0;
  font-size: 1.25rem;
}

.candidate-kicker {
  margin-bottom: 0.3rem;
  color: var(--muted);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
}

.status-badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 99px;
  background: var(--paper-deep);
  color: var(--ink-soft);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  padding: 0.26rem 0.62rem;
  white-space: nowrap;
}

.status-discovered,
.status-pending,
.status-running {
  border-color: #d3b66f;
  background: var(--amber-pale);
  color: var(--amber);
}

.status-imported,
.status-succeeded,
.status-approved {
  border-color: #91ad98;
  background: var(--green-pale);
  color: var(--green);
}

.status-needs_review {
  border-color: #c99268;
  background: #f2dfd0;
  color: #8a4b27;
}

.status-rejected,
.status-failed {
  border-color: #c89999;
  background: var(--danger-pale);
  color: var(--danger);
}

.candidate-card .approve-form,
.candidate-card .review-form,
#direct-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.candidate-card .form-actions,
#direct-form .form-actions {
  grid-column: 1 / -1;
}

.notice {
  border-left: 3px solid var(--amber);
  background: var(--amber-pale);
  color: #604616;
  padding: 0.8rem 1rem;
}

.site-footer {
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  padding: 1.4rem 0 2.5rem;
}

.login-page {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: 2rem;
}

.login-page::before {
  left: 8vw;
}

.login-shell {
  width: min(880px, 100%);
  display: grid;
  grid-template-columns: minmax(260px, 0.85fr) minmax(320px, 1.15fr);
  border: 1px solid var(--line-strong);
  background: var(--surface);
  box-shadow: 0 30px 90px rgb(63 43 28 / 18%);
}

.login-cover {
  min-height: 34rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-right: 1px solid #4c1d17;
  background: var(--accent-deep);
  color: #fff7eb;
  padding: 2.4rem;
}

.login-cover .cover-mark {
  width: 3.2rem;
  height: 4rem;
  display: grid;
  place-items: center;
  border: 1px solid rgb(255 247 235 / 55%);
  font: 600 1.4rem var(--serif);
}

.login-cover h1 {
  margin: 0;
  font-size: clamp(2.6rem, 7vw, 4.6rem);
  letter-spacing: -0.05em;
}

.login-cover p {
  margin: 0;
  color: rgb(255 247 235 / 72%);
  font-size: 0.75rem;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.login-form-panel {
  display: grid;
  align-content: center;
  padding: clamp(2rem, 6vw, 4.5rem);
}

.login-form-panel h2 {
  margin-bottom: 0.35rem;
}

.login-form-panel form {
  display: grid;
  gap: 1rem;
  margin-top: 2rem;
}

.login-form-panel button {
  margin-top: 0.5rem;
}

@media (max-width: 900px) {
  .nav-shell {
    grid-template-columns: 1fr auto;
    gap: 0.8rem 1rem;
    padding-top: 1rem;
  }

  .main-nav {
    grid-column: 1 / -1;
    grid-row: 2;
    overflow-x: auto;
  }

  .main-nav a {
    padding-block: 0.7rem 0.85rem;
    white-space: nowrap;
  }

  .home-hero,
  .page-heading,
  .work-columns,
  .dashboard-grid,
  .book-action-grid {
    grid-template-columns: 1fr;
  }

  .folio {
    justify-self: start;
  }

  .work-header {
    grid-template-columns: 1fr;
  }

  .seek-form {
    max-width: 35rem;
  }
}

@media (max-width: 700px) {
  body::before {
    left: 1rem;
  }

  .shell {
    width: min(100% - 2rem, 1160px);
  }

  .site-header {
    position: static;
  }

  .brand-tagline {
    display: none;
  }

  .main-nav {
    width: calc(100vw - 2rem);
  }

  .main-nav a {
    font-size: 0.75rem;
    padding-inline: 0.5rem;
  }

  .page {
    padding-top: 2.8rem;
  }

  .home-hero {
    min-height: auto;
    padding-top: 3rem;
  }

  .home-columns,
  .result-grid,
  .candidate-group-items,
  .form-grid,
  .candidate-card .approve-form,
  .candidate-card .review-form,
  #direct-form,
  .binding-form {
    grid-template-columns: 1fr;
  }

  .form-grid .full,
  .form-actions,
  .candidate-card .form-actions,
  #direct-form .form-actions,
  .binding-form button {
    grid-column: auto;
  }

  .search-bar {
    grid-template-columns: 1fr;
  }

  .search-bar button {
    width: 100%;
  }

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

  .status-cell:nth-child(2) {
    border-right: 0;
  }

  .status-cell:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }

  .acquisition-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .work-sheet,
  .book-card {
    grid-template-columns: 2.8rem minmax(0, 1fr);
  }

  .work-index,
  .book-index {
    padding-inline: 0.65rem;
  }

  .inline-form,
  .seek-form {
    grid-template-columns: 1fr;
  }

  .task-list li {
    grid-template-columns: 3.4rem minmax(0, 1fr);
  }

  .task-actions {
    grid-column: 2;
    justify-self: start;
  }

  .candidate-card .candidate-head {
    grid-template-columns: 1fr;
  }

  .book-topline {
    display: grid;
    grid-template-columns: 1fr;
  }

  .login-page {
    align-items: start;
    padding: 1rem;
  }

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

  .login-cover {
    min-height: 15rem;
    border-right: 0;
    border-bottom: 1px solid #4c1d17;
    padding: 1.6rem;
  }

  .login-cover h1 {
    font-size: 2.8rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Shelf-first information architecture */
.shelf-page { padding-bottom: 4.5rem; }
.shelf-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(16rem,.62fr); gap:3rem; align-items:end; min-height:25rem; padding:5.5rem 0 4.5rem; border-bottom:1px solid var(--line); }
.shelf-hero h1 { max-width:14ch; margin-bottom:1rem; }
.shelf-hero h1 em { color:var(--accent); font-style:normal; }
.shelf-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:0; background:var(--line); }
.shelf-stats div { min-height:8.5rem; display:flex; flex-direction:column; justify-content:end; padding:1rem; background:var(--surface); }
.shelf-stats dt,.work-counts dt { color:var(--muted); font-size:.7rem; font-weight:800; letter-spacing:.08em; }
.shelf-stats dd,.work-counts dd { margin:.25rem 0 0; font:600 clamp(1.9rem,4vw,3.4rem)/1 var(--serif); }
.reading-now,.shelf-section { padding-top:3.2rem; }
.continue-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.continue-card,.work-summary-card,.detail-panel { border:1px solid var(--line); background:var(--surface); box-shadow:var(--shadow); padding:1.45rem; }
.continue-card { min-height:14rem; display:flex; flex-direction:column; align-items:flex-start; }
.continue-card h3 { font-size:1.35rem; margin-bottom:.4rem; }
.continue-card .button-link { margin-top:auto; }
.empty-continue { background:var(--surface-strong); }
.shelf-columns { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(18rem,.75fr); gap:3rem; }
.shelf-book-list { display:grid; gap:1px; border:1px solid var(--line); background:var(--line); }
.shelf-book-row { display:grid; grid-template-columns:3.75rem minmax(0,1fr) auto; align-items:center; gap:1rem; min-height:6.8rem; background:var(--surface); padding-right:1rem; }
.shelf-book-row h3 { margin-bottom:.15rem; font-size:1.05rem; }
.shelf-book-row p { margin-bottom:0; }
.book-spine { align-self:stretch; display:grid; place-items:center; border-right:1px solid var(--line); color:var(--accent); font:600 1.1rem var(--serif); }
.row-actions { display:flex; flex-wrap:wrap; gap:.75rem; font-weight:700; font-size:.82rem; }
.coverage-section { max-width:32rem; }
.coverage-list,.plain-list { display:grid; gap:.8rem; padding:0; margin:0; list-style:none; }
.coverage-list li,.plain-list li { border-bottom:1px solid var(--line); padding:0 0 .8rem; }
.coverage-list strong { display:block; margin-bottom:.25rem; }
.coverage-list span,.coverage-copy { color:var(--muted); font-size:.8rem; overflow-wrap:anywhere; }
.open-code-note { display:flex; gap:1rem; align-items:flex-start; margin-top:4.5rem; border:1px solid #d4bb92; background:#fff8e9; padding:1.2rem 1.4rem; }
.open-code-note p { margin: .25rem 0 0; color:var(--ink-soft); }
.note-mark { display:grid; flex:0 0 2.25rem; width:2.25rem; height:2.25rem; place-items:center; border-radius:50%; background:var(--accent); color:white; font-size:1.25rem; }
.full-list { margin-bottom:1rem; }.full-list .shelf-book-row { min-height:7.7rem; }
.work-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.work-summary-card { display:flex; min-height:20rem; flex-direction:column; align-items:flex-start; }.work-summary-card h2 { font-size:1.5rem; }.alias-line { min-height:2.5rem; color:var(--muted); font-size:.83rem; }
.work-counts { display:grid; width:100%; grid-template-columns:repeat(3,1fr); gap:.5rem; margin:1rem 0; }.work-counts dd { font-size:1.45rem; }.work-summary-card .button-link { margin-top:auto; }
.back-link { display:inline-block; margin:2.2rem 0 1rem; font-weight:700; text-decoration:none; }.work-detail-hero { border-bottom:1px solid var(--line); padding:1.5rem 0 3rem; }.work-detail-hero h1 { font-size:clamp(2.4rem,6vw,4.6rem); max-width:16ch; }.alias-chips { display:flex; flex-wrap:wrap; gap:.5rem; }.alias-chips span { border:1px solid var(--line); background:var(--surface); padding:.35rem .6rem; color:var(--ink-soft); font-size:.78rem; }
.detail-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:1rem; padding-top:2rem; }.detail-panel h2 { font-size:1.35rem; }.detail-panel h3 { margin-top:1.8rem; font-size:.9rem; color:var(--muted); }.profile-card { border-top:1px solid var(--line); margin-top:1rem; padding-top:1rem; font-size:.85rem; }.profile-card p { margin-bottom:.4rem; }.profile-card ul { padding-left:1rem; margin:.4rem 0; }.related-books { padding-top:3rem; }
.activity-timeline { border-left:1px solid var(--line-strong); margin-left:.6rem; padding-left:2rem; }.activity-entry { position:relative; margin-bottom:1.8rem; padding:1.15rem 1.3rem; border:1px solid var(--line); background:var(--surface); }.activity-dot { position:absolute; left:calc(-2rem - 7px); top:1.5rem; width:13px; height:13px; border:3px solid var(--paper); border-radius:50%; background:var(--accent); }.activity-meta { display:flex; gap:.75rem; align-items:center; }.activity-entry h2 { margin:.6rem 0 .2rem; font-size:1.2rem; }.legacy-state { margin-top:3rem; border:1px solid var(--line); background:var(--surface); padding:1rem; }.legacy-state summary { cursor:pointer; font-weight:700; }.legacy-state pre { overflow:auto; font-size:.75rem; white-space:pre-wrap; }

/* EPUB reader */
.reader-page { --reader-paper:#f9f6ed; --reader-ink:#29251f; --reader-edge:#ded6c7; --reader-width:52rem; --reader-font-size:18px; --reader-line-height:1.9; background:var(--reader-paper); color:var(--reader-ink); }
.reader-page.reader-theme-night { --reader-paper:#1d211f; --reader-ink:#e8e2d7; --reader-edge:#414842; }.reader-page.reader-theme-mist { --reader-paper:#edf0ef; --reader-ink:#26302e; --reader-edge:#c7d1cc; }
.reader-header { position:sticky; z-index:5; top:0; border-bottom:1px solid var(--reader-edge); background:color-mix(in srgb,var(--reader-paper) 94%,transparent); backdrop-filter:blur(12px); }.reader-topbar,.reader-controls { width:min(100% - 2rem,1200px); margin:auto; display:flex; align-items:center; gap:1rem; }.reader-topbar { min-height:4.4rem; justify-content:space-between; }.reader-back,.reader-download { font-size:.8rem; font-weight:700; text-decoration:none; }.reader-title { display:grid; text-align:center; min-width:0; }.reader-title strong,.reader-title span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.reader-title span { color:var(--muted); font-size:.72rem; }.reader-controls { min-height:3.6rem; overflow-x:auto; padding-bottom:.65rem; }.reader-controls button { min-height:2.1rem; padding:.35rem .65rem; white-space:nowrap; }.reader-controls label { min-width:5.5rem; flex:0 0 auto; font-size:.64rem; }.reader-controls select,.reader-controls input { min-height:2rem; padding:.2rem .35rem; }.reader-controls input { padding:0; }.reader-controls output { min-width:3rem; font-variant-numeric:tabular-nums; font-weight:800; }
.reader-layout { position:relative; }.reader-stage { min-height:calc(100vh - 8rem); }.reader-stage iframe { display:block; width:100%; height:calc(100vh - 8rem); border:0; background:var(--reader-paper); }.reader-loading,.reader-error { position:fixed; z-index:2; left:50%; top:50%; transform:translate(-50%,-50%); margin:0; padding:.75rem 1rem; border:1px solid var(--reader-edge); background:var(--reader-paper); box-shadow:var(--shadow); }.reader-error { color:var(--danger); max-width:min(32rem,calc(100vw - 2rem)); }.reader-toc { position:fixed; z-index:10; inset:8rem auto 0 0; width:min(22rem,calc(100vw - 2rem)); overflow:auto; border-right:1px solid var(--reader-edge); background:var(--reader-paper); box-shadow:10px 0 30px rgb(0 0 0 / 12%); padding:1rem; }.reader-toc-heading { display:flex; align-items:center; justify-content:space-between; }.reader-toc-heading h2 { margin:0; font-size:1.25rem; }.reader-toc-heading button { min-height:2rem; padding:.2rem .6rem; }.reader-toc ol { display:grid; gap:.25rem; padding:0; list-style:none; }.reader-toc button { display:block; width:100%; border:0; background:transparent; color:var(--reader-ink); padding:.55rem .4rem; text-align:left; font:inherit; }.reader-toc button:hover,.reader-toc button[aria-current="true"] { background:rgb(127 106 80 / 12%); transform:none; }
@media (max-width:900px) { .shelf-hero,.shelf-columns,.detail-grid { grid-template-columns:1fr; }.coverage-section { max-width:none; }.continue-grid,.work-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) { .shelf-hero { min-height:auto; gap:2rem; padding:3rem 0; }.shelf-stats div { min-height:6rem; padding:.7rem; }.shelf-stats dd { font-size:2rem; }.continue-grid,.work-card-grid { grid-template-columns:1fr; }.shelf-book-row { grid-template-columns:2.7rem minmax(0,1fr); gap:.65rem; padding:.75rem; padding-left:0; }.row-actions { grid-column:2; }.full-list .shelf-book-row { min-height:auto; }.reader-topbar { gap:.5rem; }.reader-title { max-width:40vw; }.reader-controls { width:calc(100% - 1rem); display:grid; grid-template-columns:auto auto minmax(7rem,1fr) auto; gap:.35rem .5rem; overflow:visible; padding-bottom:.55rem; }.reader-controls label { width:100%; min-width:0; }.reader-controls select,.reader-controls input { width:100%; }.reader-controls output { grid-column:1/-1; justify-self:end; min-height:1rem; }.reader-download { font-size:0; }.reader-download::before { content:"下载"; font-size:.8rem; }.reader-stage iframe { height:calc(100vh - 12.5rem); }.reader-toc { inset:12rem auto 0 0; }.activity-timeline { padding-left:1.4rem; }.activity-dot { left:calc(-1.4rem - 7px); } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }
