/* Native-inspired surfaces; keep the independent artwork and core interactions. */
:root{--bg:#f5f5f7;--ink:#1d1d1f;--muted:#65656b;--line:#dedee3;--panel:#fff;--radius:30px;--accent:#0066cc;--glass:rgba(255,255,255,.86)}
html{scroll-padding-top:112px}body{letter-spacing:-.015em}.landing>header{position:sticky;top:14px;z-index:100;width:min(1120px,calc(100% - 48px));padding:0;margin-top:18px}
nav,.subpage nav{height:66px;min-height:66px;padding:10px 18px 10px 22px;border:1px solid #ffffffaa;border-radius:24px;background:var(--glass);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);box-shadow:0 2px 6px #1d1d1f04,0 12px 36px #1d1d1f08;gap:22px}
nav .brand{font-size:16px;letter-spacing:-.55px}.mark{width:33px;height:33px;border-radius:10px;background:var(--ink)}.mark img{filter:invert(1)}nav .links{margin-left:auto;font-size:12px;gap:24px}.appearance-toggle{display:grid;place-items:center;flex:none;width:36px;height:36px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--panel);color:var(--ink);transition:transform .2s}.appearance-toggle:hover{transform:scale(1.08)}
.hero{padding-top:58px}.hero .eyebrow{font-size:12px;text-transform:none;letter-spacing:.05em;color:var(--muted);font-weight:500}.hero h1{font-size:clamp(52px,6.5vw,92px);font-weight:700;letter-spacing:-.055em;line-height:1.02;margin-top:18px;margin-bottom:24px}.hero-lead{font-size:clamp(18px,1.65vw,23px);letter-spacing:-.025em}.hero .actions{margin-top:28px}.btn{border-radius:999px;font-weight:500;min-height:48px;padding:12px 24px}.primary{background:var(--accent);color:#fff}.primary .icon{filter:invert(1)}.primary:hover{background:#006bd6;box-shadow:0 8px 20px #0071e329}.text-link{color:var(--accent);text-decoration:none}.text-link:hover{text-decoration:underline}.text-link .icon{filter:invert(30%) sepia(97%) saturate(2538%) hue-rotate(197deg) brightness(95%) contrast(104%)}.clients{font-size:12px;color:var(--muted);margin-top:17px}
.hero-stage{margin-top:14px!important;max-width:1260px;min-height:0!important}.stage-caption{max-width:1260px;margin-top:32px;padding-bottom:25px;gap:20px}.stage-caption p{color:var(--muted);font-size:11px}.stage-caption>div:first-child{max-width:620px}.scene-controls{background:var(--glass);padding:6px;border:1px solid #ffffffb0;border-radius:999px;box-shadow:0 6px 20px #1d1d1f0b;backdrop-filter:blur(20px)}.scene-controls button{border:0;min-height:32px;border-radius:999px;padding:7px 12px;font-size:11px}.reset-objects{background:var(--panel)}.motion-toggle[aria-pressed=true]{background:var(--ink);color:var(--bg)}.motion-toggle[aria-pressed=true] img{filter:invert(1)}
.workflow{background:#fff;color:var(--ink);margin:20px auto 0;max-width:1260px;border:1px solid var(--line);border-radius:32px;padding:36px 0}.workflow-grid{padding-inline:34px;gap:30px}.workflow h2{font-size:29px;line-height:1.12;letter-spacing:-1.3px}.workflow h3{font-size:15px;font-weight:650}.workflow p{color:var(--muted);font-size:13px}.workflow-icon{filter:invert(30%) sepia(97%) saturate(2538%) hue-rotate(197deg) brightness(95%) contrast(104%)}
h2{font-weight:650;letter-spacing:-.045em}.eyebrow{color:var(--muted);text-transform:none;font-size:13px;letter-spacing:.02em}.section-heading{margin-bottom:45px}.card{border:0;background:var(--panel);border-radius:30px;padding:32px;box-shadow:0 2px 5px #1d1d1f03;transition:transform .4s,box-shadow .4s}.card:hover{transform:translateY(-5px);box-shadow:0 16px 42px #1d1d1f0b}.num{display:inline-block;color:var(--accent);font-size:13px;font-weight:650}.card h3{font-size:28px;font-weight:650;margin-top:40px}.card p{font-size:16px;line-height:1.6}.feature-grid{gap:22px}.feature-grid .card:nth-child(4){background:#e8f1fb}.feature-grid .card:nth-child(5){background:#e9efea}
.setup-section{background:transparent;border:0;padding-top:30px;padding-bottom:70px}.setup-grid{background:#e9e9ed;border-radius:40px;padding:60px;gap:55px}.setup-panel{background:var(--panel);color:var(--ink);border:1px solid #ffffff80;border-radius:28px;box-shadow:0 16px 45px #1d1d1f08;padding:24px}.client-tabs{background:#eeeef0;border-radius:11px;padding:3px;gap:2px}.client-tabs button{color:#626267;font-weight:500;padding:10px 6px}.client-tabs button[aria-selected=true]{background:#fff;color:#1d1d1f;border-radius:8px;box-shadow:0 2px 5px #0000001a}.terminal-label{color:var(--muted);font-size:10px;letter-spacing:1px}.command-row{background:#f5f5f7;border-color:var(--line);border-radius:16px}.command-row code{color:#25523a}.command-row button{background:#fff;border:1px solid var(--line);border-radius:10px}.setup-hint{color:var(--muted);min-height:42px}.setup-panel .text-link{color:var(--accent)}.setup-panel .text-link .icon{filter:invert(30%) sepia(97%) saturate(2538%) hue-rotate(197deg) brightness(95%) contrast(104%)}.try-prompt{border-color:var(--line)}.try-prompt>p:last-child{color:var(--ink);font-size:17px}.copy-status{color:#276333}.setup-panel a:focus-visible,.setup-panel button:focus-visible,.setup-panel [tabindex]:focus-visible{outline-color:var(--accent)}
.proof-strip{background:var(--panel);border:0;padding:30px;border-radius:28px}.community-link{border-top:0}.final-cta{margin:0 auto;max-width:1260px;border-radius:40px;background:#1d1d1f;color:#f5f5f7}.final-cta .eyebrow{color:#b9bac0}.footer-source{color:#d2d2d7}.subpage nav{position:sticky;top:14px;z-index:100;margin-top:18px}.subpage .code,.subpage .guide pre{background:var(--panel);border-color:var(--line);border-radius:18px}.subpage .client-links .btn{border:0;box-shadow:0 2px 6px #00000008}.subpage .guide{scroll-margin-top:115px}.subpage button.appearance-toggle{padding:0;background:var(--panel)}.subpage .card h3{font-size:25px}
[data-appearance=dark]{color-scheme:dark;--bg:#101113;--ink:#f5f5f7;--muted:#aaacb3;--line:#36373c;--panel:#202226;--accent:#70b7ff;--glass:rgba(32,34,38,.86)}
[data-appearance=dark] nav{border-color:#ffffff1c;box-shadow:0 10px 40px #0003}[data-appearance=dark] .mark{background:#f5f5f7}[data-appearance=dark] .mark img{filter:none}[data-appearance=dark] .appearance-toggle img,[data-appearance=dark] .scene-controls img,[data-appearance=dark] .links .icon{filter:invert(1)}[data-appearance=dark] .primary{background:#0071e3;color:#fff}[data-appearance=dark] .workflow{background:var(--panel)}[data-appearance=dark] .scene-controls{border-color:var(--line)}[data-appearance=dark] .feature-grid .card:nth-child(4){background:#182b40}[data-appearance=dark] .feature-grid .card:nth-child(5){background:#1d3027}[data-appearance=dark] .setup-grid{background:#181a1e}[data-appearance=dark] .setup-panel{border-color:var(--line)}[data-appearance=dark] .client-tabs{background:#101113}[data-appearance=dark] .client-tabs button{color:#b4b6be}[data-appearance=dark] .client-tabs button[aria-selected=true]{background:#41434a;color:#fff}[data-appearance=dark] .command-row{background:#141619}[data-appearance=dark] .command-row code{color:#a2d7b9}[data-appearance=dark] .command-row button{background:#e4e8e6}[data-appearance=dark] .copy-status{color:#a2d7b9}[data-appearance=dark] .secondary{color:var(--ink)}[data-appearance=dark] .final-cta{background:#202226}[data-appearance=dark] .subpage .copy-command{color:#14200d}[data-appearance=dark] .motion-toggle[aria-pressed=true]{color:#101113}[data-appearance=dark] .motion-toggle[aria-pressed=true] img{filter:none}
@supports not (backdrop-filter:blur(1px)){nav,.scene-controls{background:var(--panel)}}
@media(max-width:1000px){.hero-stage,.workflow,.final-cta{max-width:calc(100% - 32px)}.setup-grid{width:calc(100% - 32px);padding:38px;gap:30px}.workflow h2{margin-bottom:0}.landing>header{width:calc(100% - 32px)}}
@media(max-width:700px){.landing>header{top:8px;margin-top:10px}.hero{padding-top:34px}.hero h1{font-size:clamp(43px,9vw,61px);line-height:1.05}.hero .actions{gap:20px}.hero-lead{font-size:18px}.hero-stage{width:calc(100% - 24px);margin:32px auto 0!important}.stage-caption{padding-inline:22px;margin-top:20px}.scene-controls{margin-left:0}.workflow{padding:30px 0;margin-top:10px;border-radius:26px}.workflow-grid{padding-inline:24px}.workflow h2{font-size:29px}.setup-grid{padding:30px 20px;border-radius:28px}.setup-panel{padding:18px;border-radius:22px}.card{padding:28px;border-radius:26px}.card h3{font-size:25px;margin-top:28px}.final-cta{border-radius:28px}.final-cta h2{font-size:54px}nav,.subpage nav{gap:10px;flex-wrap:wrap;height:auto;min-height:66px;padding:12px 15px;border-radius:23px}nav .brand{font-size:15px}nav .links{order:3;flex-basis:100%;justify-content:space-between;font-size:12px;gap:14px;margin-left:0;padding:3px 2px 0}.appearance-toggle{margin-left:auto;width:32px;height:32px}.subpage nav{top:8px}.subpage .guide{scroll-margin-top:145px}html{scroll-padding-top:140px}}
/* Shared navigation appearance control, including nested articles and guides. */
.appearance-toggle[hidden]{display:none}.appearance-toggle span{font-size:22px;line-height:1}
[data-appearance=dark] .subpage .blog-filters button{color:var(--ink)}
[data-appearance=dark] .subpage .blog-filters button[aria-pressed=true]{color:var(--bg)}
.library-search{background:var(--panel);color:var(--ink)}
@media(min-width:701px) and (max-width:1000px){.subpage nav{height:auto;flex-wrap:wrap}.subpage nav .links{order:3;flex-basis:100%;justify-content:space-between;margin-left:0}}
[data-appearance=dark] .subpage .blog-filters button:not(.appearance-toggle){color:var(--ink)}
[data-appearance=dark] .subpage .blog-filters button:not(.appearance-toggle)[aria-pressed=true]{color:var(--bg)}
