/* ============================================================================
   Performance · Admin
   Shares the journal's palette and typography. Layout is editorial-leaning:
   hairline rules, generous whitespace, no boxy gradients or shadows.
   ========================================================================== */

:root {
  --paper:      #f7f4ed;
  --paper-2:    #fbfaf6;
  --ink:        #1a1a1a;
  --ink-2:      #2c2c2c;
  --ink-muted:  #6b6b6b;
  --ink-faint:  #9b9b9b;
  --rule:       #1a1a1a;
  --rule-soft:  #d8d4c8;
  --rule-hair:  #ece8de;
  --red:        #b32a1f;
  --red-2:      #c0392b;
  --green:      #2f6a3a;

  --font-display: "Playfair Display", "Times New Roman", serif;
  --font-serif:   "Source Serif 4", "Source Serif Pro", Georgia, serif;
  --font-sans:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono:    ui-monospace, SFMono-Regular, "JetBrains Mono", Menlo, monospace;

  --shell-max:    1100px;
  --sidebar-w:    220px;
  --topbar-h:     52px;
  --ease:         cubic-bezier(.4,.0,.2,1);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: 16px;
  line-height: 1.55;
}

a {
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .15s var(--ease), border-color .15s var(--ease);
}
a:hover { color: var(--red); border-color: currentColor; }

code {
  font-family: var(--font-mono);
  font-size: .88em;
  background: var(--paper-2);
  padding: 1px 5px;
  border-radius: 2px;
  border: 1px solid var(--rule-hair);
}

::selection { background: rgba(179, 42, 31, .18); }

/* === Topbar =============================================================== */
.admin__topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--ink);
  color: var(--paper);
  height: var(--topbar-h);
  display: flex;
  align-items: center;
}
.admin__topbar-inner {
  width: 100%;
  padding: 0 48px 0 24px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.admin__menu-toggle {
  display: none;
  background: transparent;
  border: 0;
  padding: 8px;
  margin-left: -8px;
  cursor: pointer;
  color: var(--paper);
}
.admin__menu-toggle:focus-visible {
  outline: 2px solid var(--paper);
  outline-offset: 2px;
}
.admin__menu-icon {
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
  position: relative;
  transition: background .15s var(--ease);
}
.admin__menu-icon::before,
.admin__menu-icon::after {
  content: "";
  position: absolute;
  left: 0;
  width: 20px;
  height: 2px;
  background: currentColor;
  transition: transform .2s var(--ease), top .2s var(--ease);
}
.admin__menu-icon::before { top: -6px; }
.admin__menu-icon::after  { top:  6px; }
.admin__menu-toggle[aria-expanded="true"] .admin__menu-icon { background: transparent; }
.admin__menu-toggle[aria-expanded="true"] .admin__menu-icon::before { top: 0; transform: rotate(45deg); }
.admin__menu-toggle[aria-expanded="true"] .admin__menu-icon::after  { top: 0; transform: rotate(-45deg); }
.admin__brand {
  color: var(--paper);
  border: 0;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.admin__brand-mark {
  display: block;
  width: 20px;
  height: 20px;
  align-self: center;
  margin-right: 4px;
  filter: invert(1);
}
.admin__brand:hover { color: var(--paper); }
.admin__brand-name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 20px;
  letter-spacing: .01em;
}
.admin__brand-tag {
  font-family: var(--font-sans);
  font-size: 9px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(247, 244, 237, .65);
  position: relative;
  top: -1px;
}
.admin__topbar-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 18px;
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.admin__user { color: rgba(247, 244, 237, .7); }
.admin__logout { color: var(--paper); border: 0; }
.admin__logout:hover { color: var(--red-2); border: 0; }

/* === Layout =============================================================== */
.admin__layout {
  display: grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  min-height: calc(100vh - var(--topbar-h));
}

.admin__sidebar {
  background: var(--paper-2);
  border-right: 1px solid var(--rule-soft);
  padding: 28px 0;
  position: sticky;
  top: var(--topbar-h);
  align-self: start;
  height: calc(100vh - var(--topbar-h));
  display: flex;
  flex-direction: column;
}
.admin__nav { display: flex; flex-direction: column; }
.admin__nav-group {
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--red);
  padding: 0 24px 8px 27px;
  margin-top: 4px;
}
.admin__nav-group:not(:first-child) {
  margin-top: 10px;
}
.admin__nav-link {
  display: block;
  padding: 12px 24px;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-2);
  border: 0;
  border-left: 3px solid transparent;
}
.admin__nav-link:hover {
  background: rgba(0, 0, 0, .03);
  color: var(--red);
}
.admin__nav-link.is-active {
  color: var(--ink);
  border-left-color: var(--red);
  background: rgba(179, 42, 31, .05);
}
.admin__nav-link--divide {
  border-bottom: 1px solid var(--rule-soft);
  margin-bottom: 6px;
  padding-bottom: 14px;
}
.admin__nav-link--logout { display: none; }

.admin__sidebar-foot {
  margin-top: auto;
  padding: 16px 24px 0;
}
.admin__sidebar-legal {
  font-family: var(--font-sans);
  font-size: 10px;
  letter-spacing: .12em;
  color: var(--ink-faint);
  text-transform: uppercase;
}

.admin__main {
  padding: 36px 48px 80px;
  width: 100%;
  min-width: 0; /* allow children to shrink inside the grid track */
}
/* Forms with paragraph-style inputs read better narrower; everything
   else (tables, editor, symposium board) is allowed to use the full
   width of the main column. */
.admin__main > .form { max-width: 980px; }
.admin__main > .form--editor,
.admin__main > .form--symposium { max-width: none; }

/* === Page head =========================================================== */
.page__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 8px;
  margin-bottom: 12px;
}
.page__kicker {
  display: block;
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin-bottom: 8px;
}
.page__kicker a { color: var(--red); border-bottom-color: transparent; }
.page__kicker a:hover { border-bottom-color: currentColor; }
.page__title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 36px;
  line-height: 1.05;
  letter-spacing: -.005em;
  margin: 0;
}
/* For edit pages where the page__title echoes a long document title, a
   compact admin treatment is used instead of the display serif. */
.page__title--compact {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 18px;
  line-height: 1.3;
  letter-spacing: 0;
  color: var(--ink-2);
  max-width: 880px;
}
.page__actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
.page__empty {
  padding: 60px 20px;
  text-align: center;
  font-style: italic;
  color: var(--ink-muted);
  border: 1px dashed var(--rule-soft);
}

/* Compact breadcrumb used by edit pages that don't show a big page__head. */
.page__crumb {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  padding-bottom: 18px;
  margin-bottom: 28px;
  border-bottom: 1px solid var(--rule-soft);
}
.page__crumb a { color: var(--red); border-bottom-color: transparent; }
.page__crumb a:hover { border-bottom-color: currentColor; }

