:root{
  --flame-1:#ffd36b;--flame-2:#ff8a1e;--flame-3:#dd5800;--flame-4:#c5302e;
  --accent:#c4451f;            /* readable burnt-orange for links/dates */
  --ink:#1b1e27;
  --ink-strong:#0c0e14;
  --muted:#6b6f7e;
  --line:rgba(20,24,40,.13);
  --line-soft:rgba(20,24,40,.08);
  --paper:#ffffff;
  --sidebar:#f6f1ea;
  --page-bg:#e7e4dd;           /* desk behind the sheet */
  --chip-bg:#ffffff;           /* chips & ghost toolbar buttons */
  --card-bg:#fffdfb;           /* project cards */
  --portrait-border:#ffffff;
  --body-text:#33384a;         /* summary paragraph */
  --list-text:#3a3f51;         /* bullet text */
  --flame-grad:linear-gradient(110deg,var(--flame-1),var(--flame-2) 40%,var(--flame-3) 72%,var(--flame-4));
}

/* ---------- DARK THEME ---------- */
:root[data-theme="dark"]{
  --accent:#ff8a4c;            /* brighter burnt-orange for contrast on dark */
  --ink:#dfe2ec;
  --ink-strong:#f4f6fb;
  --muted:#969cad;
  --line:rgba(255,255,255,.16);
  --line-soft:rgba(255,255,255,.09);
  --paper:#171a23;
  --sidebar:#1e2230;
  --page-bg:#0d0f15;
  --chip-bg:#222636;
  --card-bg:#1d2130;
  --portrait-border:#2a2f40;
  --body-text:#c3c8d6;
  --list-text:#b6bccb;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--page-bg)}
body{
  font-family:"Space Grotesk",system-ui,sans-serif;
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  padding:34px 16px 70px;
  display:flex;flex-direction:column;align-items:center;gap:20px;
  transition:background-color .25s ease,color .25s ease;
}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace}

/* ---------- TOOLBAR (screen only) ---------- */
.toolbar{
  width:210mm;max-width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;
  font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--muted);
}
.toolbar .who{display:flex;align-items:center;gap:9px;letter-spacing:.18em;text-transform:uppercase}
.toolbar .spark{
  width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle,var(--flame-1),var(--flame-3));
  box-shadow:0 0 9px var(--flame-2);
}
.toolbar .acts{display:flex;align-items:center;gap:9px}
.tbtn{
  font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.05em;
  color:var(--ink);background:var(--chip-bg);border:1px solid var(--line);border-radius:999px;
  padding:8px 15px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:7px;
  transition:border-color .2s,transform .15s,box-shadow .2s,background-color .25s,color .25s;
}
.tbtn:hover{border-color:var(--flame-3);transform:translateY(-1px);box-shadow:0 4px 14px rgba(221,88,0,.16)}
.tbtn.primary{color:#fff;border:none;background:var(--flame-grad);box-shadow:0 5px 18px rgba(221,88,0,.32)}
.tbtn svg{width:14px;height:14px}

/* ---------- PAGE ---------- */
.page{
  width:210mm;min-height:297mm;background:var(--paper);
  box-shadow:0 22px 60px rgba(20,16,10,.22);
  position:relative;overflow:hidden;
}
.sheet{
  display:grid;grid-template-columns:69mm 1fr;
  min-height:297mm;transform-origin:top left;
}
.page::before{ /* top flame edge */
  content:"";position:absolute;top:0;left:0;right:0;height:5px;z-index:5;
  background:var(--flame-grad);
}

/* ---------- SIDEBAR ---------- */
.side{
  background:var(--sidebar);
  padding:10mm 8.5mm 7mm;
  display:flex;flex-direction:column;gap:4.5mm;
  border-right:1px solid var(--line-soft);
}
.portrait-wrap{align-self:center;position:relative;width:42mm;height:42mm;margin-top:1mm}
.ring{
  position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from 210deg,var(--flame-4),var(--flame-3),var(--flame-2),var(--flame-1),#fff5e0,var(--flame-3),var(--flame-4));
  filter:drop-shadow(0 3px 10px rgba(221,88,0,.3));
}
.ring::after{content:"";position:absolute;inset:2.1mm;border-radius:50%;background:var(--sidebar)}
.portrait{position:absolute;inset:2.9mm;border-radius:50%;overflow:hidden;z-index:2;border:1.5px solid var(--portrait-border)}
.portrait img{width:100%;height:100%;object-fit:cover;display:block}

.side-name{text-align:center;margin-top:-1mm}
.side-name .nm{font-size:20px;font-weight:700;line-height:1.12;letter-spacing:-.01em;color:var(--ink-strong)}
.side-name .nm .fn{
  background:var(--flame-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.side-name .rl{
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--accent);margin-top:6px;
}

.block{display:flex;flex-direction:column;gap:3mm}
.s-head{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-strong);font-weight:700;display:flex;align-items:center;gap:8px;
}
.s-head::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--flame-grad);flex:0 0 auto}
.s-head::after{content:"";flex:1;height:1px;background:var(--line)}

