/* Expat UK Tax - technical flowchart house style (A4 portrait, Verdana, UK flag palette) */
:root {
  --blue: #012169;
  --red: #C8102E;
  --tint: #eff3fa;
  --tint2: #dfe6f3;
  --line: #cbd5e1;
  --text: #1e293b;
  --muted: #475569;
}
@page { size: A4; margin: 0; }
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: Verdana, Geneva, sans-serif;
  color: var(--text);
  font-size: 7.6pt;
  line-height: 1.32;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.page {
  width: 210mm;
  height: 297mm;
  padding: 9mm 11mm 8mm;
  position: relative;
  overflow: hidden;
  page-break-after: always;
  display: flex;
  flex-direction: column;
}
.page:last-child { page-break-after: auto; }

/* Header */
.hdr { display: flex; align-items: flex-end; justify-content: space-between; padding-bottom: 2.6mm; border-bottom: 1.4mm solid var(--blue); position: relative; }
.hdr::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2.4mm; height: 0.7mm; background: var(--red); }
.hdr img { height: 11mm; }
.hdr .ttl { text-align: right; }
.hdr h1 { margin: 0; font-size: 15pt; color: var(--blue); font-weight: bold; letter-spacing: -0.2pt; }
.hdr .sub { font-size: 8pt; color: var(--red); font-weight: bold; margin-top: 0.8mm; }
.hdr-gap { height: 4.5mm; }

