@font-face {
  font-family: Archivo;
  src: url('assets/archivo.woff2') format('woff2');
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
}
@font-face {
  font-family: Plex;
  src: url('assets/plex.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
}
:root {
  color-scheme: light;
  --bg: #f8f3e7;
  --soft: #efe7d7;
  --paper: #fffbf2;
  --ink: #1b1915;
  --copy: #484138;
  --quiet: #5c5345;
  --line: #dcd1bc;
  --shadow: #32241126;
  --accent: #f46e45;
  --tone: #8a3018;
  --lime: #ffaf7e;
  --board: #282521;
  --board-line: #544a40;
  --mono: Plex, ui-monospace, SFMono-Regular, Consolas, monospace;
  --type: Archivo, Arial, sans-serif;
  --header: 64px;
}
:root[data-theme=dark] {
  color-scheme: dark;
  --bg: #211f1b;
  --soft: #2c2822;
  --paper: #332e26;
  --ink: #fff2dc;
  --copy: #e6d8c0;
  --quiet: #c5b6a1;
  --line: #51473b;
  --shadow: #0006;
  --accent: #ff966a;
  --tone: #ffad8b;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: clip;
  background: var(--bg);
  color: var(--ink);
  font: 400 16px/1.6 var(--type);
}
p, h1, h2, h3, ul, figure, pre { margin: 0; }
ul { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
button { font: inherit; cursor: pointer; }
a, button { touch-action: manipulation; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--tone);
  outline-offset: 4px;
}
::selection { background: var(--lime); color: #282521; }
section[id], article[id] { scroll-margin-top: var(--header); }
.wrap { width: min(1120px, calc(100% - 100px)); margin-inline: auto; }
.skip {
  position: fixed;
  top: 12px;
  left: 14px;
  z-index: 20;
  padding: 9px 14px;
  transform: translateY(-180%);
  background: var(--ink);
  color: var(--bg);
}
.skip:focus { transform: none; }
.mono { font: 500 11px/1.5 var(--mono); letter-spacing: .12em; }

.bar {
  position: fixed;
  inset: 0 0 auto;
  z-index: 10;
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: var(--header);
  padding: 0 max(25px, calc((100vw - 1120px) / 2));
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 91%, transparent);
  backdrop-filter: blur(14px);
}
.logo { color: var(--ink); font-size: 16px; font-weight: 820; letter-spacing: -.04em; white-space: nowrap; }
.bar nav a, .resume-nav {
  font: 500 12px/1.2 var(--mono);
  white-space: nowrap;
}
.resume-nav span { color: var(--tone); margin-inline: 2px; }
.bar nav { display: flex; gap: clamp(14px, 2.1vw, 27px); margin-left: auto; }
.bar nav a { color: var(--copy); padding: 20px 0; }
.bar nav a:hover, .bar nav a[aria-current], .resume-nav:hover { color: var(--tone); }
.bar-tools { display: flex; align-items: center; gap: 14px; }
.resume-nav { color: var(--ink); border: 1px solid var(--line); padding: 8px 10px; border-radius: 3px; }
.toggle {
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink);
}
.theme { width: 45px; height: 26px; border-radius: 999px; padding: 3px; }
.theme span {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--accent);
  transform: translateX(18px);
  transition: transform .2s;
}
.theme[aria-pressed=true] span { transform: none; }
.menu { display: none; }
.reading-progress {
  position: fixed;
  inset: var(--header) 0 auto;
  height: 2px;
  pointer-events: none;
  z-index: 11;
}
.reading-progress span {
  display: block;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left;
  background: var(--accent);
}

