@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600;700&family=VT323&display=swap');

:root {
  color-scheme: dark;
  --bg: #06080c;
  --panel: #0d1320;
  --surface: #101a29;
  --line: #2b3c4c;
  --text: #dce9e5;
  --muted: #91a2af;
  --green: #1aeb83;
  --pixel: 'VT323', 'Courier New', monospace;
  font-family: 'IBM Plex Mono', 'Courier New', monospace;
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { min-width: 280px; }
body { display: flex; flex-direction: column; min-height: 100svh; margin: 0; background: var(--bg); color: var(--text); }
button { font: inherit; -webkit-tap-highlight-color: transparent; }
button:focus-visible { outline: 2px solid var(--green); outline-offset: 5px; }
::selection { color: var(--bg); background: var(--green); }
[hidden] { display: none !important; }
.app { display: grid; place-items: center; flex: 1; min-height: 520px; padding: 32px 20px; background: radial-gradient(ellipse at 50% 48%, #12372b35 0%, transparent 64%); }
.terminal { position: relative; isolation: isolate; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 42px; width: min(100%, 640px); min-height: 450px; padding: 54px 28px; border: 1px solid #22553e; border-radius: 3px; background: #090f14; box-shadow: inset 0 0 50px #062c201f, 0 0 36px #00c97308, 0 16px 72px #0006; }
.terminal::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: repeating-linear-gradient(0deg, transparent 0, transparent 3px, #00ff7b06 3px, #00ff7b06 4px); }
.terminal::after { content: ''; position: absolute; inset: -1px; border-top: 2px solid #1aeb8350; border-bottom: 2px solid #1aeb8326; border-radius: inherit; pointer-events: none; }
h1 { margin: 0; max-width: 100%; font-family: var(--pixel); font-weight: 400; font-size: clamp(3rem, 17.5vw, 8rem); line-height: .86; letter-spacing: .01em; text-align: center; overflow-wrap: anywhere; text-shadow: 0 0 18px #b8ffde20; }
h1 span { color: var(--green); text-shadow: 0 0 22px #00ff7755; }
.retro-button { min-height: 50px; padding: 14px 20px; border: 1px solid #315145; border-top-color: #597564; border-bottom: 3px solid #15281f; border-radius: 2px; background: linear-gradient(#20362c, #14251d); color: var(--green); font-size: 1rem; font-weight: 600; line-height: 1.5; text-transform: uppercase; cursor: pointer; box-shadow: inset 1px 1px 0 #c9ffe00a, 0 4px 0 #0005; transition: background .15s, color .15s, border-color .15s; }
.retro-button:hover:not(:disabled) { background: linear-gradient(#2b503b, #1a3827); border-color: #69bd86; color: #a2ffc4; }
.retro-button:active:not(:disabled) { transform: translateY(2px); box-shadow: inset 0 2px 4px #0004; }
.retro-button:disabled { cursor: wait; color: #82b997; }
.check-button { display: flex; align-items: center; justify-content: space-between; gap: 28px; min-width: 260px; max-width: 100%; min-height: 62px; padding: 16px 23px; letter-spacing: .06em; }
.button-cursor { font-size: 1.25rem; line-height: 1; }
[data-state='checking'] .button-cursor { animation: blink 1s steps(2, jump-none) infinite; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
[data-state='checking'] .terminal { width: min(100%, 740px); padding: 24px; gap: 22px; }
.computation { width: 100%; min-width: 0; }
.compute-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid #214334; color: #87ae9b; font-size: .75rem; letter-spacing: .08em; }
.compute-heading span:first-child { color: var(--green); }
.compute-stage { min-height: 2.1em; display: flex; align-items: center; margin: 6px 0; color: #d2fce8; font-family: var(--pixel); font-size: clamp(1.65rem, 4vw, 2rem); font-weight: 400; line-height: 1.05; text-transform: uppercase; }
.quantum-viewport { position: relative; height: 210px; overflow: hidden; border: 1px solid #1d3d37; background: radial-gradient(ellipse at center, #0c292580, #070d12 74%); }
.quantum-viewport canvas { display: block; width: 100%; height: 100%; }
.geometry-label, .geometry-count { position: absolute; top: 12px; color: #699b89; font-size: .75rem; line-height: 1.6; pointer-events: none; }
.geometry-label { left: 12px; }
.geometry-count { right: 12px; text-align: right; }
.compute-equation { position: absolute; bottom: 8px; left: 8px; right: 8px; width: fit-content; max-width: calc(100% - 16px); margin: 0 auto; padding: 4px 8px; background: #07110ed9; color: #a6e7dd; font-size: .875rem; line-height: 1.5; text-align: center; overflow-wrap: anywhere; }
.dimension-channels { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; margin: 13px 0 16px; }
.dimension-channels div { display: flex; align-items: center; gap: 7px; color: #86a496; font-size: .75rem; }
.dimension-channels i { display: block; width: 100%; height: 4px; background: #152c25; overflow: hidden; }
.dimension-channels b { display: block; width: 100%; height: 100%; background: var(--green); transform: scaleX(.15); transform-origin: left; transition: transform .18s linear; }
.dimension-channels div:nth-child(n+4) b { background: #69cde0; }
.compute-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 12px 0; border-top: 1px solid #1d3d37; border-bottom: 1px solid #1d3d37; }
.compute-metrics dt { margin-bottom: 6px; color: #89a59a; font-size: .75rem; }
.compute-metrics dd { margin: 0; color: #a1f8ce; font-size: .875rem; line-height: 1.4; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.compute-log { display: flex; flex-direction: column; justify-content: flex-end; gap: 3px; height: 74px; overflow: hidden; padding: 0; margin: 14px 0; list-style: none; color: #83a596; font-size: .75rem; line-height: 1.5; }
.compute-log li { display: flex; flex-shrink: 0; gap: 10px; }
.compute-log li::before { content: '›'; flex-shrink: 0; color: #437860; }
.compute-log li:last-child { color: #b6dbca; }
.compute-progress-row { display: flex; justify-content: space-between; gap: 12px; color: #91b8a6; font-size: .75rem; line-height: 1.5; }
#compute-percent { color: var(--green); font-variant-numeric: tabular-nums; }
.compute-progress { height: 9px; margin-top: 8px; padding: 2px; border: 1px solid #2d624b; background: #050c09; }
.compute-progress > span { display: block; width: 100%; height: 100%; transform: scaleX(0); transform-origin: left; background: repeating-linear-gradient(90deg, var(--green) 0, var(--green) 5px, #0b2d1c 5px, #0b2d1c 7px); transition: transform .18s linear; }
.funding-footer { padding: 23px 28px 17px; border-top: 4px solid #182936; background: #edf0ed; color: #203747; font-family: Arial, Helvetica, sans-serif; }
.funding-partners { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 35px; max-width: 1040px; padding: 0; margin: 0 auto; list-style: none; }
.funding-partner { display: flex; align-items: center; justify-content: center; gap: 16px; min-width: 0; }
.funding-partner img { flex: 0 0 60px; width: 60px; height: 60px; object-fit: contain; }
.funding-partner strong { display: block; font-size: 15px; font-weight: 700; line-height: 1.22; }
.funding-partner span { display: block; margin-top: 6px; color: #5b6b71; font-size: 12px; line-height: 1.4; }
[data-state='result'] .terminal { gap: 28px; padding-top: 38px; padding-bottom: 32px; }
[data-state='result'] .check-button { width: min(100%, 330px); }
.calculation-summary { width: 100%; max-width: 480px; border-top: 1px solid #28533e; padding-top: 22px; }
.calculation-summary h2 { margin: 0 0 16px; color: #8fb9a3; font-size: .875rem; font-weight: 500; line-height: 1.5; letter-spacing: .05em; }
.calculation-summary dl { display: grid; gap: 12px; margin: 0; }
.calculation-summary dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 18px; font-size: .875rem; line-height: 1.5; }
.calculation-summary dt { color: var(--muted); }
.calculation-summary dd { margin: 0; flex-shrink: 0; color: var(--green); }
.calculation-summary p { margin: 20px 0 0; color: #bfd8cc; font-size: .875rem; line-height: 1.7; }
@media (max-width: 760px) {
  .funding-footer { padding: 23px 24px 17px; }
  .funding-partners { grid-template-columns: 1fr; gap: 21px; max-width: 300px; }
  .funding-partner { justify-content: flex-start; gap: 20px; }
}
body.dialog-open { overflow: hidden; }
.fluid-dialog { width: min(520px, calc(100% - 28px)); max-height: calc(100dvh - 28px); padding: 32px 26px; margin: auto; border: 1px solid #9b813d; border-top: 3px solid #edca73; border-radius: 3px; background: #111914; color: var(--text); box-shadow: 0 0 0 3px #06090f, 0 24px 100px #000b; text-align: center; overflow-y: auto; }
.fluid-dialog::backdrop { background: #020507d9; backdrop-filter: blur(4px); }
.fluid-code { margin: 0 0 20px; color: #c6ac72; font-size: .75rem; line-height: 1.6; }
.fluid-dialog h2 { margin: 0; color: #ffe19a; font-family: var(--pixel); font-size: clamp(2rem, 7vw, 3rem); line-height: 1; font-weight: 400; }
#fluid-description { margin: 22px 0 28px; color: #d1d5ca; font-size: 1rem; line-height: 1.8; }
.fluid-dialog .retro-button { width: min(100%, 280px); }
.focus-dialog { width: min(620px, calc(100% - 28px)); border-color: #496b87; border-top-color: #8ec7ed; background: #0c1420; }
.focus-dialog .fluid-code { color: #95bcd5; }
.focus-dialog h2 { color: #d2eaff; }
#focus-description { margin: 20px 0; color: #d1dbe4; font-size: 1rem; line-height: 1.7; }
.focus-field { position: relative; width: 100%; height: clamp(180px, 34vw, 240px); overflow: hidden; border: 1px solid #2a3d50; background: radial-gradient(ellipse, #14293b, #060b12 75%); }
.focus-dot { position: absolute; left: 50%; top: 50%; width: 14px; height: 14px; border-radius: 50%; transform: translate(-50%, -50%); background: #54dcbe; box-shadow: 0 0 18px currentColor; color: #54dcbe; }
.focus-target { width: 18px; height: 18px; z-index: 1; background: #ff3434; color: #ff3434; box-shadow: 0 0 0 4px #ff343416, 0 0 22px #ff343499; }
.focus-status { min-height: 1.6em; margin: 16px 0; color: #95bcd5; font-size: .875rem; line-height: 1.6; }
.upgrade-dialog { width: min(960px, calc(100% - 28px)); max-width: none; max-height: calc(100dvh - 28px); padding: 0; margin: auto; border: 1px solid #476075; border-top-color: #718596; border-radius: 3px; background: var(--panel); color: var(--text); box-shadow: 0 0 0 3px #06090f, 0 24px 120px #000b; overflow-y: auto; overscroll-behavior: contain; }
.upgrade-dialog::backdrop { background: #020507d9; backdrop-filter: blur(4px); }
.upgrade-content { position: relative; padding: 45px 32px 23px; text-align: center; }
.dialog-close { position: absolute; top: 7px; right: 7px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid transparent; border-radius: 2px; background: transparent; color: var(--muted); font-family: var(--pixel); font-size: 2rem; line-height: 1; cursor: pointer; }
.dialog-close:hover { border-color: var(--line); background: var(--surface); color: #fff; }
.upgrade-dialog h2 { max-width: 710px; margin: 0 auto; font-family: var(--pixel); font-size: clamp(2.25rem, 5vw, 3.5rem); font-weight: 400; line-height: 1.04; text-transform: uppercase; overflow-wrap: anywhere; color: var(--green); text-shadow: 0 0 18px #1aeb8322; }
.upgrade-description { margin: 16px auto 30px; color: var(--muted); font-size: .875rem; line-height: 1.7; }
.plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; text-align: left; }
.plan { display: flex; flex-direction: column; min-width: 0; padding: 22px 18px 18px; border: 1px solid var(--line); border-top: 2px solid #62768a; border-radius: 2px; background: var(--surface); }
.plan-plus { border-top-color: #5394ff; }
.plan-pro { border-color: #1aeb8350; border-top-color: var(--green); background: linear-gradient(155deg, #112d24, #101a29 75%); }
.plan h3 { margin: 0 0 12px; font-family: var(--pixel); font-size: 2rem; line-height: 1; font-weight: 400; text-transform: uppercase; }
.plan-plus h3 { color: #76b0ff; }
.plan-pro h3 { color: var(--green); }
.plan-price { margin: 0 0 24px; font-family: var(--pixel); font-size: 3.75rem; font-weight: 400; line-height: 1; white-space: nowrap; }
.plan-price span { font-size: 1.75rem; }
.plan-power { width: fit-content; max-width: 100%; margin: -4px 0 22px; padding: 5px 8px; border: 1px solid #3e596b; background: #080f1a; color: #b9d1df; font-size: .875rem; line-height: 1.5; letter-spacing: .04em; }
.plan-plus .plan-power { color: #8fbdff; border-color: #365d89; }
.plan-pro .plan-power { color: var(--green); border-color: #2a7854; }
.plan ul { display: grid; align-content: start; gap: 12px; flex: 1; list-style: none; padding: 0; margin: 0 0 26px; color: #bbc8d1; font-size: .875rem; line-height: 1.6; }
.plan li { display: flex; gap: 8px; }
.plan li::before { content: '+'; color: var(--green); }
.plan-button { width: 100%; padding: 12px 8px; font-size: .875rem; }
.dismiss-upgrade { display: block; min-height: 44px; max-width: 100%; margin: 18px auto 0; padding: 10px 8px; border: 0; background: transparent; color: var(--muted); font-size: .875rem; line-height: 1.5; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.dismiss-upgrade:hover { color: #e1ede7; }
.confirmation { display: flex; justify-content: center; gap: 16px; width: min(100%, 430px); margin: 38px auto 10px; }
.confirmation .retro-button { flex: 1; min-width: 0; }
.confirm-no { background: linear-gradient(#283041, #1b2230); border-color: #405064; border-bottom-color: #101623; color: #bcc9d5; }
.upgrade-dialog[data-view='confirmation'] { width: min(660px, calc(100% - 28px)); }
.upgrade-dialog[data-view='confirmation'] .upgrade-content { display: flex; flex-direction: column; justify-content: center; min-height: 330px; padding: 62px 36px 38px; }
.upgrade-dialog[data-view='confirmation'] h2 { font-size: clamp(2.125rem, 5vw, 3.25rem); }
.upgrade-dialog[data-view='confirmation'] .upgrade-description { margin-bottom: 0; }
@keyframes blink { 50% { opacity: .25; } }
@media (max-width: 720px) {
  .upgrade-content { padding: 48px 18px 18px; }
  .plans { grid-template-columns: 1fr; gap: 14px; }
  .plan { padding: 20px; }
  .plan-price { font-size: 3.25rem; margin-bottom: 18px; }
  .plan ul { margin-bottom: 20px; gap: 8px; }
  .upgrade-description { margin-bottom: 24px; }
}
@media (max-width: 450px) {
  .app { min-height: 460px; padding: 20px 16px; }
  .terminal { padding: 48px 16px; min-height: 380px; gap: 38px; }
  h1 { font-size: clamp(3rem, 17.5vw, 6rem); }
  .check-button { min-width: 0; width: min(100%, 250px); font-size: .875rem; gap: 16px; }
  .upgrade-dialog[data-view='confirmation'] .upgrade-content { padding: 58px 22px 28px; }
  [data-state='checking'] .terminal { padding: 18px 14px; gap: 18px; }
  .quantum-viewport { height: 180px; }
  .geometry-label { top: 7px; left: 8px; }
  .geometry-count { display: none; }
  .dimension-channels { gap: 8px; }
  .dimension-channels div { flex-direction: column; gap: 5px; }
}
@media (max-width: 600px) {
  .compute-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .compute-log { height: 114px; }
}
/* NEUROPHASE instruments */
[data-state='checking'] .terminal { width: min(100%, 1180px); padding: 24px; gap: 18px; }
.compute-heading { align-items: center; font-size: .8125rem; }
.terminal-toggle { border: 1px solid #315045; padding: 8px 10px; min-height: 38px; background: #0b1713; color: #a5cbb9; font-size: .75rem; cursor: pointer; }
.compute-stage { min-height: 2.2em; font-size: clamp(1.6rem, 3vw, 2.4rem); }
.analysis-layout { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 18px; }
.visual-column { min-width: 0; }
.quantum-viewport { height: 300px; }
.geometry-label { font-size: .75rem; color: #a3c9b9; }
.geometry-count { top: auto; bottom: 43px; right: 12px; font-size: .75rem; color: #98b7ab; }
.compute-equation { max-width: calc(100% - 16px); font-size: .875rem; }
.compute-metrics { gap: 12px 8px; }
.compute-metrics dt { min-height: 2.5em; font-size: .8125rem; line-height: 1.4; }
.compute-metrics dd { font-size: .875rem; }
.instrument-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding-top: 14px; }
.instrument-row span { display: block; min-height: 2.5em; font-size: .75rem; line-height: 1.5; color: #8bb09e; }
.instrument-row b { font-weight: 500; color: #c2e9d9; }
.cluster-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 5px; height: 59px; margin-top: 7px; }
.cluster-grid i { display: block; background: #3ada96; box-shadow: 0 0 5px #43ca8b18; }
.cluster-grid i[data-bank='secondary'] { background: #6bc2e0; }
.convergence-panel canvas { display: block; width: 100%; height: 66px; }
.console-panel { display: flex; flex-direction: column; min-width: 0; height: 100%; max-height: 578px; border: 1px solid #264536; background: #040b09; overflow: hidden; }
.console-heading, .console-footer { display: flex; justify-content: space-between; gap: 8px; padding: 12px; color: #8bc3a6; background: #0c1913; font-size: .75rem; line-height: 1.4; }
.console-heading { border-bottom: 1px solid #264536; }
.console-footer { border-top: 1px solid #264536; color: #7ea58e; }
.compute-log { display: flex; flex-direction: column; justify-content: flex-end; flex: 1; height: 442px; min-height: 180px; margin: 0; padding: 12px 10px; gap: 3px; color: #64a987; font-size: .75rem; line-height: 1.6; overflow: hidden; }
.compute-log li { display: block; white-space: nowrap; min-height: 19px; overflow: hidden; text-overflow: clip; }
.compute-log li::before { content: none; }
.compute-log li:nth-last-child(-n+4) { color: #b1f4d0; }
.compute-log li.warning { color: #dfbe79; }
.compute-notice { min-height: 3em; margin: 15px 0 12px; color: #b2d5c3; font-size: .875rem; line-height: 1.5; }
.compute-notice[data-kind='warning'] { color: #e6c17b; }
.compute-progress-row { font-size: .8125rem; }
[data-paused='true'] .console-panel { opacity: .55; }
.architecture-link { padding: 8px 10px; margin-top: -22px; min-height: 40px; border: 0; background: none; color: #6c9681; font-size: .75rem; letter-spacing: .07em; cursor: pointer; text-decoration: underline; text-underline-offset: 5px; }
.architecture-link:hover { color: #b6e0c9; }
.architecture-dialog { position: relative; width: min(720px, calc(100% - 28px)); max-height: calc(100dvh - 28px); border: 1px solid #456b58; border-top: 3px solid var(--green); padding: 38px 32px; background: #0b1511; color: #c5d9ce; margin: auto; overflow-y: auto; }
.architecture-dialog::backdrop { background: #020507db; backdrop-filter: blur(4px); }
.architecture-dialog h2 { color: var(--green); font-family: var(--pixel); font-size: clamp(2.8rem, 8vw, 4.6rem); font-weight: 400; margin: 0; line-height: 1; }
.architecture-dialog p { font-size: 1rem; line-height: 1.8; }
.architecture-dialog .fluid-code, .architecture-dialog .architecture-subtitle { font-size: .8125rem; color: #8fbea4; }
.architecture-flow { border-top: 1px solid #30503e; padding-top: 20px; color: #7dca9f; font-size: .8125rem; line-height: 2; }
.result-headline { font-size: clamp(2.7rem, 8vw, 5.7rem); line-height: 1.02; text-wrap: balance; color: #c4fbdc; }
.summary-job { margin: 0 0 18px !important; color: #7aad91 !important; font-size: .75rem !important; overflow-wrap: anywhere; }
.calculation-summary { max-width: 530px; }
.calculation-summary dd { text-align: right; }
.focus-dialog[data-phase='retry'] { border-top-color: #e2ba63; }
.focus-dialog[data-phase='retry'] h2 { color: #efcf8a; }
.focus-dialog[data-phase='passed'] { border-top-color: var(--green); }
.phase-field { position: relative; height: 200px; margin: 16px 0; background: #081411; border: 1px solid #294c3e; }
.phase-reference, .phase-ring { position: absolute; left: 50%; top: 50%; display: block; width: 110px; height: 110px; border: 2px dashed #a5b8ac; border-radius: 50%; transform: translate(-50%, -50%); }
.phase-ring { border: 2px solid #60d4e4; box-shadow: 0 0 16px #60d4e41c; }
.phase-field[data-aligned='true'] .phase-ring { border-color: #57ed9a; box-shadow: 0 0 16px #57ed9a22; }
.secondary-action { display: block; margin: 12px auto 0; min-height: 44px; padding: 10px; background: none; border: 0; color: #a7c2b3; font-size: .875rem; text-decoration: underline; cursor: pointer; }
@media (max-width: 850px) {
  .analysis-layout { grid-template-columns: 1fr; gap: 16px; }
  .console-panel { height: 224px; }
  .compute-log { min-height: 100px; }
  .compute-stage { min-height: 2.3em; }
  .compute-metrics dt { min-height: auto; }
}
@media (max-width: 450px) {
  [data-state='checking'] .terminal { padding: 14px 12px; }
  [data-state='checking'].app { padding: 14px 10px; }
  .compute-heading { gap: 9px; }
  .compute-heading > span:nth-child(2) { font-size: .75rem; }
  .terminal-toggle { padding: 6px 8px; }
  .quantum-viewport { height: 260px; }
  .geometry-count { display: block; font-size: .75rem; right: 8px; }
  .compute-metrics { grid-template-columns: 1fr 1fr; }
  .instrument-row { gap: 10px; }
  .cluster-grid { gap: 3px; }
  .calculation-summary dl > div { align-items: start; gap: 12px; }
  .calculation-summary dd { max-width: 52%; flex-shrink: 1; }
  .architecture-dialog { padding: 38px 22px 24px; }
  .compute-progress-row { font-size: .75rem; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }