:root {
  --bg: #070812;
  --bg-soft: #0d1020;
  --panel: rgba(18, 22, 43, .72);
  --panel-strong: rgba(13, 16, 32, .92);
  --text: #f4f5ff;
  --muted: #aeb5d1;
  --dim: #747d9e;
  --line: rgba(210, 218, 255, .13);
  --purple: #9c7cff;
  --violet: #6d5dfc;
  --cyan: #52e2ff;
  --blue: #368cff;
  --gold: #f5d384;
  --green: #58efb1;
  --danger: #ff7ca9;
  --shadow: 0 24px 80px rgba(0, 0, 0, .38);
  --radius: 26px;
  --font-display: "Arial Black", "Helvetica Neue", Arial, sans-serif;
  --font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--text);
  background:
    radial-gradient(circle at 85% 5%, rgba(108, 82, 255, .15), transparent 28rem),
    radial-gradient(circle at 10% 52%, rgba(37, 196, 255, .08), transparent 31rem),
    linear-gradient(180deg, #090b17 0%, #070812 58%, #05060d 100%);
  font-family: var(--font-body);
  overflow-x: hidden;
}
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.scroll-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 999; background: rgba(255,255,255,.03); }
.scroll-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--purple), var(--cyan)); box-shadow: 0 0 18px rgba(82,226,255,.45); }
.noise { position: fixed; inset: 0; pointer-events: none; z-index: 50; opacity: .035; 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='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); }
.ambient { position: fixed; border-radius: 50%; filter: blur(80px); pointer-events: none; z-index: -1; }
.ambient-a { width: 34rem; height: 34rem; top: 8rem; right: -16rem; background: rgba(128, 83, 255, .18); }
.ambient-b { width: 28rem; height: 28rem; left: -15rem; top: 46%; background: rgba(49, 193, 255, .11); }
.section-shell { width: min(1240px, calc(100% - 2rem)); margin-inline: auto; }
.site-header {
  position: sticky; top: 0; z-index: 100; min-height: 76px; padding: .9rem max(1rem, calc((100vw - 1240px)/2));
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  background: rgba(7, 8, 18, .72); backdrop-filter: blur(20px); border-bottom: 1px solid rgba(255,255,255,.07);
}
.brand { display: flex; align-items: center; gap: .85rem; text-decoration: none; }
.brand-mark { position: relative; width: 44px; aspect-ratio: 1; display: grid; place-items: center; }
.brand-core { width: 13px; aspect-ratio: 1; border-radius: 50%; background: linear-gradient(135deg, var(--cyan), var(--purple)); box-shadow: 0 0 18px rgba(82,226,255,.55); }
.brand-ring { position: absolute; inset: 4px; border: 1px solid rgba(149,127,255,.75); border-radius: 50%; animation: spin 8s linear infinite; }
.brand-ring::after { content: ""; position: absolute; width: 5px; aspect-ratio: 1; border-radius: 50%; top: -3px; left: 50%; background: var(--cyan); box-shadow: 0 0 8px var(--cyan); }
.ring-two { inset: 0; border-color: rgba(82,226,255,.3); animation-duration: 12s; animation-direction: reverse; }
.brand-copy { display: grid; line-height: 1; gap: .28rem; }
.brand-copy strong { font-family: var(--font-display); letter-spacing: .05em; font-size: .96rem; }
.brand-copy small { font-size: .62rem; letter-spacing: .14em; color: var(--muted); }
.main-nav { display: flex; align-items: center; gap: 1.2rem; }
.main-nav a, .main-nav button { border: 0; background: none; text-decoration: none; color: var(--muted); font-size: .86rem; cursor: pointer; padding: .5rem 0; }
.main-nav a:hover, .main-nav button:hover { color: var(--text); }
.nav-pdf { border: 1px solid rgba(156,124,255,.42) !important; padding: .68rem .9rem !important; border-radius: 999px; color: #dcd5ff !important; background: rgba(156,124,255,.08) !important; }
.menu-toggle { display: none; width: 44px; height: 40px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.04); place-items: center; cursor: pointer; }
.menu-toggle span:not(.sr-only) { display: block; width: 18px; height: 1px; background: var(--text); margin: 4px auto; }
.hero { min-height: calc(100vh - 76px); padding-block: clamp(4rem, 10vh, 8rem); display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(2rem, 6vw, 6rem); position: relative; }
.hero-grid { position: absolute; inset: 0; opacity: .13; pointer-events: none; background-image: linear-gradient(rgba(135,154,220,.16) 1px, transparent 1px), linear-gradient(90deg, rgba(135,154,220,.16) 1px, transparent 1px); background-size: 58px 58px; mask-image: radial-gradient(circle at 72% 45%, black 0, transparent 60%); }
.overline { display: inline-block; color: #cfc6ff; font-size: .72rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.hero h1 { margin: 1rem 0 1.4rem; font-family: var(--font-display); font-size: clamp(3.35rem, 7.7vw, 7.3rem); line-height: .94; letter-spacing: -.055em; }
.hero-line { display: block; }
.gradient-text { color: transparent; background: linear-gradient(110deg, #f5f3ff 0%, #b9a9ff 35%, #61dfff 72%, #f5d384 110%); -webkit-background-clip: text; background-clip: text; background-size: 180% auto; animation: gradientFlow 7s ease-in-out infinite alternate; }
.hero-deck { margin: 0; max-width: 700px; color: var(--muted); font-size: clamp(1.06rem, 1.7vw, 1.28rem); line-height: 1.75; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .9rem; margin-top: 2rem; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .8rem; min-height: 50px; padding: .85rem 1.2rem; border-radius: 14px; border: 1px solid var(--line); text-decoration: none; cursor: pointer; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.button:hover { transform: translateY(-2px); }
.button.primary { color: #090b17; background: linear-gradient(115deg, #ae95ff, #5be2ff); border-color: transparent; font-weight: 850; box-shadow: 0 15px 35px rgba(76,145,255,.18); }
.button.secondary { background: rgba(255,255,255,.045); color: var(--text); }
.button.large { min-height: 58px; padding-inline: 1.5rem; }
.text-link { text-underline-offset: 4px; color: var(--muted); font-size: .87rem; }
.hero-metrics { display: flex; flex-wrap: wrap; gap: 2.2rem; margin-top: 3rem; }
.hero-metrics div { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .65rem; max-width: 180px; }
.hero-metrics strong { font-family: var(--font-display); font-size: 1.8rem; color: #d9d1ff; }
.hero-metrics span { color: var(--dim); font-size: .76rem; line-height: 1.35; text-transform: uppercase; letter-spacing: .05em; }
.hero-orbit { display: grid; place-items: center; }
.orbit-stage { position: relative; width: min(500px, 88vw); aspect-ratio: 1; }
.orbit-stage::before { content: ""; position: absolute; inset: 8%; border-radius: 50%; background: radial-gradient(circle, rgba(106,84,251,.18), transparent 62%); filter: blur(14px); }
.orbit-center { position: absolute; left: 50%; top: 50%; width: 142px; aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; text-align: center; background: radial-gradient(circle at 35% 25%, rgba(112,96,255,.48), rgba(16,20,43,.9) 55%); border: 1px solid rgba(153,132,255,.48); box-shadow: inset 0 0 32px rgba(69,61,205,.22), 0 0 60px rgba(82,93,255,.18); }
.orbit-center strong { font-family: var(--font-display); letter-spacing: -.02em; font-size: 1.05rem; z-index: 2; }
.pulse { position: absolute; inset: -8px; border: 1px solid rgba(82,226,255,.3); border-radius: 50%; animation: pulse 2.8s ease-out infinite; }
.orbit-path { position: absolute; border: 1px solid rgba(137,148,207,.2); border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.orbit-path-a { width: 64%; aspect-ratio: 1; }
.orbit-path-b { width: 92%; aspect-ratio: 1; border-style: dashed; animation: spin 35s linear infinite; }
.orbit-node { position: absolute; width: 82px; aspect-ratio: 1; border-radius: 23px; display: grid; place-items: center; text-align: center; background: linear-gradient(145deg, rgba(30,36,68,.95), rgba(12,14,27,.96)); border: 1px solid rgba(170,177,226,.18); box-shadow: 0 14px 32px rgba(0,0,0,.28); animation: float 5s ease-in-out infinite; }
.orbit-node span { font-family: var(--font-display); font-size: 1.2rem; color: #d8d2ff; }
.orbit-node small { color: var(--dim); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }
.node-llm { left: 5%; top: 14%; }
.node-voice { right: 4%; top: 17%; animation-delay: -1.2s; }
.node-human { left: 12%; bottom: 8%; animation-delay: -2.2s; }
.node-publish { right: 10%; bottom: 10%; animation-delay: -.6s; }
.orbit-caption { margin-top: 1.4rem; color: var(--muted); font-size: .78rem; display: flex; align-items: center; gap: .55rem; }
.status-dot { width: 8px; aspect-ratio: 1; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); }
.ticker { overflow: hidden; border-block: 1px solid rgba(255,255,255,.07); background: rgba(14,17,32,.66); }
.ticker-track { width: max-content; display: flex; align-items: center; gap: 1.5rem; padding: .95rem 0; animation: ticker 27s linear infinite; }
.ticker-track span { color: #c8cee4; font-weight: 800; font-size: .72rem; letter-spacing: .14em; }
.ticker-track i { color: var(--purple); font-style: normal; }
.split-section { padding-block: clamp(6rem, 10vw, 10rem); display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(2rem, 8vw, 7rem); align-items: start; }
.section-number { display: block; color: var(--purple); font-family: var(--font-display); font-size: .88rem; margin-bottom: .7rem; }
.section-intro h2, .section-heading h2, .proof-copy h2, .address-copy h2, .blackpaper-copy h2, .finale h2 { margin: .65rem 0 0; font-family: var(--font-display); font-size: clamp(2.4rem, 5vw, 5.4rem); line-height: 1.02; letter-spacing: -.045em; }
.premise-copy { padding-top: .4rem; }
.large-copy { margin: 0; color: #d4d8e9; font-size: clamp(1.25rem, 2.2vw, 1.8rem); line-height: 1.65; }
blockquote { margin: 3rem 0 0; padding: 1.5rem 0 1.5rem 2rem; border-left: 2px solid var(--purple); display: grid; gap: .25rem; font-size: clamp(1.35rem, 2.5vw, 2rem); }
blockquote span { color: var(--muted); }
blockquote strong { color: #e7e3ff; }
.section-heading { padding-top: clamp(5rem, 9vw, 9rem); display: grid; grid-template-columns: .7fr 1.1fr .7fr; gap: 2rem; align-items: end; }
.section-heading.compact { grid-template-columns: .7fr 1.8fr; }
.section-heading p { color: var(--muted); line-height: 1.65; margin: 0 0 .4rem; }
.engine-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; padding: 3.5rem 0 8rem; }
.engine-card { min-height: 520px; padding: 1.6rem; border-radius: var(--radius); position: relative; overflow: hidden; background: linear-gradient(150deg, rgba(26,31,60,.87), rgba(11,13,27,.92)); border: 1px solid var(--line); box-shadow: var(--shadow); transform-style: preserve-3d; transition: transform .2s ease; }
.engine-card::after { content: ""; position: absolute; width: 220px; aspect-ratio: 1; right: -100px; bottom: -120px; background: radial-gradient(circle, rgba(118,82,255,.18), transparent 70%); }
.engine-index { font-family: var(--font-display); color: var(--dim); font-size: .7rem; letter-spacing: .12em; }
.engine-icon { width: 70px; aspect-ratio: 1; border-radius: 22px; margin: 3rem 0 2rem; display: grid; place-items: center; font-family: var(--font-display); font-size: 2rem; color: #d8d1ff; background: rgba(156,124,255,.11); border: 1px solid rgba(156,124,255,.25); }
.voice-icon { grid-auto-flow: column; align-items: center; gap: 4px; }
.voice-icon span { width: 4px; height: 13px; border-radius: 5px; background: linear-gradient(var(--cyan), var(--purple)); animation: voiceWave 1s ease-in-out infinite alternate; }
.voice-icon span:nth-child(2) { height: 31px; animation-delay: -.2s; }
.voice-icon span:nth-child(3) { height: 22px; animation-delay: -.45s; }
.voice-icon span:nth-child(4) { height: 39px; animation-delay: -.7s; }
.human-icon { border-color: rgba(245,211,132,.28); color: var(--gold); background: rgba(245,211,132,.08); }
.engine-card h3 { margin: 0; font-family: var(--font-display); font-size: 1.45rem; }
.engine-card p { min-height: 108px; color: var(--muted); line-height: 1.65; }
.engine-card ul { list-style: none; padding: 0; margin: 1.6rem 0 0; display: grid; gap: .8rem; }
.engine-card li { color: #cdd2e5; font-size: .86rem; padding-bottom: .75rem; border-bottom: 1px solid rgba(255,255,255,.07); }
.workflow-section { background: linear-gradient(180deg, rgba(19,23,45,.72), rgba(9,11,22,.45)); border-block: 1px solid rgba(255,255,255,.06); }
.workflow-line { display: grid; grid-template-columns: repeat(4, 1fr); padding: 4rem 0 7rem; position: relative; }
.workflow-line::before { content: ""; position: absolute; left: 8%; right: 8%; top: 5.1rem; height: 1px; background: linear-gradient(90deg, transparent, rgba(156,124,255,.6), rgba(82,226,255,.6), transparent); }
.workflow-step { position: relative; padding-right: 2rem; }
.step-number { color: var(--dim); font-family: var(--font-display); font-size: .72rem; }
.step-marker { width: 22px; aspect-ratio: 1; border-radius: 50%; padding: 5px; border: 1px solid rgba(82,226,255,.42); margin: 1.6rem 0 2rem; background: var(--bg-soft); position: relative; z-index: 1; }
.step-marker span { display: block; width: 100%; height: 100%; border-radius: 50%; background: linear-gradient(var(--cyan), var(--purple)); box-shadow: 0 0 15px rgba(82,226,255,.5); }
.workflow-step h3 { margin: 0 0 .7rem; font-family: var(--font-display); font-size: 1.4rem; }
.workflow-step p { margin: 0; color: var(--muted); line-height: 1.65; font-size: .9rem; }
.anatomy-explorer { margin: 3.5rem 0 8rem; border: 1px solid var(--line); border-radius: 30px; overflow: hidden; background: linear-gradient(145deg, rgba(21,26,52,.85), rgba(9,11,23,.95)); box-shadow: var(--shadow); }
.layer-tabs { display: flex; overflow-x: auto; gap: .2rem; padding: .75rem; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.02); }
.layer-tab { border: 0; border-radius: 999px; padding: .78rem 1rem; background: transparent; color: var(--dim); cursor: pointer; white-space: nowrap; }
.layer-tab.active { color: #090b17; font-weight: 800; background: linear-gradient(115deg, #aa92ff, #5ce1ff); }
.layer-display { min-height: 440px; display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 3rem; padding: clamp(2rem, 5vw, 5rem); }
.layer-visual { min-height: 300px; position: relative; display: grid; place-items: center; }
.layer-orb { width: 160px; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; color: #0b0d18; font-family: var(--font-display); font-size: 2rem; background: linear-gradient(145deg, #c5b5ff, #51dfff); box-shadow: 0 0 65px rgba(97,166,255,.28); position: relative; z-index: 2; transition: background .4s ease, transform .4s ease; }
.layer-rings i { position: absolute; left: 50%; top: 50%; border: 1px solid rgba(152,154,210,.22); border-radius: 50%; transform: translate(-50%, -50%); }
.layer-rings i:nth-child(1) { width: 220px; aspect-ratio: 1; animation: pulseRing 4s ease-in-out infinite; }
.layer-rings i:nth-child(2) { width: 290px; aspect-ratio: 1; border-style: dashed; animation: spin 24s linear infinite; }
.layer-rings i:nth-child(3) { width: 355px; aspect-ratio: 1; opacity: .55; }
.layer-label { color: var(--cyan); font-size: .7rem; font-weight: 800; letter-spacing: .13em; }
.layer-content h3 { margin: .8rem 0 1rem; font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3.6rem); line-height: 1.04; }
.layer-content p { color: var(--muted); line-height: 1.75; max-width: 660px; }
.layer-tags { display: flex; gap: .55rem; flex-wrap: wrap; margin-top: 1.5rem; }
.layer-tags span { padding: .55rem .75rem; border: 1px solid var(--line); border-radius: 999px; color: #cbd1e7; font-size: .76rem; background: rgba(255,255,255,.025); }
.demo-section { padding-bottom: 8rem; }
.wotd-console { margin-top: 3.5rem; border-radius: 30px; overflow: hidden; border: 1px solid rgba(132,149,219,.16); background: rgba(9,11,23,.92); box-shadow: 0 30px 90px rgba(0,0,0,.42); }
.console-header, .console-footer { min-height: 66px; padding: 1rem 1.3rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: rgba(255,255,255,.025); }
.console-header { border-bottom: 1px solid var(--line); }
.console-footer { border-top: 1px solid var(--line); }
.console-brand { font-family: var(--font-display); margin-right: 1rem; }
.console-status { color: var(--dim); font-size: .7rem; letter-spacing: .1em; }
.console-status i { display: inline-block; width: 7px; aspect-ratio: 1; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px var(--green); margin-right: .35rem; }
.console-address { color: var(--dim); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .75rem; }
.console-body { min-height: 520px; display: grid; grid-template-columns: .8fr 1.2fr; }
.word-panel { padding: clamp(2rem, 5vw, 4.2rem); border-right: 1px solid var(--line); background: radial-gradient(circle at 0 0, rgba(103,83,255,.11), transparent 28rem); }
.part-of-speech { color: var(--gold); letter-spacing: .16em; font-size: .68rem; font-weight: 800; }
.word-panel h3 { margin: .8rem 0 .25rem; font-family: var(--font-display); font-size: clamp(3.2rem, 7vw, 6rem); line-height: .9; letter-spacing: -.05em; }
.phonetic { color: var(--cyan); font-size: 1rem; letter-spacing: .04em; }
.word-panel p { color: var(--muted); line-height: 1.7; max-width: 450px; margin-top: 2rem; }
.word-controls { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .65rem; margin-top: 2.4rem; }
.demo-control { text-align: left; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: rgba(255,255,255,.025); cursor: pointer; }
.demo-control.active { color: var(--text); border-color: rgba(82,226,255,.42); background: rgba(82,226,255,.07); box-shadow: inset 3px 0 0 var(--cyan); }
.media-stage { position: relative; overflow: hidden; background: radial-gradient(circle at 50% 20%, rgba(72,77,135,.18), transparent 55%), linear-gradient(180deg, #101426, #090b16); }
.stage-scene { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity .45s ease, transform .45s ease; transform: scale(1.025); display: grid; place-items: center; }
.stage-scene.active { opacity: 1; pointer-events: auto; transform: scale(1); }
.scene-caption { position: absolute; left: 1.3rem; right: 1.3rem; bottom: 1.55rem; padding: 1rem 1.15rem; border-radius: 15px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: rgba(7,9,18,.72); border: 1px solid var(--line); backdrop-filter: blur(12px); }
.scene-caption strong { font-family: var(--font-display); letter-spacing: .04em; }
.scene-caption span { color: var(--muted); font-size: .78rem; }
.building { position: relative; width: 250px; height: 260px; filter: drop-shadow(0 32px 35px rgba(0,0,0,.45)); }
.building .wall { position: absolute; left: 30px; right: 30px; bottom: 20px; height: 185px; background: linear-gradient(145deg, #52576b, #272b3a); clip-path: polygon(0 6%, 10% 0, 36% 4%, 61% 0, 100% 9%, 95% 100%, 6% 100%); }
.building .roof { position: absolute; left: 13px; right: 14px; top: 26px; height: 78px; background: #333749; clip-path: polygon(0 100%, 50% 0, 100% 100%, 79% 87%, 51% 18%, 22% 91%); }
.window { position: absolute; width: 47px; height: 55px; top: 118px; background: #121521; border: 5px solid #777b88; z-index: 2; box-shadow: inset 0 0 14px rgba(0,0,0,.8); }
.w1 { left: 62px; transform: rotate(-3deg); }
.w2 { right: 62px; transform: rotate(4deg); }
.door { position: absolute; width: 52px; height: 84px; bottom: 20px; left: 99px; z-index: 2; background: #1c1f2a; border: 5px solid #575b68; transform: skewY(-2deg); }
.crack { position: absolute; width: 3px; height: 66px; background: #141620; z-index: 3; transform-origin: top; }
.c1 { top: 105px; left: 127px; transform: rotate(18deg); }
.c2 { top: 143px; right: 75px; transform: rotate(-22deg); }
.mouth-cue { width: 210px; height: 120px; border-radius: 50%; position: relative; background: linear-gradient(180deg, #df9b9f, #8d454e); box-shadow: 0 25px 60px rgba(0,0,0,.35); animation: mouthTalk 1.2s ease-in-out infinite; }
.mouth-cue span { position: absolute; inset: 32px 25px; border-radius: 50%; background: #321a25; border: 6px solid #f0c4c2; }
.syllable-line { position: absolute; bottom: 32%; display: flex; align-items: center; gap: .8rem; color: var(--muted); font-size: 1.5rem; }
.syllable-line strong { color: var(--cyan); font-size: 2rem; }
.syllable-line i { color: var(--dim); font-style: normal; }
.character-avatar { position: relative; width: 230px; height: 300px; transform: translateX(-90px); }
.avatar-head { position: absolute; left: 42px; top: 12px; width: 145px; height: 160px; border-radius: 48% 52% 44% 50%; background: linear-gradient(145deg, #8b654d, #4e352d); box-shadow: inset -18px -12px 30px rgba(0,0,0,.25), 0 28px 45px rgba(0,0,0,.3); }
.avatar-body { position: absolute; left: 4px; right: 4px; bottom: 0; height: 155px; border-radius: 80px 80px 24px 24px; background: linear-gradient(120deg, #6c5cff, #242c53); }
.eye { position: absolute; top: 64px; width: 11px; aspect-ratio: 1; border-radius: 50%; background: #111522; box-shadow: 0 0 0 4px rgba(255,255,255,.82); }
.e1 { left: 38px; }.e2 { right: 38px; }
.avatar-head .mouth { position: absolute; left: 54px; bottom: 34px; width: 40px; height: 16px; border-bottom: 5px solid #2d1a21; border-radius: 50%; animation: mouthLine .8s ease-in-out infinite alternate; }
.speech-bubble { position: absolute; right: 7%; top: 28%; max-width: 300px; padding: 1.35rem 1.5rem; border-radius: 22px 22px 22px 4px; background: #f4f1ff; color: #151728; font-size: 1.15rem; line-height: 1.5; box-shadow: 0 20px 55px rgba(0,0,0,.28); }
.old-computer { position: relative; width: 260px; height: 210px; transform: translateX(-100px); }
.old-computer .screen { position: absolute; width: 210px; height: 150px; left: 20px; top: 10px; border-radius: 18px; background: #74798a; border: 13px solid #aa9f87; box-shadow: 0 20px 30px rgba(0,0,0,.32); }
.old-computer .screen::after { content: "SYSTEM\A ERROR"; white-space: pre; position: absolute; inset: 18px; display: grid; place-items: center; text-align: center; color: #ff889c; font-family: ui-monospace, monospace; font-weight: 900; background: #171b27; }
.old-computer .base { position: absolute; bottom: 15px; left: 0; right: 0; height: 50px; border-radius: 12px; background: #9c927c; transform: perspective(140px) rotateX(20deg); }
.spark { position: absolute; width: 3px; height: 35px; background: var(--gold); transform-origin: bottom; animation: spark .8s ease-out infinite; }
.s1 { right: 23px; top: 14px; transform: rotate(45deg); }.s2 { right: 2px; top: 38px; transform: rotate(78deg); animation-delay: -.35s; }
.humor-bubble { right: 5%; top: 33%; }
.humor-bubble em { color: #6347e8; font-style: normal; font-weight: 900; }
.media-progress { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255,255,255,.05); }
.media-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--purple), var(--cyan), var(--gold)); }
#demoDescription { color: var(--muted); font-size: .8rem; }
.play-demo { min-height: 42px; border-radius: 999px; padding: .65rem 1rem; border: 1px solid rgba(82,226,255,.25); background: rgba(82,226,255,.07); color: #dff9ff; cursor: pointer; display: flex; align-items: center; gap: .65rem; }
.play-icon { font-size: .8rem; }
.clip-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; padding: 3.5rem 0 8rem; }
.clip-card { display: grid; grid-template-columns: .8fr 1.2fr; min-height: 270px; overflow: hidden; border-radius: var(--radius); background: linear-gradient(145deg, rgba(23,27,52,.8), rgba(10,12,25,.95)); border: 1px solid var(--line); }
.clip-preview { position: relative; overflow: hidden; min-height: 270px; }
.clip-preview::before, .clip-preview::after { content: ""; position: absolute; }
.clip-preview span { position: absolute; left: .8rem; top: .8rem; z-index: 3; padding: .35rem .55rem; border-radius: 999px; background: rgba(4,6,14,.68); color: #d9deef; font-size: .64rem; letter-spacing: .08em; }
.direct-preview { background: linear-gradient(145deg, #353a48, #141825); }
.direct-preview::before { width: 140px; height: 170px; left: 50%; bottom: -20px; transform: translateX(-50%); background: #555b68; clip-path: polygon(12% 7%, 48% 0, 89% 10%, 100% 100%, 0 100%); }
.direct-preview::after { width: 60px; height: 85px; left: 50%; bottom: 0; transform: translateX(-50%); background: #171a22; }
.character-preview { background: radial-gradient(circle at 50% 35%, rgba(139,102,79,.9) 0 21%, transparent 22%), linear-gradient(145deg, #6e61ec, #151a34); }
.character-preview::before { width: 150px; height: 150px; border-radius: 70px 70px 20px 20px; left: 50%; bottom: -18px; transform: translateX(-50%); background: #292f58; }
.humor-preview { background: linear-gradient(145deg, #302d36, #0d1220); }
.humor-preview::before { width: 150px; height: 110px; left: 50%; top: 50%; transform: translate(-50%,-50%); border-radius: 15px; border: 10px solid #9e947f; background: #171a24; box-shadow: 0 22px 30px rgba(0,0,0,.32); }
.humor-preview::after { content: "ERR"; display: grid; place-items: center; width: 85px; height: 55px; left: 50%; top: 50%; transform: translate(-50%,-55%); color: #ff7d9e; font-family: var(--font-display); }
.archive-preview { background: conic-gradient(from 90deg, #5a48d3, #20c7e8, #a34cff, #5a48d3); }
.archive-preview::before { inset: 22%; border-radius: 50%; background: #0c1020; box-shadow: 0 0 0 15px rgba(255,255,255,.1), 0 0 0 32px rgba(255,255,255,.04); }
.archive-preview::after { width: 18px; aspect-ratio: 1; border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%,-50%); background: var(--cyan); box-shadow: 0 0 20px var(--cyan); }
.clip-copy { padding: 2rem; align-self: center; }
.clip-copy small { color: var(--cyan); letter-spacing: .12em; font-weight: 800; }
.clip-copy h3 { margin: .7rem 0; font-family: var(--font-display); font-size: 1.4rem; }
.clip-copy p { margin: 0; color: var(--muted); line-height: 1.65; }
.proof-section { border-block: 1px solid rgba(255,255,255,.06); background: linear-gradient(180deg, rgba(18,22,42,.75), rgba(8,10,20,.85)); }
.proof-grid { padding-block: clamp(6rem,10vw,9rem); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem,7vw,6rem); align-items: center; }
.proof-copy p { color: var(--muted); line-height: 1.72; font-size: 1.05rem; }
.proof-link { margin: 1.8rem 0; padding: 1rem 1.1rem; border: 1px solid rgba(82,226,255,.22); border-radius: 14px; display: flex; justify-content: space-between; gap: 1rem; text-decoration: none; color: #d8faff; background: rgba(82,226,255,.04); font-family: ui-monospace, monospace; font-size: .82rem; }
.proof-list { list-style: none; padding: 0; display: grid; gap: .7rem; }
.proof-list li { color: #c6ccdf; padding-left: 1.5rem; position: relative; }
.proof-list li::before { content: "✓"; position: absolute; left: 0; color: var(--green); }
.proof-terminal { border-radius: 24px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); background: #070a12; box-shadow: 0 35px 80px rgba(0,0,0,.45); }
.terminal-bar { min-height: 48px; display: flex; align-items: center; gap: .5rem; padding: .8rem 1rem; background: #111522; border-bottom: 1px solid rgba(255,255,255,.07); }
.terminal-bar span { width: 10px; aspect-ratio: 1; border-radius: 50%; background: #ff7289; }
.terminal-bar span:nth-child(2) { background: #f5d384; }.terminal-bar span:nth-child(3) { background: #58efb1; }
.terminal-bar b { margin-left: auto; color: var(--dim); font-family: ui-monospace, monospace; font-size: .7rem; }
.terminal-body { padding: 1.5rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .82rem; }
.terminal-body p { display: flex; align-items: center; gap: .75rem; color: #c7ccdf; }
.terminal-body i { color: var(--green); font-style: normal; }
.terminal-body span { margin-left: auto; color: var(--dim); }
.terminal-result { margin-top: 1.7rem; padding-top: 1.2rem; border-top: 1px solid rgba(255,255,255,.08); }
.terminal-result strong { color: var(--green); }
.address-section { padding-block: 7rem; }
.address-card { padding: clamp(2rem, 5vw, 4.5rem); border-radius: 30px; border: 1px solid var(--line); background: radial-gradient(circle at 85% 10%, rgba(99,76,255,.17), transparent 30rem), rgba(14,17,33,.78); }
.address-copy { display: grid; grid-template-columns: 1fr 1.5fr; gap: 2rem; align-items: end; }
.address-copy p { color: var(--muted); line-height: 1.7; margin: 0 0 .5rem; }
.address-builder { margin-top: 3.4rem; display: flex; align-items: stretch; gap: .65rem; overflow-x: auto; padding-bottom: .3rem; }
.address-segment { min-width: 180px; padding: 1.15rem 1.2rem; border-radius: 16px; border: 1px solid rgba(156,124,255,.25); background: rgba(156,124,255,.06); }
.address-segment.host { min-width: 280px; border-color: rgba(82,226,255,.25); background: rgba(82,226,255,.05); }
.address-segment small { display: block; color: var(--dim); font-size: .62rem; letter-spacing: .12em; margin-bottom: .45rem; }
.address-segment strong { font-family: ui-monospace, monospace; font-size: 1rem; }
.dot { align-self: center; color: var(--dim); font-family: var(--font-display); font-size: 1.7rem; }
.copy-address { margin-top: 1.5rem; border: 0; background: none; color: #c9c2ff; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.copy-feedback { color: var(--green); font-size: .78rem; margin-left: .8rem; }
.blackpaper-section { padding-bottom: 8rem; }
.blackpaper-card { min-height: 580px; padding: clamp(2rem,5vw,5rem); border-radius: 30px; display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(2rem,7vw,6rem); align-items: center; overflow: hidden; position: relative; border: 1px solid rgba(245,211,132,.18); background: radial-gradient(circle at 10% 5%, rgba(245,211,132,.09), transparent 30rem), linear-gradient(145deg, rgba(24,25,40,.9), rgba(9,10,20,.96)); }
.pdf-cover { width: min(335px, 100%); aspect-ratio: .72; justify-self: center; padding: 2rem; position: relative; overflow: hidden; display: flex; flex-direction: column; border: 1px solid rgba(255,255,255,.14); background: linear-gradient(145deg, #111323, #242046 70%, #121421); box-shadow: -18px 25px 60px rgba(0,0,0,.45), inset 0 0 60px rgba(104,75,255,.12); transform: perspective(900px) rotateY(8deg) rotateX(2deg); }
.pdf-cover::after { content: ""; position: absolute; width: 240px; aspect-ratio: 1; border: 1px solid rgba(82,226,255,.34); border-radius: 50%; right: -90px; bottom: -55px; box-shadow: 0 0 0 30px rgba(156,124,255,.06), 0 0 0 62px rgba(82,226,255,.035); }
.pdf-cover span { color: var(--gold); font-size: .68rem; letter-spacing: .15em; }
.pdf-cover strong { margin-top: auto; font-family: var(--font-display); font-size: clamp(2.4rem, 5vw, 4rem); line-height: .9; letter-spacing: -.05em; }
.pdf-cover i { margin-top: 1rem; color: #c8c4dc; font-style: normal; font-size: .7rem; letter-spacing: .14em; }
.pdf-lines { display: grid; gap: .45rem; width: 55%; margin-top: 1.4rem; }
.pdf-lines b { height: 2px; background: linear-gradient(90deg, var(--purple), transparent); }
.blackpaper-copy p { color: var(--muted); line-height: 1.75; max-width: 620px; }
.blackpaper-actions { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; margin-top: 2rem; }
.finale { padding-block: 8rem 10rem; text-align: center; }
.finale h2 { margin-inline: auto; max-width: 950px; }
.finale p { color: var(--muted); font-size: 1.1rem; margin: 1.6rem 0 2rem; }
.site-footer { padding: 2rem max(1rem, calc((100vw - 1240px)/2)); border-top: 1px solid rgba(255,255,255,.07); display: grid; grid-template-columns: 1fr 1fr auto; gap: 2rem; align-items: center; color: var(--muted); background: #06070d; }
.footer-brand { display: grid; gap: .35rem; }
.footer-brand strong { color: var(--text); font-family: var(--font-display); }
.footer-brand span, .footer-thesis { font-size: .72rem; }
.footer-links { display: flex; gap: 1rem; }
.footer-links a, .footer-links button { color: var(--muted); border: 0; background: none; cursor: pointer; text-decoration: none; font-size: .76rem; }
.floating-pdf { position: fixed; right: 1.15rem; bottom: 1.15rem; z-index: 90; min-width: 120px; padding: .75rem .9rem; border-radius: 15px; border: 1px solid rgba(156,124,255,.36); color: var(--text); background: rgba(14,17,32,.82); backdrop-filter: blur(14px); box-shadow: 0 18px 50px rgba(0,0,0,.35); cursor: pointer; display: grid; text-align: left; }
.floating-pdf span { color: var(--cyan); font-size: .58rem; letter-spacing: .14em; }
.floating-pdf strong { font-size: .72rem; }
.pdf-modal { width: min(1500px, calc(100vw - 2rem)); height: min(920px, calc(100vh - 2rem)); padding: 0; border: 1px solid rgba(255,255,255,.14); border-radius: 20px; overflow: hidden; background: #0a0c16; color: var(--text); box-shadow: 0 35px 100px rgba(0,0,0,.65); }
.pdf-modal::backdrop { background: rgba(2,3,8,.78); backdrop-filter: blur(8px); }
.pdf-modal-bar { min-height: 62px; padding: .75rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--line); background: #111421; }
.pdf-modal-bar > div { display: flex; align-items: center; gap: .8rem; }
.pdf-badge { padding: .38rem .55rem; border-radius: 999px; color: var(--gold); background: rgba(245,211,132,.08); border: 1px solid rgba(245,211,132,.2); font-size: .6rem; letter-spacing: .1em; }
.pdf-modal-actions a, .pdf-modal-actions button { color: var(--muted); text-decoration: none; border: 0; background: none; cursor: pointer; font-size: .74rem; }
.pdf-modal-actions button { width: 38px; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 10px; color: var(--text); font-size: 1.4rem; }
.pdf-modal iframe { width: 100%; height: calc(100% - 62px); border: 0; background: #242424; }
.noscript { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 500; padding: 1rem; border-radius: 12px; background: #2a1d25; color: #ffdfe9; }
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.75,.2,1); }
.reveal.in-view { opacity: 1; transform: none; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 0% { transform: scale(.88); opacity: .65; } 70%,100% { transform: scale(1.28); opacity: 0; } }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes gradientFlow { to { background-position: 100% center; } }
@keyframes ticker { to { transform: translateX(-50%); } }
@keyframes voiceWave { to { transform: scaleY(.45); } }
@keyframes pulseRing { 0%,100% { transform: translate(-50%,-50%) scale(.92); opacity: .35; } 50% { transform: translate(-50%,-50%) scale(1.08); opacity: .9; } }
@keyframes mouthTalk { 0%,100% { transform: scaleY(.78) scaleX(1.05); } 50% { transform: scaleY(1.12) scaleX(.94); } }
@keyframes mouthLine { to { height: 25px; border-radius: 40%; } }
@keyframes spark { 0% { opacity: 0; transform: scale(.2) rotate(45deg); } 50% { opacity: 1; } 100% { opacity: 0; transform: scale(1.4) rotate(45deg); } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}
@media (max-width: 1050px) {
  .main-nav a { display: none; }
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-copy { padding-top: 2rem; }
  .hero-orbit { padding-bottom: 2rem; }
  .section-heading { grid-template-columns: .5fr 1.2fr; }
  .section-heading p { grid-column: 2; }
  .engine-grid { grid-template-columns: 1fr 1fr; }
  .engine-card:last-child { grid-column: 1 / -1; min-height: 430px; }
  .workflow-line { grid-template-columns: repeat(2,1fr); gap: 3rem 1.5rem; }
  .workflow-line::before { display: none; }
  .console-body { grid-template-columns: 1fr; }
  .word-panel { border-right: 0; border-bottom: 1px solid var(--line); }
  .media-stage { min-height: 480px; }
  .proof-grid { grid-template-columns: 1fr; }
  .site-footer { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .site-header { min-height: 68px; }
  .menu-toggle { display: block; }
  .main-nav { display: none; position: absolute; top: 68px; left: 1rem; right: 1rem; padding: .9rem; border: 1px solid var(--line); border-radius: 16px; background: rgba(10,12,23,.97); box-shadow: var(--shadow); }
  .main-nav.open { display: grid; }
  .main-nav a { display: block; }
  .nav-pdf { width: 100%; }
  .hero { padding-top: 3rem; }
  .hero h1 { font-size: clamp(3rem, 15vw, 5rem); }
  .hero-actions { align-items: stretch; }
  .button { width: 100%; }
  .text-link { width: 100%; text-align: center; margin-top: .25rem; }
  .hero-metrics { gap: 1.25rem; }
  .orbit-stage { width: 100%; }
  .orbit-node { width: 68px; border-radius: 18px; }
  .split-section { grid-template-columns: 1fr; }
  .section-heading, .section-heading.compact { grid-template-columns: 1fr; }
  .section-heading p { grid-column: auto; }
  .engine-grid { grid-template-columns: 1fr; }
  .engine-card:last-child { grid-column: auto; }
  .workflow-line { grid-template-columns: 1fr; }
  .layer-display { grid-template-columns: 1fr; }
  .layer-visual { min-height: 350px; }
  .console-header, .console-footer { align-items: flex-start; flex-direction: column; }
  .word-controls { grid-template-columns: 1fr; }
  .media-stage { min-height: 520px; }
  .character-avatar, .old-computer { transform: translateY(-55px) scale(.85); }
  .speech-bubble { left: 8%; right: 8%; top: auto; bottom: 80px; max-width: none; }
  .clip-grid { grid-template-columns: 1fr; }
  .clip-card { grid-template-columns: 1fr; }
  .clip-preview { min-height: 220px; }
  .address-copy { grid-template-columns: 1fr; }
  .blackpaper-card { grid-template-columns: 1fr; }
  .pdf-cover { transform: none; max-width: 280px; }
  .floating-pdf { display: none; }
  .pdf-modal-bar { align-items: flex-start; }
  .pdf-modal-bar > div:first-child { display: grid; gap: .35rem; }
  .pdf-modal-actions a { display: none; }
}
@media print {
  .site-header, .ticker, .floating-pdf, .pdf-modal, .hero-orbit, .hero-actions, .word-controls, .play-demo { display: none !important; }
  body { color: #111; background: #fff; }
  .hero, .split-section, .section-heading, .engine-grid, .workflow-line, .layer-display, .proof-grid, .blackpaper-card { display: block; }
  .reveal { opacity: 1; transform: none; }
}
