/* Alternative only. Figma 789:25994 + 241:7416 / 758:25831. */
body{margin:0;font-family:STHeroInter,Inter,Arial,sans-serif;color:#101416;background:white}
.sth{height:auto;min-height:1347px;max-height:none;overflow:clip;padding-top:69px;display:flex;flex-direction:column;align-items:center}
.sth-copy{position:relative;top:auto;width:100%;max-width:800px;padding:0 30px;margin:0;z-index:2;text-align:center;order:0}
.sth-heading{font-size:76px;line-height:1.02;letter-spacing:-.04em;font-weight:700;margin:0 0 28px;min-height:0;display:flex;flex-direction:column;justify-content:center}
.sth-subhead{max-width:690px;font-size:21px;line-height:1.45;margin:0 auto;text-wrap:pretty}
.sth-art{order:1;position:relative;right:auto;top:auto;bottom:auto;width:1640px;height:1230px;margin:-70px 0 0;align-self:center;transform:none;flex:none}
.sth-controls{bottom:26px;right:24px;z-index:2}
.sth-dock{position:fixed;z-index:20;left:50%;bottom:calc(32px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);width:min(569px,calc(100vw - 32px));max-height:calc(100dvh - 32px);border:1px solid #2970ff;border-radius:26px;background:#155eef;box-sizing:border-box;height:var(--dock-height,104px);transition:width 680ms cubic-bezier(.22,1,.36,1),height 680ms cubic-bezier(.22,1,.36,1),border-radius 680ms;box-shadow:0 12px 24px -12px #10141630;font-family:STHeroInter,Inter,Arial,sans-serif}
.sth-dock.is-collapsed{height:58px;width:288px;max-width:calc(100vw - 32px)}
.dock-trigger{display:flex;position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 240ms ease,visibility 0s 240ms;align-items:center;justify-content:center;gap:4px;width:calc(100% - 20px);min-height:36px;margin:10px;padding:8px 12px;border:0;border-radius:999px;background:#2970ff;color:white;font:500 12px/18px STHeroInter,Arial,sans-serif;cursor:pointer}
.dock-trigger img{width:20px;height:20px}
.is-collapsed .dock-trigger{opacity:1;visibility:visible;pointer-events:auto;transition-delay:180ms,0ms}.is-collapsed .dock-editor{opacity:0;visibility:hidden;pointer-events:none;transition-delay:0ms,320ms}
.dock-editor{width:100%;opacity:1;visibility:visible;transition:opacity 360ms ease 130ms,visibility 0s;max-height:calc(100dvh - 90px);overflow:visible;border-radius:25px}
.dock-viewport{overflow-x:hidden;overflow-y:auto;max-height:calc(100dvh - 90px);border-radius:25px}
.sth-dock .sth-prompt{max-width:none;border:0;box-shadow:none;width:min(567px,calc(100vw - 34px));margin:0}
.dock-close{position:absolute;right:4px;top:-32px;width:32px;height:32px;border:0;border-radius:50%;background:white;color:#626970;font:24px/1 Arial;cursor:pointer;box-shadow:0 2px 8px #10141615}
.sth-dock:not(.is-engaged) .dock-close{display:none}
.sth-dock .sth-feedback{color:white;margin:0;padding:0 18px 14px;font-size:14px;line-height:1.5;max-height:160px;overflow:auto}.sth-dock .sth-feedback:empty{display:none}
.sth-dock button:focus-visible{outline:3px solid #101416;outline-offset:3px}
.comparison-content section{padding:110px max(6vw,24px);text-align:center}.comparison-content h2{font-size:clamp(38px,5vw,68px);line-height:1.06;letter-spacing:-.04em;margin:16px 0 24px}.comparison-content p{font-size:20px;line-height:1.5;max-width:650px;margin:0 auto 28px;color:#626970}.comparison-content .eyebrow{font-size:14px;color:#155eef}.comparison-content img{display:block;width:min(1100px,100%);height:auto;margin:50px auto 32px}.comparison-content button{padding:14px 24px;border:0;border-radius:99px;background:#155eef;color:white;font:500 16px STHeroInter,Arial;cursor:pointer}.play-section{background:#f5f7fa}.comparison-content footer{text-align:center;padding:64px 24px 180px}.comparison-content footer p{font-size:14px}.comparison-content a{color:#155eef}.comparison-content :focus-visible{outline:3px solid #155eef;outline-offset:5px}
@keyframes dock-in{from{opacity:0}to{opacity:1}}
@media(max-width:1100px){.sth{padding-top:64px;min-height:0}.sth-copy{padding:0 28px;max-width:800px}.sth-heading{font-size:clamp(56px,7.6vw,76px)}.sth-art{width:1640px;height:1230px;margin:-70px 0 0;transform:none}.sth-subhead{font-size:20px;max-width:690px}}
@media(max-width:600px){.sth{padding-top:48px}.sth-copy{padding:0 20px}.sth-heading{font-size:clamp(42px,10.8vw,62px);min-height:0;margin-bottom:20px}.sth-subhead{font-size:17px;line-height:1.45}.sth-art{width:933px;height:700px;max-width:none;margin:0;transform:none}.sth-controls{bottom:120px;right:16px}.sth-dock{bottom:calc(16px + env(safe-area-inset-bottom,0px))}.comparison-content section{padding:80px 24px}.comparison-content p{font-size:18px}.dock-trigger{min-height:44px}.dock-close{width:44px;height:44px;top:-48px}.sth-dock .sth-prompt textarea{max-height:180px}}
@media(prefers-reduced-motion:reduce){.sth-dock,.dock-editor{transition:none;animation:none}}
/* The wider masters keep wings and mobility supports complete on small screens. */
@media(max-width:600px){.sth-art{width:180vw;height:135vw;margin-top:20px}.sth-controls{bottom:14px;right:16px}.sth{padding-bottom:110px}}

@media(max-width:600px){.sth-dock.is-collapsed{height:66px}}
@media(prefers-reduced-motion:reduce){.dock-trigger{transition:none}}

/* A single line-box rhythm; decorative artwork never changes the text metrics. */
.sth-heading{display:block;line-height:1.02}
.sth-name{height:.9em;vertical-align:baseline}
/* One composer: the existing wand action and shell remain present throughout. */
.sth-dock{height:auto;transition:width 720ms cubic-bezier(.22,1,.36,1),border-radius 720ms}
.sth-dock.is-collapsed{height:auto}
.dock-editor,.is-collapsed .dock-editor{opacity:1;visibility:visible;pointer-events:auto;transition:none}
.sth-dock .sth-prompt{width:100%;gap:0}
.dock-input-row{display:grid;grid-template-rows:1fr;transition:grid-template-rows 720ms cubic-bezier(.22,1,.36,1),margin 720ms; margin-bottom:10px}
.dock-input-inner{min-height:0;overflow:hidden}
.is-collapsed .dock-input-row{grid-template-rows:0fr;margin-bottom:0}
.sth-dock .sth-prompt-actions{display:grid;grid-template-columns:1fr auto;gap:10px}
.sth-dock .sth-idea-next{justify-self:start;min-width:0;width:var(--idea-width,150px);max-width:100%;transition:width 720ms cubic-bezier(.22,1,.36,1),background-color 260ms}
.sth-dock.is-collapsed .sth-idea-next{width:266px}
.sth-dock .sth-send{overflow:hidden;max-width:160px;transition:max-width 720ms cubic-bezier(.22,1,.36,1),padding 720ms,opacity 300ms}
.sth-dock.is-collapsed .sth-send{max-width:0;width:0;padding:0;opacity:0;pointer-events:none}
.sth-dock.is-collapsed .sth-prompt-actions{gap:0}
.sth-dock.is-collapsed .sth-feedback{display:none}
@media(max-width:600px){.sth-dock .sth-idea-next,.sth-dock .sth-send{height:44px;min-height:44px}}
@media(prefers-reduced-motion:reduce){.sth-dock,.dock-input-row,.sth-dock .sth-idea-next,.sth-dock .sth-send{transition:none}}

/* Keep text layout stable while the shell changes width. Reveal it after opening. */
.sth-dock{--composer-input-width:min(547px,calc(100vw - 54px))}
.sth-dock textarea{width:var(--composer-input-width);opacity:1;transition:opacity 200ms ease 720ms}
.sth-dock.is-collapsed textarea{opacity:0;transition:opacity 120ms ease}
.sth-dock .sth-idea-next{flex-shrink:0;white-space:nowrap;overflow:hidden}
.sth-dock .sth-idea-label{white-space:nowrap;flex-shrink:0}
.sth-dock .sth-prompt-actions{grid-template-columns:minmax(0,1fr) auto;transition:gap 720ms cubic-bezier(.22,1,.36,1)}
@media(prefers-reduced-motion:reduce){.sth-dock textarea,.sth-dock.is-collapsed textarea,.sth-dock .sth-prompt-actions{transition:none}}

@media(max-width:600px){.sth-dock:not(.is-collapsed) .sth-send:not(.is-ready){width:44px;min-width:44px;flex-basis:44px;aspect-ratio:1;}}
