:root {
  --acid-dim: #7f9d2d;
  --warning: #ffbd4a;
  --radius: 3px;
}
.beta-page { background: #080909; }
.noise {
  position: fixed; inset: 0; z-index: 20; pointer-events: none; opacity: .14;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");
}
.panel-kicker { color: var(--acid); font: 700 11px/1.4 ui-monospace, monospace; letter-spacing: .16em; }
.status-pill { display: flex; align-items: center; gap: 8px; color: var(--muted); font: 700 10px/1 ui-monospace, monospace; letter-spacing: .1em; text-transform: uppercase; }
.status-pill span:first-child { width: 7px; height: 7px; border-radius: 50%; background: var(--warning); box-shadow: 0 0 12px currentColor; }
.button.ghost { background: rgba(255,255,255,.02); }
.button.small { padding: 10px 13px; }
.button:disabled { opacity: .35; cursor: not-allowed; transform: none; }
input, textarea {
  width: 100%; padding: 13px; color: var(--text); background: #090b0b;
  border: 1px solid var(--line); border-radius: var(--radius); outline: none;
}
input:focus, textarea:focus { border-color: var(--acid-dim); box-shadow: 0 0 0 2px rgba(200,255,47,.07); }
textarea { min-height: 120px; resize: vertical; }
.run-progress { display: flex; align-items: center; gap: 13px; margin-top: 18px; color: var(--muted); }
.run-progress div:last-child { display: flex; flex-direction: column; gap: 3px; }
.run-progress b { color: var(--text); font-size: 13px; }
.run-progress span { font-size: 11px; }
.spinner { width: 20px; height: 20px; border: 2px solid var(--line); border-top-color: var(--acid); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.report-links { display: flex; flex-wrap: wrap; gap: 8px; }
.beta-topbar-center { color: var(--muted); font: 700 10px ui-monospace, monospace; letter-spacing: .14em; }
.beta-main { min-height: 100vh; }
.beta-hero {
  min-height: 720px; padding: 11vh 8vw 8vh; display: flex; flex-direction: column; justify-content: center;
  background: linear-gradient(105deg, rgba(8,9,9,.98), rgba(8,9,9,.74)), repeating-linear-gradient(90deg, transparent 0, transparent calc(8.33vw - 1px), rgba(200,255,47,.07) 8.33vw), radial-gradient(circle at 76% 40%, rgba(200,255,47,.18), transparent 27%);
  border-bottom: 1px solid var(--line);
}
.beta-hero h1 { margin: 20px 0 24px; font-size: clamp(56px, 8.8vw, 126px); line-height: .86; letter-spacing: -.07em; text-transform: uppercase; }
.beta-hero h1 span { color: transparent; -webkit-text-stroke: 1.5px var(--acid); }
.beta-hero > p { max-width: 780px; color: #bcc3c1; font-size: clamp(17px, 1.7vw, 23px); line-height: 1.55; }
.beta-facts { display: flex; gap: clamp(24px, 6vw, 80px); margin: 38px 0 32px; }
.beta-facts div { display: flex; flex-direction: column; gap: 7px; }
.beta-facts b { font: 800 24px ui-monospace, monospace; }
.beta-facts span { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .13em; }
.beta-start { align-self: flex-start; }
.beta-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; max-width: 1500px; margin: 0 auto; padding: 80px 5vw 120px; }
.beta-progress { position: sticky; top: 94px; align-self: start; padding: 23px; }
.progress-count { display: flex; align-items: baseline; gap: 7px; margin: 20px 0 12px; }
.progress-count b { color: var(--acid); font: 800 44px/1 ui-monospace, monospace; }
.progress-count span { color: var(--muted); font: 11px ui-monospace, monospace; }
.progress-track { height: 4px; background: #242929; overflow: hidden; }
.progress-track span { display: block; width: 0; height: 100%; background: var(--acid); transition: width .25s ease; }
.beta-progress ol { margin: 25px 0; padding: 0; list-style: none; }
.beta-progress li { border-top: 1px solid var(--line); }
.beta-progress li:last-child { border-bottom: 1px solid var(--line); }
.beta-progress a { display: flex; gap: 11px; padding: 13px 0; color: #b7bfbc; text-decoration: none; font-size: 11px; line-height: 1.4; }
.beta-progress a:hover { color: var(--acid); }
.beta-progress a span { color: var(--acid-dim); font: 10px ui-monospace, monospace; }
.privacy-note { display: flex; flex-direction: column; gap: 7px; padding: 12px; background: #0b0d0d; border-left: 2px solid var(--acid-dim); }
.privacy-note b { font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.privacy-note span { color: var(--muted); font-size: 10px; line-height: 1.5; }
.beta-workspace { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.beta-task, .beta-feedback { padding: clamp(24px, 4vw, 48px); scroll-margin-top: 90px; }
.task-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.task-heading > div:first-child { display: flex; gap: 17px; }
.task-number { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; color: #090a0a; background: var(--acid); font: 800 13px ui-monospace, monospace; clip-path: polygon(0 0,100% 0,82% 100%,0 100%); }
.task-heading h2 { margin: 4px 0 0; font-size: clamp(24px, 3vw, 40px); letter-spacing: -.04em; }
.task-time { padding: 7px 9px; color: var(--muted); border: 1px solid var(--line); font: 9px ui-monospace, monospace; text-transform: uppercase; white-space: nowrap; }
.task-lede { max-width: 850px; margin: 25px 0; color: #b8c0bd; font-size: 15px; line-height: 1.65; }
.claim-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; align-items: center; gap: 9px; margin: 28px 0; }
.claim-flow > div { min-height: 125px; padding: 17px; background: #0b0d0d; border: 1px solid var(--line); }
.claim-flow > div span { color: var(--acid); font: 700 10px ui-monospace, monospace; }
.claim-flow > div b, .claim-flow > div small { display: block; }
.claim-flow > div b { margin-top: 22px; font-size: 12px; }
.claim-flow > div small { margin-top: 7px; color: var(--muted); font-size: 10px; }
.claim-flow > i { color: var(--acid); font-style: normal; }
.fixture-callout { margin: 24px 0; padding: 18px 20px; background: rgba(255,189,74,.05); border-left: 2px solid var(--warning); }
.fixture-callout b { color: var(--warning); font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
.fixture-callout p { margin: 9px 0 0; color: #bec4c2; font-size: 13px; line-height: 1.55; }
.task-check { display: flex; align-items: flex-start; gap: 11px; margin-top: 28px; padding: 16px; color: #c9cfcd; background: #0b0d0d; border: 1px solid var(--line); font-size: 13px; line-height: 1.45; cursor: pointer; }
.task-check:has(input:checked) { border-color: var(--acid-dim); background: rgba(200,255,47,.035); }
.task-check input { flex: 0 0 auto; width: 17px; margin-top: 1px; accent-color: var(--acid); }
.beta-cases { display: grid; gap: 10px; }
.beta-case { border: 1px solid var(--line); background: #0b0d0d; }
.beta-case summary { display: grid; grid-template-columns: 78px 1fr auto; gap: 15px; align-items: center; padding: 17px; cursor: pointer; list-style: none; }
.beta-case summary::-webkit-details-marker { display: none; }
.beta-case summary span { color: var(--acid); font: 700 9px ui-monospace, monospace; text-transform: uppercase; }
.beta-case summary b { font-size: 13px; }
.beta-case summary i { color: var(--muted); font-style: normal; font-size: 18px; }
.beta-case[open] summary i { transform: rotate(45deg); }
.case-evidence { padding: 0 17px 18px 110px; }
.case-evidence p { margin: 0 0 13px; color: #b5bdbb; font-size: 13px; line-height: 1.55; }
.case-evidence code, .sql-sample code { display: block; overflow-x: auto; padding: 15px; color: #d5ddd9; background: #060707; border: 1px solid #202424; font: 11px/1.65 ui-monospace, monospace; }
.case-evidence small { display: block; margin-top: 12px; color: var(--acid); font: 10px/1.5 ui-monospace, monospace; }
.baseline-review { margin-top: 30px; }
.subheading { display: flex; justify-content: space-between; gap: 20px; align-items: flex-end; margin-bottom: 13px; }
.subheading span { color: var(--acid); font: 700 10px ui-monospace, monospace; letter-spacing: .12em; }
.subheading p { margin: 0; color: var(--muted); font-size: 11px; }
.beta-baseline-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.beta-baseline-card { padding: 20px; border: 1px solid var(--line); background: #0b0d0d; }
.beta-baseline-card > span { color: var(--muted); font: 700 10px ui-monospace, monospace; text-transform: uppercase; }
.beta-baseline-card > b { display: block; margin: 17px 0 13px; color: var(--acid); font: 800 34px ui-monospace, monospace; }
.beta-baseline-card dl { display: grid; grid-template-columns: repeat(2,1fr); gap: 7px; margin: 0; }
.beta-baseline-card dl div { padding: 9px; background: #080909; }
.beta-baseline-card dt { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.beta-baseline-card dd { margin: 5px 0 0; font: 700 11px ui-monospace, monospace; }
.beta-loading { padding: 25px; color: var(--muted); border: 1px dashed var(--line); text-align: center; font-size: 12px; }
.guided-result { margin-top: 20px; }
.guided-summary { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 19px; border: 1px solid var(--acid-dim); background: rgba(200,255,47,.04); }
.guided-summary h3 { margin: 0 0 6px; }
.guided-summary p { margin: 0; color: var(--muted); font-size: 11px; }
.guided-summary b { color: var(--acid); font: 800 31px ui-monospace, monospace; }
.guided-cases { margin-top: 9px; }
.guided-case { display: grid; grid-template-columns: 1fr auto auto; gap: 15px; padding: 13px; border-bottom: 1px solid var(--line); background: #0b0d0d; font-size: 11px; }
.guided-case .pass { color: var(--good); }.guided-case .fail { color: var(--danger); }
.sql-review-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.sql-sample { padding: 20px; border: 1px solid var(--line); background: #0b0d0d; }
.sql-sample > span { font: 700 9px ui-monospace, monospace; letter-spacing: .12em; }
.sql-sample.allowed > span { color: var(--good); }.sql-sample.blocked > span { color: var(--danger); }
.sql-sample code { margin: 15px 0; min-height: 110px; }
.sql-sample p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.safety-details { margin-top: 12px; border: 1px solid var(--line); background: #0b0d0d; }
.safety-details summary { padding: 15px 18px; cursor: pointer; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.safety-details ol { margin: 0; padding: 0 24px 18px 48px; color: #b7bfbd; font-size: 12px; line-height: 1.8; }
.locked-links { min-height: 65px; align-items: center; padding: 17px; border: 1px dashed var(--line); }
.locked-links > span { color: var(--muted); font-size: 12px; }
.beta-feedback { border-color: #3a4726; background: radial-gradient(circle at 94% 7%, rgba(200,255,47,.075), transparent 25%), rgba(16,18,18,.92); }
.feedback-intro { display: grid; grid-template-columns: 135px 1fr; gap: 24px; align-items: center; margin: 28px 0; padding: 19px 21px; border: 1px solid #30382c; background: rgba(200,255,47,.025); }
.feedback-intro > div { display: flex; align-items: baseline; gap: 8px; }
.feedback-intro > div span { color: var(--acid); font: 800 28px ui-monospace, monospace; }
.feedback-intro > div b { font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.feedback-intro p { margin: 0; color: #b9c1be; font-size: 13px; line-height: 1.6; }
.beta-feedback-form { display: grid; gap: 16px; }
.question-card { min-width: 0; margin: 0; padding: 24px; border: 1px solid var(--line); background: rgba(8,9,9,.66); }
.question-card legend { display: flex; align-items: center; gap: 12px; max-width: calc(100% - 16px); padding: 0 10px 0 0; }
.question-card legend > span { display: grid; place-items: center; width: 29px; height: 29px; color: var(--bg); background: var(--acid); font: 800 10px ui-monospace, monospace; }
.question-card legend div { display: flex; flex-direction: column; gap: 3px; }
.question-card legend b { font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
.question-card legend small { color: var(--muted); font-size: 10px; line-height: 1.4; }
.field-row { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }
.form-field > label { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 8px; color: #d3d9d7; font-size: 11px; font-weight: 750; }
.form-field > label em { color: var(--acid-dim); font: 700 8px ui-monospace, monospace; text-transform: uppercase; letter-spacing: .1em; }
.form-field > small { display: block; margin-top: 7px; color: var(--muted); font-size: 9px; }
.form-field input { min-height: 48px; background: #070808; }
.rating-card { display: grid; gap: 0; }
.rating-question { display: grid; grid-template-columns: minmax(210px,.78fr) minmax(390px,1.22fr); gap: 26px; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--line); }
.rating-question.last { padding-bottom: 0; border-bottom: 0; }
.question-copy { display: flex; flex-direction: column; gap: 7px; }
.question-copy label { color: #d9dfdc; font-size: 13px; font-weight: 750; line-height: 1.4; }
.question-copy small { color: var(--muted); font-size: 10px; line-height: 1.45; }
.scale-group { display: grid; gap: 7px; }
.scale-group.five { grid-template-columns: repeat(5,1fr); }
.scale-group.three { grid-template-columns: repeat(3,1fr); }
.scale-option { position: relative; cursor: pointer; }
.scale-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.scale-option > span { min-height: 82px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 10px 5px; color: #c4cbc8; background: #0b0d0d; border: 1px solid var(--line); transition: border-color .16s ease, background .16s ease, transform .16s ease; }
.scale-option > span b { font: 800 18px ui-monospace, monospace; }
.scale-option > span small { color: var(--muted); font-size: 8px; text-align: center; text-transform: uppercase; letter-spacing: .06em; }
.scale-option:hover > span { border-color: var(--acid-dim); transform: translateY(-1px); }
.scale-option input:focus-visible + span { outline: 2px solid var(--acid); outline-offset: 2px; }
.scale-option input:checked + span { color: var(--bg); background: var(--acid); border-color: var(--acid); box-shadow: 0 0 24px rgba(200,255,47,.12); }
.scale-option input:checked + span small { color: #28300e; }
.scale-option.word > span b { font: 800 12px ui-monospace, monospace; text-transform: uppercase; }
.response-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.response-field { padding: 17px; border: 1px solid #222727; background: #0b0d0d; }
.response-field.full { grid-column: 1 / -1; }
.response-label { display: flex; justify-content: space-between; align-items: baseline; gap: 15px; }
.response-label label { color: #d9dfdc; font-size: 12px; font-weight: 800; }
.response-label > span { color: var(--muted); font: 9px ui-monospace, monospace; }
.response-label > span b { color: var(--acid-dim); }
.response-field > p { min-height: 31px; margin: 8px 0 12px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.response-field textarea { min-height: 120px; background: #070808; border-color: #252a2a; }
.response-field textarea:valid:not(:placeholder-shown) { border-color: #4f6330; }
.consent-card { padding-bottom: 22px; }
.consent-choice { display: grid; grid-template-columns: 45px 1fr; gap: 13px; align-items: center; cursor: pointer; }
.consent-choice > input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.consent-toggle { position: relative; width: 44px; height: 24px; border: 1px solid #3a4140; border-radius: 999px; background: #0b0d0d; transition: .18s ease; }
.consent-toggle::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #68706e; transition: .18s ease; }
.consent-choice > input:checked + .consent-toggle { border-color: var(--acid); background: rgba(200,255,47,.15); }
.consent-choice > input:checked + .consent-toggle::after { left: 23px; background: var(--acid); }
.consent-choice > input:focus-visible + .consent-toggle { outline: 2px solid var(--acid); outline-offset: 2px; }
.consent-choice > span:last-child { display: flex; flex-direction: column; gap: 5px; }
.consent-choice b { font-size: 12px; }
.consent-choice small { color: var(--muted); font-size: 10px; line-height: 1.5; }
.form-readiness { display: grid; grid-template-columns: 1fr auto auto; gap: 20px; align-items: center; margin-top: 2px; padding: 22px; border: 1px solid #354126; background: linear-gradient(90deg, rgba(200,255,47,.045), rgba(200,255,47,.015)); }
.form-readiness > div:first-child { min-width: 190px; }
#formProgressText { color: #c6cdca; font: 9px ui-monospace, monospace; text-transform: uppercase; letter-spacing: .08em; }
.form-progress-track { height: 3px; margin-top: 9px; background: #242a27; overflow: hidden; }
.form-progress-track span { display: block; width: 0; height: 100%; background: var(--acid); transition: width .2s ease; }
.submit-copy { display: flex; flex-direction: column; gap: 4px; }
.submit-copy b { font-size: 11px; }
.submit-copy small { color: var(--muted); font-size: 9px; }
.feedback-submit { min-width: 220px; display: flex; justify-content: space-between; gap: 20px; align-items: center; }
.feedback-submit i { font-style: normal; font-size: 17px; }
#betaFeedbackStatus { color: var(--acid); font-size: 12px; }
.form-readiness #betaFeedbackStatus { grid-column: 1 / -1; min-height: 14px; }
.beta-complete { margin-top: 28px; padding: clamp(28px,5vw,58px); border: 1px solid var(--good); background: radial-gradient(circle at 90% 15%, rgba(90,245,154,.12), transparent 31%), rgba(90,245,154,.035); text-align: center; }
.complete-mark { width: 62px; height: 62px; display: grid; place-items: center; margin: 0 auto 22px; color: #07120c; background: var(--good); border-radius: 50%; font: 900 27px ui-monospace, monospace; box-shadow: 0 0 35px rgba(90,245,154,.16); }
.beta-complete span { color: var(--good); font: 700 10px ui-monospace, monospace; letter-spacing: .12em; }
.beta-complete h3 { margin: 14px 0 10px; font-size: clamp(27px,4vw,42px); letter-spacing: -.035em; }
.beta-complete p { max-width: 590px; margin: 0 auto 25px; color: var(--muted); line-height: 1.6; }
@media (max-width: 1000px) {
  .beta-layout { grid-template-columns: 1fr; }
  .beta-progress { position: static; }
  .beta-progress ol { display: grid; grid-template-columns: repeat(5,1fr); }
  .beta-progress li { border-bottom: 1px solid var(--line); }
  .beta-progress a { flex-direction: column; padding: 11px; }
  .claim-flow { grid-template-columns: repeat(2,1fr); }
  .claim-flow > i { display: none; }
}
@media (max-width: 720px) {
  .beta-topbar-center { display: none; }
  .beta-hero { min-height: 620px; padding: 10vh 6vw 7vh; }
  .beta-facts { flex-wrap: wrap; }
  .beta-layout { padding: 45px 4vw 80px; }
  .beta-progress ol { grid-template-columns: 1fr; }
  .beta-progress a { flex-direction: row; }
  .task-heading { flex-direction: column; }
  .beta-case summary { grid-template-columns: 62px 1fr auto; }
  .case-evidence { padding-left: 17px; }
  .beta-baseline-grid, .sql-review-grid, .field-row, .field-row.three { grid-template-columns: 1fr; }
  .subheading { align-items: flex-start; flex-direction: column; }
  .feedback-intro, .rating-question, .response-grid, .form-readiness { grid-template-columns: 1fr; }
  .response-field.full { grid-column: auto; }
  .scale-group.five { grid-template-columns: repeat(5,minmax(48px,1fr)); }
  .scale-option > span { min-height: 72px; }
  .scale-option > span small { display: none; }
  .feedback-submit { width: 100%; min-width: 0; }
  .submit-copy { display: none; }
  .guided-summary { align-items: flex-start; flex-direction: column; }
}