.written-workspace__intro {
  display: grid;
  grid-template-columns: 10rem minmax(20rem, 1fr) minmax(16rem, .6fr);
  gap: 2rem;
  align-items: start;
  margin-bottom: 4rem;
}
.written-workspace__intro h2 {
  margin: 0;
  font: 400 clamp(2.6rem, 5vw, 4.5rem)/.95 var(--serif);
}
.written-workspace__intro p:last-child {
  margin: 0;
  color: var(--stone);
  font-family: var(--serif);
  line-height: 1.5;
}
.written-question-list {
  display: grid;
  gap: 2rem;
}
.written-question {
  border: 1px solid var(--rule);
  padding: clamp(1.5rem, 4vw, 3rem);
  background: var(--paper);
}
.written-question > header,
.written-admin-question > header {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: start;
  border-bottom: 1px solid var(--rule);
  padding-bottom: 1.5rem;
}
.written-question > header span,
.written-question > header strong,
.written-admin-question > header span,
.written-admin-question > header strong,
.written-answer > span,
.written-answer-comparison span {
  color: var(--stone);
  font-size: .78rem;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.written-question > header h2 {
  max-width: 55rem;
  margin: .55rem 0 0;
  font: 400 clamp(1.8rem, 3vw, 2.8rem)/1.1 var(--serif);
}
.written-question > header strong,
.written-admin-question > header > strong {
  color: var(--clay);
}
.written-question form,
.written-answer,
.written-answer-comparison,
.written-approval-actions {
  margin-top: 2rem;
}
.written-question__actions,
.written-approval-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: flex-start;
}
.written-approval-actions > form {
  flex: 1 1 24rem;
  margin: 0;
}
.written-answer > div,
.written-answer-comparison section > div {
  margin-top: 1rem;
  font: 400 1.05rem/1.65 var(--serif);
}
.written-answer > p,
.written-waiting {
  color: var(--stone);
}
.written-answer-comparison {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--rule);
  border: 1px solid var(--rule);
}
.written-answer-comparison section {
  padding: 1.5rem;
  background: var(--paper);
}
.written-feedback {
  margin: 1.5rem 0;
  padding: 1.2rem;
  border-left: 3px solid var(--clay);
  background: #f4e6e1;
}
.written-feedback p {
  margin: .5rem 0 0;
  white-space: pre-line;
}
.written-question-create,
.written-transfer {
  display: grid;
  grid-template-columns: minmax(18rem, .8fr) minmax(24rem, 1.2fr);
  gap: clamp(3rem, 8vw, 8rem);
  padding: 4rem 0;
  border-bottom: 1px solid var(--ink);
}
.written-question-create h2,
.written-transfer h2 {
  margin: .5rem 0;
  font: 400 clamp(2.6rem, 5vw, 4.5rem)/.95 var(--serif);
}
.written-question-create > div > p:last-child,
.written-transfer > div > p:last-child {
  color: var(--muted);
  line-height: 1.5;
}
.written-question-create form {
  display: grid;
  gap: 1.2rem;
}
.written-admin-questions {
  padding: 4rem 0;
}
.written-admin-question {
  scroll-margin-top: 2rem;
  margin-top: 2rem;
  border: 1px solid var(--rule);
  padding: clamp(1.5rem, 3vw, 2.5rem);
}
.written-admin-question.is-latest-answer {
  border-color: var(--clay);
  box-shadow: inset .3rem 0 0 var(--clay);
}
.written-answer-batch {
  scroll-margin-top: 2rem;
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(17rem, .6fr);
  gap: clamp(2rem, 6vw, 6rem);
  margin-top: 2rem;
  border: 1px solid var(--rule);
  padding: clamp(1.5rem, 4vw, 3rem);
  background: var(--paper);
}
.written-answer-batch.is-new {
  border-color: var(--clay);
  background: #f7ece7;
}
.written-answer-batch h2 {
  margin: .5rem 0;
  font: 400 clamp(2.4rem, 4vw, 4rem)/.95 var(--serif);
}
.written-answer-batch > div > p:not(.admin-index),
.written-answer-batch__action p {
  color: var(--muted);
}
.written-answer-batch ol {
  display: grid;
  gap: .5rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}
