/* Pastel Studio. Loaded after style.css; content remains visible without JavaScript. */
:root {
  --paper:#fbfaf7;
  --panel:#fff;
  --ink:#2d3042;
  --muted:#5f6271;
  --line:#dedee7;
  --accent:#65508c;
  --accent-hover:#503c74;
  --record-red:#bd3d49;
  --soft-blue:#deebfa;
  --glass:#fbfaf7ed;
  --glass-border:#dedee7;
  --studio-lilac:#e8def8;
  --studio-mint:#dcefe5;
  --studio-peach:#f8dfd1;
  --studio-blue:#deebfa;
  --studio-yellow:#f6edc8;
  --studio-shadow:#42345212;
  --studio-font:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --card-shadow:0 6px 18px #42345204,0 18px 44px var(--studio-shadow);
  --lift-shadow:0 12px 28px #4234520b,0 24px 48px var(--studio-shadow);
}
html[data-theme="dark"] {
  --paper:#22232e;
  --panel:#2b2e3b;
  --ink:#f2eff8;
  --muted:#c0becd;
  --line:#4d4b5e;
  --accent:#d2bcfc;
  --accent-hover:#e3d4ff;
  --record-red:#ff929d;
  --soft-blue:#34465f;
  --glass:#22232eed;
  --glass-border:#4d4b5e;
  --studio-lilac:#423953;
  --studio-mint:#314c44;
  --studio-peach:#554039;
  --studio-blue:#34465f;
  --studio-yellow:#514a34;
  --studio-shadow:#00000022;
  --card-shadow:0 6px 18px #0000000a,0 18px 44px var(--studio-shadow);
  --lift-shadow:0 12px 28px #00000018,0 24px 48px var(--studio-shadow);
}
@media(prefers-color-scheme:dark) {
  html:not([data-theme="light"]):not([data-theme="dark"]) {
    color-scheme:dark;
    --paper:#22232e;--panel:#2b2e3b;--ink:#f2eff8;--muted:#c0becd;--line:#4d4b5e;
    --accent:#d2bcfc;--accent-hover:#e3d4ff;--record-red:#ff929d;--soft-blue:#34465f;
    --glass:#22232eed;--glass-border:#4d4b5e;--studio-lilac:#423953;--studio-mint:#314c44;
    --studio-peach:#554039;--studio-blue:#34465f;--studio-yellow:#514a34;--studio-shadow:#00000022;
    --card-shadow:0 6px 18px #0000000a,0 18px 44px var(--studio-shadow);
    --lift-shadow:0 12px 28px #00000018,0 24px 48px var(--studio-shadow);
  }
}
[hidden] {display:none!important}
body {font-family:var(--studio-font)}
body[data-analytics-page="home"] h1,
body[data-analytics-page="home"] main h2 {font-family:var(--studio-font);font-weight:550;letter-spacing:-.055em}
body[data-analytics-page="home"] main h2 {font-size:clamp(2rem,3.6vw,3.1rem);line-height:1.14}
h3 {font-weight:600;letter-spacing:-.025em}
.eyebrow {color:var(--accent);letter-spacing:.1em;text-transform:uppercase}
.brand {font-weight:700;letter-spacing:-.065em;line-height:1}
.brand-rec {color:var(--record-red)}
.button {min-height:48px;font-weight:550;gap:.65rem}
.primary {background:var(--ink);color:var(--paper);box-shadow:0 5px 0 var(--studio-lilac)}
.primary:hover {background:var(--ink);color:var(--paper);box-shadow:0 8px 0 var(--studio-lilac);transform:translateY(-3px)}
.secondary {background:transparent;border-color:var(--line);box-shadow:none}
.secondary:hover {background:var(--studio-lilac);border-color:var(--studio-lilac);box-shadow:none}
.text-link {display:inline-flex;align-items:center;min-height:44px;gap:.35rem}
:is(a,button,select,summary,input):focus-visible,[data-studio-keyboard-focus]:focus {outline:3px solid var(--accent);outline-offset:4px}

