:root {
  --paper: #e7e5dd;
  --panel: #f2f0e8;
  --ink: #171814;
  --muted: #6f7169;
  --line: rgba(23,24,20,.2);
  --orange: #ff5727;
  --green: #237a67;
  --red: #d93624;
  --mono: "Fragment Mono", monospace;
  --sans: "Archivo", sans-serif;
}
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: var(--paper); color: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { border: 0; color: inherit; font: inherit; cursor: pointer; }
::selection { background: var(--orange); color: #fff; }

.topbar {
  position: sticky; z-index: 30; top: 0;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  height: 78px; padding: 0 30px;
  border-bottom: 1px solid var(--line); background: rgba(242,240,232,.94);
  backdrop-filter: blur(14px);
}
.brand { display: flex; align-items: center; gap: 11px; width: max-content; }
.brand svg { width: 31px; fill: none; stroke: currentColor; stroke-width: 1.3; }
.brand svg path { stroke-width: 2; }
.brand strong, .brand span { display: block; }
.brand strong { font-size: 12px; }
.brand span { margin-top: 3px; color: var(--muted); font: 8px var(--mono); }
.live-read { display: grid; grid-template-columns: 8px auto auto; gap: 2px 9px; align-items: center; font: 9px var(--mono); }
.live-read i { width: 6px; height: 6px; border-radius: 50%; background: var(--orange); }
.live-read i.live { background: var(--green); }
.live-read i.offline { background: var(--red); }
.live-read span { color: var(--muted); }
.live-read strong { color: var(--orange); font-weight: 400; }
.live-read strong.live { color: var(--green); }
.live-read strong.offline { color: var(--red); }
.live-read b { grid-column: 2 / -1; font-weight: 400; text-align: center; }
.header-actions { display: flex; justify-self: end; gap: 8px; }
.proof-button, .tour-button, .system-link { padding: 11px 14px; border: 1px solid var(--ink); background: transparent; font: 9px var(--mono); }
.proof-button i { margin-left: 22px; color: var(--orange); font-style: normal; }
.tour-button { border-color: var(--line); }
.tour-button i { display: inline-grid; width: 16px; height: 16px; margin-left: 14px; place-items: center; border-radius: 50%; background: var(--ink); color: #fff; font-style: normal; }
.system-link { border-color: transparent; color: var(--muted); }
.system-link:hover { color: var(--orange); }

.workspace { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 345px; height: calc(100svh - 146px); min-height: 560px; }
.drawing { position: relative; overflow: hidden; border-right: 1px solid var(--line); }
.drawing-head { position: absolute; z-index: 4; top: 21px; right: 28px; left: 28px; display: flex; justify-content: space-between; pointer-events: none; }
.drawing-head div { display: flex; gap: 15px; align-items: center; }
.drawing-head span, .drawing-head strong, .drawing-head p, .trace-button { font: 8px var(--mono); font-weight: 400; }
.drawing-head span { color: var(--orange); }
.drawing-head strong, .drawing-head p { color: var(--muted); }
.trace-button { padding: 0; background: none; color: var(--muted); pointer-events: auto; }
.trace-button i { margin-left: 10px; color: var(--orange); font-style: normal; }
.trace-button:hover, .trace-button.running { color: var(--ink); }
.trace-button.running i { display: inline-block; animation: traceBlink .7s steps(1) infinite; }
.drawing-stage { width: 100%; height: 100%; cursor: grab; }
.drawing-stage.dragging { cursor: grabbing; }
#machineDrawing { width: 100%; height: 100%; transform-origin: center; transition: transform .25s ease; }

.datum { fill: var(--muted); font: 8px var(--mono); }
.datum path { fill: none; stroke: var(--ink); stroke-opacity: .14; stroke-width: 1; }
.part { cursor: pointer; transition: opacity .35s, transform .65s cubic-bezier(.2,.8,.2,1); transform-box: fill-box; transform-origin: center; }
.part:hover { filter: url(#shadow); }
.part:hover > :first-child { stroke: var(--orange); }
.part.selected { filter: url(#shadow); }
.part.selected > :first-child { stroke: var(--orange); stroke-width: 5; }
.part text { fill: var(--ink); font: 11px var(--mono); letter-spacing: .06em; }
.grill { fill: none; stroke: #777970; stroke-width: 2; opacity: .68; }
.screws { fill: #96978f; stroke: #11120f; stroke-width: 2; }
.fan-blades { fill: url(#fanShade); stroke: #151612; stroke-width: 2; transform-origin: center; }
.air-arrows { fill: none; stroke: var(--orange); stroke-width: 3; opacity: 0; }
.air-arrows path { marker-end: none; stroke-dasharray: 9 8; animation: flow 1s linear infinite; }
.signal-paths { fill: none; stroke: var(--orange); stroke-width: 4; stroke-dasharray: 8 10; opacity: 0; filter: url(#glow); }
.signal-paths path { animation: flow .8s linear infinite; }
@keyframes flow { to { stroke-dashoffset: -36; } }
@keyframes traceBlink { 50% { opacity: .15; } }
@keyframes componentPulse { 50% { opacity: .55; } }
body.simulating .part.selected { animation: componentPulse .75s ease-in-out infinite; }

.annotations { cursor: pointer; }
.annotations g { pointer-events: bounding-box; transition: opacity .25s; }
.annotations path { fill: none; stroke: var(--ink); stroke-width: 1.5; }
.annotations circle { fill: var(--panel); stroke: var(--orange); stroke-width: 2; }
.annotations text { fill: var(--ink); font: 10px var(--mono); }
.annotations text:nth-of-type(1) { font-size: 8px; }
.annotations g:hover circle, .annotations g.active circle { fill: var(--orange); }

body[data-mode="exploded"] .chassis { opacity: .2; }
body[data-mode="exploded"] .annotations { opacity: 0; pointer-events: none; }
body[data-mode="thermal"] .cover, body[data-mode="thermal"] .chassis { opacity: .13; pointer-events: none; }
body[data-mode="thermal"] .air-arrows, body[data-mode="thermal"] .heat-layer { opacity: .62; }
body[data-mode="signal"] .cover, body[data-mode="signal"] .chassis { opacity: .18; pointer-events: none; }
body[data-mode="signal"] .airflow { opacity: .12; pointer-events: none; }
body[data-mode="signal"] .signal-paths { opacity: 1; }
body[data-mode="signal"] .hashboards { filter: url(#glow); }
.signal-paths, .air-arrows, .heat-layer { pointer-events: none; }

.zoom-controls { position: absolute; right: 24px; bottom: 22px; display: flex; align-items: center; border: 1px solid var(--line); background: rgba(242,240,232,.9); }
.zoom-controls button { width: 36px; height: 34px; background: transparent; font-size: 18px; }
.zoom-controls span { width: 58px; text-align: center; font: 8px var(--mono); }

.inspector { padding: 29px 28px; background: var(--panel); overflow-y: auto; }
.inspector header { display: flex; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.inspector header span, .inspector header button { color: var(--muted); font: 8px var(--mono); }
.inspector header span { color: var(--orange); }
.inspector header button { padding: 0; background: none; }
.inspector h1 { margin: 42px 0 18px; font-size: 43px; font-variation-settings: "wdth" 82; font-weight: 450; letter-spacing: -.055em; line-height: .9; }
.inspector > p { color: #5e6059; font-size: 13px; line-height: 1.55; }
.inspector dl { margin: 35px 0; }
.inspector dl div { display: flex; justify-content: space-between; padding: 10px 0; border-top: 1px solid var(--line); font: 9px var(--mono); }
.inspector dt { color: var(--muted); }
.inspector dd { margin: 0; text-align: right; }
.inspector-note { display: grid; grid-template-columns: 7px 1fr; gap: 10px; padding: 15px; background: #e3e1d8; }
.inspector-note i { width: 7px; height: 7px; margin-top: 4px; border-radius: 50%; background: var(--orange); }
.inspector-note p { margin: 0; color: var(--muted); font: 8px/1.55 var(--mono); }
.inspect-proof { display: flex; width: 100%; justify-content: space-between; margin-top: 25px; padding: 13px; background: var(--ink); color: #fff; font: 9px var(--mono); }
.inspect-proof b { color: var(--orange); font-weight: 400; }

.modes { position: relative; z-index: 20; display: grid; height: 68px; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(242,240,232,.96); }
.modes button { display: flex; align-items: center; justify-content: center; gap: 12px; border-right: 1px solid var(--line); background: transparent; color: var(--muted); font: 10px var(--mono); }
.modes button:last-child { border: 0; }
.modes button i { color: #aaa9a1; font-style: normal; }
.modes button:hover { color: var(--ink); }
.modes button.active { background: var(--ink); color: #fff; }
.modes button.active i { color: var(--orange); }

.site-sections { background: var(--panel); }
.field-section { width: min(1380px, 100%); margin: 0 auto; padding: 110px 52px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); }
.section-index { display: flex; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--ink); }
.section-index span, .section-index strong { font: 8px var(--mono); font-weight: 400; }
.section-index span { color: var(--orange); }
.section-index strong { color: var(--muted); letter-spacing: .06em; }
.thesis-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(290px, .8fr) 210px; gap: 7vw; align-items: start; padding-top: 72px; }
.thesis h2, .launch h2 { margin: 0; max-width: 720px; font-size: clamp(44px, 6.4vw, 94px); font-variation-settings: "wdth" 82; font-weight: 420; letter-spacing: -.075em; line-height: .88; }
.thesis-copy { padding-top: 7px; }
.thesis-copy p, .launch-copy > p { margin: 0 0 22px; color: #5e6059; font-size: 14px; line-height: 1.65; }
.status-plate { padding: 19px 0; border-top: 4px solid var(--orange); border-bottom: 1px solid var(--line); }
.status-plate span, .status-plate p { color: var(--muted); font: 8px var(--mono); }
.status-plate strong { display: block; margin: 38px 0 8px; color: var(--orange); font: 18px var(--mono); font-weight: 400; }
.status-plate p { margin: 0; }

.operation { background: var(--ink); color: #f1efe7; }
.operation .section-index { border-color: rgba(255,255,255,.32); }
.operation .section-index strong { color: #8e8f88; }
.operation-line { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); margin-top: 82px; border-top: 1px solid rgba(255,255,255,.25); }
.operation-line::before { position: absolute; top: -2px; left: 20%; width: 40%; height: 3px; background: var(--orange); content: ""; }
.operation-line article { position: relative; min-height: 310px; padding: 28px 28px 25px 0; border-right: 1px solid rgba(255,255,255,.13); }
.operation-line article + article { padding-left: 28px; }
.operation-line article:last-child { border-right: 0; }
.operation-line article > i { position: absolute; top: -13px; left: 0; display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid #777870; border-radius: 50%; background: var(--ink); color: #989991; font: 7px var(--mono); font-style: normal; }
.operation-line article + article > i { left: 28px; }
.operation-line article.proven > i { border-color: var(--orange); background: var(--orange); color: #fff; }
.operation-line article > span { display: block; margin-top: 24px; color: #777970; font: 8px var(--mono); }
.operation-line h3 { margin: 48px 0 12px; font-size: 24px; font-weight: 450; letter-spacing: -.035em; }
.operation-line p { max-width: 190px; color: #9d9e97; font-size: 12px; line-height: 1.55; }
.operation-line article > b { position: absolute; bottom: 25px; color: #777970; font: 8px var(--mono); font-weight: 400; }
.operation-line article.proven > b { color: var(--orange); }
.operation-rule { margin: 0; padding: 19px 0 0; border-top: 1px solid rgba(255,255,255,.2); color: #777970; font: 8px/1.5 var(--mono); }
.operation-rule b { color: var(--orange); font-weight: 400; }

.planner { background: #d9d7cf; }
.planner-grid { display: grid; grid-template-columns: minmax(300px, 1fr) minmax(320px, .9fr) minmax(270px, .72fr); gap: 7vw; align-items: start; padding-top: 72px; }
.planner-intro h2 { margin: 0; max-width: 560px; font-size: clamp(44px, 5vw, 74px); font-variation-settings: "wdth" 82; font-weight: 420; letter-spacing: -.07em; line-height: .9; }
.planner-intro > p { max-width: 540px; margin: 30px 0 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.benchmark-stamp { max-width: 330px; margin-top: 44px; padding: 15px 0; border-top: 3px solid var(--orange); border-bottom: 1px solid var(--line); }
.benchmark-stamp span, .benchmark-stamp p { color: var(--muted); font: 8px var(--mono); }
.benchmark-stamp strong { display: block; margin: 21px 0 5px; font: 18px var(--mono); font-weight: 400; }
.benchmark-stamp p { margin: 0; }
.planner-controls { padding-top: 5px; }
.planner-controls label { display: flex; justify-content: space-between; margin: 0 0 18px; font: 8px var(--mono); }
.planner-controls label:not(:first-child) { margin-top: 56px; }
.planner-controls label span { color: var(--muted); }
.planner-controls output { color: var(--orange); }
.planner-controls input[type="range"] { width: 100%; height: 20px; margin: 0; appearance: none; background: transparent; cursor: ew-resize; }
.planner-controls input[type="range"]::-webkit-slider-runnable-track { height: 2px; background: var(--ink); }
.planner-controls input[type="range"]::-moz-range-track { height: 2px; background: var(--ink); }
.planner-controls input[type="range"]::-webkit-slider-thumb { width: 17px; height: 17px; margin-top: -7px; appearance: none; border: 2px solid var(--panel); border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 1px var(--orange); }
.planner-controls input[type="range"]::-moz-range-thumb { width: 14px; height: 14px; border: 2px solid var(--panel); border-radius: 50%; background: var(--orange); }
.range-scale { display: flex; justify-content: space-between; margin-top: 8px; color: var(--muted); font: 7px var(--mono); }
.planner-results { border-top: 1px solid var(--ink); }
.planner-results > div { padding: 16px 0; border-bottom: 1px solid var(--line); }
.planner-results span, .planner-results strong { display: block; font: 8px var(--mono); font-weight: 400; }
.planner-results span { margin-bottom: 10px; color: var(--muted); }
.planner-results strong { font-size: 15px; }
.planner-results .primary-result { padding: 24px 0; border-bottom-color: var(--ink); }
.planner-results .primary-result strong { color: var(--orange); font-size: 24px; letter-spacing: -.04em; }
.planner-results > p { margin: 17px 0 0; color: var(--muted); font: 8px/1.55 var(--mono); }

.ledger-head, .ledger-row { display: grid; grid-template-columns: .65fr .85fr 1fr .8fr 1.25fr 1.55fr .7fr; align-items: center; gap: 18px; }
.ledger-head { margin-top: 72px; padding: 0 18px 13px; color: var(--muted); font: 8px var(--mono); }
.ledger-row { padding: 30px 18px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); font: 10px var(--mono); }
.ledger-row strong { color: var(--orange); font-weight: 400; }
.ledger-row a { text-align: right; }
.run-state { display: flex; gap: 8px; align-items: center; }
.run-state i { width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.ledger-detail { display: grid; grid-template-columns: repeat(5, 1fr) auto; gap: 30px; padding: 24px 18px 28px; border-bottom: 1px solid var(--line); }
.ledger-detail div span, .ledger-detail div strong { display: block; font: 8px var(--mono); font-weight: 400; }
.ledger-detail div span { margin-bottom: 8px; color: var(--muted); }
.ledger-detail a { align-self: end; color: var(--orange); font: 8px var(--mono); }
.offline-copy { color: var(--red); }
.receipt-actions { display: flex; justify-content: space-between; align-items: center; min-height: 64px; padding: 0 18px; border-bottom: 1px solid var(--ink); }
.receipt-actions p { margin: 0; color: var(--muted); font: 8px var(--mono); }
.receipt-actions p span { color: var(--ink); }
.receipt-actions div { display: flex; gap: 24px; }
.receipt-actions button { padding: 0; background: none; color: var(--orange); font: 8px var(--mono); }
.empty-run { display: grid; grid-template-columns: 110px 1fr auto; align-items: center; min-height: 104px; padding: 0 18px; color: var(--muted); font: 9px var(--mono); }
.empty-run p { margin: 0; }
.empty-run b { font-weight: 400; }

.launch { background: #ddd9cf; }
.launch-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr); gap: 10vw; padding-top: 72px; }
.launch h2 { font-size: clamp(42px, 5vw, 76px); }
.launch-copy > p { max-width: 640px; margin-top: 35px; }
.launch-copy button { margin-top: 22px; padding: 15px 17px; background: var(--ink); color: #fff; font: 9px var(--mono); }
.launch-copy button b { margin-left: 38px; color: var(--orange); font-weight: 400; }
.launch-checks { margin: 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.launch-checks li { display: grid; grid-template-columns: 8px 1fr auto; gap: 13px; align-items: center; padding: 17px 0; border-bottom: 1px solid var(--line); color: var(--muted); font: 9px var(--mono); }
.launch-checks li i { width: 7px; height: 7px; border: 1px solid currentColor; border-radius: 50%; }
.launch-checks li:first-child { color: var(--ink); }
.launch-checks li:first-child i { border-color: var(--orange); background: var(--orange); }
.launch-checks li:first-child b { color: var(--orange); }
.launch-checks b { font-weight: 400; }

.questions { padding-bottom: 150px; }
.questions details { border-bottom: 1px solid var(--line); }
.questions details:first-of-type { margin-top: 72px; border-top: 1px solid var(--ink); }
.questions summary { display: grid; grid-template-columns: 70px 1fr auto; align-items: center; min-height: 84px; cursor: pointer; font-size: 22px; font-weight: 430; letter-spacing: -.025em; list-style: none; }
.questions summary::-webkit-details-marker { display: none; }
.questions summary::after { color: var(--orange); font: 18px var(--mono); content: "+"; }
.questions details[open] summary::after { content: "−"; }
.questions summary span { color: var(--muted); font: 8px var(--mono); }
.questions details p { max-width: 680px; margin: -7px 0 35px 70px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.site-footer { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 150px; padding: 30px 52px; background: var(--ink); color: #f2f0e8; }
.site-footer p { color: #85867f; font: 8px var(--mono); }
.site-footer button { justify-self: end; padding: 0; background: none; color: var(--orange); font: 9px var(--mono); }
.footer-brand svg { width: 34px; }
.reveal { opacity: .4; transform: translateY(24px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.reveal.visible { opacity: 1; transform: none; }

.proof-drawer { position: fixed; z-index: 100; top: 0; right: 0; bottom: 0; width: min(525px, 100vw); overflow-y: auto; padding: 30px 42px; background: #f5f3eb; box-shadow: -30px 0 100px rgba(30,29,25,.2); transform: translateX(105%); transition: transform .5s cubic-bezier(.77,0,.18,1); }
.proof-drawer.open { transform: none; }
.proof-drawer > header { display: flex; justify-content: space-between; min-height: 70px; border-bottom: 1px solid var(--line); }
.proof-drawer header span, .proof-drawer header strong { display: block; }
.proof-drawer header span { color: var(--orange); font: 8px var(--mono); }
.proof-drawer header strong { margin-top: 5px; font-size: 18px; font-weight: 450; }
.proof-drawer header button { align-self: start; padding: 0; background: none; color: var(--muted); font: 8px var(--mono); }
.proof-drawer section { padding: 34px 0; border-bottom: 1px solid var(--line); }
.proof-title { display: grid; grid-template-columns: 1fr auto; align-items: end; }
.proof-title span { grid-column: 1 / -1; color: var(--muted); font: 8px var(--mono); }
.proof-title strong { margin-top: 7px; font-size: 48px; font-weight: 430; letter-spacing: -.06em; }
.proof-title b { color: var(--orange); font: 8px var(--mono); font-weight: 400; }
.proof-drawer dl { margin: 25px 0; }
.proof-drawer dl div { display: flex; justify-content: space-between; padding: 9px 0; border-bottom: 1px solid rgba(23,24,20,.12); font: 9px var(--mono); }
.proof-drawer dt { color: var(--muted); }
.proof-drawer dd { margin: 0; }
.proof-drawer section > a { display: flex; justify-content: space-between; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font: 9px var(--mono); }
.proof-drawer section > a b { color: var(--orange); }
.proof-flow ol { margin: 25px 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.proof-flow li { display: grid; grid-template-columns: 8px 1fr auto; gap: 11px; align-items: center; padding: 11px 0; border-bottom: 1px solid rgba(23,24,20,.12); color: var(--muted); font: 8px var(--mono); }
.proof-flow li i { width: 7px; height: 7px; border: 1px solid currentColor; border-radius: 50%; }
.proof-flow li b { font-weight: 400; }
.proof-flow li.done { color: var(--ink); }
.proof-flow li.done i { border-color: var(--orange); background: var(--orange); }
.proof-flow li.done b { color: var(--orange); }
.address { display: flex; justify-content: space-between; gap: 10px; padding: 12px 0; }
.address code { overflow: hidden; color: var(--muted); font: 8px var(--mono); text-overflow: ellipsis; }
.address button { padding: 0; background: none; color: var(--orange); font: 8px var(--mono); }
.proof-drawer > footer { padding: 24px 0; color: var(--muted); font: 8px/1.55 var(--mono); }
.scrim { position: fixed; z-index: 90; inset: 0; background: rgba(29,29,25,.4); opacity: 0; pointer-events: none; transition: opacity .35s; }
.scrim.open { opacity: 1; pointer-events: auto; }
.toast { position: fixed; z-index: 120; right: 22px; bottom: 86px; padding: 10px 14px; background: var(--ink); color: #fff; font: 9px var(--mono); opacity: 0; transform: translateY(10px); transition: .25s; }
.toast.visible { opacity: 1; transform: none; }

.tour {
  position: fixed;
  z-index: 200;
  inset: 0;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s, visibility .25s;
}
.tour.open { visibility: visible; opacity: 1; pointer-events: auto; }
.tour-focus {
  position: fixed;
  z-index: 0;
  border: 2px solid var(--orange);
  background: transparent;
  box-shadow: 0 0 0 9999px rgba(20,21,17,.7);
  pointer-events: none;
  transition: top .42s cubic-bezier(.2,.8,.2,1), left .42s cubic-bezier(.2,.8,.2,1), width .42s cubic-bezier(.2,.8,.2,1), height .42s cubic-bezier(.2,.8,.2,1), border-radius .42s;
}
.tour-focus::before {
  position: absolute;
  top: -5px;
  left: -5px;
  width: 8px;
  height: 8px;
  background: var(--orange);
  content: "";
}
.tour-card {
  position: fixed;
  z-index: 2;
  width: min(390px, calc(100vw - 32px));
  padding: 22px;
  border-top: 4px solid var(--orange);
  background: #f5f3eb;
  color: var(--ink);
  box-shadow: 0 24px 80px rgba(0,0,0,.3);
  transition: top .42s cubic-bezier(.2,.8,.2,1), left .42s cubic-bezier(.2,.8,.2,1);
}
.tour-card header { display: flex; justify-content: space-between; }
.tour-card header span, .tour-card header button { color: var(--muted); font: 8px var(--mono); }
.tour-card header span { color: var(--orange); }
.tour-card header button { padding: 0; background: none; }
.tour-card h2 { margin: 32px 0 14px; font-size: 36px; font-variation-settings: "wdth" 82; font-weight: 450; letter-spacing: -.05em; line-height: .95; }
.tour-card > p { margin: 0; color: #5e6059; font-size: 13px; line-height: 1.55; }
.tour-card footer { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; margin-top: 30px; padding-top: 15px; border-top: 1px solid var(--line); }
.tour-card footer button { padding: 0; background: none; font: 9px var(--mono); }
.tour-card footer button:disabled { opacity: .25; }
.tour-card footer button:last-child { color: var(--orange); }
.tour-card footer b { margin-left: 8px; font-weight: 400; }
.tour-dots { display: flex; justify-content: center; gap: 5px; }
.tour-dots i { width: 17px; height: 2px; background: #cbc9c0; }
.tour-dots i.active { background: var(--orange); }

@media (max-width: 850px) {
  .topbar { height: 66px; padding: 0 18px; grid-template-columns: 1fr auto; }
  .brand div, .live-read, .tour-button, .system-link { display: none; }
  .workspace { display: block; height: auto; min-height: 0; overflow: visible; }
  .drawing { height: 54svh; min-height: 360px; border-right: 0; border-bottom: 1px solid var(--line); }
  .drawing-head { top: 14px; right: 16px; left: 16px; }
  .drawing-head p { display: none; }
  .trace-button { max-width: 130px; text-align: right; font-size: 7px; }
  .drawing-stage { overflow: hidden; }
  #machineDrawing { width: 100%; height: 100%; }
  .inspector { min-height: 300px; padding: 23px 20px 34px; }
  .inspector h1 { margin-top: 26px; font-size: 35px; }
  .inspector-note { display: none; }
  .modes { position: relative; height: 62px; }
  .modes button { flex-direction: column; gap: 4px; font-size: 7px; }
  .modes button i { font-size: 7px; }
  .annotations path, .annotations text:not([text-anchor="middle"]) { display: none; }
  .annotations text[text-anchor="middle"] { font-size: 11px; }
  .zoom-controls { display: none; }
  .field-section { padding: 72px 20px; border-right: 0; border-left: 0; }
  .section-index { align-items: end; }
  .section-index strong { max-width: 150px; text-align: right; line-height: 1.45; }
  .thesis-grid { display: block; padding-top: 48px; }
  .thesis h2, .launch h2 { font-size: 50px; }
  .thesis-copy { margin-top: 45px; }
  .status-plate { margin-top: 46px; }
  .status-plate strong { margin-top: 25px; }
  .operation-line { display: block; margin-top: 58px; border-top: 0; border-left: 1px solid rgba(255,255,255,.25); }
  .operation-line::before { top: 0; bottom: auto; left: -2px; width: 3px; height: 40%; }
  .operation-line article, .operation-line article + article { min-height: 205px; padding: 0 0 30px 34px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.13); }
  .operation-line article + article { padding-top: 30px; }
  .operation-line article > i, .operation-line article + article > i { top: 0; left: -13px; }
  .operation-line article + article > i { top: 30px; }
  .operation-line article > span { margin-top: 0; }
  .operation-line article + article > span { padding-top: 0; }
  .operation-line h3 { margin: 28px 0 8px; }
  .operation-line article > b { right: 0; bottom: 30px; }
  .operation-rule { margin-top: 28px; }
  .planner-grid { display: block; padding-top: 48px; }
  .planner-intro h2 { font-size: 50px; }
  .planner-controls { margin-top: 60px; }
  .planner-results { margin-top: 60px; }
  .ledger-head { display: none; }
  .ledger-row { grid-template-columns: 1fr 1fr; gap: 18px 12px; margin-top: 48px; padding: 24px 0; }
  .ledger-row > :nth-child(n+3):not(.run-state) { color: var(--muted); }
  .ledger-row .run-state { grid-column: 1 / -1; }
  .ledger-row a { text-align: left; }
  .ledger-detail { grid-template-columns: 1fr 1fr; gap: 26px 18px; padding: 28px 0; }
  .ledger-detail a { grid-column: 1 / -1; }
  .receipt-actions { display: block; padding: 20px 0; }
  .receipt-actions div { justify-content: space-between; margin-top: 22px; }
  .empty-run { grid-template-columns: 80px 1fr; padding: 22px 0; }
  .empty-run b { grid-column: 2; }
  .launch-grid { display: block; padding-top: 48px; }
  .launch-copy > p { margin-top: 30px; }
  .launch-checks { margin-top: 60px; }
  .questions { padding-bottom: 90px; }
  .questions details:first-of-type { margin-top: 48px; }
  .questions summary { grid-template-columns: 38px 1fr auto; min-height: 88px; font-size: 18px; }
  .questions details p { margin: -2px 20px 32px 38px; }
  .site-footer { grid-template-columns: 1fr auto; gap: 25px; min-height: 180px; padding: 30px 20px; }
  .site-footer p { grid-row: 2; margin: 0; }
  .site-footer button { grid-column: 2; grid-row: 1 / 3; }
  .proof-drawer { padding: 24px; }
  .tour-card { right: 16px !important; bottom: 78px; left: 16px !important; top: auto !important; width: auto; }
  .tour-card h2 { margin-top: 24px; font-size: 31px; }
}