/* === Cards =============================================================== */
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
}
.card {
  background: var(--paper-2);
  border: 1px solid var(--rule-soft);
  padding: 24px 26px 26px;
}
.card--feature {
  background: linear-gradient(180deg, var(--paper-2), var(--paper));
  border-color: var(--ink);
}
.card__kicker {
  font-family: var(--font-sans);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin-bottom: 10px;
}
.card__title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 22px;
  line-height: 1.15;
  margin: 0 0 8px;
}
.card__title a { border: 0; }
.card__meta {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin: 0 0 14px;
}
.card__dek {
  margin: 0 0 14px;
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-2);
}
.card__status {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--green);
  margin: 0 0 14px;
}
.card__status--dirty { color: var(--red); }
.card__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.card__list { list-style: none; padding: 0; margin: 0; }
.card__list li {
  padding: 8px 0;
  border-top: 1px solid var(--rule-hair);
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.card__list li:first-child { border-top: 0; }
.card__list-meta {
  font-family: var(--font-sans);
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

/* === Buttons ============================================================= */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-sizing: border-box;
  height: 38px;
  line-height: 1;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: 0 18px;
  border: 1px solid var(--ink);
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  text-decoration: none;
  transition: background .15s var(--ease), color .15s var(--ease), border-color .15s var(--ease);
}
.btn:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.btn--primary { background: var(--ink); color: var(--paper); }
.btn--primary:hover { background: var(--red); border-color: var(--red); color: var(--paper); }
.btn--ghost { background: transparent; }
.btn--ghost:hover { background: rgba(0,0,0,.04); color: var(--ink); border-color: var(--ink); }
.btn--danger { border-color: var(--red); color: var(--red); }
.btn--danger:hover { background: var(--red); color: var(--paper); border-color: var(--red); }
.btn--small { height: 30px; padding: 0 12px; font-size: 11px; letter-spacing: .12em; }
.btn[disabled] { opacity: .4; cursor: not-allowed; }

.link-muted {
  background: transparent;
  border: 0;
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  cursor: pointer;
  padding: 4px 8px;
}
.link-muted:hover { color: var(--red); }

/* === Dropdown ============================================================ */
.dropdown { position: relative; display: inline-block; }
.dropdown__menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  min-width: 180px;
  background: var(--paper);
  border: 1px solid var(--rule);
  z-index: 20;
}
.dropdown__menu a {
  display: block;
  padding: 10px 16px;
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  border: 0;
  border-top: 1px solid var(--rule-hair);
}
.dropdown__menu a:first-child { border-top: 0; }
.dropdown__menu a:hover { background: var(--paper-2); color: var(--red); }

/* === Tables ============================================================== */
.table-wrap { overflow-x: auto; }
.table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-serif);
  font-size: 15px;
}
.table th {
  text-align: left;
  font-family: var(--font-sans);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-muted);
  font-weight: 600;
  padding: 12px 14px;
  border-bottom: 2px solid var(--rule);
}
.table td {
  padding: 14px;
  border-bottom: 1px solid var(--rule-hair);
  vertical-align: middle;
  line-height: 1.4;
}
.table tr:hover td { background: var(--paper-2); }
.table th.table__order { width: 60px; text-align: center; }
.table td.table__order { width: 60px; color: var(--ink-muted); font-family: var(--font-sans); font-size: 12px; text-align: center; }
.table th.table__type,
.table td.table__type { width: 180px; text-align: left; }
.table th.table__pages { width: 90px; text-align: center; }
.table td.table__pages { width: 90px; color: var(--ink-muted); font-family: var(--font-sans); font-size: 12px; text-align: center; }
.table th.table__actions,
.table td.table__actions { width: 80px; text-align: center; }
.table th.table__actions--wide,
.table td.table__actions--wide { width: 280px; text-align: right; white-space: nowrap; }
.table th.table__status,
.table td.table__status { width: 140px; }
.table th.table__date { width: 170px; white-space: nowrap; }
.table td.table__date { width: 170px; color: var(--ink-muted); font-family: var(--font-sans); font-size: 13px; white-space: nowrap; }

/* Issues table: distribute the two flexible columns (Volume, Label) evenly. */
.table--issues { table-layout: fixed; }
.table--issues th:nth-child(1),
.table--issues td:nth-child(1),
.table--issues th:nth-child(3),
.table--issues td:nth-child(3) { width: auto; }
.table__empty {
  text-align: center;
  font-style: italic;
  color: var(--ink-muted);
  padding: 40px 14px !important;
}
.table__action {
  display: inline-block;
  margin-left: 14px;
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  border: 0;
}
.table__action:first-child { margin-left: 0; }
.table__action:hover { color: var(--red); border: 0; }

/* Page-level toolbar above tables. */
.page__toolbar {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 18px;
}
.page__crumb-meta {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin-left: 6px;
}

/* Issue status badges. Soft pill, colored only for "current". */
.status-badge {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  padding: 4px 9px;
  border-radius: 2px;
  border: 1px solid var(--rule-soft);
  color: var(--ink-2);
  background: var(--paper-2);
}
.status-badge--current {
  color: var(--paper);
  background: var(--red);
  border-color: var(--red);
}
.status-badge--forthcoming {
  color: var(--ink);
  background: transparent;
  border-color: var(--ink);
}
.status-badge--published {
  color: var(--ink-muted);
}

