:root{--bg: #0c0c0e;--bg-subtle: #101014;--surface: #151518;--surface-raised: #1a1a1f;--surface-nested: #121216;--border: rgba(255, 255, 255, .09);--border-strong: rgba(255, 255, 255, .14);--text: #e8e6e3;--text-muted: #9a9894;--text-dim: #6b6966;--accent: #a8b4c4;--accent-line: rgba(168, 180, 196, .38);--accent-soft: rgba(168, 180, 196, .1);--zulu-pink: #e83e8c;--zulu-pink-soft: rgba(232, 62, 140, .78);--zulu-pink-prominent: rgba(232, 62, 140, .86);--font: "DM Sans", system-ui, -apple-system, sans-serif;--prose: 34rem;--prose-wide: 42rem;--pad: clamp(1.25rem, 4vw, 2.5rem);--section: clamp(4rem, 8vw, 6rem);--radius: 10px}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}.section[id]{scroll-margin-top:4.5rem}body{margin:0;font-family:var(--font);font-size:1rem;line-height:1.65;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}#root{min-height:100vh}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,.btn:focus-visible,.domain-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hint-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.preview-textarea:focus-visible{outline:2px solid var(--accent);outline-offset:0}.page{position:relative;min-height:100vh;background-color:var(--bg);background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:72px 72px}.page:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse 90% 50% at 50% -8%,rgba(168,180,196,.08),transparent 55%);z-index:0}.page>*{position:relative;z-index:1}.container{width:100%;max-width:1080px;margin:0 auto;padding:0 var(--pad)}.section{padding:var(--section) 0}.section-label{display:block;margin-bottom:.75rem;font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim)}.section-title{margin:0 0 1rem;font-size:clamp(1.375rem,2.8vw,1.875rem);font-weight:600;line-height:1.2;letter-spacing:-.035em}.section-lead{margin:0 0 2rem;max-width:var(--prose);font-size:1.03125rem;line-height:1.68;color:var(--text-muted)}.site-header{position:sticky;top:0;z-index:10;border-bottom:1px solid var(--border);background:#09090be0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.site-header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:3.5rem}.logo{display:inline-flex;align-items:baseline;gap:clamp(.55rem,2.2vw,.875rem);line-height:1;white-space:nowrap;flex-shrink:0}.logo-mark{font-size:clamp(1.4375rem,3.3vw,1.75rem);font-weight:900;letter-spacing:-.045em;color:var(--zulu-pink)}.logo-subtitle{font-size:clamp(.6875rem,1.35vw,.8125rem);font-weight:500;letter-spacing:.02em;color:#fff;opacity:.92}.site-nav{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem 1.25rem;font-size:.8125rem;color:var(--text-muted)}.site-nav a:hover{color:var(--text)}.site-nav-external{color:var(--accent)}.hero{padding-top:clamp(4rem,10vw,6.5rem);padding-bottom:clamp(2rem,5vw,3rem);border-bottom:1px solid var(--border);background:linear-gradient(180deg,var(--bg-subtle) 0%,var(--bg) 100%)}.hero-eyebrow{margin:0 0 1.25rem;font-size:.75rem;color:var(--text-dim);letter-spacing:.06em}.hero-title{margin:0 0 1rem;max-width:18ch;font-size:clamp(2.25rem,5.5vw,3.5rem);font-weight:600;line-height:1.05;letter-spacing:-.045em}.hero-subtitle{margin:0 0 1.25rem;max-width:var(--prose);font-size:clamp(1.0625rem,2vw,1.25rem);line-height:1.5;color:var(--text-muted)}.hero-disclaimer{margin:0 0 2rem;max-width:36rem;font-size:.8125rem;line-height:1.55;color:var(--text-dim)}.hero-actions{display:flex;flex-wrap:wrap;gap:.75rem}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.625rem 1.125rem;border-radius:8px;font-size:.875rem;font-weight:500;border:1px solid var(--border-strong);cursor:pointer;transition:background .15s ease,color .15s ease}.btn-primary{background:#e8e4df;color:#121214;border-color:#d8d4cf}.btn-primary:hover{background:#f2efeb;border-color:#e8e4df}.btn-secondary{background:transparent;color:var(--text-muted)}.btn-secondary:hover{color:var(--text);background:var(--surface)}.problem-grid{display:grid;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}@media(min-width:640px){.problem-grid{grid-template-columns:repeat(2,1fr)}}.problem-card{padding:1.375rem 1.5rem;background:var(--surface)}.problem-card h3{margin:0 0 .5rem;font-size:.9375rem;font-weight:600}.problem-card p{margin:0;font-size:.875rem;line-height:1.55;color:var(--text-muted)}.pipeline{max-width:var(--prose-wide);padding-left:1.5rem;border-left:2px solid var(--accent-line)}.pipeline-step{position:relative;padding:0 0 1.75rem}.pipeline-step:last-child{padding-bottom:0}.pipeline-step-label{margin:0 0 .25rem;font-size:.9375rem;font-weight:600;letter-spacing:-.02em}.pipeline-step-text{margin:0;font-size:.875rem;line-height:1.55;color:var(--text-muted)}.pipeline-caption{margin:1.5rem 0 0;font-size:.8125rem;color:var(--text-dim)}.examples-list{display:grid;gap:2.5rem}.example-block{padding:1.5rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.example-title{margin:0 0 1.25rem;font-size:1rem;font-weight:600}.flow-stage{margin-bottom:1rem}.flow-stage:last-child{margin-bottom:0}.flow-label{margin:0 0 .5rem;font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}.flow-arrow{margin:.75rem 0;font-size:.875rem;color:var(--accent);opacity:.7}.input-quote{margin:0;padding:1rem 1.125rem;border-left:2px solid var(--accent-line);font-size:1rem;line-height:1.6;color:var(--text);background:#ffffff05;border-radius:0 var(--radius) var(--radius) 0}.intent-line{margin:0;font-size:.9375rem;line-height:1.55;color:var(--text)}.direction-text{margin:0;font-size:.9375rem;line-height:1.65;color:var(--text-muted)}.flow-stage-priority{padding-top:.125rem}.priority-groups{display:grid;gap:.875rem}.priority-tier{margin:0 0 .35rem;font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.priority-list{margin:0;padding:0;list-style:none;display:grid;gap:.35rem}.priority-item{margin:0;font-size:.9375rem;line-height:1.5;color:var(--text)}.flow-stage-tradeoffs{padding-top:.125rem}.tradeoff-list{margin:0;padding:0;list-style:none;display:grid;gap:.5rem}.tradeoff-line{margin:0;font-size:.9375rem;line-height:1.55;color:var(--text-muted)}.flow-stage-patterns{padding-top:.25rem}.observation-list{margin:0;padding:0;list-style:none;display:grid;gap:.75rem}.observation-line{margin:0;padding:.875rem 1rem;font-size:.9375rem;line-height:1.6;color:var(--text);background:#9aabbf0f;border-left:2px solid var(--accent-line);border-radius:0 var(--radius) var(--radius) 0}.chips{display:flex;flex-wrap:wrap;gap:.5rem}.chip{padding:.3rem .625rem;font-size:.75rem;line-height:1.4;color:var(--text-muted);background:var(--bg);border:1px solid var(--border);border-radius:999px}.chip-label{color:var(--text-dim);font-weight:500}.chip-label:after{content:" · "}.chip-value{color:var(--text-muted)}.section-compact{padding-top:clamp(2.5rem,5vw,3.5rem);padding-bottom:clamp(2.5rem,5vw,3.5rem)}.section-parser{padding-top:clamp(1.5rem,4vw,2.5rem)}.category-bridge{margin:0;max-width:var(--prose-wide);font-size:1rem;line-height:1.68;color:var(--text)}.section-closing{margin:2rem 0 0;max-width:var(--prose);font-size:.9375rem;line-height:1.65;color:var(--text-muted)}.principle-grid{display:grid;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}@media(min-width:720px){.principle-grid{grid-template-columns:repeat(2,1fr)}}.principle-card{padding:1.375rem 1.5rem;background:var(--surface)}.principle-card h3{margin:0 0 .5rem;font-size:.9375rem;font-weight:600}.principle-card p{margin:0;font-size:.875rem;line-height:1.55;color:var(--text-muted)}.demo-steps{margin:0 0 1.75rem;padding:0;list-style:none;display:grid;gap:.5rem}@media(min-width:720px){.demo-steps{grid-template-columns:repeat(2,1fr);gap:.625rem 1rem}}@media(min-width:960px){.demo-steps{grid-template-columns:repeat(4,1fr)}}.demo-step{display:flex;align-items:flex-start;gap:.625rem;padding:.75rem .875rem;background:var(--surface);border:1px solid var(--border);border-radius:8px}.demo-step-num{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:1.375rem;height:1.375rem;font-size:.6875rem;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:999px}.demo-step-text{display:grid;gap:.1rem;min-width:0}.demo-step-de{display:block;font-size:.8125rem;font-weight:500;line-height:1.35;color:var(--text)}.demo-step-en{display:block;font-size:.6875rem;line-height:1.35;color:var(--text-dim)}.preview-panel{max-width:var(--prose-wide);padding:1.5rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.preview-panel-hero{max-width:100%;padding:clamp(1.25rem,3vw,2rem);border-color:var(--border-strong);background:linear-gradient(180deg,var(--surface-raised) 0%,var(--surface) 100%);box-shadow:0 1px #ffffff0a inset}.demo-panel-section{padding:1.125rem 1.25rem;margin-bottom:1rem;background:var(--surface-nested);border:1px solid var(--border);border-radius:8px}.demo-panel-section:last-child{margin-bottom:0}.demo-panel-heading{margin:0 0 .875rem;font-size:.6875rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}.demo-input-section{background:#a8b4c40a;border-color:var(--border-strong)}.demo-output-section{padding-bottom:1.25rem}.demo-microcopy{margin:0 0 1rem;padding:.875rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:8px}.demo-microcopy p{margin:0 0 .25rem;font-size:.875rem;line-height:1.5;color:var(--text-muted)}.demo-microcopy p:last-child{margin-bottom:0}.demo-microcopy-en{margin-top:.5rem!important;padding-top:.5rem;border-top:1px solid var(--border);font-size:.8125rem!important;color:var(--text-dim)!important}.demo-cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:.625rem .875rem;margin-bottom:1.25rem}.demo-cta-primary{padding:.75rem 1.375rem;font-size:.9375rem;font-weight:600}.demo-cta-secondary{font-size:.8125rem;color:var(--text-dim)}.demo-examples-block{padding-top:.25rem}.demo-examples-label{margin:0 0 .2rem;font-size:.8125rem;font-weight:500;color:var(--text)}.demo-examples-label-en{margin:0 0 .75rem;font-size:.75rem;color:var(--text-dim)}.demo-empty-state{padding:1.5rem 1.25rem;text-align:center;background:var(--surface);border:1px dashed var(--border-strong);border-radius:8px}.demo-empty-de{margin:0 0 .35rem;font-size:.9375rem;line-height:1.5;color:var(--text-muted)}.demo-empty-en{margin:0 0 1.125rem;font-size:.8125rem;line-height:1.5;color:var(--text-dim)}.demo-empty-cta{padding:.625rem 1.25rem;font-size:.875rem}.preview-textarea{width:100%;min-height:5.5rem;margin-bottom:1rem;padding:1rem 1.125rem;font-family:var(--font);font-size:1rem;line-height:1.55;color:var(--zulu-pink);background:var(--surface-raised);border:1px solid var(--border-strong);border-radius:8px;resize:vertical}.preview-textarea:focus{border-color:var(--accent-line)}.preview-textarea::placeholder{color:var(--zulu-pink-soft);opacity:1}.preview-textarea:placeholder-shown::placeholder{color:var(--zulu-pink-prominent)}.domain-switcher{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.75rem}.domain-btn{padding:.4rem .85rem;font-family:var(--font);font-size:.75rem;font-weight:500;letter-spacing:.02em;color:var(--text-muted);background:transparent;border:1px solid var(--border);border-radius:999px;cursor:pointer;transition:color .15s,border-color .15s,background .15s}.domain-btn:hover{color:var(--text);border-color:var(--border-strong)}.domain-btn-active{color:var(--text);background:var(--accent-soft);border-color:var(--accent-line)}.domain-description{margin:0 0 .75rem;font-size:.875rem;line-height:1.5;color:var(--text-muted)}.domain-safety{margin:0 0 1rem;padding:.65rem .85rem;font-size:.8125rem;line-height:1.45;color:var(--text-muted);background:var(--accent-soft);border-left:2px solid var(--accent-line);border-radius:0 var(--radius) var(--radius) 0}.parser-output{padding:1rem 1.125rem;background:var(--surface);border:1px solid var(--border);border-radius:8px}.preview-hints{display:flex;flex-wrap:wrap;gap:.625rem;margin-bottom:0}.hint-btn{padding:.625rem 1rem;font-family:var(--font);font-size:.8125rem;font-weight:500;color:var(--text);background:var(--surface-raised);border:1px solid var(--border-strong);border-radius:8px;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease}.hint-btn:hover{color:var(--text);background:var(--accent-soft);border-color:var(--accent-line)}.preview-empty{font-size:.875rem;color:var(--text-dim)}.preview-status{margin:0 0 .75rem;font-size:.8125rem;color:var(--text-dim)}.preview-status-error{color:var(--text-muted)}.domain-grid{display:grid;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}@media(min-width:720px){.domain-grid{grid-template-columns:repeat(2,1fr)}}.domain-item{padding:1.25rem 1.375rem;background:var(--surface)}.domain-item h3{margin:0 0 .35rem;font-size:.875rem;font-weight:600}.domain-item p{margin:0;font-size:.8125rem;line-height:1.5;color:var(--text-muted)}.disclaimer{margin:1.25rem 0 0;max-width:var(--prose-wide);font-size:.8125rem;line-height:1.5;color:var(--text-dim)}.tech-panel{max-width:var(--prose-wide);padding:1.5rem 1.5rem 1.5rem 1.75rem;border-left:2px solid var(--accent-line)}.tech-list{margin:0 0 1.25rem;padding:0;list-style:none;display:grid;gap:.75rem}.tech-list li{padding-left:1rem;border-left:1px solid var(--border);font-size:.9375rem;line-height:1.6;color:var(--text-muted)}.tech-link{font-size:.875rem;color:var(--accent)}.tech-link:hover{color:var(--text)}.site-footer{padding:2.5rem 0 3rem;border-top:1px solid var(--border)}.footer-line{margin:0 0 .35rem;font-size:.8125rem;color:var(--text-muted)}.footer-brand{display:inline-flex;align-items:baseline;gap:clamp(.45rem,1.8vw,.7rem);white-space:nowrap}.footer-brand .logo-mark{font-size:clamp(1.125rem,2.5vw,1.375rem)}.footer-brand .logo-subtitle{font-size:clamp(.625rem,1.15vw,.75rem)}.footer-demo-tag,.footer-muted{color:var(--text-dim)}.content-emphasis{font-weight:500}.footer-credit{margin:1.25rem 0 0;font-size:.6875rem;letter-spacing:.02em;color:var(--text-dim)}
