.wide { max-width: 1400px; }

.editor-page { background: var(--alt); }

.editor {
  max-width: 1400px;
  margin: 0 auto;
  padding: 24px 16px 48px;
  display: grid;
  grid-template-columns: minmax(340px, 480px) 1fr;
  gap: 28px;
  align-items: start;
}

.editor-form fieldset {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 18px 18px 8px;
  margin: 0 0 16px;
}
.editor-form legend {
  font-family: var(--serif);
  font-size: 1.15rem;
  padding: 0 6px;
  margin-left: -6px;
}
.editor-form label {
  display: block;
  font-size: .85rem;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 12px;
}
.editor-form small { font-weight: 400; color: var(--muted); }
.editor-form input:not([type="radio"]),
.editor-form textarea {
  display: block;
  width: 100%;
  margin-top: 4px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  font: inherit;
  font-weight: 400;
  font-size: .95rem;
  color: var(--ink);
}
.editor-form textarea { resize: vertical; }
.editor-form input:focus,
.editor-form textarea:focus { outline: 2px solid var(--navy); outline-offset: -1px; background: #fff; }

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.grid-2.tight { gap: 0 8px; }

.template-picker { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.template-picker label {
  margin: 0;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  cursor: pointer;
  font-weight: 600;
}
.template-picker input { position: absolute; opacity: 0; pointer-events: none; }
.template-picker label:has(input:checked) { background: var(--navy); border-color: var(--navy); color: #fff; }
.template-picker label:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }

.item {
  border-top: 1px dashed var(--line);
  padding-top: 14px;
  margin-top: 4px;
}
.item:first-child { border-top: 0; padding-top: 0; margin-top: 0; }

.add, .remove, .link-button {
  font: inherit;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 0;
}
.add { color: var(--navy); font-weight: 600; margin: 4px 0 14px; }
.remove { color: var(--accent); font-size: .85rem; margin: -4px 0 14px; }
.link-button { color: var(--muted); text-decoration: underline; }

.privacy-note { font-size: .85rem; color: var(--muted); margin: 0; }

.preview-pane { position: sticky; top: 88px; }
.toolbar { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.toolbar .button { margin: 0; border: 0; cursor: pointer; font: inherit; font-weight: 600; }
.hint { font-size: .85rem; color: var(--muted); }

.sheet-frame { width: 100%; overflow: hidden; }
.sheet-scale { transform-origin: top left; width: 210mm; }
.sheet-scale .cv { box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 24px 48px -24px rgba(31,58,95,.35); }

/* CV sheet */
.cv {
  width: 210mm;
  min-height: 297mm;
  background: #fff;
  color: #1b2430;
  font-family: -apple-system, "Helvetica Neue", Arial, sans-serif;
  font-size: 9.5pt;
  line-height: 1.45;
  display: grid;
  align-content: start;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.cv h1, .cv h2, .cv h3, .cv p, .cv ul { margin: 0; }
.cv h1, .cv h2, .cv h3 { font-family: inherit; line-height: 1.2; }
.cv ul { padding-left: 1.1em; }
.cv li { margin-bottom: 2pt; }
.cv-head { grid-area: head; }
.cv-main { grid-area: main; }
.cv-side { grid-area: side; }
.cv-contact { list-style: none; padding: 0 !important; display: flex; flex-wrap: wrap; gap: 2pt 12pt; }
.cv-contact li { margin: 0; }
.cv-section { margin-bottom: 12pt; }
.cv-entry { margin-bottom: 9pt; }
.cv-entry h3 { font-size: 10.5pt; font-weight: 700; }
.cv-meta { color: #6b7380; font-size: 8.5pt; margin-bottom: 3pt; }
.cv-empty { color: #a0a6b0; font-style: italic; }
.cv-tags { display: flex; flex-wrap: wrap; gap: 4pt; list-style: none; padding: 0 !important; }
.cv-tags li { margin: 0; }

/* Classic */
.t-classic { grid-template-areas: "head" "main" "side"; padding: 18mm 20mm; font-family: Georgia, "Times New Roman", serif; }
.t-classic .cv-head { text-align: center; border-bottom: 1.5pt solid #2b3542; padding-bottom: 10pt; margin-bottom: 14pt; }
.t-classic h1 { font-family: Georgia, serif; font-size: 24pt; font-weight: 400; letter-spacing: .04em; }
.t-classic .cv-title { font-size: 11pt; font-style: italic; margin-top: 3pt; }
.t-classic .cv-contact { justify-content: center; margin-top: 6pt; font-size: 9pt; color: #4a5260; font-family: -apple-system, "Helvetica Neue", Arial, sans-serif; }
.t-classic h2 { font-size: 11pt; text-transform: uppercase; letter-spacing: .12em; border-bottom: .5pt solid #b9bec7; padding-bottom: 3pt; margin-bottom: 8pt; font-weight: 400; }
.t-classic .cv-side { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 16pt; }
.t-classic .cv-tags li:not(:last-child)::after { content: ","; }

/* Modern */
.t-modern { grid-template-columns: 68mm 1fr; grid-template-areas: "side head" "side main"; grid-template-rows: auto 1fr; }
.t-modern .cv-side { background: #1f3a5f; color: #d5deea; padding: 20mm 9mm 16mm 11mm; }
.t-modern .cv-head { padding: 20mm 14mm 0 12mm; }
.t-modern .cv-main { padding: 6pt 14mm 16mm 12mm; }
.t-modern h1 { font-size: 26pt; font-weight: 700; color: #1f3a5f; line-height: 1.05; }
.t-modern .cv-title { font-size: 12pt; color: #c8643b; margin-top: 4pt; font-weight: 600; }
.t-modern .cv-contact { margin-top: 8pt; color: #4a5260; font-size: 8.5pt; }
.t-modern .cv-main h2 { font-size: 11pt; text-transform: uppercase; letter-spacing: .12em; color: #1f3a5f; margin: 14pt 0 8pt; padding-bottom: 3pt; border-bottom: 1pt solid #e4ddd1; }
.t-modern .cv-side h2 { font-size: 9pt; text-transform: uppercase; letter-spacing: .14em; color: #f0b79a; margin: 0 0 6pt; }
.t-modern .cv-side .cv-section { margin-bottom: 16pt; }
.t-modern .cv-side .cv-tags { flex-direction: column; gap: 3pt; }
.t-modern .cv-empty { color: #8ea3bf; }

/* Creative */
.t-creative { grid-template-columns: 1fr 58mm; grid-template-areas: "head head" "main side"; column-gap: 10mm; }
.t-creative .cv-head { background: #c8643b; color: #fff; padding: 16mm 16mm 12mm; position: relative; overflow: hidden; margin-bottom: 10mm; }
.t-creative .cv-head::after { content: ""; position: absolute; right: -20mm; top: -25mm; width: 80mm; height: 80mm; border-radius: 50%; background: #f6d9c9; opacity: .35; }
.t-creative h1 { font-family: Georgia, serif; font-size: 30pt; font-weight: 400; position: relative; }
.t-creative .cv-title { font-size: 12pt; margin-top: 4pt; letter-spacing: .05em; position: relative; }
.t-creative .cv-contact { margin-top: 10pt; font-size: 8.5pt; position: relative; }
.t-creative .cv-main { padding-left: 16mm; }
.t-creative .cv-side { margin-right: 16mm; background: #fbf3ee; border-radius: 6pt; padding: 10pt 12pt; align-self: start; }
.t-creative h2 { font-family: Georgia, serif; font-size: 14pt; font-weight: 400; color: #c8643b; margin-bottom: 8pt; }
.t-creative h2::before { content: ""; display: inline-block; width: 7pt; height: 7pt; background: #c8643b; border-radius: 50%; margin-right: 6pt; vertical-align: middle; }
.t-creative .cv-entry { padding-left: 10pt; border-left: 1.5pt solid #f6d9c9; }
.t-creative .cv-meta { color: #8a6a5c; }
.t-creative .cv-tags li { background: #fff; border: .75pt solid #e7b9a2; border-radius: 10pt; padding: 1.5pt 7pt; font-size: 8.5pt; }

@media (max-width: 900px) {
  .editor { grid-template-columns: 1fr; }
  .preview-pane { position: static; order: -1; }
}

@media print {
  @page { size: A4; margin: 0; }
  html, body { background: #fff !important; margin: 0; }
  .site-header, .editor-form, .toolbar { display: none !important; }
  .editor { display: block; padding: 0; max-width: none; }
  .preview-pane { position: static; }
  .sheet-frame { overflow: visible; height: auto !important; }
  .sheet-scale { transform: none !important; }
  .sheet-scale .cv { box-shadow: none; }
  .cv { height: 297mm; overflow: hidden; }
  .cv-empty { display: none; }
}