:root {
  color-scheme: light;
  --bg: #eef2f1;
  --surface: #ffffff;
  --surface-soft: #f7faf8;
  --ink: #172126;
  --muted: #667078;
  --line: #d9ded8;
  --brand: #176b87;
  --brand-dark: #0e4a5d;
  --pilot-red: #ed1c24;
  --pilot-red-dark: #c9151c;
  --green: #4d7c57;
  --rose: #b65a4b;
  --shadow: 0 12px 28px rgba(23, 33, 38, 0.09);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

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

@media screen and (min-width: 781px) {
  body {
    min-height: 133.3333vh;
    zoom: 0.75;
  }

}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  cursor: pointer;
}

.topbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 14px clamp(18px, 4vw, 64px);
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.92);
  position: sticky;
  top: 0;
  z-index: 5;
}

.app-logo-title {
  display: inline-flex;
  flex: 0 1 auto;
  align-items: center;
  min-width: 0;
  text-decoration: none;
  margin-left: 0;
}

.app-header-logo {
  display: block;
  width: min(536px, 41vw);
  max-height: 91px;
  height: auto;
  object-fit: contain;
  object-position: left center;
}

.topbar h1,
.topbar p {
  margin: 0;
}

.topbar h1 {
  font-size: 24px;
  line-height: 1.15;
}

.header-toggle {
  display: none;
}

.eyebrow {
  color: var(--brand);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.top-actions,
.dialog-actions,
.section-actions,
.section-toolbar,
.preview-toolbar,
.panel-title,
.repeat-actions,
.repeat-head {
  display: flex;
  align-items: center;
  gap: 10px;
}

.top-actions,
.section-toolbar,
.preview-toolbar,
.panel-title,
.repeat-head {
  justify-content: space-between;
}

.top-actions {
  flex: 1 1 680px;
  flex-wrap: wrap;
  justify-content: flex-end;
  min-width: 0;
}

.top-actions > button,
.top-actions > a,
.top-actions > .account-menu,
.top-actions > .language-switch {
  flex: 0 0 auto;
}

.top-actions .ghost-button,
.top-actions .primary-button,
.top-actions .account-menu summary {
  white-space: nowrap;
}

.section-actions,
.repeat-actions {
  justify-content: flex-end;
}

.language-switch {
  display: inline-flex;
  grid-template-columns: none;
  align-items: center;
  gap: 6px;
  color: var(--muted);
}

.language-switch select {
  width: auto;
  min-height: 38px;
  padding: 0 8px;
}

.section-actions {
  flex-wrap: wrap;
}

.repeat-actions {
  flex: 0 0 auto;
  gap: 6px;
}

.header-account {
  display: grid;
  gap: 2px;
  min-width: 240px;
  max-width: 360px;
  color: var(--muted);
  font-size: 12px;
}

.header-account .badge {
  width: fit-content;
}

.header-documents {
  display: none;
}

.primary-button,
.ghost-button,
.small-button,
.icon-button {
  border: 1px solid var(--line);
  border-radius: 6px;
  min-height: 38px;
  padding: 0 14px;
  background: var(--surface);
  color: var(--ink);
  font-weight: 700;
}

.ghost-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  line-height: normal;
  text-decoration: none;
}

.primary-button {
  border-color: var(--brand);
  background: var(--brand);
  color: #ffffff;
}

.primary-button:hover {
  background: var(--brand-dark);
}

.ghost-button:hover,
.small-button:hover,
.icon-button:hover {
  border-color: var(--brand);
  color: var(--brand-dark);
}

.ghost-button:disabled,
.small-button:disabled,
.icon-button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.small-button {
  min-height: 32px;
  padding: 0 10px;
  font-size: 13px;
}

.icon-button,
.icon-close {
  width: 32px;
  min-width: 32px;
  padding: 0;
}

.app-shell {
  display: grid;
  grid-template-columns: minmax(420px, 1fr) minmax(420px, 1fr);
  grid-template-rows: auto 1fr;
  gap: 16px 20px;
  padding: 20px;
  align-items: start;
}

.sidebar,
.editor {
  display: grid;
  gap: 16px;
}

.sidebar {
  grid-column: 1;
  grid-row: 1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

.editor {
  grid-column: 1;
  grid-row: 2;
}

.preview-wrap {
  grid-column: 2;
  grid-row: 1 / span 2;
}

.organization-workspace {
  grid-column: 1 / -1;
  display: grid;
  gap: 16px;
  padding: 18px;
}

.notice,
.panel,
.editor,
.organization-workspace,
.preview-wrap {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.notice {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  padding: 16px;
  border-left: 4px solid var(--green);
}

.notice span,
.privacy-copy,
#storageHint,
.entry-card small,
.document-row small {
  color: var(--muted);
}

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

.entry-card {
  width: 100%;
  min-height: 148px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  align-content: start;
  text-align: left;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.entry-card:hover {
  border-color: var(--brand);
  box-shadow: 0 14px 34px rgba(23, 107, 135, 0.14);
}

.entry-card strong {
  font-size: 20px;
}

.entry-icon {
  width: fit-content;
  min-height: 20px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: #e6f1ee;
  color: var(--brand-dark);
  padding: 0 8px;
  font-weight: 900;
  font-size: 11px;
  text-transform: uppercase;
}

.file-entry input {
  display: none;
}

.upload-zone {
  display: grid;
  gap: 8px;
  padding: 22px;
  border: 1px dashed color-mix(in srgb, var(--brand), #ffffff 30%);
  border-radius: 8px;
  background: #eef7f5;
  cursor: pointer;
}

.upload-zone:hover {
  border-color: var(--brand);
  background: #e7f3f1;
}

.upload-zone.is-dragging {
  border-color: var(--brand);
  background: #dff0ed;
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--brand), transparent 45%);
}

.upload-zone span {
  color: var(--muted);
  font-weight: 500;
}

.upload-zone input {
  display: none;
}

.panel {
  padding: 16px;
}

.sidebar .import-panel {
  display: none;
}

.panel h2,
.section-toolbar h2 {
  margin: 0;
  font-size: 17px;
}

.badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  background: #e8f3f5;
  color: var(--brand-dark);
  font-size: 12px;
  font-weight: 800;
}

.badge.muted {
  background: var(--surface-soft);
  color: var(--muted);
}

.document-list {
  display: grid;
  gap: 6px;
  margin-top: 0;
}

.document-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}

.document-actions {
  display: flex;
  gap: 6px;
  align-items: stretch;
}

.document-actions .icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.duplicate-document-button {
  position: relative;
}

.duplicate-icon {
  position: relative;
  display: block;
  width: 14px;
  height: 14px;
}

.duplicate-icon::before,
.duplicate-icon::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  border: 1.8px solid currentColor;
  border-radius: 2px;
  background: var(--surface);
}

.duplicate-icon::before {
  left: 0;
  top: 3px;
}

.duplicate-icon::after {
  left: 4px;
  top: 0;
}

.document-row button:first-child {
  display: grid;
  gap: 2px;
  text-align: left;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
  padding: 7px 8px;
}

.import-review {
  display: grid;
  gap: 8px;
  max-height: 250px;
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.import-review.empty {
  color: var(--muted);
}

.import-review.is-loading {
  border-color: var(--brand);
  background: #eef7f5;
}

.success-text {
  color: var(--green);
  font-weight: 800;
}

.warning-text {
  color: var(--rose);
  font-weight: 800;
}

.import-review h3,
.import-review p,
.import-review ul {
  margin: 0;
}

.import-review ul {
  padding-left: 18px;
}

.editor-import-review {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--green);
  border-radius: 8px;
  background: #f8fbf8;
}

.editor-import-review[hidden] {
  display: none;
}

.editor-import-review.is-collapsed .editor-import-review-body {
  display: none;
}

.editor {
  padding: 16px;
  min-height: auto;
}

.tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  scrollbar-width: thin;
}

.tab {
  position: relative;
  flex: 1 0 auto;
  min-height: 42px;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0 14px;
  color: var(--muted);
  font-weight: 800;
  white-space: nowrap;
}

.tab.active {
  background: #eef7f5;
  color: var(--brand-dark);
}

.tab.active::after {
  content: "";
  position: absolute;
  right: 10px;
  bottom: -1px;
  left: 10px;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: var(--brand);
}

.tab:hover {
  background: var(--surface-soft);
  color: var(--brand-dark);
}

.form-stack,
.tab-panel,
.repeat-list {
  display: grid;
  gap: 14px;
}

.editor-stepper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.editor-stepper .primary-button,
.editor-stepper .ghost-button {
  flex: 1 1 220px;
  width: auto;
  max-width: none;
  min-height: 44px;
  height: auto;
  padding: 9px 14px;
  line-height: 1.2;
  overflow: visible;
  white-space: normal;
  text-align: center;
  white-space: nowrap;
}