.contact{display:flex;flex-direction:column;gap:2.6mm;font-size:11px}
.contact a,.contact span{color:var(--ink);text-decoration:none;display:flex;align-items:flex-start;gap:7px;line-height:1.35;word-break:break-word}
.contact a:hover{color:var(--accent)}
.contact .ci{width:14px;height:14px;flex:0 0 auto;margin-top:1px;color:var(--accent)}
.contact .ci svg{width:100%;height:100%;display:block;fill:currentColor}

.skill-group{margin-bottom:2.4mm}
.skill-group:last-child{margin-bottom:0}
.skill-group .sg-label{
  font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent);margin-bottom:1.6mm;
}
.chips{display:flex;flex-wrap:wrap;gap:1.5mm}
.chip{
  font-size:10.5px;line-height:1;padding:4.5px 8px;border-radius:5px;
  background:var(--chip-bg);border:1px solid var(--line);color:var(--ink);
}

.lang-row{display:flex;flex-direction:column;gap:2.2mm}
.lang-item{display:flex;flex-direction:column;gap:1.5mm}
.lang-item .lt{display:flex;justify-content:space-between;font-size:11.5px}
.lang-item .lt b{font-weight:600}
.lang-item .lt span{color:var(--muted);font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.04em;text-transform:uppercase}
.bar{height:3px;border-radius:3px;background:var(--line)}
.bar i{display:block;height:100%;border-radius:3px;background:var(--flame-grad)}

.soft{display:flex;flex-wrap:wrap;gap:1.5mm}

/* ---------- MAIN ---------- */
.main{padding:12mm 12mm 9mm 11mm;display:flex;flex-direction:column;gap:5.5mm}
.summary{margin-bottom:.5mm}
.summary .label{
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--accent);margin-bottom:3.5mm;
}
.summary p{font-size:12px;line-height:1.5;color:var(--body-text);max-width:62ch;text-wrap:pretty}

.m-head{
  font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-strong);font-weight:700;display:flex;align-items:center;gap:10px;margin-bottom:3.6mm;
}
.m-head::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--flame-grad);flex:0 0 auto;transform:rotate(45deg)}
.m-head::after{content:"";flex:1;height:1px;background:var(--line)}