/* Header controls preserve a full navigation fallback when scripting is unavailable. */
.site-header {max-width:1180px;gap:16px;padding:12px 20px;border-color:var(--line);border-radius:24px;box-shadow:0 8px 26px var(--studio-shadow);background:var(--glass)}
.site-header nav {gap:2px}
.site-header nav a {display:inline-flex;align-items:center;min-height:44px;padding:.5rem .6rem}
.site-header nav a:hover {background:var(--studio-lilac);color:var(--accent)}
.studio-header-actions {display:flex;align-items:center;gap:6px;flex-shrink:0;margin-left:auto}
.studio-language {display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px;border-radius:14px;font-size:.75rem;font-weight:550;white-space:nowrap}
.studio-language:hover {background:var(--studio-lilac)}
.studio-download-trigger {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 17px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:.79rem;font-weight:550;white-space:nowrap}
.studio-download-trigger:hover {box-shadow:0 4px 0 var(--studio-lilac);transform:translateY(-2px)}
.studio-menu-button {display:none;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:10px;border-radius:50%;background:var(--studio-lilac);color:var(--ink)}
.studio-menu-button svg {width:22px;height:22px}

/* The hero illustration uses drawn lines and CSS motion, with no remote asset dependency. */
body[data-analytics-page="home"] .hero.studio-hero {grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:5%;padding:78px 24px 58px;overflow:visible}
.studio-hero .hero-copy {width:100%;margin:0}
body[data-analytics-page="home"] .studio-hero h1 {font-size:clamp(3rem,5.3vw,4.75rem);line-height:1.055;letter-spacing:-.065em;font-weight:550}
.studio-hero h1 :is(em,span) {font-style:normal;color:var(--accent)}
body[data-analytics-page="home"] .studio-hero h1 em {font-weight:inherit}
.studio-hero h1 em {position:relative;display:inline-block}
.studio-hero h1 em::after {content:"";display:block;width:78%;height:9px;border-top:2px solid currentColor;border-radius:50%;transform:rotate(-3deg);opacity:.5;margin-top:7px}
.studio-hero .eyebrow {display:flex;align-items:center;gap:9px;font-size:.7rem}
.studio-hero .eyebrow::before {content:"";width:7px;height:7px;border-radius:50%;background:var(--record-red);flex:none}
body[data-analytics-page="home"] .studio-hero .lead {max-width:450px;font-size:1.04rem;line-height:1.8}
.studio-hero .preview {max-width:450px;font-size:.75rem;line-height:1.7}
.studio-art {position:relative;isolation:isolate;display:grid;place-items:center;min-width:0;width:100%;max-width:500px;min-height:400px;margin:0 auto}
.studio-art :is(svg,.icon) {width:22px;height:22px;stroke-width:1.6}
.studio-disc,.studio-art-disc {position:absolute;inset:7% 3% 10%;border-radius:46% 54% 60% 40%;background:var(--studio-lilac);transform:rotate(-9deg);z-index:-1}
.studio-orbit {position:absolute;left:3%;top:23%;width:94%;height:43%;border:1px solid var(--accent);border-radius:50%;transform:rotate(-27deg);opacity:.5;pointer-events:none}
.studio-orbit.second {width:74%;height:77%;left:14%;top:6%;transform:rotate(35deg);opacity:.25}
.studio-orbit::before {content:"";position:absolute;left:20%;top:4%;width:8px;height:8px;background:var(--accent);border-radius:50%}
.studio-friend {position:relative;width:97px;height:124px;background:var(--panel);border:1.5px solid var(--ink);border-radius:23px 35px 23px 23px;transform:rotate(-9deg);scale:1.2;box-shadow:8px 10px 0 var(--accent);z-index:2;animation:studio-bob 5s ease-in-out infinite}
.studio-friend-lines {position:absolute;left:24px;top:24px;width:44px;height:16px;border-block:1.5px solid var(--ink);opacity:.45}
.studio-eyes {position:absolute;left:29px;top:61px;display:flex;gap:19px;animation:studio-blink 7s infinite}
.studio-eyes::before,.studio-eyes::after {content:"";width:5px;height:9px;border-radius:8px;background:var(--ink)}
.studio-smile {position:absolute;width:14px;height:8px;border-bottom:1.5px solid var(--ink);border-radius:0 0 12px 12px;left:41px;top:78px}
.studio-arm {position:absolute;width:26px;height:31px;border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);border-radius:0 0 19px 0;right:-27px;top:51px;transform:rotate(-28deg);transform-origin:0 100%;animation:studio-wave 4s ease-in-out infinite}
.studio-arm.left {left:-27px;right:auto;border-left:1.5px solid var(--ink);border-right:0;border-radius:0 0 0 19px;transform:rotate(18deg);transform-origin:100% 100%;animation:none}
.studio-feet {position:absolute;left:25px;bottom:-18px;display:flex;gap:28px}
.studio-feet::before,.studio-feet::after {content:"";width:12px;height:18px;border-left:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);border-radius:0 0 0 5px}
.studio-spark {position:absolute;right:10%;top:11%;color:var(--accent);transform:rotate(12deg)}
.studio-art .studio-spark svg {width:28px;height:28px}
.studio-float {position:absolute;z-index:3;display:flex;align-items:center;gap:9px;max-width:62%;padding:12px 15px;border:1px solid var(--ink);border-radius:15px;background:var(--studio-mint);box-shadow:3px 4px 0 var(--studio-shadow);font-size:.78rem;line-height:1.5;animation:studio-float 6s ease-in-out infinite}
.studio-float:is(.audio,.studio-audio) {left:0;top:13%;transform:rotate(-6deg);background:var(--studio-blue)}
.studio-float:is(.task,.studio-task) {right:0;bottom:14%;transform:rotate(5deg);animation-delay:-3s}
.studio-float:is(.idea,.studio-idea) {left:2%;bottom:17%;background:var(--studio-peach);padding:13px;transform:rotate(-10deg);animation-delay:-1s}
.studio-art-caption {position:absolute;bottom:0;right:10%;max-width:80%;font-size:.69rem;color:var(--muted);text-align:right}
.studio-device-strip {max-width:1132px;display:flex;justify-content:center;align-items:center;gap:20px 38px;flex-wrap:wrap;margin:0 auto;padding:22px 24px;border-block:1px solid var(--line);font-size:.82rem}
.studio-device-strip :is(a,span) {display:inline-flex;align-items:center;gap:9px;min-width:0}
.studio-device-strip a {min-height:44px}
.studio-device-strip svg {width:19px;height:19px;color:var(--accent)}
body[data-analytics-page="home"] .principles {border:0;padding-block:22px;font-size:.8rem}

