:root {
  --ink: #06131f;
  --navy: #071928;
  --navy-2: #0c2235;
  --panel: rgba(11, 37, 53, .78);
  --panel-solid: #0d2639;
  --line: rgba(155, 218, 220, .18);
  --muted: #86a7ae;
  --paper: #e8f4ef;
  --paper-soft: #b9d4cf;
  --mint: #53e0b2;
  --teal: #1cbda0;
  --ice: #8bd7ff;
  --blue: #4e8dff;
  --gold: #f5d58a;
  --danger: #ff9b8e;
  --shadow: 0 22px 70px rgba(0,0,0,.25);
  --radius: 22px;
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--navy); }
body { margin: 0; color: var(--paper); background: radial-gradient(circle at 68% -4%, rgba(62,113,164,.18), transparent 32rem), var(--navy); line-height: 1.55; overflow-x: hidden; }
body.light-mode { --navy: #eef8f4; --navy-2: #e3f3ef; --ink: #e8f4ef; --panel: rgba(255,255,255,.88); --panel-solid: #fff; --line: rgba(19,88,91,.18); --muted: #4f7374; --paper: #092333; --paper-soft: #3b5b61; --shadow: 0 22px 70px rgba(30,80,77,.14); color-scheme: light; background: radial-gradient(circle at 72% -5%, rgba(111,205,186,.22), transparent 35rem), var(--navy); }
body.motion-paused *, body.motion-paused *::before, body.motion-paused *::after { animation-play-state: paused !important; transition-duration: .01ms !important; }
.site-noise { position: fixed; inset: 0; pointer-events: none; opacity: .04; z-index: 20; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E"); mix-blend-mode: screen; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button { cursor: pointer; }
.topbar { width: min(1400px, calc(100% - 48px)); height: 82px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; position: absolute; z-index: 10; top: 0; left: 50%; transform: translateX(-50%); }
.brand, .footer-brand { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; }
.brand-mark { display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid rgba(83,224,178,.68); transform: rotate(45deg); position: relative; box-shadow: 0 0 22px rgba(83,224,178,.18); }
.brand-mark::before, .brand-mark::after, .brand-mark span { content: ""; position: absolute; width: 12px; height: 12px; border: 1px solid var(--gold); border-radius: 50% 0 50% 0; transform: rotate(-45deg); }
.brand-mark::before { top: -5px; left: 10px; }.brand-mark::after { bottom: -5px; right: 10px; }.brand-mark span { border-color: var(--mint); transform: rotate(45deg); width: 8px; height: 8px; }
.brand-text { display: flex; flex-direction: column; gap: 0; line-height: 1.05; letter-spacing: .12em; }.brand-text strong { font: 700 12px/1 Space Grotesk, sans-serif; }.brand-text em { font: normal 9px/1.4 DM Mono, monospace; color: var(--mint); }
.main-nav { display: flex; align-items: center; gap: clamp(12px, 2.3vw, 32px); font: 500 11px/1 DM Mono, monospace; color: var(--muted); letter-spacing: .02em; }.main-nav a { padding: 10px 0; position: relative; transition: color .25s ease; }.main-nav a::after { content: ""; position: absolute; height: 2px; left: 0; right: 100%; bottom: 2px; background: var(--mint); transition: right .25s ease; }.main-nav a:hover, .main-nav a.active { color: var(--paper); }.main-nav a:hover::after, .main-nav a.active::after { right: 0; }
.top-actions { display: flex; gap: 7px; }.icon-button { width: 34px; height: 34px; border: 1px solid var(--line); color: var(--paper); background: rgba(255,255,255,.03); border-radius: 50%; transition: border-color .2s, transform .2s, background .2s; }.icon-button:hover { transform: translateY(-2px); border-color: var(--mint); background: rgba(83,224,178,.1); }
.menu-button, .mobile-nav { display: none; }
.section-shell { width: min(1400px, calc(100% - 48px)); margin: 0 auto; }.hero { min-height: 860px; padding: 185px 0 88px; display: grid; grid-template-columns: minmax(280px, .9fr) minmax(420px, 1.1fr); gap: 40px; align-items: center; position: relative; }.hero::before { content: ""; position: absolute; width: 760px; height: 760px; border-radius: 50%; border: 1px solid rgba(102,164,211,.08); right: -290px; top: 110px; box-shadow: 0 0 0 40px rgba(53,100,137,.025), 0 0 0 110px rgba(53,100,137,.02); pointer-events: none; }
.eyebrow { margin: 0 0 17px; font: 500 10px/1.2 DM Mono, monospace; letter-spacing: .18em; color: var(--mint); }.eyebrow-dot { display: inline-block; width: 7px; height: 7px; margin-right: 8px; background: var(--mint); border-radius: 50%; box-shadow: 0 0 0 5px rgba(83,224,178,.1); }
h1, h2, h3, p { margin-top: 0; }h1, h2 { font-family: "Space Grotesk", Inter, sans-serif; letter-spacing: -.06em; }h1 { max-width: 630px; font-size: clamp(54px, 7vw, 105px); line-height: .91; margin: 0 0 30px; font-weight: 600; }h1 span, h2 span { color: var(--mint); }h2 { font-size: clamp(43px, 5vw, 74px); line-height: .95; font-weight: 600; margin-bottom: 0; }h3 { font: 600 20px/1.15 "Space Grotesk", sans-serif; margin-bottom: 0; }
.hero-lede { width: min(455px, 100%); color: var(--paper-soft); font-size: 17px; line-height: 1.7; margin-bottom: 34px; }.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }.button { border: 1px solid transparent; border-radius: 999px; padding: 15px 20px; min-height: 49px; display: inline-flex; align-items: center; justify-content: center; gap: 14px; font: 600 11px/1 Inter, sans-serif; letter-spacing: .05em; text-transform: uppercase; transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease; }.button span { font-size: 16px; line-height: 0; }.button-primary { color: #04221e; background: var(--mint); box-shadow: 0 0 0 rgba(83,224,178,0); }.button-primary:hover { transform: translateY(-3px); box-shadow: 0 10px 35px rgba(83,224,178,.22); }.button-ghost { color: var(--paper); border-color: var(--line); background: rgba(255,255,255,.025); }.button-ghost:hover { transform: translateY(-3px); border-color: var(--ice); background: rgba(139,215,255,.08); }.button-quiet { color: var(--paper-soft); background: transparent; border-color: transparent; padding-inline: 8px; }.button-quiet:hover { color: var(--paper); }.hero-meta { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 66px; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font: 10px/1 DM Mono, monospace; letter-spacing: .1em; }
.hero-visual { min-height: 530px; position: relative; display: grid; place-items: center; }.mandala-stage { width: min(540px, 100%); aspect-ratio: 1; position: relative; display: grid; place-items: center; }.mandala { width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 0 16px rgba(83,224,178,.12)); animation: breathe 7s ease-in-out infinite; }.mandala-lines { transform-origin: 210px 210px; animation: spin 38s linear infinite; }.mandala-core { fill: var(--paper); font: 700 27px "Space Grotesk"; }.lotus { animation: float 5s ease-in-out infinite; transform-origin: 210px 213px; }.energy-platform { position: absolute; width: 44%; height: 9%; border: 1px solid rgba(83,224,178,.74); border-radius: 50%; bottom: 14%; box-shadow: 0 0 24px rgba(83,224,178,.28), inset 0 0 18px rgba(83,224,178,.16); transform: perspective(100px) rotateX(60deg); animation: platform 4s ease-in-out infinite; }.orbit { position: absolute; border: 1px solid rgba(107,204,219,.22); border-radius: 50%; }.orbit-one { width: 93%; height: 27%; transform: rotate(-27deg); animation: spinTilt 28s linear infinite; }.orbit-two { width: 70%; height: 100%; transform: rotate(53deg); border-color: rgba(245,213,138,.18); animation: spinTilt 34s linear infinite reverse; }.orbit-three { width: 55%; height: 115%; transform: rotate(17deg); border-style: dashed; opacity: .6; animation: spinTilt 23s linear infinite; }.constellation, .manuscript { position: absolute; color: var(--ice); text-shadow: 0 0 14px rgba(139,215,255,.6); animation: drift 7s ease-in-out infinite; }.constellation { font: 18px/1 serif; }.c-one { top: 15%; left: 6%; color: var(--gold); }.c-two { top: 25%; right: 4%; animation-delay: -2s; }.c-three { bottom: 17%; left: 17%; animation-delay: -4s; }.c-four { bottom: 29%; right: 9%; color: var(--gold); animation-delay: -1s; }.manuscript { font: 10px/1 DM Mono, monospace; letter-spacing: .07em; opacity: .75; writing-mode: vertical-rl; }.manuscript-a { top: 18%; right: 0; }.manuscript-b { bottom: 12%; left: -4%; transform: rotate(-8deg); writing-mode: horizontal-tb; }.visual-caption { position: absolute; right: 7%; bottom: 2%; color: var(--muted); font: 9px/1 DM Mono, monospace; letter-spacing: .12em; }.live-pulse { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--mint); margin-right: 6px; box-shadow: 0 0 0 5px rgba(83,224,178,.1); animation: pulse 2s infinite; }.scroll-cue { position: absolute; bottom: 18px; left: 0; display: flex; align-items: center; gap: 12px; color: var(--muted); font: 9px/1 DM Mono, monospace; letter-spacing: .14em; }.scroll-line { width: 42px; height: 1px; background: var(--mint); }
.intro-band { display: grid; grid-template-columns: 110px 1.2fr .8fr; gap: 28px; padding: 82px 0 120px; border-top: 1px solid var(--line); align-items: start; }.section-index { color: var(--mint); font: 10px/1 DM Mono, monospace; letter-spacing: .16em; padding-top: 7px; }.intro-quote { max-width: 680px; color: var(--paper); font: 500 clamp(28px, 3vw, 42px)/1.1 "Space Grotesk", sans-serif; letter-spacing: -.035em; }.intro-note { padding: 8px 0 0 24px; border-left: 1px solid var(--line); color: var(--muted); font-size: 13px; }.note-label { color: var(--gold); font: 10px/1 DM Mono, monospace; letter-spacing: .15em; }.intro-note p { margin: 13px 0 0; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-bottom: 54px; }.heading-aside { max-width: 360px; color: var(--muted); font-size: 13px; line-height: 1.7; margin-bottom: 3px; }
.calculator-section, .sutra-section, .practice-section, .research-section { padding: 90px 0 120px; }.calculator-shell { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: rgba(6,20,31,.36); box-shadow: var(--shadow); }.calculator-controls { padding: 29px; background: linear-gradient(135deg, rgba(25,82,92,.3), rgba(9,27,43,.48)); }.input-wrap { position: relative; }.input-wrap label, .practice-question label, .practice-answer label { display: block; color: var(--muted); font: 10px/1 DM Mono, monospace; letter-spacing: .14em; margin: 0 0 9px; }.input-wrap input, .input-wrap select, .practice-card input, .practice-card select { border: 1px solid var(--line); border-radius: 10px; min-height: 47px; width: 100%; padding: 0 14px; background: rgba(5,20,31,.72); color: var(--paper); outline: none; transition: border-color .2s, box-shadow .2s; }.input-wrap input:focus, .input-wrap select:focus, .practice-card input:focus, .practice-card select:focus { border-color: var(--mint); box-shadow: 0 0 0 3px rgba(83,224,178,.1); }.expression-wrap input { font: 500 19px/1 DM Mono, monospace; padding-right: 40px; }.input-suffix { position: absolute; right: 15px; bottom: 10px; color: var(--mint); font: 17px DM Mono, monospace; }.input-wrap small { display: block; margin-top: 8px; color: var(--muted); font-size: 11px; }.control-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 19px; }.control-actions { display: flex; align-items: center; gap: 13px; margin-top: 22px; }.shortcut-hint { margin-left: auto; color: var(--muted); font: 10px DM Mono, monospace; }.form-message { padding: 11px 13px; border-radius: 10px; margin-top: 16px; font-size: 12px; }.form-message.error { color: #ffd1ca; border: 1px solid rgba(255,155,142,.35); background: rgba(140,53,53,.17); }.result-strip { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px; padding: 20px 29px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(0,0,0,.12); }.result-label { display: block; color: var(--muted); font: 10px DM Mono, monospace; letter-spacing: .15em; }.result-strip strong { display: block; margin-top: 4px; color: var(--mint); font: 600 33px/1 "Space Grotesk", sans-serif; letter-spacing: -.04em; }.agreement { color: var(--mint); font: 10px DM Mono, monospace; letter-spacing: .1em; white-space: nowrap; }.agreement-dot { display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--mint); }.result-context { text-align: right; color: var(--paper-soft); font: 11px DM Mono, monospace; }.comparison-grid { display: grid; grid-template-columns: 1fr 1fr; }.method-card { min-height: 350px; padding: 28px 29px 33px; }.method-card + .method-card { border-left: 1px solid var(--line); }.conventional-card { background: rgba(15,38,54,.42); }.vedic-card { background: linear-gradient(135deg, rgba(15,73,73,.36), rgba(9,30,45,.58)); }.card-topline { display: flex; align-items: start; gap: 13px; border-bottom: 1px solid var(--line); padding-bottom: 19px; }.method-number { display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid var(--line); border-radius: 50%; color: var(--paper-soft); font: 11px DM Mono, monospace; }.card-topline .eyebrow { margin-bottom: 6px; }.method-badge, .filter-button, .about-pills span { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 99px; color: var(--paper-soft); padding: 6px 9px; font: 9px DM Mono, monospace; letter-spacing: .08em; margin-left: auto; white-space: nowrap; }.method-badge.accent { color: var(--mint); border-color: rgba(83,224,178,.35); background: rgba(83,224,178,.08); }.working-area { padding-top: 22px; }.working-summary { color: var(--paper-soft); font-size: 13px; margin-bottom: 17px; }.equation-stack { display: grid; gap: 8px; }.equation { display: flex; align-items: baseline; gap: 10px; padding: 9px 12px; border-left: 2px solid rgba(139,215,255,.5); background: rgba(0,0,0,.12); font: 500 16px/1.35 DM Mono, monospace; color: var(--paper); animation: slideUp .45s both; }.equation:nth-child(2) { animation-delay: .06s; }.equation:nth-child(3) { animation-delay: .12s; }.equation:nth-child(4) { animation-delay: .18s; }.equation:nth-child(5) { animation-delay: .24s; }.equation .eq-label { min-width: 90px; color: var(--muted); font-size: 10px; }.equation.final { color: var(--mint); border-left-color: var(--mint); }.working-note { margin: 16px 0 0; color: var(--muted); font-size: 12px; }.suitability { padding: 15px; border: 1px dashed rgba(245,213,138,.3); color: var(--paper-soft); background: rgba(245,213,138,.05); border-radius: 12px; font-size: 12px; }.suitability strong { color: var(--gold); }.calculator-footnote { display: flex; gap: 13px; align-items: start; margin-top: 20px; color: var(--muted); font-size: 12px; }.calculator-footnote p { margin: 0; }.footnote-icon { flex: 0 0 auto; display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid var(--gold); color: var(--gold); border-radius: 50%; font: 11px DM Mono, monospace; }
.sutra-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 26px; }.filter-label { color: var(--muted); font: 10px DM Mono, monospace; letter-spacing: .14em; margin-right: 10px; }.filter-button { margin: 0; color: var(--muted); background: transparent; min-height: 32px; transition: all .2s; }.filter-button:hover, .filter-button.active { color: var(--ink); background: var(--mint); border-color: var(--mint); }.sutra-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 11px; }.sutra-card { border: 1px solid var(--line); border-radius: 15px; background: rgba(12,34,50,.65); transition: transform .25s, border-color .25s, background .25s; overflow: hidden; }.sutra-card:hover { transform: translateY(-4px); border-color: rgba(83,224,178,.4); background: rgba(16,54,65,.8); }.sutra-card[hidden] { display: none; }.sutra-summary { list-style: none; min-height: 167px; padding: 20px; cursor: pointer; position: relative; }.sutra-summary::-webkit-details-marker { display: none; }.sutra-index { color: var(--gold); font: 10px DM Mono, monospace; }.sutra-summary h3 { margin: 23px 0 10px; font-size: 16px; }.sutra-summary p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.4; }.open-symbol { position: absolute; right: 17px; bottom: 17px; color: var(--mint); font: 17px DM Mono, monospace; }.sutra-details { padding: 0 20px 20px; border-top: 1px solid var(--line); }.detail-row { padding-top: 17px; }.detail-label { display: block; color: var(--mint); font: 9px DM Mono, monospace; letter-spacing: .12em; margin-bottom: 6px; }.detail-row p { margin: 0; color: var(--paper-soft); font-size: 12px; }.detail-row .math-list { margin: 0; padding-left: 16px; color: var(--paper-soft); font: 12px/1.65 DM Mono, monospace; }
.practice-layout { display: grid; grid-template-columns: 280px 1fr; gap: 12px; }.practice-rail { padding: 28px; border: 1px solid var(--line); border-radius: var(--radius) 0 0 var(--radius); background: rgba(12,35,51,.55); }.practice-stat { display: flex; flex-direction: column; gap: 6px; }.stat-number { color: var(--mint); font: 600 70px/.9 "Space Grotesk", sans-serif; letter-spacing: -.08em; }.stat-label { color: var(--muted); font: 10px DM Mono, monospace; letter-spacing: .1em; }.practice-rule { margin: 30px 0; height: 1px; background: var(--line); }.practice-rail .input-wrap + .input-wrap { margin-top: 18px; }.practice-note { color: var(--muted); font-size: 11px; line-height: 1.6; margin: 26px 0 0; }.practice-card { padding: 29px; border: 1px solid var(--line); border-radius: 0 var(--radius) var(--radius) 0; background: linear-gradient(135deg, rgba(20,76,77,.33), rgba(10,31,46,.62)); }.practice-card-header, .practice-actions, .practice-answer { display: flex; align-items: center; gap: 12px; }.practice-card-header { padding-bottom: 22px; border-bottom: 1px solid var(--line); }.practice-card-header .eyebrow { margin: 0; }.practice-question { margin-top: 34px; }.practice-card input { font: 500 20px DM Mono, monospace; }.practice-answer { margin-top: 18px; align-items: end; }.practice-answer > div { flex: 1; }.practice-answer .button { flex: 0 0 auto; }.practice-actions { gap: 21px; margin-top: 23px; flex-wrap: wrap; }.text-button { border: 0; padding: 0; background: none; color: var(--ice); font: 11px DM Mono, monospace; text-decoration: underline; text-decoration-color: rgba(139,215,255,.35); text-underline-offset: 4px; }.text-button:hover { color: var(--mint); }.practice-feedback { margin-top: 24px; min-height: 22px; font-size: 14px; }.practice-feedback.success { color: var(--mint); }.practice-feedback.fail { color: var(--danger); }.practice-extra { margin-top: 14px; padding: 14px; border-left: 2px solid var(--gold); background: rgba(245,213,138,.06); color: var(--paper-soft); font-size: 12px; }.practice-extra[hidden] { display: none; }
.research-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }.research-card { border: 1px solid var(--line); border-radius: 17px; padding: 28px; background: rgba(12,34,50,.58); }.research-card.large { grid-row: span 2; padding: 34px; background: linear-gradient(135deg, rgba(22,74,75,.42), rgba(10,28,43,.7)); }.research-card.wide { grid-column: 1 / -1; }.card-tag { display: block; color: var(--gold); font: 10px DM Mono, monospace; letter-spacing: .13em; margin-bottom: 19px; }.research-card h3 { max-width: 530px; font-size: clamp(23px, 3vw, 36px); line-height: 1.07; letter-spacing: -.04em; margin-bottom: 21px; }.prose { color: var(--paper-soft); font-size: 13px; line-height: 1.75; }.callout { margin-top: 30px; padding: 17px; border-left: 2px solid var(--mint); background: rgba(83,224,178,.07); }.callout span { color: var(--mint); font: 10px DM Mono, monospace; letter-spacing: .12em; }.callout p { margin: 8px 0 0; color: var(--paper); font-size: 13px; }.compact-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; counter-reset: items; }.compact-list li { color: var(--paper-soft); font-size: 12px; padding-left: 29px; position: relative; }.compact-list li::before { counter-increment: items; content: "0" counter(items); position: absolute; left: 0; top: 1px; color: var(--mint); font: 10px DM Mono, monospace; }.principle-row { display: grid; grid-template-columns: 1fr 25px 1fr 25px 1fr 25px 1fr; gap: 12px; align-items: start; }.principle-step b { display: block; color: var(--mint); font: 18px DM Mono, monospace; margin-bottom: 11px; }.principle-step span { display: block; color: var(--paper); font: 10px DM Mono, monospace; letter-spacing: .12em; }.principle-step p { color: var(--muted); font-size: 11px; line-height: 1.5; margin: 8px 0 0; }.principle-arrow { color: var(--gold); font: 20px DM Mono, monospace; padding-top: 2px; }.table-wrap { overflow-x: auto; }.research-card table { width: 100%; border-collapse: collapse; min-width: 700px; }.research-card th, .research-card td { padding: 12px 10px; border-bottom: 1px solid var(--line); text-align: left; font-size: 11px; }.research-card th { color: var(--muted); font: 9px DM Mono, monospace; letter-spacing: .08em; text-transform: uppercase; }.research-card td { color: var(--paper-soft); }.research-card td[contenteditable="true"] { outline: none; transition: background .2s; }.research-card td[contenteditable="true"]:focus { background: rgba(83,224,178,.08); color: var(--paper); }.table-note { color: var(--muted); font-size: 10px; margin: 13px 0 0; }.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }.two-col strong { color: var(--paper); font: 500 12px DM Mono, monospace; }.two-col p { color: var(--muted); font-size: 12px; margin: 9px 0 0; }
.about-section { min-height: 620px; padding: 130px 0; position: relative; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 80px; overflow: hidden; }.about-section::before { content: ""; position: absolute; left: -20%; right: 40%; bottom: -50%; height: 80%; border-top: 1px solid rgba(83,224,178,.22); border-radius: 50%; transform: rotate(-12deg); box-shadow: 0 -30px 0 -29px rgba(83,224,178,.2), 0 -65px 0 -64px rgba(83,224,178,.15); }.about-content { position: relative; z-index: 1; }.about-lede { max-width: 560px; margin: 28px 0 29px; color: var(--paper-soft); font-size: 16px; line-height: 1.75; }.about-pills { display: flex; gap: 9px; flex-wrap: wrap; }.about-pills span { margin: 0; color: var(--mint); }.about-quote { position: relative; z-index: 1; max-width: 310px; justify-self: end; }.quote-mark { color: var(--gold); font: 66px/1 "Space Grotesk"; }.about-quote p { color: var(--paper); font: 500 23px/1.25 "Space Grotesk"; letter-spacing: -.03em; }.footer { border-top: 1px solid var(--line); padding: 31px 0 39px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }.footer-brand .brand-mark { width: 27px; height: 27px; }.footer-brand strong { display: block; font: 600 12px Space Grotesk; letter-spacing: .1em; }.footer-brand small { display: block; color: var(--muted); font: 10px DM Mono; margin-top: 4px; }.footer-pattern { color: var(--gold); font-size: 18px; letter-spacing: .45em; }.footer-credit { text-align: right; color: var(--muted); font: 10px DM Mono; letter-spacing: .1em; }.footer-credit strong { color: var(--mint); }.footer-credit span { display: block; margin-top: 6px; font-size: 9px; }
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }.reveal.revealed { opacity: 1; transform: translateY(0); }
@keyframes spin { to { transform: rotate(360deg); } }@keyframes spinTilt { to { transform: rotate(413deg); } }@keyframes breathe { 0%,100% { transform: scale(.985); opacity: .92; } 50% { transform: scale(1.015); opacity: 1; } }@keyframes float { 0%,100% { transform: translateY(0) scale(.98); } 50% { transform: translateY(-8px) scale(1.02); } }@keyframes platform { 0%,100% { opacity: .55; transform: perspective(100px) rotateX(60deg) scaleX(.92); } 50% { opacity: 1; transform: perspective(100px) rotateX(60deg) scaleX(1.1); } }@keyframes drift { 0%,100% { transform: translate(0,0); opacity: .45; } 50% { transform: translate(8px,-12px); opacity: .95; } }@keyframes pulse { 50% { box-shadow: 0 0 0 9px rgba(83,224,178,0); } }@keyframes slideUp { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
body.light-mode .input-wrap input, body.light-mode .input-wrap select, body.light-mode .practice-card input, body.light-mode .practice-card select { background: rgba(241,251,248,.96); } body.light-mode .site-noise { opacity: .018; }body.light-mode .sutra-card, body.light-mode .research-card, body.light-mode .practice-rail, body.light-mode .calculator-shell { background-color: rgba(255,255,255,.5); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } .reveal { opacity: 1; transform: none; } }
@media (max-width: 1020px) { .main-nav { gap: 14px; }.main-nav a { font-size: 10px; }.hero { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); min-height: 760px; }.sutra-grid { grid-template-columns: repeat(3, 1fr); }.about-section { gap: 35px; } }
@media (max-width: 800px) { .section-shell, .topbar { width: min(100% - 30px, 560px); }.topbar { height: 68px; }.main-nav { display: none; }.menu-button { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: 0 11px; border: 1px solid var(--line); border-radius: 999px; color: var(--paper); background: rgba(255,255,255,.03); font: 9px DM Mono, monospace; letter-spacing: .1em; text-transform: uppercase; }.mobile-nav { position: fixed; z-index: 9; top: 68px; left: 15px; right: 15px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px; padding: 10px; border: 1px solid var(--line); border-radius: 15px; background: rgba(7,25,40,.96); box-shadow: var(--shadow); transform: translateY(-18px); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }.mobile-nav a { padding: 13px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--paper-soft); font: 10px DM Mono, monospace; }.mobile-nav a:hover { color: var(--mint); border-color: var(--mint); }.mobile-menu-open .mobile-nav { opacity: 1; transform: translateY(0); pointer-events: auto; }.hero { display: block; padding-top: 130px; min-height: auto; }.hero-copy { position: relative; z-index: 2; }.hero-visual { min-height: 440px; margin-top: 12px; }.hero::before { width: 520px; height: 520px; top: 270px; right: -270px; }.hero-meta { margin-top: 40px; gap: 12px; }.scroll-cue { position: relative; bottom: auto; margin-top: 11px; }.intro-band { grid-template-columns: 1fr; gap: 19px; padding: 64px 0 76px; }.intro-note { padding: 0; border-left: 0; }.section-heading { display: block; margin-bottom: 34px; }.heading-aside { margin-top: 20px; }.calculator-section, .sutra-section, .practice-section, .research-section { padding: 70px 0 80px; }.calculator-controls { padding: 20px; }.control-row, .comparison-grid, .result-strip { grid-template-columns: 1fr; }.result-strip { gap: 14px; padding: 20px; }.result-context { text-align: left; }.agreement { white-space: normal; }.method-card { min-height: 0; padding: 24px 20px 29px; }.method-card + .method-card { border-left: 0; border-top: 1px solid var(--line); }.shortcut-hint { margin-left: 0; }.sutra-grid { grid-template-columns: repeat(2, 1fr); }.sutra-summary { min-height: 180px; padding: 16px; }.sutra-details { padding: 0 16px 16px; }.practice-layout { grid-template-columns: 1fr; }.practice-rail, .practice-card { border-radius: var(--radius); }.practice-rail { padding: 22px; }.practice-stat { flex-direction: row; align-items: center; gap: 13px; }.stat-number { font-size: 53px; }.practice-rule { margin: 20px 0; }.practice-answer { display: block; }.practice-answer .button { width: 100%; margin-top: 13px; }.research-grid { grid-template-columns: 1fr; }.research-card.wide, .research-card.large { grid-column: auto; grid-row: auto; }.principle-row { grid-template-columns: 1fr 1fr; }.principle-arrow { display: none; }.two-col { grid-template-columns: 1fr; }.about-section { display: block; min-height: 650px; padding: 90px 0; }.about-quote { margin-top: 70px; }.footer { align-items: start; flex-direction: column; }.footer-credit { text-align: left; }.footer-pattern { order: 3; } }
@media (max-width: 430px) { h1 { font-size: 51px; }.hero-lede { font-size: 15px; }.hero-actions .button { width: 100%; }.hero-visual { min-height: 380px; }.manuscript-a { right: -5%; }.manuscript-b { left: 0; font-size: 8px; }.sutra-grid { grid-template-columns: 1fr; }.sutra-summary { min-height: 140px; }.practice-card { padding: 22px 18px; }.practice-actions { display: grid; gap: 14px; }.footer-pattern { font-size: 15px; } }