/* Footer with delete on the left, save/back on the right. */
.form__footer--split {
  justify-content: space-between;
  align-items: center;
}
.form__footer--split .form__footer-right {
  display: flex;
  gap: 10px;
}
.form__inline { display: inline; margin: 0; padding: 0; }
.table__title-link {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 18px;
  line-height: 1.4;
  border: 0;
}
.table__title-link:hover { color: var(--red); border: 0; }
.table__sub {
  margin-top: 4px;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 13px;
  color: var(--ink-muted);
}

/* === Badges ============================================================== */
.badge {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  padding: 3px 10px;
  border: 1px solid var(--rule-soft);
  color: var(--ink-2);
  background: var(--paper);
  white-space: nowrap;
}
.badge--essay {
  color: var(--ink-2);
  background: var(--paper);
  border-color: var(--rule-soft);
}
.badge--foreword,
.badge--founding-statement {
  color: var(--ink); border-color: var(--ink);
  background: var(--paper-2);
}
.badge--article { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.badge--lead-article { background: var(--red); color: var(--paper); border-color: var(--red); }

/* === Forms =============================================================== */
.form { max-width: 920px; }
.form--narrow { max-width: 540px; }
.form--editor { max-width: 100%; }

.form__section {
  border: 0;
  border-top: 1px solid var(--rule-soft);
  padding: 28px 0 0;
  margin: 28px 0 0;
}
.form__section:first-of-type {
  border-top: 0;
  padding-top: 0;
  margin-top: 0;
}
/* The last child inside a section adds its own margin-bottom which would
   stack with the next section's margin-top — zero that out so the gap
   above the divider matches the 28px gap below it. */
.form__section > .form__row:last-child,
.form__section > .field:last-child { margin-bottom: 0; }
.form__section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}
.form__section-head .form__hint { margin: 0; }