/* A compact, clearly illustrative workspace; its controls remain ordinary buttons. */
.studio-demo {min-width:0;margin:0 0 28px;border:1px solid var(--line);border-radius:26px;background:var(--panel);box-shadow:var(--card-shadow);overflow:hidden}
.studio-demo :is(svg,.icon) {width:19px;height:19px;stroke-width:1.6}
.studio-demo-top {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 22px;border-bottom:1px solid var(--line);background:var(--paper);font-size:.75rem}
.studio-demo-top>* {min-width:0}
.studio-demo-top small {font-size:.72rem;color:var(--muted);text-align:right}
.studio-demo-top .window-dots {width:auto;gap:5px;flex:none}
.studio-demo-top .window-dots i {width:7px;height:7px;border:1px solid var(--muted);background:transparent}
.studio-dots {display:flex;gap:5px;flex:none}
.studio-dots :is(b,i) {display:block;width:7px;height:7px;border:1px solid var(--muted);border-radius:50%}
.studio-demo-body {display:grid;grid-template-columns:160px 220px minmax(0,1fr);min-height:350px}
.studio-demo-side {min-width:0;background:var(--paper);border-right:1px solid var(--line);padding:25px 17px;font-size:.75rem}
.studio-demo-side :is(.brand,.studio-brand) {display:inline-flex;font-size:1.5rem;letter-spacing:-.06em;font-weight:700;margin:0 0 26px}
.studio-brand em {font-style:normal;color:var(--record-red)}
.studio-demo-nav {display:flex;align-items:center;gap:8px;padding:11px 9px;margin-bottom:5px;border-radius:10px}
.studio-demo-nav.active {background:var(--studio-lilac);color:var(--accent)}
.studio-demo .studio-demo-nav svg {width:16px;height:16px}
.studio-demo-list {min-width:0;padding:25px 15px;border-right:1px solid var(--line);font-size:.78rem}
.studio-demo-list>b {display:block;margin:0 0 17px 5px;font-weight:600}
.studio-note {padding:15px 12px;border-radius:14px;margin:6px 0;background:var(--studio-lilac);font-size:.75rem;line-height:1.5}
.studio-note span {font-size:.69rem;color:var(--muted);display:block;margin-top:5px}
.studio-note.other {background:transparent}
.studio-reader,.studio-demo-reader {padding:30px 30px 22px;min-width:0;display:flex;flex-direction:column}
.studio-demo :is(.studio-reader,.studio-demo-reader) h3 {font-size:1.55rem;letter-spacing:-.035em;font-weight:600;margin:0 0 7px}
.studio-reader-meta,.studio-demo-meta {font-size:.75rem;color:var(--muted);margin-bottom:22px}
.studio-demo-state {min-height:185px}
html:not([data-studio-ready]) .studio-demo-state>div+div {margin-top:24px}
.studio-wave-panel {border-radius:18px;padding:22px;background:var(--studio-peach);display:flex;align-items:center;gap:22px;min-width:0}
.studio-record {position:relative;display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;min-width:52px;border-radius:50%;background:var(--panel);color:var(--record-red);box-shadow:0 0 0 6px color-mix(in srgb,var(--record-red) 8%,transparent),0 0 26px color-mix(in srgb,var(--record-red) 18%,transparent)}
.studio-record::after {content:"";position:absolute;inset:-8px;border:1px solid var(--record-red);border-radius:50%;opacity:.3;animation:studio-pulse 2s infinite;pointer-events:none}
.studio-record[aria-pressed="true"] {background:var(--record-red);color:var(--panel)}
.studio-record:active {transform:scale(.96)}
.studio-wave-content {flex:1;min-width:0}
.studio-wave {height:32px;display:flex;align-items:center;gap:4px;overflow:hidden;margin-bottom:7px}
.studio-wave i {display:block;flex:0 1 4px;min-width:2px;height:var(--h,16px);background:var(--record-red);border-radius:3px;transform:scaleY(.42);transition:transform .3s var(--ease)}
.studio-demo.is-recording .studio-wave i {animation:studio-bars .65s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
.studio-wave-label {font-size:.75rem;line-height:1.5;color:var(--ink)}
.studio-demo-hint {font-size:.78rem;color:var(--muted);line-height:1.7;margin:16px 0 0}
.studio-summary {padding:17px 18px;border-radius:17px;background:var(--studio-mint);font-size:.85rem;animation:studio-enter .4s var(--ease)}
.studio-summary b {font-weight:600;display:flex;align-items:center;gap:8px;margin-bottom:9px}
.studio-summary p {font-size:.82rem;line-height:1.7;margin:0}
.studio-task-line {display:flex;gap:8px;align-items:flex-start;font-size:.8rem;padding:13px 0 0}
.studio-demo .studio-task-line svg {width:17px;height:17px;color:var(--accent);margin-top:2px}
.studio-connected {display:grid;gap:11px;animation:studio-enter .4s var(--ease)}
.studio-connected>div {padding:15px 17px;border-radius:15px;background:var(--studio-blue);font-size:.82rem;display:flex;gap:10px;align-items:center;min-width:0}
.studio-connected>div:last-child {background:var(--studio-peach);margin-left:26px}
.studio-steps {display:flex;gap:8px;padding:14px;background:var(--paper);border-top:1px solid var(--line)}
.studio-step {display:inline-flex;flex:1;align-items:center;justify-content:center;gap:9px;min-width:0;min-height:48px;padding:11px 10px;border-radius:14px;font-size:.84rem;font-weight:550}
.studio-step[aria-pressed="true"],.studio-step:hover {background:var(--studio-lilac);color:var(--accent)}
.studio-demo-footer {display:flex;align-items:center;justify-content:space-between;gap:16px 28px;padding:15px 22px;border-top:1px solid var(--line)}
.studio-demo-footer p {margin:0;color:var(--muted);font-size:.74rem;line-height:1.65}
.studio-demo-footer .text-link {flex-shrink:0;max-width:45%;font-size:.78rem}

/* Existing product, pricing, comparison, and Enterprise structures keep their content. */
body[data-analytics-page="home"] #how {background:transparent}
body[data-analytics-page="home"] .steps {gap:18px}
body[data-analytics-page="home"] .steps article {padding:28px;border:1px solid transparent;border-radius:24px;background:var(--studio-lilac);box-shadow:none;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
body[data-analytics-page="home"] .steps article:nth-child(2) {background:var(--studio-mint)}
body[data-analytics-page="home"] .steps article:nth-child(3) {background:var(--studio-peach)}
body[data-analytics-page="home"] .feature-icon {display:inline-grid;place-items:center;width:48px;height:48px;padding:10px;margin-bottom:23px;border:1px solid var(--ink);border-radius:15px;background:transparent;color:var(--ink)}
body[data-analytics-page="home"] .steps h3 {font-size:1.25rem;line-height:1.3}
.steps .eyebrow {color:var(--accent)}
.workspace-features {gap:18px}
.workspace-features article {padding:24px;border:1px solid var(--line);border-radius:22px;background:var(--panel)}
.workspace-features article:nth-child(2) {background:var(--studio-yellow);border-color:transparent}
.workspace-features article:nth-child(4) {background:var(--studio-blue);border-color:transparent}
.workspace-features svg {width:25px;height:25px;margin-bottom:20px}
.knowledge-detail {padding:22px 0}
body[data-analytics-page="home"] #knowledge .workspace {width:100%;max-width:100%;margin:26px 0 0;background:var(--panel);border-color:var(--line);border-radius:24px;box-shadow:var(--card-shadow)}
html[data-theme="dark"] body[data-analytics-page="home"] #knowledge .workspace {box-shadow:var(--card-shadow)}
.comparison-controls button {border-radius:999px}
.comparison-controls button[aria-pressed="true"] {background:var(--ink);border-color:var(--ink);color:var(--paper)}
.comparison-grid>article {border-radius:24px}
.comparison-grid>.comparison-recapp,.comparison-value {background:var(--studio-lilac)}
.comparison-grid>.comparison-recapp {border-color:color-mix(in srgb,var(--accent) 30%,var(--line))}
.comparison-value {border-radius:20px}
.pro-plan {background:var(--studio-blue);border-color:transparent;border-radius:24px}
.pro-price {font-family:var(--studio-font);font-weight:550;letter-spacing:-.055em}
.price-track,.price-bar {border-radius:999px}
.price-track {background:var(--line)}
.price-chart li:first-child .price-bar {background:var(--accent)}
.free-plan {padding:24px;border:1px solid var(--line);border-radius:20px;background:var(--studio-mint)}
body[data-analytics-page="home"] .enterprise-card {background:var(--panel);border-color:var(--line);border-radius:28px;box-shadow:none}
.enterprise-step-number {background:var(--studio-lilac);border-radius:13px}
.enterprise-boundary {padding:20px;border:0;border-radius:17px;background:var(--studio-yellow)}
.platforms article {border-color:var(--line);border-radius:26px;box-shadow:none}
.platforms article:nth-child(1) .platform-icon {background:var(--studio-lilac)}
.platforms article:nth-child(2) .platform-icon {background:var(--studio-mint)}
.platforms article:nth-child(3) .platform-icon {background:var(--studio-blue)}
.platforms article:nth-child(4) .platform-icon {background:var(--studio-peach)}
.platform-icon {color:var(--ink);border:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.platform-details>summary {min-height:44px;padding-block:12px}
.ios-version {font-size:.83rem;color:var(--muted);margin:.85rem 0 0}
.studio-outro {position:relative;padding:62px 24px;margin:26px auto 0;background:var(--studio-lilac);text-align:center}
body[data-analytics-page="home"] .studio-outro h2 {font-size:clamp(2.2rem,4.2vw,3.7rem);max-width:720px;margin:0 auto 27px;line-height:1.12}
.studio-outro p {font-size:.92rem;color:var(--muted);max-width:600px;margin:23px auto 0}
.studio-outro .studio-download-trigger {white-space:normal;max-width:100%}
footer {border-color:var(--line);padding-block:32px}
.footer-links {align-items:center;gap:8px 22px}
.footer-links a,.footer-choice,#studio-motion {display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:9px 0;font-size:.78rem}
#studio-motion {color:var(--muted);border-radius:12px}
#studio-motion:hover {color:var(--accent)}
#studio-motion svg {width:17px;height:17px}

/* Resource and billing routes use the same legible surfaces and typography. */
.resource-heading h1 {letter-spacing:-.055em;font-weight:550}
.resource-highlight {background:var(--studio-lilac);border-color:var(--line);box-shadow:none}
.hardware-card {border-color:var(--line);box-shadow:none}
.hardware-card:nth-child(2) {background:var(--studio-blue)}
.hardware-card:nth-child(3) {background:var(--studio-mint)}
.hardware-card:nth-child(4) {background:var(--studio-peach)}
.resource-section {padding-block:28px}
.resource-section h2 {font-weight:600}
.resource-heading>.button {margin-top:16px}
.analytics-consent {background:var(--panel);border-color:var(--line);box-shadow:0 18px 60px var(--studio-shadow)}
.analytics-consent .primary {box-shadow:none}

/* Native dialogs support keyboard focus, Escape, and long localized options. */
dialog {background:var(--panel);border-color:var(--line);box-shadow:0 25px 80px #15122133;backdrop-filter:none;-webkit-backdrop-filter:none}
dialog::backdrop {background:#22232e66;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
dialog .close {min-width:44px;min-height:44px;background:var(--paper);color:var(--ink)}
#download-dialog,#navigation-dialog {width:calc(100% - 32px);max-width:520px;padding:28px;max-height:min(88dvh,820px);overscroll-behavior:contain}
.studio-dialog-header {display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:10px}
.studio-dialog-header h2 {min-width:0;font-size:1.8rem;line-height:1.18;letter-spacing:-.04em;font-weight:600;margin:4px 0 0}
.studio-dialog-header .close {display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;padding:10px;margin:0;border-radius:50%}
.studio-dialog-header .close svg {width:20px;height:20px}
.studio-download-list {display:grid;gap:10px;margin-top:22px}
.studio-download-option {display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:12px;min-height:74px;max-width:100%;padding:17px;border:1px solid var(--line);border-radius:18px;text-align:left;background:var(--panel);color:var(--ink)}
.studio-download-option>* {min-width:0}
.studio-download-identity {display:flex;align-items:center;gap:10px}
.studio-download-identity strong {font-weight:600;font-size:.95rem}
.studio-download-identity svg {width:23px;height:23px;color:var(--accent)}
.studio-download-actions {display:grid;gap:9px}
.studio-download-actions .button {width:100%;padding:10px 12px;font-size:.76rem;line-height:1.5;min-height:44px;box-shadow:none}
.studio-download-option .studio-download-meta {grid-column:1/-1;font-size:.75rem;line-height:1.65;color:var(--muted);margin:0}
.studio-download-option>details {grid-column:1/-1;min-width:0;font-size:.75rem}
.studio-download-option>details summary {min-height:44px;padding:11px 0;font-weight:550}
.studio-download-option>details p {font-size:.74rem;line-height:1.7;margin:0 0 3px}
#studio-download-status {font-size:.75rem;line-height:1.6;margin:14px 0;color:var(--muted)}
#studio-download-details {margin-top:15px;font-size:.83rem}
.studio-navigation-links {display:grid;gap:7px;margin-top:22px}
.studio-navigation-links a {display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:12px 15px;border:1px solid var(--line);border-radius:14px;font-size:.95rem;white-space:normal}
.studio-navigation-links a:hover {background:var(--studio-lilac);color:var(--accent)}

@keyframes studio-bob {0%,100%{transform:translateY(3px) rotate(-9deg)}50%{transform:translateY(-9px) rotate(-4deg)}}
@keyframes studio-blink {0%,43%,47%,100%{transform:scaleY(1)}45%{transform:scaleY(.1)}}
@keyframes studio-wave {0%,45%,100%{transform:rotate(-28deg)}55%,75%{transform:rotate(-58deg)}65%,85%{transform:rotate(-28deg)}}
@keyframes studio-float {0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes studio-bars {from{transform:scaleY(.3)}to{transform:scaleY(1)}}
@keyframes studio-pulse {0%{transform:scale(.93);opacity:.35}100%{transform:scale(1.22);opacity:0}}
@keyframes studio-enter {from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@media(hover:hover) and (pointer:fine) {
  body[data-analytics-page="home"] .steps article:hover {transform:translateY(-5px);box-shadow:var(--lift-shadow)}
}
@media(max-width:1100px) {
  .site-header {flex-wrap:wrap;justify-content:space-between;gap:6px 18px}
  .site-header .studio-desktop-nav {order:3;flex-basis:100%;margin:0;justify-content:center}
  .studio-demo-body {grid-template-columns:140px 185px minmax(0,1fr)}
  .studio-reader,.studio-demo-reader {padding:26px 24px 20px}
  .studio-wave-panel {gap:18px;padding:20px}
}
@media(max-width:760px) {
  .site-header {width:calc(100% - 24px);padding:10px 14px;gap:7px 12px;justify-content:space-between;border-radius:22px}
  .site-header .brand {font-size:1.5rem}
  .site-header .brand img {width:28px;height:28px}
  .studio-header-actions {gap:4px}
  .studio-header-actions .studio-download-trigger {display:none}
  .site-header .studio-desktop-nav {gap:3px;flex-wrap:wrap}
  body[data-analytics-page="home"] .site-header .studio-desktop-nav a {display:inline-flex;white-space:normal}
  html[data-studio-ready] .site-header .studio-desktop-nav {display:none}
  html[data-studio-ready] .studio-menu-button {display:inline-flex}
  body[data-analytics-page="home"] .hero.studio-hero {grid-template-columns:minmax(0,1fr);padding:42px 24px 32px;gap:22px}
  body[data-analytics-page="home"] .studio-hero h1 {font-size:clamp(2.65rem,9.7vw,4.25rem);max-width:600px;line-height:1.055}
  body[data-analytics-page="home"] .studio-hero .lead {font-size:1rem;max-width:570px}
  .studio-hero .hero-copy {max-width:none}
  .studio-hero .eyebrow {font-size:.67rem;margin-bottom:22px}
  .studio-hero .actions {gap:9px}
  .studio-hero .preview {font-size:.7rem}
  .studio-art {min-height:305px;max-width:410px;margin-top:6px}
  .studio-friend {scale:1}
  .studio-disc,.studio-art-disc {inset:5% 8% 9%}
  .studio-float {padding:11px 13px;font-size:.75rem}
  .studio-float:is(.audio,.studio-audio) {left:1%;top:12%}
  .studio-float:is(.task,.studio-task) {right:1%;bottom:13%}
  .studio-art-caption {font-size:.66rem}
  .studio-device-strip {gap:12px 23px;margin-inline:24px;padding:18px 0;font-size:.75rem}
  .studio-device-strip svg {width:17px;height:17px}
  body[data-analytics-page="home"] main h2 {font-size:clamp(1.95rem,7.4vw,2.6rem)}
  .studio-demo {border-radius:22px;margin-bottom:20px}
  .studio-demo-top {padding:13px 16px;font-size:.7rem;gap:8px}
  .studio-demo-top small {font-size:.66rem}
  .studio-demo-body {grid-template-columns:minmax(0,1fr);min-height:315px}
  .studio-demo-side,.studio-demo-list {display:none}
  .studio-reader,.studio-demo-reader {padding:25px 22px 22px}
  .studio-demo :is(.studio-reader,.studio-demo-reader) h3 {font-size:1.4rem}
  .studio-reader-meta,.studio-demo-meta {font-size:.71rem;margin-bottom:18px}
  .studio-demo-state {min-height:190px}
  .studio-wave-panel {padding:20px 18px;gap:18px}
  .studio-record {width:48px;height:48px;min-width:48px}
  .studio-wave {gap:3px}
  .studio-wave-label {font-size:.72rem}
  .studio-demo-hint {font-size:.78rem}
  .studio-steps {gap:4px;padding:9px}
  .studio-step {flex-direction:column;gap:5px;min-height:64px;padding:9px 4px;font-size:.77rem;line-height:1.4;border-radius:12px}
  .studio-demo .studio-step svg {width:19px;height:19px}
  .studio-demo-footer {flex-direction:column;align-items:flex-start;gap:6px;padding:16px 22px}
  .studio-demo-footer .text-link {max-width:100%}
  body[data-analytics-page="home"] .steps {gap:14px}
  body[data-analytics-page="home"] .steps article {padding:24px;border-radius:22px}
  body[data-analytics-page="home"] .feature-icon {margin-bottom:20px}
  .workspace-features article {padding:22px}
  .knowledge-detail {padding-block:10px}
  body[data-analytics-page="home"] #knowledge .workspace {margin-top:26px;border-radius:17px}
  .enterprise-boundary {align-items:flex-start;padding:18px}
  .enterprise-boundary svg {margin-top:4px}
  .studio-outro {padding:44px 24px;margin-top:14px}
  body[data-analytics-page="home"] .studio-outro h2 {font-size:2.3rem}
  .studio-outro p {font-size:.85rem}
  .analytics-consent {flex-direction:column;align-items:stretch;gap:15px;padding:20px;bottom:12px}
  .analytics-actions {width:100%;flex-wrap:wrap}
  .analytics-actions .button {flex:1;white-space:normal;min-height:44px}
  #download-dialog,#navigation-dialog {width:calc(100% - 16px);max-width:520px;max-height:calc(100dvh - 16px);margin:auto auto 0;padding:23px 22px max(24px,env(safe-area-inset-bottom));border-radius:28px 28px 0 0}
  .studio-dialog-header h2 {font-size:1.55rem}
  .studio-download-option {grid-template-columns:minmax(0,1fr);padding:16px;gap:13px;min-height:74px}
  .studio-download-actions .button {font-size:.81rem}
}
@media(max-width:360px) {
  .site-header {padding-inline:11px;gap:7px}
  .site-header .brand {font-size:1.35rem;gap:6px}
  .site-header .brand img {width:26px;height:26px}
  .studio-language {padding:7px;font-size:.7rem}
  body[data-analytics-page="home"] .hero.studio-hero {padding-inline:20px}
  body[data-analytics-page="home"] .studio-hero h1 {font-size:2.65rem}
  .studio-art {min-height:280px}
  .studio-float {padding:9px;font-size:.7rem;gap:6px}
  .studio-art .studio-float svg {width:19px;height:19px}
  .studio-device-strip {margin-inline:20px;gap:12px 16px}
  .studio-reader,.studio-demo-reader {padding:22px 17px}
  .studio-demo-top {padding:12px;font-size:.66rem}
  .studio-demo-top small {font-size:.62rem}
  .studio-wave-panel {padding:19px 14px;gap:14px}
  .studio-wave-label {font-size:.7rem}
  .studio-summary {padding:14px}
  .studio-summary p,.studio-task-line,.studio-connected>div {font-size:.78rem}
  .studio-connected>div {padding:13px}
  .studio-connected>div:last-child {margin-left:16px}
  .studio-step {font-size:.72rem}
  #download-dialog,#navigation-dialog {padding-inline:18px}
  .studio-dialog-header {gap:10px}
  .studio-download-option {padding:12px;gap:9px}
}
@media(prefers-contrast:more) {
  :root {--muted:#444653;--line:#777583;--glass:var(--panel);--glass-border:var(--line)}
  html[data-theme="dark"] {--muted:#e0ddea;--line:#a4a0b2;--glass:var(--panel);--glass-border:var(--line)}
  :is(a,button,select,summary,input):focus-visible,[data-studio-keyboard-focus]:focus {outline-width:4px}
  .site-header,.analytics-consent {backdrop-filter:none;-webkit-backdrop-filter:none}
  .studio-step[aria-pressed="true"] {outline:2px solid var(--accent);outline-offset:-3px}
}
/* Pausing never hides content or changes the state selected by the visitor. */
html:not([data-studio-ready]) .studio-art *,html:not([data-studio-ready]) .studio-record::after {animation:none}
html[data-motion="paused"],html[data-motion="paused"] *,html[data-motion="paused"] *::before,html[data-motion="paused"] *::after {animation:none!important;transition:none!important;scroll-behavior:auto!important}
html[data-motion="paused"] .workspace {transform:none!important}
@media(prefers-reduced-motion:reduce) {
  html,*,*::before,*::after {animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .workspace {transform:none!important}
}
@media print {
  .studio-art,.studio-header-actions,.studio-steps,.studio-outro,#studio-motion {display:none}
  .studio-demo,.steps article,.workspace-features article {box-shadow:none;break-inside:avoid}
}