.timeline{display:flex;flex-direction:column;gap:4.2mm;position:relative}
.entry{position:relative;padding-left:8mm}
.entry::before{ /* node */
  content:"";position:absolute;left:1.2mm;top:1.8mm;width:7px;height:7px;border-radius:50%;
  background:var(--flame-3);box-shadow:0 0 0 3px rgba(221,88,0,.14);
}
.entry::after{ /* line */
  content:"";position:absolute;left:calc(1.2mm + 3px);top:5mm;bottom:-5mm;width:1.5px;
  background:var(--line);transform:translateX(-50%);
}
.timeline .entry:last-child::after{display:none}
.entry-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.entry .role{font-size:13px;font-weight:600;color:var(--ink-strong);line-height:1.25}
.entry .date{
  font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.04em;color:var(--accent);
  white-space:nowrap;flex:0 0 auto;
}
.entry .org{font-size:11px;color:var(--muted);margin-top:1.2mm;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.entry .org .dot{width:3px;height:3px;border-radius:50%;background:var(--muted);opacity:.6}
.entry ul{list-style:none;margin-top:2.2mm;display:flex;flex-direction:column;gap:1.2mm}
.entry li{position:relative;padding-left:11px;font-size:11.5px;line-height:1.45;color:var(--list-text)}
.entry li::before{content:"";position:absolute;left:0;top:6.5px;width:4px;height:4px;border-radius:1px;background:var(--flame-3);transform:rotate(45deg)}

.two{display:grid;grid-template-columns:1fr 1fr;gap:6mm}
.edu-item{padding-left:8mm;position:relative}
.edu-item::before{content:"";position:absolute;left:1.2mm;top:1.6mm;width:7px;height:7px;border-radius:50%;background:var(--paper);border:2px solid var(--flame-3)}
.edu-item .deg{font-size:12px;font-weight:600;color:var(--ink-strong);line-height:1.25}
.edu-item .sch{font-size:10.5px;color:var(--muted);margin-top:1.2mm}
.edu-item .date{font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.03em;color:var(--accent);margin-top:1.4mm;display:block}

.proj{display:flex;flex-direction:column;gap:3.5mm}
.proj-item{border:1px solid var(--line);border-radius:9px;padding:4mm 4.5mm;background:var(--card-bg);position:relative;overflow:hidden}
.proj-item::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--flame-grad)}
.proj-item .pt{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.proj-item .pname{font-size:12.5px;font-weight:600;color:var(--ink-strong)}
.proj-item .pmeta{font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.03em;color:var(--accent)}
.proj-item .psub{font-size:10.5px;color:var(--muted);margin-top:.8mm}
.proj-item ul{list-style:none;margin-top:2.4mm;display:flex;flex-wrap:wrap;gap:1.5mm 4mm}
.proj-item li{position:relative;padding-left:10px;font-size:11px;line-height:1.4;color:var(--list-text)}
.proj-item li::before{content:"";position:absolute;left:0;top:6px;width:3.5px;height:3.5px;border-radius:50%;background:var(--flame-3)}

/* ---------- PRINT ---------- */
@page{size:A4;margin:0}
@media print{
  /* always print the light design on white paper, even in dark mode */
  :root,:root[data-theme="dark"]{
    --accent:#c4451f;--ink:#1b1e27;--ink-strong:#0c0e14;--muted:#6b6f7e;
    --line:rgba(20,24,40,.13);--line-soft:rgba(20,24,40,.08);
    --paper:#ffffff;--sidebar:#f6f1ea;--page-bg:#ffffff;
    --chip-bg:#ffffff;--card-bg:#fffdfb;--portrait-border:#ffffff;
    --body-text:#33384a;--list-text:#3a3f51;
  }
  html,body{background:#fff}
  body{padding:0;margin:0;display:block}
  .toolbar{display:none !important}
  /* .page = fixed-height clipper -> guarantees a single A4 page (no phantom 2nd page) */
  .page{box-shadow:none;width:210mm;height:296mm;min-height:0;margin:0;overflow:hidden}
  /* .sheet holds the design and is scaled down by JS only if needed, so nothing is ever clipped */
  .sheet{min-height:296mm}
  *{-webkit-print-color-adjust:exact !important;print-color-adjust:exact !important}
}
@media screen and (max-width:840px){
  .page{width:100%}
  .sheet{grid-template-columns:1fr}
  .side{border-right:none;border-bottom:1px solid var(--line-soft)}
  .toolbar{width:100%}
}