/* Hero image preview + replace button. */
.hero-image {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}
.hero-image__preview {
  width: 220px;
  aspect-ratio: 16 / 9;
  background: var(--paper-2);
  border: 1px solid var(--rule-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}
.hero-image__preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hero-image__placeholder {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-faint);
}
.hero-image__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding-top: 6px;
}
.hero-image__actions .field__hint { margin: 0; }
.form__legend {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin-bottom: 18px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.form__legend-tools {
  display: inline-flex;
  gap: 6px;
  text-transform: none;
  letter-spacing: 0;
}

.form__row {
  display: flex;
  gap: 18px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
/* Spread variant: every field in the row gets an equal share of the
   available width (used for the volume/number/label/status/date row). */
.form__row--spread {
  flex-wrap: nowrap;
  align-items: flex-start;
}
.form__row--spread > .field {
  flex: 1 1 0;
  min-width: 0;
  position: relative;
  margin-bottom: 0;
}
/* Hints under a spread field shouldn't push the next field's input down. */
.form__row--spread > .field .field__hint {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 4px;
}
/* Fixed-height control band — every input's underline lands on the same line. */
.form__row--spread .field__control {
  display: flex;
  align-items: flex-end;
  height: 42px;
  box-sizing: border-box;
}
.form__row--spread .field__control .field__input {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0 0 9px;
  line-height: 1.55;
  box-sizing: border-box;
  font-size: 16px;
}
.form__row--spread .field__control select.field__input {
  padding-right: 22px;
  background-position: calc(100% - 14px) calc(100% - 14px),
                        calc(100% - 9px) calc(100% - 14px);
}
.form__row--spread .field__control .field__input[type="date"] {
  appearance: none;
  -webkit-appearance: none;
  font-family: var(--font-serif);
}
.form__row--spread .field__control .field__input[type="date"]::-webkit-date-and-time-value {
  text-align: left;
  line-height: 1.55;
}
.form__hint {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 14px;
  color: var(--ink-muted);
  margin: 0 0 18px;
}
.form__footer {
  margin-top: 56px;
  padding-top: 0;
  border-top: 0;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}
.form__actions { display: flex; gap: 10px; align-items: center; margin-top: 14px; }

.field {
  display: flex;
  flex-direction: column;
  margin-bottom: 28px;
  min-width: 0;
}
.field:last-child { margin-bottom: 0; }
/* ``display: flex`` on .field overrides the HTML [hidden] attribute in
   WebKit/Safari — force-hide type-conditional fields. */
.field[hidden],
.field.is-hidden {
  display: none !important;
}
.field--grow { flex: 1 1 240px; }
.field--narrow { flex: 0 0 auto; min-width: 140px; }
.field--half { flex: 0 0 calc(50% - 9px); }
.field__label {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin-bottom: 6px;
}
.field__hint {
  display: block;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 13px;
  color: var(--ink-muted);
  margin-top: 6px;
}
.field__input,
.field__textarea,
.select {
  font-family: var(--font-serif);
  font-size: 16px;
  color: var(--ink);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--rule);
  border-radius: 0;
  padding: 8px 0 9px;
  width: 100%;
  outline: none;
  transition: border-color .15s var(--ease);
}
.field__input:focus,
.field__textarea:focus,
.select:focus { border-bottom-color: var(--red); }
/* Title fields use the same styling as any other text input. */
.field__input--title { /* no-op kept for backwards-compatibility */ }
.field__textarea {
  resize: vertical;
  min-height: 100px;
  width: 100%;
  border: 1px solid var(--rule-soft);
  padding: 12px 14px;
  font-family: var(--font-serif);
  font-size: 15px;
  line-height: 1.55;
}
.field__textarea:focus { border-color: var(--red); }
.field__textarea--tall { min-height: 220px; }

select.field__input,
.select {
  appearance: none;
  padding-right: 22px;
  background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%),
                    linear-gradient(135deg, var(--ink) 50%, transparent 50%);
  background-position: calc(100% - 14px) 50%, calc(100% - 9px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  cursor: pointer;
}

.toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--ink-2);
  padding-top: 6px;
}
.toggle input { accent-color: var(--red); }

/* === Authors editor ====================================================== */
.authors-editor { margin: 8px 0 20px; }
.authors-editor__rows { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.author-row {
  display: grid;
  grid-template-columns: 1fr 1.4fr auto;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--rule-hair);
  background: var(--paper-2);
}
.author-row input {
  font-family: var(--font-serif);
  font-size: 14px;
  border: 0;
  background: transparent;
  border-bottom: 1px solid transparent;
  padding: 4px 0;
}
.author-row input:focus { outline: none; border-bottom-color: var(--rule); }
.author-row__remove {
  background: transparent;
  border: 0;
  color: var(--ink-muted);
  cursor: pointer;
  font-family: var(--font-sans);
  font-size: 14px;
  width: 28px;
  height: 28px;
}
.author-row__remove:hover { color: var(--red); }

/* === Paper image library ================================================= */
.paper-images { margin: 8px 0 4px; }
.paper-images__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 14px;
  margin-bottom: 12px;
}
.paper-images__grid:empty { display: none; }
.paper-images__actions {
  display: flex;
  align-items: center;
  gap: 14px;
}
.paper-images__actions .field__hint { margin: 0; }

