/* String-inspired composition; LLMPort branding, native CSS and Phosphor icons.
   Shape scale: 24px surfaces, 14px utilities, pill buttons. */
/* Developer examples intentionally use a fixed dark code surface in both themes. */
.developer-section {background:var(--surface-soft);border-block:1px solid var(--line)}.developer-grid {display:grid;grid-template-columns:.82fr 1.18fr;gap:72px;align-items:start}.developer-copy .eyebrow {margin-bottom:24px}.developer-copy>p:not(.eyebrow) {color:var(--muted);font-size:14px;margin-top:24px}.setup-steps {padding:0;margin:38px 0 30px;list-style:none;display:grid;gap:24px}.setup-steps li {display:flex;gap:20px}.setup-steps li>span {font-family:var(--mono);color:var(--subtle);font-size:11px;line-height:24px}.setup-steps strong {font-weight:500;font-size:14px}.setup-steps p {color:var(--muted);font-size:12px;margin-top:6px;max-width:34ch}.integration-panel {min-width:0}.base-url-bar {display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line-strong);border-radius:14px;background:var(--surface);padding:15px 18px;margin-bottom:16px}.base-url-bar>div {display:flex;flex-direction:column;gap:7px;min-width:0}.base-url-bar span {font-family:var(--mono);font-size:9px;letter-spacing:.12em;color:var(--muted)}.base-url-bar code {font-family:var(--mono);font-size:14px;overflow-wrap:anywhere}.code-panel {overflow:hidden;border:1px solid #25364e;border-radius:24px;background:#0d1726;color:#e9effa;box-shadow:0 20px 45px rgb(9 27 55 / .1)}.code-toolbar {display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #263447;padding:15px 18px}.code-tabs {display:flex;gap:6px}.code-tabs button {font-family:var(--mono);font-size:11px;color:#94a5bd;padding:8px 13px;border-radius:7px}.code-tabs button[aria-selected=true] {color:#edf4ff;background:#25354c}.code-tabs button:hover {color:#edf4ff}.code-copy {display:flex;align-items:center;gap:7px;color:#94a5bd;font-size:11px;min-width:63px;padding:8px 2px}.code-copy:hover {color:#fff}.code-copy .icon {width:15px;height:15px}.code-panel pre {margin:0;padding:29px 26px;overflow:auto;min-height:382px;max-width:100%;tab-size:4}.code-panel pre code {font-family:var(--mono);font-size:12px;line-height:1.85;color:#c9d7ea}.code-keyword {color:#9cbbff}.code-string {color:#86dbc8}.code-comment {color:#7085a2}.code-note {display:flex;align-items:center;gap:8px;border-top:1px solid #263447;color:#95a8c3;font-size:10px;padding:14px 24px}.code-note .icon {width:15px;height:15px}.integration-footnote {font-size:11px;color:var(--muted);line-height:1.7;margin:16px 6px 0}
.faq-section {display:grid;grid-template-columns:.8fr 1.2fr;gap:72px}.faq-heading p {font-size:14px;color:var(--muted);margin-top:24px;margin-bottom:28px}.faq-list details {border-bottom:1px solid var(--line)}.faq-list details:first-child {border-top:1px solid var(--line)}.faq-list summary {display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px 0;list-style:none;cursor:pointer;font-size:15px;line-height:1.55}.faq-list summary::-webkit-details-marker {display:none}.faq-list summary .icon {color:var(--subtle);width:18px;height:18px;transition:transform .2s}.faq-list details[open] summary .icon {transform:rotate(45deg)}.faq-list details[open] summary {color:var(--blue)}.faq-list details>div {font-size:13px;line-height:1.9;color:var(--muted);padding:0 32px 24px 0}.faq-list a {color:var(--blue);text-decoration:underline;text-underline-offset:3px}.faq-list code {font-family:var(--mono);font-size:12px;overflow-wrap:anywhere}
.final-cta {position:relative;isolation:isolate;overflow:hidden;text-align:center;border-radius:32px;border:1px solid var(--line);padding:86px 30px;background:var(--surface)}.cta-halo {position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 140%,var(--wash) 0,transparent 65%)}.final-cta .eyebrow {margin-bottom:25px}.final-cta h2 {font-size:clamp(42px,5vw,72px)}.final-cta>p:not(.eyebrow) {color:var(--muted);font-size:14px;margin:23px 0 30px}.final-cta .button {min-width:175px}
.footer {padding-top:60px;padding-bottom:30px}.footer-top {display:flex;align-items:center;gap:32px;padding-bottom:40px}.footer-top>p {font-family:var(--mono);font-size:10px;letter-spacing:.025em;color:var(--muted)}.footer-links {display:flex;gap:26px;align-items:center;margin-left:auto;font-size:12px;color:var(--muted)}.footer-links button {padding:0;font-size:12px}.footer-links a:hover,.footer-links button:hover,.footer-bottom a:hover {color:var(--blue)}.footer-bottom {border-top:1px solid var(--line);padding-top:23px;display:flex;align-items:center;gap:30px;font-size:10px;color:var(--muted)}.footer-bottom>div {display:flex;gap:23px;margin-left:auto}.back-top {width:32px;height:32px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center}.back-top .icon {width:14px;height:14px}
dialog {color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);max-width:calc(100% - 32px);padding:26px}dialog::backdrop {background:rgb(6 17 34 / .3);backdrop-filter:blur(6px)}.dialog-heading {display:flex;align-items:center;justify-content:space-between;gap:32px;margin-bottom:23px}.dialog-heading h2 {font-size:20px;font-weight:500}.info-dialog {width:460px}.info-dialog p {font-size:14px;line-height:1.9;white-space:pre-line;color:var(--muted);margin-bottom:24px}.mobile-menu {width:380px}.mobile-menu nav {display:flex;flex-direction:column;align-items:stretch}.mobile-menu nav a,.mobile-menu nav>button {text-align:left;display:flex;align-items:center;justify-content:space-between;padding:17px 0;border-bottom:1px solid var(--line);font-size:19px}.mobile-menu nav a:last-child {color:var(--blue);border:0}.toast {position:fixed;bottom:26px;left:50%;z-index:90;max-width:calc(100% - 36px);width:max-content;transform:translate(-50%,15px);color:var(--page);background:var(--ink);padding:12px 20px;border-radius:14px;font-size:12px;line-height:1.65;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.toast.is-visible {opacity:1;transform:translate(-50%,0)}.noscript-note {padding:18px;text-align:center;color:var(--muted);font-size:13px}.js .reveal {opacity:0;transform:translateY(22px);transition:opacity .7s,transform .7s cubic-bezier(.2,.7,.2,1)}.js .reveal.is-visible {opacity:1;transform:translateY(0)}
::view-transition-old(root),::view-transition-new(root) {animation:none;mix-blend-mode:normal}::view-transition-old(root) {z-index:1}::view-transition-new(root) {z-index:2}
* {box-sizing:border-box} [hidden] {display:none!important} html {scroll-behavior:smooth;scroll-padding-top:105px;background:var(--page)} body {margin:0;font-family:var(--sans);color:var(--ink);background:var(--page);font-size:15px;-webkit-font-smoothing:antialiased} a {color:inherit;text-decoration:none} button {font:inherit;color:inherit;cursor:pointer} button,a {-webkit-tap-highlight-color:transparent} button {border:0;background:none} p,h1,h2,h3,figure {margin:0} p {line-height:1.85} ::selection {background:#abd2ff;color:#0b1320} :focus-visible {outline:3px solid var(--blue);outline-offset:5px} .icon {width:20px;height:20px;fill:currentColor;flex:none;vertical-align:middle} .shell {width:min(1280px,calc(100% - 112px));margin-inline:auto} .section-space {padding-block:112px}
.skip-link {position:fixed;z-index:100;top:10px;left:16px;padding:12px 20px;border-radius:8px;background:var(--surface);transform:translateY(-150%)} .skip-link:focus {transform:translateY(0)} #nav-sentinel {height:1px;position:absolute;top:20px;left:0}
.site-header {position:fixed;inset:0 0 auto;z-index:40;padding-block:14px;transition:background .25s,border-color .25s,padding .25s;border-bottom:1px solid transparent}.site-header.is-scrolled {background:var(--header);backdrop-filter:blur(18px) saturate(150%);border-color:var(--line);padding-block:9px}.nav {display:flex;align-items:center;justify-content:space-between;gap:32px;height:52px}.brand {display:inline-flex;align-items:center;gap:10px;font-size:25px;letter-spacing:-1.2px;font-weight:700;white-space:nowrap}.brand img {border-radius:9px}.brand-dot {color:var(--brand)}.nav-links {display:flex;align-items:center;gap:33px;margin-left:auto}.nav-links a,.nav-links button {padding:10px 0;font-size:14px;color:var(--muted);transition:color .2s}.nav-links a:hover,.nav-links button:hover {color:var(--blue)}.nav-actions {display:flex;align-items:center;gap:21px}.icon-button {display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;transition:background .2s,transform .2s}.icon-button:hover {background:var(--surface-soft)}.icon-button:active {transform:scale(.95)}.nav-console {display:flex;align-items:center;gap:14px;border:1px solid var(--line-strong);border-radius:999px;padding:10px 17px;font-size:14px;transition:border-color .2s,background .2s}.nav-console:hover {background:var(--surface);border-color:var(--ink)}.menu-toggle {display:none}.theme-toggle .sun {display:none}html[data-theme=dark] .theme-toggle .moon {display:none}html[data-theme=dark] .theme-toggle .sun {display:block}
.hero {position:relative;isolation:isolate;overflow:hidden;min-height:800px;min-height:max(760px,100svh);padding-top:112px;display:flex;align-items:center}.hero-wash {position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 83% 57%,var(--wash),transparent 52%);opacity:.8}.fluid-canvas {position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;opacity:.42}html[data-theme=dark] .fluid-canvas {opacity:.3}.hero-inner {display:grid;grid-template-columns:1.08fr 1fr;align-items:center;gap:0;position:relative;padding-bottom:84px}.hero-copy {position:relative;z-index:2;pointer-events:none}.hero-copy>* {pointer-events:auto}.eyebrow {font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--muted);margin-bottom:28px}.hero h1 {font-family:var(--serif);font-size:clamp(62px,6.25vw,94px);font-weight:400;line-height:1.18;letter-spacing:-.055em;white-space:nowrap}.accent-word {color:var(--blue)}.hero-description {margin-top:30px;color:var(--muted);font-size:16px;line-height:1.9}.hero-actions {display:flex;align-items:center;gap:14px;margin-top:34px}.button {position:relative;display:inline-flex;align-items:center;justify-content:center;gap:26px;min-height:52px;padding:14px 25px;border:1px solid var(--line-strong);border-radius:999px;font-size:14px;font-weight:500;overflow:hidden;isolation:isolate;transition:color .3s,border-color .3s,transform .2s}.button:before {position:absolute;z-index:-1;inset:0;border-radius:inherit;background:var(--ink);clip-path:circle(0% at 90% 50%);content:"";transition:clip-path .46s cubic-bezier(.2,.7,.2,1)}.button:hover:before {clip-path:circle(150% at 90% 50%)}.button:active {transform:scale(.98)}.button-primary {background:var(--blue);border-color:var(--blue);color:#fff}.button-primary:hover {border-color:var(--ink);color:var(--page)}.button-secondary {background:transparent}.button-secondary:hover {color:var(--page);border-color:var(--ink)}html[data-theme=dark] .button-primary {color:#071326}.mobile-break {display:none}
.hero-art {position:relative;height:550px;min-width:0;margin-left:-5px;margin-right:-55px;z-index:1;user-select:none;visibility:hidden;opacity:0;transition:opacity .25s}.hero-art[data-ready=true] {visibility:visible;opacity:1}.hero-art canvas {position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y;cursor:grab}.hero-art canvas:active {cursor:grabbing}.art-caption {position:absolute;bottom:18px;left:15%;right:15%;display:flex;justify-content:space-between;gap:20px;pointer-events:none;color:var(--subtle);font-size:11px;letter-spacing:.03em}.art-hint {color:var(--muted)}.art-controls {position:absolute;bottom:47px;right:15%;display:flex;gap:5px;background:var(--header);border:1px solid var(--line);border-radius:999px;padding:3px;opacity:0;transition:opacity .2s}.hero-art:hover .art-controls,.hero-art:focus-within .art-controls {opacity:1}.art-controls .icon-button {width:30px;height:30px}.art-controls .icon {width:16px;height:16px}.play-icon {display:none}html[data-motion=paused] .pause-icon {display:none}html[data-motion=paused] .play-icon {display:block}
.model-section {padding:36px 0 65px;border-top:1px solid var(--line)}.model-heading {display:flex;justify-content:space-between;gap:32px;align-items:center}.model-heading h2 {font-family:var(--serif);font-size:30px;font-weight:400;letter-spacing:-.04em}.model-heading p {font-size:12px;color:var(--muted)}.marquee {overflow:hidden;margin-top:45px;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}.marquee-track {display:flex;width:max-content;animation:model-flow 40s linear infinite}.model-set {display:flex;align-items:center;flex:none;gap:85px;padding-right:85px}.model-set a {font-family:var(--serif);font-size:43px;letter-spacing:-1.8px;color:var(--muted);transition:color .2s}.model-set a:nth-child(2),.model-set a:nth-child(5) {font-family:var(--sans);font-size:38px;font-weight:600;letter-spacing:-1.4px}.model-set a:hover {color:var(--blue)}.marquee:hover .marquee-track,.marquee:focus-within .marquee-track,html[data-motion=paused] .marquee-track {animation-play-state:paused}@keyframes model-flow {to {transform:translateX(-50%)}}
.section-heading {margin-bottom:48px}.section-heading h2,.developer-copy h2,.faq-heading h2,.final-cta h2 {font-family:var(--serif);font-size:clamp(38px,4.25vw,60px);font-weight:400;letter-spacing:-.055em;line-height:1.22}.section-heading p {margin-top:24px;color:var(--muted);font-size:15px}.capability-grid {display:grid;grid-template-columns:1.2fr .8fr;gap:20px}.feature {border:1px solid var(--line);border-radius:24px;background:var(--surface);padding:32px;min-width:0}.feature-top {display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.feature-icon {width:26px;height:26px;color:var(--blue)}.feature-tag {font-size:11px;letter-spacing:.05em;color:var(--muted)}.feature h3 {font-size:24px;line-height:1.45;font-weight:500;letter-spacing:-.7px}.feature p {font-size:13px;color:var(--muted);max-width:48ch;margin-top:12px}.feature-api {grid-row:span 2;background:linear-gradient(160deg,var(--surface) 30%,var(--wash));display:flex;flex-direction:column;min-height:580px;padding:38px}.feature-api h3 {font-family:var(--serif);font-size:36px;letter-spacing:-1.7px;line-height:1.25}.connection-diagram {display:flex;align-items:center;justify-content:center;margin-block:auto;gap:0;padding-block:50px;font-size:12px}.diagram-source {display:flex;align-items:center;gap:9px;white-space:nowrap}.diagram-source .icon {width:24px;height:24px}.diagram-line {flex:1;min-width:16px;max-width:70px;height:1px;background:var(--line-strong);position:relative}.diagram-line:after {content:"";position:absolute;inset:-4px auto auto 0;height:8px;width:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 12px rgb(22 119 255 / .35);animation:connection-flow 4s ease-in-out infinite}.diagram-line:last-of-type:after {animation-delay:1s}.diagram-port {display:flex;flex-direction:column;align-items:center;gap:5px;border:1px solid var(--line-strong);border-radius:18px;padding:17px 20px;background:var(--surface);box-shadow:var(--shadow)}.diagram-port img {border-radius:11px;margin-bottom:3px}.diagram-port span {font-family:var(--mono);color:var(--muted);font-size:11px}.diagram-models {display:flex;flex-direction:column;gap:10px;font-family:var(--mono);font-size:10px}.diagram-models span {background:var(--surface);border:1px solid var(--line);padding:8px 11px;border-radius:8px;white-space:nowrap}@keyframes connection-flow {0% {left:0;opacity:0}15% {opacity:1}85% {opacity:1}100% {left:calc(100% - 8px);opacity:0}}html[data-motion=paused] .diagram-line:after {animation-play-state:paused}.endpoint-list {display:flex;flex-wrap:wrap;gap:8px;padding-top:20px;border-top:1px solid var(--line)}.endpoint-list code {font-family:var(--mono);font-size:10px;color:var(--muted);padding:5px 9px;border:1px solid var(--line);border-radius:6px}.key-illustration {display:grid;grid-template-columns:1fr auto;gap:14px;padding:18px 20px;margin-top:25px;margin-bottom:23px;border:1px solid var(--line);border-radius:14px;background:var(--surface-soft)}.key-illustration>span {font-size:9px;font-family:var(--mono);letter-spacing:.12em;color:var(--muted)}.key-illustration code {grid-row:2;font-size:14px;font-family:var(--mono);letter-spacing:2px}.key-illustration .icon {grid-column:2;grid-row:1/3;align-self:center;color:var(--subtle)}.text-link {display:inline-flex;align-items:center;gap:13px;font-size:13px;color:var(--blue);font-weight:500;transition:gap .2s}.text-link:hover {gap:19px}.feature-usage {display:flex;flex-direction:column}.feature-usage .text-link {margin-top:25px}.tools-row {display:flex;justify-content:space-between;align-items:center;gap:35px;padding-top:44px}.tools-row h3 {font-size:17px;font-weight:500;letter-spacing:-.3px}.tools-row p {font-size:12px;color:var(--muted);margin-top:6px}.tool-names {display:flex;flex-wrap:wrap;gap:26px}.tool-names span {display:flex;gap:9px;align-items:center;font-size:13px;color:var(--muted)}.tool-names .icon {width:19px;height:19px}