.written-answer-batch li a {
  display: grid;
  grid-template-columns: 2rem 1fr;
  gap: .8rem;
  border-top: 1px solid var(--rule);
  padding-top: .65rem;
  text-decoration: none;
}
.written-answer-batch li a:hover {
  color: var(--clay);
}
.written-answer-batch li span {
  color: var(--clay);
  font-size: .72rem;
}
.written-answer-batch__action {
  align-self: start;
  border-left: 1px solid var(--rule);
  padding-left: 2rem;
}
.written-answer-batch__action > strong {
  font: 400 1.6rem/1 var(--serif);
}
.written-answer-batch__action form {
  margin-top: 1.5rem;
}
.submission-list > a.has-new-answer-batch {
  margin-inline: -1rem;
  border-left: .3rem solid var(--clay);
  padding-inline: 1rem;
  background: #f7ece7;
}
.submission-list > a.has-new-answer-batch span,
.submission-list > a.has-new-answer-batch > div:nth-child(2) strong {
  color: var(--clay);
}
.written-admin-question > header h3 {
  max-width: 55rem;
  margin: .5rem 0 0;
  font: 400 clamp(1.8rem, 3vw, 2.8rem)/1.1 var(--serif);
}
.written-order-controls {
  display: flex;
  justify-content: flex-end;
  margin: .8rem 0;
}
.written-order-controls form {
  display: flex;
  gap: 1rem;
}
.written-order-controls button,
.written-admin-question > form > button,
.written-editor-actions button {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--clay);
  cursor: pointer;
  font: 600 .78rem/1 var(--sans);
  text-transform: uppercase;
}
.written-admin-question__form,
.written-editor-actions {
  display: grid;
  gap: 1.5rem;
  margin-top: 1.5rem;
}
.written-editor-actions {
  grid-template-columns: minmax(18rem, .65fr) minmax(24rem, 1.35fr);
  padding-top: 1.5rem;
  border-top: 1px solid var(--rule);
}
.written-editor-actions form {
  display: grid;
  gap: 1rem;
}
.written-editor-actions > p:only-child {
  grid-column: 1 / -1;
}
.written-closed-note {
  margin: 2rem 0;
  border-left: .3rem solid var(--clay);
  padding: 1.25rem 1.5rem;
  background: var(--soft);
}
.written-closed-note strong {
  font: 400 1.8rem/1 var(--serif);
}
.written-closed-note p {
  margin: .6rem 0 0;
  color: var(--muted);
}
.written-closed-note a {
  display: inline-block;
  margin-top: 1rem;
  color: var(--clay);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}
.written-transfer {
  align-items: center;
  background: var(--soft);
  padding-inline: clamp(1.5rem, 4vw, 3rem);
}
.written-transfer form {
  justify-self: start;
}
.written-history {
  padding: 4rem 0;
}
.written-history article {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  border-top: 1px solid var(--rule);
  padding: 1rem 0;
}
.written-history article span,
.written-history article p {
  margin: 0;
  color: var(--muted);
  font-size: .78rem;
}
.written-interview-callout {
  display: flex;
  justify-content: space-between;
  gap: 3rem;
  align-items: center;
  margin: 2rem 0;
  padding: 2rem;
  background: var(--soft);
}
.written-interview-callout h2 {
  margin: .4rem 0;
  font: 400 2.5rem/1 var(--serif);
}
.written-interview-callout p:last-child {
  max-width: 48rem;
  color: var(--muted);
}
.written-interview-callout form {
  margin: 0;
}
.written-interview-callout .admin-save {
  display: inline-flex;
  text-decoration: none;
  white-space: nowrap;
}
.account-nav {
  row-gap: .75rem;
}
@media (max-width: 760px) {
  .written-workspace__intro,
  .written-question-create,
  .written-transfer,
  .written-editor-actions,
  .written-answer-comparison {
    grid-template-columns: 1fr;
  }
  .written-question > header,
  .written-admin-question > header,
  .written-interview-callout {
    align-items: flex-start;
    flex-direction: column;
  }
  .written-workspace__intro {
    gap: 1.2rem;
  }
  .written-transfer {
    padding-block: 2rem;
  }
  .written-answer-batch {
    grid-template-columns: 1fr;
  }
  .written-answer-batch__action {
    border-top: 1px solid var(--rule);
    border-left: 0;
    padding-top: 1.5rem;
    padding-left: 0;
  }
  .written-history article {
    flex-direction: column;
    gap: .4rem;
  }
}

