/* CV: a sheet of A4 on a grey desk. The page is the hero; the editor is plain. One accent colour, chosen by
   the person, runs through the name rule and the section headings. Prints as the sheet alone. */
:root { --page: #eceef0; --card: #ffffff; --ink: #1b1f23; --soft: #5a6168; --line: #d3d7dc; --field: #eef0f2; --act: #1d3f72; --on-act: #ffffff; --stop: #b3261e; --wide: 1180px; --accent: #1f2933; color-scheme: light; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --page: #121416; --card: #1b1e21; --ink: #e9ecef; --soft: #a3aab1; --line: #30353a; --field: #121416; --act: #8fb6ff; --on-act: #0b1a33; --stop: #ff8a80; color-scheme: dark; }
}
.desk { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 980px) { .desk { grid-template-columns: minmax(0, 420px) minmax(0, 1fr); } .preview { position: sticky; top: 16px; } }
.editor { display: grid; gap: 16px; }
.editor .card label { flex: none; }
.item { border-top: 1px solid var(--line); padding-top: 12px; display: grid; gap: 10px; }
.item .row label { flex: 1 1 140px; }
.tools { display: flex; flex-wrap: wrap; gap: 6px; }
.file { position: relative; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; min-height: 48px; padding: 0 22px; font-weight: 700; font-size: 17px; cursor: pointer; flex: none; }
.file input { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.file:focus-within { outline: 3px solid var(--act); outline-offset: 2px; }
.chip.swatch::before { content: ""; display: inline-block; width: 14px; height: 14px; border-radius: 50%; background: var(--sw); margin-right: 8px; vertical-align: -2px; }
.print-row { align-items: center; margin-bottom: 12px; }

/* The sheet: always light, like paper. */
.paper { background: #fff; color: #1b1f23; aspect-ratio: 210 / 297; width: 100%; max-width: 794px; padding: 7% 8%; box-shadow: 0 2px 14px rgb(0 0 0 / 0.16);
  font: 400 clamp(9px, 1.25vw, 11.5px)/1.45 "Helvetica Neue", Helvetica, Arial, sans-serif; display: grid; align-content: start; gap: 1.6em; }
@media (max-width: 979px) { .paper { font-size: clamp(7px, 1.9vw, 11.5px); } }
.paper .head { border-bottom: 3px solid var(--accent); padding-bottom: 1em; display: grid; gap: .3em; }
.paper .who { font-size: 2.5em; font-weight: 800; letter-spacing: -0.02em; line-height: 1.05; margin: 0; color: var(--accent); overflow-wrap: anywhere; }
.paper .pitch { font-size: 1.25em; margin: 0; }
.paper .contact { display: flex; flex-wrap: wrap; gap: .2em 1.4em; color: #4a5158; margin: 0; padding: 0; list-style: none; overflow-wrap: anywhere; }
.paper h2 { font-size: 1em; text-transform: uppercase; letter-spacing: .12em; color: var(--accent); margin: 0 0 .7em; }
.paper .sec { display: grid; gap: .9em; }
.paper .entry { display: grid; gap: .25em; break-inside: avoid; }
.paper .top { display: flex; justify-content: space-between; gap: 1em; align-items: baseline; }
.paper .top b { font-size: 1.1em; overflow-wrap: anywhere; }
.paper .top span { color: #4a5158; white-space: nowrap; }
.paper .where { color: #4a5158; margin: 0; }
.paper p { margin: 0; overflow-wrap: anywhere; } .paper ul { margin: .2em 0 0; padding-left: 1.2em; } .paper li { margin: .15em 0; overflow-wrap: anywhere; }
.paper .ghost { color: #9aa1a8; }

@page { size: A4; margin: 0; }
@media print {
  body { background: #fff; }
  main { display: block; max-width: none; padding: 0; margin: 0; }
  .intro, .editor, .print-row, footer { display: none !important; }
  .desk { display: block; }
  .paper { box-shadow: none; max-width: none; width: 210mm; aspect-ratio: auto; min-height: 297mm; overflow: visible; padding: 16mm 17mm; font-size: 10.5pt; }
}
@media (max-width: 480px) { .tools button { flex: 1; } }