.tab-panel {
  display: none;
  padding: 18px;
  border: 1px solid #e7aeb8;
  border-radius: 12px;
  background: linear-gradient(145deg, #fff5f6 0%, #fce3e7 100%);
  box-shadow: 0 10px 24px rgba(174, 55, 72, 0.1);
}

.document-row button:first-child.is-active {
  border-color: #7a1219;
  background: #e8d1d4;
  color: #511016;
  box-shadow: inset 4px 0 0 #7a1219, 0 3px 10px rgba(81, 16, 22, 0.14);
}

.document-row button:first-child.is-active strong {
  font-weight: 900;
}

.tab-panel.active {
  display: grid;
}

label {
  display: grid;
  gap: 6px;
  color: #34424a;
  font-size: 13px;
  font-weight: 800;
}

.photo-control {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 14px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.photo-preview {
  width: 86px;
  height: 108px;
  display: grid;
  place-items: center;
  border: 1px dashed var(--line);
  border-radius: 6px;
  color: var(--muted);
  background: #ffffff;
  overflow: hidden;
  font-size: 12px;
  font-weight: 800;
}

.photo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(var(--photo-preview-zoom, 1));
  transform-origin: center;
}

.photo-preview.has-photo {
  border-style: solid;
  border-color: var(--brand);
}

.photo-preview[data-photo-frame="off"] {
  border-color: transparent;
}

.photo-preview[data-photo-shadow="on"] {
  box-shadow: 0 7px 18px rgba(15, 23, 42, 0.24);
}

.photo-preview[data-photo-shape="square"],
.photo-preview[data-photo-shape="circle"] {
  width: 108px;
  height: 108px;
}

.photo-preview[data-photo-shape="circle"],
.photo-preview[data-photo-shape="oval"] {
  border-radius: 999px;
}

.photo-actions {
  display: grid;
  gap: 10px;
}

input,
textarea,
select {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  color: var(--ink);
  padding: 10px 11px;
  outline: none;
}

textarea {
  resize: vertical;
  min-height: 86px;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(23, 107, 135, 0.15);
}

.check-option {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
}

.check-option input {
  width: auto;
}

.date-input-wrap {
  position: relative;
  display: block;
  min-width: 0;
}

.localized-date-value {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0;
  pointer-events: none;
}

.localized-date-display {
  width: 100%;
  min-height: 42px;
  padding: 0 44px 0 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  font-weight: 700;
}

.localized-date-display::after {
  content: "▦";
  position: absolute;
  right: 14px;
}

.localized-date-display.is-placeholder {
  color: var(--muted);
}

.localized-date-dialog {
  width: min(360px, calc(100vw - 28px));
  padding: 0;
  border: 0;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(23, 33, 38, .28);
}

.localized-date-dialog::backdrop {
  background: rgba(23, 33, 38, .34);
}

.localized-date-card { padding: 16px; background: #fff; }
.localized-date-head { display: grid; grid-template-columns: 38px 1fr 38px; align-items: center; gap: 8px; }
.localized-date-head strong { text-align: center; text-transform: capitalize; }
.localized-date-head button { min-height: 36px; border: 1px solid var(--line); border-radius: 6px; background: #fff; font-size: 22px; }
.localized-date-weekdays,
.localized-date-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.localized-date-weekdays { margin-top: 14px; color: var(--muted); font-size: 12px; font-weight: 800; text-align: center; }
.localized-date-grid { margin-top: 7px; }
.localized-date-day { aspect-ratio: 1; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--ink); }
.localized-date-day:hover { background: var(--surface-soft); }
.localized-date-day.is-today { border-color: var(--brand); }
.localized-date-day.is-selected { background: var(--brand); color: #fff; font-weight: 900; }
.localized-date-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.localized-date-actions button { min-height: 34px; padding: 0 10px; border: 1px solid var(--line); border-radius: 6px; background: #fff; font-weight: 700; }
.localized-date-actions button:last-child { border-color: var(--brand); background: var(--brand); color: #fff; }
}

.two-col,
.three-col {
  display: grid;
  gap: 12px;
}

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

.three-col {
  grid-template-columns: 1.2fr 0.9fr 0.9fr;
}

.repeat-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.repeat-title {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.repeat-title strong,
.repeat-title span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.repeat-title span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.repeat-collapse-bar {
  width: 100%;
  min-height: 24px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #ffffff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  text-transform: lowercase;
}

.repeat-collapse-bar:hover {
  border-color: var(--pilot-red);
  color: var(--pilot-red-dark);
}

.repeat-card-body {
  display: grid;
  gap: 12px;
}

.repeat-card.is-collapsed .repeat-card-body {
  display: none;
}

.preview-wrap {
  position: sticky;
  top: 92px;
  display: grid;
  gap: 14px;
  padding: 16px;
  justify-items: center;
  overflow: auto;
}

body[data-mode="entry"] .import-panel,
body[data-mode="entry"] .editor,
body[data-mode="entry"] .organization-workspace,
body[data-mode="entry"] .preview-wrap,
body[data-mode="entry"] [data-action="download-pdf"],
body[data-mode="import"] .entry-grid,
body[data-mode="import"] .editor,
body[data-mode="import"] .organization-workspace,
body[data-mode="import"] .preview-wrap,
body[data-mode="import"] [data-action="download-pdf"],
body[data-mode="edit"] .organization-workspace,
body[data-mode="organization"] .sidebar,
body[data-mode="organization"] .editor,
body[data-mode="organization"] .preview-wrap,
body[data-mode="organization"] [data-action="download-pdf"],
body[data-mode="edit"] .entry-grid,
body[data-mode="edit"] .sidebar {
  display: none;
}

body[data-mode="entry"] .sidebar,
body[data-mode="import"] .sidebar {
  grid-column: 1 / -1;
  max-width: 900px;
  width: 100%;
  margin: 0 auto;
}

body[data-mode="entry"] .notice,
body[data-mode="import"] .notice,
body[data-mode="entry"] .import-panel,
body[data-mode="import"] .import-panel {
  grid-column: 1 / -1;
}

.preview-toolbar {
  color: var(--muted);
  font-weight: 800;
  width: 100%;
}

.preview-title-group,
.preview-scale-control {
  display: inline-flex;
  align-items: center;
}

.preview-title-group {
  gap: 12px;
}

.preview-scale-control {
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.preview-scale-control input {
  width: 92px;
  accent-color: var(--brand);
}

.preview-scale-control output {
  min-width: 34px;
  text-align: right;
}

.cv-preview {
  --accent: var(--brand);
  --cv-font-size-scale: 1;
  font-family: var(--cv-font, Inter, Arial, sans-serif);
  box-sizing: border-box;
  width: 794px;
  margin: 0 auto;
  color: #1f292e;
  overflow-wrap: anywhere;
  position: relative;
  display: grid;
  gap: 24px;
}

.form-stack label,
.supplement-form label,
.two-col > *,
.three-col > * {
  min-width: 0;
}

.form-stack label > span,
.supplement-form label > span {
  display: block;
  overflow-wrap: anywhere;
}

.cv-document {
  display: grid;
  font-size: calc(14px * var(--cv-font-size-scale));
  gap: 24px;
}

.cv-page {
  box-sizing: border-box;
  width: 794px;
  height: 1123px;
  min-height: 1123px;
  max-height: 1123px;
  padding: 56px;
  background: #ffffff;
  border: 1px solid #d4d8d2;
  box-shadow: 0 20px 60px rgba(23, 33, 38, 0.16);
  overflow: hidden;
  position: relative;
  break-after: page;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.cv-page:last-child {
  break-after: auto;
}

.cv-preview[data-layout="designer"][data-orientation="landscape"] {
  width: 1123px;
}

.cv-preview[data-layout="designer"] .designer-page {
  width: 794px;
  height: 1123px;
  min-height: 1123px;
  max-height: 1123px;
  padding: var(--designer-page-margin, 16mm);
  background: var(--designer-page-bg, #fff);
}

.cv-preview[data-layout="designer"][data-orientation="landscape"] .designer-page {
  width: 1123px;
  height: 794px;
  min-height: 794px;
  max-height: 794px;
}

.designer-document {
  counter-reset: designer-section;
}

.designer-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin: var(--designer-page-margin-neg, -16mm);
  margin-bottom: 10mm;
  padding: 12mm var(--designer-page-margin, 16mm);
}

.designer-header-minimal {
  margin: 0 0 10mm;
  padding: 0 0 7mm;
  border-bottom: 2px solid var(--accent);
}

.cv-preview[data-layout="designer"][data-designer-header-style="band"] :is(.letter-sender, .reference-header) {
  margin: var(--designer-page-margin-neg, -16mm);
  margin-bottom: 10mm;
  padding: 12mm var(--designer-page-margin, 16mm);
  background: var(--accent);
  color: #fff;
}

.cv-preview[data-layout="designer"][data-designer-header-style="split"] :is(.letter-sender, .reference-header) {
  padding: 7mm;
  border-left: 8mm solid var(--accent);
  background: color-mix(in srgb, var(--accent) 9%, #fff);
}

.designer-header-band {
  background: var(--accent);
  color: #fff;
}

.designer-header-band p,
.designer-header-band a {
  color: inherit;
}

.designer-header-split {
  border-left: 12mm solid var(--accent);
  background: color-mix(in srgb, var(--accent) 9%, #fff);
}

.designer-header-name h2 {
  margin: 0;
  font-size: 38px;
  line-height: 1.05;
}

.designer-header-name p {
  margin: 7px 0 0;
  color: var(--accent);
  font-weight: 800;
}

.designer-header ul,
.designer-contact-block ul {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 12px;
}

.designer-header li,
.designer-contact-block li {
  display: flex;
  gap: 5px;
}

.designer-photo-none {
  grid-template-columns: minmax(0, 1fr) auto;
}

.designer-full-zone {
  display: grid;
  gap: var(--designer-section-gap, 7mm);
}

.designer-full-top {
  margin-bottom: var(--designer-section-gap, 7mm);
}

.designer-full-bottom {
  margin-top: var(--designer-section-gap, 7mm);
}

.designer-column-grid {
  display: grid;
  grid-template-columns: var(--designer-columns, 1fr);
  gap: var(--designer-column-gap, 12mm);
  align-items: start;
}

.designer-column {
  display: grid;
  gap: var(--designer-section-gap, 7mm);
  min-width: 0;
  padding: 5mm;
  border-radius: 5px;
  background: var(--designer-column-bg, transparent);
}

.designer-document[data-designer-spacing="compact"] {
  --designer-section-gap: 4mm;
}

.designer-document[data-designer-spacing="normal"] {
  --designer-section-gap: 7mm;
}

.designer-document[data-designer-spacing="relaxed"] {
  --designer-section-gap: 10mm;
}

.designer-section {
  min-width: 0;
  break-inside: avoid;
}

.designer-section .cv-section {
  margin: 0;
}

.designer-style-plain .cv-section h3 {
  padding: 0;
  border: 0;
  background: transparent;
}

.designer-style-line .cv-section h3 {
  padding-bottom: 3px;
  border-bottom: 2px solid var(--accent);
}

.designer-style-card {
  padding: 5mm;
  border: 1px solid color-mix(in srgb, var(--accent) 24%, #d8e1e8);
  border-radius: 7px;
  background: #fff;
}

.designer-style-timeline .cv-item {
  position: relative;
  padding-left: 15px;
  border-left: 2px solid color-mix(in srgb, var(--accent) 55%, #fff);
}

.designer-style-timeline .cv-item::before {
  position: absolute;
  top: 5px;
  left: -6px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--accent);
  content: "";
}

.designer-style-numbered {
  counter-increment: designer-section;
}

.designer-style-numbered .cv-section > h3::before {
  margin-right: 8px;
  color: var(--accent);
  content: counter(designer-section, decimal-leading-zero);
}

.designer-contact-block {
  padding: 4mm;
  border-left: 3px solid var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, #fff);
}

.section-placement-settings {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
  min-width: 0;
  margin: 4px 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7f9fa;
}

.section-placement-settings legend {
  padding: 0 6px;
  font-weight: 800;
}

.section-placement-settings .muted-note {
  margin: 0;
}

.section-placement-settings select option:disabled {
  color: #9aa5ad;
}

.section-position-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(213, 125, 139, 0.42);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.48);
}

.section-position-controls:has(> :only-child) {
  grid-template-columns: minmax(0, 1fr);
}

.section-sidebar-display {
  transition: opacity 160ms ease, filter 160ms ease;
}

.section-sidebar-display.is-disabled {
  opacity: 0.46;
  filter: grayscale(0.35);
}

.section-sidebar-display select:disabled {
  cursor: not-allowed;
  background: #f4e7e9;
}

.section-bullet-points.is-disabled {
  cursor: not-allowed;
  opacity: 0.46;
  filter: grayscale(0.35);
}

.section-bullet-points input:disabled {
  cursor: not-allowed;
}

.document-page-footer {
  position: absolute;
  z-index: 10;
  right: 18mm;
  bottom: 13px;
  left: 18mm;
  display: flex;
  color: color-mix(in srgb, var(--accent) 55%, #44515a);
  font-size: 10px;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: 0.01em;
  justify-content: space-between;
  gap: 12mm;
  pointer-events: none;
}

.document-page-footer > * {
  min-width: 0;
}

.document-page-number {
  flex: 0 0 auto;
  white-space: nowrap;
}

.document-footer-contact {
  display: flex;
  min-width: 0;
  gap: 6px;
  align-items: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

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

.document-footer-contact i {
  opacity: 0.55;
  font-style: normal;
}

.document-page-footer.is-left .document-footer-contact {
  margin-left: auto;
  justify-content: flex-end;
}

.document-page-footer.is-right .document-footer-contact {
  margin-right: auto;
  justify-content: flex-start;
}

.document-page-footer.is-right .document-page-number {
  margin-left: auto;
}

/* Footer content placed over a solid left sidebar must use its light foreground. */
.cv-preview:is(
  [data-layout="full_sidebar_photo"],
  [data-layout="midnight_timeline"]
) .document-page-footer.is-left .document-page-number,
.cv-preview:is(
  [data-layout="full_sidebar_photo"],
  [data-layout="midnight_timeline"]
) .document-page-footer.is-right .document-footer-contact,
.cv-preview:is(
  [data-layout="full_sidebar_photo"],
  [data-layout="midnight_timeline"]
) .document-page-footer.is-right .document-footer-contact a {
  color: #ffffff;
}

.cv-preview:is(
  [data-layout="full_sidebar_photo"],
  [data-layout="midnight_timeline"]
) .document-page-footer.is-right .document-footer-contact a:hover,
.cv-preview:is(
  [data-layout="full_sidebar_photo"],
  [data-layout="midnight_timeline"]
) .document-page-footer.is-right .document-footer-contact a:focus-visible {
  color: #ffffff;
}

.cv-preview.is-editing-page-breaks .cv-page {
  background-image: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 1122px,
    rgba(220, 38, 38, 0.32) 1122px,
    rgba(220, 38, 38, 0.32) 1123px
  );
}

.cv-break-target {
  display: none;
  margin: 10px 0;
}

.cv-preview.is-editing-page-breaks .cv-break-target {
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 4;
  height: 0;
  margin: 0;
}

.cv-preview.is-editing-page-breaks .cv-break-target .cv-break-add {
  position: absolute;
  top: 0;
  transform: translateY(-50%);
}

.cv-break-add {
  min-height: 28px;
  padding: 4px 10px;
  border: 1px dashed color-mix(in srgb, var(--accent), #ffffff 30%);
  border-radius: 999px;
  background: #ffffff;
  color: var(--accent);
  font: 700 11px/1.2 Inter, Arial, sans-serif;
  cursor: pointer;
}

.cv-break-target.is-drop-target {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.cv-page-break {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 32px;
  margin: -20px -18px 18px;
  border-top: 2px dashed #dc2626;
  color: #991b1b;
  cursor: grab;
}

.cv-preview:not(.is-editing-page-breaks) .cv-page-break {
  display: none;
}

.cv-preview.is-editing-page-breaks .cv-page-break {
  position: relative;
  z-index: 5;
  min-height: 0;
  height: 0;
  margin: 0;
  border-top: 0;
  overflow: visible;
}

.cv-preview.is-editing-page-breaks .cv-page-break > * {
  transform: translateY(-50%);
}

.cv-page-break > span {
  padding: 4px 8px;
  border: 1px solid rgba(220, 38, 38, 0.24);
  border-radius: 999px;
  background: #fff7f7;
  font: 800 11px/1.2 Inter, Arial, sans-serif;
}

.cv-head {
  display: grid;
  grid-template-columns: 1fr minmax(180px, 250px);
  gap: 28px;
  padding-bottom: 24px;
  border-bottom: 4px solid var(--accent);
}

.cv-head:has(.cv-photo) {
  grid-template-columns: auto 1fr minmax(170px, 230px);
  align-items: start;
}

.cv-photo-frame {
  --photo-zoom: 1;
  width: 88px;
  height: 112px;
  max-width: 130px;
  max-height: 160px;
  flex: 0 0 auto;
  display: block;
  overflow: hidden;
  border-radius: 4px;
  border: 2px solid color-mix(in srgb, var(--accent), #ffffff 60%);
  background: #ffffff;
  break-inside: avoid;
  page-break-inside: avoid;
}

.cv-photo-frame[data-photo-frame="off"] {
  border-color: transparent;
}

.cv-photo-frame[data-photo-shadow="on"] {
  box-shadow: 0 7px 18px rgba(15, 23, 42, 0.24);
}

.cv-photo-frame[data-photo-shape="square"],
.cv-photo-frame[data-photo-shape="circle"] {
  aspect-ratio: 1 / 1;
}

.cv-photo-frame[data-photo-shape="circle"],
.cv-photo-frame[data-photo-shape="oval"] {
  border-radius: 999px;
}

.cv-photo-frame[data-photo-shape="oval"] {
  aspect-ratio: 92 / 116;
}

.cv-photo {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transform: scale(var(--photo-zoom));
  transform-origin: center;
}

.cv-head h2 {
  margin: 0;
  font-size: calc(38px * var(--cv-font-size-scale));
  line-height: 1.05;
  overflow-wrap: normal;
  word-break: keep-all;
  hyphens: none;
}

.cv-head p {
  margin: 10px 0 0;
  color: var(--accent);
  font-weight: 800;
}

.cv-head ul {
  display: grid;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: #4e5a61;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.cv-preview[data-photo-placement="headerLeft"] .cv-head .cv-photo-frame {
  grid-column:1;
  grid-row:1 / span 2;
  justify-self:start;
}

.cv-preview[data-photo-placement="headerRight"] .cv-head .cv-photo-frame {
  grid-column:-2;
  grid-row:1 / span 2;
  justify-self:end;
}

.designer-column .cv-photo-frame {
  display:block;
  margin:0 auto;
}

.cv-head li,
.cv-side-section li {
  display: flex;
  align-items: flex-start;
  gap: 6px;
}

.cv-inline-icon {
  width: 1em;
  height: 1em;
  min-width: 1em;
  margin-top: 0.08em;
  color: var(--accent);
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.cv-preview[data-icon-style="line-bw"] .cv-inline-icon {
  color: #2f3538;
}

.cv-preview[data-icon-style="line-accent"] .cv-inline-icon {
  color: var(--accent);
}

.cv-preview[data-icon-style="filled-accent"] .cv-inline-icon {
  width: 1.35em;
  height: 1.35em;
  min-width: 1.35em;
  margin-top: -0.1em;
  padding: 0.18em;
  color: #ffffff;
  background: var(--accent);
  border-radius: 999px;
  stroke-width: 2;
}

/* Icons on solid sidebar backgrounds use the sidebar's foreground contrast. */
.cv-preview:is(
  [data-layout="full_sidebar_photo"],
  [data-layout="midnight_timeline"]
) .cv-side .cv-inline-icon {
  color: #ffffff;
}

.cv-preview:is(
  [data-layout="full_sidebar_photo"],
  [data-layout="midnight_timeline"]
)[data-icon-style="filled-accent"] .cv-side .cv-inline-icon {
  color: var(--accent);
  background: #ffffff;
}

.cv-head a,
.cv-side-section a {
  color: inherit;
  text-decoration: none;
}

.cv-head a:hover,
.cv-side-section a:hover {
  color: var(--accent);
}

.cv-head > div {
  min-width: 0;
}

.cv-section {
  margin-top: 24px;
  break-inside: auto;
}

.cv-section h3 {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 10px;
  color: var(--accent);
  font-size: calc(13px * var(--cv-font-size-scale));
  text-transform: uppercase;
  border-bottom: 1px solid #dfe4df;
  padding-bottom: 6px;
  white-space: nowrap;
}

.cv-section[data-break-key="section:experience"] + .cv-section[data-break-key="section:additionalExperience"] {
  margin-top: 34px;
}

.cv-item {
  display: grid;
  gap: 5px;
  margin: 0 0 14px;
  break-inside: avoid;
  page-break-inside: avoid;
}

.cv-item p,
.cv-section p {
  margin: 0;
  line-height: 1.55;
}

.cv-item-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.cv-item-head span {
  color: #667078;
  white-space: nowrap;
}

.cv-item ul {
  margin: 4px 0 0;
  padding-left: 18px;
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.tag-list span {
  border: 1px solid color-mix(in srgb, var(--accent), #ffffff 65%);
  border-radius: var(--tag-radius, 24px);
  padding: 5px 9px;
  background: color-mix(in srgb, var(--accent), #ffffff 90%);
}

.text-list {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 18px;
}

.text-list li {
  line-height: 1.5;
}

.text-list.text-list-no-bullets {
  padding-left: 0;
  list-style: none;
}

.cv-item.cv-item-continuation {
  margin-top: -9px;
}

.cv-item.cv-item-continuation:has(.cv-item-head) {
  margin-top: 0;
}

.collapsible-summary-count {
  margin-left: auto;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.visibility-option.is-unavailable {
  opacity: 0.5;
}

.textarea-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.text-alignment-buttons {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 2px;
}

.text-align-button {
  width: 28px;
  min-height: 26px;
  padding: 2px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
  color: var(--muted);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}

.text-align-button.is-active {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand), #fff 88%);
  color: var(--brand-dark);
}

.text-align-left { text-align: left; }
.text-align-center { text-align: center; }
.text-align-right { text-align: right; }
.text-align-justify { text-align: justify; }

.personal-details-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.personal-details-list li {
  display: grid;
  grid-template-columns: minmax(88px, auto) minmax(0, 1fr);
  gap: 8px;
  line-height: 1.45;
}

.personal-details-list strong {
  color: #667078;
  font-weight: 700;
}

.cv-side .personal-details-list,
.designer-column .personal-details-list {
  grid-template-columns: 1fr;
}

.cv-side .personal-details-list li,
.designer-column .personal-details-list li {
  grid-template-columns: 1fr;
  gap: 1px;
}

.cv-preview[data-tag-style="plain"] .tag-list {
  gap: 0;
}

.cv-preview[data-tag-style="plain"] .tag-list span {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
}

.cv-preview[data-tag-style="plain"] .tag-list span:not(:last-child)::after {
  content: ", ";
  margin-right: 5px;
  color: #667078;
}

.cv-body {
  display: block;
}

.cv-side {
  display: none;
}

.cv-side-section {
  display: grid;
  gap: 8px;
  margin-bottom: 18px;
}

.cv-side-section h3 {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  color: var(--accent);
  font-size: calc(12px * var(--cv-font-size-scale));
  text-transform: uppercase;
}

.cv-side-section ul {
  display: grid;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: calc(13px * var(--cv-font-size-scale));
}

.layout-gallery {
  display: grid;
  gap: 14px;
}

.layout-category-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: thin;
}

.category-tab {
  flex: 0 0 auto;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--muted);
  padding: 0 12px;
  font-weight: 800;
}

.category-tab:hover,
.category-tab.active {
  border-color: var(--brand);
  background: #eef7f5;
  color: var(--brand-dark);
}

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

.layout-card {
  zoom: 0.7;
  display: grid;
  grid-template-columns: 118px 1fr;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.layout-card.is-active {
  border-color: var(--brand);
  box-shadow: inset 0 0 0 1px var(--brand);
}

.layout-mini-frame {
  width: 118px;
  height: 166px;
  overflow: hidden;
  border: 1px solid #d4d8d2;
  border-radius: 4px;
  background: #ffffff;
}

.cv-mini {
  width: 794px;
  margin: 0;
  border: 0;
  box-shadow: none;
  pointer-events: none;
  transform: scale(0.148);
  transform-origin: top left;
  gap: 0;
}

.cv-mini .cv-document {
  gap: 0;
}

.cv-mini .cv-page {
  border: 0;
  box-shadow: none;
}

.layout-card.is-landscape .layout-mini-frame {
  width: 118px;
  height: 84px;
}

.layout-card.is-landscape .cv-mini {
  transform: scale(0.105);
}

.layout-card-body {
  display: grid;
  gap: 10px;
}

.layout-meta-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.layout-card-body h3,
.layout-card-body p,
.layout-card-body small {
  margin: 0;
}

.layout-card-body p,
.layout-card-body small,
.muted-note {
  color: var(--muted);
  font-size: 13px;
}

.layout-card-body small {
  display: block;
  margin-top: 6px;
}

.layout-category-badge {
  flex: 0 0 auto;
  border: 1px solid color-mix(in srgb, var(--brand), #ffffff 70%);
  border-radius: 999px;
  padding: 3px 7px;
  color: var(--brand-dark);
  background: #ffffff;
  font-size: 11px;
  font-weight: 900;
}

.layout-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.layout-card-actions .primary-button,
.layout-card-actions .small-button {
  min-height: 30px;
  padding: 0 9px;
  font-size: 12px;
}

.cv-preview[data-layout="modern_sidebar"] .cv-head,
.cv-preview[data-layout="bold_professional"] .cv-head {
  grid-template-columns: 1fr;
  background: color-mix(in srgb, var(--accent), #ffffff 88%);
  margin: -56px -56px 0;
  padding: 46px 56px 30px;
  border-bottom: 0;
}

.cv-preview[data-layout="modern_sidebar"] .cv-head:has(.cv-photo),
.cv-preview[data-layout="bold_professional"] .cv-head:has(.cv-photo),
.cv-preview[data-layout="editorial"] .cv-head:has(.cv-photo) {
  grid-template-columns: auto 1fr;
}

.cv-preview[data-layout="modern_sidebar"] .cv-head ul,
.cv-preview[data-layout="bold_professional"] .cv-head ul {
  grid-column: 1 / -1;
}

.cv-preview[data-layout="modern_sidebar"] .cv-head ul,
.cv-preview[data-layout="bold_professional"] .cv-head ul {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cv-preview[data-layout="modern_sidebar"] .cv-body {
  display: grid;
  grid-template-columns: 30% 1fr;
  gap: 30px;
  margin-top: 28px;
}

.cv-preview[data-layout="modern_sidebar"] .cv-side {
  display: block;
  margin: -28px 0 -56px -56px;
  padding: 28px 22px 56px 56px;
  background: color-mix(in srgb, var(--accent), #ffffff 90%);
}

.cv-preview[data-layout="modern_sidebar"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="swiss_grid"] {
}

.cv-preview[data-layout="swiss_grid"] .cv-page {
  padding: 64px;
}

.cv-preview[data-layout="swiss_grid"] .cv-head {
  grid-template-columns: 170px 1fr;
  border-bottom-width: 1px;
}

.cv-preview[data-layout="swiss_grid"] .cv-section {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 24px;
}

.cv-preview[data-layout="swiss_grid"] .cv-section h3 {
  border: 0;
  color: #111827;
  letter-spacing: 0.08em;
}

.cv-preview[data-layout="executive"] {
}

.cv-preview[data-layout="executive"] .cv-page {
  padding: 70px;
}

.cv-preview[data-layout="executive"] .cv-head {
  border-bottom: 1px solid #c7c9c7;
}

.cv-preview[data-layout="executive"] .cv-head h2 {
  font-size: 48px;
  font-family: Georgia, "Times New Roman", serif;
}

.cv-preview[data-layout="executive"] .cv-section h3 {
  font-size: 15px;
  color: #1f292e;
}

.cv-preview[data-layout="minimal"] {
  color: #151515;
}

.cv-preview[data-layout="minimal"] .cv-page {
  padding: 76px;
}

.cv-preview[data-layout="minimal"] .cv-head,
.cv-preview[data-layout="minimal"] .cv-section h3 {
  border: 0;
}

.cv-preview[data-layout="minimal"] .cv-section {
  margin-top: 36px;
}

.cv-preview[data-layout="minimal"] .tag-list span {
  border: 0;
  background: transparent;
  padding: 0;
}

.cv-preview[data-layout="compact_pro"] {
  font-size: calc(13px * var(--cv-font-size-scale));
}

.cv-preview[data-layout="compact_pro"] .cv-page {
  padding: 42px;
}

.cv-preview[data-layout="compact_pro"] .cv-head h2 {
  font-size: 30px;
}

.cv-preview[data-layout="compact_pro"] .cv-section {
  margin-top: 14px;
}

.cv-preview[data-layout="compact_pro"] .cv-item {
  margin-bottom: 9px;
}

.cv-preview[data-layout="compact_pro"] .tag-list {
  gap: 4px;
}

.cv-preview[data-layout="editorial"] .cv-head {
  grid-template-columns: 1fr;
  border-bottom: 0;
}

.cv-preview[data-layout="editorial"] .cv-head h2 {
  font-size: 56px;
  font-family: Georgia, "Times New Roman", serif;
}

.cv-preview[data-layout="editorial"] .cv-head p {
  max-width: 70%;
  font-size: 20px;
}

.cv-preview[data-layout="editorial"] .cv-main {
  counter-reset: cvsection;
}

.cv-preview[data-layout="editorial"] .cv-section h3::before {
  counter-increment: cvsection;
  content: "0" counter(cvsection) " / ";
}

.cv-preview[data-layout="tech"] {
}

.cv-preview[data-layout="tech"] .cv-page {
  background: #fbfcff;
}

.cv-preview[data-layout="tech"] .cv-section {
  border-left: 3px solid color-mix(in srgb, var(--accent), #ffffff 35%);
  padding-left: 16px;
}

.cv-preview[data-layout="tech"] .cv-item-head span,
.cv-preview[data-layout="tech"] .cv-section h3 {
  font-family: Consolas, "Courier New", monospace;
}

.cv-preview[data-layout="tech"] .tag-list span {
  border-radius: 4px;
}

.cv-preview[data-layout="professional_timeline"] .cv-section:has(.cv-item) {
  position: relative;
}

.cv-preview[data-layout="professional_timeline"] .cv-item {
  position: relative;
  padding-left: 22px;
}

.cv-preview[data-layout="professional_timeline"] .cv-item::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--accent);
}

.cv-preview[data-layout="professional_timeline"] .cv-item::after {
  content: "";
  position: absolute;
  top: 18px;
  bottom: -16px;
  left: 4px;
  width: 1px;
  background: color-mix(in srgb, var(--accent), #ffffff 50%);
}

.cv-preview[data-layout="bold_professional"] .cv-head {
  background: var(--accent);
  color: #ffffff;
}

.cv-preview[data-layout="bold_professional"] .cv-head p,
.cv-preview[data-layout="bold_professional"] .cv-head ul {
  color: #ffffff;
}

.cv-preview[data-layout="bold_professional"] .cv-section h3 {
  font-size: 16px;
  border-bottom-width: 3px;
}

/* 30 structural CV layouts */
.cv-preview[data-layout="classic_header"] {
}

.cv-preview[data-layout="classic_header"] .cv-page {
  padding: 56px;
}

.cv-preview[data-layout="classic_header"] .cv-main {
  max-width: 100%;
}

.cv-preview[data-layout="date_rail"] .cv-head {
  border-bottom-width: 1px;
}

.cv-preview[data-layout="date_rail"] .cv-section .cv-item {
  display: grid;
  grid-template-columns: 110px 1fr;
  column-gap: 22px;
}

.cv-preview[data-layout="date_rail"] .cv-item-head,
.cv-preview[data-layout="date_rail"] .cv-item > p,
.cv-preview[data-layout="date_rail"] .cv-item > ul {
  grid-column: 2;
}

.cv-preview[data-layout="date_rail"] .cv-item-head {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3px;
}

.cv-preview[data-layout="date_rail"] .cv-item-head span {
  grid-column: 1;
  grid-row: 1 / span 3;
  width: 96px;
  margin-left: -132px;
  color: var(--accent);
  white-space: normal;
  font-weight: 900;
}

.cv-preview[data-layout="section_labels_left"] {
}

.cv-preview[data-layout="section_labels_left"] .cv-page {
  padding: 64px;
}

.cv-preview[data-layout="section_labels_left"] .cv-head {
  grid-template-columns: 150px 1fr;
  border-bottom-width: 1px;
}

.cv-preview[data-layout="section_labels_left"] .cv-head:has(.cv-photo) {
  grid-template-columns: auto 150px 1fr;
}

.cv-preview[data-layout="section_labels_left"] .cv-section {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 24px;
}

.cv-preview[data-layout="section_labels_left"] .cv-section h3 {
  border: 0;
  color: #1f292e;
  font-size: 12px;
}

.cv-preview[data-layout="wide_typographic"] {
}

.cv-preview[data-layout="wide_typographic"] .cv-page {
  padding: 70px;
}

.cv-preview[data-layout="wide_typographic"] .cv-head {
  grid-template-columns: 1fr;
  border-bottom: 1px solid #c9d0cc;
}

.cv-preview[data-layout="wide_typographic"] .cv-head:has(.cv-photo) {
  grid-template-columns: auto 1fr;
}

.cv-preview[data-layout="wide_typographic"] .cv-head h2 {
  max-width: 640px;
  font: 700 54px/1 Georgia, "Times New Roman", serif;
}

.cv-preview[data-layout="wide_typographic"] .cv-head ul {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cv-preview[data-layout="wide_typographic"] .cv-section h3 {
  color: #1f292e;
  font-size: 17px;
  text-transform: none;
}

.cv-preview[data-layout="dense_professional"] {
  font-size: 12.5px;
}

.cv-preview[data-layout="dense_professional"] .cv-page {
  padding: 40px;
}

.cv-preview[data-layout="dense_professional"] .cv-head {
  gap: 16px;
  padding-bottom: 14px;
  border-bottom-width: 2px;
}

.cv-preview[data-layout="dense_professional"] .cv-head h2 {
  font-size: 28px;
}

.cv-preview[data-layout="dense_professional"] .cv-section {
  margin-top: 12px;
}

.cv-preview[data-layout="dense_professional"] .cv-section h3 {
  margin-bottom: 6px;
  padding-bottom: 3px;
}

.cv-preview[data-layout="dense_professional"] .cv-item {
  gap: 3px;
  margin-bottom: 7px;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-head {
  grid-template-columns: 1fr;
  border-bottom: 0;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-body {
  display: grid;
  grid-template-columns: 30% 1fr;
  gap: 30px;
  margin-top: 24px;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-side {
  display: block;
  margin: -24px 0 -56px -56px;
  padding: 28px 22px 56px 56px;
  background: color-mix(in srgb, var(--accent), #ffffff 88%);
}

.cv-preview[data-layout="left_full_sidebar"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="right_narrow_sidebar"] .cv-head {
  grid-template-columns: 1fr;
}

.cv-preview[data-layout="right_narrow_sidebar"] .cv-body {
  display: grid;
  grid-template-columns: 1fr 25%;
  gap: 28px;
  margin-top: 26px;
}

.cv-preview[data-layout="right_narrow_sidebar"] .cv-main {
  order: 1;
}

.cv-preview[data-layout="right_narrow_sidebar"] .cv-side {
  display: block;
  order: 2;
  padding-left: 18px;
  border-left: 3px solid color-mix(in srgb, var(--accent), #ffffff 55%);
}

.cv-preview[data-layout="right_narrow_sidebar"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="top_sidebar"] .cv-head {
  grid-template-columns: minmax(0, 1fr) minmax(190px, 250px) auto;
  align-items: start;
}

.cv-preview[data-layout="top_sidebar"] .cv-head > ul {
  position: static;
  grid-column: 2;
  grid-row: 1 / span 2;
  width: auto;
  transform: none;
}

.cv-preview[data-layout="top_sidebar"] .cv-head[data-top-sidebar-photo-side="right"] > div {
  grid-column: 1;
}

.cv-preview[data-layout="top_sidebar"] .cv-head[data-top-sidebar-photo-side="right"] > .cv-photo-frame {
  grid-column: 3 !important;
  grid-row: 1 / span 2;
  justify-self: end !important;
}

.cv-preview[data-layout="top_sidebar"] .cv-head[data-top-sidebar-photo-side="left"] > .cv-photo-frame {
  grid-column: 1 !important;
  grid-row: 1 / span 2;
  justify-self: start !important;
}

.cv-preview[data-layout="top_sidebar"] .cv-head[data-top-sidebar-photo-side="left"] > div {
  grid-column: 3;
}

.cv-preview[data-layout="top_sidebar"] .cv-body {
  display: flex;
  flex-direction: column;
}

.cv-preview[data-layout="top_sidebar"] .cv-side {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  order: -1;
  margin-top: 18px;
  padding: 14px;
  border-top: 3px solid var(--accent);
  border-bottom: 1px solid #dfe4df;
  background: #f8faf8;
}

.cv-preview[data-layout="top_sidebar"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="floating_profile_sidebar"] .cv-head {
  grid-template-columns: 1fr;
  margin-left: 230px;
  border-bottom-width: 1px;
}

.cv-preview[data-layout="floating_profile_sidebar"] .cv-body {
  display: block;
  margin-top: 24px;
}

.cv-preview[data-layout="floating_profile_sidebar"] .cv-side {
  display: block;
  float: left;
  width: 205px;
  margin: -126px 28px 16px 0;
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--accent), #ffffff 60%);
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(31, 41, 46, 0.12);
}

.cv-preview[data-layout="floating_profile_sidebar"] .cv-page:not(:first-child) .cv-side {
  margin: 32px 28px 16px 0;
}

.cv-preview[data-layout="floating_profile_sidebar"] .cv-side.cv-side-continues {
  min-height: 951px;
}

.cv-preview[data-layout="floating_profile_sidebar"] .cv-body.cv-floating-sidebar-empty {
  display: block;
}

.cv-preview[data-layout="floating_profile_sidebar"] .cv-body.cv-floating-sidebar-empty .cv-side {
  display: none;
}

.cv-preview[data-layout="floating_profile_sidebar"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="split_sidebar"] .cv-head {
  grid-template-columns: 1fr;
  border-bottom-width: 2px;
}

.cv-preview[data-layout="split_sidebar"] .cv-body {
  display: grid;
  grid-template-columns: 30% 1fr;
  gap: 28px;
  margin-top: 24px;
}

.cv-preview[data-layout="split_sidebar"] .cv-side {
  display: block;
  padding-right: 18px;
  border-right: 1px solid #dfe4df;
}

.cv-preview[data-layout="split_sidebar"] .cv-bottom {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  padding-top: 18px;
  border-top: 1px solid #dfe4df;
}

.cv-preview[data-layout="split_50_50"] .cv-head {
  grid-template-columns: 1fr;
}

.cv-preview[data-layout="split_50_50"] .cv-main {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px 30px;
}

.cv-preview[data-layout="split_50_50"] .cv-section {
  margin-top: 0;
}

.cv-preview[data-layout="split_50_50"] .cv-section[data-break-key^="section:experience"],
.cv-preview[data-layout="split_50_50"] .cv-section[data-break-key^="experience:"] {
  grid-column: auto;
  grid-row: auto;
}


.cv-preview[data-layout="split_50_50"] .cv-bottom {
  grid-column: 2;
}

.cv-preview[data-layout="asymmetric_35_65"] .cv-head {
  grid-template-columns: 35% 1fr;
  border-bottom-width: 1px;
}

.cv-preview[data-layout="asymmetric_35_65"] .cv-body {
  display: grid;
  grid-template-columns: 35% 1fr;
  gap: 28px;
  margin-top: 24px;
}

.cv-preview[data-layout="asymmetric_35_65"] .cv-side {
  display: block;
  padding: 20px 18px;
  background: #f4f7f6;
}

.cv-preview[data-layout="asymmetric_35_65"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="full_width_experience"] .cv-head {
  grid-template-columns: 1fr;
}

.cv-preview[data-layout="full_width_experience"] .cv-main {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 24px;
}

.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] {
  grid-column: 1 / -1;
}

.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item {
  grid-template-columns: 170px 1fr;
}

.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item-head,
.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item > p,
.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item > ul {
  grid-column: 2;
}

.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item-head {
  display: grid;
  grid-template-columns: 1fr;
}

.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item-head span {
  grid-column: 1;
  grid-row: 1 / span 3;
  margin-left: -188px;
  white-space: normal;
}

.cv-preview[data-layout="full_width_experience"] .cv-bottom {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.cv-preview[data-layout="alternating_grid"] .cv-main {
  display: grid;
  grid-template-columns: 42% 1fr;
  gap: 18px 28px;
}

.cv-preview[data-layout="alternating_grid"] .cv-section {
  margin-top: 0;
  padding: 14px 0;
  border-top: 1px solid #dfe4df;
}

.cv-preview[data-layout="alternating_grid"] .cv-section[data-break-key="section:profile"],
.cv-preview[data-layout="alternating_grid"] .cv-section[data-break-key="section:education"] {
  grid-column: 1;
}

.cv-preview[data-layout="alternating_grid"] .cv-section[data-break-key="section:motivation"],
.cv-preview[data-layout="alternating_grid"] .cv-section[data-break-key="section:experience"] {
  grid-column: 2;
}

.cv-preview[data-layout="alternating_grid"] .cv-bottom {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
}

.cv-preview[data-layout="modular_grid"] .cv-head {
  grid-template-columns: 1fr;
  padding: 22px;
  border: 1px solid color-mix(in srgb, var(--accent), #ffffff 65%);
  border-top: 6px solid var(--accent);
}

.cv-preview[data-layout="modular_grid"] .cv-main,
.cv-preview[data-layout="modular_grid"] .cv-bottom {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-content: start;
}

.cv-preview[data-layout="modular_grid"] .modular-page-grid {
  padding-top: 14px;
}

.cv-preview[data-layout="modular_grid"] .cv-section {
  margin-top: 14px;
  padding: 16px;
  border: 1px solid #dfe4df;
  background: #fbfcfb;
}

.cv-preview[data-layout="modular_grid"] .cv-section[data-break-key="section:experience"] {
  grid-column: 1 / -1;
}

.cv-preview[data-layout="modular_grid"] .modular-flow-block {
  min-width: 0;
  break-inside: avoid;
  align-self: stretch;
}

.cv-preview[data-layout="modular_grid"] .modular-flow-block[data-flow-key^="section:experience"],
.cv-preview[data-layout="modular_grid"] .modular-flow-block[data-flow-key^="experience:"] {
  grid-column: 1 / -1;
}

.cv-preview[data-layout="modular_grid"] .modular-flow-block > .cv-section {
  box-sizing: border-box;
  margin-top: 0;
  height: 100%;
  padding: 16px;
}

.cv-preview[data-layout="modular_grid"] .modular-flow-block > .cv-section > :last-child,
.cv-preview[data-layout="modular_grid"] .modular-flow-block > .cv-section > .cv-item:last-child,
.cv-preview[data-layout="modular_grid"] .modular-flow-block > .cv-section > .tag-list:last-child,
.cv-preview[data-layout="modular_grid"] .modular-flow-block > .cv-section > .personal-details-list:last-child {
  margin-bottom: 0;
}

.cv-preview[data-layout="modular_grid"] .modular-flow-block > .cv-section > .cv-item:last-of-type {
  margin-bottom: 0;
}

.cv-preview[data-layout="modular_grid"] .modular-flow-block > .cv-section > .cv-item:last-of-type > :last-child {
  margin-bottom: 0;
}

.cv-preview[data-layout="left_timeline"] .cv-section:has(.cv-item) {
  position: relative;
}

.cv-preview[data-layout="left_timeline"] .cv-item {
  position: relative;
  padding-left: 26px;
}

.cv-preview[data-layout="left_timeline"] .cv-item::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--accent);
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.cv-preview[data-layout="left_timeline"] .cv-item::after {
  content: "";
  position: absolute;
  top: 18px;
  bottom: -16px;
  left: 4px;
  width: 0;
  border-left: 2px solid #c7c3f4;
  border-left-color: color-mix(in srgb, var(--accent), #ffffff 60%);
  background: transparent;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.cv-preview[data-layout="centered_timeline"] .cv-section:has(.cv-item) {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 34px;
}

.cv-preview[data-layout="centered_timeline"] .cv-section:has(.cv-item)::before {
  content: "";
  position: absolute;
  top: 38px;
  bottom: 0;
  left: 50%;
  width: 2px;
  background: color-mix(in srgb, var(--accent), #ffffff 62%);
}

.cv-preview[data-layout="centered_timeline"] .cv-section:has(.cv-item) h3 {
  grid-column: 1 / -1;
}

.cv-preview[data-layout="centered_timeline"] .cv-item {
  padding: 12px;
  border: 1px solid #dfe4df;
  background: #ffffff;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-section:has(.cv-item) {
  --year-marker-column: 126px;
  --year-marker-gap: 26px;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item {
  position: relative;
  display: grid;
  grid-template-columns: var(--year-marker-column) minmax(0, 1fr);
  grid-auto-rows: max-content;
  align-items: start;
  column-gap: var(--year-marker-gap);
  row-gap: 3px;
  margin: 0 0 16px;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item:last-child {
  margin-bottom: 0;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item::before {
  content: "";
  position: absolute;
  top: 5px;
  left: calc(var(--year-marker-column) + (var(--year-marker-gap) / 2) - 5px);
  width: 10px;
  height: 10px;
  box-sizing: border-box;
  border: 2px solid #ffffff;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item::after {
  content: "";
  position: absolute;
  top: 17px;
  bottom: -16px;
  left: calc(var(--year-marker-column) + (var(--year-marker-gap) / 2) - 1px);
  width: 2px;
  background: color-mix(in srgb, var(--accent), #ffffff 68%);
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item:last-child::after {
  display: none;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item-head {
  display: contents;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item-head > strong,
.cv-preview[data-layout="year_marker_timeline"] .cv-item-head > .cv-item-title {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item-head > span {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  margin: 0;
  color: color-mix(in srgb, var(--accent), #111827 18%);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
  white-space: normal;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item > p,
.cv-preview[data-layout="year_marker_timeline"] .cv-item > ul {
  grid-column: 2;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item > p {
  line-height: 1.42;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item > ul {
  margin-top: 3px;
}

.cv-preview[data-layout="horizontal_career_strip"] {
  width: 1123px;
}

.cv-preview[data-layout="horizontal_career_strip"] .cv-page {
  width: 1123px;
  height: 794px;
  min-height: 794px;
  max-height: 794px;
  display: grid;
  grid-template-columns: minmax(0, 2.25fr) minmax(270px, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0 24px;
  padding: 38px 44px;
}

.cv-preview[data-layout="horizontal_career_strip"] .cv-head {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  padding-bottom: 15px;
  border-bottom: 4px solid var(--accent);
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-body {
  display: contents;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-main {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
  padding-top: 12px;
  overflow: hidden;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-flow-block,
.cv-preview[data-layout="horizontal_career_strip"] .career-side-block {
  min-width: 0;
  break-inside: avoid;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-side {
  grid-column: 2;
  grid-row: 1 / 3;
  display: block;
  min-width: 0;
  padding-left: 20px;
  border-left: 2px solid color-mix(in srgb, var(--accent) 34%, white);
  overflow: hidden;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-main .cv-section {
  margin-top: 0;
  margin-bottom: 12px;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-main .cv-section > h3 {
  margin-bottom: 7px;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-main .cv-item {
  min-height: 0;
  margin: 0 0 7px;
  padding: 9px 12px;
  border-left: 5px solid var(--accent);
  background: color-mix(in srgb, var(--accent) 7%, white);
  align-content: start;
  grid-auto-rows: max-content;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-main .cv-item > :last-child {
  margin-bottom: 0;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-main .cv-item-head {
  display: flex;
  gap: 14px;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-main .cv-item-head span {
  flex: 0 0 auto;
  color: var(--accent);
  white-space: nowrap;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-side .cv-section {
  margin-top: 0;
  margin-bottom: 14px;
}

.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-side .cv-section p,
.cv-preview[data-layout="horizontal_career_strip"] .career-landscape-side .cv-section li {
  line-height: 1.42;
}

.cv-preview[data-layout="timeline_cards"] .cv-section:has(.cv-item) {
  position: relative;
  padding-left: 20px;
  border-left: 3px solid color-mix(in srgb, var(--accent), #ffffff 55%);
}

.cv-preview[data-layout="timeline_cards"] .cv-item {
  position: relative;
  padding: 14px;
  border: 1px solid #dfe4df;
  background: #ffffff;
  box-shadow: 0 6px 14px rgba(31, 41, 46, 0.07);
}

.cv-preview[data-layout="timeline_cards"] .cv-item::before {
  content: "";
  position: absolute;
  top: 16px;
  left: -27px;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--accent);
}

.cv-preview[data-layout="timeline_cards"] .cv-item[data-break-key^="education:"] {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 8px 14px;
}

.cv-preview[data-layout="timeline_cards"] .cv-item[data-break-key^="education:"] .cv-item-head {
  display: contents;
}

.cv-preview[data-layout="timeline_cards"] .cv-item[data-break-key^="education:"] .cv-item-head strong {
  grid-column: 1;
  white-space: nowrap;
}

.cv-preview[data-layout="timeline_cards"] .cv-item[data-break-key^="education:"] .cv-item-head span {
  grid-column: 3;
  grid-row: 1;
}

.cv-preview[data-layout="timeline_cards"] .cv-item[data-break-key^="education:"] > p:first-of-type {
  grid-column: 2;
  grid-row: 1;
  white-space: nowrap;
}

.cv-preview[data-layout="timeline_cards"] .cv-item[data-break-key^="education:"] > p:not(:first-of-type) {
  grid-column: 1 / -1;
}

.cv-preview[data-layout="magazine_columns"] {
  font-family: Georgia, "Times New Roman", serif;
}

.cv-preview[data-layout="magazine_columns"] .cv-page {
  display: flex;
  flex-direction: column;
}

.cv-preview[data-layout="magazine_columns"] .cv-head {
  grid-template-columns: 1fr;
  text-align: center;
  border-top: 4px double var(--accent);
  border-bottom: 4px double var(--accent);
}

.cv-preview[data-layout="magazine_columns"] .cv-head h2 {
  font-size: 48px;
}

.cv-preview[data-layout="magazine_columns"] .cv-head ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.cv-preview[data-layout="magazine_columns"] .cv-main {
  columns: 2;
  column-gap: 34px;
  column-fill: auto;
  height: calc(100% - 24px);
  margin-top: 24px;
}

.cv-preview[data-layout="magazine_columns"] .cv-body {
  flex: 1 1 auto;
  min-height: 0;
}

.cv-preview[data-layout="magazine_columns"] .cv-section {
  break-inside: auto;
  margin-top: 0;
  margin-bottom: 22px;
}

.cv-preview[data-layout="magazine_columns"] .cv-section > h3,
.cv-preview[data-layout="magazine_columns"] .cv-item {
  break-inside: avoid;
}

.cv-preview[data-layout="magazine_columns"] .cv-section > h3 {
  break-after: avoid;
}

.cv-preview[data-layout="magazine_columns_landscape"] {
  width: 1123px;
  font-family: Georgia, "Times New Roman", serif;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-page {
  width: 1123px;
  height: 794px;
  min-height: 794px;
  max-height: 794px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: auto minmax(0, 1fr);
  column-gap: 26px;
  padding: 42px 48px;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-head {
  grid-column: 1 / 3;
  grid-row: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto minmax(0, 1fr);
  column-gap: 26px;
  border-top: 4px double var(--accent);
  border-bottom: 4px double var(--accent);
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-head > .cv-photo-frame {
  grid-column: 1;
  grid-row: 1 / 3;
  justify-self: center;
  align-self: center;
  width: 190px !important;
  height: 190px !important;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-head > div {
  grid-column: 2;
  grid-row: 1;
  text-align: left;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-head > ul {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  text-align: left;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-head h2 {
  font-size: 42px;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-body {
  display: contents;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-main {
  display: contents;
}

.cv-preview[data-layout="magazine_columns_landscape"] .magazine-flow-column {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.cv-preview[data-layout="magazine_columns_landscape"] .magazine-column-one {
  grid-column: 1;
  grid-row: 2;
  padding-top: 20px;
}

.cv-preview[data-layout="magazine_columns_landscape"] .magazine-column-two {
  grid-column: 2;
  grid-row: 2;
  padding-top: 20px;
}

.cv-preview[data-layout="magazine_columns_landscape"] .magazine-column-three {
  grid-column: 3;
  grid-row: 1 / 3;
}

.cv-preview[data-layout="magazine_columns_landscape"] .magazine-flow-block {
  break-inside: avoid;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-side {
  display: none;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-section {
  break-inside: auto;
  margin: 0 0 16px;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-section-continuation {
  margin-top: 0;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-section > h3,
.cv-preview[data-layout="magazine_columns_landscape"] .cv-item,
.cv-preview[data-layout="magazine_columns_landscape"] .cv-sidebar-block {
  break-inside: avoid;
}

.cv-preview[data-layout="magazine_columns_landscape"] .cv-section > h3 {
  break-after: avoid;
}

.cv-preview[data-layout="magazine_columns_landscape"] .magazine-column-three .tag-list {
  gap: 5px;
}

.cv-preview[data-layout="magazine_columns_landscape"] .magazine-column-three .tag-list span {
  padding: 5px 8px;
}

.cv-preview[data-layout="oversized_name"] {
}

.cv-preview[data-layout="oversized_name"] .cv-page {
  padding: 72px;
}

.cv-preview[data-layout="oversized_name"] .cv-head {
  grid-template-columns: 1fr;
  border-bottom: 0;
}

.cv-preview[data-layout="oversized_name"] .cv-head h2 {
  max-width: 520px;
  color: #101820;
  font: 900 66px/0.95 Inter, Arial, sans-serif;
}

.cv-preview[data-layout="oversized_name"] .cv-head p {
  max-width: 420px;
  font-size: 20px;
}

.cv-preview[data-layout="oversized_name"] .cv-section h3 {
  border-bottom: 0;
  color: #101820;
  font-size: 15px;
}

.cv-preview[data-layout="numbered_sections"] .cv-main {
  counter-reset: numberedsections;
}

.cv-preview[data-layout="numbered_sections"] .cv-section {
  position: relative;
  min-height: 48px;
  padding-left: 90px;
}

.cv-preview[data-layout="numbered_sections"] .cv-section h3 {
  border-bottom: 1px solid #dfe4df;
}

.cv-preview[data-layout="numbered_sections"] .cv-section h3::before {
  counter-increment: numberedsections;
  content: "0" counter(numberedsections);
  position: absolute;
  top: 0;
  left: 0;
  color: var(--accent);
  font: 900 32px/1 Inter, Arial, sans-serif;
}

.cv-preview[data-layout="numbered_sections"] .cv-section h3::after {
  content: none;
}

.cv-preview[data-layout="newspaper_grid"] {
  font-family: Georgia, "Times New Roman", serif;
}

.cv-preview[data-layout="newspaper_grid"] .cv-head {
  grid-template-columns: 1fr;
  text-align: center;
  border-top: 1px solid #20272b;
  border-bottom: 3px solid #20272b;
}

.cv-preview[data-layout="newspaper_grid"] .cv-head h2 {
  font-size: 50px;
  text-transform: uppercase;
}

.cv-preview[data-layout="newspaper_grid"] .cv-main {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 24px;
}

.cv-preview[data-layout="newspaper_grid"] .cv-section[data-break-key="section:experience"] {
  grid-row: span 3;
}

.cv-preview[data-layout="newspaper_grid"] .cv-section h3 {
  color: #20272b;
  border-color: #20272b;
}

.cv-preview[data-layout="typographic_blocks"] .cv-head {
  grid-template-columns: 1fr;
  padding: 34px;
  background: #101820;
  color: #ffffff;
  border: 0;
}

.cv-preview[data-layout="typographic_blocks"] .cv-head p,
.cv-preview[data-layout="typographic_blocks"] .cv-head ul {
  color: #ffffff;
}

.cv-preview[data-layout="typographic_blocks"] .cv-section {
  padding: 18px 0;
  border-bottom: 1px solid #dfe4df;
}

.cv-preview[data-layout="typographic_blocks"] .cv-section h3 {
  max-width: 220px;
  padding: 8px 10px;
  border: 0;
  background: var(--accent);
  color: #ffffff;
}

.cv-preview[data-layout="stacked_cards"] {
}

.cv-preview[data-layout="stacked_cards"] .cv-page {
  background: #f5f7f6;
}

.cv-preview[data-layout="stacked_cards"] .cv-head,
.cv-preview[data-layout="stacked_cards"] .cv-section,
.cv-preview[data-layout="stacked_cards"] .cv-bottom .cv-section {
  padding: 18px;
  border: 1px solid #dfe4df;
  background: #ffffff;
  box-shadow: 0 6px 16px rgba(31, 41, 46, 0.06);
}

.cv-preview[data-layout="stacked_cards"] .cv-head {
  grid-template-columns: 1fr;
  border-top: 5px solid var(--accent);
}

.cv-preview[data-layout="dashboard_grid"] {
}

.cv-preview[data-layout="dashboard_grid"] .cv-page {
  background: #f8fafb;
}

.cv-preview[data-layout="dashboard_grid"] .cv-head {
  grid-template-columns: 1fr;
  padding: 20px;
  border: 1px solid #dfe4df;
  border-left: 8px solid var(--accent);
  background: #ffffff;
}

.cv-preview[data-layout="dashboard_grid"] .cv-main,
.cv-preview[data-layout="dashboard_grid"] .cv-bottom {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.cv-preview[data-layout="dashboard_grid"] .cv-section {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid #dfe4df;
  background: #ffffff;
}

.cv-preview[data-layout="dashboard_grid"] .cv-section[data-break-key="section:experience"] {
  grid-column: span 2;
}

.cv-preview[data-layout="profile_card_content"] .cv-head {
  grid-template-columns: 180px 1fr;
  gap: 24px;
  padding: 22px;
  border: 1px solid color-mix(in srgb, var(--accent), #ffffff 55%);
  background: color-mix(in srgb, var(--accent), #ffffff 91%);
}

.cv-preview[data-layout="profile_card_content"] .cv-head:has(.cv-photo) {
  grid-template-columns: auto 180px 1fr;
}

.cv-preview[data-layout="profile_card_content"] .cv-body {
  display: grid;
  grid-template-columns: 32% 1fr;
  gap: 26px;
  margin-top: 22px;
}

.cv-preview[data-layout="profile_card_content"] .cv-side {
  display: block;
}

.cv-preview[data-layout="profile_card_content"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="horizontal_section_cards"] .cv-head {
  grid-template-columns: 1fr;
  margin: -56px -56px 22px;
  padding: 40px 56px 30px;
  background: var(--accent);
  color: #ffffff;
  border: 0;
}

.cv-preview[data-layout="horizontal_section_cards"] .cv-head p,
.cv-preview[data-layout="horizontal_section_cards"] .cv-head ul {
  color: #ffffff;
}

.cv-preview[data-layout="horizontal_section_cards"] .cv-section {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 18px;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid #dfe4df;
}

.cv-preview[data-layout="horizontal_section_cards"] .cv-section h3 {
  border: 0;
}

.cv-preview[data-layout="mixed_modules"] .cv-head {
  grid-template-columns: 1fr minmax(170px, 230px);
  padding-bottom: 16px;
}

.cv-preview[data-layout="mixed_modules"] .cv-main {
  display: grid;
  grid-template-columns: 38% 1fr;
  gap: 14px 22px;
}

.cv-preview[data-layout="mixed_modules"] .cv-section {
  margin-top: 0;
  padding: 16px;
  border: 1px solid #dfe4df;
}

.cv-preview[data-layout="mixed_modules"] .cv-section[data-break-key="section:experience"] {
  grid-column: 2;
  grid-row: span 3;
}

.cv-preview[data-layout="mixed_modules"] .cv-section[data-break-key="section:profile"],
.cv-preview[data-layout="mixed_modules"] .cv-section[data-break-key="section:motivation"],
.cv-preview[data-layout="mixed_modules"] .cv-section[data-break-key="section:education"] {
  grid-column: 1;
}

.cv-preview[data-layout="mixed_modules"] .cv-bottom {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1.2fr 0.9fr 0.9fr;
  gap: 12px;
}

.cv-preview:is(
  [data-layout="left_full_sidebar"],
  [data-layout="top_sidebar"],
  [data-layout="right_narrow_sidebar"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="split_50_50"],
  [data-layout="full_width_experience"],
  [data-layout="modular_grid"],
  [data-layout="newspaper_grid"],
  [data-layout="typographic_blocks"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"],
  [data-layout="horizontal_section_cards"],
  [data-layout="wide_typographic"]
) .cv-head:has(.cv-photo) {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  column-gap: 28px;
}

.cv-preview:is(
  [data-layout="left_full_sidebar"],
  [data-layout="top_sidebar"],
  [data-layout="right_narrow_sidebar"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="split_50_50"],
  [data-layout="full_width_experience"],
  [data-layout="modular_grid"],
  [data-layout="newspaper_grid"],
  [data-layout="typographic_blocks"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"],
  [data-layout="horizontal_section_cards"],
  [data-layout="wide_typographic"]
) .cv-head:has(.cv-photo) .cv-photo-frame {
  grid-column: 2;
  grid-row: 1 / span 2;
  justify-self: end;
  align-self: start;
}

.cv-preview:is(
  [data-layout="left_full_sidebar"],
  [data-layout="top_sidebar"],
  [data-layout="right_narrow_sidebar"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="split_50_50"],
  [data-layout="full_width_experience"],
  [data-layout="modular_grid"],
  [data-layout="newspaper_grid"],
  [data-layout="typographic_blocks"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"],
  [data-layout="horizontal_section_cards"],
  [data-layout="wide_typographic"]
) .cv-head:has(.cv-photo) > div {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
}

.cv-preview:is(
  [data-layout="left_full_sidebar"],
  [data-layout="top_sidebar"],
  [data-layout="right_narrow_sidebar"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="split_50_50"],
  [data-layout="full_width_experience"],
  [data-layout="modular_grid"],
  [data-layout="newspaper_grid"],
  [data-layout="typographic_blocks"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"],
  [data-layout="horizontal_section_cards"],
  [data-layout="wide_typographic"]
) .cv-head:has(.cv-photo) > ul {
  grid-column: 1;
  grid-row: 2;
  margin-top: 10px;
}

.cv-preview[data-layout="wide_typographic"] .cv-head h2 {
  max-width: none;
  text-wrap: balance;
}

.cv-preview[data-layout="wide_typographic"] .cv-head:has(.cv-photo) h2 {
  font-size: 50px;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-head {
  margin-left: calc(32% + 30px);
}

.cv-preview[data-layout="left_full_sidebar"] .cv-body {
  grid-template-columns: 32% 1fr;
  min-height: 860px;
  margin-top: 24px;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-side {
  align-self: stretch;
  min-height: calc(1123px - 112px);
  margin: -166px 0 -56px -56px;
  padding: 166px 22px 56px 56px;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-head:has(.cv-photo) .cv-photo-frame {
  justify-self: end;
}

.cv-preview[data-layout="alternating_grid"] .cv-main {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cv-preview[data-layout="alternating_grid"] .cv-section[data-break-key="section:profile"],
.cv-preview[data-layout="alternating_grid"] .cv-section[data-break-key="section:motivation"],
.cv-preview[data-layout="alternating_grid"] .cv-section[data-break-key="section:education"] {
  grid-column: auto;
}

.cv-preview[data-layout="alternating_grid"] .cv-section[data-break-key="section:experience"] {
  grid-column: 1 / -1;
}

/* Layout correction pass 2026-07-22 */
.cv-preview[data-layout="date_rail"] .cv-section .cv-item {
  display: block;
}

.cv-preview[data-layout="date_rail"] .cv-item-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
}

.cv-preview[data-layout="date_rail"] .cv-item-head,
.cv-preview[data-layout="date_rail"] .cv-item > p,
.cv-preview[data-layout="date_rail"] .cv-item > ul {
  grid-column: auto;
}

.cv-preview[data-layout="date_rail"] .cv-item-head span {
  grid-column: auto;
  grid-row: auto;
  width: auto;
  margin-left: 0;
  white-space: nowrap;
}

.cv-preview[data-layout="section_labels_left"] .cv-head {
  grid-template-columns: minmax(0, 1fr) minmax(180px, 240px);
}

.cv-preview[data-layout="section_labels_left"] .cv-head:has(.cv-photo) {
  grid-template-columns: auto minmax(0, 1fr) minmax(180px, 240px);
}

.cv-preview[data-layout="section_labels_left"] .cv-section {
  grid-template-columns: 190px minmax(0, 1fr);
  align-items: start;
}

.cv-preview[data-layout="section_labels_left"] .cv-section h3 {
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  line-height: 1.25;
}

.cv-preview[data-layout="left_sidebar"] .cv-head {
  grid-template-columns: 1fr;
  border-bottom: 0;
}

.cv-preview[data-layout="left_sidebar"] .cv-head:has(.cv-photo) {
  grid-template-columns: minmax(0, 1fr) auto;
}

.cv-preview[data-layout="left_sidebar"] .cv-head:has(.cv-photo) .cv-photo-frame {
  grid-column: 2;
  grid-row: 1 / span 2;
  justify-self: end;
}

.cv-preview[data-layout="left_sidebar"] .cv-head:has(.cv-photo) > div {
  grid-column: 1;
}

.cv-preview[data-layout="left_sidebar"] .cv-body {
  display: grid;
  grid-template-columns: 30% 1fr;
  gap: 30px;
  margin-top: -20px;
}

.cv-preview[data-layout="left_sidebar"] .cv-side {
  box-sizing: border-box;
  display: block;
  margin: -24px 0 -56px -56px;
  padding: 28px 22px 56px;
  background: color-mix(in srgb, var(--accent), #ffffff 88%);
}

.cv-preview[data-layout="left_sidebar"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-page {
  display: grid;
  grid-template-columns: 32% minmax(0, 1fr);
  grid-template-rows: auto 1fr;
  column-gap: 30px;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--accent), #ffffff 82%) 0 32%, #ffffff 32% 100%);
}

.cv-preview[data-layout="left_full_sidebar"] .cv-head {
  grid-column: 2;
  grid-row: 1;
  margin-left: 0;
  grid-template-columns: minmax(0, 1fr);
  border-bottom: 0;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-head:has(.cv-photo) {
  grid-template-columns: minmax(0, 1fr) auto;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-head:has(.cv-photo) .cv-photo-frame {
  grid-column: 2;
  grid-row: 1 / span 2;
  justify-self: end;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-body {
  display: contents;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-side {
  grid-column: 1;
  grid-row: 1 / span 2;
  display: block;
  min-height: auto;
  margin: -56px 0 -56px -56px;
  padding: 56px 42px 56px 22px;
  background: transparent;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-main {
  grid-column: 2;
  grid-row: 2;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-page {
  display: grid;
  grid-template-columns: 32% minmax(0, 1fr);
  grid-template-rows: auto 1fr;
  column-gap: 30px;
  background:
    linear-gradient(90deg, #e5202e 0 32%, #ffffff 32% 100%);
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-head {
  grid-column: 2;
  grid-row: 1;
  grid-template-columns: minmax(0, 1fr);
  margin-left: 0;
  border-bottom: 0;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-body {
  display: contents;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-side {
  grid-column: 1;
  grid-row: 1 / span 2;
  display: block;
  margin: -56px 0 -56px -56px;
  padding: 56px 22px;
  background: #e5202e;
  color: #ffffff;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-main {
  grid-column: 2;
  grid-row: 2;
}

/* One heading system for every section in the white main column. */
.cv-preview[data-layout="full_sidebar_photo"] .cv-main .cv-section > h3 {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid #dfe4df;
  color: var(--accent);
  font-size: calc(13px * var(--cv-font-size-scale));
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
  white-space: nowrap;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-main .cv-section > h3 .cv-inline-icon {
  flex: 0 0 auto;
  margin-top: 0;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-photo-frame {
  max-width: calc(100% + 44px);
  max-height: none;
  margin: 0 auto 28px;
  border-color: rgba(255, 255, 255, 0.86);
  background: rgba(255, 255, 255, 0.18);
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-photo-frame[data-photo-frame="off"] {
  border-color: transparent;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-side-section h3 {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 24px;
  margin: 0;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.36);
  color: #ffffff;
  font-size: calc(12px * var(--cv-font-size-scale));
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-side-section h3 .cv-inline-icon {
  flex: 0 0 auto;
  margin-top: 0;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-side-section h3 > span {
  min-width: 0;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-side-section ul,
.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-side-section a,
.cv-preview[data-layout="full_sidebar_photo"] .cv-side .text-list {
  color: #ffffff;
}

.cv-preview[data-layout="full_sidebar_photo"] .cv-side .tag-list span {
  border-color: rgba(255, 255, 255, 0.44);
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
}

.cv-preview[data-layout="left_full_sidebar"] .cv-side .tag-list span,
.cv-preview[data-layout="full_sidebar_photo"] .cv-side .tag-list span {
  font-size: 13px;
  line-height: 1.35;
}

.cv-preview[data-layout="right_narrow_sidebar"] .cv-side .tag-list span,
.cv-preview[data-layout="top_sidebar"] .cv-side .tag-list span {
  font-size: 13px;
  line-height: 1.35;
}

.cv-preview[data-layout="top_sidebar"] .cv-side {
  border-top: 0;
  border-bottom: 3px solid var(--accent);
}

.cv-preview[data-layout="split_sidebar"] .cv-bottom {
  display: none;
}

.cv-preview[data-layout="split_50_50"] .cv-section[data-break-key="section:profile"],
.cv-preview[data-layout="split_50_50"] .cv-section[data-break-key="section:motivation"] {
  padding-top: 8px;
}

.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item {
  display: grid;
  grid-template-columns: 1fr;
}

.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item-head,
.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item > p,
.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item > ul {
  grid-column: 1;
}

.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.cv-preview[data-layout="full_width_experience"] .cv-section[data-break-key="section:experience"] .cv-item-head span {
  grid-column: auto;
  grid-row: auto;
  margin-left: 0;
  white-space: nowrap;
}

.cv-preview[data-layout="magazine_columns"] .cv-head:has(.cv-photo) .cv-photo-frame {
  justify-self: center;
  align-self: center;
}

.cv-preview[data-layout="oversized_name"] .cv-head:has(.cv-photo) {
  align-items: start;
}

.cv-preview[data-layout="oversized_name"] .cv-head:has(.cv-photo) .cv-photo-frame {
  align-self: end;
  margin-top: 44px;
}

.cv-preview:is(
  [data-layout="newspaper_grid"],
  [data-layout="typographic_blocks"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"]
) .cv-head:has(.cv-photo) {
  align-items: center;
}

.cv-preview:is(
  [data-layout="newspaper_grid"],
  [data-layout="typographic_blocks"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"]
) .cv-head:has(.cv-photo) .cv-photo-frame {
  align-self: center;
}

.cv-preview:is(
  [data-layout="newspaper_grid"],
  [data-layout="typographic_blocks"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"]
) .cv-head p {
  margin-bottom: 12px;
}

.cv-preview[data-layout="dashboard_grid"] .cv-main,
.cv-preview[data-layout="dashboard_grid"] .cv-bottom {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cv-preview[data-layout="dashboard_grid"] .cv-section[data-break-key="section:profile"],
.cv-preview[data-layout="dashboard_grid"] .cv-section[data-break-key="section:motivation"],
.cv-preview[data-layout="dashboard_grid"] .cv-section[data-break-key="section:experience"] {
  grid-column: 1 / -1;
}

.cv-preview[data-layout="profile_card_content"] .cv-head {
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
}

.cv-preview[data-layout="profile_card_content"] .cv-head:has(.cv-photo) {
  grid-template-columns: minmax(0, 1fr) auto;
}

.cv-preview[data-layout="profile_card_content"] .cv-head:has(.cv-photo) .cv-photo-frame {
  align-self: center;
}

.cv-preview[data-layout="profile_card_content"] .cv-head > div {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 18px;
}

.cv-preview[data-layout="profile_card_content"] .cv-head h2,
.cv-preview[data-layout="profile_card_content"] .cv-head p {
  margin: 0;
}

.cv-preview[data-layout="profile_card_content"] .cv-section[data-break-key="section:education"] {
  grid-column: 1;
}

.cv-preview[data-layout="horizontal_section_cards"] .cv-head {
  grid-template-columns: minmax(0, 1fr);
  padding-top: 28px;
  padding-bottom: 24px;
}

.cv-preview[data-layout="horizontal_section_cards"] .cv-head:has(.cv-photo) {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.cv-preview[data-layout="horizontal_section_cards"] .cv-head h2 {
  font-size: 34px;
}

.cv-preview[data-layout="horizontal_section_cards"] .cv-head p {
  margin-top: 6px;
}

.cv-preview[data-layout="horizontal_section_cards"] .cv-section {
  display: block;
}

.cv-preview[data-layout="mixed_modules"] .cv-head {
  grid-template-columns: minmax(0, 1fr);
}

.cv-preview[data-layout="mixed_modules"] .cv-head:has(.cv-photo) {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.cv-preview[data-layout="mixed_modules"] .cv-head:has(.cv-photo) .cv-photo-frame {
  grid-column: 2;
  grid-row: 1 / span 2;
  justify-self: end;
  align-self: center;
}

.cv-preview[data-layout="mixed_modules"] .cv-head:has(.cv-photo) > div {
  grid-column: 1;
  grid-row: 1;
}

.cv-preview[data-layout="mixed_modules"] .cv-head:has(.cv-photo) > ul {
  grid-column: 1;
  grid-row: 2;
  margin-top: 10px;
}

.cv-preview[data-layout="mixed_modules"] .cv-main {
  grid-template-columns: 1fr;
}

.cv-preview[data-layout="mixed_modules"] .cv-section[data-break-key="section:experience"],
.cv-preview[data-layout="mixed_modules"] .cv-section[data-break-key="section:profile"],
.cv-preview[data-layout="mixed_modules"] .cv-section[data-break-key="section:motivation"],
.cv-preview[data-layout="mixed_modules"] .cv-section[data-break-key="section:education"] {
  grid-column: 1;
  grid-row: auto;
}

.cv-preview[data-tag-style="plain"] .tag-list span {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
}

.cv-preview[data-tag-style="plain"] .tag-list span:not(:last-child)::after {
  content: ", ";
  margin-right: 5px;
  color: #667078;
}

.startup-dialog,
.account-dialog {
  max-width: 520px;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.startup-dialog {
  max-width: 760px;
  width: min(calc(100vw - 32px), 760px);
  padding: 0;
}

.startup-dialog::backdrop {
  background: rgba(18, 29, 34, 0.45);
  backdrop-filter: blur(4px);
}

.startup-content {
  display: grid;
  gap: 18px;
  padding: 24px;
}

.startup-copy h2,
.startup-copy p {
  margin: 0;
}

.startup-copy {
  display: grid;
  gap: 8px;
}

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

.startup-import {
  display: grid;
  gap: 14px;
}

.dialog-content {
  position: relative;
  display: grid;
  gap: 16px;
  padding: 12px;
}

.dialog-content h2,
.dialog-content p {
  margin: 0;
}

.password-panel {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.guest-password-reset-panel {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.guest-password-reset-panel h3,
.guest-password-reset-panel p {
  margin: 0;
}

.account-reset-request {
  justify-content: flex-start;
}

.mobile-install-panel {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(229, 57, 53, 0.28);
  border-radius: 8px;
  background: #fff7f7;
}

.mobile-install-panel h3,
.mobile-install-panel p {
  margin: 0;
}

.mobile-install-panel h3 {
  font-size: 15px;
}

.mobile-install-panel .primary-button {
  width: 100%;
}

.mobile-install-instructions {
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

body[data-account="guest"] .password-panel {
  display: none;
}

.b2b-head {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 18px;
  align-items: start;
}

.b2b-head h2,
.b2b-card h3,
.b2b-section h3,
.review-card h3 {
  margin: 0;
}

.b2b-head p,
.b2b-card p,
.review-card p,
.comment-row p,
.b2b-table small,
.comment-row small,
.b2b-card small {
  color: var(--muted);
}

.b2b-context-actions,
.status-actions,
.b2b-filterbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.status-actions .active {
  border-color: var(--brand);
  background: #eef7f5;
  color: var(--brand-dark);
}

.b2b-layout {
  display: grid;
  grid-template-columns: 178px minmax(0, 1fr);
  min-height: calc(100vh - 210px);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  overflow: hidden;
}

.b2b-tabs {
  display: grid;
  align-content: start;
  gap: 6px;
  overflow: auto;
  padding: 12px;
  border-right: 1px solid var(--pilot-red-dark);
  background: var(--pilot-red);
  color: #ffffff;
  scrollbar-width: thin;
}

.b2b-tabs .category-tab {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #ffffff;
  padding: 0 11px;
  text-align: left;
  white-space: normal;
}

.b2b-tabs .category-tab:hover,
.b2b-tabs .category-tab.active {
  border-color: rgba(255, 255, 255, 0.68);
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.b2b-nav-group {
  display: block;
  margin: 10px 10px 1px;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.28);
  color: rgba(255, 255, 255, 0.72);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.b2b-nav-group:first-child {
  margin-top: 2px;
  padding-top: 0;
  border-top: 0;
}

.b2b-context-navigation {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.b2b-panel,
.b2b-section,
.comment-list {
  display: grid;
  gap: 14px;
}

.b2b-panel {
  min-width: 0;
  padding: 16px;
  overflow: auto;
}

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

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

.metric-card,
.b2b-card,
.review-card,
.comment-row {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.metric-card {
  display: grid;
  gap: 4px;
  padding: 14px;
}

.metric-card strong {
  font-size: 28px;
  line-height: 1;
}

.metric-card span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.b2b-card,
.review-card {
  display: grid;
  gap: 12px;
  padding: 14px;
}


.featured-layout-admin {
  align-content: start;
}

.featured-layout-admin > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  list-style: none;
}

.featured-layout-admin > summary::-webkit-details-marker { display: none; }
.featured-layout-admin > summary::after { content: "+"; color: var(--brand); font-size: 24px; font-weight: 800; }
.featured-layout-admin[open] > summary::after { content: "−"; }
.featured-layout-admin-body { display: grid; gap: 14px; margin-top: 14px; }

.featured-layout-count {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

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

.featured-layout-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  cursor: pointer;
}

.featured-layout-option:has(input:checked) {
  border-color: var(--pilot-red);
  background: #fff5f5;
}

.featured-layout-option input {
  width: auto;
  margin-top: 3px;
}

.featured-layout-option span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.featured-layout-option strong {
  color: var(--text);
  font-size: 13px;
  line-height: 1.25;
}

.featured-layout-option small {
  color: var(--muted);
  font-size: 12px;
}

.b2b-filterbar {
  align-items: center;
}

.b2b-filterbar input,
.b2b-filterbar select {
  width: auto;
  min-width: 170px;
}

.b2b-table {
  display: grid;
  grid-template-columns: minmax(180px, 1.3fr) minmax(160px, 1fr) minmax(150px, 0.9fr) minmax(170px, 1fr);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.admin-account-table {
  grid-template-columns: minmax(220px, 1.25fr) minmax(150px, 0.8fr) minmax(140px, 0.7fr) minmax(180px, 0.9fr) minmax(120px, 0.55fr);
}

.admin-products-table {
  grid-template-columns: minmax(110px, 0.6fr) minmax(180px, 1fr) minmax(150px, 0.8fr) minmax(190px, 1fr) minmax(180px, 0.9fr) minmax(120px, 0.55fr);
}

.leave-site-dialog {
  width: min(calc(100vw - 32px), 500px);
  padding: 12px;
}

.leave-site-dialog::backdrop {
  background: rgba(18, 29, 34, 0.52);
  backdrop-filter: blur(4px);
}

.admin-language-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-language-switch .category-tab {
  min-width: 48px;
  padding: 8px 10px;
}

.admin-localized-list {
  display: grid;
  gap: 12px;
}

.admin-localized-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}

.admin-localized-card > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
}

.admin-localized-card > summary::-webkit-details-marker { display: none; }
.admin-localized-card > summary::before { content: "▶"; color: var(--muted); font-size: 12px; }
.admin-localized-card[open] > summary::before { transform: rotate(90deg); }
.admin-localized-card > summary > span:first-of-type { display: grid; gap: 3px; margin-right: auto; }
.admin-localized-card > summary small { color: var(--muted); }

.admin-action-log { margin-top: 0; }
.admin-action-log .admin-localized-card-body { overflow-x: auto; }

.admin-summary-status,
.admin-visibility-options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.admin-localized-card-body {
  display: grid;
  gap: 14px;
  padding: 16px;
  border-top: 1px solid var(--line);
}

.admin-translation-fields,
.admin-product-technical-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-translation-fields label,
.admin-product-technical-grid label {
  display: grid;
  gap: 6px;
  font-weight: 700;
}

.admin-translation-fields textarea { resize: vertical; }

@media (max-width: 760px) {
  .admin-translation-fields,
  .admin-product-technical-grid { grid-template-columns: 1fr; }
  .admin-localized-card > summary { align-items: flex-start; }
}

.livecheck-table {
  grid-template-columns: minmax(90px, 0.45fr) minmax(120px, 0.6fr) minmax(180px, 1fr) minmax(260px, 1.4fr);
}

.billing-table {
  grid-template-columns: minmax(210px, 1.2fr) minmax(100px, 0.55fr) minmax(130px, 0.65fr) minmax(220px, 1.15fr) minmax(100px, 0.5fr);
}

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

.admin-layout-create,
.admin-layout-edit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.admin-layout-create label,
.admin-layout-edit-grid label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-layout-wide {
  grid-column: 1 / -1;
}

.admin-layout-supports {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.admin-layout-supports legend {
  padding: 0 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.admin-layout-supports .inline-check {
  display: flex;
}

.layout-publication-widget {
  align-content: start;
  border-color: #b9d6df;
  background: linear-gradient(135deg, #f8fcfd, #f1f8fa);
}

.layout-publication-summary,
.layout-status-tabs,
.layout-status-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.layout-publication-collapse-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  list-style: none;
}

.layout-publication-collapse-summary::-webkit-details-marker {
  display: none;
}

.layout-publication-collapse-summary::after {
  content: "▾";
  flex: 0 0 auto;
  color: var(--brand);
  font-size: 18px;
  transition: transform 0.18s ease;
}

.layout-publication-widget:not([open]) .layout-publication-collapse-summary::after {
  transform: rotate(-90deg);
}

.layout-publication-collapse-summary h3,
.layout-publication-collapse-summary p {
  margin: 0;
}

.layout-publication-collapse-summary p {
  margin-top: 4px;
  color: var(--muted);
}

.layout-publication-collapse-content {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.layout-widget-collapse-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  list-style: none;
}

.layout-widget-collapse-summary::-webkit-details-marker {
  display: none;
}

.layout-widget-collapse-summary::after {
  content: "▾";
  flex: 0 0 auto;
  color: var(--brand);
  font-size: 18px;
  transition: transform 0.18s ease;
}

.layout-widget-collapse:not([open]) .layout-widget-collapse-summary::after {
  transform: rotate(-90deg);
}

.layout-widget-collapse-summary h3,
.layout-widget-collapse-summary p {
  margin: 0;
}

.layout-widget-collapse-summary p {
  margin-top: 4px;
  color: var(--muted);
}

.layout-widget-collapse-content {
  display: grid;
  gap: 14px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.layout-editor-status-toolbar {
  margin: 0;
}

.layout-admin-message:empty {
  display: none;
}

.layout-save-choice-dialog .dialog-content {
  width: min(720px, calc(100vw - 32px));
  max-width: 720px;
}

.layout-save-choice-option {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px 18px;
  align-items: end;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}

.layout-save-choice-option.is-copy {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: color-mix(in srgb, var(--brand) 5%, var(--surface));
}

.layout-save-choice-option > div {
  min-width: 0;
}

.layout-save-choice-option.is-copy > div,
.layout-save-choice-option.is-copy > button {
  grid-column: 1 / -1;
}

.layout-save-choice-option h3,
.layout-save-choice-option p {
  margin: 0;
}

.layout-save-choice-option p {
  margin-top: 4px;
  color: var(--muted);
}

@media (max-width: 640px) {
  .layout-save-choice-option,
  .layout-save-choice-option.is-copy {
    grid-template-columns: 1fr;
  }

  .layout-save-choice-option > button,
  .layout-save-choice-option.is-copy > div,
  .layout-save-choice-option.is-copy > button {
    grid-column: 1;
  }
}

.layout-status-list {
  display: grid;
  gap: 8px;
}

.layout-status-card {
  display: grid;
  grid-template-columns: 54px minmax(180px, 1fr) auto minmax(250px, auto);
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

@media (max-width: 860px) {
  .layout-publication-collapse-summary,
  .layout-widget-collapse-summary {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .layout-status-card {
    grid-template-columns: 46px minmax(0, 1fr) auto;
  }

  .layout-status-actions {
    grid-column: 1 / -1;
  }
}

.layout-status-preview {
  display: grid;
  align-content: start;
  gap: 5px;
  width: 42px;
  height: 54px;
  padding: 7px 6px;
  border: 1px solid #cbd5da;
  border-top: 6px solid var(--layout-status-accent, var(--brand));
  border-radius: 4px;
  background: #ffffff;
  box-shadow: 0 3px 8px rgba(25, 40, 47, 0.1);
}

.layout-status-preview span {
  display: block;
  height: 3px;
  border-radius: 999px;
  background: #d7e0e4;
}

.layout-status-preview span:nth-child(2) { width: 78%; }
.layout-status-preview span:nth-child(3) { width: 90%; }

.layout-status-info {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.layout-status-info small {
  overflow: hidden;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.layout-status-badge.is-live {
  border-color: #a8d8ba;
  background: #eaf8ef;
  color: #1f6b3a;
}

.layout-status-badge.is-paused {
  border-color: #ead08c;
  background: #fff7df;
  color: #76560c;
}

.layout-status-badge.is-disabled {
  border-color: #d2d8dc;
  background: #f0f3f5;
  color: #5e6a70;
}

.layout-status-empty {
  margin: 0;
  padding: 16px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  text-align: center;
}

.layout-publication-select {
  display: grid;
  gap: 4px;
  min-width: 150px;
}

.admin-layout-list {
  display: grid;
  gap: 14px;
}

.admin-layout-card {
  grid-template-columns: minmax(220px, 0.55fr) minmax(360px, 1.45fr);
  align-items: start;
}

.admin-layout-preview {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #e8edf1;
}

.admin-layout-preview .layout-mini-frame {
  height: 350px;
}

.admin-layout-fields {
  display: grid;
  gap: 12px;
  min-width: 0;
}

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

.admin-layout-card code {
  font-size: 12px;
}

.layout-designer-card {
  align-content: start;
}

.layout-designer-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.layout-designer-meta label {
  display: grid;
  gap: 4px;
}

.layout-designer-workspace {
  display: grid;
  grid-template-columns: minmax(250px, 0.55fr) minmax(520px, 1.45fr);
  gap: 14px;
  align-items: start;
}

.layout-designer-controls {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.layout-designer-controls h4 {
  margin: 8px 0 0;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--line);
}

.layout-designer-controls label,
.designer-width-controls {
  display: grid;
  gap: 4px;
}

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

.designer-column-warning {
  padding: 8px;
  border-radius: 6px;
  background: #fff4d6;
  color: #73510d;
}

.layout-designer-preview-wrap {
  min-width: 0;
  height: 680px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #dfe6ea;
}

.layout-designer-preview {
  min-width: 650px;
  min-height: 650px;
  padding: 18px;
}

.designer-admin-canvas {
  margin: 0;
  transform: scale(0.55);
  transform-origin: top left;
}

.designer-admin-canvas[data-orientation="landscape"] {
  transform: scale(0.52);
}

.layout-zone-editor {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.designer-zone-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 10px;
}

.designer-zone {
  display: grid;
  gap: 7px;
  align-content: start;
  min-height: 95px;
  padding: 10px;
  border: 1px dashed #9aaab4;
  border-radius: 8px;
  background: #f4f7f8;
}

.designer-section-item {
  display: grid;
  grid-template-columns: auto minmax(100px, 1fr) minmax(105px, 0.8fr);
  gap: 7px;
  align-items: center;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  cursor: grab;
}

.designer-section-item.is-dragging {
  opacity: 0.45;
}

.designer-drag-handle {
  color: var(--muted);
  font-weight: 900;
}

/* CV layout builder: shared document model, A4 canvas and property inspector. */
.layout-builder-launch {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
  padding: 16px;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  background: linear-gradient(135deg, #f8fbfc, #edf5f7);
}

.layout-builder-launch p { margin: 3px 0 0; color: #687780; font-size: 12px; }
.layout-zone-editor-legacy { margin-top: 14px; border: 1px solid #d8e1e7; border-radius: 9px; background: #f8fafc; }
.layout-zone-editor-legacy > summary { display: flex; align-items: center; gap: 10px; padding: 11px 13px; cursor: pointer; }
.layout-zone-editor-legacy > summary span { color: #7a8993; font-size: 11px; }
.layout-zone-editor-legacy > .designer-zone-grid { padding: 12px; border-top: 1px solid #d8e1e7; }
.layout-builder-dialog {
  width: 100vw;
  max-width: none;
  height: 100vh;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: #e6ebef;
  overflow: hidden;
}

.layout-builder-dialog::backdrop { background: rgba(6, 26, 52, .58); }
.layout-builder-dialog[open] { display: grid; grid-template-rows: 72px minmax(0, 1fr); }
.is-layout-builder-open { overflow: hidden; }

.layout-builder-appbar {
  display: grid;
  grid-template-columns: minmax(170px, 220px) minmax(0, 1fr) 40px;
  align-items: center;
  gap: 12px;
  padding: 8px 14px;
  border-bottom: 1px solid #cbd5e1;
  background: #fff;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
  z-index: 20;
}
.layout-builder-appbar-title { display: grid; }
.layout-builder-appbar small { color: #7a8993; }
.layout-builder-appbar [data-builder-save-status] { font-size: 9px; font-weight: 800; }
.layout-builder-appbar [data-builder-save-status].is-dirty { color: #a16207; }
.layout-builder-appbar [data-builder-save-status].is-error { color: #b42318; }
.layout-builder-toolbar { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 8px; overflow-x: auto; padding: 2px 0; }
.layout-builder-tool-group { display: flex; flex: 0 0 auto; border: 1px solid #cbd5e1; border-radius: 7px; overflow: hidden; }
.layout-builder-tool-group button { min-height: 32px; padding: 0 9px; border: 0; background: #fff; color: #334155; font-size: 10px; font-weight: 800; cursor: pointer; white-space: nowrap; }
.layout-builder-tool-group button + button { border-left: 1px solid #cbd5e1; }
.layout-builder-tool-group button:hover:not(:disabled) { background: #eef7f9; color: #0f5f6d; }
.layout-builder-tool-group button:disabled { color: #aab4bd; background: #f8fafc; cursor: not-allowed; }
.layout-builder-tool-group button.is-primary { background: #176b87; color: #fff; }
.layout-builder-tool-group button.is-primary:hover { background: #0f5f6d; color: #fff; }
.layout-builder-save-actions { border-color: #8ab9c7; }
.layout-builder-enable { flex: 0 0 auto; white-space: nowrap; font-size: 10px; }
.layout-builder-close { justify-self: end; }
.layout-builder-zoom { display: flex; align-items: center; border: 1px solid #cbd5e1; border-radius: 7px; overflow: hidden; }
.layout-builder-zoom button { width: 32px; height: 30px; border: 0; background: #fff; cursor: pointer; font-size: 18px; }
.layout-builder-zoom output { min-width: 48px; text-align: center; font-size: 11px; font-weight: 900; }

.layout-builder-shell {
  margin-top: 20px;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  background: #f8fafc;
  overflow: hidden;
}

.layout-builder-shell > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  cursor: pointer;
  background: #eef4f7;
}

.layout-builder-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  padding: 12px;
  border-top: 1px solid #d8e1e7;
  border-bottom: 1px solid #d8e1e7;
  background: #fff;
}

.layout-builder-toolbar > span { margin-right: 4px; font-weight: 900; }
.layout-builder-toolbar .ghost-button { margin-left: auto; }

.layout-builder-workspace {
  display: grid;
  grid-template-columns: 230px minmax(520px, 1fr) 290px;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  --builder-zoom: .7;
}

.layout-builder-left,
.layout-builder-properties {
  min-width: 0;
  padding: 14px;
  background: #fff;
  overflow: auto;
}

.layout-builder-panel-title { display: grid; gap: 2px; margin-bottom: 14px; }
.layout-builder-panel-title strong { font-size: 14px; }
.layout-builder-panel-title small { color: #7a8993; font-size: 10px; }
.layout-builder-layers-title { margin-top: 20px; padding-top: 14px; border-top: 1px solid #e2e8f0; }

.layout-builder-element-palette {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}
.layout-builder-entry-field-palette { display: grid; gap: 6px; }
.layout-builder-entry-field-palette button { display: grid; grid-template-columns: 25px minmax(0, 1fr); align-items: center; gap: 6px; min-height: 34px; padding: 6px 8px; border: 1px solid #b9dbe2; border-radius: 7px; background: #f5fbfc; color: #243b53; text-align: left; cursor: grab; }
.layout-builder-entry-field-palette button:hover { border-color: #176b87; background: #e8f5f7; }
.layout-builder-entry-field-palette button.is-dragging { opacity: .45; cursor: grabbing; }
.layout-builder-entry-field-palette button span { color: #176b87; font-size: 13px; font-weight: 900; text-align: center; }
.layout-builder-entry-field-palette button strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }

.layout-builder-element-palette button {
  display: grid;
  grid-template-columns: 24px 1fr;
  align-items: center;
  gap: 5px;
  min-height: 38px;
  padding: 6px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #fff;
  color: #243b53;
  text-align: left;
  cursor: pointer;
}

.layout-builder-element-palette button:hover,
.layout-builder-data-palette button:hover { border-color: #176b87; background: #eef7f9; }
.layout-builder-element-palette button[draggable="true"],
.layout-builder-data-palette button[draggable="true"] { cursor: grab; }
.layout-builder-element-palette button.is-dragging,
.layout-builder-data-palette button.is-dragging { opacity: .45; cursor: grabbing; }
.layout-builder-element-palette button > span { color: #176b87; font-size: 16px; text-align: center; }
.layout-builder-element-palette button strong { font-size: 11px; }

.layout-builder-left { border-right: 1px solid #d8e1e7; }
.layout-builder-properties { border-left: 1px solid #d8e1e7; }
.layout-builder-left h4 { margin: 0 0 9px; }
.layout-builder-left h4:not(:first-child) { margin-top: 18px; }

.layout-builder-data-palette {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.layout-builder-data-palette button {
  min-height: 34px;
  padding: 6px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #f8fafc;
  color: #243b53;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.layout-builder-tree-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  padding-left: calc(var(--tree-depth) * 12px);
  border-radius: 5px;
}
.layout-builder-tree-row.is-dragging { opacity: .42; }
.layout-builder-tree-row.is-drop-before::before,
.layout-builder-tree-row.is-drop-after::after { content: ""; position: absolute; z-index: 8; left: calc(var(--tree-depth) * 12px + 5px); right: 4px; height: 2px; border-radius: 2px; background: #e11d8a; box-shadow: 0 0 0 1px rgba(255,255,255,.85); }
.layout-builder-tree-row.is-drop-before::before { top: -1px; }
.layout-builder-tree-row.is-drop-after::after { bottom: -1px; }
.layout-builder-tree-row.is-drop-inside { outline: 2px solid #e11d8a; outline-offset: -2px; background: #fce7f3; }
.layout-builder-tree-hint { display: flex; justify-content: space-between; gap: 6px; padding: 0 5px 6px; color: #7a8993; font-size: 8px; font-weight: 700; }
.layout-builder-tree-row:hover,
.layout-builder-tree-row.is-selected { background: #e6f0f4; }
.layout-builder-tree-row.is-selected:not(.is-primary) { box-shadow: inset 3px 0 #2aa8bf; }
.layout-builder-tree-row.is-primary { box-shadow: inset 3px 0 #0f5f6d; }
.layout-builder-tree-item {
  width: 100%;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  padding: 6px 4px 6px 7px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.layout-builder-tree-row.is-selected .layout-builder-tree-item { color: #0f5f6d; }
.layout-builder-tree-item strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.layout-builder-tree-item small { color: #7a8993; font-size: 9px; }
.layout-builder-layer-actions { display: none; align-items: center; padding-right: 3px; }
.layout-builder-tree-row:hover .layout-builder-layer-actions,
.layout-builder-tree-row.is-selected .layout-builder-layer-actions { display: flex; }
.layout-builder-layer-actions button { width: 22px; height: 24px; padding: 0; border: 0; background: transparent; color: #64748b; cursor: pointer; font-size: 11px; }
.layout-builder-layer-actions button:hover { color: #176b87; }

.layout-builder-canvas-wrap {
  position: relative;
  padding: 22px;
  overflow: auto;
  background: #dce3e8;
}
.layout-builder-dialog.is-pan-ready .layout-builder-canvas-wrap,
.layout-builder-dialog.is-pan-ready .layout-builder-canvas-wrap * { cursor: grab !important; }
.layout-builder-canvas-wrap.is-panning,
.layout-builder-canvas-wrap.is-panning * { cursor: grabbing !important; user-select: none; }

.layout-builder-focusbar {
  position: sticky;
  z-index: 18;
  top: -22px;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: -22px -22px 18px;
  padding: 10px 14px;
  border-bottom: 1px solid #cbd5e1;
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(8px);
}
.layout-builder-focusbar button { border: 0; background: transparent; color: #176b87; font-weight: 900; cursor: pointer; }
.layout-builder-focusbar > div { display: grid; }
.layout-builder-focusbar small { color: #7a8993; }

.layout-builder-canvas {
  position: relative;
  width: 210mm;
  min-height: 297mm;
  margin: 0 auto;
  padding: var(--builder-page-padding);
  background-color: var(--builder-page-bg);
  box-shadow: 0 10px 30px rgba(15, 23, 42, .2);
  transform: scale(var(--builder-zoom));
  transform-origin: top center;
  margin-bottom: calc((1 - var(--builder-zoom)) * -297mm);
}

.layout-builder-canvas[data-orientation="landscape"] { width: 297mm; min-height: 210mm; margin-bottom: calc((1 - var(--builder-zoom)) * -210mm); }
.layout-builder-canvas[data-builder-focus="entry"] { width: 170mm; min-height: 100mm; margin-top: 30mm; margin-bottom: 0; }
.layout-builder-canvas[data-builder-focus="entry"] .layout-builder-node.is-root { min-height: 70mm; }
.layout-builder-canvas[data-grid="on"] {
  background-image: linear-gradient(rgba(23,107,135,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(23,107,135,.08) 1px, transparent 1px);
  background-size: var(--builder-grid-size) var(--builder-grid-size);
}
.layout-builder-canvas.is-marquee-selecting { cursor: crosshair; user-select: none; }
.layout-builder-marquee {
  position: absolute;
  z-index: 30;
  border: 1px solid #16a3c7;
  background: rgba(22, 163, 199, .12);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .7) inset;
  pointer-events: none;
}

.layout-builder-node {
  position: relative;
  min-width: 16px;
  min-height: 16px;
  outline: 1px dashed rgba(71, 85, 105, .35);
  outline-offset: -1px;
}

.layout-builder-node.is-root { min-height: calc(297mm - 2 * var(--builder-page-padding)); outline: 0; }
.layout-builder-canvas[data-orientation="landscape"] .layout-builder-node.is-root { min-height: calc(210mm - 2 * var(--builder-page-padding)); }
.layout-builder-node:hover { outline-color: #176b87; }
.layout-builder-node.is-selected { outline: 2px dashed #16a3c7; z-index: 2; }
.layout-builder-node.is-selected.is-primary { outline-style: solid; outline-color: #176b87; z-index: 3; }
.layout-builder-node.is-marquee-preview { outline: 2px dashed #16a3c7; z-index: 2; }
.layout-builder-node.is-dragging { opacity: .45; }
.layout-builder-node.is-drop-target {
  outline: 2px solid #16a3c7;
  outline-offset: -2px;
  background-color: rgba(23,107,135,.1);
}
.layout-builder-node.is-drop-target::after {
  content: "Hier ablegen";
  position: absolute;
  z-index: 12;
  inset: 4px;
  display: grid;
  place-items: center;
  border: 1px dashed #176b87;
  background: rgba(238, 247, 249, .86);
  color: #0f5f6d;
  font: 900 10px/1.2 Inter, Arial, sans-serif;
  pointer-events: none;
}

.layout-builder-node-label {
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  max-width: 100%;
  padding: 2px 5px;
  border: 0;
  background: #176b87;
  color: #fff;
  font: 700 8px/1.2 Inter, Arial, sans-serif;
  cursor: pointer;
  transform: translateY(-100%);
  opacity: 0;
}

.layout-builder-node:hover > .layout-builder-node-label,
.layout-builder-node.is-selected > .layout-builder-node-label { opacity: 1; }
.layout-builder-direct-controls { position: absolute; z-index: 14; inset: 0; pointer-events: none; }
.layout-builder-context-toolbar { position: absolute; z-index: 21; right: 0; bottom: calc(100% + 8px); min-height: 30px; display: inline-flex; align-items: center; gap: 3px; padding: 3px; border: 1px solid #b8c7d1; border-radius: 8px; background: #fff; box-shadow: 0 5px 16px rgba(15,23,42,.2); pointer-events: auto; white-space: nowrap; }
.layout-builder-context-toolbar button { min-width: 27px; height: 24px; padding: 0 6px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: #334155; cursor: pointer; font: 800 10px/1 Inter, Arial, sans-serif; }
.layout-builder-context-toolbar button:hover { border-color: #91b7c3; background: #eef7f9; color: #0f5f6d; }
.layout-builder-context-toolbar button.is-active { border-color: #176b87; background: #176b87; color: #fff; }
.layout-builder-context-color { width: 24px; height: 24px; display: block; overflow: hidden; border: 1px solid #cbd5e1; border-radius: 5px; cursor: pointer; }
.layout-builder-context-color input { width: 34px; height: 34px; margin: -5px; padding: 0; border: 0; cursor: pointer; }
.layout-builder-canvas-spacing-tools { position: absolute; z-index: 17; top: -31px; right: 17px; display: flex; gap: 4px; pointer-events: auto; }
.layout-builder-spacing-handle { min-width: 43px; height: 23px; display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 0 6px; border: 2px solid #fff; border-radius: 12px; background: #176b87; color: #fff; box-shadow: 0 0 0 1px #176b87, 0 2px 6px rgba(15,23,42,.18); cursor: ew-resize; user-select: none; font: 800 9px/1 Inter, Arial, sans-serif; }
.layout-builder-spacing-handle b { min-width: 12px; font-size: 9px; text-align: center; }
.layout-builder-spacing-handle:hover { background: #0f5f6d; }
.layout-builder-resize-handle {
  position: absolute;
  right: -5px;
  bottom: -5px;
  width: 11px;
  height: 11px;
  border: 2px solid #fff;
  border-radius: 2px;
  background: #176b87;
  box-shadow: 0 0 0 1px #176b87;
  cursor: nwse-resize;
  pointer-events: auto;
}
.layout-builder-move-handle {
  position: absolute;
  top: -12px;
  left: 50%;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #176b87;
  color: #fff;
  box-shadow: 0 0 0 1px #176b87;
  cursor: move;
  pointer-events: auto;
  transform: translate(-50%, -100%);
  font: 900 13px/1 Arial, sans-serif;
}
.layout-builder-node.is-direct-editing { outline-color: #16a3c7; user-select: none; }
.layout-builder-snap-guide {
  position: absolute;
  z-index: 30;
  display: block;
  background: #e11d8a;
  box-shadow: 0 0 0 1px rgba(255,255,255,.7);
  pointer-events: none;
}
.layout-builder-snap-guide.is-vertical { top: 0; bottom: 0; width: 1px; }
.layout-builder-snap-guide.is-horizontal { left: 0; right: 0; height: 1px; }
.layout-builder-node.is-builder-hidden { opacity: .24; background-image: repeating-linear-gradient(135deg, transparent 0 5px, rgba(100,116,139,.18) 5px 7px); }
.layout-builder-node.is-builder-locked::before { content: "▣"; position: absolute; z-index: 13; top: 3px; right: 3px; color: #475569; font: 900 10px/1 Arial, sans-serif; }
.layout-builder-placeholder { display: block; padding: 8px; color: #475569; font-size: 11px; }
.builder-sample-identity { display: grid; gap: 3px; padding: 8px; }
.builder-sample-identity strong { color: var(--accent, #176b87); font-size: 25px; line-height: 1; }
.builder-sample-identity span { color: #475569; font-size: 11px; font-weight: 800; }
.builder-sample-contact { display: grid; gap: 3px; padding: 7px; font-size: 9px; }
.builder-sample-section { display: grid; gap: 5px; padding: 8px; }
.builder-sample-section > strong,
.builder-sample-repeat-title { display: block; color: var(--accent, #176b87); font-size: 12px; text-transform: uppercase; }
.builder-sample-section p { margin: 0; font-size: 9px; line-height: 1.4; }
.builder-sample-repeat-title { grid-column: 1 / -1; padding: 6px 8px; }
.builder-sample-field { display: block; min-height: 18px; padding: 4px 6px; color: #273444; font-size: 9px; }
.builder-sample-photo { width: 28mm; height: 34mm; display: grid; place-items: center; margin: 6px; border: 1px solid #94a3b8; background: #e2e8f0; color: #64748b; font-size: 8px; }
.layout-builder-image-preview { display: block; width: 100%; height: 100%; min-height: 20mm; object-fit: cover; }
.layout-builder-node-icon > .cv-inline-icon { display: block; width: 1em; height: 1em; }
.layout-builder-text-content { display: block; min-height: 1.4em; white-space: pre-wrap; cursor: text; }
.layout-builder-node-text.is-inline-text-editing { z-index: 4; outline: 2px solid #176b87; outline-offset: 2px; }
.layout-builder-node-text.is-inline-text-editing .layout-builder-text-content { cursor: text; user-select: text; }
.layout-builder-node-image { cursor: pointer; }
.layout-builder-node-image.is-file-drop-target { outline: 3px solid #176b87; outline-offset: 3px; background: rgba(23,107,135,.1); }
.layout-builder-image-focus-handle { position: absolute; z-index: 18; width: 18px; height: 18px; border: 3px solid #fff; border-radius: 50%; background: #176b87; box-shadow: 0 0 0 1px #176b87, 0 2px 7px rgba(15,23,42,.3); transform: translate(-50%, -50%); cursor: crosshair; pointer-events: auto; touch-action: none; }
.layout-builder-image-focus-handle::before,
.layout-builder-image-focus-handle::after { content: ""; position: absolute; background: rgba(255,255,255,.9); }
.layout-builder-image-focus-handle::before { width: 8px; height: 1px; left: 2px; top: 5.5px; }
.layout-builder-image-focus-handle::after { width: 1px; height: 8px; left: 5.5px; top: 2px; }
.builder-image-pick-button { width: 100%; }
.layout-builder-image-message { min-height: 1.3em; color: #176b87; }
.layout-builder-image-message.is-error { color: #b42318; }
.builder-edit-template-button { width: 100%; }
.layout-builder-empty { display: block; min-height: 26px; padding: 7px; color: #94a3b8; font: 700 9px/1.2 Inter, Arial, sans-serif; }
.layout-builder-node-line { min-height: 1px !important; height: 1px !important; border-top: 1px solid currentColor; }
.layout-builder-node-spacer { background: repeating-linear-gradient(135deg, transparent 0 4px, rgba(23,107,135,.1) 4px 8px); }

.layout-builder-properties { display: grid; align-content: start; gap: 12px; }
.layout-builder-property-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.layout-builder-property-actions button { min-height: 32px; padding: 5px; border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; color: #475569; font-size: 10px; font-weight: 800; cursor: pointer; }
.layout-builder-property-actions button:hover { border-color: #176b87; color: #176b87; }
.layout-builder-properties .section-toolbar { margin: 0; }
.layout-builder-properties fieldset { display: grid; gap: 9px; margin: 0; padding: 10px; border: 1px solid #d8e1e7; border-radius: 8px; }
.layout-builder-properties legend { padding: 0 5px; color: #334155; font-size: 11px; font-weight: 900; }
.layout-builder-property-help { color: #64748b; font-size: 9px; line-height: 1.4; }
.layout-builder-align-tools { background: #f8fafc; }
.layout-builder-container-tools { background: linear-gradient(180deg, #f5fbfc, #f8fafc); }
.layout-builder-segmented { display: grid; gap: 4px; }
.layout-builder-segmented.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.layout-builder-segmented.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.layout-builder-segmented.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.layout-builder-segmented button { min-height: 31px; padding: 4px 3px; border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; color: #475569; font-size: 9px; font-weight: 900; cursor: pointer; }
.layout-builder-segmented button:hover { border-color: #16a3c7; color: #0f5f6d; }
.layout-builder-segmented button.is-active { border-color: #176b87; background: #176b87; color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.layout-builder-spacing-grid { display: grid; gap: 6px; }
.layout-builder-spacing-control { display: grid; grid-template-columns: minmax(54px, 1fr) 29px 54px 29px; align-items: center; gap: 4px; }
.layout-builder-spacing-control > span { color: #475569; font-size: 10px; font-weight: 800; }
.layout-builder-spacing-control button { width: 29px; height: 29px; padding: 0; border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; color: #176b87; font-size: 17px; font-weight: 900; cursor: pointer; }
.layout-builder-spacing-control button:hover { border-color: #176b87; background: #eef7f9; }
.layout-builder-spacing-control output { color: #334155; font-size: 10px; font-weight: 900; text-align: center; }
.layout-builder-multi-summary { display: grid; gap: 3px; padding: 9px 10px; border: 1px solid #b9dbe2; border-radius: 8px; background: #eef7f9; color: #334155; font-size: 11px; }
.layout-builder-multi-summary small { color: #64748b; }
.layout-builder-group-tools { background: #f8fafc; }
.layout-builder-group-tools > button { min-height: 34px; border: 1px solid #176b87; border-radius: 6px; background: #176b87; color: #fff; font-weight: 900; cursor: pointer; }
.layout-builder-group-tools small { color: #64748b; font-size: 9px; line-height: 1.35; }
.layout-builder-properties fieldset:disabled { opacity: .48; }
.layout-builder-properties button:disabled { cursor: not-allowed; opacity: .45; }
.layout-builder-tool-label { color: #7a8993; font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; }
.layout-builder-tool-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.layout-builder-tool-row.two-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.layout-builder-tool-row button { min-height: 32px; padding: 4px; border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; color: #334155; font-size: 13px; font-weight: 800; cursor: pointer; }
.layout-builder-tool-row.two-tools button { font-size: 9px; }
.layout-builder-tool-row button:hover { border-color: #176b87; color: #176b87; background: #eef7f9; }

.builder-runtime-page {
  position: relative;
  width: 210mm;
  height: 297mm;
  min-height: 297mm;
  max-height: 297mm;
  padding: var(--builder-page-padding, 16mm);
  background: var(--builder-page-bg, #fff);
  overflow: hidden;
}

.builder-runtime-page.builder-landscape { width: 297mm; height: 210mm; min-height: 210mm; max-height: 210mm; }
.builder-runtime-root { position: relative; min-height: calc(297mm - 2 * var(--builder-page-padding, 16mm)); }
.builder-landscape .builder-runtime-root { min-height: calc(210mm - 2 * var(--builder-page-padding, 16mm)); }
.builder-runtime-node { min-width: 0; }
.builder-runtime-line { min-height: 1px; height: 1px; border-top: 1px solid currentColor; }
.builder-runtime-spacer { min-height: 4mm; }
.builder-runtime-entry { break-inside: avoid; page-break-inside: avoid; margin-bottom: 4mm; }
.builder-runtime-entry:last-child { margin-bottom: 0; }
.builder-runtime-list-section .builder-runtime-entry { margin-bottom: 1.5mm; }
.builder-runtime-field { min-width: 0; }
.builder-runtime-image { overflow: hidden; }
.builder-runtime-image-content { display: block; width: 100%; height: 100%; object-fit: cover; }
.cv-preview .builder-runtime-icon > .cv-inline-icon { display: inline-block; width: 1em; height: 1em; vertical-align: -.12em; color: inherit; }
.builder-runtime-bullets { grid-column: 1 / -1; margin: 1mm 0 0; padding-left: 5mm; }
.builder-keep-together,
.builder-no-break { break-inside: avoid; page-break-inside: avoid; }
.builder-keep-with-next { break-after: avoid; page-break-after: avoid; }

@media (max-width: 1500px) {
  .layout-builder-workspace { grid-template-columns: 205px minmax(440px, 1fr) 260px; }
}

@media (max-width: 1050px) {
  .layout-builder-dialog[open] { grid-template-rows: auto minmax(0, 1fr); }
  .layout-builder-appbar { grid-template-columns: minmax(140px, 1fr) 40px; }
  .layout-builder-toolbar { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
  .layout-builder-close { grid-column: 2; grid-row: 1; }
  .layout-builder-workspace { grid-template-columns: 1fr; }
  .layout-builder-left, .layout-builder-properties { border: 0; border-bottom: 1px solid #d8e1e7; }
  .layout-builder-canvas-wrap { min-height: 760px; }
}

.compact-help-card {
  align-content: start;
}

.compact-help-card p {
  margin: 0;
  line-height: 1.45;
}

.admin-field-help {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.product-order-cell,
.product-order-buttons {
  display: grid;
  gap: 6px;
}

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

.product-order-buttons .small-button {
  min-height: 30px;
  padding: 0 8px;
  font-size: 11px;
}

.b2b-table > div {
  display: grid;
  gap: 4px;
  align-content: start;
  min-width: 0;
  padding: 10px;
  border-bottom: 1px solid var(--line);
  background: #ffffff;
}

.b2b-table-head {
  background: #eef7f5 !important;
  color: var(--brand-dark);
  font-weight: 900;
}

.admin-account-table select,
.admin-account-table input,
.admin-account-table textarea,
.admin-products-table select,
.admin-products-table input {
  width: 100%;
  min-width: 0;
}

.admin-account-table textarea {
  min-height: 56px;
  resize: vertical;
}

.admin-status-ok {
  background: #e8f7ee;
  color: #126133;
}

.admin-status-warning {
  background: #fff6da;
  color: #76500a;
}

.admin-status-danger {
  background: #ffe5e5;
  color: #9f1d1d;
}

.ad-direct-creatives {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.ad-admin-card {
  align-content: start;
}

.ad-slot-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  list-style: none;
}

.ad-slot-summary::-webkit-details-marker {
  display: none;
}

.ad-slot-summary::after {
  content: "+";
  color: var(--accent);
  font-size: 1.35rem;
  font-weight: 700;
}

.ad-admin-card[open] .ad-slot-summary::after {
  content: "−";
}

.ad-slot-summary h4,
.ad-slot-summary small {
  margin: 0;
}

.ad-slot-summary > div {
  display: grid;
  gap: 3px;
}

.ad-slot-status {
  margin-left: auto !important;
  color: var(--muted);
  text-align: right;
}

.ad-slot-body {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.ad-slot-admin-grid {
  grid-template-columns: minmax(0, 1fr);
}

.email-failure-list {
  display: grid;
  gap: 8px;
}

.email-failure-item {
  border: 1px solid #efb2b2;
  border-radius: 7px;
  padding: 10px 12px;
  background: #fff8f8;
}

.email-failure-item summary {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
}

.email-failure-item summary span {
  color: var(--muted);
  font-size: .85rem;
}

.email-failure-item p { margin: 12px 0 6px; }
.email-failure-item pre { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: .83rem/1.4 ui-monospace, SFMono-Regular, Consolas, monospace; }
.operations-metrics { margin: 14px 0 0; }
.operations-list { margin: 10px 0; padding-left: 20px; }
.operations-list li { margin: 6px 0; }

.birth-date-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 125px;
  gap: 8px;
}

.ad-direct-creatives > .section-toolbar > div {
  display: grid;
  gap: 3px;
}

.ad-creative-workspace {
  display: grid;
  grid-template-columns: minmax(260px, 0.75fr) minmax(360px, 1.25fr);
  gap: 16px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.ad-creative-editor,
.ad-creative-format-panel,
.ad-creative-live-preview,
.ad-creative-preview-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.ad-creative-format-panel[hidden],
.ad-creative-preview-panel[hidden] {
  display: none;
}

.ad-creative-format-panel {
  align-content: start;
  padding: 12px;
  border-radius: 8px;
  background: var(--surface-soft);
}

.ad-creative-format-panel label {
  display: grid;
  gap: 4px;
}

.ad-creative-format-panel input,
.ad-creative-editor select {
  width: 100%;
  min-width: 0;
}

.ad-creative-format-panel .inline-check {
  display: flex;
}

.ad-creative-live-preview {
  align-content: start;
  padding: 14px;
  border-radius: 8px;
  background: #e7edf1;
}

.ad-preview-context,
.ad-preview-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ad-preview-context {
  color: var(--brand-dark);
  font-weight: 900;
}

.ad-preview-context small,
.ad-preview-meta {
  color: var(--muted);
  font-size: 12px;
}

.ad-creative-preview-large {
  display: grid;
  place-items: center;
  width: 100%;
  max-height: 430px;
  aspect-ratio: var(--creative-ratio);
  overflow: hidden;
  border: 1px dashed #9aabb7;
  border-radius: 6px;
  background: #fff;
  color: var(--muted);
  font-size: 14px;
  font-weight: 900;
}

.ad-creative-preview-large img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ad-preview-meta a {
  color: var(--brand-red);
  font-weight: 850;
  text-decoration: none;
}

.ad-report-card {
  margin-top: 14px;
}

.ad-report-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
}

.ad-report-filter label {
  display: grid;
  gap: 4px;
  min-width: 150px;
}

.site-analytics-period-filter {
  display: grid;
  gap: 14px;
}

.site-analytics-period-filter .section-toolbar {
  margin: 0;
}

.site-analytics-period-filter .section-toolbar p {
  margin: 4px 0 0;
  color: var(--muted);
}

.ad-report-metrics {
  margin-top: 4px;
}

.ad-report-table {
  grid-template-columns: minmax(220px, 1.3fr) minmax(100px, 0.55fr) minmax(120px, 0.65fr) minmax(90px, 0.5fr) minmax(90px, 0.5fr);
}

.ad-report-empty {
  grid-column: 1 / -1;
  color: var(--muted);
}

.export-card,
.email-template-card {
  align-content: start;
}

.email-template-card textarea,
.admin-banner-form textarea {
  min-height: 120px;
  resize: vertical;
}

.site-banner-preview {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 7px;
  border: 1px solid var(--line);
  background: #f6f8fb;
}

.site-banner-preview a {
  margin-left: auto;
  color: var(--brand-red);
  font-weight: 850;
  text-decoration: none;
}

.site-banner-preview-success {
  background: #ecf8f0;
}

.site-banner-preview-warning {
  background: #fff6dc;
}

.site-banner-preview-danger {
  background: #ffe8e8;
}

.inline-check {
  display: inline-flex;
  grid-template-columns: none;
  align-items: center;
  gap: 6px;
}

.inline-check input {
  width: auto;
}

.comment-composer {
  display: grid;
  grid-template-columns: 180px 1fr auto;
  gap: 10px;
  align-items: start;
}

.academy-form,
.coach-form,
.invite-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: 10px;
  align-items: start;
}

.invite-form textarea {
  grid-column: 1 / -2;
}

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

.site-content-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.site-content-form label:nth-child(2),
.site-content-form label:nth-child(5),
.site-content-form label:last-child {
  grid-column: 1 / -1;
}

.site-content-form input,
.site-content-form textarea {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px 12px;
  color: var(--ink);
  font: inherit;
}

.site-content-form textarea {
  resize: vertical;
}

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

.admin-log-table {
  grid-template-columns: 1fr 1fr 1fr 1.2fr;
}

.comment-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  padding: 12px;
}

.comment-row.is-done {
  opacity: 0.64;
}

.b2b-facts {
  display: grid;
  gap: 8px;
  margin: 0;
}

.b2b-facts div {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 10px;
}

.b2b-facts dt {
  color: var(--muted);
  font-weight: 800;
}

.b2b-facts dd {
  margin: 0;
}

.icon-close {
  position: absolute;
  top: 0;
  right: 0;
  min-height: 32px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
}

@media (max-width: 1180px) {
  .layout-designer-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .designer-zone-grid {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }

  .app-shell {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
  }

  .sidebar,
  .editor,
  .preview-wrap {
    grid-column: 1 / -1;
    grid-row: auto;
    position: static;
  }

  .b2b-layout {
    grid-template-columns: 156px minmax(0, 1fr);
    min-height: 0;
  }
}

@media (max-width: 780px) {
  .layout-status-card {
    grid-template-columns: 46px minmax(0, 1fr) auto;
  }

  .layout-status-actions {
    grid-column: 1 / -1;
  }

  .layout-designer-meta,
  .designer-zone-grid,
  .designer-width-controls {
    grid-template-columns: minmax(0, 1fr);
  }

  .layout-designer-preview-wrap {
    height: 520px;
  }

  .layout-designer-preview {
    min-width: 620px;
  }

  .designer-section-item {
    grid-template-columns: auto minmax(90px, 1fr);
  }

  .designer-section-item select {
    grid-column: 1 / -1;
  }

  .topbar,
  .top-actions,
  .section-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .topbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    gap: 10px 12px;
    padding: 12px;
  }

  .topbar-title {
    min-width: 0;
  }

  .app-header-logo {
    width: min(231px, calc(100vw - 76px));
    max-height: 39px;
  }

  .topbar h1 {
    font-size: 18px;
  }

  .header-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
    width: 38px;
    min-width: 38px;
    height: 38px;
  }

  .top-actions {
    grid-column: 1 / -1;
    display: grid;
    gap: 8px;
  }

  .topbar.is-header-collapsed .top-actions {
    display: none;
  }

  .header-account {
    min-width: 0;
    max-width: none;
  }

  .app-shell {
    grid-template-columns: 1fr;
    padding: 12px;
  }

  .b2b-layout {
    grid-template-columns: 128px minmax(0, 1fr);
  }

  .b2b-tabs {
    padding: 10px 8px;
  }

  .b2b-tabs .category-tab {
    min-height: 36px;
    padding: 0 8px;
    font-size: 12px;
  }

  .b2b-panel {
    padding: 12px;
  }

  .two-col,
  .three-col,
  .b2b-head,
  .b2b-grid,
  .metrics-grid,
  .comment-composer,
  .academy-form,
  .coach-form,
  .invite-form,
  .invite-form textarea,
  .comment-row,
  .entry-grid,
  .startup-choice,
  .layout-gallery-grid,
  .layout-card,
  .admin-layout-card,
  .admin-layout-create,
  .admin-layout-edit-grid,
  .ad-creative-workspace,
  .b2b-table,
  .sidebar {
    grid-template-columns: 1fr;
  }

  .b2b-filterbar input,
  .b2b-filterbar select {
    width: 100%;
  }

  .editor-stepper {
    flex-direction: column-reverse;
  }

  .cv-preview {
    min-height: 1123px;
    padding: 56px;
  }

  .startup-content {
    padding: 18px;
  }

  .cv-preview[data-layout="modern_sidebar"] .cv-head {
    margin: -56px -56px 0;
    padding: 46px 56px 30px;
  }

  .cv-head h2 {
    font-size: 30px;
  }
}


/* Editor layout: left section list, bottom import review, independent preview scrolling */
body[data-mode="edit"] .app-shell {
  height: calc(100vh - 82px);
  position: relative;
  grid-template-rows: minmax(0, 1fr);
  align-items: stretch;
  overflow: hidden;
  padding-top: 0;
}

body[data-mode="edit"] .sidebar {
  position: relative;
  z-index: 2;
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  margin: 12px 12px 0 190px;
}

.editor {
  min-height: 0;
  align-self: stretch;
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 0;
  overflow: hidden;
  padding: 0;
}

body[data-mode="edit"] .editor {
  grid-column: 1;
  grid-row: 1;
}

body[data-mode="edit"] .preview-wrap {
  grid-column: 2;
  grid-row: 1;
}

body[data-mode="edit"] .account-sidebar-panel {
  padding: 8px 10px;
  border-left: 0;
  box-shadow: 0 8px 20px rgba(23, 33, 38, 0.08);
}

body[data-mode="edit"] .editor-main {
  padding-top: 16px;
}

body[data-mode="edit"][data-account="guest"] .editor-main {
  padding-top: 16px;
}

.editor.is-nav-collapsed {
  grid-template-columns: 42px minmax(0, 1fr);
}

.editor-tabs {
  zoom: 0.9;
  display: grid;
  align-content: start;
  gap: 6px;
  overflow: auto;
  padding: 12px;
  border-right: 1px solid var(--pilot-red-dark);
  border-bottom: 0;
  background: var(--pilot-red);
  color: #ffffff;
  scrollbar-width: thin;
}

.editor-nav-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 34px;
  margin-bottom: 2px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.editor-nav-toggle-row {
  justify-content: flex-end;
  min-height: 34px;
  margin-bottom: 4px;
}

.editor-nav-group-label {
  margin: 8px 4px 0;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.32);
  color: rgba(255, 255, 255, 0.82);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.editor-nav-toggle {
  border-color: rgba(255, 255, 255, 0.64);
  background: transparent;
  color: #ffffff;
}

.editor-tabs .tab {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 0 11px;
  background: transparent;
  color: #ffffff;
  text-align: left;
  white-space: normal;
}

.editor-tabs .tab:hover {
  border-color: rgba(255, 255, 255, 0.46);
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
}

.editor-tabs .tab.active {
  border-color: rgba(255, 255, 255, 0.68);
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.editor-tabs .tab.active::after {
  top: 8px;
  right: auto;
  bottom: 8px;
  left: 0;
  width: 3px;
  height: auto;
  border-radius: 0 999px 999px 0;
  background: #ffffff;
}

.editor.is-nav-collapsed .editor-tabs {
  padding: 10px 6px;
}

.editor.is-nav-collapsed .editor-nav-title,
.editor.is-nav-collapsed .editor-nav-group-label,
.editor.is-nav-collapsed .editor-tabs .tab span {
  display: none;
}

.editor.is-nav-collapsed .editor-tabs > :not(.editor-nav-toggle-row) {
  display: none;
}

.editor.is-nav-collapsed .editor-nav-toggle-row {
  display: flex;
  justify-content: center;
  width: 100%;
}

.editor.is-nav-collapsed .editor-nav-toggle {
  margin: 0 auto;
}

.editor-main {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
  padding: 16px;
  overflow: hidden;
}

.form-stack {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 6px;
  scrollbar-width: thin;
}

.editor-import-review {
  max-height: 220px;
  overflow: auto;
}

.photo-actions {
  align-content: start;
}

.photo-settings {
  gap: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.photo-settings .check-option {
  grid-column: 1 / -1;
}

.collapsible-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
  overflow: hidden;
}

.form-subsection-title {
  margin: 8px 0 -2px;
  color: var(--brand-dark);
  font-size: 15px;
  line-height: 1.25;
}

.document-title-box {
  padding: 14px;
  border: 1px solid #c8d9e7;
  border-radius: 10px;
  background: #f4f9fd;
}

.document-title-box label { margin: 0; }

.collapsible-panel > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 0 12px;
  cursor: pointer;
  color: var(--brand-dark);
  font-weight: 900;
  list-style: none;
}

.collapsible-panel > summary::-webkit-details-marker {
  display: none;
}

.collapsible-panel > summary::after {
  content: "+";
  color: var(--muted);
  font-size: 18px;
  line-height: 1;
}

.collapsible-panel[open] > summary::after {
  content: "-";
}

.design-settings-grid {
  padding: 12px;
}

.preview-wrap {
  align-self: stretch;
  height: calc(100vh - 122px);
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  justify-items: stretch;
}

.preview-scroll {
  min-height: 0;
  width: 100%;
  overflow: auto;
  display: block;
  padding: 4px 8px 24px;
  scrollbar-width: thin;
}

.preview-scroll .cv-preview {
  margin: 0 auto;
  height: auto;
  overflow: visible;
  zoom: var(--preview-scale, 1);
}

@media screen and (min-width: 1181px) {
  body[data-mode="edit"] .app-shell {
    height: calc(133.3333vh - 82px);
  }

  .preview-wrap {
    height: calc(133.3333vh - 122px);
  }
}

@media (max-width: 1180px) {
  body[data-mode="edit"] .app-shell {
    height: auto;
    overflow: visible;
  }

  body[data-mode="edit"] .editor,
  body[data-mode="edit"] .preview-wrap {
    grid-column: 1 / -1;
    grid-row: auto;
    min-width: 0;
  }

  body[data-mode="edit"] .sidebar {
    grid-row: auto;
    margin: 0;
  }

  body[data-mode="edit"] .editor-main,
  body[data-mode="edit"][data-account="guest"] .editor-main {
    padding-top: 16px;
  }

  .editor {
    grid-template-columns: 140px minmax(0, 1fr);
    overflow: visible;
  }

  .editor.is-nav-collapsed {
    grid-template-columns: 47px minmax(0, 1fr);
  }

  .editor-tabs {
    border-right: 1px solid var(--pilot-red-dark);
    border-bottom: 0;
  }

  .editor-main,
  .form-stack {
    overflow: visible;
  }

  .preview-wrap {
    height: 76vh;
  }
}

@media screen and (min-width: 781px) and (max-width: 1180px) {
  .preview-wrap {
    height: 101.3333vh;
  }
}

@media (max-width: 780px) {
  .editor {
    grid-template-columns: 128px minmax(0, 1fr);
  }

  .editor.is-nav-collapsed {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .editor-tabs {
    padding: 10px 8px;
  }

  .editor-tabs .tab {
    min-height: 36px;
    padding: 0 8px;
    font-size: 13px;
  }

  .editor-main {
    padding: 12px;
  }

  .photo-control,
  .photo-settings.two-col {
    grid-template-columns: 1fr;
  }

  .photo-preview {
    width: 96px;
    height: 120px;
  }
}
@media print {
  .preview-scroll .cv-preview {
    zoom: 1 !important;
  }

  @page {
    size: A4;
    margin: 0;
  }

  body {
    background: #ffffff;
  }

  body > :not(.app-shell),
  .sidebar,
  .editor,
  .preview-toolbar {
    display: none !important;
  }

  .app-shell,
  .preview-wrap {
    display: block;
    padding: 0;
    margin: 0;
    border: 0;
    box-shadow: none;
  }

  .cv-preview {
    width: 210mm;
    border: 0;
    box-shadow: none;
    background-image: none;
    gap: 0;
  }

  .cv-document {
    gap: 0;
  }

  .cv-page {
    box-sizing: border-box;
    width: 210mm;
    height: 297mm;
    min-height: 297mm;
    max-height: 297mm;
    border: 0;
    box-shadow: none;
    overflow: hidden;
    break-after: page;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
  }

  .cv-page:last-child {
    break-after: auto;
  }

  .cv-break-target,
  .cv-page-break {
    display: none !important;
    break-before: auto !important;
    page-break-before: auto !important;
  }
}

.import-review-section .editor-import-review {
  max-height: none;
}

.import-review-section .editor-import-review-body .import-review {
  max-height: none;
}

.account-menu {
  position: relative;
  min-width: 150px;
}

.account-menu summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--ink);
  font-weight: 800;
  list-style: none;
  cursor: pointer;
}

.account-menu summary::-webkit-details-marker {
  display: none;
}

.account-menu summary::after {
  content: "v";
  margin-left: 8px;
  color: var(--muted);
  font-size: 11px;
}

.account-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 30;
  display: grid;
  gap: 4px;
  width: min(320px, calc(100vw - 24px));
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.account-dropdown button {
  min-height: 36px;
  padding: 0 10px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  text-align: left;
  color: var(--ink);
  font-weight: 750;
}

.account-dropdown button:hover {
  background: var(--surface-soft);
  color: var(--brand-dark);
}

.account-menu-user {
  display: grid;
  gap: 2px;
  padding: 6px 8px 10px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
}

.account-menu-user strong {
  color: var(--ink);
  font-size: 13px;
}

.account-billing-info,
.account-billing-actions {
  display: grid;
  gap: 7px;
  margin: 6px 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  font-size: 12px;
}

.account-billing-info span,
.account-billing-info a {
  color: var(--muted);
}

.account-voucher-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
}

.account-voucher-row input {
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
}

.signed-in-panel,
.guest-notice {
  display: grid;
  gap: 10px;
}

.panel-title.compact {
  align-items: start;
}

.panel-title.compact > div {
  display: grid;
  gap: 3px;
}

.document-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 12px;
}

.document-list-head > div {
  display: grid;
  gap: 1px;
}

.document-list-head strong {
  color: var(--ink);
  font-size: 14px;
}

.account-documents {
  display: grid;
  gap: 8px;
}

.academy-edit-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.academy-edit-form label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.academy-edit-form input,
.academy-edit-form select {
  width: 100%;
}

.academy-card-actions {
  justify-content: flex-start;
}

.danger-button {
  border-color: rgba(229, 57, 53, 0.35);
  color: #b4232a;
}

.danger-button:hover {
  border-color: #b4232a;
  color: #8f151b;
}

body[data-account="signed-in"] .login-panel,
body[data-account="signed-in"] .account-dialog .privacy-copy {
  display: none;
}

@media (max-width: 780px) {
  .account-menu {
    width: 100%;
  }

  .account-dropdown {
    left: 0;
    right: auto;
    width: 100%;
  }

  .academy-edit-form {
    grid-template-columns: 1fr;
  }
}
body[data-mode="organization"] [data-action="show-entry"],
body[data-mode="organization"] [data-action="choose-import"] {
  display: none;
}

.editor-documents-panel {
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  padding: 10px;
  box-shadow: 0 8px 18px rgba(23, 33, 38, 0.06);
}

.document-list-body {
  display: grid;
  gap: 8px;
}

.document-list-footer {
  display: flex;
  justify-content: flex-start;
  padding-top: 2px;
}

.document-add-button {
  width: 36px;
  height: 32px;
  border: 1px solid var(--pilot-red);
  border-radius: 6px;
  background: var(--pilot-red);
  color: #ffffff;
  font-size: 20px;
  font-weight: 900;
  line-height: 1;
}

.document-add-button:hover {
  background: var(--pilot-red-dark);
  border-color: var(--pilot-red-dark);
}
/* Bewerbungsdokumente */
.document-type-switcher {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line, #d8e1e8);
  background: #f7fafc;
}

.editor-tabs .tab span {
  min-width: 0;
  overflow-wrap: normal;
  hyphens: auto;
}

.document-type-button {
  border: 1px solid #b7c7d4;
  border-radius: 999px;
  background: #fff;
  color: #17364d;
  padding: 8px 14px;
  cursor: pointer;
}

.document-type-button.active {
  border-color: #176b87;
  background: #176b87;
  color: #fff;
}

.supplement-editor {
  padding: 16px;
  overflow: auto;
}

.supplement-form fieldset {
  margin: 0;
  border: 1px solid #d8e1e8;
  border-radius: 12px;
  padding: 14px;
}

.visibility-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

#cvProfileVisibility {
  display: block;
  width: auto;
  margin-right: 12px;
  margin-left: 12px;
}

#cvProfileVisibility > .visibility-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
}

#cvProfileVisibility .visibility-option strong {
  white-space: nowrap;
}

.personal-details-panel {
  margin-top: 16px;
}

.personal-details-panel > .two-col {
  margin-top: 12px;
}

.personal-details-panel > :not(summary) {
  margin-left: 12px;
  margin-right: 12px;
}

.personal-details-panel > .visibility-grid {
  margin-bottom: 12px;
}

.cv-display-settings {
  display: grid;
  gap: 12px;
  margin: 18px 12px 12px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.cv-display-settings > h3 {
  margin: 0;
  color: var(--brand-dark);
  font-size: 18px;
}

.cv-display-settings-group {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.58);
}

.cv-display-settings-group h4,
.cv-display-visibility-group h5 {
  margin: 0 0 10px;
  color: var(--brand-dark);
  font-size: 14px;
  font-weight: 850;
}

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

.cv-display-visibility-group {
  min-width: 0;
}

.cv-display-settings #cvProfileVisibility,
.cv-display-settings #cvPersonalDetailsVisibility {
  display: block;
  width: auto;
  margin: 0;
}

.cv-display-settings #cvProfileVisibility > .visibility-grid,
.cv-display-settings #cvPersonalDetailsVisibility > .visibility-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  margin-top: 0;
}

.cv-display-settings #cvPersonalDetailsVisibility > .visibility-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cv-display-settings .visibility-option {
  position: relative;
  min-height: 58px;
  padding: 10px 12px;
  border-color: #cfdae1;
  border-radius: 10px;
  background: #fff;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.cv-display-settings .visibility-option:hover { border-color: #76a9bc; }
.cv-display-settings .visibility-option:has(input:checked) { border-color: #176b87; background: #edf7fa; box-shadow: inset 0 0 0 1px rgba(23, 107, 135, .1); }
.cv-display-settings .visibility-option input { position: absolute; opacity: 0; pointer-events: none; }
.cv-display-settings .visibility-option > span {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}
.cv-display-settings .visibility-option > span::before {
  content: "";
  flex: 0 0 17px;
  width: 17px;
  height: 17px;
  border: 2px solid #87959e;
  border-radius: 4px;
  box-sizing: border-box;
  background: #fff;
}
.cv-display-settings .visibility-option input:checked + span::before {
  content: "✓";
  display: grid;
  place-items: center;
  border-color: #176b87;
  background: #176b87;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}
.cv-display-settings #cvProfileVisibility .visibility-option strong,
.cv-display-settings #cvPersonalDetailsVisibility .visibility-option strong {
  display: block;
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
  line-height: 1.22;
  font-size: 14px;
}
.cv-display-settings .visibility-option:has(input:disabled) { opacity: .55; background: #f4f6f7; }

.cv-display-settings .personal-details-help,
.cv-display-settings .muted-note {
  margin: 10px 0 0;
}

@media (max-width: 900px) {
  .cv-display-visibility-groups { grid-template-columns: 1fr; }
  .cv-display-settings #cvProfileVisibility > .visibility-grid,
  .cv-display-settings #cvPersonalDetailsVisibility > .visibility-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

#cvPersonalDetailsVisibility {
  display: block;
  width: auto;
}

#cvPersonalDetailsVisibility > .visibility-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: 100%;
}

.personal-details-help {
  margin: 10px 0 0;
}

.personal-details-placement select {
  border-color: #e5aeb8;
  background: #fff;
  font-weight: 700;
}

.personal-details-head-text {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 0;
  margin-top: 9px;
  color: #4e5a61;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
}

.personal-details-head-text span + span::before {
  content: "·";
  margin: 0 7px;
  color: var(--accent);
}

.personal-details-head-badges {
  margin-top: 10px;
  gap: 5px;
  font-size: 11px;
}

.personal-details-head-badges span {
  padding: 3px 7px;
}

.designer-header-band .personal-details-head-text,
.designer-header-band .personal-details-head-text span + span::before {
  color: inherit;
}

.designer-header-band .personal-details-head-badges span {
  border-color: rgba(255, 255, 255, 0.48);
  background: rgba(255, 255, 255, 0.15);
}

.field-help {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
}

.pdf-progress-dialog {
  width: min(calc(100vw - 32px), 470px);
  padding: 0;
  border: 0;
  border-radius: 18px;
  background: #ffffff;
  color: var(--ink);
  box-shadow: 0 24px 70px rgba(18, 29, 34, 0.28);
}

.pdf-progress-dialog::backdrop {
  background: rgba(18, 29, 34, 0.5);
  backdrop-filter: blur(4px);
}

.pdf-progress-content {
  display: grid;
  justify-items: center;
  gap: 13px;
  padding: 30px 32px 28px;
  text-align: center;
}

.pdf-progress-content h2,
.pdf-progress-content p {
  margin: 0;
}

.pdf-progress-content p {
  max-width: 380px;
  color: var(--muted);
  line-height: 1.5;
}

.pdf-progress-visual {
  position: relative;
  width: 132px;
  height: 104px;
}

.pdf-progress-document {
  position: absolute;
  top: 2px;
  left: 43px;
  display: grid;
  place-items: center;
  width: 48px;
  height: 60px;
  border: 3px solid var(--accent);
  border-radius: 7px;
  background: #ffffff;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.04em;
  box-shadow: 0 8px 20px rgba(23, 107, 135, 0.16);
  animation: pdf-document-float 1.25s ease-in-out infinite;
}

.pdf-progress-document::after {
  content: "";
  position: absolute;
  right: -3px;
  top: -3px;
  width: 14px;
  height: 14px;
  border-bottom: 3px solid var(--accent);
  border-left: 3px solid var(--accent);
  border-radius: 0 4px 0 3px;
  background: color-mix(in srgb, var(--accent), #ffffff 88%);
}

.pdf-progress-arrow {
  position: absolute;
  top: 62px;
  left: 63px;
  width: 5px;
  height: 22px;
  border-radius: 99px;
  background: var(--accent);
  animation: pdf-arrow-pulse 1.25s ease-in-out infinite;
}

.pdf-progress-arrow::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: -5px;
  width: 11px;
  height: 11px;
  border-right: 5px solid var(--accent);
  border-bottom: 5px solid var(--accent);
  transform: rotate(45deg);
}

.pdf-progress-tray {
  position: absolute;
  bottom: 2px;
  left: 35px;
  width: 62px;
  height: 15px;
  border: 4px solid #17364d;
  border-top: 0;
  border-radius: 0 0 9px 9px;
}

.pdf-progress-result {
  position: absolute;
  inset: 14px 26px;
  display: none;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  font-size: 40px;
  font-weight: 900;
  transform: scale(0.75);
  animation: pdf-result-pop 0.35s ease-out forwards;
}

.pdf-progress-success {
  background: var(--green);
}

.pdf-progress-error {
  background: #b4232c;
}

.pdf-progress-track {
  position: relative;
  width: min(100%, 320px);
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #e7edf0;
}

.pdf-progress-track span {
  position: absolute;
  inset: 0 auto 0 -42%;
  width: 42%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), #3cb4d3);
  animation: pdf-progress-slide 1.15s ease-in-out infinite;
}

.pdf-progress-content[data-state="success"] .pdf-progress-document,
.pdf-progress-content[data-state="success"] .pdf-progress-arrow,
.pdf-progress-content[data-state="success"] .pdf-progress-tray,
.pdf-progress-content[data-state="error"] .pdf-progress-document,
.pdf-progress-content[data-state="error"] .pdf-progress-arrow,
.pdf-progress-content[data-state="error"] .pdf-progress-tray,
.pdf-progress-content[data-state="success"] .pdf-progress-track,
.pdf-progress-content[data-state="error"] .pdf-progress-track {
  display: none;
}

.pdf-progress-content[data-state="success"] .pdf-progress-success,
.pdf-progress-content[data-state="error"] .pdf-progress-error {
  display: grid;
}

.pdf-progress-actions {
  justify-content: center;
  margin-top: 3px;
}

@keyframes pdf-document-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(7px); }
}

@keyframes pdf-arrow-pulse {
  0%, 100% { opacity: 0.35; transform: translateY(-3px); }
  50% { opacity: 1; transform: translateY(3px); }
}

@keyframes pdf-progress-slide {
  from { left: -42%; }
  to { left: 100%; }
}

@keyframes pdf-result-pop {
  to { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .pdf-progress-document,
  .pdf-progress-arrow,
  .pdf-progress-track span,
  .pdf-progress-result {
    animation-duration: 0.01ms;
    animation-iteration-count: 1;
  }
}

.visibility-option {
  align-items: center;
  justify-content: flex-start;
  min-height: 46px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.visibility-option > span {
  display: grid;
  gap: 2px;
}

.visibility-option input:disabled + span {
  opacity: 0.75;
}

.rich-toolbar {
  display: flex;
  gap: 6px;
  padding: 7px;
  border: 1px solid #c9d5de;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: #f4f7f9;
}

.rich-toolbar button {
  border: 1px solid #bdcad4;
  border-radius: 6px;
  background: #fff;
  padding: 5px 9px;
}

.rich-editor {
  min-height: 220px;
  padding: 12px;
  border: 1px solid #c9d5de;
  border-radius: 0 0 8px 8px;
  background: #fff;
  line-height: 1.55;
}

.signature-control {
  display: grid;
  gap: 10px;
}

.signature-control img {
  width: auto;
  max-width: 220px;
  max-height: 90px;
  object-fit: contain;
}

.supplement-page {
  box-sizing: border-box;
  height: 297mm;
  min-height: 297mm;
  padding: 20mm 18mm;
  overflow: hidden;
  background: #fff;
  color: #172431;
  font-family: var(--cv-font, Arial, sans-serif);
}

.cv-preview[data-layout="designer"] .supplement-page {
  width: 794px;
  min-height: 1123px;
  padding: var(--designer-page-margin, 16mm);
  background: var(--designer-page-bg, #fff);
}

.cv-preview[data-layout="designer"][data-orientation="landscape"] .supplement-page {
  width: 1123px;
  min-height: 794px;
}

.supplement-page-layout {
  min-height: 100%;
}

.letter-content,
.reference-content {
  min-width: 0;
}

.supplement-layout-select select:disabled {
  cursor: not-allowed;
  opacity: 0.58;
  background: #eef2f5;
}

.supplement-accent-input input:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}
.letter-sender {
  display: grid;
  gap: 2px;
  padding-bottom: 10mm;
  border-bottom: 2px solid var(--accent, #176b87);
}

.letter-recipient {
  margin-top: 16mm;
  min-height: 30mm;
  line-height: 1.45;
}

.letter-date {
  margin: 8mm 0 10mm;
  text-align: right;
}

.letter-subject {
  margin: 0 0 9mm;
  color: var(--accent, #176b87);
  font-size: 1.15rem;
}

.letter-body {
  line-height: 1.58;
}

.letter-body.is-justified {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

.letter-body p {
  margin: 0 0 1em;
}

.letter-closing {
  margin-top: 12mm;
}

.letter-signature {
  display: block;
  width: calc(150px * var(--signature-scale, 1));
  max-width: 240px;
  height: 54px;
  margin: 5mm 0 2mm;
  object-fit: contain;
  object-position: left center;
}

.document-contact-list,
.reference-card ul {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 14px;
  margin: 5px 0 0;
  padding: 0;
  list-style: none;
}

.reference-header {
  margin-bottom: 12mm;
  padding-bottom: 8mm;
  border-bottom: 2px solid var(--accent, #176b87);
}

.reference-header h2 {
  margin: 0 0 4mm;
  color: var(--accent, #176b87);
}

.reference-list {
  display: grid;
  gap: 8mm;
}

/* Existing CV sidebar layouts applied structurally to supplementary documents. */
.cv-preview:is(
  [data-layout="left_sidebar"],
  [data-layout="left_full_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"]
) .supplement-page,
.cv-preview[data-layout="right_narrow_sidebar"] .supplement-page,
.cv-preview[data-layout="top_sidebar"] .supplement-page {
  padding: 0;
}

.cv-preview:is(
  [data-layout="left_sidebar"],
  [data-layout="left_full_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"]
) .supplement-page-layout {
  display: grid;
  grid-template-columns: minmax(52mm, 31%) minmax(0, 1fr);
  grid-template-areas: "sidebar main";
}

.cv-preview[data-layout="right_narrow_sidebar"] .supplement-page-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(48mm, 28%);
  grid-template-areas: "main sidebar";
}

.cv-preview:is(
  [data-layout="left_sidebar"],
  [data-layout="left_full_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="right_narrow_sidebar"]
) .supplement-page-layout::before {
  content: "";
  grid-area: sidebar;
  min-height: 297mm;
  background: color-mix(in srgb, var(--accent, #176b87) 76%, #102332);
}

.cv-preview:is(
  [data-layout="left_sidebar"],
  [data-layout="left_full_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="right_narrow_sidebar"]
) :is(.letter-sender, .reference-header) {
  z-index: 1;
  grid-area: sidebar;
  align-self: start;
  margin: 0;
  padding: 20mm 10mm;
  border: 0;
  color: #fff;
}

.cv-preview:is(
  [data-layout="left_sidebar"],
  [data-layout="left_full_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="right_narrow_sidebar"]
) .reference-header h2 {
  color: #fff;
}

.cv-preview:is(
  [data-layout="left_sidebar"],
  [data-layout="left_full_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="right_narrow_sidebar"]
) :is(.letter-content, .reference-content) {
  grid-area: main;
  padding: 20mm 16mm;
}

.cv-preview:is(
  [data-layout="left_sidebar"],
  [data-layout="left_full_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="right_narrow_sidebar"]
) .letter-recipient {
  margin-top: 0;
}

.cv-preview[data-layout="top_sidebar"] .supplement-page-layout {
  display: grid;
  grid-template-rows: auto 1fr;
}

.cv-preview[data-layout="top_sidebar"] :is(.letter-sender, .reference-header) {
  margin: 0;
  padding: 12mm 18mm;
  border: 0;
  background: color-mix(in srgb, var(--accent, #176b87) 76%, #102332);
  color: #fff;
}

.cv-preview[data-layout="top_sidebar"] .reference-header h2 {
  color: #fff;
}

.cv-preview[data-layout="top_sidebar"] :is(.letter-content, .reference-content) {
  padding: 14mm 18mm 20mm;
}

.cv-preview[data-layout="top_sidebar"] .letter-recipient {
  margin-top: 0;
}

.reference-card {
  break-inside: avoid;
  border: 1px solid #d8e1e8;
  border-left: 4px solid var(--accent, #176b87);
  border-radius: 8px;
  padding: 7mm;
}

.reference-card h3 {
  margin: 0 0 3mm;
}

.reference-card ul {
  display: grid;
  gap: 5px;
}

.reference-card li {
  display: flex;
  min-width: 0;
}

.page-overflow-warning {
  margin: 12px 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fff3cd;
  color: #6b5100;
}

.actual-overflow-warning strong,
.actual-overflow-warning small {
  display: block;
}

.actual-overflow-warning ul {
  margin: 8px 0;
  padding-left: 20px;
}

.actual-overflow-warning li + li {
  margin-top: 4px;
}

.cv-preview[data-link-display="visible"] a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.cv-preview[data-link-display="hover"] a {
  color: inherit;
  text-decoration: none;
}

.cv-preview[data-link-display="hover"] a:hover,
.cv-preview[data-link-display="hover"] a:focus-visible {
  color: var(--accent, #176b87);
  text-decoration: underline;
}

/* Full Sidebar Foto: force footer foregrounds after the global link rules. */
.cv-preview[data-layout="full_sidebar_photo"] .document-page-footer.is-left .document-page-number,
.cv-preview[data-layout="full_sidebar_photo"] .document-page-footer.is-right .document-footer-contact,
.cv-preview[data-layout="full_sidebar_photo"] .document-page-footer.is-right .document-footer-contact :is(a, span, i) {
  color: #ffffff !important;
}

.cv-preview[data-layout="full_sidebar_photo"] .document-page-footer.is-right .document-page-number,
.cv-preview[data-layout="full_sidebar_photo"] .document-page-footer.is-left .document-footer-contact,
.cv-preview[data-layout="full_sidebar_photo"] .document-page-footer.is-left .document-footer-contact :is(a, span, i) {
  color: color-mix(in srgb, var(--accent) 55%, #44515a) !important;
}

/* Document-specific compact density. Layout structure and page geometry stay unchanged. */
.cv-preview[data-density="compact"] {
  font-size: 13px;
}

.cv-preview[data-density="compact"] .cv-head {
  gap: 18px !important;
  padding-bottom: 14px !important;
}

.cv-preview[data-density="compact"] .cv-head h2 {
  font-size: calc(34px * var(--cv-font-size-scale));
}

.cv-preview[data-density="compact"] .cv-head p {
  margin-top: 6px;
}

.cv-preview[data-density="compact"] .cv-head ul {
  gap: 3px;
  line-height: 1.3;
}

.cv-preview[data-density="compact"] .cv-section {
  margin-top: 12px !important;
}

.cv-preview[data-density="compact"] .cv-section h3 {
  gap: 5px;
  margin-bottom: 6px !important;
  padding-bottom: 3px !important;
}

.cv-preview[data-density="compact"] .cv-item {
  gap: 3px;
  margin-bottom: 7px !important;
}

.cv-preview[data-layout="year_marker_timeline"][data-density="compact"] .cv-item {
  column-gap: var(--year-marker-gap);
  row-gap: 3px;
}

.cv-preview[data-layout="timeline_cards"][data-density="compact"] .cv-item[data-break-key^="education:"] {
  column-gap: 14px;
  row-gap: 3px;
}

.cv-preview[data-density="compact"] :is(.cv-item p, .cv-section p, .cv-item li) {
  line-height: 1.38;
}

.cv-preview[data-density="compact"] .cv-item ul {
  margin-top: 2px;
}

.cv-preview[data-density="compact"] .cv-side-section {
  gap: 5px;
  margin-bottom: 12px;
}

.cv-preview[data-density="compact"] .cv-side-section ul {
  gap: 3px;
  line-height: 1.3;
}

.cv-preview[data-density="compact"] .tag-list {
  gap: 4px;
}

.cv-preview[data-density="compact"] .tag-list span {
  padding: 3px 7px;
}

.cv-preview[data-density="compact"] .designer-document {
  --designer-section-gap: 4mm !important;
}

.cv-preview[data-density="compact"] .designer-column {
  gap: 4mm;
  padding: 4mm;
}

.cv-preview[data-density="compact"] .designer-style-card {
  padding: 4mm;
}

.cv-preview[data-density="compact"] .letter-recipient {
  margin-top: 11mm;
  min-height: 25mm;
}

.cv-preview[data-density="compact"] .letter-date {
  margin: 6mm 0 7mm;
}

.cv-preview[data-density="compact"] .letter-subject {
  margin-bottom: 6mm;
}

.cv-preview[data-density="compact"] .letter-body {
  line-height: 1.42;
}

.cv-preview[data-density="compact"] .letter-body p {
  margin-bottom: 0.72em;
}

.cv-preview[data-density="compact"] .letter-closing {
  margin-top: 8mm;
}

.cv-preview[data-density="compact"] .reference-header {
  margin-bottom: 8mm;
  padding-bottom: 5mm;
}

.cv-preview[data-density="compact"] .reference-list {
  gap: 5mm;
}

.cv-preview[data-density="compact"] .reference-card {
  padding: 5mm;
}

/* Generous density for documents that benefit from more white space. */
.cv-preview[data-density="relaxed"] {
  font-size: 15px;
}

.cv-preview[data-density="relaxed"] .cv-head {
  gap: 32px !important;
  padding-bottom: 30px !important;
}

.cv-preview[data-density="relaxed"] .cv-head h2 {
  font-size: calc(42px * var(--cv-font-size-scale));
}

.cv-preview[data-density="relaxed"] .cv-head p {
  margin-top: 12px;
}

.cv-preview[data-density="relaxed"] .cv-section {
  margin-top: 32px !important;
}

.cv-preview[data-density="relaxed"] .cv-section h3 {
  margin-bottom: 14px !important;
  padding-bottom: 6px !important;
}

.cv-preview[data-density="relaxed"] .cv-item {
  gap: 7px;
  margin-bottom: 14px !important;
}

.cv-preview[data-layout="year_marker_timeline"][data-density="relaxed"] .cv-item {
  column-gap: var(--year-marker-gap);
  row-gap: 7px;
}

.cv-preview[data-layout="timeline_cards"][data-density="relaxed"] .cv-item[data-break-key^="education:"] {
  column-gap: 14px;
  row-gap: 7px;
}

.cv-preview[data-density="relaxed"] :is(.cv-item p, .cv-section p, .cv-item li) {
  line-height: 1.48;
}

.cv-preview[data-density="relaxed"] .cv-item ul {
  margin-top: 2px;
}

.cv-preview[data-density="relaxed"] .cv-side-section {
  gap: 9px;
  margin-bottom: 22px;
}

.cv-preview[data-density="relaxed"] .tag-list {
  gap: 9px;
}

.cv-preview[data-density="relaxed"] .tag-list span {
  padding: 6px 11px;
}

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

  #cvProfileVisibility {
    display: block;
  }

  #cvPersonalDetailsVisibility {
    display: block;
  }

  #cvProfileVisibility > .visibility-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #cvPersonalDetailsVisibility > .visibility-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .document-type-switcher {
    overflow-x: auto;
    flex-wrap: nowrap;
  }

  .document-type-button {
    flex: 0 0 auto;
  }
}

@media print {
  .page-overflow-warning {
    display: none !important;
  }

  .cv-preview[data-link-display="hover"] a {
    color: inherit !important;
    text-decoration: none !important;
  }
}

.additional-section-nav {
  display: contents;
}

.additional-section-add-tab {
  display: flex !important;
  align-items: center;
  gap: 0 !important;
  white-space: normal;
  border-color: transparent !important;
  background: transparent !important;
  text-align: left;
}

.additional-section-toggle-marker {
  position: absolute;
  left: 0;
  top: 50%;
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 7px solid currentColor;
  transform-origin: 40% 50%;
  transform: translateY(-50%);
  transition: transform 160ms ease;
}

.additional-section-add-tab[aria-expanded="true"] .additional-section-toggle-marker {
  transform: translateY(-50%) rotate(90deg);
}

.additional-section-add-tab:hover,
.additional-section-add-tab:focus-visible {
  background: rgba(255, 255, 255, 0.1) !important;
}

.startup-content {
  position: relative;
}

.startup-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
}

.duplicate-language-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.duplicate-language-grid label {
  cursor: pointer;
}

.duplicate-language-grid input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.duplicate-language-grid span {
  display: grid;
  gap: 3px;
  min-height: 70px;
  align-content: center;
  justify-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
  font-weight: 850;
}

.duplicate-language-grid small {
  color: var(--muted);
}

.duplicate-language-grid input:checked + span {
  border-color: var(--pilot-red-dark);
  background: #ead7d9;
  color: var(--pilot-red-dark);
  box-shadow: inset 0 0 0 1px var(--pilot-red-dark);
}

.design-settings-groups {
  display: grid;
  gap: 14px;
}

.design-settings-group {
  display: grid;
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7f9fa;
}

.design-settings-group legend {
  padding: 0 6px;
  font-weight: 900;
}

.accent-input-row {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 8px;
}

.accent-input-row input[type="color"] {
  width: 64px;
  min-height: 42px;
  padding: 3px;
}

.accent-input-row input[type="text"] {
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  text-transform: uppercase;
}

.accent-input-row input[type="text"].is-invalid {
  border-color: #b4232a;
  box-shadow: 0 0 0 2px rgba(180, 35, 42, 0.12);
}

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

@media (max-width: 700px) {
  .duplicate-language-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .footer-profile-options {
    grid-template-columns: 1fr;
  }
}

.additional-section-picker {
  margin: 0 12px 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.additional-section-picker section + section {
  margin-top: 10px;
}

.additional-section-picker strong {
  display: block;
  margin-bottom: 5px;
  font-size: .8rem;
}

.additional-section-picker section > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.additional-section-picker > div {
  display: grid;
  gap: 2px;
}

.additional-section-picker .additional-section-option {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  align-items: center;
  gap: 5px;
  width: 100%;
  padding: 6px 4px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #ffffff;
  font: inherit;
  font-size: .78rem;
  text-align: left;
  cursor: pointer;
}

.additional-section-picker .additional-section-option:hover,
.additional-section-picker .additional-section-option:focus-visible {
  background: rgba(255, 255, 255, 0.1);
  outline: none;
}

.additional-section-option-marker {
  color: rgba(255, 255, 255, 0.9);
  font-size: 9px;
  line-height: 1;
}

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

.section-order-groups {
  display: grid;
  gap: 12px;
}

.section-order-group {
  overflow: hidden;
  border: 1px solid #d7dfe5;
  border-radius: 8px;
  background: #f8fafb;
}

.section-order-group > summary {
  padding: 12px 14px;
  cursor: pointer;
  font-weight: 800;
}

.section-order-group[open] > summary {
  border-bottom: 1px solid #d7dfe5;
}

.section-order-group-body {
  padding: 14px;
}

.section-order-group-body > .muted-note {
  margin: 0 0 10px;
}

.section-order-sidebar-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.section-order-sidebar-grid h3 {
  margin: 0 0 10px;
  font-size: 14px;
}

.section-order-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 7px 8px;
  border: 1px solid #d7dfe5;
  border-radius: 8px;
  background: #fff;
  cursor: grab;
}

.section-order-item:active { cursor: grabbing; }
.section-order-item strong { flex: 1; }
.section-order-grip { color: #7a8993; font-size: 18px; }
.section-order-item.is-fixed {
  border-style: dashed;
  background: #eef2f4;
  cursor: default;
}
.section-order-item.is-fixed small { color: #687780; font-weight: 700; }
.section-order-lock { color: #687780; }

@media (max-width: 900px) {
  .section-order-sidebar-grid { grid-template-columns: minmax(0, 1fr); }
}
.cv-item-title {
  min-width: 0;
  font-size: inherit;
  line-height: inherit;
}

.cv-item-title .cv-item-organization {
  color: inherit;
  white-space: normal;
  font-size: inherit;
  font-weight: 400;
}

.cv-education-compact-head .cv-item-title,
.cv-additional-experience-compact .cv-item-title {
  font-size: inherit;
  line-height: inherit;
}

.cv-education-compact-head span {
  flex: 0 0 auto;
  text-align: right;
}

.cv-preview[data-layout="year_marker_timeline"] .cv-item-head > span {
  text-align: left;
}

/* Layout-specific optimisation pass. Each rule is intentionally scoped. */
.cv-preview[data-layout="dense_professional"] .cv-item { margin-bottom: 15px; }
.cv-preview[data-layout="dense_professional"] .cv-item-head { margin-bottom: 1px; }
.cv-preview[data-layout="dense_professional"] .cv-item > p { margin: 1px 0; }
.cv-preview[data-layout="dense_professional"] .cv-item > ul { margin-top: 2px; }

.cv-preview[data-layout="section_labels_left"] .cv-section {
  display: block;
  position: relative;
  padding-left: 166px;
}
.cv-preview[data-layout="section_labels_left"] .cv-section > h3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 142px;
  margin: 0;
  line-height: 1.25;
}
.cv-preview[data-layout="section_labels_left"] .cv-item {
  gap: 3px;
  margin-bottom: 6px;
}
.cv-preview[data-layout="section_labels_left"] .cv-item > ul {
  margin-top: 3px;
}
.cv-preview[data-layout="section_labels_left"] .cv-item li {
  line-height: 1.48;
}
.cv-preview[data-layout="section_labels_left"] .cv-item li + li {
  margin-top: 3px;
}
.cv-preview[data-layout="section_labels_left"] :is(.text-list, .personal-details-list) {
  row-gap: 3px;
}
.cv-preview[data-layout="section_labels_left"] .tag-list {
  gap: 4px;
}
.cv-preview[data-layout="section_labels_left"][data-density="compact"] .cv-item {
  gap: 2px;
  margin-bottom: 4px !important;
}
.cv-preview[data-layout="section_labels_left"][data-density="compact"] .cv-item > ul {
  margin-top: 2px;
}
.cv-preview[data-layout="section_labels_left"][data-density="compact"] .cv-item li {
  line-height: 1.38;
}
.cv-preview[data-layout="section_labels_left"][data-density="compact"] .cv-item li + li {
  margin-top: 2px;
}
.cv-preview[data-layout="section_labels_left"][data-density="compact"] :is(.text-list, .personal-details-list) {
  row-gap: 2px;
}
.cv-preview[data-layout="section_labels_left"][data-density="compact"] .tag-list {
  gap: 3px;
}
.cv-preview[data-layout="section_labels_left"][data-density="relaxed"] .cv-item {
  gap: 5px;
  margin-bottom: 8px !important;
}
.cv-preview[data-layout="section_labels_left"][data-density="relaxed"] .cv-item > ul {
  margin-top: 5px;
}
.cv-preview[data-layout="section_labels_left"][data-density="relaxed"] .cv-item li {
  line-height: 1.58;
}
.cv-preview[data-layout="section_labels_left"][data-density="relaxed"] .cv-item li + li {
  margin-top: 5px;
}
.cv-preview[data-layout="section_labels_left"][data-density="relaxed"] :is(.text-list, .personal-details-list) {
  row-gap: 5px;
}
.cv-preview[data-layout="section_labels_left"][data-density="relaxed"] .tag-list {
  gap: 6px;
}
.cv-preview[data-layout="section_labels_left"] .cv-item-head { display:flex; align-items:baseline; justify-content:space-between; gap:14px; }
.cv-preview[data-layout="section_labels_left"] .cv-item-head span { flex:0 0 auto; }

.cv-preview[data-layout="left_sidebar"] .cv-side { min-height: calc(1123px - 190px); }
.cv-preview[data-layout="left_sidebar"] .cv-main > .cv-section:first-child { margin-top:0; }
.cv-preview[data-layout="left_full_sidebar"] .cv-main > .cv-section:first-child,
.cv-preview[data-layout="full_sidebar_photo"] .cv-main > .cv-section:first-child { margin-top:0; }
.cv-preview[data-layout="left_full_sidebar"] .cv-side .tag-list span { width:100%; text-align:center; }
.cv-preview[data-layout="left_full_sidebar"] .cv-side .cv-side-section h3 { font-size:13px; }
.cv-preview[data-layout="full_sidebar_photo"] .cv-side { text-align:left; }
.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-photo-frame { display:block; }
.cv-preview[data-layout="full_sidebar_photo"] .cv-side > .cv-sidebar-block[data-break-key="sidebar:photo"] { margin-right:-22px; margin-left:-22px; }
.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-photo-frame[data-photo-shape="square"],
.cv-preview[data-layout="full_sidebar_photo"] .cv-side .cv-photo-frame[data-photo-shape="circle"] { height:auto!important; aspect-ratio:1 / 1; }
.cv-preview[data-layout="full_sidebar_photo"] .cv-item > ul { margin-top:2px; }

.cv-preview[data-layout="right_narrow_sidebar"] .cv-body { align-items:start; }
.cv-preview[data-layout="right_narrow_sidebar"] .cv-side { min-height:calc(1123px - 190px); padding-bottom:40px; }
.cv-preview[data-layout="right_narrow_sidebar"] .cv-main > .cv-section:first-child { margin-top:0; }
.cv-preview[data-layout="top_sidebar"] .cv-side-section h3 { min-height:0; display:flex; align-items:center; }
.cv-preview[data-layout="split_sidebar"] .cv-main > .cv-section:first-child,
.cv-preview[data-layout="asymmetric_35_65"] .cv-main > .cv-section:first-child { margin-top:0; }

.cv-preview[data-layout="split_50_50"] .tag-list + .cv-section { margin-top:18px; }
.cv-preview[data-layout="asymmetric_35_65"] .personal-details-list li::before,
.cv-preview[data-layout="full_width_experience"] .personal-details-list li::before,
.cv-preview[data-layout="newspaper_grid"] .personal-details-list li::before,
.cv-preview[data-layout="typographic_blocks"] .personal-details-list li::before,
.cv-preview[data-layout="stacked_cards"] .personal-details-list li::before,
.cv-preview[data-layout="dashboard_grid"] .personal-details-list li::before,
.cv-preview[data-layout="horizontal_section_cards"] .personal-details-list li::before,
.cv-preview[data-layout="mixed_modules"] .personal-details-list li::before { content:none; }
.cv-preview[data-layout="alternating_grid"] .cv-main { grid-auto-flow:row dense; }
.cv-preview[data-layout="modular_grid"] .cv-head { row-gap:8px; }
.cv-preview[data-layout="modular_grid"] .cv-side { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }

.cv-preview[data-layout="centered_timeline"] .cv-item:only-child { margin-bottom:8px; }
.cv-preview[data-layout="year_marker_timeline"] .tag-list span { padding:7px 12px; background:var(--accent); color:#fff; }
.cv-preview[data-layout="horizontal_career_strip"] .cv-item { break-inside:avoid; }
.cv-preview[data-layout="horizontal_career_strip"] .cv-item > ul { display:block; }
.cv-preview[data-layout="horizontal_career_strip"] .cv-item > ul li { padding:0; border:0; background:transparent; }
.cv-preview[data-layout="horizontal_career_strip"] .cv-item-head span { white-space:nowrap; }

.cv-preview[data-layout="oversized_name"] .cv-head:has(.cv-photo) { grid-template-columns:minmax(0,1fr) auto; }
.cv-preview[data-layout="oversized_name"] .cv-head:has(.cv-photo) .cv-photo-frame { grid-column:2; grid-row:1 / span 2; align-self:start; margin:0; }
.cv-preview[data-layout="numbered_sections"] .cv-document { counter-reset:numberedsections; }
.cv-preview[data-layout="numbered_sections"] .cv-main { counter-reset:none; }
.cv-preview[data-layout="newspaper_grid"] .cv-main { grid-auto-flow:row dense; }
.cv-preview[data-layout="typographic_blocks"] .cv-head,
.cv-preview[data-layout="stacked_cards"] .cv-head,
.cv-preview[data-layout="dashboard_grid"] .cv-head { row-gap:8px; }
.cv-preview[data-layout="typographic_blocks"] .cv-section { padding:12px 0; }
.cv-preview[data-layout="stacked_cards"] .cv-section { margin-top:10px; }
.cv-preview[data-layout="dashboard_grid"] .cv-section { margin-top:8px; border-left:4px solid var(--accent); }

.cv-preview[data-layout="profile_card_content"] .cv-head:has(.cv-photo) { grid-template-columns:auto minmax(0,1fr); }
.cv-preview[data-layout="profile_card_content"] .cv-head:has(.cv-photo) .cv-photo-frame { grid-column:1; grid-row:1 / span 2; }
.cv-preview[data-layout="profile_card_content"] .cv-head:has(.cv-photo) > div { grid-column:2; display:block; }
.cv-preview[data-layout="profile_card_content"] .cv-head:has(.cv-photo) h2 { margin:0; }
.cv-preview[data-layout="profile_card_content"] .cv-head:has(.cv-photo) p { display:block; margin-top:5px; }
.cv-preview[data-layout="profile_card_content"] .cv-main > .cv-section:first-child { margin-top:0; }
.cv-preview[data-layout="horizontal_section_cards"] .cv-head { row-gap:8px; }
.cv-preview[data-layout="horizontal_section_cards"] .cv-head p { color:#fff; }
.cv-preview[data-layout="mixed_modules"] .cv-head { row-gap:8px; }

.cv-preview[data-layout-variant="left_timeline_split_intro"] .cv-main,
.cv-preview[data-layout-variant="centered_timeline_split_intro"] .cv-main,
.cv-preview[data-layout-variant="timeline_cards_split_intro"] .cv-main { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 22px; }
.cv-preview[data-layout-variant="left_timeline_split_intro"] .cv-section:not([data-break-key="section:profile"]):not([data-break-key="section:motivation"]),
.cv-preview[data-layout-variant="centered_timeline_split_intro"] .cv-section:not([data-break-key="section:profile"]):not([data-break-key="section:motivation"]),
.cv-preview[data-layout-variant="timeline_cards_split_intro"] .cv-section:not([data-break-key="section:profile"]):not([data-break-key="section:motivation"]) { grid-column:1 / -1; }
.cv-preview[data-layout-variant="centered_timeline_split_intro"] .cv-section[data-break-key="section:motivation"] { border-left:1px solid color-mix(in srgb,var(--accent),#fff 65%); padding-left:22px; }
.cv-preview[data-layout-variant="timeline_cards_split_intro"] .cv-section:is([data-break-key="section:profile"],[data-break-key="section:motivation"]) { padding:16px; border:1px solid color-mix(in srgb,var(--accent),#fff 70%); border-radius:10px; }

/* Midnight Timeline */
.cv-preview[data-layout="midnight_timeline"] {
  --midnight-sidebar: var(--accent);
  --midnight-ink: #30313a;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--midnight-ink);
}
.cv-preview[data-layout="midnight_timeline"] .cv-page {
  display:grid;
  grid-template-columns:32% minmax(0,1fr);
  grid-template-rows:auto 1fr;
  column-gap:32px;
  padding:50px 48px 50px 0;
  background:linear-gradient(90deg,var(--midnight-sidebar) 0 32%,#fff 32% 100%);
}

/* Shared sidebar pagination and equal column spacing. */
.cv-preview:is(
  [data-layout="left_sidebar"],
  [data-layout="left_full_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="right_narrow_sidebar"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="split_sidebar"],
  [data-layout="asymmetric_35_65"],
  [data-layout="profile_card_content"],
  [data-layout="midnight_timeline"]
) .cv-sidebar-block {
  break-inside:avoid;
  page-break-inside:avoid;
}
.cv-preview:is([data-layout="left_full_sidebar"],[data-layout="full_sidebar_photo"],[data-layout="midnight_timeline"]) .cv-page:not(:first-child) .cv-side {
  padding-top:56px;
}
.cv-preview[data-layout="midnight_timeline"] .cv-page:not(:first-child) .cv-side {
  margin-top:-50px;
  padding-top:50px;
}
.cv-preview .cv-sidebar-block > .cv-side-section:last-child { margin-bottom:0; }

.cv-preview .cv-side > .cv-sidebar-block[data-break-key="sidebar:photo"] .cv-photo-frame {
  display:block;
  margin:0 auto 18px;
}

.cv-preview .cv-side .cv-sidebar-block:is(
  [data-break-key="sidebar:personalDetails"],
  [data-break-key="sidebar:skills"],
  [data-break-key="sidebar:languages"],
  [data-break-key="sidebar:hobbies"]
) {
  margin-top:18px;
}

.cv-preview .cv-side .cv-sidebar-block[data-break-key="sidebar:personalDetails"] .tag-list {
  display:grid;
  grid-template-columns:minmax(0,1fr);
}

/* Every sidebar uses the same space before a new sidebar section. */
.cv-preview .cv-side > .cv-break-target + .cv-sidebar-block {
  margin-top: 18px;
}
.cv-preview .cv-side > .cv-break-target:first-child + .cv-sidebar-block {
  margin-top: 0;
}
.cv-preview .cv-side .cv-side-section p {
  margin: 0;
}

/* Floating Profile Sidebar: section title belongs visually to its own content. */
.cv-preview[data-layout="floating_profile_sidebar"] .cv-side > .cv-break-target + .cv-sidebar-block {
  margin-top: 18px;
}
.cv-preview[data-layout="floating_profile_sidebar"] .cv-side > .cv-break-target:first-child + .cv-sidebar-block {
  margin-top: 0;
}
.cv-preview[data-layout="floating_profile_sidebar"] .cv-side .cv-side-section {
  gap: 4px;
  margin-bottom: 0;
}
.cv-preview[data-layout="floating_profile_sidebar"] .cv-side .cv-side-section p {
  margin: 0;
}

/* Left Sidebar: one consistent rhythm and a continuous sidebar surface. */
.cv-preview[data-layout="left_sidebar"] .cv-side > .cv-break-target + .cv-sidebar-block {
  margin-top: 18px;
}
.cv-preview[data-layout="left_sidebar"] .cv-side > .cv-break-target:first-child + .cv-sidebar-block {
  margin-top: 0;
}
.cv-preview[data-layout="left_sidebar"] .cv-side .cv-side-section p {
  margin: 0;
}
.cv-preview[data-layout="left_sidebar"] .cv-page:not(:first-child) .cv-side {
  margin-top: 0;
  min-height: calc(1123px - 36px);
}
.cv-preview[data-layout="left_sidebar"] .cv-side .tag-list span {
  border-color: color-mix(in srgb, var(--accent), #ffffff 42%);
  background: color-mix(in srgb, var(--accent), #ffffff 78%);
  font-weight: 700;
}

/* Left Full Sidebar: match the sidebar rhythm and lift the page-one content. */
.cv-preview[data-layout="left_full_sidebar"] .cv-side > .cv-break-target + .cv-sidebar-block {
  margin-top: 18px;
}
.cv-preview[data-layout="left_full_sidebar"] .cv-side > .cv-break-target:first-child + .cv-sidebar-block {
  margin-top: 0;
}
.cv-preview[data-layout="left_full_sidebar"] .cv-side .cv-side-section p {
  margin: 0;
}
.cv-preview[data-layout="left_full_sidebar"] .cv-page:first-child .cv-main {
  margin-top: -32px;
}

.cv-preview .cv-side .cv-sidebar-block[data-break-key="sidebar:personalDetails"] .tag-list span {
  display:block;
  box-sizing:border-box;
  width:100%;
}
.cv-preview[data-layout="midnight_timeline"] .cv-head {
  grid-column:2;
  grid-row:1;
  grid-template-columns:minmax(0,1fr) minmax(190px,240px);
  gap:26px;
  padding:0 0 22px;
  border:0;
}
.cv-preview[data-layout="midnight_timeline"] .cv-head h2 {
  max-width:280px;
  color:var(--accent);
  font-size:38px;
  line-height:.95;
  text-transform:uppercase;
}
.cv-preview[data-layout="midnight_timeline"] .cv-head p {
  margin-top:7px;
  color:#555861;
  font-size:12px;
  text-transform:uppercase;
}
.cv-preview[data-layout="midnight_timeline"] .cv-head ul {
  gap:9px;
  font-size:12px;
}
.cv-preview[data-layout="midnight_timeline"] .cv-head li {
  padding-bottom:7px;
  border-bottom:1px solid #d7d8dd;
}
.cv-preview[data-layout="midnight_timeline"] .cv-head .cv-inline-icon {
  width:1.55em;
  height:1.55em;
  min-width:1.55em;
  padding:.28em;
  border-radius:999px;
  color:#fff;
  background:var(--accent);
}
.cv-preview[data-layout="midnight_timeline"] .cv-body { display:contents; }
.cv-preview[data-layout="midnight_timeline"] .cv-side {
  grid-column:1;
  grid-row:1 / span 2;
  display:block;
  min-width:0;
  margin:-50px 0;
  padding:40px 11px 50px 26px;
  color:#fff;
}
.cv-preview[data-layout="midnight_timeline"] .cv-side .cv-photo-frame {
  display:block;
  margin:0 auto 30px;
  border-color:rgba(255,255,255,.86);
  background:rgba(255,255,255,.14);
}
.cv-preview[data-layout="midnight_timeline"] .cv-side .cv-photo-frame[data-photo-frame="off"] {
  border-color:transparent;
}
.cv-preview[data-layout="midnight_timeline"] .cv-side-section {
  gap:14px;
  margin-bottom:0;
  padding:20px 0;
  border-bottom:1px solid rgba(255,255,255,.34);
}
.cv-preview[data-layout="midnight_timeline"] .cv-side-section h3 {
  color:#fff;
  font-size:13px;
}
.cv-preview[data-layout="midnight_timeline"] .cv-side-section p,
.cv-preview[data-layout="midnight_timeline"] .cv-side-section li,
.cv-preview[data-layout="midnight_timeline"] .cv-side-section a {
  color:#fff;
  font-size:12px;
  line-height:1.55;
}
.cv-preview[data-layout="midnight_timeline"] .cv-side .tag-list {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:8px;
}
.cv-preview[data-layout="midnight_timeline"] .cv-side .tag-list span {
  display:block;
  box-sizing:border-box;
  width:100%;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.65);
  border-radius:var(--tag-radius,24px);
  background:rgba(255,255,255,.14);
  color:#fff;
  font-size:12px;
}

.cv-preview:is(
  [data-layout="split_sidebar"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="top_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="left_sidebar"]
) .cv-side .tag-list {
  display:grid;
  grid-template-columns:minmax(0,1fr);
}

.cv-preview:is(
  [data-layout="split_sidebar"],
  [data-layout="floating_profile_sidebar"],
  [data-layout="top_sidebar"],
  [data-layout="full_sidebar_photo"],
  [data-layout="left_sidebar"]
) .cv-side .tag-list span {
  display:block;
  box-sizing:border-box;
  width:100%;
}
.cv-preview[data-layout="midnight_timeline"] .cv-side .text-list { padding-left:18px; }
.cv-preview[data-layout="midnight_timeline"] .cv-main {
  grid-column:2;
  grid-row:2;
  min-width:0;
}
.cv-preview[data-layout="midnight_timeline"] .cv-section { margin-top:22px; }
.cv-preview[data-layout="midnight_timeline"] .cv-section h3 {
  margin-bottom:18px;
  padding-bottom:10px;
  border-bottom:2px solid #55565d;
  color:#41424a;
  font-size:13px;
}
.cv-preview[data-layout="midnight_timeline"] .cv-item {
  --timeline-axis-x:147px;
  position:relative;
  display:grid;
  grid-template-columns:125px 20px minmax(0,1fr);
  gap:3px 12px;
  margin:0;
  padding:0 0 18px;
}
.cv-preview[data-layout="midnight_timeline"] .cv-item::before {
  content:"";
  position:absolute;
  top:7px;
  bottom:-1px;
  left:var(--timeline-axis-x);
  width:1px;
  background:#55565d;
}
.cv-preview[data-layout="midnight_timeline"] .cv-item::after {
  content:"";
  position:absolute;
  top:3px;
  left:var(--timeline-axis-x);
  width:8px;
  height:8px;
  box-sizing:border-box;
  transform:translateX(-50%);
  border:2px solid #fff;
  box-shadow:0 0 0 1px #55565d;
  border-radius:50%;
  background:#55565d;
}
.cv-preview[data-layout="midnight_timeline"] .cv-item-head { display:contents; }
.cv-preview[data-layout="midnight_timeline"] .cv-item-head strong {
  grid-column:3;
  grid-row:1;
  color:var(--accent);
  font-size:12px;
}
.cv-preview[data-layout="midnight_timeline"] .cv-item-head span {
  grid-column:1;
  grid-row:2;
  color:#777982;
  font-size:11px;
  white-space:normal;
}
.cv-preview[data-layout="midnight_timeline"] .cv-item > p:first-of-type {
  grid-column:1;
  grid-row:1;
  color:var(--accent);
  font-size:11px;
  font-weight:700;
  line-height:1.3;
}
.cv-preview[data-layout="midnight_timeline"] .cv-item > p:not(:first-of-type),
.cv-preview[data-layout="midnight_timeline"] .cv-item > ul {
  grid-column:3;
  color:#777982;
  font-size:11px;
  line-height:1.35;
}
.cv-preview[data-layout="midnight_timeline"] .cv-item > ul { margin:0; padding-left:16px; }
.cv-preview[data-layout="midnight_timeline"] .cv-section:not([data-break-key^="section:experience"]):not([data-break-key^="section:additionalExperience"]):not([data-break-key^="section:education"]) .tag-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px 42px;
}
.cv-preview[data-layout="midnight_timeline"] .cv-section:not([data-break-key^="section:experience"]):not([data-break-key^="section:additionalExperience"]):not([data-break-key^="section:education"]) .tag-list span {
  position:relative;
  padding:0 0 7px;
  border:0;
  border-bottom:5px solid color-mix(in srgb,var(--accent),#fff 76%);
  border-radius:0;
  background:linear-gradient(90deg,var(--accent) 0 78%,transparent 78%);
  background-repeat:no-repeat;
  background-position:left bottom;
  background-size:100% 5px;
  color:#666872;
  font-size:11px;
}

/* Explicit photo placement overrides layout defaults without making the photo sortable or paginatable. */
.cv-preview[data-photo-placement="headerLeft"] .cv-head > .cv-photo-frame {
  grid-column:1!important;
  order:-1;
  justify-self:start!important;
}

.cv-preview[data-photo-placement="headerRight"] .cv-head > .cv-photo-frame {
  grid-column:-2!important;
  order:2;
  justify-self:end!important;
}

/* Top Sidebar: keep contact in the middle header column instead of the
   generic sidebar-header second row. */
.cv-preview[data-layout="top_sidebar"] .cv-head:has(.cv-photo) {
  grid-template-columns: minmax(0, 1fr) minmax(190px, 250px) auto;
  align-items: start;
}

.cv-preview[data-layout="top_sidebar"] .cv-head:has(.cv-photo) > div {
  grid-column: 1;
  grid-row: 1;
}

.cv-preview[data-layout="top_sidebar"] .cv-head:has(.cv-photo) > ul {
  position: static;
  grid-column: 2;
  grid-row: 1 / span 2;
  width: auto;
  margin-top: 0;
  transform: none;
}

.cv-preview[data-layout="top_sidebar"] .cv-head[data-top-sidebar-photo-side="right"] > .cv-photo-frame {
  grid-column: 3 !important;
  grid-row: 1 / span 2;
  justify-self: end !important;
}

.cv-preview[data-layout="top_sidebar"] .cv-head[data-top-sidebar-photo-side="left"] > .cv-photo-frame {
  grid-column: 1 !important;
  grid-row: 1 / span 2;
  justify-self: start !important;
}

.cv-preview[data-layout="top_sidebar"] .cv-head[data-top-sidebar-photo-side="left"] > div {
  grid-column: 3;
}

/* PDF rendering does not reliably evaluate :has(); use the explicit header
   class emitted for Top Sidebar instead. */
.cv-preview[data-layout="top_sidebar"] .cv-head-top-sidebar {
  grid-template-columns: minmax(0, 1fr) minmax(190px, 250px) auto;
  align-items: start;
}

.cv-preview[data-layout="top_sidebar"] .cv-head-top-sidebar > div {
  grid-column: 1;
  grid-row: 1;
}

.cv-preview[data-layout="top_sidebar"] .cv-head-top-sidebar > ul {
  position: static !important;
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  width: auto !important;
  margin-top: 0 !important;
  transform: none !important;
}

.cv-preview[data-layout="top_sidebar"] .cv-head-top-sidebar[data-top-sidebar-photo-side="right"] > .cv-photo-frame {
  grid-column: 3 !important;
  grid-row: 1 / span 2;
  justify-self: end !important;
}

.cv-preview[data-layout="top_sidebar"] .cv-head-top-sidebar[data-top-sidebar-photo-side="left"] > .cv-photo-frame {
  grid-column: 1 !important;
  grid-row: 1 / span 2;
  justify-self: start !important;
}

.cv-preview[data-layout="top_sidebar"] .cv-head-top-sidebar[data-top-sidebar-photo-side="left"] > div {
  grid-column: 3;
}

.cv-preview[data-layout="split_50_50"] .cv-head-contact-middle {
  grid-template-columns: minmax(0, 1fr) minmax(190px, 250px) auto;
  align-items: start;
}

.cv-preview[data-layout="split_50_50"] .cv-head-contact-middle > div {
  grid-column: 1;
  grid-row: 1;
}

.cv-preview[data-layout="split_50_50"] .cv-head-contact-middle > ul {
  position: static !important;
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  width: auto !important;
  margin-top: 0 !important;
  transform: none !important;
}

.cv-preview[data-layout="split_50_50"] .cv-head-contact-middle[data-top-sidebar-photo-side="right"] > .cv-photo-frame {
  grid-column: 3 !important;
  grid-row: 1 / span 2;
  justify-self: end !important;
}

.cv-preview[data-layout="split_50_50"] .cv-head-contact-middle[data-top-sidebar-photo-side="left"] > .cv-photo-frame {
  grid-column: 1 !important;
  grid-row: 1 / span 2;
  justify-self: start !important;
}

.cv-preview[data-layout="split_50_50"] .cv-head-contact-middle[data-top-sidebar-photo-side="left"] > div {
  grid-column: 3;
}

.cv-preview:is(
  [data-layout="full_width_experience"],
  [data-layout="asymmetric_35_65"],
  [data-layout="modular_grid"]
) .cv-head-contact-middle {
  grid-template-columns: minmax(0, 1fr) minmax(190px, 250px) auto;
  align-items: start;
}

.cv-preview:is(
  [data-layout="full_width_experience"],
  [data-layout="asymmetric_35_65"],
  [data-layout="modular_grid"]
) .cv-head-contact-middle > div {
  grid-column: 1;
  grid-row: 1;
}

.cv-preview:is(
  [data-layout="full_width_experience"],
  [data-layout="asymmetric_35_65"],
  [data-layout="modular_grid"]
) .cv-head-contact-middle > ul {
  position: static !important;
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  width: auto !important;
  margin-top: 0 !important;
  transform: none !important;
}

.cv-preview:is(
  [data-layout="full_width_experience"],
  [data-layout="asymmetric_35_65"],
  [data-layout="modular_grid"]
) .cv-head-contact-middle[data-top-sidebar-photo-side="right"] > .cv-photo-frame {
  grid-column: 3 !important;
  grid-row: 1 / span 2;
  justify-self: end !important;
}

.cv-preview:is(
  [data-layout="full_width_experience"],
  [data-layout="asymmetric_35_65"],
  [data-layout="modular_grid"]
) .cv-head-contact-middle[data-top-sidebar-photo-side="left"] > .cv-photo-frame {
  grid-column: 1 !important;
  grid-row: 1 / span 2;
  justify-self: start !important;
}

.cv-preview:is(
  [data-layout="full_width_experience"],
  [data-layout="asymmetric_35_65"],
  [data-layout="modular_grid"]
) .cv-head-contact-middle[data-top-sidebar-photo-side="left"] > div {
  grid-column: 3;
}

.cv-preview[data-layout="asymmetric_35_65"] .cv-head-asymmetric {
  grid-template-columns: auto minmax(0, 1fr) minmax(190px, 250px);
  align-items: start;
}

.cv-preview[data-layout="asymmetric_35_65"] .cv-head-asymmetric > .cv-photo-frame {
  grid-column: 1 !important;
  grid-row: 1 / span 2;
  justify-self: start !important;
}

.cv-preview[data-layout="asymmetric_35_65"] .cv-head-asymmetric > div {
  grid-column: 2;
  grid-row: 1;
}

.cv-preview[data-layout="asymmetric_35_65"] .cv-head-asymmetric > ul {
  position: static !important;
  grid-column: 3 !important;
  grid-row: 1 / span 2 !important;
  width: auto !important;
  margin-top: 0 !important;
  transform: none !important;
}

.cv-preview:is(
  [data-layout="mixed_modules"],
  [data-layout="horizontal_section_cards"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"]
) .cv-head-contact-middle {
  grid-template-columns: minmax(0, 1fr) minmax(190px, 250px) auto;
  align-items: start;
}

.cv-preview:is(
  [data-layout="mixed_modules"],
  [data-layout="horizontal_section_cards"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"]
) .cv-head-contact-middle > div {
  grid-column: 1;
  grid-row: 1;
}

.cv-preview:is(
  [data-layout="mixed_modules"],
  [data-layout="horizontal_section_cards"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"]
) .cv-head-contact-middle > ul {
  position: static !important;
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  width: auto !important;
  margin-top: 0 !important;
  transform: none !important;
}

.cv-preview:is(
  [data-layout="mixed_modules"],
  [data-layout="horizontal_section_cards"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"]
) .cv-head-contact-middle[data-top-sidebar-photo-side="right"] > .cv-photo-frame {
  grid-column: 3 !important;
  grid-row: 1 / span 2;
  justify-self: end !important;
}

.cv-preview:is(
  [data-layout="mixed_modules"],
  [data-layout="horizontal_section_cards"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"]
) .cv-head-contact-middle[data-top-sidebar-photo-side="left"] > .cv-photo-frame {
  grid-column: 1 !important;
  grid-row: 1 / span 2;
  justify-self: start !important;
}

.cv-preview:is(
  [data-layout="mixed_modules"],
  [data-layout="horizontal_section_cards"],
  [data-layout="stacked_cards"],
  [data-layout="dashboard_grid"]
) .cv-head-contact-middle[data-top-sidebar-photo-side="left"] > div {
  grid-column: 3;
}

.cv-preview[data-layout="profile_card_content"] .cv-head-profile-card {
  grid-template-columns: auto minmax(0, 1fr) minmax(190px, 250px);
  align-items: start;
}

.cv-preview[data-layout="profile_card_content"] .cv-head-profile-card > .cv-photo-frame {
  grid-column: 1 !important;
  grid-row: 1 / span 2;
  justify-self: start !important;
}

.cv-preview[data-layout="profile_card_content"] .cv-head-profile-card > div {
  grid-column: 2;
  grid-row: 1;
  display: block;
}

.cv-preview[data-layout="profile_card_content"] .cv-head-profile-card > ul {
  position: static !important;
  grid-column: 3 !important;
  grid-row: 1 / span 2 !important;
  width: auto !important;
  margin-top: 0 !important;
  transform: none !important;
}

/* Guided and contextual help */
.context-help-row { position:relative; }
.context-help-button { position:absolute; z-index:3; top:8px; right:8px; display:grid; place-items:center; width:17px; height:17px; margin:0; padding:0; border:1px solid #afc0cc; border-radius:50%; background:rgba(248,250,251,.92); color:#496477; font:700 10px/1 Arial,sans-serif; opacity:.72; cursor:pointer; transition:opacity .15s ease,background .15s ease,color .15s ease,border-color .15s ease; }
label.context-help-row > .context-help-button { top:0; right:0; }
.context-help-button:hover,.context-help-button:focus-visible { background:#eaf4f6; color:#0d5975; border-color:#6f9eaa; opacity:1; outline:2px solid rgba(23,107,135,.14); outline-offset:1px; }
.help-dialog { width:min(580px, calc(100vw - 28px)); padding:0; border:0; border-radius:18px; box-shadow:0 24px 80px rgba(3,22,42,.28); }
.help-dialog::backdrop { background:rgba(4,20,38,.48); }
.help-dialog-content { position:relative; padding:28px; color:#15283a; }
.help-dialog-content h2 { margin:4px 42px 10px 0; }
.help-guide-card,.help-topic-list button { width:100%; display:grid; gap:4px; text-align:left; padding:14px 16px; border:1px solid #d7e1e8; border-radius:10px; background:#fff; color:inherit; cursor:pointer; }
.help-guide-card { margin:18px 0; border-color:#7bb6c5; background:#eef9fb; }
.help-guide-card span,.help-topic-list span { color:#607386; font-size:.88rem; line-height:1.4; }
.help-topic-list { display:grid; gap:8px; }
.help-topic-list button:hover { border-color:#176b87; background:#f7fbfc; }
.help-support { margin-top:20px; padding:17px; border-radius:12px; background:#f2f5f7; }
.help-support h3 { margin:0 0 5px; }.help-support p { margin:0 0 14px; }
.help-progress { display:flex; gap:6px; margin:20px 0 4px; }.help-progress span { height:5px; flex:1; border-radius:5px; background:#d9e3e8; }.help-progress span.active { background:#176b87; }
.help-highlight { position:relative; z-index:1001 !important; outline:4px solid #2ca6b7 !important; outline-offset:4px; border-radius:6px; }
.layout-advice { margin-top:12px; padding-top:10px; border-top:1px solid #dce5ea; }.layout-advice summary { color:#0d5975; font-weight:750; cursor:pointer; }.layout-advice dl { display:grid; gap:7px; margin:10px 0 0; }.layout-advice dl div { display:grid; grid-template-columns:105px 1fr; gap:8px; }.layout-advice dt { font-weight:700; }.layout-advice dd { margin:0; color:#586b7c; }
@media (max-width:700px) { .app-help-button { order:10; }.help-dialog-content { padding:22px 18px; }.layout-advice dl div { grid-template-columns:1fr; gap:1px; } }
.support-ticket-list { display:grid; gap:12px; margin-top:16px; }.support-ticket-card { border:1px solid #d8e2e8; border-radius:12px; background:#fff; overflow:hidden; }.support-ticket-card > summary { display:grid; grid-template-columns:minmax(180px,1fr) auto auto auto; gap:12px; align-items:center; padding:14px 16px; cursor:pointer; }.support-ticket-card > summary span:first-child { display:grid; gap:2px; }.support-ticket-card > summary small { color:#607386; }.support-ticket-card > summary time { color:#607386; font-size:.82rem; }.support-ticket-detail { display:grid; gap:16px; padding:18px; border-top:1px solid #e0e7eb; }.support-ticket-meta,.support-ticket-controls { display:flex; flex-wrap:wrap; gap:12px 24px; align-items:end; }.support-thread { display:grid; gap:10px; }.support-message { max-width:82%; padding:12px 14px; border-radius:12px; background:#f1f5f7; }.support-message.is-support { margin-left:auto; background:#e8f5f7; }.support-message.is-internal { margin-left:auto; border:1px dashed #b98824; background:#fff7df; }.support-message header { display:flex; justify-content:space-between; gap:14px; font-size:.82rem; }.support-message p { margin:7px 0 0; }.support-priority-high,.support-priority-urgent { color:#9f1d17; background:#fff0ee; }.support-ticket-detail > label { display:grid; gap:6px; }.support-ticket-detail textarea { width:100%; }.support-filterbar input { min-width:280px; }
@media (max-width:700px) { .support-ticket-card > summary { grid-template-columns:1fr auto; }.support-ticket-card > summary time { grid-column:1/-1; }.support-message { max-width:96%; } }
.help-admin-list { display:grid; gap:12px; }.help-admin-item { display:grid; gap:12px; }.help-admin-item > label:not(.check-option),.help-admin-item details label { display:grid; gap:5px; }.help-admin-item textarea,.help-admin-item input[type="text"] { width:100%; }.help-admin-settings { margin-bottom:20px; }

/* Mobile editor: one task at a time instead of a compressed desktop workspace. */
.mobile-editor-controls,
.mobile-bottom-actions,
.mobile-editor-nav-close {
  display: none;
}

@media (max-width: 780px) {
  body[data-mode="edit"] {
    padding-bottom: 76px;
  }

  body[data-mode="edit"] .app-shell {
    display: block;
    padding: 8px;
  }

  body[data-mode="edit"] .mobile-editor-controls {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr);
    gap: 6px;
    margin: 0 0 8px;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--surface);
    box-shadow: var(--shadow);
  }

  .mobile-editor-controls .small-button {
    min-height: 42px;
    padding: 0 10px;
  }

  .mobile-editor-controls .small-button.is-active {
    border-color: var(--brand);
    background: var(--brand);
    color: #fff;
  }

  .mobile-editor-sections-button {
    justify-self: start;
  }

  body[data-mode="edit"] .sidebar {
    display: none;
  }

  body[data-mode="edit"] .editor {
    display: block;
    min-height: 0;
    overflow: visible;
  }

  body[data-mode="edit"] .editor-tabs {
    display: none;
  }

  body[data-mode="edit"][data-mobile-nav="open"] .editor-tabs {
    position: fixed;
    z-index: 30;
    inset: 0 0 70px 0;
    display: grid;
    align-content: start;
    overflow: auto;
    padding: 16px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  body[data-mode="edit"][data-mobile-nav="open"] .editor-tabs .editor-nav-toggle-row {
    display: flex;
    justify-content: space-between;
    min-height: 42px;
    margin-bottom: 8px;
  }

  body[data-mode="edit"][data-mobile-nav="open"] .editor-nav-toggle {
    display: none;
  }

  body[data-mode="edit"][data-mobile-nav="open"] .mobile-editor-nav-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-color: rgba(255, 255, 255, 0.7);
    background: #fff;
    color: var(--brand-dark);
    font-size: 22px;
  }

  body[data-mode="edit"] .editor-main,
  body[data-mode="edit"] .form-stack {
    display: block;
    overflow: visible;
  }

  body[data-mode="edit"] .editor-main {
    padding: 12px;
  }

  body[data-mode="edit"] .editor-stepper {
    position: static;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  body[data-mode="edit"] .editor-stepper > button {
    width: 100%;
    min-height: 44px;
  }

  body[data-mode="edit"] .preview-wrap {
    display: none;
  }

  body[data-mode="edit"][data-mobile-view="preview"] .editor {
    display: none;
  }

  body[data-mode="edit"][data-mobile-view="preview"] .preview-wrap {
    display: grid;
    height: calc(100dvh - 160px);
    min-height: 480px;
    border-radius: 8px;
  }

  body[data-mode="edit"][data-mobile-view="preview"] .preview-toolbar {
    padding: 10px;
  }

  body[data-mode="edit"][data-mobile-view="preview"] .preview-scale-control,
  body[data-mode="edit"][data-mobile-view="preview"] .preview-toolbar .section-actions {
    display: none;
  }

  body[data-mode="edit"][data-mobile-view="preview"] .preview-scroll {
    padding: 8px 4px 24px;
  }

  body[data-mode="edit"][data-mobile-view="preview"] .preview-scroll .cv-preview {
    zoom: 0.43 !important;
  }

  body[data-mode="edit"][data-mobile-view="preview"] .preview-scroll .cv-preview[data-orientation="landscape"],
  body[data-mode="edit"][data-mobile-view="preview"] .preview-scroll .cv-preview[data-layout="magazine_columns_landscape"],
  body[data-mode="edit"][data-mobile-view="preview"] .preview-scroll .cv-preview[data-layout="horizontal_career_strip"] {
    zoom: 0.29 !important;
  }

  body[data-mode="edit"] .mobile-bottom-actions {
    position: fixed;
    z-index: 31;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    padding: 7px max(8px, env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
    border-top: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 -8px 24px rgba(23, 33, 38, 0.12);
  }

  .mobile-bottom-actions button {
    min-width: 0;
    min-height: 44px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--brand-dark);
    font-size: 11px;
    font-weight: 800;
  }

  .mobile-bottom-actions button.is-primary {
    background: var(--brand);
    color: #fff;
  }

  body[data-mode="edit"] .layout-gallery-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  body[data-mode="edit"] .layout-card {
    zoom: 0.9;
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
  }

  body[data-mode="edit"] .layout-mini-frame {
    width: 104px;
    height: 146px;
  }

  body[data-mode="edit"] .layout-card.is-landscape .layout-mini-frame {
    width: 104px;
    height: 74px;
  }

  body[data-mode="edit"] .layout-card-body {
    gap: 6px;
  }

  body[data-mode="edit"] .layout-card-body p,
  body[data-mode="edit"] .layout-card-body small {
    font-size: 12px;
  }

  body[data-mode="edit"] .layout-card-actions {
    gap: 5px;
  }
}

/* Desktop photo editor: preview and controls form two clear, balanced areas. */
@media (min-width: 781px) {
  .tab-panel[data-panel="photo"] {
    gap: 18px;
    padding: 24px;
    background: linear-gradient(145deg, #fff8f8 0%, #fcebef 100%);
  }

  .photo-section-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid #ecc9cf;
  }

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

  .photo-section-heading h2 {
    color: var(--brand-dark);
    font-size: 22px;
  }

  .photo-section-heading p {
    color: var(--muted);
    font-size: 13px;
  }

  .photo-control {
    grid-template-columns: minmax(230px, 0.75fr) minmax(0, 1.45fr);
    gap: 22px;
    align-items: stretch;
    padding: 0;
    border: 0;
    background: transparent;
  }

  .photo-preview-column {
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 12px;
    min-height: 350px;
    padding: 22px;
    border: 1px solid #d7e2e7;
    border-radius: 12px;
    background: linear-gradient(160deg, #f9fcfd, #edf5f7);
  }

  .photo-preview {
    width: 154px;
    height: 194px;
    border-radius: 10px;
    box-shadow: 0 10px 24px rgba(28, 53, 68, 0.12);
  }

  .photo-preview[data-photo-shape="square"],
  .photo-preview[data-photo-shape="circle"] {
    width: 164px;
    height: 164px;
  }

  .photo-preview-hint {
    margin: -2px 0 2px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
  }

  .photo-actions {
    grid-template-columns: 1fr 1fr;
    width: 100%;
    gap: 8px;
  }

  .photo-actions > button {
    width: 100%;
    min-height: 40px;
    padding: 0 10px;
  }

  .photo-settings {
    align-content: start;
    gap: 14px;
    padding: 20px;
    border: 1px solid #d7e2e7;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(28, 53, 68, 0.06);
  }

  .photo-settings label > span {
    color: var(--brand-dark);
    font-size: 12px;
  }

  .photo-settings input[type="range"] {
    padding: 0;
  }

  .photo-settings .check-option {
    grid-column: auto;
    min-height: 48px;
    padding: 10px 12px;
    border-color: #d7e2e7;
    background: #f8fbfc;
  }
}