.written-question-library {
  margin-top: 3rem;
  padding: clamp(1.5rem, 4vw, 3rem);
  background: var(--soft);
  border-block: 1px solid var(--ink);
}
.written-question-library > header {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: start;
}
.written-question-library > header h2 {
  margin: .45rem 0;
  font: 400 clamp(2.2rem, 4vw, 3.8rem)/1 var(--serif);
}
.written-question-library > header p:last-child {
  max-width: 52rem;
  color: var(--muted);
  line-height: 1.5;
}
.written-question-library > header > a {
  color: var(--clay);
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}
.written-library-filters,
.question-library-filters {
  display: grid;
  grid-template-columns: minmax(14rem, 1fr) minmax(14rem, .65fr) auto;
  gap: 1rem;
  align-items: end;
  margin: 2rem 0;
}
.written-library-filters button,
.question-library-filters button {
  min-height: 3.2rem;
  border: 1px solid var(--ink);
  padding: .75rem 1.25rem;
  background: transparent;
  cursor: pointer;
  font-weight: 700;
}
.written-library-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
  margin-bottom: 1.5rem;
}
.written-library-option {
  display: flex;
  gap: .85rem;
  align-items: start;
  border: 1px solid var(--rule);
  padding: 1rem;
  background: var(--paper);
  cursor: pointer;
}
.written-library-option:hover { border-color: var(--ink); }
.written-library-option input { margin-top: .25rem; accent-color: var(--clay); }
.written-library-option span { display: grid; gap: .4rem; }
.written-library-option small {
  color: var(--clay);
  font-size: .72rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.written-library-option strong { font: 400 1.05rem/1.35 var(--serif); }
.written-library-option.is-added { opacity: .55; cursor: default; }
.written-save-to-library {
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
  align-items: end;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--rule);
}
.written-save-to-library label { display: grid; gap: .35rem; }
.written-save-to-library label span {
  color: var(--muted);
  font-size: .72rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.written-save-to-library select {
  min-height: 2.6rem;
  border: 1px solid var(--rule);
  padding: .5rem;
  background: var(--paper);
}
.written-save-to-library button {
  min-height: 2.6rem;
  border: 0;
  padding: .55rem 1rem;
  background: var(--ink);
  color: var(--paper);
  cursor: pointer;
  font-weight: 700;
}
.question-library-create {
  display: grid;
  grid-template-columns: minmax(18rem, .8fr) minmax(24rem, 1.2fr);
  gap: clamp(3rem, 8vw, 8rem);
  padding: 4rem 0;
  border-bottom: 1px solid var(--ink);
}
.question-library-create h2 {
  margin: .5rem 0;
  font: 400 clamp(2.6rem, 5vw, 4.5rem)/.95 var(--serif);
}
.question-library-create > div > p:last-child { color: var(--muted); line-height: 1.5; }
.question-library-create form { display: grid; gap: 1.2rem; }
.question-library-create__main {
  display: grid;
  grid-template-columns: minmax(20rem, 1fr) minmax(13rem, .38fr) auto;
  gap: 1rem;
  align-items: end;
}
.question-library-create__main .admin-save { min-height: 3.2rem; white-space: nowrap; }
.question-library-browser { padding: 4rem 0; }
.question-library-list { display: grid; gap: 1rem; }
.question-library-card { border: 1px solid var(--rule); padding: clamp(1.25rem, 3vw, 2rem); }
.question-library-card.is-archived { background: var(--soft); opacity: .75; }
.question-library-card > header {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1.25rem;
}
.question-library-card > header > div { display: flex; gap: 1rem; align-items: center; }
.question-library-card > header span,
.question-library-card > header strong,
.question-library-card > header small {
  color: var(--muted);
  font-size: .72rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.question-library-card > form { display: grid; gap: 1rem; }
.question-library-card__meta {
  display: grid;
  grid-template-columns: minmax(13rem, 20rem);
  gap: 1rem;
}
.question-library-card__actions { display: flex; gap: 1rem; justify-content: flex-end; }
.question-library-card__actions button {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--clay);
  cursor: pointer;
  font-weight: 700;
}
.question-library-card__actions .is-danger { color: #9b2d20; }
@media (max-width: 760px) {
  .written-question-library > header { display: block; }
  .written-question-library > header > a { display: inline-block; margin-top: 1rem; }
  .written-library-filters,
  .question-library-filters,
  .written-library-options,
  .question-library-create,
  .question-library-create__main,
  .question-library-card__meta { grid-template-columns: 1fr; }
  .written-save-to-library { align-items: stretch; flex-direction: column; }
  .question-library-card__actions { justify-content: flex-start; }
}

.written-answer-progress {
  display: grid;
  grid-template-columns: minmax(15rem, .55fr) minmax(18rem, 1.45fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: end;
  margin-bottom: 3rem;
  padding: 1.5rem 0;
  border-block: 1px solid var(--rule);
}
.written-answer-progress > div:first-child { display: grid; gap: .35rem; }
.written-answer-progress span {
  color: var(--clay);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.written-answer-progress strong { font: 400 1.65rem/1.1 var(--serif); }
.written-answer-progress p { margin: 0; color: var(--muted); font-size: .86rem; }
.written-answer-progress__bar {
  height: .4rem;
  overflow: hidden;
  background: var(--rule);
}
.written-answer-progress__bar i {
  display: block;
  height: 100%;
  background: var(--clay);
  transition: width .25s ease;
}
.written-answer-progress__review {
  display: inline-block;
  margin-top: .8rem;
  color: var(--clay);
  font-size: .8rem;
  font-weight: 700;
  text-decoration: none;
}
.written-answer-save-state {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  margin-top: .8rem;
  color: var(--muted);
  font-size: .82rem;
}
.written-answer-save-state span { font-weight: 700; }
.written-answer-save-state span[data-state="dirty"],
.written-answer-save-state span[data-state="saving"] { color: var(--clay); }
.written-answer-save-state span[data-state="error"] { color: #9b2d20; }
.written-answer-save-state span[data-state="saved"] { color: #42634b; }
.written-draft-review {
  margin: 4rem 0;
  padding: clamp(1.5rem, 4vw, 3rem);
  border: 1px solid var(--ink);
  background: var(--soft);
  scroll-margin-top: 2rem;
}
.written-draft-review > header {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: start;
}
.written-draft-review > header h2 {
  margin: .45rem 0;
  font: 400 clamp(2.3rem, 4vw, 3.8rem)/1 var(--serif);
}
.written-draft-review > header p:last-child { max-width: 52rem; color: var(--muted); line-height: 1.5; }
.written-draft-review > header > a { color: var(--clay); font-weight: 700; text-decoration: none; white-space: nowrap; }
.written-draft-review__answers { display: grid; gap: 1rem; margin-top: 2rem; }
.written-draft-review__answers article { padding: 1.5rem; border: 1px solid var(--rule); background: var(--paper); }
.written-draft-review__answers article > span {
  color: var(--clay);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.written-draft-review__answers h3 { margin: .5rem 0 1rem; font: 400 1.55rem/1.2 var(--serif); }
.written-draft-review__answers article > div { font: 400 1.02rem/1.6 var(--serif); }
.written-draft-review > form {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: center;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--ink);
}
.written-draft-review > form p { max-width: 42rem; margin: 0; color: var(--muted); }
.written-draft-review > form .button { white-space: nowrap; }
@media (max-width: 760px) {
  .written-answer-progress { grid-template-columns: 1fr; gap: 1.25rem; }
  .written-answer-save-state { align-items: flex-start; flex-direction: column; gap: .25rem; }
  .written-draft-review > header,
  .written-draft-review > form { align-items: flex-start; flex-direction: column; }
}