:root {
  --v2-ink: #211817;
  --v2-muted: #74635d;
  --v2-paper: #f4ead8;
  --v2-paper-light: #fffaf0;
  --v2-line: #cdbb9d;
  --v2-wine: #5c111d;
  --v2-wine-dark: #35070f;
  --v2-gold: #b88932;
  --v2-gold-pale: #dcc58e;
  --v2-teal: #226a70;
  --v2-shadow: rgba(42, 19, 15, .18);
  --v2-display: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, serif;
  --v2-body: "Avenir Next Condensed", "Gill Sans", "Trebuchet MS", sans-serif;
}

.v2-body {
  min-height: 100vh;
  background:
    linear-gradient(180deg, var(--v2-wine-dark) 0 118px, transparent 118px),
    radial-gradient(circle at 16% 12%, rgba(184, 137, 50, .16), transparent 27rem),
    radial-gradient(circle at 88% 36%, rgba(92, 17, 29, .12), transparent 30rem),
    repeating-linear-gradient(90deg, rgba(74, 50, 36, .025) 0 1px, transparent 1px 5px),
    #e9ddc9;
  color: var(--v2-ink);
  font-family: var(--v2-body);
}


.v2-body button,
.v2-body input,
.v2-body select,
.v2-body textarea {
  border-radius: 2px;
  font-family: var(--v2-body);
}

.v2-body button {
  border-color: var(--v2-line);
  background: #fbf5e9;
}

.v2-body button:hover:not(:disabled) {
  border-color: var(--v2-wine);
  box-shadow: inset 0 -2px 0 rgba(92, 17, 29, .12);
}

.v2-shell {
  width: min(1480px, calc(100vw - 40px));
  margin: 0 auto;
  padding: 0 0 50px;
}

.v2-header {
  min-height: 118px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  color: #fff8ec;
}

.v2-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  color: inherit;
  text-decoration: none;
}

.v2-brand strong {
  display: block;
  font-family: var(--v2-display);
  font-size: clamp(25px, 3vw, 38px);
  letter-spacing: .02em;
}

.v2-sigil {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(220, 197, 142, .72);
  color: var(--v2-gold-pale);
  font-family: var(--v2-display);
  font-size: 29px;
  transform: rotate(45deg);
}

.v2-sigil span {
  transform: rotate(-45deg);
}

.v2-kicker,
.v2-overline {
  display: block;
  margin: 0 0 4px;
  color: var(--v2-gold-pale);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.v2-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.v2-body .status-pill {
  border-color: rgba(220, 197, 142, .42);
  background: rgba(27, 3, 8, .32);
  color: #f9edda;
}

.v2-modebar {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 12px 18px;
  border: 1px solid #aa9270;
  background: rgba(255, 249, 236, .95);
  box-shadow: 0 12px 32px var(--v2-shadow);
}

.v2-mode-switch {
  display: flex;
  gap: 4px;
  padding: 4px;
  background: #e6d6bd;
}

.v2-mode {
  min-height: 36px;
  border: 0 !important;
  background: transparent !important;
  color: var(--v2-muted);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .03em;
}

.v2-mode.active {
  background: var(--v2-wine) !important;
  color: #fff7e9;
  box-shadow: 0 4px 10px rgba(72, 10, 20, .25);
}


.v2-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 40px;
  align-items: end;
  padding: 38px 20px 26px;
}

.v2-hero h1 {
  max-width: 760px;
  margin: 0;
  color: var(--v2-wine-dark);
  font-family: var(--v2-display);
  font-size: clamp(38px, 5vw, 68px);
  font-weight: 600;
  line-height: .98;
  letter-spacing: -.035em;
}

.v2-hero > div > p:last-child {
  max-width: 700px;
  margin: 15px 0 0;
  color: var(--v2-muted);
  font-family: var(--v2-display);
  font-size: 17px;
  line-height: 1.45;
}

.v2-hero-note {
  padding: 16px 0 3px 18px;
  border-left: 3px solid var(--v2-gold);
}

.v2-hero-note span,
.v2-hero-note small,
.v2-hero-note strong {
  display: block;
}