.vedic-method-list { display: grid; gap: 11px; }
.vedic-method-option { padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(0,0,0,.12); }
.vedic-method-option.selected { border-color: rgba(83,224,178,.55); box-shadow: inset 3px 0 0 var(--mint); background: rgba(83,224,178,.07); }
.vedic-option-head { display: flex; align-items: center; gap: 12px; padding-bottom: 11px; border-bottom: 1px solid var(--line); }
.vedic-option-head strong { display: block; color: var(--paper); font: 600 14px/1.2 "Space Grotesk", sans-serif; }
.vedic-option-head small { display: block; margin-top: 4px; color: var(--muted); font: 10px DM Mono, monospace; }
.vedic-option-head .method-badge { margin-left: auto; }
.vedic-method-option .working-summary { margin: 12px 0; font-size: 11px; }
.vedic-method-option .equation { font-size: 12px; padding: 7px 9px; }
.vedic-method-option .equation .eq-label { min-width: 78px; }
.vedic-method-option .suitability { margin-top: 12px; padding: 11px; font-size: 11px; }

.sutra-demo-button { margin-top: 18px; border: 1px solid rgba(83,224,178,.35); border-radius: 999px; padding: 9px 12px; color: var(--mint); background: rgba(83,224,178,.07); font: 10px DM Mono, monospace; }
.sutra-demo-button:hover { background: var(--mint); color: var(--ink); }
.sutra-demo-panel { margin-top: 24px; padding: 26px; border: 1px solid rgba(83,224,178,.45); border-radius: var(--radius); background: linear-gradient(135deg, rgba(18,78,77,.42), rgba(10,30,45,.72)); box-shadow: var(--shadow); }
.sutra-demo-panel[hidden] { display: none; }
.sutra-demo-head { display: flex; justify-content: space-between; gap: 20px; align-items: start; padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.sutra-demo-head h3 { font-size: 24px; }.sutra-demo-head h3 span { display: inline-block; margin-left: 10px; color: var(--gold); font-family: serif; font-weight: 400; }
.sutra-demo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding-top: 20px; }.sutra-demo-grid p { color: var(--paper-soft); font-size: 13px; }.sutra-demo-steps { grid-column: 1 / -1; }.sutra-demo-steps ol { margin: 0; padding-left: 21px; color: var(--paper); font: 13px/1.8 DM Mono, monospace; }.sutra-demo-steps li::marker { color: var(--mint); }.demo-example { color: var(--mint) !important; font: 600 19px "Space Grotesk", sans-serif !important; }
@media (max-width: 760px) { .sutra-demo-panel { padding: 20px; }.sutra-demo-grid { grid-template-columns: 1fr; gap: 15px; }.sutra-demo-steps { grid-column: auto; }.sutra-demo-head h3 { font-size: 19px; }.sutra-demo-head h3 span { display: block; margin: 7px 0 0; } }

