:root {
  --page-width: 210mm;
  --page-min-height: 297mm;

  --sidebar-width: 32%;
  --content-width: 68%;

  --color-sidebar-bg: #64706c;
  --color-sidebar-text: #ffffff;
  --color-sidebar-muted: #e6ece8;
  --color-content-bg: #ffffff;
  --color-text: #263238;
  --color-muted: #66757f;
  --color-heading: #111820;
  --color-rule: #d8dee3;

  --font-family: "Aptos", "Segoe UI", "Helvetica Neue", Arial, sans-serif;

  --font-size-base: 9.4pt;
  --font-size-small: 8.2pt;
  --font-size-xs: 7.7pt;

  --line-height-base: 1.32;
  --content-padding: 10mm;
  --sidebar-padding: 8mm;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  background: #e5e7eb;
  color: var(--color-text);
  font-family: var(--font-family);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
}

body {
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.page {
  display: flex;
  width: var(--page-width);
  min-height: var(--page-min-height);
  margin: 0 auto;
  background: var(--color-content-bg);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
}

.sidebar {
  width: var(--sidebar-width);
  padding: var(--sidebar-padding);
  background: var(--color-sidebar-bg);
  color: var(--color-sidebar-text);
  border-radius: 0 var(--radius) var(--radius) 0;
  overflow: hidden;
}

.content {
  width: var(--content-width);
  padding: var(--content-padding);
}

.profile-block h1 {
  margin: 0 0 4mm;
  font-size: 19pt;
  line-height: 1.08;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.headline {
  margin: 0;
  color: var(--color-sidebar-muted);
  font-size: 10pt;
  line-height: 1.28;
}

.headline-block {
  display: inline-block;
  max-width: 100%;
}

.contact-block {
  margin-top: 7mm;
  font-size: var(--font-size-small);
  color: var(--color-sidebar-muted);
  overflow-wrap: anywhere;
}

.contact-block p {
  margin: 0 0 2.2mm;
}

.sidebar-section {
  margin-top: 7mm;
}

.sidebar-section h2 {
  margin: 0 0 2.5mm;
  padding-bottom: 1.5mm;
  border-bottom: 1px solid rgba(255, 255, 255, 0.28);
  color: var(--color-sidebar-text);
  font-size: 8.8pt;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sidebar-section ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.word-cloud {
  margin: 0;
  color: var(--color-sidebar-muted);
  font-size: var(--font-size-small);
  line-height: 1.45;
  text-align: justify;
  text-justify: inter-word;
}

.word-cloud span {
  display: inline;
}

.word-cloud-separator {
  margin: 0 0.35em;
}

.sidebar-section li {
  margin: 0 0 1.7mm;
  color: var(--color-sidebar-muted);
  font-size: var(--font-size-small);
  line-height: 1.25;
}

.section {
  margin: 0 0 7mm;
}

.section.simple-list,
.section.summary {
  break-inside: avoid;
  page-break-inside: avoid;
}

.section h2 {
  margin: 0 0 3.5mm;
  padding-bottom: 1.5mm;
  border-bottom: 1px solid var(--color-rule);
  color: var(--color-heading);
  font-size: 10.5pt;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.summary p {
  margin: 0 0 3mm;
}

.justified-text {
  text-align: justify;
  text-justify: inter-word;
}

.entry {
  margin: 0 0 6mm;
  break-inside: avoid;
  page-break-inside: avoid;
}

.entry-header {
  display: flex;
  justify-content: space-between;
  gap: 6mm;
  margin-bottom: 2mm;
}

.entry-header h3 {
  margin: 0 0 1mm;
  color: var(--color-heading);
  font-size: 11pt;
  line-height: 1.15;
}

.role {
  margin: 0;
  color: var(--color-muted);
  font-size: 9.2pt;
  font-weight: 700;
}

.meta {
  min-width: 34mm;
  text-align: right;
  color: var(--color-muted);
  font-size: var(--font-size-small);
  line-height: 1.22;
}

.meta p {
  margin: 0 0 1mm;
}

.intro {
  margin: 0 0 2.4mm;
  color: var(--color-text);
}

.entry ul,
.simple-list ul {
  margin: 0 0 2.6mm;
  padding-left: 4.4mm;
}

.entry li,
.simple-list li {
  margin: 0 0 1.5mm;
  padding-left: 0.8mm;
}

.tech-stack {
  margin: 0;
  color: var(--color-muted);
  font-size: var(--font-size-xs);
  line-height: 1.35;
}

.tech-stack strong {
  color: var(--color-text);
}

.links {
  margin-top: 2mm;
}

a {
  color: inherit;
  text-decoration: none;
}

.avoid-break {
  break-inside: avoid;
  page-break-inside: avoid;
}

.page-break-before {
  break-before: page;
  page-break-before: always;
}

@page {
  size: A4;
  margin: 0;
}

@media print {

  html,
  body {
    width: var(--page-width);
    min-height: var(--page-min-height);
    background: #ffffff;
  }

  html {
    position: relative;
  }

  html::before {
    content: "";
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: var(--sidebar-width);
    background: var(--color-sidebar-bg);
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .page {
    width: var(--page-width);
    min-height: var(--page-min-height);
    margin: 0;
    box-shadow: none;
    background: transparent;
    position: relative;
    z-index: 1;
  }

  .sidebar {
    background: transparent;
    border-radius: 0;
    overflow: visible;
    min-height: var(--page-min-height);
  }

  .sidebar-section h2 {
    border-bottom-color: rgba(255, 255, 255, 0.28);
  }
}

@media screen {
  body {
    padding: 16px;
  }
}

@page {
  size: A4;
  margin: 12mm 0;
}