.paper-image {
  border: 1px solid var(--rule-hair);
  background: var(--paper-2);
  display: flex;
  flex-direction: column;
}
.paper-image__name {
  display: block;
  padding: 8px 10px;
  border-bottom: 1px solid var(--rule-hair);
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-2);
  background: var(--paper);
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.paper-image__thumb {
  aspect-ratio: 4 / 3;
  background: var(--paper);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.paper-image__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.paper-image__actions {
  display: flex;
  gap: 6px;
  padding: 8px 10px 10px;
}
.paper-image__actions .btn { flex: 1; }

/* === Markdown editor ===================================================== */
.form__section--editor { padding-top: 32px; }
.md-editor__tabs {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.md-editor__tabs-tools { display: inline-flex; gap: 6px; }
.md-editor {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  border: 1px solid var(--rule);
  background: var(--paper-2);
  min-height: 540px;
  overflow: hidden;
}
.md-editor__source {
  border: 0;
  background: transparent;
  font-family: var(--font-mono);
  font-size: 14px;
  line-height: 1.55;
  padding: 18px 20px;
  resize: none;
  outline: none;
  border-right: 1px solid var(--rule-soft);
}
.md-editor__source:focus { background: var(--paper); }
.md-editor__preview {
  padding: 18px 24px;
  font-family: var(--font-serif);
  font-size: 16px;
  line-height: 1.7;
  background: var(--paper);
  overflow-y: auto;
  max-height: 70vh;
}
.md-editor__preview h2,
.md-editor__preview h3 {
  font-family: var(--font-display);
  font-weight: 600;
}
.md-editor__preview h2 { font-size: 24px; margin-top: 1.2em; }
.md-editor__preview h3 { font-size: 19px; }
.md-editor__preview p { margin: 0 0 1em; }
.md-editor__preview-loading { color: var(--ink-faint); font-style: italic; }

.md-editor.is-edit { grid-template-columns: 1fr; }
.md-editor.is-edit .md-editor__preview { display: none; }
.md-editor.is-edit .md-editor__source { border-right: 0; }
.md-editor.is-preview { grid-template-columns: 1fr; }
.md-editor.is-preview .md-editor__source { display: none; }

.tab {
  background: transparent;
  border: 1px solid var(--rule-soft);
  font-family: var(--font-sans);
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  padding: 5px 10px;
  cursor: pointer;
}
.tab.is-active {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}

/* === Login =============================================================== */
.login {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--paper);
  padding: 40px 20px;
}
.login__panel {
  width: 100%;
  max-width: 420px;
  background: var(--paper-2);
  border: 1px solid var(--ink);
  padding: 40px 36px 36px;
}
.login__head { text-align: center; margin-bottom: 28px; }
.login__kicker {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ink-muted);
}
.login__title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 32px;
  margin: 8px 0 4px;
}
.login__dek {
  font-style: italic;
  font-size: 14px;
  color: var(--ink-muted);
  margin: 0;
}
.login__form { display: flex; flex-direction: column; gap: 18px; margin-top: 8px; }
.login__form .btn { margin-top: 8px; }
.login__error {
  background: rgba(179, 42, 31, .08);
  color: var(--red);
  border: 1px solid var(--red);
  padding: 10px 14px;
  font-family: var(--font-sans);
  font-size: 13px;
  margin-bottom: 14px;
}
.login__hint {
  margin-top: 22px;
  text-align: center;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 13px;
  color: var(--ink-faint);
}

/* === Toast =============================================================== */
.toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 100;
  padding: 12px 18px;
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
  animation: toast-in .4s var(--ease), toast-out .4s var(--ease) 2.4s forwards;
}
.toast--success { background: var(--green); border-color: var(--green); }
.toast--error { background: var(--red); border-color: var(--red); max-width: min(520px, 90vw); white-space: normal; line-height: 1.4; text-transform: none; letter-spacing: 0; font-size: 13px; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes toast-out { to { opacity: 0; transform: translateY(8px); } }

/* === Modal =============================================================== */
dialog.modal {
  background: var(--paper);
  border: 1px solid var(--ink);
  padding: 28px 30px;
  max-width: 460px;
  width: calc(100% - 40px);
}
dialog.modal::backdrop { background: rgba(20, 20, 20, .55); }
.modal__title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 22px;
  margin: 0 0 10px;
}
.modal__body { margin: 0 0 22px; line-height: 1.55; color: var(--ink-2); }
.modal__actions { display: flex; gap: 10px; justify-content: flex-end; }

/* === Symposium movements ================================================= */
.movements { display: flex; flex-direction: column; gap: 18px; margin: 16px 0; }
.movement {
  border: 1px solid var(--rule-soft);
  background: var(--paper-2);
  padding: 16px 18px;
}
.movement--unassigned {
  margin-top: 24px;
  border-style: dashed;
  background: var(--paper);
}
.movement__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--rule-hair);
}
.movement__title {
  flex: 1;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 20px;
  border: 0;
  border-bottom: 1px solid transparent;
  background: transparent;
  padding: 4px 0;
  outline: none;
}
.movement__title:focus { border-bottom-color: var(--rule); }
.movement__title-static {
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-muted);
}
.movement__handle { cursor: grab; color: var(--ink-faint); font-size: 12px; line-height: 1; }
.movement__hint {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 13px;
  color: var(--ink-muted);
}
.movement__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 40px;
}
.movement__list.is-drop-target {
  background: rgba(179, 42, 31, .04);
  outline: 1px dashed var(--red);
  outline-offset: 2px;
}

.essay-chip {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 10px;
  align-items: baseline;
  padding: 8px 10px;
  background: var(--paper);
  border: 1px solid var(--rule-hair);
  cursor: grab;
}
.essay-chip:hover { border-color: var(--ink); }
.essay-chip.is-dragging { opacity: .4; }
.essay-chip--missing { color: var(--red); }
.essay-chip__handle { color: var(--ink-faint); font-size: 11px; }
.essay-chip__slug {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink-muted);
}
.essay-chip__title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.3;
}

/* === Publish ============================================================= */
.publish { display: grid; grid-template-columns: 1fr; gap: 28px; }
.publish__status,
.publish__actions,
.publish__log,
.publish__history {
  border: 1px solid var(--rule-soft);
  background: var(--paper-2);
  padding: 22px 26px;
}
.publish__head { font-family: var(--font-sans); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-muted); margin: 0 0 6px; }
.publish__msg { font-family: var(--font-display); font-size: 18px; margin: 0 0 12px; }
.publish__clean { color: var(--green); font-family: var(--font-sans); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; margin: 0; }
.publish__dirty strong { color: var(--red); display: block; margin-bottom: 6px; font-family: var(--font-sans); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.publish__diff,
.publish__output {
  font-family: var(--font-mono);
  font-size: 12.5px;
  line-height: 1.55;
  background: var(--ink);
  color: #d8d4c8;
  padding: 14px 16px;
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}
.publish__log-title,
.publish__history-title {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin: 0 0 12px;
}
.publish__history-list { list-style: none; padding: 0; margin: 0; }
.publish__history-list li {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  gap: 14px;
  padding: 8px 0;
  border-top: 1px solid var(--rule-hair);
  font-family: var(--font-serif);
  font-size: 14px;
}
.publish__history-list li:first-child { border-top: 0; }
.publish__history-msg { color: var(--ink-2); }
.publish__history-meta {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

/* === Responsive ========================================================== */
@media (max-width: 900px) {
  .admin__menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    order: 3;
    margin-left: auto;
    margin-right: -8px;
  }
  .admin__topbar-inner { padding: 0 16px; }
  .admin__layout { grid-template-columns: 1fr; position: relative; }
  .admin__sidebar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 40;
    height: auto;
    padding: 0;
    border-right: 0;
    border-bottom: 1px solid var(--rule-soft);
    background: var(--paper);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .08);
    display: none;
  }
  .admin__sidebar.is-open { display: flex; }
  .admin__nav { flex-direction: column; gap: 0; padding: 0; }
  .admin__nav-group { display: block; padding-top: 14px; }
  .admin__nav-link {
    border-left: 3px solid transparent;
    border-bottom: 1px solid var(--rule-hair);
    padding: 14px 24px;
  }
  .admin__nav-link.is-active { border-left-color: var(--red); border-bottom-color: var(--rule-hair); }
  .admin__nav-link--publish { margin-left: 0; }
  .admin__nav-link--divide { border-bottom: 1px solid var(--rule-soft); margin-bottom: 0; padding-bottom: 14px; }
  .admin__nav-link--logout {
    display: block;
    border-bottom: 0;
  }
  .admin__topbar-right { display: none; }
  .admin__sidebar-foot { display: none; }
  .admin__main { padding: 28px 22px 60px; }
  .page__head { flex-wrap: wrap; gap: 14px 18px; }
  .md-editor { grid-template-columns: 1fr; min-height: 0; }
  .md-editor__source { border-right: 0; border-bottom: 1px solid var(--rule-soft); min-height: 360px; }
  .essay-chip { grid-template-columns: 16px 1fr; }
  .essay-chip__slug { display: none; }
}