/* CINEMATIC BLACK INTERFACE — reference-led visual layer */
:root { --navy: #000000; --navy-2: #050505; --ink: #000000; --panel: rgba(11,11,11,.82); --panel-solid: #0a0a0a; --line: rgba(255,255,255,.15); --muted: #9b9b9b; --paper: #f2f2f2; --paper-soft: #c6c6c6; --mint: #c9f3dc; --teal: #5b9e8d; --ice: #d7f8ff; --blue: #81c6d6; --gold: #f0c982; --shadow: 0 30px 100px rgba(0,0,0,.75); }
html, body { background: #000; }
body { background: radial-gradient(circle at 50% 24%, rgba(75,110,115,.16), transparent 31rem), #000; }
.site-noise { opacity: .065; mix-blend-mode: screen; }
.topbar { position: fixed; width: calc(100% - 38px); height: 76px; top: 0; padding: 0 3px; }
.brand { filter: grayscale(.25); }.brand-mark { border-color: rgba(255,255,255,.65); box-shadow: 0 0 25px rgba(255,255,255,.08); }.brand-mark::before, .brand-mark::after { border-color: rgba(255,255,255,.8); }.brand-mark span { border-color: var(--mint); }.brand-text strong { color: #fff; }.brand-text em { color: var(--mint); }
.main-nav { color: #888; }.main-nav a:hover, .main-nav a.active { color: #fff; }.main-nav a::after { background: #fff; }.icon-button, .menu-button { border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.08); color: #fff; backdrop-filter: blur(12px); }
.hero { min-height: 100svh; height: 100svh; max-width: none; width: 100%; padding: 92px 6vw 42px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; background: #000; }
.hero::before { width: 92vw; height: 92vw; max-width: 1100px; max-height: 1100px; right: 50%; top: 50%; transform: translate(50%,-50%); border-color: rgba(255,255,255,.065); box-shadow: 0 0 0 42px rgba(255,255,255,.018), 0 0 0 116px rgba(255,255,255,.012); }
.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(0,0,0,.85) 0%, transparent 22%, transparent 70%, rgba(0,0,0,.96) 100%), radial-gradient(ellipse at center, transparent 35%, rgba(0,0,0,.72) 100%); z-index: 1; }
.hero-copy { position: absolute; z-index: 3; left: 7vw; bottom: 8vh; max-width: 600px; text-shadow: 0 3px 24px #000; }.hero-copy h1 { font-size: clamp(47px, 7vw, 100px); }.hero-copy .eyebrow { color: var(--mint); }.hero-lede { color: #d0d0d0; }.hero-meta { border-top-color: rgba(255,255,255,.2); color: #aaa; }
.hero-visual { width: min(1000px, 94vw); height: min(78vh, 800px); min-height: 0; z-index: 2; position: relative; }.mandala-stage { width: min(760px, 82vw); filter: drop-shadow(0 0 42px rgba(135,220,220,.14)); }.mandala { opacity: .95; }.orbit-one, .orbit-two, .orbit-three { border-color: rgba(255,255,255,.2); }.orbit-two { border-color: rgba(240,201,130,.3); }.mandala-lines { stroke-width: 1.25; }.energy-platform { bottom: 7%; width: 48%; border-color: rgba(220,255,247,.85); box-shadow: 0 0 38px rgba(128,235,223,.44), inset 0 0 30px rgba(128,235,223,.18); }.manuscript { color: #eee; text-shadow: 0 0 18px rgba(255,255,255,.55); font-size: 11px; }.visual-caption { right: 4%; bottom: 4%; color: #c8c8c8; }.scroll-cue { z-index: 4; left: 6vw; bottom: 28px; color: #aaa; }.scroll-line { background: #fff; }
.intro-band, .calculator-section, .sutra-section, .practice-section, .research-section, .about-section { background: #000; }
.intro-band { border-top-color: rgba(255,255,255,.16); }.intro-quote, h1, h2, h3 { color: #f3f3f3; }.section-heading .heading-aside, .intro-note, .prose, .working-summary { color: #a9a9a9; }
.calculator-shell, .research-card, .practice-rail, .practice-card, .sutra-card { background: linear-gradient(145deg, rgba(22,22,22,.84), rgba(3,3,3,.92)); border-color: rgba(255,255,255,.18); box-shadow: 0 20px 70px rgba(0,0,0,.45); }.calculator-controls { background: linear-gradient(135deg, rgba(56,88,88,.23), rgba(5,5,5,.9)); }.input-wrap input, .input-wrap select, .practice-card input, .practice-card select { background: #050505; border-color: rgba(255,255,255,.22); color: #fff; }.result-strip { background: #050505; border-color: rgba(255,255,255,.18); }.result-strip strong, .equation.final, .equation.final span, .demo-example { color: var(--mint) !important; }.comparison-grid, .method-card + .method-card { border-color: rgba(255,255,255,.18); }.conventional-card, .vedic-card { background: rgba(12,12,12,.82); }.vedic-method-option { background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.16); }.vedic-method-option.selected { border-color: rgba(201,243,220,.7); background: rgba(201,243,220,.08); }
.sutra-section, .practice-section, .research-section, .about-section { border-top: 1px solid rgba(255,255,255,.07); }.sutra-filter .filter-button { background: #080808; color: #aaa; }.filter-button:hover, .filter-button.active { color: #000; background: #fff; border-color: #fff; }.sutra-card:hover { background: #151515; border-color: rgba(255,255,255,.4); }.sutra-demo-panel { background: linear-gradient(145deg, #171717, #030303); border-color: rgba(201,243,220,.5); }
.button-primary { color: #000; background: #f1f1f1; box-shadow: 0 0 30px rgba(255,255,255,.1); }.button-primary:hover { box-shadow: 0 12px 40px rgba(255,255,255,.2); }.button-ghost { border-color: rgba(255,255,255,.3); color: #fff; background: rgba(255,255,255,.06); }.button-ghost:hover { border-color: #fff; background: rgba(255,255,255,.14); }.method-badge.accent { color: var(--mint); border-color: rgba(201,243,220,.45); background: rgba(201,243,220,.08); }
.about-section::before { border-color: rgba(255,255,255,.16); box-shadow: 0 -30px 0 -29px rgba(255,255,255,.1), 0 -65px 0 -64px rgba(255,255,255,.08); }.footer { border-color: rgba(255,255,255,.18); background: #000; }
@media (max-width: 800px) { .hero { padding: 72px 0 0; min-height: 100svh; height: 100svh; }.hero-visual { width: 100vw; height: 69svh; margin: 0; align-self: flex-start; }.mandala-stage { width: 112vw; max-width: 720px; }.hero-copy { left: 20px; right: 20px; bottom: 8vh; max-width: none; }.hero-copy h1 { font-size: clamp(42px, 12vw, 68px); margin-bottom: 15px; }.hero-copy .hero-lede { font-size: 13px; max-width: 370px; margin-bottom: 17px; }.hero-copy .hero-actions { gap: 8px; }.hero-copy .button { min-height: 42px; padding: 12px 15px; font-size: 9px; }.hero-meta { display: none; }.visual-caption { bottom: 1%; right: 5%; font-size: 8px; }.manuscript-a { right: 0; }.manuscript-b { left: 4%; bottom: 9%; }.scroll-cue { display: none; }.topbar { width: calc(100% - 28px); }.brand-text { display: none; }.mobile-nav { background: rgba(0,0,0,.96); border-color: rgba(255,255,255,.2); }.mobile-nav a { color: #eee; border-color: rgba(255,255,255,.16); }.section-shell { width: min(100% - 30px, 560px); }.intro-band { padding-top: 64px; } }
@media (min-width: 801px) { .hero-copy { left: 7vw; bottom: 8vh; }.hero-visual { transform: translateY(-3vh); }.main-nav { opacity: .88; } }
@media (prefers-reduced-motion: reduce) { .hero::after { opacity: .9; } }

/* NCST SUBMISSION MODE — fast blue-purple introduction and geometric lotus */
:root { --ncst-blue: #79c9ff; --ncst-purple: #9f82ff; --ncst-deep: #05051b; --ncst-violet: #20164d; }
body { background: radial-gradient(circle at 50% 24%, rgba(79,103,255,.15), transparent 30rem), #000; }
.site-noise { display: none; }
.hero { background: radial-gradient(ellipse at 50% 54%, rgba(47,44,121,.3), transparent 42%), #000; }
.hero::after { background: linear-gradient(180deg, rgba(0,0,0,.9) 0%, transparent 24%, transparent 72%, rgba(0,0,0,.98) 100%), radial-gradient(ellipse at center, transparent 30%, rgba(0,0,0,.78) 100%); }
.hero-copy h1 span, h1 span, h2 span { color: var(--ncst-blue); text-shadow: 0 0 28px rgba(121,201,255,.16); }
.hero-copy .eyebrow, .eyebrow { color: var(--ncst-blue); }.eyebrow-dot { background: var(--ncst-purple); box-shadow: 0 0 0 5px rgba(159,130,255,.12); }
.mandala-stage { filter: drop-shadow(0 0 48px rgba(121,201,255,.18)) drop-shadow(0 0 80px rgba(159,130,255,.1)); }.mandala-lines { animation-duration: 52s; }.lotus { filter: drop-shadow(0 0 12px rgba(159,130,255,.4)); }.energy-platform { border-color: rgba(121,201,255,.9); box-shadow: 0 0 34px rgba(121,201,255,.42), inset 0 0 24px rgba(159,130,255,.24); }
.button-primary { background: linear-gradient(100deg, #f4f3ff, #c7dfff); }.button-ghost:hover { border-color: var(--ncst-blue); background: rgba(121,201,255,.12); }.result-strip strong, .equation.final, .equation.final span, .demo-example { color: var(--ncst-blue) !important; }.method-badge.accent { color: var(--ncst-blue); border-color: rgba(121,201,255,.45); background: rgba(121,201,255,.08); }
.intro-band { background: linear-gradient(120deg, rgba(27,20,76,.25), transparent 60%), #000; }.intro-quote { color: #f6f3ff; }.intro-note { border-color: rgba(159,130,255,.35); }.note-label, .card-tag { color: var(--ncst-purple); }
.calculator-shell, .research-card, .practice-rail, .practice-card, .sutra-card { background: linear-gradient(145deg, rgba(14,17,48,.83), rgba(3,3,16,.94)); }.calculator-controls { background: linear-gradient(135deg, rgba(39,40,112,.34), rgba(5,5,24,.95)); }.vedic-method-option.selected { border-color: rgba(121,201,255,.7); background: rgba(121,201,255,.08); }.sutra-demo-panel { background: linear-gradient(145deg, rgba(34,24,86,.8), rgba(3,3,16,.96)); border-color: rgba(159,130,255,.5); }
.sutra-section, .practice-section, .research-section, .about-section { border-top-color: rgba(121,201,255,.12); }.filter-button:hover, .filter-button.active { color: #05051b; background: linear-gradient(100deg, var(--ncst-blue), #d6c6ff); border-color: transparent; }.sutra-demo-button { color: var(--ncst-blue); border-color: rgba(121,201,255,.38); background: rgba(121,201,255,.07); }.sutra-demo-button:hover { color: #05051b; background: var(--ncst-blue); }
.abstract-card { border-color: rgba(159,130,255,.42); background: linear-gradient(105deg, rgba(41,29,99,.6), rgba(9,13,37,.85)); }.abstract-card h3 { max-width: 820px; }
@media (max-width: 800px) { .hero { background: radial-gradient(ellipse at 50% 42%, rgba(55,51,145,.34), transparent 52%), #000; }.hero-copy h1 { text-shadow: 0 2px 18px #000; } }
@media (prefers-reduced-motion: reduce) { .mandala-lines, .mandala, .lotus, .energy-platform, .constellation, .manuscript { animation: none !important; } }

.comparison-metrics { display: grid; grid-template-columns: 1fr 1.2fr 1fr; gap: 12px; margin-top: 14px; padding: 14px; border: 1px solid rgba(121,201,255,.22); border-radius: 14px; background: linear-gradient(100deg, rgba(38,31,92,.45), rgba(7,10,28,.8)); text-align: center; }
.comparison-metrics > div { display: grid; gap: 4px; align-content: center; min-height: 60px; }.comparison-metrics strong { color: var(--ncst-blue); font: 600 16px "Space Grotesk", sans-serif; }.comparison-metrics small { color: var(--muted); font-size: 10px; }.metric-label { color: var(--ncst-purple); font: 10px DM Mono, monospace; letter-spacing: .12em; }.metric-signal { border-left: 1px solid rgba(255,255,255,.13); border-right: 1px solid rgba(255,255,255,.13); }.metric-signal .agreement-dot { display: inline-block; margin: 0 auto; }.metric-signal strong { font-size: 12px; }
@media (max-width: 760px) { .comparison-metrics { grid-template-columns: 1fr; gap: 12px; }.metric-signal { padding: 12px 0; border-left: 0; border-right: 0; border-top: 1px solid rgba(255,255,255,.13); border-bottom: 1px solid rgba(255,255,255,.13); } }

.metric-track { width: 100%; height: 5px; margin: 3px auto; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.1); }.metric-track span { display: block; width: 12%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--ncst-purple), var(--ncst-blue)); transition: width .3s ease; }.comparison-metrics small::after { content: ' · not a time measurement'; color: rgba(255,255,255,.45); }

.speed-board { margin: 14px 0 0; padding: 18px; border: 1px solid rgba(121,201,255,.25); border-radius: 16px; background: linear-gradient(105deg, rgba(33,29,86,.9), rgba(8,10,25,.95)); }.speed-board-head { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:14px; }.speed-board h3 { margin:4px 0 0; font-size:20px; }.speed-note { color:var(--gold); font:10px DM Mono,monospace; letter-spacing:.12em; text-align:right; }.speed-table { display:grid; gap:1px; overflow:hidden; border:1px solid rgba(255,255,255,.12); border-radius:10px; }.speed-row { display:grid; grid-template-columns: 1.1fr .8fr 1.5fr 1.4fr; gap:12px; align-items:center; min-height:42px; padding:8px 12px; background:rgba(255,255,255,.035); color:var(--muted); font-size:12px; }.speed-row-head { min-height:30px; color:var(--muted-2); background:rgba(0,0,0,.25); font:9px DM Mono,monospace; letter-spacing:.08em; }.speed-row strong { color:var(--white); }.speed-line { height:8px; overflow:hidden; border-radius:99px; background:rgba(255,255,255,.1); }.speed-line span { display:block; width:12%; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--ncst-purple),var(--ncst-blue)); transition:width .35s ease; }.speed-footnote { margin:12px 0 0; color:var(--muted-2); font-size:11px; }.speed-footnote::before { content:'i'; display:inline-grid; place-items:center; width:16px; height:16px; margin-right:6px; border:1px solid var(--gold); border-radius:50%; color:var(--gold); font:11px serif; }
@media (max-width: 760px) { .speed-board-head { align-items:flex-start; flex-direction:column; }.speed-note { text-align:left; }.speed-row { grid-template-columns: 1fr .55fr; gap:7px 12px; }.speed-row-head { display:none; }.speed-row .speed-line, .speed-row span:last-child { grid-column:1 / -1; }.speed-row .speed-line { order:3; } }

.project-event { margin: 16px 0 0; color: var(--ncst-blue); font: 600 12px DM Mono, monospace; letter-spacing: .09em; text-transform: uppercase; }