.v2-hero-note span {
  color: var(--v2-wine);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.v2-hero-note strong {
  margin: 4px 0;
  font-family: var(--v2-display);
  font-size: 18px;
}

.v2-hero-note small {
  color: var(--v2-muted);
  line-height: 1.4;
}

.v2-command-card,
.v2-editor,
.v2-context .side-section {
  border: 1px solid var(--v2-line);
  background: linear-gradient(rgba(255, 250, 240, .94), rgba(255, 250, 240, .94));
  box-shadow: 0 12px 36px var(--v2-shadow);
}

.v2-command-card {
  padding: 20px;
  border-top: 4px solid var(--v2-wine);
}

.v2-command-top,
.v2-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.v2-command-top {
  margin-bottom: 18px;
}

.v2-command-top h2,
.v2-panel-heading h2 {
  margin: 0;
  color: var(--v2-wine-dark);
  font-family: var(--v2-display);
  font-size: 24px;
}

.v2-section-number {
  margin: 0 0 2px;
  color: var(--v2-gold);
  font-family: var(--v2-display);
  font-size: 12px;
  font-weight: 800;
}

.v2-body .tabs {
  width: min(410px, 100%);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.v2-body .tab {
  border-color: #bca98b;
  background: transparent;
  color: var(--v2-muted);
  font-weight: 800;
}

.v2-body .tab.active {
  border-color: var(--v2-wine);
  background: var(--v2-wine);
  color: #fff8eb;
}

.v2-prompt-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
}

.v2-body input,
.v2-body select,
.v2-body textarea,
.v2-body .check-list {
  border-color: #c9b99f;
  background: rgba(255, 253, 247, .92);
}

.v2-body input:focus,
.v2-body select:focus,
.v2-body textarea:focus {
  border-color: var(--v2-teal);
  outline: 2px solid rgba(34, 106, 112, .16);
  outline-offset: 1px;
}

.v2-body #draftButton,
.v2-body button.primary {
  border-color: var(--v2-wine);
  background: var(--v2-wine);
  color: #fff9ed;
}

.v2-body #draftButton {
  min-width: 180px;
}

.v2-body #draftButton:hover,
.v2-body button.primary:hover {
  background: var(--v2-wine-dark);
}

.v2-workspace {
  display: grid;
  grid-template-columns: minmax(560px, 1fr) minmax(360px, 430px);
  gap: 18px;
  align-items: start;
  margin-top: 18px;
}

.v2-editor {
  min-width: 0;
  padding: 0 22px 22px;
}

.v2-panel-heading {
  margin: 0 -22px 22px;
  padding: 17px 22px;
  border-bottom: 1px solid var(--v2-line);
  background: rgba(232, 215, 189, .55);
}

.v2-panel-state {
  padding: 5px 8px;
  border: 1px solid rgba(34, 106, 112, .35);
  background: rgba(34, 106, 112, .08);
  color: var(--v2-teal);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.v2-body label span,
.v2-body .field-label {
  color: #67574f;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.v2-body .form-grid {
  gap: 14px;
  margin-bottom: 16px;
}

.v2-body textarea {
  min-height: 300px;
  font-family: var(--v2-display);
  font-size: 16px;
  line-height: 1.55;
}

.v2-body .check-list {
  border-radius: 2px;
}

.v2-body .check-row.checked {
  border-color: rgba(34, 106, 112, .45);
  background: rgba(34, 106, 112, .08);
}

.v2-body .selection-chip {
  border-color: var(--v2-teal);
  background: rgba(34, 106, 112, .08);
  color: #174f54;
}

.v2-editor-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: end;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--v2-line);
}

.v2-body .notice {
  margin: 0;
  border-radius: 2px;
  background: rgba(232, 215, 189, .4);
}

.v2-editor-footer .actions-row {
  grid-template-columns: auto auto;
  margin: 0;
}

.v2-editor-footer #createButton {
  min-width: 180px;
}

.v2-context {
  position: sticky;
  top: 14px;
}

.v2-context .side-section {
  border-radius: 0;
}