.hero { padding: calc(var(--header) + 29px) 0 clamp(43px, 6vw, 73px); }
.hero-grid {
  display: grid;
  grid-template-columns: 1.52fr 1fr;
  gap: clamp(23px, 6vw, 82px);
  align-items: end;
  padding: 17px 0 clamp(28px, 4vw, 49px);
}
.hero h1 {
  font-size: clamp(75px, 10.9vw, 151px);
  font-weight: 890;
  font-stretch: 102%;
  font-variation-settings: "wdth" 102;
  line-height: .83;
  letter-spacing: -.065em;
  padding-bottom: .13em;
}
.hero h1 span {
  background: linear-gradient(transparent 72%, var(--accent) 72% 92%, transparent 92%);
  padding: 0 .06em 0 .01em;
}
.hero-copy { max-width: 27rem; padding-bottom: 13px; }
.hero-copy > p:not(.eyebrow, .availability) {
  color: var(--ink);
  font: 400 clamp(20px, 2.55vw, 35px)/1.24 Georgia, serif;
  max-width: 21ch;
  text-wrap: pretty;
}
.availability {
  display: flex;
  align-items: baseline;
  gap: 8px;
  max-width: 34ch;
  margin-top: 18px;
  color: var(--quiet);
  font: 500 11px/1.55 var(--mono);
}
.availability i, .patch-head i, .landing i, .visual-label i {
  display: inline-block;
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: var(--accent);
}
.actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 24px; }
.btn, .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  min-height: 43px;
  padding: 9px 16px;
  border: 1px solid var(--line);
  border-radius: 2px;
  font-size: 14px;
  font-weight: 720;
}
.btn:hover, .button:hover { border-color: var(--tone); }
.btn.primary { background: var(--accent); color: #1b1915; border-color: var(--accent); }
.btn.ghost { background: var(--paper); }

.lead-story {
  display: grid;
  grid-template-columns: 1.03fr 1fr;
  grid-template-areas: "visual story";
  align-items: start;
  gap: clamp(26px, 6vw, 76px);
  padding-top: 27px;
  border-top: 1px solid var(--line);
}
.story-copy { grid-area: story; }
.story-visual { grid-area: visual; min-width: 0; }
.story-visual .inventory-art {
  border-radius: 6px;
  border-color: #4a4b3e;
  background: #242620;
  box-shadow: 0 10px 27px var(--shadow);
}
.story-visual .inventory-console { min-height: 0; padding: 18px 19px; }
.story-visual .inventory-console pre {
  background: #191c16;
  border-color: #8d9779;
  color: #e2ecd6;
  padding-block: 9px;
}
.story-visual .inventory-console pre b { color: #bce7a7; font-weight: 500; }
.story-visual .inv-question { margin: 11px 0 9px; }
.query-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  min-height: 55px;
  padding: 9px 13px;
  border-top: 1px solid #50544a;
  color: #d0d8c7;
  font: 500 9px/1.4 var(--mono);
}
.query-controls button {
  min-height: 35px;
  padding: 5px 8px;
  flex: 0 0 auto;
  border: 1px solid #77816d;
  border-radius: 3px;
  background: #30372c;
  color: #eff4eb;
  font: 500 11px/1.4 var(--mono);
}
.query-controls button:hover { background: #414a3c; }
.query-controls button:focus-visible { outline-color: #c1e5a7; }
.query-controls button span { margin-left: 3px; color: #c1e5a7; }
.query-controls [role=status] { text-align: right; }
.story-caption {
  margin-top: 8px;
  color: var(--quiet);
  font: 500 10px/1.5 var(--mono);
}
.story-caption span { color: var(--tone); margin-right: 4px; }
.story-meta {
  color: var(--quiet);
  font: 500 10px/1.5 var(--mono);
  text-transform: uppercase;
  letter-spacing: .07em;
}
.story-meta span {
  display: inline-block;
  padding: 2px 5px;
  border: 1px solid var(--line);
  margin-right: 4px;
  color: var(--tone);
}
.story-meta b { margin-inline: 1px; color: var(--tone); }
.story-copy h2 {
  margin: 11px 0 12px;
  font-size: clamp(38px, 4.7vw, 62px);
  line-height: 1;
  letter-spacing: -.05em;
}
.story-copy h2 em {
  padding-inline: .025em .055em;
  background: linear-gradient(transparent 69%, color-mix(in srgb, var(--accent) 75%, transparent) 69% 91%, transparent 91%);
  font-style: normal;
}
.story-copy > p:not(.story-meta), .story-details p {
  max-width: 55ch;
  color: var(--copy);
  font: 400 16px/1.57 Georgia, serif;
}
.story-details { margin-top: 13px; }
.story-details summary {
  display: inline-block;
  border-bottom: 1px solid var(--line);
  padding-bottom: 3px;
  color: var(--tone);
  cursor: pointer;
  font: 500 12px/1.5 var(--mono);
}
.story-details summary::-webkit-details-marker { display: none; }
.story-details summary:hover { border-color: var(--tone); }
.story-details summary:focus-visible { outline: 2px solid var(--tone); outline-offset: 4px; }
.story-details[open] summary span { display: inline-block; transform: rotate(180deg); }
.story-details p { margin-top: 9px; }

.mentor-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(25px, 7vw, 90px);
  align-items: center;
}
.mentorship {
  background: var(--soft);
  border-block: 1px solid var(--line);
}
.mentor-copy h2 {
  max-width: 16ch;
  font-size: clamp(37px, 4.6vw, 61px);
  line-height: 1.02;
  text-wrap: balance;
}
.mentor-copy .lead { max-width: 47ch; }
.robot-note {
  display: grid;
  grid-template-columns: clamp(66px, 8vw, 100px) 1fr;
  gap: 11px;
  align-items: center;
  max-width: 420px;
  margin-top: 22px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--paper);
}
.robot-note:hover { border-color: var(--tone); }
.robot-note img { width: 100%; height: auto; aspect-ratio: 1.25; object-fit: cover; border-radius: 2px; }
.robot-note small, .robot-note strong, .robot-note > span > span { display: block; }
.robot-note small { color: var(--tone); font: 500 8px/1.4 var(--mono); letter-spacing: .06em; }
.robot-note strong { margin: 3px 0 1px; color: var(--ink); font-size: 16px; }
.robot-note strong span { color: var(--tone); }
.robot-note > span > span { color: var(--copy); font-size: 12px; line-height: 1.42; }
.puzzle-sheet {
  position: relative;
  max-width: 500px;
  padding: clamp(14px, 2vw, 23px);
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--paper);
  box-shadow: 0 7px 20px var(--shadow);
  scroll-margin-top: calc(var(--header) + 10px);
}
.puzzle-header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 8px;
  color: var(--tone);
  font: 500 9px/1.4 var(--mono);
  letter-spacing: .07em;
}
.puzzle-sheet h3 {
  margin-top: 12px;
  font-size: clamp(23px, 3.2vw, 39px);
  line-height: 1.02;
  letter-spacing: -.041em;
}
#puzzle-instructions { margin: 8px 0 13px; color: var(--copy); font-size: 14px; line-height: 1.45; }
.puzzle-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 3px;
  width: 100%;
  background: var(--line);
  padding: 3px;
}
.puzzle-grid span {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 29px;
  height: clamp(29px, 3vw, 37px);
  background: var(--paper);
  color: var(--ink);
  font: 500 13px/1 var(--mono);
}
.puzzle-grid .start, .puzzle-grid .finish { font-weight: 700; background: var(--soft); }
.puzzle-grid .finish { outline: 1px dashed var(--tone); outline-offset: -4px; }
.puzzle-grid .obstacle {
  background: repeating-linear-gradient(135deg, var(--soft) 0 5px, var(--line) 5px 6px);
  color: var(--tone);
  font-size: 23px;
}
.puzzle-grid .visited { background: color-mix(in srgb, var(--accent) 22%, var(--paper)); }
.puzzle-grid .robot { font-size: 0; background: var(--accent); color: #1b1915; }
.puzzle-grid .robot::before {
  content: '';
  display: block;
  width: 19px;
  height: 15px;
  border: 2px solid currentColor;
  border-radius: 4px;
  background: radial-gradient(circle at 30% 45%, currentColor 0 1.4px, transparent 1.9px),
              radial-gradient(circle at 70% 45%, currentColor 0 1.4px, transparent 1.9px);
}
.puzzle-controls { display: flex; gap: 6px; margin-top: 11px; }
.puzzle-controls button {
  min-width: 44px;
  min-height: 44px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: var(--bg);
  color: var(--ink);
  font: 500 16px/1 var(--mono);
}
.puzzle-controls button:hover { border-color: var(--tone); }
.puzzle-controls #puzzle-reset { margin-left: auto; padding-inline: 8px; font-size: 11px; }
.puzzle-status { margin-top: 9px; min-height: 2.8em; color: var(--tone); font: 500 11px/1.4 var(--mono); }
.puzzle-credit { color: var(--quiet); font: 500 9px/1.4 var(--mono); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.adder {
  min-width: 0;
  background: var(--board);
  color: #f5e9d4;
  border: 1px solid var(--board-line);
  border-radius: 6px;
  box-shadow: 0 18px 48px var(--shadow);
  overflow: hidden;
}
.patch-head {
  display: flex;
  justify-content: space-between;
  gap: 11px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--board-line);
  color: #f5e9d4;
  font: 500 10px/1.5 var(--mono);
  letter-spacing: .09em;
}
.patch-head i { margin-right: 6px; }

.zone { padding: clamp(61px, 7.8vw, 108px) 0; border-bottom: 1px solid var(--line); }
.eyebrow {
  color: var(--tone);
  font: 500 11px/1.55 var(--mono);
  letter-spacing: .15em;
  text-transform: uppercase;
  margin: 0 0 12px;
}
.eyebrow.small { margin: 0 0 9px; letter-spacing: .09em; }
h2 { font-size: clamp(40px, 6vw, 80px); font-weight: 845; line-height: 1.02; letter-spacing: -.048em; }
.hollow { color: var(--tone); }
.lead { max-width: 56ch; margin-top: 17px; color: var(--copy); font-size: clamp(16px, 1.55vw, 18px); }
.exhibit {
  position: relative;
  display: grid;
  grid-template-columns: 1.06fr 1fr;
  align-items: center;
  gap: clamp(26px, 5vw, 68px);
  margin-top: clamp(47px, 7vw, 90px);
  padding-top: 20px;
  border-top: 1px solid var(--line);
  min-width: 0;
}
.zone .exhibit:first-of-type { margin-top: clamp(25px, 4vw, 47px); }
.exhibit.reverse { grid-template-columns: 1fr 1.06fr; }
.exhibit.reverse > :is(.visual, .print) { grid-column: 2; grid-row: 1; }
.exhibit.reverse .exhibit-copy { grid-column: 1; grid-row: 1; }
.exhibit-copy { min-width: 0; }
.exhibit h3 {
  font-size: clamp(31px, 4.2vw, 57px);
  font-weight: 830;
  line-height: .98;
  letter-spacing: -.045em;
  margin-bottom: 13px;
}
.exhibit-copy > p:not(.eyebrow) { color: var(--copy); margin: 0 0 10px; }
.tags, .status-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.tags li, .status-row span {
  padding: 3px 8px;
  border-radius: 4px;
  border: 1px solid var(--line);
  color: var(--tone);
  background: var(--paper);
  font: 500 10px/1.55 var(--mono);
}
.status-row span { background: var(--soft); font-size: 9px; letter-spacing: .06em; }
.text-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  padding: 0 0 4px;
  margin-top: 13px;
  color: var(--tone);
  font: 500 12px/1.5 var(--mono);
}
.text-action:hover { border-color: var(--tone); }
.inline-links { display: flex; flex-wrap: wrap; gap: 16px; }
.about-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  align-items: center;
  gap: clamp(27px, 6vw, 78px);
  margin-top: 25px;
}
.about-copy p { color: var(--copy); margin-bottom: 12px; font-size: 16.5px; }
.stats { display: flex; gap: 14px 25px; flex-wrap: wrap; margin-top: 22px; }
.stats div { display: grid; gap: 5px; }
.stats b { color: var(--tone); font-size: clamp(26px, 4vw, 47px); line-height: 1; }
.stats span { color: var(--quiet); font: 500 9px/1.5 var(--mono); letter-spacing: .09em; }
.print {
  border: 1px solid var(--line);
  background: var(--paper);
  padding: 9px;
  border-radius: 8px;
  box-shadow: 0 12px 23px var(--shadow);
}
.print img, .print .plate { width: 100%; height: auto; aspect-ratio: 1.5; object-fit: cover; border-radius: 4px; }
.print .plate { overflow: hidden; }
.print .plate svg { width: 100%; height: 100%; }
.print figcaption { padding: 9px 3px 3px; color: var(--quiet); font: 500 9px/1.45 var(--mono); letter-spacing: .08em; }
.visual{position:relative;min-width:0;overflow:hidden;background:#142235;border:1px solid #576579;border-radius:15px;box-shadow:0 18px 40px var(--shadow);color:#f1f2f6}
.visual-label,.visual-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 13px;font:500 9px/1.5 var(--mono);letter-spacing:.1em;color:#c8d3e2}
.visual-label{border-bottom:1px solid #ffffff25}
.visual-foot{border-top:1px solid #ffffff25}
.visual-label span:last-child,.visual-foot span:last-child{text-align:right}
.inventory-art{background:radial-gradient(ellipse at 65% 30%,#1c3b3c 0%,#15262f 72%)}
.inventory-console{min-height:238px;padding:25px clamp(14px,4vw,32px);font:500 clamp(12px,1.35vw,16px)/1.55 var(--mono)}
.inv-flow{display:flex;gap:7px;align-items:center;flex-wrap:wrap;font-size:10px;color:#bed2c7}
.inv-flow span{padding:3px 8px;border:1px solid #516d61;border-radius:3px}
.inv-flow .hot{background:#b8f1a9;color:#12321f;border-color:#b8f1a9}
.inv-flow b{font-weight:500;color:#8dc7a1}
.inv-question{margin:16px 0 12px;color:#f2f6f4}
.inv-question::before{content:'› ';color:#a7e9a1}
.inventory-console pre{overflow:auto;color:#b8f1a9;font:inherit;padding:12px 14px;border-left:2px solid #6aab78;background:#0b1b2370}
.inventory-console code{font:inherit}
.emp-art{background:#191427;border-color:#594b6b}
.emp-art img{width:100%;height:auto;aspect-ratio:1.88;object-fit:cover}
.timer-art{background:radial-gradient(ellipse at 34% 12%,#351815,#1b1418 79%);border-color:#6a4947}
.timer-main{padding:clamp(20px,5vw,42px) 18px;color:#ffa392}
.timer-main p,.timer-labels{font:500 10px/1.5 var(--mono);letter-spacing:.14em}
.timer-main strong{font:880 clamp(40px,7vw,91px)/1.08 var(--type);font-variant-numeric:tabular-nums;letter-spacing:-.055em;display:block;color:#ff684d;margin:8px 0 12px}
.timer-track{height:3px;background:#7d403b}
.timer-track span{display:block;height:100%;width:0;background:#ff7d5e}
.timer-labels{display:flex;justify-content:space-between;margin-top:8px}
.vision-art{background:#24302d;border-color:#58655c}
.vision-art svg{width:100%;height:auto}
.vision-art #vision-mask{transition:opacity .3s}
.vision-art.raw #vision-mask{opacity:0}
.notes-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
.note-controls{display:none;gap:7px}
.enhanced .note-controls{display:flex}
.note-controls button{width:43px;height:43px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--tone);font:500 17px var(--mono)}
.note-controls button:hover{border-color:var(--tone)}
.note-rail{display:flex;gap:29px;margin-top:19px;padding:22px 12px 31px;overflow:auto;scrollbar-color:var(--accent) var(--soft);scroll-snap-type:x proximity;overscroll-behavior-inline:contain}
.note-rail figure{flex:0 0 clamp(235px,32vw,333px);min-width:0;scroll-snap-align:start;scroll-margin-left:12px}
.note-rail img,.note-card{aspect-ratio:1.55;object-fit:cover}
.note-card{display:flex;flex-direction:column;justify-content:space-between;padding:17px;border-radius:3px;color:#d4f6db;background:#192e31;font-family:var(--mono)}
.note-card span{font-size:9px;letter-spacing:.12em}
.note-card b{font-size:clamp(16px,2.3vw,24px);font-weight:500;line-height:1.17}
.challenge-note{background:#dbe8fd;color:#1d3c71}
.timer-note{background:#2d181a;color:#ffa18c}
.role-group,.wins{margin-top:30px}
.group-title{display:flex;gap:15px;align-items:center;color:var(--tone);font:500 11px/1.5 var(--mono);letter-spacing:.16em;margin:24px 0 0}
.group-title span{height:1px;flex:1;background:var(--line)}
.role,.win{display:grid;grid-template-columns:minmax(146px,23%) 1fr auto;gap:clamp(13px,2.6vw,35px);align-items:baseline;border-bottom:1px solid var(--line);padding:20px 0}
.role-title,.role time,.win .mono,.badge{color:var(--quiet);font:500 10px/1.5 var(--mono);letter-spacing:.09em}
.role-title{color:var(--tone)}
.role-title span{display:block;color:var(--quiet);margin-top:3px}
.role h3,.win h3{font-size:clamp(18px,2.4vw,28px);font-weight:800;line-height:1.12;letter-spacing:-.015em}
.role div p,.win div p{font-size:15px;color:var(--copy);margin-top:6px}
.wins{border-top:1px solid var(--line)}
.badge{color:var(--tone);border:1px solid color-mix(in srgb,var(--accent) 51%,var(--line));border-radius:4px;background:color-mix(in srgb,var(--accent) 9%,var(--paper));padding:5px 8px;white-space:nowrap}
.resume-page{width:min(842px,calc(100% - 44px));margin:0 auto;padding:37px 0 66px}
.resume-page .return{display:inline-block;margin-bottom:23px;color:var(--tone);font:500 12px/1.5 var(--mono)}
.resume-page .return:hover{text-decoration:underline}
.resume-page .paper{padding:clamp(20px,5vw,48px);background:var(--paper);border:1px solid var(--line);border-radius:7px;box-shadow:0 15px 40px var(--shadow)}
.resume-page h1{font-size:clamp(33px,6vw,59px);font-weight:900;line-height:1.02;letter-spacing:-.04em}
.resume-page .lead{margin:7px 0 13px;font-size:15px}
.resume-page .links{display:flex;gap:13px;flex-wrap:wrap;color:var(--tone);font:500 12px var(--mono)}
.resume-page .paper a{color:var(--tone);text-decoration:underline;text-underline-offset:3px}
.resume-page h2{border-bottom:1px solid var(--line);padding-bottom:7px;margin:24px 0 9px;font-size:20px;letter-spacing:0}
.resume-page h3{font-size:15px;line-height:1.2;font-variation-settings:"wdth" 100}
.resume-page article{margin-bottom:10px;break-inside:avoid}
.resume-page article p,.resume-page section>p{font-size:14px;color:var(--copy);margin-top:3px}
.print-button{display:none;float:right;background:var(--paper);color:var(--tone)}
.print-button.ready{display:inline-flex}
@media(max-width:530px){.print-button{float:none;margin-bottom:12px}
}
@media print{@page{margin:13mm}
html{color-scheme:light}
body,.resume-page .paper{background:#fff;color:#111}
.resume-page{width:100%;padding:0}
.resume-page .paper{border:0;padding:0;box-shadow:none}
.resume-page .paper a,.resume-page article p,.resume-page section>p,.resume-page .lead{color:#111}
.resume-page h1{font-size:30px}
.resume-page h2{margin-top:14px;font-size:16px}
.resume-page h3,.resume-page article p,.resume-page section>p{font-size:11px}
.resume-page .return,.resume-page .print-button{display:none!important}
}
.bench {
  background: radial-gradient(ellipse at 79% 39%, color-mix(in srgb, var(--accent) 17%, transparent), transparent 63%), var(--soft);
}
.bench-grid { display: grid; grid-template-columns: 1.06fr .94fr; align-items: center; gap: clamp(30px, 7vw, 86px); }
.bench-note { margin-top: 16px; color: var(--tone); font: 500 10px/1.6 var(--mono); letter-spacing: .08em; }
.bench-note span { margin-inline: 4px; }
.adder-body { display: grid; gap: 10px; padding: 18px 16px 15px; }
.adder-input, .adder-output {
  display: grid;
  grid-template-columns: 25px 47px 47px 1fr;
  align-items: center;
  gap: 8px;
  color: #e0d3f2;
  font: 500 14px/1.25 var(--mono);
}
.adder-input button {
  min-height: 43px;
  border: 1px solid #79668f;
  border-radius: 5px;
  background: #352a47;
  color: #efe8f8;
}
.adder-input button[aria-pressed=true] { background: var(--lime); border-color: var(--lime); color: #282521; }
.adder-input button:focus-visible { outline-color: var(--lime); }
.adder-input small, .adder-output small { color: #d1c2e4; font-size: 10px; margin-left: 7px; white-space: nowrap; }
.adder-output { margin-top: 4px; padding-top: 11px; border-top: 1px solid var(--board-line); }
.adder-output output { grid-column: 2 / -1; color: var(--lime); font-size: 27px; letter-spacing: .14em; }
.adder-body > p { margin-top: 5px; color: #ddd1ee; font: 500 10px/1.6 var(--mono); }
.contact { text-align: center; }
.contact .lead { margin-inline: auto; }
.contact .actions { justify-content: center; }
.landing { margin-top: 27px; color: var(--tone); }
.landing i { margin: 0 5px 1px 0; }
.footer {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 18px;
  padding: 17px 30px;
  color: var(--quiet);
  font: 500 9px/1.6 var(--mono);
  letter-spacing: .07em;
}
.footer a:hover { color: var(--tone); text-decoration: underline; }

@media (max-width: 1000px) {
  .wrap { width: calc(100% - 70px); }
  .bar { padding-inline: 20px; gap: 15px; }
  .bar nav { gap: 13px; }
  .bar-tools { gap: 10px; }
  .hero h1 { font-size: clamp(68px, 11vw, 114px); }
}
@media (max-width: 810px) {
  :root { --header: 57px; }
  .wrap { width: calc(100% - 50px); }
  .bar nav {
    position: absolute;
    inset: var(--header) 0 auto;
    display: none;
    grid-template-columns: 1fr 1fr;
    gap: 2px 10px;
    padding: 7px 18px 12px;
    border-bottom: 1px solid var(--line);
    background: var(--paper);
  }
  .bar nav.open { display: grid; }
  .bar nav a { padding: 10px 0; }
  .bar-tools { margin-left: auto; }
  .menu { display: grid; gap: 4px; place-content: center; width: 33px; height: 30px; border-radius: 5px; }
  .menu span { display: block; width: 14px; height: 1px; background: currentColor; }
  html:not(.enhanced) .bar { position: relative; flex-wrap: wrap; }
  html:not(.enhanced) .bar nav { position: static; display: flex; order: 3; flex-wrap: wrap; width: 100%; }
  html:not(.enhanced) .menu, html:not(.enhanced) .theme { display: none; }
}
@media (max-width: 660px) {
  .wrap { width: calc(100% - 36px); }
  .bar { padding-inline: 13px; }
  .bar-tools { gap: 7px; }
  .logo { font-size: 14px; }
  .resume-nav { font-size: 10px; }
  .hero { padding: calc(var(--header) + 12px) 0 34px; }
  .hero-grid, .lead-story, .mentor-grid { grid-template-columns: 1fr; gap: 23px; }
  .hero-grid { padding: 16px 0 26px; }
  .hero-copy { padding: 0; }
  .lead-story { grid-template-areas: "story" "visual"; padding-top: 20px; }
  .story-break { display: none; }
  .puzzle-sheet { padding: 13px; }
  .hero h1 { font-size: clamp(55px, 17vw, 103px); }
  .actions { margin-top: 17px; }
  .patch-head { font-size: 9px; padding-inline: 10px; }
  .zone { padding-block: 57px; }
  .exhibit, .exhibit.reverse, .about-grid, .bench-grid { grid-template-columns: 1fr; gap: 19px; }
  .exhibit.reverse > :is(.visual, .print), .exhibit.reverse .exhibit-copy { grid-column: auto; grid-row: auto; }
  .exhibit-copy { grid-row: 1; }
  .exhibit.reverse .exhibit-copy { grid-row: 1; }
  .role, .win { grid-template-columns: 1fr; gap: 5px; padding: 15px 0; }
  .role time, .win .badge { justify-self: start; }
  .visual-label, .visual-foot { font-size: 8px; }
  .footer { padding-inline: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}