/* === Narrow-screen Issues list (stacked card layout) ==================== */
@media (max-width: 720px) {
  .admin__main { padding: 22px 16px 48px; }
  .page__title { font-size: 28px; }

  /* Title + New button share row 1; issue selector wraps to row 2 full-width. */
  .page__head { flex-wrap: wrap; align-items: center; row-gap: 14px; }
  .page__actions { display: contents; }
  .page__title { flex: 1 1 auto; min-width: 0; order: 1; }
  .page__actions > .dropdown,
  .page__actions > .btn { order: 2; }
  .page__actions > .select { order: 3; flex: 1 1 100%; width: 100%; min-width: 0; }

  /* Issue new/edit forms: each field takes a full row, full width. */
  .form__row,
  .form__row--spread {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 0;
    margin-bottom: 0;
  }
  .form__row > .field,
  .form__row--spread > .field {
    flex: 1 1 auto;
    width: 100%;
    margin-bottom: 22px;
  }
  .form__row > .field:last-child,
  .form__row--spread > .field:last-child { margin-bottom: 0; }
  .form__row--spread > .field .field__hint {
    position: static;
    margin-top: 6px;
  }
  .field__control,
  .form__row--spread .field__control { width: 100%; }
  .field__input,
  .field__textarea,
  .select { width: 100%; max-width: 100%; }

  /* Split footer (Delete | Back · Save) wraps to two rows when tight. */
  .form__footer--split { flex-wrap: wrap; gap: 14px; }
  .form__footer--split .form__footer-right { flex-wrap: wrap; }

  .table-wrap { overflow-x: visible; }
  .table--issues { display: block; table-layout: auto; border-top: 1px solid var(--rule-hair); }
  .table--issues thead { display: none; }
  .table--issues tbody,
  .table--issues tr,
  .table--issues td { display: block; width: auto; }
  .table--issues tr {
    padding: 16px 4px 18px;
    border-bottom: 1px solid var(--rule-hair);
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "title  status"
      "date   papers";
    column-gap: 14px;
    row-gap: 6px;
    align-items: center;
  }
  .table--issues tr:hover td { background: transparent; }
  .table--issues td {
    padding: 0;
    border: 0;
    width: auto !important;
  }
  .table--issues td:nth-child(1) { grid-area: title; }
  .table--issues td:nth-child(2) { grid-area: date; font-size: 12px; }
  .table--issues td:nth-child(3) { display: none; }
  .table--issues td:nth-child(4) { grid-area: status; justify-self: end; }
  .table--issues td:nth-child(5) {
    grid-area: papers;
    justify-self: end;
    font-size: 12px;
  }
  .table--issues td.table__pages::before { content: "Papers: "; color: var(--ink-muted); }
  .table--issues .table__title-link { font-size: 20px; }
  .table--issues .table__empty {
    grid-column: 1 / -1;
    padding: 28px 8px !important;
  }

  /* Papers list: hide order column + author sub-line; soften the title. */
  .table-wrap:has(.table--papers) { overflow-x: visible; }
  .table--papers { table-layout: auto; }
  .table--papers th.table__order,
  .table--papers td.table__order { display: none; }
  .table--papers .table__sub { display: none; }
  .table--papers .table__title-link {
    font-family: var(--font-serif);
    font-weight: 500;
    font-size: 15px;
    line-height: 1.4;
  }
  .table--papers th.table__type,
  .table--papers td.table__type { width: auto; }
  .table--papers th.table__pages,
  .table--papers td.table__pages { display: none; }
  .table--papers td { padding: 12px 10px; }
}