.v2-context .side-section summary {
  padding: 15px 17px;
  color: var(--v2-wine-dark);
  font-family: var(--v2-display);
  font-size: 18px;
}

.v2-context .side-section[open] summary {
  border-bottom-color: var(--v2-line);
  background: rgba(232, 215, 189, .5);
}

.v2-body .result-card,
.v2-body .source-card,
.v2-body .image-card,
.v2-body .reference-item,
.v2-body .selected-image {
  border-radius: 2px;
  border-color: var(--v2-line);
  background: rgba(255, 253, 247, .9);
}

.v2-body .result-card a {
  color: var(--v2-wine);
}

.v2-body .image-generator,
.v2-body .image-reference-panel,
.v2-body .generated-image,
.v2-body .image-upload,
.v2-body .image-empty {
  border-radius: 2px;
  border-color: #bda98a;
  background: rgba(232, 215, 189, .32);
}

.v2-body .image-actions,
.v2-body .image-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 1080px) {
  .v2-hero { grid-template-columns: 1fr; gap: 16px; }
  .v2-hero-note { max-width: 620px; }
  .v2-workspace { grid-template-columns: 1fr; }
  .v2-context { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v2-context .side-section:last-child { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .v2-shell { width: min(100vw - 18px, 720px); }
  .v2-header,
  .v2-modebar,
  .v2-command-top,
  .v2-panel-heading { align-items: flex-start; flex-direction: column; }
  .v2-header { padding: 20px 0; }
  .v2-header-actions { width: 100%; justify-content: space-between; }
  .v2-hero { padding: 30px 8px 22px; }
  .v2-hero h1 { font-size: 42px; }
  .v2-command-card,
  .v2-editor { padding-right: 14px; padding-left: 14px; }
  .v2-body .tabs,
  .v2-prompt-row,
  .v2-body .form-grid,
  .v2-editor-footer,
  .v2-context { grid-template-columns: 1fr; width: 100%; }
  .v2-panel-heading { margin-right: -14px; margin-left: -14px; padding-right: 14px; padding-left: 14px; }
  .v2-editor-footer .actions-row { grid-template-columns: 1fr; }
  .v2-editor-footer #createButton { min-width: 0; }
  .v2-context .side-section:last-child { grid-column: auto; }
}

.v2-target-search {
  display: grid;
  gap: 14px;
}

.v2-target-results {
  display: grid;
  gap: 8px;
  max-height: 260px;
  overflow: auto;
}

.v2-target-result {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid var(--v2-line);
  background: rgba(255, 253, 247, .86);
}

.v2-target-result strong,
.v2-target-result span {
  display: block;
}

.v2-target-result span {
  margin-top: 3px;
  color: var(--v2-muted);
  font-size: 12px;
}

.v2-update-draft-command {
  padding-top: 14px;
  border-top: 1px solid var(--v2-line);
}

.v2-target-banner {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto auto;
  gap: 22px;
  align-items: center;
  margin-top: 18px;
  padding: 15px 18px;
  border: 1px solid #8d6e39;
  border-left: 5px solid var(--v2-gold);
  background: linear-gradient(110deg, #3b0a12, var(--v2-wine));
  color: #fff8eb;
  box-shadow: 0 12px 30px rgba(42, 19, 15, .24);
}

.v2-target-banner span,
.v2-target-banner strong {
  display: block;
}

.v2-target-banner span {
  color: var(--v2-gold-pale);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.v2-target-banner strong {
  margin-top: 3px;
  font-family: var(--v2-display);
  font-size: 22px;
}

.v2-target-meta {
  color: #eadbc3;
  font-size: 12px;
}

.v2-target-banner a {
  color: #fff5df;
  font-weight: 800;
  text-underline-offset: 4px;
}

.v2-workspace.update-mode {
  grid-template-columns: minmax(270px, .72fr) minmax(460px, 1.22fr) minmax(330px, .9fr);
}

.v2-current-panel,
.v2-diff-panel {
  min-width: 0;
  border: 1px solid var(--v2-line);
  background: rgba(255, 250, 240, .94);
  box-shadow: 0 12px 36px var(--v2-shadow);
}

.v2-current-panel .v2-panel-heading,
.v2-diff-panel .v2-panel-heading {
  margin: 0;
}

.v2-panel-state.readonly {
  border-color: rgba(116, 99, 93, .38);
  background: rgba(116, 99, 93, .08);
  color: var(--v2-muted);
}

.v2-current-view {
  padding: 16px;
}

.v2-current-meta {
  margin-bottom: 12px;
  color: var(--v2-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.v2-current-view dl {
  display: grid;
  gap: 0;
  margin: 0;
}

.v2-current-view dl > div {
  padding: 10px 0;
  border-top: 1px solid rgba(205, 187, 157, .68);
}

.v2-current-view dt {
  margin-bottom: 4px;
  color: var(--v2-muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.v2-current-view dd {
  margin: 0;
  font-family: var(--v2-display);
  font-size: 14px;
  line-height: 1.45;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.v2-diff-list {
  display: grid;
  gap: 8px;
  max-height: 780px;
  padding: 14px;
  overflow: auto;
}

.v2-diff-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 9px;
  margin: 0;
  padding: 10px;
  border: 1px solid var(--v2-line);
  background: rgba(255, 253, 247, .86);
}

.v2-diff-row.changed {
  border-left: 3px solid var(--v2-teal);
}

.v2-diff-row.unchanged {
  opacity: .58;
}

.v2-diff-row > input {
  width: auto;
  margin: 2px 0 0;
}

.v2-restore-field {
  min-height: 30px;
  align-self: start;
  padding: 0 9px;
  border-color: rgba(34, 106, 112, .45) !important;
  color: var(--v2-teal);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .04em;
}

.v2-diff-copy,
.v2-diff-copy strong,
.v2-diff-values,
.v2-diff-values > span,
.v2-diff-values b {
  display: block;
}

.v2-diff-copy strong {
  color: var(--v2-wine-dark);
  font-family: var(--v2-display);
  font-size: 15px;
}

.v2-diff-copy em {
  float: right;
  color: var(--v2-teal);
  font-family: var(--v2-body);
  font-size: 9px;
  font-style: normal;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.v2-diff-values {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin-top: 8px;
}

.v2-diff-values > span {
  min-width: 0;
  padding: 7px;
  background: rgba(232, 215, 189, .32);
  font-family: var(--v2-display);
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.v2-diff-values b {
  margin-bottom: 3px;
  color: var(--v2-muted);
  font-family: var(--v2-body);
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.v2-diff-footer {
  display: grid;
  gap: 8px;
  padding: 14px;
  border-top: 1px solid var(--v2-line);
}

.v2-diff-footer small {
  color: var(--v2-muted);
  line-height: 1.35;
}

@media (max-width: 1280px) {
  .v2-workspace.update-mode {
    grid-template-columns: minmax(280px, .72fr) minmax(500px, 1.28fr);
  }

  .v2-workspace.update-mode .v2-diff-panel {
    grid-column: 1 / -1;
  }
}

@media (max-width: 1080px) {
  .v2-workspace.update-mode {
    grid-template-columns: 1fr;
  }

  .v2-workspace.update-mode .v2-diff-panel {
    grid-column: auto;
  }
}

@media (max-width: 760px) {
  .v2-target-banner,
  .v2-target-result,
  .v2-diff-values {
    grid-template-columns: 1fr;
  }

  .v2-target-banner,
  .v2-target-result {
    align-items: stretch;
  }

  .v2-diff-row {
    grid-template-columns: 18px minmax(0, 1fr);
  }

  .v2-restore-field {
    grid-column: 2;
    justify-self: start;
  }
}

.v2-workspace.update-mode .v2-context {
  position: static;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1280px) {
  .v2-workspace.update-mode .v2-context {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .v2-workspace.update-mode .v2-context .side-section:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .v2-workspace.update-mode .v2-context {
    grid-template-columns: 1fr;
  }

  .v2-workspace.update-mode .v2-context .side-section:last-child {
    grid-column: auto;
  }
}