/* Draft strip (hidden in approved build) */
.draft-strip { border: 0.4mm solid var(--red); background: #fdeef0; color: var(--red); font-size: 6.6pt; padding: 1.4mm 2.4mm; margin-bottom: 2.5mm; line-height: 1.35; }
.draft-strip b { font-size: 7pt; }
body.approved .draft-strip { display: none; }
.v { background: none; }
body.approved .v { background: none; border-bottom: none; }

.intro { font-size: 7.4pt; color: var(--muted); margin: 0 0 2.4mm; }

/* Step labels */
.step { display: flex; align-items: center; gap: 2mm; margin: 1.6mm 0 1.4mm; }
.step .n { background: var(--red); color: #fff; font-weight: bold; font-size: 7pt; padding: 0.6mm 2mm; border-radius: 0.8mm; white-space: nowrap; }
.step .t { color: var(--blue); font-weight: bold; font-size: 8.4pt; }
.step .h { color: var(--muted); font-size: 6.8pt; }

/* Question / outcome boxes */
.q { border: 0.35mm solid var(--blue); background: var(--tint); border-radius: 1.2mm; padding: 1.6mm 2.4mm; }
.q b { color: var(--blue); }
.out { border-radius: 1.6mm; padding: 2.4mm 3mm; display: flex; flex-direction: column; justify-content: center; text-align: center; }
.out .big { font-size: 10.5pt; font-weight: bold; margin-bottom: 1mm; }
.out.nr { background: #fff; border: 0.6mm solid var(--blue); color: var(--blue); }
.out.r { background: var(--blue); color: #fff; }
.out.r .big { color: #fff; }
.out.neutral { background: #fff; border: 0.35mm dashed var(--muted); color: var(--text); }
.out small { font-size: 6.8pt; line-height: 1.35; }

/* Arrows */
.yes { display: flex; align-items: center; gap: 1mm; font-weight: bold; color: var(--blue); font-size: 7pt; padding: 0 1mm; }
.yes .ln { flex: 1; height: 0.4mm; background: var(--blue); position: relative; }
.yes .ln::after { content: ""; position: absolute; right: -0.4mm; top: -1.05mm; border-left: 2.2mm solid var(--blue); border-top: 1.25mm solid transparent; border-bottom: 1.25mm solid transparent; }
.down { height: 5mm; position: relative; }
.down::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 1.6mm; width: 0.4mm; background: var(--blue); transform: translateX(-50%); }
.down::after { content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); border-top: 1.8mm solid var(--blue); border-left: 1.2mm solid transparent; border-right: 1.2mm solid transparent; }
.down span { position: absolute; left: calc(50% + 2mm); top: 0.4mm; font-weight: bold; color: var(--blue); font-size: 6.8pt; }
.down.short { height: 4mm; }

/* Tables */
table { border-collapse: collapse; width: 100%; }
th, td { border: 0.25mm solid #fff; padding: 1mm 1.4mm; text-align: center; vertical-align: middle; }
.ties th { background: var(--blue); color: #fff; font-size: 6.8pt; }
.ties td { background: var(--tint); }
.ties td.l { text-align: left; }
.ties td.ck { color: var(--blue); font-weight: bold; }
.ties td.no { color: #94a3b8; }
.mx th { background: var(--blue); color: #fff; font-size: 6.6pt; line-height: 1.2; }
.mx th.grp { background: var(--red); }
.mx td.d { background: var(--tint2); color: var(--blue); font-weight: bold; text-align: left; white-space: nowrap; }
.mx td.R { background: var(--blue); color: #fff; font-weight: bold; }
.mx td.N { background: var(--tint); color: var(--blue); }
.mx .sep { border-left: 1.4mm solid #fff; }

/* Notes */
.notes { columns: 2; column-gap: 6mm; font-size: 7.1pt; }
.notes .nb { break-inside: avoid; margin-bottom: 2.6mm; }
.notes h3 { margin: 0 0 0.8mm; font-size: 7.8pt; color: var(--blue); }
.notes p { margin: 0 0 1mm; }
.notes ul { margin: 0.4mm 0 0; padding-left: 3.6mm; }
.notes li { margin-bottom: 0.6mm; }
.cite { color: var(--muted); font-size: 6.3pt; font-style: italic; }

/* Notes: editorial style - blue rule above, small red capitals heading */
.callout { border-top: 0.6mm solid var(--blue); padding: 1.6mm 0 0; font-size: 7.2pt; }
.callout b:first-child { display: block; color: var(--red); text-transform: uppercase; letter-spacing: 0.5pt; font-size: 6.6pt; margin-bottom: 0.7mm; }
.callout b { color: var(--blue); }
/* "How we can help" contact band */
.cta { background: var(--blue); color: #fff; display: grid; grid-template-columns: 1fr auto; gap: 5mm; align-items: center; padding: 2.8mm 4mm; font-size: 7.2pt; line-height: 1.4; }
.cta .lab { display: block; text-transform: uppercase; letter-spacing: 0.5pt; font-size: 6.6pt; font-weight: bold; color: #fff; margin-bottom: 0.7mm; }
.cta .lab::after { content: ""; display: block; width: 9mm; height: 0.6mm; background: var(--red); margin-top: 0.9mm; }
.cta .ct { border-left: 0.3mm solid rgba(255,255,255,0.45); padding-left: 4mm; text-align: left; white-space: nowrap; font-size: 7pt; }
.cta .ct b { display: block; font-size: 8.4pt; }

/* Footer */
.spacer { flex: 1; }
.ftr { border-top: 0.35mm solid var(--line); padding-top: 1.8mm; font-size: 5.9pt; color: var(--muted); line-height: 1.35; }
.ftr .row { display: flex; justify-content: space-between; margin-top: 1mm; color: var(--blue); font-weight: bold; font-size: 6.4pt; }
.ftr .row span.red { color: var(--red); }

/* Draft banner hidden while Stephanie works through the review (28 Oct 2026). Delete this rule to show it again. */
.draft-strip { display: none !important; }

/* Inline [VERIFY] text tags hidden at Stephanie's request (28 Oct 2026); items remain on the README checklist. */
.vt { display: none; }

/* Narrow contact band: contact details stacked below the text */
.cta.stack { grid-template-columns: 1fr; gap: 2mm; }
.cta.stack .ct { border-left: none; padding-left: 0; border-top: 0.3mm solid rgba(255,255,255,0.45); padding-top: 1.8mm; white-space: normal; }
.cta.stack .ct b { display: inline; font-size: 7.6pt; }