:root {
  --black: #070907;
  --ink: #0b0d0b;
  --panel: #101310;
  --panel-2: #151815;
  --panel-3: #1b1e1b;
  --line: #2a2e29;
  --line-soft: #20241f;
  --paper: #f2f4ed;
  --white: #fbfcf7;
  --muted: #939990;
  --muted-2: #6d736b;
  --accent: #c7ff3d;
  --accent-2: #a8de22;
  --accent-dark: #263604;
  --danger: #ff7268;
  --warning: #ffc45d;
  --blue: #72a8ff;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --sans: Inter, "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--sans); -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { border: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }
p, h1, h2, h3 { margin: 0; }
[hidden] { display: none !important; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 16px; top: -70px; z-index: 1000; padding: 12px 16px; color: var(--ink); background: var(--accent); border-radius: 5px; font-weight: 700; transition: top .2s; }
.skip-link:focus { top: 16px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

.brand { display: inline-flex; align-items: center; gap: 11px; font-size: 19px; font-weight: 550; letter-spacing: -.7px; white-space: nowrap; }
.brand img { flex: 0 0 auto; }
.brand b { display: block; margin-top: -1px; font: 8px/1 var(--mono); letter-spacing: 2.8px; }
.brand-arrow { color: var(--accent); margin: 0 2px; }
.brand-light { color: var(--white); }
.button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; padding: 10px 17px; border-radius: 5px; font-size: 12px; font-weight: 650; letter-spacing: -.1px; transition: background .18s, color .18s, border-color .18s, transform .18s; }
.button > span:last-child { font-size: 17px; line-height: 1; }
.button:hover:not(:disabled) { transform: translateY(-1px); }
.button-accent { color: var(--ink); background: var(--accent); }
.button-accent:hover:not(:disabled) { background: #d3ff66; }
.button-accent:disabled { cursor: not-allowed; color: #5a6950; background: #324121; }
.button-light { color: var(--ink); background: var(--white); }
.button-light:hover:not(:disabled) { background: var(--accent); }
.button-dark { color: var(--white); background: var(--ink); }
.button-dark:hover { color: var(--ink); background: var(--accent); }
.button-large { min-height: 54px; padding: 14px 22px; font-size: 14px; }
.mono-label { display: flex; align-items: center; gap: 9px; color: var(--muted); font: 10px/1.3 var(--mono); letter-spacing: 1.7px; }
.mono-label > span { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px #c7ff3d90; }
.dot { width: 6px; height: 6px; flex: 0 0 auto; border-radius: 50%; background: var(--accent); }

/* Landing page */
.landing-page { min-width: 320px; color: var(--white); background: var(--black); }
.site-header { position: sticky; top: 0; z-index: 30; height: 76px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 32px; padding: 0 clamp(22px, 4vw, 72px); background: #070907e8; border-bottom: 1px solid var(--line-soft); backdrop-filter: blur(18px); }
.site-nav { display: flex; align-items: center; gap: 34px; color: #b7bcb4; font-size: 12px; }
.site-nav a { transition: color .15s; }
.site-nav a:hover { color: var(--accent); }
.header-actions { justify-self: end; display: flex; align-items: center; gap: 18px; }
.live-chip { display: flex; align-items: center; gap: 8px; color: var(--muted); font: 9px/1 var(--mono); letter-spacing: .8px; }
.live-chip i, .status-dot { width: 6px; height: 6px; display: inline-block; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px #c7ff3d90; }
.live-chip.offline i { background: var(--warning); box-shadow: none; }
.menu-toggle { display: none; width: 38px; height: 38px; padding: 10px; color: var(--white); background: transparent; }
.menu-toggle span { display: block; width: 100%; height: 1px; margin: 5px 0; background: currentColor; }

.hero-section { position: relative; min-height: calc(100vh - 76px); display: grid; grid-template-columns: minmax(430px, .9fr) minmax(600px, 1.1fr); gap: clamp(36px, 5vw, 86px); align-items: center; overflow: hidden; padding: 72px clamp(22px, 4vw, 72px) 78px; border-bottom: 1px solid var(--line-soft); }
.hero-grid { position: absolute; inset: 0; opacity: .28; pointer-events: none; background-image: linear-gradient(#20251f 1px, transparent 1px), linear-gradient(90deg, #20251f 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(90deg, black, transparent 48%); }
.hero-copy { position: relative; z-index: 2; max-width: 760px; }
.hero-copy h1 { margin-top: 26px; font-size: clamp(62px, 6.8vw, 116px); font-weight: 540; line-height: .91; letter-spacing: -6px; }
.hero-copy h1 em, .section h2 em, .closing-section h2 em { color: var(--muted-2); font-style: normal; }
.hero-lead { max-width: 610px; margin-top: 32px; color: #aeb4aa; font-size: clamp(15px, 1.3vw, 19px); line-height: 1.65; }
.hero-actions { display: flex; align-items: center; gap: 30px; margin-top: 36px; }
.text-link { display: inline-flex; gap: 13px; padding: 12px 0; color: #d8dbd4; font-size: 12px; border-bottom: 1px solid #555b52; }
.text-link:hover { color: var(--accent); border-color: var(--accent); }
.hero-proof { display: flex; gap: 0; margin-top: 66px; border-top: 1px solid var(--line); }
.hero-proof > div { min-width: 118px; padding: 18px 30px 0 0; margin-right: 30px; border-right: 1px solid var(--line); }
.hero-proof strong { display: block; color: var(--paper); font: 24px/1 var(--mono); }
.hero-proof span { display: block; margin-top: 7px; color: var(--muted-2); font: 8px/1.3 var(--mono); letter-spacing: 1.1px; text-transform: uppercase; }

.hero-visual { position: relative; z-index: 2; min-width: 0; border: 1px solid #343932; border-radius: 12px; overflow: hidden; background: #101310; box-shadow: 0 30px 90px #0008; }
.visual-toolbar, .visual-footer { height: 44px; display: flex; align-items: center; justify-content: space-between; padding: 0 17px; color: #8c9389; font: 8px/1 var(--mono); letter-spacing: 1.4px; border-bottom: 1px solid #282c27; }
.visual-toolbar i { width: 6px; height: 6px; display: inline-block; margin-right: 8px; border-radius: 50%; background: var(--accent); }
.visual-footer { height: 41px; border-top: 1px solid #282c27; border-bottom: 0; }
.visual-footer span { display: flex; align-items: center; gap: 7px; }
.cad-scene { position: relative; height: clamp(460px, 55vh, 630px); overflow: hidden; background-color: #111411; background-image: radial-gradient(#3a4038 1px, transparent 1px), linear-gradient(90deg, transparent 49.8%, #272c26 50%, transparent 50.2%), linear-gradient(transparent 49.8%, #272c26 50%, transparent 50.2%); background-size: 18px 18px, 100% 100%, 100% 100%; }
.cad-art { width: 100%; height: 100%; filter: drop-shadow(0 20px 32px #0008); }
.blueprint { opacity: .78; }
.solid-model { transform-origin: 580px 280px; animation: float-model 7s ease-in-out infinite; }
.scan-line { position: absolute; left: 48%; top: 12%; width: 1px; height: 76%; background: linear-gradient(transparent, var(--accent), transparent); opacity: .45; box-shadow: 0 0 10px var(--accent); animation: scan 5.5s ease-in-out infinite; }
.axis { position: absolute; right: 22px; bottom: 25px; display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; font: 8px var(--mono); }
.axis-x { right: 50px; color: #ff837a; border: 1px solid #ff837a; }
.axis-y { right: 22px; bottom: 52px; color: #7fc7ff; border: 1px solid #7fc7ff; }
.axis-z { color: var(--accent); border: 1px solid var(--accent); }

.signal-strip { min-height: 74px; display: flex; align-items: center; justify-content: space-around; gap: 20px; padding: 18px clamp(22px, 4vw, 72px); overflow: hidden; color: #737a70; font: 9px/1 var(--mono); letter-spacing: 1.4px; border-bottom: 1px solid var(--line-soft); }
.signal-strip i { width: 4px; height: 4px; flex: 0 0 auto; border-radius: 50%; background: var(--accent); }
.section { padding: 130px clamp(22px, 6vw, 116px); }
.workflow-section { display: grid; grid-template-columns: minmax(330px, .85fr) minmax(540px, 1.15fr); gap: clamp(70px, 10vw, 170px); }
.section-heading { position: sticky; top: 125px; align-self: start; }
.section-heading h2, .formats-copy h2 { margin-top: 26px; font-size: clamp(48px, 5.3vw, 82px); font-weight: 520; line-height: .98; letter-spacing: -4px; }
.section-heading > p:last-child, .formats-copy > p { max-width: 530px; margin-top: 28px; color: #969c93; font-size: 15px; line-height: 1.7; }
.workflow-list { border-top: 1px solid var(--line); }
.workflow-list article { display: grid; grid-template-columns: 48px 1fr auto; gap: 24px; align-items: start; padding: 28px 0; border-bottom: 1px solid var(--line); }
.workflow-list article > span, .card-number { color: var(--accent); font: 9px/1 var(--mono); letter-spacing: 1.3px; }
.workflow-list h3 { color: var(--paper); font-size: 22px; font-weight: 520; letter-spacing: -.7px; }
.workflow-list p { margin-top: 8px; color: #82887f; font-size: 12px; line-height: 1.6; }
.workflow-list b { align-self: center; color: #676d64; font: 8px var(--mono); letter-spacing: 1.2px; }

.capabilities-section { background: var(--paper); color: var(--ink); }
.section-kicker { display: flex; justify-content: space-between; margin-bottom: 32px; color: #73786f; font: 9px var(--mono); letter-spacing: 1.4px; }
.bento-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.bento-card { min-height: 330px; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 34px; background: #e6e9e0; border: 1px solid #d2d6cb; border-radius: 10px; }
.bento-card h3 { max-width: 550px; margin-top: 32px; font-size: clamp(30px, 3vw, 50px); font-weight: 520; line-height: 1.02; letter-spacing: -2.5px; }
.bento-card p { max-width: 520px; margin-top: 18px; color: #646a61; font-size: 13px; line-height: 1.65; }
.bento-wide { grid-column: 1 / -1; min-height: 360px; display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.mini-steps { display: flex; align-items: center; justify-content: center; }
.mini-steps i { width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; border: 1px solid #bcc2b5; border-radius: 50%; color: #858b81; font: normal 11px var(--mono); background: #edf0e8; }
.mini-steps i.done { color: #41530c; border-color: #b5da57; background: #dcf7a0; }
.mini-steps i.active { color: var(--ink); border-color: var(--ink); box-shadow: 0 0 0 5px #c7ff3d; background: var(--accent); }
.mini-steps span { width: 38px; height: 1px; background: #bfc5b9; }
.terminal-line { align-self: stretch; margin-top: 46px; padding: 16px; color: #9fa69a; background: var(--ink); border-radius: 5px; font: 9px var(--mono); letter-spacing: 1px; }
.terminal-line i { width: 6px; height: 6px; display: inline-block; margin-right: 9px; border-radius: 50%; background: var(--accent); }
.metric-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 46px; background: #c9cec3; border: 1px solid #c9cec3; }
.metric-row span { padding: 14px; color: #777d73; background: #eef0e9; font: 8px var(--mono); }
.metric-row b { display: block; margin-top: 7px; color: var(--ink); font-size: 16px; font-weight: 500; }
.bento-accent { color: var(--white); background: var(--ink); border-color: var(--ink); }
.bento-accent p { color: #989f95; }
.report-stack { position: relative; height: 190px; }
.report-stack span { position: absolute; right: 0; width: 78%; height: 50px; display: flex; align-items: center; padding: 0 17px; color: #7c8378; background: #141714; border: 1px solid #30352f; border-radius: 4px; font: 9px var(--mono); letter-spacing: 1px; box-shadow: 0 8px 18px #0005; }
.report-stack span:nth-child(1) { top: 0; right: 18%; transform: rotate(-2deg); }
.report-stack span:nth-child(2) { top: 42px; right: 11%; transform: rotate(1deg); }
.report-stack span:nth-child(3) { top: 83px; right: 5%; transform: rotate(-1deg); }
.report-stack span:nth-child(4) { top: 125px; color: var(--ink); background: var(--accent); border-color: var(--accent); }

.formats-section { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(60px, 9vw, 150px); align-items: center; color: var(--ink); background: var(--accent); }
.formats-copy .mono-label { color: #435111; }
.formats-copy .mono-label > span { background: var(--ink); box-shadow: none; }
.formats-copy > p { color: #49550f; }
.formats-copy .button { margin-top: 34px; }
.format-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.format-cards article { min-height: 240px; position: relative; overflow: hidden; padding: 24px; color: var(--paper); background: var(--ink); border-radius: 7px; }
.format-cards article > span { font: 28px/1 var(--mono); letter-spacing: -1px; }
.format-cards small { display: block; margin-top: 8px; color: #737a70; font: 8px var(--mono); letter-spacing: 1.2px; }
.format-cards .output-card { color: var(--ink); background: var(--paper); }
.format-art { position: absolute; inset: 90px 28px 25px; border: 1px solid #333833; background-image: radial-gradient(#4b514a 1px, transparent 1px); background-size: 13px 13px; }
.pdf-art i, .cgm-art i { position: absolute; display: block; border: 1px solid #697066; }
.pdf-art i:nth-child(1) { left: 19%; top: 22%; width: 60%; height: 55%; }
.pdf-art i:nth-child(2) { left: 34%; top: 37%; width: 30%; height: 28%; border-radius: 50%; }
.pdf-art i:nth-child(3) { left: 11%; top: 49%; width: 78%; height: 1px; border: 0; background: #697066; }
.format-art b { position: absolute; right: 12px; bottom: 9px; color: var(--accent); font: 8px var(--mono); }
.dxf-art i { position: absolute; left: 50%; top: 50%; width: 78px; height: 78px; border: 1px solid #667064; transform-origin: center; }
.dxf-art i:nth-child(1) { transform: translate(-50%,-50%) rotate(0); }
.dxf-art i:nth-child(2) { transform: translate(-50%,-50%) rotate(22.5deg); }
.dxf-art i:nth-child(3) { transform: translate(-50%,-50%) rotate(45deg); }
.dxf-art i:nth-child(4) { width: 28px; height: 28px; border-radius: 50%; transform: translate(-50%,-50%); }
.cgm-art i:nth-child(1) { left: 16%; top: 27%; width: 68%; height: 47%; transform: skew(-17deg); }
.cgm-art i:nth-child(2) { left: 48%; top: 10%; width: 1px; height: 80%; border: 0; background: #687068; }
.output-cube { position: absolute; left: 50%; top: 58%; width: 110px; height: 110px; transform: translate(-50%, -50%) rotate(30deg) skew(-6deg); }
.output-cube i { position: absolute; inset: 0; border: 2px solid #263006; background: #c7ff3d55; }
.output-cube i:nth-child(2) { transform: translate(28px, -17px); background: #c7ff3d; }
.output-cube i:nth-child(3) { inset: 24px; border-color: #263006; border-radius: 50%; background: var(--paper); }

.closing-section { position: relative; min-height: 78vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 120px 24px 80px; text-align: center; background-image: radial-gradient(circle at center, #1a2114 0, #070907 54%); border-bottom: 1px solid var(--line); }
.closing-section h2 { margin: 28px 0 42px; font-size: clamp(60px, 8vw, 126px); font-weight: 520; line-height: .9; letter-spacing: -6px; }
.closing-meta { position: absolute; left: 0; right: 0; bottom: 24px; display: flex; justify-content: space-between; padding: 0 clamp(22px, 4vw, 72px); color: #5c6259; font: 8px var(--mono); letter-spacing: 1px; }
.site-footer { min-height: 120px; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; gap: 30px; padding: 26px clamp(22px, 4vw, 72px); color: #777e74; }
.site-footer p { justify-self: center; font-size: 10px; }
.site-footer > a:last-child { justify-self: end; color: var(--paper); font: 9px var(--mono); letter-spacing: 1px; }

/* Conversion workspace */
.app-page { min-width: 320px; color: var(--paper); background: #090b09; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 286px minmax(0, 1fr); }
.app-sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 22px 16px 16px; overflow: hidden; background: #070907; border-right: 1px solid var(--line-soft); }
.app-sidebar .brand { padding: 2px 8px; }
.new-project-button { min-height: 44px; display: flex; align-items: center; gap: 10px; margin-top: 32px; padding: 0 15px; color: var(--ink); background: var(--white); border-radius: 6px; font-size: 12px; font-weight: 650; }
.new-project-button:hover { background: var(--accent); }
.new-project-button span { font-size: 19px; font-weight: 300; }
.side-label { margin: 31px 10px 9px; color: #5d635b; font: 8px var(--mono); letter-spacing: 1.4px; }
.workspace-nav { display: grid; gap: 3px; }
.nav-item { min-height: 40px; display: flex; align-items: center; width: 100%; gap: 11px; padding: 0 11px; color: #848b82; background: transparent; border-radius: 5px; text-align: left; font-size: 11px; }
.nav-item:hover, .nav-item.active { color: var(--paper); background: #141714; }
.nav-item > span:first-child { width: 18px; color: #6d746b; font: 15px var(--mono); text-align: center; }
.nav-item b { min-width: 19px; margin-left: auto; padding: 3px 5px; color: #858c81; background: #222620; border-radius: 10px; font: 8px var(--mono); text-align: center; }
.card { background: var(--panel); border: 1px solid var(--line-soft); border-radius: 8px; }
.sidebar-history { min-height: 0; margin-top: 24px; overflow: hidden; }
.compact-heading { min-height: 55px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; border-bottom: 1px solid var(--line-soft); }
.compact-heading h2 { margin-top: 4px; color: #dfe3da; font-size: 12px; font-weight: 550; }
.text-button { padding: 4px 0; color: #8e958b; background: transparent; font: 9px var(--mono); }
.text-button:hover { color: var(--accent); }
.text-button.danger { color: #c57f78; }
.empty-note { padding: 18px 15px; color: #626861; font-size: 10px; line-height: 1.6; }
.sidebar-history .table-scroll { max-height: 310px; overflow-y: auto; }
.sidebar-history table { display: block; width: 100%; border-collapse: collapse; }
.sidebar-history thead { display: none; }
.sidebar-history tbody { display: block; }
.sidebar-history tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 9px; padding: 12px 14px; border-bottom: 1px solid #1c201b; }
.sidebar-history td { min-width: 0; color: #727970; font-size: 9px; }
.sidebar-history td:first-child { grid-column: 1; overflow: hidden; color: #d4d8d0; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-history td:nth-child(2), .sidebar-history td:nth-child(4) { display: none; }
.sidebar-history td:nth-child(3) { grid-column: 1; }
.sidebar-history td:nth-child(5) { grid-column: 2; grid-row: 1 / 3; align-self: center; }
.sidebar-footer { margin-top: auto; padding: 15px 8px 3px; border-top: 1px solid var(--line-soft); }
.server-status { display: flex; align-items: center; gap: 7px; color: #aeb5aa; font: 9px var(--mono); }
.server-status.offline { color: var(--warning); }
.server-status.offline .dot { background: var(--warning); }
.server-status.connecting .dot { background: #676d65; }
.sidebar-footer > div:last-child { display: flex; justify-content: space-between; margin-top: 13px; color: #555b53; font: 7px var(--mono); letter-spacing: 1px; }
.sidebar-footer b { color: #7b8278; font-weight: 500; }

.workspace-frame { min-width: 0; }
.workspace-topbar { height: 65px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 24px; background: #0d0f0d; border-bottom: 1px solid var(--line-soft); }
.breadcrumb { color: #5f655d; font-size: 10px; }
.breadcrumb a:hover { color: var(--accent); }
.breadcrumb span { margin: 0 10px; color: #3d423c; }
.breadcrumb strong { color: #a5aca1; font-weight: 500; }
.topbar-meta { display: flex; align-items: center; gap: 9px; color: #70766d; font: 8px var(--mono); letter-spacing: .8px; }
.topbar-meta > span { padding: 5px 7px; border: 1px solid #2a2e29; border-radius: 3px; }
.topbar-meta > span:last-child { color: var(--accent); border-color: #41521b; }
.topbar-meta i { width: 23px; height: 1px; background: #3a4038; }
.workspace-content { display: grid; grid-template-columns: minmax(250px, 292px) minmax(420px, 1fr) minmax(330px, 370px); min-height: calc(100vh - 98px); }
.source-column { display: flex; flex-direction: column; min-width: 0; padding: 24px 20px 18px; background: #0d0f0d; border-right: 1px solid var(--line-soft); }
.panel-heading, .viewer-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.panel-heading h1, .panel-heading h2, .viewer-heading h2 { margin-top: 8px; color: #ecefe8; font-size: 18px; font-weight: 540; letter-spacing: -.5px; }
.panel-number { color: #3e443c; font: 25px/1 var(--mono); }
.source-form { margin-top: 22px; }
.dropzone { padding: 25px 15px 18px; text-align: center; background: #121512; border: 1px dashed #343a32; border-radius: 7px; transition: border-color .15s, background .15s; }
.dropzone.dragover, .dropzone:focus-within { background: #161b12; border-color: var(--accent); }
.dropzone.disabled { opacity: .55; }
.upload-glyph { width: 55px; height: 55px; fill: none; stroke: #687066; stroke-width: 1.5; }
.dropzone h2 { margin-top: 13px; color: #dfe3db; font-size: 13px; font-weight: 550; }
.dropzone > p { margin-top: 6px; color: #666d64; font-size: 9px; }
.file-picker { min-height: 35px; margin-top: 18px; padding: 7px 16px; cursor: pointer; font-size: 10px; }
.format-pills { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 5px; margin-top: 17px; }
.format-pills span { padding: 3px 6px; color: #878e84; background: #1a1e19; border: 1px solid #2c312b; border-radius: 3px; font: 7px var(--mono); letter-spacing: .8px; }
.format-pills small { margin-left: 3px; color: #565c55; font-size: 8px; }
.selected-file { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 10px; background: #171c12; border: 1px solid #334219; border-radius: 5px; }
.file-type { padding: 7px 5px; color: var(--accent); background: #27350c; border-radius: 3px; font: 8px var(--mono); }
.selected-file > div { min-width: 0; flex: 1; }
.selected-file strong { display: block; overflow: hidden; color: #dfe4d9; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.selected-file small { display: block; margin-top: 3px; color: #72796f; font-size: 8px; }
.icon-button { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; padding: 0; color: #7c8379; background: transparent; border-radius: 4px; font-size: 21px; }
.icon-button:hover { color: var(--paper); background: #242824; }
.upload-progress { margin-top: 13px; color: #8a9187; font-size: 9px; }
.upload-progress > div { display: flex; justify-content: space-between; margin-bottom: 6px; }
progress { width: 100%; height: 5px; overflow: hidden; border: 0; border-radius: 4px; background: #222720; accent-color: var(--accent); }
progress::-webkit-progress-bar { background: #222720; }
progress::-webkit-progress-value { background: var(--accent); }
.form-error { margin-top: 11px; padding: 10px; color: #ffaaa3; background: #2b1514; border: 1px solid #572622; border-radius: 5px; font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.option-row { display: flex; align-items: center; gap: 9px; margin-top: 17px; padding: 13px 0; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.option-mark { width: 23px; height: 23px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--ink); background: var(--accent); border-radius: 50%; font-size: 9px; }
.option-row > div { min-width: 0; }
.option-row strong { display: block; color: #c9cec5; font-size: 10px; font-weight: 550; }
.option-row p { margin-top: 3px; color: #646b62; font-size: 8px; line-height: 1.45; }
.enabled-badge { margin-left: auto; padding: 3px 5px; color: var(--accent); background: #263409; border-radius: 3px; font: 7px var(--mono); }
.advanced { color: #858c82; font-size: 9px; border-bottom: 1px solid var(--line-soft); }
.advanced summary { display: flex; justify-content: space-between; padding: 13px 0; cursor: pointer; list-style: none; }
.advanced summary::-webkit-details-marker { display: none; }
.advanced[open] summary span { transform: rotate(45deg); }
.advanced label { display: flex; gap: 8px; padding: 0 0 13px; color: #6f766d; line-height: 1.5; }
.advanced input { margin: 2px 0 0; accent-color: var(--accent); }
.convert-button { width: 100%; margin-top: 14px; }
.model-info { display: flex; align-items: center; gap: 9px; margin-top: auto; padding-top: 17px; border-top: 1px solid var(--line-soft); }
.model-mark { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; color: var(--accent); background: #1b230f; border-radius: 4px; }
.model-info > div { min-width: 0; }
.model-info small { display: block; color: #575d56; font: 7px var(--mono); letter-spacing: 1px; }
.model-info strong { display: block; margin-top: 4px; overflow: hidden; color: #949b91; font-size: 9px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.model-info > span:last-child { margin-left: auto; color: #61685f; font: 8px var(--mono); }

.viewer-column { min-width: 0; padding: 16px; background: #0a0c0a; }
.viewer-panel { overflow: hidden; background: var(--panel); border: 1px solid var(--line-soft); border-radius: 8px; }
.viewer-heading { height: 66px; align-items: center; padding: 0 17px; border-bottom: 1px solid var(--line-soft); }
.viewer-heading h2 { margin-top: 5px; font-size: 14px; }
.viewer-tools { display: flex; align-items: center; gap: 9px; }
.viewer-tools span { padding: 5px 7px; color: #727970; background: #1a1e19; border: 1px solid #2a2f29; border-radius: 3px; font: 7px var(--mono); letter-spacing: .8px; }
.viewer-tools button { min-width: 34px; height: 29px; padding: 0 6px; color: #767d73; background: #171a17; border: 1px solid #2b302a; border-radius: 4px; font: 7px var(--mono); letter-spacing: .5px; }
.preview-stage { position: relative; min-height: clamp(380px, 51vh, 650px); overflow: hidden; background: #111411; }
.preview-grid { position: absolute; inset: 0; opacity: .55; background-image: radial-gradient(#3d433b 1px, transparent 1px), linear-gradient(90deg, transparent 49.9%, #272c26 50%, transparent 50.1%), linear-gradient(transparent 49.9%, #272c26 50%, transparent 50.1%); background-size: 17px 17px, 100% 100%, 100% 100%; }
.preview-placeholder { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30px; text-align: center; }
.empty-drawing { width: 116px; height: 90px; position: relative; margin-bottom: 20px; color: #454b44; border: 1px solid currentColor; }
.empty-drawing span { position: absolute; left: 25px; top: 18px; width: 64px; height: 48px; border: 1px solid currentColor; }
.empty-drawing i { position: absolute; display: block; background: #454b44; }
.empty-drawing i:nth-of-type(1) { left: 0; right: 0; top: 44px; height: 1px; }
.empty-drawing i:nth-of-type(2) { top: 0; bottom: 0; left: 57px; width: 1px; }
.empty-drawing i:nth-of-type(3) { left: 43px; top: 30px; width: 28px; height: 28px; border: 1px solid #596057; border-radius: 50%; background: transparent; }
.preview-placeholder h3 { color: #8c9389; font-size: 12px; font-weight: 520; }
.preview-placeholder p { max-width: 310px; margin-top: 8px; color: #5e655c; font-size: 9px; line-height: 1.6; }
.preview-stage > a { position: absolute; inset: 20px; z-index: 3; display: flex; align-items: center; justify-content: center; }
.preview-stage img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; filter: drop-shadow(0 20px 28px #0008); }
.viewport-axis { position: absolute; right: 18px; bottom: 18px; z-index: 4; width: 52px; height: 52px; color: #747b72; font: 7px var(--mono); }
.viewport-axis span { position: absolute; width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; border: 1px solid currentColor; border-radius: 50%; }
.viewport-axis .x { right: 27px; bottom: 0; color: #d66a63; }.viewport-axis .y { right: 0; bottom: 27px; color: #669bd0; }.viewport-axis .z { right: 0; bottom: 0; color: var(--accent); }
.viewport-scale { position: absolute; left: 18px; bottom: 17px; z-index: 4; color: #636a61; font: 7px var(--mono); text-align: center; }
.viewport-scale span { display: block; width: 60px; height: 6px; border-left: 1px solid #676e65; border-right: 1px solid #676e65; border-top: 1px solid #676e65; }
.viewport-scale b { font-weight: 400; }
.preview-caption { padding: 9px 15px; color: #70776e; border-top: 1px solid var(--line-soft); font: 8px var(--mono); overflow-wrap: anywhere; }

.telemetry { min-height: 78px; display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 12px 15px; background: var(--panel); border: 1px solid var(--line-soft); border-radius: 7px; }
.telemetry-label { min-width: 150px; display: flex; align-items: center; gap: 9px; flex: 1; }
.telemetry-icon { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; color: var(--accent); background: #1a230e; border-radius: 4px; font-size: 17px; }
.telemetry-label strong { display: block; color: #c9cdc5; font-size: 10px; font-weight: 550; }
.telemetry-label small { display: block; max-width: 190px; margin-top: 3px; color: #5d645b; font-size: 7px; line-height: 1.35; }
.token-metric { min-width: 63px; padding-left: 12px; border-left: 1px solid var(--line-soft); }
.token-metric small, .requests-metric small { display: block; color: #5e655c; font: 7px var(--mono); letter-spacing: .7px; }
.token-metric strong { display: block; margin-top: 5px; color: #9ba298; font: 13px var(--mono); }
.token-metric.total strong { color: var(--accent); }
.requests-metric { min-width: 46px; text-align: right; }
.requests-metric strong { display: block; color: #969d93; font: 12px var(--mono); }
.requests-metric small { margin-top: 4px; }
.activity-card { margin-top: 12px; overflow: hidden; }
.quiet-label { color: #626960; font: 7px var(--mono); letter-spacing: 1px; }
.event-feed { max-height: 154px; overflow-y: auto; padding: 0 15px; margin: 0; list-style: none; }
.event-feed li { display: flex; align-items: baseline; gap: 12px; padding: 9px 0; color: #8b9288; border-bottom: 1px solid #1b1f1b; font-size: 9px; line-height: 1.45; }
.event-feed time { flex: 0 0 auto; color: #596057; font: 8px var(--mono); }
.event-feed li.success > span { color: var(--accent); }.event-feed li.error > span { color: var(--danger); }.event-feed li.token > span { color: var(--blue); }
.raw-log { padding: 12px 15px; color: #687067; border-top: 1px solid var(--line-soft); font-size: 8px; }
.raw-log summary { display: flex; justify-content: space-between; cursor: pointer; list-style: none; }
.raw-log summary::-webkit-details-marker { display: none; }
.raw-log pre { max-height: 250px; overflow: auto; margin: 12px 0 0; padding: 13px; color: #a4ada0; background: #080a08; border: 1px solid #232722; border-radius: 5px; white-space: pre-wrap; overflow-wrap: anywhere; font: 8px/1.75 var(--mono); }

.process-column { align-self: start; margin: 16px 16px 16px 0; padding: 20px 19px 0; }
.process-heading { padding-bottom: 18px; border-bottom: 1px solid var(--line-soft); }
.process-heading h2 { font-size: 16px; }
.status-badge { display: inline-flex; align-items: center; padding: 5px 8px; color: #858c82; background: #1a1e19; border: 1px solid #2a2f29; border-radius: 20px; font: 7px var(--mono); white-space: nowrap; }
.status-badge.running, .status-badge.queued, .status-badge.stopping { color: #a8c9fa; background: #151f2c; border-color: #263a55; }
.status-badge.completed, .status-badge.prepared { color: var(--accent); background: #1d290d; border-color: #3a4c16; }
.status-badge.failed, .status-badge.cancelled { color: #ff9a92; background: #291514; border-color: #512622; }
.status-badge.needs_review, .status-badge.needs_information, .status-badge.interrupted { color: var(--warning); background: #2b2415; border-color: #514224; }
.process-overview { min-height: 93px; display: flex; align-items: center; gap: 10px; padding: 18px 0; }
.state-symbol { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; color: #646b62; background: #1b1f1a; border: 1px solid #2b302a; border-radius: 50%; font: 21px var(--mono); }
.state-symbol.running { color: var(--accent); background: #1b250e; border-color: #344616; }
.state-symbol.completed, .state-symbol.prepared { color: var(--ink); background: var(--accent); border-color: var(--accent); font-size: 14px; }
.state-symbol.failed, .state-symbol.cancelled { color: var(--danger); background: #2b1514; border-color: #572622; }
.state-symbol.needs_review, .state-symbol.needs_information, .state-symbol.interrupted { color: var(--warning); background: #2b2415; border-color: #514224; }
.state-symbol.running > span { width: 18px; height: 18px; border: 2px solid #3b4b1c; border-top-color: var(--accent); border-radius: 50%; animation: spin 1s linear infinite; }
.process-caption { min-width: 0; flex: 1; }
.process-caption h3 { color: #d7dbd3; font-size: 11px; font-weight: 550; }
.process-caption p { margin-top: 5px; color: #686f66; font-size: 8px; line-height: 1.5; overflow-wrap: anywhere; }
.elapsed { flex: 0 0 auto; text-align: right; }
.elapsed span { color: #a4aba1; font: 14px var(--mono); }
.elapsed small { display: block; margin-top: 4px; color: #545a53; font: 6px var(--mono); letter-spacing: 1px; }
.process-meta { display: flex; justify-content: space-between; gap: 9px; padding: 11px 0; color: #5f665d; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); font: 7px var(--mono); }
.process-meta span:first-child { color: #8b9288; white-space: nowrap; }
.process-meta span:last-child { max-width: 60%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.steps { padding: 17px 0 0; margin: 0; list-style: none; }
.step { min-height: 63px; position: relative; display: flex; align-items: flex-start; gap: 10px; padding: 2px 0 16px; }
.step::after { content: ""; position: absolute; left: 12px; top: 30px; bottom: 0; width: 1px; background: #272c26; }
.step:last-child { min-height: 52px; }.step:last-child::after { display: none; }
.step-marker { position: relative; z-index: 2; width: 25px; height: 25px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; color: #656c63; background: #151815; border: 1px solid #30352f; border-radius: 50%; font: 8px var(--mono); }
.step > div { min-width: 0; flex: 1; }
.step strong { display: block; color: #8e958b; font-size: 10px; font-weight: 520; }
.step p { margin-top: 4px; color: #575e56; font-size: 8px; line-height: 1.45; }
.step-tag { padding-top: 4px; color: #555c54; font: 7px var(--mono); }
.step.active .step-marker { color: var(--ink); background: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 4px #283509; }
.step.active .step-marker::after { content: ""; position: absolute; inset: -5px; border: 1px solid transparent; border-top-color: var(--accent); border-radius: 50%; animation: spin 1.5s linear infinite; }
.step.active strong, .step.active .step-tag { color: var(--accent); }
.step.done .step-marker { color: var(--accent); background: #1c280c; border-color: #3a4c16; }
.step.done strong { color: #b5c49b; }.step.done .step-tag { color: #708344; }.step.done::after { background: #3a4c16; }
.step.error .step-marker { color: var(--danger); background: #2b1514; border-color: #572622; }.step.error .step-tag { color: var(--danger); }
.process-bottom { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 9px; color: #5e655c; border-top: 1px solid var(--line-soft); font: 7px var(--mono); }
.process-bottom > span { display: flex; align-items: center; gap: 6px; }
.process-column[aria-busy="true"] .process-bottom .dot { animation: pulse 1.5s ease-in-out infinite; }
.result-panel { padding: 16px 0 19px; color: #aeb5aa; border-top: 1px solid var(--line-soft); font-size: 9px; line-height: 1.5; }
.result-kicker { margin-bottom: 8px; color: #5f665d; font: 7px var(--mono); letter-spacing: 1px; }
.result-panel.warning #result-message { color: var(--warning); }.result-panel.error #result-message { color: var(--danger); }
.result-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
.result-actions .button { min-height: 35px; padding: 7px 11px; font-size: 9px; }
.result-actions .artifact-link { padding: 7px 9px; color: #989f95; border: 1px solid #30352f; border-radius: 4px; font-size: 8px; }
.result-actions .artifact-link:hover { color: var(--accent); border-color: #4b5c24; }
.result-panel > .button { margin-top: 10px; font-size: 9px; }
.workspace-footer { height: 33px; display: flex; align-items: center; justify-content: space-between; padding: 0 24px; color: #4f554e; background: #0b0d0b; border-top: 1px solid var(--line-soft); font: 7px var(--mono); letter-spacing: .6px; }

dialog { width: min(590px, calc(100% - 28px)); padding: 28px; color: #dce0d7; background: #111411; border: 1px solid #363b34; border-radius: 9px; box-shadow: 0 40px 140px #000b; }
dialog::backdrop { background: #000b; backdrop-filter: blur(5px); }
.dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--line-soft); }
.dialog-heading h2 { margin-top: 8px; font-size: 24px; font-weight: 550; }
dialog ol { padding-left: 20px; color: #a2a99f; }
dialog li { padding: 6px 0; font-size: 12px; line-height: 1.55; }
dialog p { margin: 16px 0; color: #797f76; font-size: 11px; line-height: 1.6; }
dialog code { color: var(--accent); }

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 50% { opacity: .3; } }
@keyframes float-model { 50% { transform: translateY(-7px); } }
@keyframes scan { 0%, 100% { transform: translateX(-40px); opacity: .15; } 50% { transform: translateX(42px); opacity: .6; } }

@media (max-width: 1500px) {
  .hero-section { grid-template-columns: minmax(390px, .86fr) minmax(540px, 1.14fr); }
  .hero-copy h1 { letter-spacing: -5px; }
  .app-shell { grid-template-columns: 246px minmax(0, 1fr); }
  .workspace-content { grid-template-columns: minmax(230px, 270px) minmax(390px, 1fr) minmax(300px, 340px); }
  .source-column { padding: 22px 16px 16px; }
  .process-column { padding: 18px 15px 0; }
  .telemetry { gap: 8px; padding: 11px; }
  .telemetry-label { min-width: 125px; }.token-metric { min-width: 55px; padding-left: 9px; }
}

@media (max-width: 1220px) {
  .site-header { grid-template-columns: 1fr auto; }.site-nav { display: none; }
  .hero-section { min-height: auto; grid-template-columns: 1fr; padding-top: 92px; }
  .hero-copy { max-width: 900px; }.hero-copy h1 { font-size: clamp(70px, 10vw, 110px); }
  .hero-visual { width: min(100%, 980px); justify-self: end; }.cad-scene { height: 600px; }
  .workflow-section { grid-template-columns: 1fr; gap: 70px; }.section-heading { position: static; }
  .formats-section { grid-template-columns: 1fr; }.formats-copy { max-width: 750px; }
  .app-shell { grid-template-columns: 220px minmax(0, 1fr); }
  .app-sidebar { padding-left: 12px; padding-right: 12px; }
  .workspace-content { grid-template-columns: minmax(250px, 290px) minmax(420px, 1fr); }
  .process-column { grid-column: 1 / -1; margin: 0 16px 16px; }
  .steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; }
  .step { min-height: 95px; display: block; padding: 0 8px 12px 0; }
  .step::after { left: 27px; top: 12px; right: -7px; bottom: auto; width: auto; height: 1px; }
  .step-marker { margin-bottom: 10px; }.step-tag { display: block; margin-top: 6px; }.step p { min-height: 24px; }
}

@media (max-width: 980px) {
  .site-header { height: 68px; padding: 0 20px; }.header-actions .live-chip { display: none; }
  .hero-section { padding-left: 24px; padding-right: 24px; }.hero-copy h1 { letter-spacing: -4px; }
  .hero-visual { border-radius: 8px; }.cad-scene { height: 510px; }
  .section { padding: 100px 28px; }.bento-card { padding: 28px; }.bento-wide { grid-template-columns: 1fr; gap: 35px; }
  .app-shell { grid-template-columns: 72px minmax(0, 1fr); }
  .app-sidebar { align-items: center; padding: 18px 9px 12px; }
  .app-sidebar .brand { padding: 0; }.app-sidebar .brand > span, .side-label, .nav-item > span:nth-child(2), .nav-item b, .sidebar-history, .sidebar-footer > div:last-child { display: none; }
  .new-project-button { width: 44px; min-height: 44px; justify-content: center; margin-top: 26px; padding: 0; font-size: 0; }.new-project-button span { font-size: 21px; }
  .workspace-nav { width: 100%; margin-top: 22px; }.nav-item { justify-content: center; padding: 0; }.nav-item > span:first-child { width: auto; }
  .sidebar-footer { width: 100%; display: flex; justify-content: center; padding-left: 0; padding-right: 0; }.server-status span:last-child { display: none; }
  .workspace-content { grid-template-columns: minmax(235px, 280px) minmax(360px, 1fr); }
  .topbar-meta > span:not(:last-child), .topbar-meta i { display: none; }
}

@media (max-width: 760px) {
  .site-header { grid-template-columns: 1fr auto; }.header-actions { display: none; }.menu-toggle { display: block; }
  .site-nav { position: absolute; left: 14px; right: 14px; top: 74px; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 8px; background: #121512; border: 1px solid var(--line); border-radius: 7px; }
  .site-nav.open { display: flex; }.site-nav a { padding: 13px; }
  .hero-section { padding-top: 72px; }.hero-copy h1 { font-size: clamp(52px, 16vw, 78px); letter-spacing: -3.5px; }.hero-lead { font-size: 14px; }
  .hero-actions { align-items: stretch; flex-direction: column; gap: 13px; }.text-link { align-self: flex-start; }
  .hero-proof > div { min-width: 0; flex: 1; margin-right: 12px; padding-right: 12px; }.hero-proof strong { font-size: 20px; }
  .cad-scene { height: 390px; }.visual-toolbar span:last-child, .visual-footer span:last-child { display: none; }
  .signal-strip { justify-content: flex-start; overflow-x: auto; }.signal-strip span { white-space: nowrap; }
  .section { padding: 84px 20px; }.section-heading h2, .formats-copy h2 { font-size: 49px; letter-spacing: -3px; }
  .workflow-list article { grid-template-columns: 38px 1fr; }.workflow-list b { grid-column: 2; justify-self: start; }
  .bento-grid { grid-template-columns: 1fr; }.bento-wide { grid-column: auto; }.bento-card { min-height: 300px; }.bento-card h3 { font-size: 34px; }
  .format-cards { grid-template-columns: 1fr; }.format-cards article { min-height: 220px; }
  .closing-section h2 { font-size: 58px; letter-spacing: -4px; }.closing-meta { gap: 10px; flex-wrap: wrap; justify-content: center; }.site-footer { grid-template-columns: 1fr auto; }.site-footer p { display: none; }
  .app-shell { display: block; }
  .app-sidebar { position: relative; z-index: 20; width: 100%; height: 62px; flex-direction: row; justify-content: space-between; padding: 11px 14px; border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .app-sidebar .brand > span { display: block; font-size: 14px; }.app-sidebar .brand b { font-size: 6px; }.app-sidebar .brand img { width: 31px; height: 31px; }
  .new-project-button { width: 37px; min-height: 37px; margin: 0 0 0 auto; }.workspace-nav { display: flex; width: auto; margin: 0 0 0 5px; }.nav-item { width: 37px; min-height: 37px; }.sidebar-footer { width: auto; margin: 0 0 0 4px; padding: 0; border: 0; }
  .workspace-topbar { height: 52px; padding: 0 15px; }.breadcrumb { font-size: 8px; }.topbar-meta { display: none; }
  .workspace-content { display: block; min-height: auto; }.source-column { padding: 22px 16px; border-right: 0; border-bottom: 1px solid var(--line-soft); }.model-info { margin-top: 20px; }
  .viewer-column { padding: 12px; }.preview-stage { min-height: 430px; }.telemetry { flex-wrap: wrap; }.telemetry-label { width: 100%; flex: auto; }.token-metric { flex: 1; }.token-metric:nth-child(2) { padding-left: 0; border-left: 0; }
  .process-column { margin: 0 12px 12px; }.steps { display: block; }.step { min-height: 61px; display: flex; padding-right: 0; }.step::after { left: 12px; top: 30px; right: auto; bottom: 0; width: 1px; height: auto; }.step-marker { margin: 0; }.step-tag { display: inline; margin-top: 0; }.step p { min-height: 0; }
  .workspace-footer { padding: 0 14px; }.workspace-footer span:last-child { display: none; }
}

@media (max-width: 430px) {
  .brand { font-size: 16px; }.site-header .brand img { width: 32px; height: 32px; }
  .hero-section { padding-left: 16px; padding-right: 16px; }.hero-copy h1 { font-size: 48px; letter-spacing: -2.6px; }.mono-label { font-size: 8px; letter-spacing: 1.1px; }
  .hero-proof { margin-top: 45px; }.hero-proof > div { margin-right: 8px; padding-right: 8px; }.hero-proof span { font-size: 6px; }
  .cad-scene { height: 310px; }.cad-art { transform: scale(1.15); }.section-heading h2, .formats-copy h2 { font-size: 42px; }
  .bento-card { padding: 24px; }.metric-row { grid-template-columns: 1fr; }.report-stack span { width: 92%; }
  .closing-section h2 { font-size: 46px; }.site-footer { padding: 23px 16px; }.site-footer > a:last-child { font-size: 7px; }
  .app-sidebar .brand > span { display: none; }.preview-stage { min-height: 340px; }.viewer-heading { padding: 0 12px; }.telemetry { padding: 12px; }.requests-metric { width: 100%; display: flex; align-items: baseline; justify-content: flex-end; gap: 7px; }.requests-metric small { margin: 0; }
  .process-overview { align-items: flex-start; }.elapsed span { font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}