:root {
  --ink: #11120e;
  --paper: #eee9d7;
  --acid: #c8fa4b;
  --muted: #a49f90;
  --line: rgba(238, 233, 215, 0.2);
  --mono: "DM Mono", monospace;
  --display: "Oxanium", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ink); color: var(--paper); font-family: var(--display); }
button, input { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
.scanlines { position: fixed; z-index: 10; pointer-events: none; inset: 0; opacity: .07; background: repeating-linear-gradient(0deg, transparent 0 3px, #fff 3px 4px); mix-blend-mode: overlay; }
.site-header { height: 84px; padding: 0 4.5vw; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: flex; align-items: center; gap: 12px; font-size: 19px; font-weight: 700; letter-spacing: -.03em; }
.brand > span:last-child span { color: var(--acid); }
.brand-mark { width: 23px; height: 25px; display: flex; align-items: end; gap: 3px; }
.brand-mark i { width: 5px; display: block; background: var(--acid); }
.brand-mark i:nth-child(1) { height: 10px; }.brand-mark i:nth-child(2) { height: 24px; }.brand-mark i:nth-child(3) { height: 16px; }
nav { display: flex; gap: 32px; font-family: var(--mono); font-size: 11px; letter-spacing: .05em; }
nav a { color: var(--muted); transition: color .2s; } nav a:hover, nav a.active { color: var(--paper); }
.status-link { color: var(--acid); font-family: var(--mono); font-size: 10px; letter-spacing: .08em; display: flex; align-items: center; gap: 8px; }.status-link span { width: 7px; height: 7px; background: var(--acid); border-radius: 50%; box-shadow: 0 0 12px var(--acid); }
main { overflow: hidden; }.hero { padding: 11vh 8.4vw 0; min-height: 650px; position: relative; border-bottom: 1px solid var(--line); }.eyebrow, .index { color: var(--acid); font: 10px var(--mono); letter-spacing: .13em; }.eyebrow { display: flex; gap: 10px; align-items: center; }.eyebrow span { width: 37px; height: 1px; background: var(--acid); }.hero-kicker { position: absolute; right: 8.4vw; top: 12vh; color: var(--muted); font: 10px/1.6 var(--mono); letter-spacing: .08em; }.hero h1 { margin: 5vh 0 6vh; max-width: 850px; font-size: clamp(58px, 9.3vw, 144px); line-height: .82; letter-spacing: -.075em; font-weight: 600; }.hero em, .roadmap em { color: var(--acid); font-style: normal; }.hero-bottom { display: flex; justify-content: space-between; align-items: end; gap: 40px; position: relative; z-index: 2; }.hero-bottom p { max-width: 405px; margin: 0; color: #cbc6b7; font: 15px/1.55 var(--mono); }.arrow-link { color: var(--acid); font: 12px var(--mono); white-space: nowrap; border-bottom: 1px solid var(--acid); padding: 0 0 10px; }.arrow-link b { font-size: 19px; margin-left: 23px; }.frequency { height: 145px; display: flex; gap: clamp(6px, 1vw, 16px); align-items: center; opacity: .82; margin-top: 12px; }.frequency span { width: 2px; background: var(--acid); box-shadow: 0 0 12px rgba(200,250,75,.45); }.frequency span:nth-child(1),.frequency span:nth-child(16){height:10px}.frequency span:nth-child(2),.frequency span:nth-child(15){height:30px}.frequency span:nth-child(3),.frequency span:nth-child(14){height:60px}.frequency span:nth-child(4),.frequency span:nth-child(13){height:95px}.frequency span:nth-child(5),.frequency span:nth-child(12){height:45px}.frequency span:nth-child(6),.frequency span:nth-child(11){height:112px}.frequency span:nth-child(7),.frequency span:nth-child(10){height:75px}.frequency span:nth-child(8),.frequency span:nth-child(9){height:137px}
.doctor-section,.workflow { padding: 100px 8.4vw; }.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 42px; }.section-heading h2,.roadmap h2 { margin: 10px 0 0; font-size: clamp(32px, 4vw, 58px); line-height: .9; letter-spacing: -.06em; }.section-heading > p { max-width: 330px; margin: 0; color: var(--muted); font: 12px/1.65 var(--mono); }
.doctor-grid { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(310px,.78fr); border: 1px solid var(--line); }.dropzone { min-height: 430px; padding: 45px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background: linear-gradient(135deg, rgba(200,250,75,.04), transparent 54%); outline: none; transition: background .25s; }.dropzone:hover,.dropzone:focus,.dropzone.dragover { background: rgba(200,250,75,.11); }.target { height: 68px; width: 68px; border: 1px solid var(--acid); border-radius: 50%; position: relative; display: grid; place-items: center; margin-bottom: 22px; }.target::before,.target::after,.target span::before,.target span::after { content:""; display:block; position:absolute; background:var(--acid); }.target::before { height:1px;width:94px; }.target::after { width:1px;height:94px; }.target span::before { width:9px;height:9px;border-radius:50%;left:29px;top:29px; }.drop-label { font-size: 19px; font-weight: 600; letter-spacing: .06em; margin: 0 0 8px; }.dropzone > p:not(.drop-label),.formats { margin: 0; color: var(--muted); font: 11px var(--mono); }.text-button { border: 0; border-bottom: 1px solid var(--acid); padding: 0 0 2px; color: var(--acid); background: none; font: inherit; }.drop-divider { width: 57px; height: 1px; background: var(--line); margin: 34px 0 16px; }.formats { letter-spacing: .02em; }.diagnostic-panel { padding: 28px 27px; border-left: 1px solid var(--line); display: flex; flex-direction: column; background: #151710; }.panel-topline { display: flex; justify-content: space-between; color: var(--muted); font: 10px var(--mono); letter-spacing: .08em; }.panel-topline span:last-child { color: var(--acid); }.score-wrap { display: flex; gap: 16px; align-items: center; padding: 27px 0 21px; border-bottom: 1px solid var(--line); }.score { width: 62px; height: 62px; display: grid; place-items:center; border: 1px solid var(--line); color: var(--acid); font: 21px var(--mono); }.score-wrap strong { font-size: 15px; font-weight: 500; }.score-wrap p { margin: 5px 0 0; color: var(--muted); font: 10px/1.4 var(--mono); }.issue-list { flex: 1; padding: 12px 0; }.issue { display:flex; gap: 12px; padding: 11px 0; border-bottom: 1px solid rgba(238,233,215,.08); font: 10px/1.5 var(--mono); }.issue span { color: var(--muted); }.issue p { margin: 0; }.issue.pass p { color: var(--acid); }.issue.warn p { color: #f1c44e; }.issue.error p { color: #ff8072; }.issue.neutral p { color: var(--muted); }.sample-button { margin-top: 9px; color: var(--paper); background: transparent; border: 1px solid var(--line); padding: 13px; text-align: left; font: 10px var(--mono); letter-spacing: .05em; transition: all .2s; }.sample-button:hover { color: var(--ink); background: var(--acid); border-color: var(--acid); }.sample-button span { float: right; font-size: 17px; line-height: 8px; }
.workflow { border-top: 1px solid var(--line); }.steps { display: grid; grid-template-columns: repeat(3,1fr); list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.steps li { padding: 28px 28px 33px 0; border-right: 1px solid var(--line); }.steps li + li { padding-left: 28px; }.steps li:last-child { border-right: 0; }.steps span { color: var(--acid); font: 11px var(--mono); }.steps h3 { margin: 32px 0 10px; font-size: 24px; letter-spacing: -.04em; }.steps p { max-width: 190px; color: var(--muted); font: 11px/1.65 var(--mono); }.roadmap { padding: 90px 8.4vw; background: var(--acid); color: var(--ink); display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }.roadmap .index,.roadmap em { color: #315d00; }.roadmap h2 { color: var(--ink); }.roadmap-items { align-self: end; border-top: 1px solid rgba(17,18,14,.28); }.roadmap-items article { padding: 21px 0; border-bottom: 1px solid rgba(17,18,14,.28); display: grid; grid-template-columns: 110px 1fr; column-gap: 20px; }.roadmap-items span { grid-row: span 2; color:#315d00; font: 9px var(--mono); }.roadmap-items h3 { margin:0; font-size: 19px; }.roadmap-items p { margin: 5px 0 0; font: 10px/1.5 var(--mono); }
footer { padding: 24px 4.5vw; display:grid; grid-template-columns: 1fr 2fr auto; gap:30px; align-items:center; color: var(--muted); font: 9px/1.5 var(--mono); } footer p { margin:0; } footer a { color:var(--paper); white-space:nowrap; }
@media (max-width: 720px) { .site-header { height:70px; padding:0 22px; }.site-header nav,.status-link { display:none; }.hero { padding: 85px 22px 0; min-height: 560px; }.hero-kicker { top: 24px; right:22px; font-size:8px; }.hero h1 { margin: 80px 0 50px; font-size: 62px; }.hero-bottom { align-items: start; flex-direction: column; gap: 25px; }.frequency { height: 86px; }.doctor-section,.workflow { padding:70px 22px; }.section-heading { display:block; }.section-heading > p { margin-top:20px; }.doctor-grid { grid-template-columns:1fr; }.dropzone { min-height:350px; padding:25px; }.diagnostic-panel { border-left:0; border-top:1px solid var(--line); min-height:330px; }.steps { grid-template-columns:1fr; }.steps li,.steps li+li { border-right:0; border-bottom:1px solid var(--line); padding:24px 0; }.steps li:last-child { border-bottom:0; }.steps h3 { margin:20px 0 8px; }.roadmap { padding:65px 22px; grid-template-columns:1fr; gap:40px; }.roadmap-items article { grid-template-columns:85px 1fr; }.roadmap-items p { grid-column:2; } footer { padding:23px 22px; grid-template-columns:1fr; gap:10px; } }