/* The creator carries the product story through each tool. */
.studio-card{container-type:inline-size;container-name:studio-card}.editor-main{grid-template-columns:repeat(2,minmax(0,1fr))!important}.demo-portrait{width:100%;min-width:0;max-width:100%;aspect-ratio:auto!important}.editor-controls{min-width:0;max-width:100%}
.feature-card{flex-direction:column;text-align:center;align-items:center;padding:18px 19px 22px;gap:4px;min-height:270px;background:linear-gradient(160deg,#fff 20%,var(--mist) 180%)}.feature-mascot{display:block;height:138px;width:130px;margin:-3px auto 5px;flex-shrink:0}.feature-mascot img{height:100%;width:100%;object-fit:contain;transition:transform .25s}.feature-card:hover .feature-mascot img{transform:translateY(-4px) rotate(-3deg)}.feature-card h3{font-size:17px;margin:0 0 8px;letter-spacing:-.5px}.feature-card p{font-size:12px;max-width:245px;margin:auto}.feature-card .card-arrow{top:14px;right:15px;opacity:1;font-size:18px}.studio-section{background:linear-gradient(135deg,var(--navy),#155477);padding-block:43px}.studio-intro h2{font-size:41px;line-height:1.08}.studio-intro>p:not(.eyebrow){font-size:13px;max-width:340px}.feature-tabs button{min-height:55px}.editor-top{font-size:7px;letter-spacing:1.1px}.editor-main{grid-template-columns:1fr 1fr;gap:18px}.demo-portrait{background:linear-gradient(160deg,#d4e9f4,#eff7fb 50%,#b4d4e6);isolation:isolate;min-height:350px;aspect-ratio:9/16;overflow:hidden}.demo-portrait>#demo-image{position:absolute;left:0;top:43px;width:100%;height:calc(100% - 116px);object-fit:contain;object-position:center;z-index:2;transform-origin:50% 50%;padding:0 8px}.demo-portrait.is-photo>#demo-image{inset:0;height:100%;padding:0;object-fit:cover}.demo-portrait.is-photo:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#092b43b0);z-index:2}.demo-portrait.is-photo .demo-portrait-label{color:white}.demo-portrait.is-photo .preview-river{display:none}.preview-river{position:absolute;inset:40% -30% -25% -55%;border-radius:50%;transform:rotate(-25deg);border:33px solid #8db9d333;z-index:0}.preview-sticker{position:absolute;left:10px;top:15px;right:10px;color:var(--navy);font-size:7px;font-weight:700;letter-spacing:.8px;z-index:3;transform:rotate(-3deg)}.demo-ratio{top:auto;bottom:10px;left:11px;right:auto;color:var(--blue);border-color:#adcbdc;background:#ffffff66;z-index:4}.demo-portrait-label{font-size:27px;line-height:.98;color:var(--navy);font-weight:800;letter-spacing:-1.2px;left:15px;bottom:34px;z-index:3;text-shadow:none}.reaction-bubble{position:absolute;display:grid;place-items:center;background:white;border-radius:10px;box-shadow:0 3px 12px #0f3d5e10;z-index:1}.bubble-heart{right:9px;top:28%;font-size:23px;color:var(--blue);height:31px;width:31px;transform:rotate(12deg)}.bubble-play{left:7px;top:46%;width:27px;height:31px;color:var(--navy);font-size:13px;transform:rotate(-11deg);background:var(--gold)}.is-photo .reaction-bubble{display:none}.editor-timeline>button{background:var(--mist);height:52px;width:44px}.editor-timeline>button img{object-fit:contain}.record-status{font-size:10px!important;line-height:1.5!important;margin:7px 0 14px!important;color:var(--blue)!important}.editor-controls .record-button{margin-top:0;background:var(--blue);color:white}.editor-controls .record-button:hover{background:var(--navy)}.editor-controls .record-button.is-recording{background:var(--navy);color:var(--gold)}.editor-controls .record-button:disabled{opacity:.6;cursor:wait}.preview-recording{box-shadow:inset 0 0 0 3px var(--gold)}.preview-recording .preview-sticker:before{content:'● ';color:var(--blue)}.social-format{font-size:10px!important;color:var(--blue)!important;margin:9px 0 4px!important}.social-section{padding-top:37px}.social-panel{position:relative;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:35px;background:#edf5f9;border-radius:24px;padding:35px;overflow:hidden;isolation:isolate}.social-panel:before{content:'';position:absolute;inset:auto -15% -45% 30%;height:95%;border:45px solid #d8eaf3;border-radius:50%;transform:rotate(-20deg);z-index:-1}.social-copy .eyebrow{font-size:8px;margin-bottom:16px}.social-copy h2{font-size:39px;font-weight:790;letter-spacing:-1.8px;line-height:1.1}.social-copy>p:not(.eyebrow){font-size:13px;line-height:1.7;color:var(--muted);max-width:405px}.social-platforms{display:flex;flex-wrap:wrap;gap:7px;margin:19px 0 22px}.social-platforms>span{background:white;border:1px solid #d4e4ed;border-radius:50px;padding:8px 12px;font-size:10px;font-weight:650;color:var(--blue)}.social-copy .button{font-size:13px;min-height:48px}.social-art{height:390px;position:relative;display:flex;justify-content:center}.social-art>img{height:100%;max-width:100%;object-fit:contain}.social-orbit{position:absolute;z-index:2;display:flex;align-items:center;gap:7px;border-radius:9px;background:white;padding:10px 12px;color:var(--blue);box-shadow:0 4px 18px #0f3d5e0c;font-size:18px}.social-orbit b{font-size:10px;font-weight:650}.orbit-one{top:10px;left:-28px;transform:rotate(-7deg)}.orbit-two{right:-10px;bottom:24px;transform:rotate(7deg);background:var(--gold);color:var(--navy)}
@media(max-width:1050px){.feature-mascot{height:125px;width:118px}.feature-card{padding:16px 14px 20px;min-height:258px}.feature-card h3{font-size:16px}.feature-card p{font-size:11px}.studio-intro h2{font-size:35px}.editor-main{gap:12px}.demo-portrait{min-height:345px}.demo-portrait-label{font-size:25px;left:11px;letter-spacing:-1px}.preview-sticker{font-size:6px;letter-spacing:.5px}.social-panel{padding:28px;gap:25px}.social-copy h2{font-size:34px}.social-art{height:340px}.social-orbit b{font-size:9px}.orbit-one{left:-12px}.social-orbit{padding:9px}}
@media(max-width:760px){.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.feature-card{padding:13px 11px 17px;border-radius:17px;min-height:260px;gap:3px}.feature-mascot{height:126px;width:112px;max-width:100%;margin:0 auto 5px}.feature-card h3{font-size:15px;line-height:1.18;letter-spacing:-.4px;margin-bottom:8px}.feature-card p{font-size:11px;line-height:1.4}.feature-card .card-arrow{font-size:13px;top:7px;right:8px}.studio-section{padding-block:30px}.studio-intro h2{font-size:37px}.studio-intro>p:not(.eyebrow){font-size:12px}.feature-tabs button{min-height:53px}.editor-main{gap:11px}.demo-portrait{min-height:335px;aspect-ratio:auto}.demo-portrait>#demo-image{top:47px;height:calc(100% - 130px);padding:0 4px}.demo-portrait-label{font-size:24px;left:10px;bottom:33px;letter-spacing:-1px}.preview-sticker{font-size:6px;left:8px;right:8px;top:15px;line-height:1.6;letter-spacing:.3px}.bubble-heart{width:25px;height:27px;font-size:19px;right:3px;top:27%}.bubble-play{width:22px;height:26px;font-size:10px;left:2px}.demo-ratio{font-size:6px;padding:3px 5px;bottom:10px;left:10px}.editor-controls h3{font-size:21px;line-height:1.15}.record-status{font-size:9px!important}.social-format{font-size:9px!important}.social-section{padding-top:25px}.social-panel{grid-template-columns:1fr;gap:14px;padding:25px 21px;border-radius:20px}.social-copy h2{font-size:32px;letter-spacing:-1.4px}.social-copy>p:not(.eyebrow){font-size:12px;line-height:1.7}.social-platforms{gap:6px;margin:17px 0 20px}.social-platforms>span{font-size:9px;padding:8px 11px}.social-art{height:325px;max-width:310px;width:100%;margin:auto}.social-orbit b{font-size:9px}.orbit-one{left:0;top:0}.orbit-two{right:0;bottom:12px}.social-copy .button{font-size:12px;min-height:48px}.social-panel:before{inset:auto -50% -18% -50%;height:45%;border-width:30px}}
@media(max-width:760px){.editor-main{grid-template-columns:1fr;gap:20px}.demo-portrait{height:290px;min-height:290px}.demo-portrait>#demo-image{left:32%;top:12px;width:67%;height:calc(100% - 25px);padding:0 5px}.demo-portrait-label{font-size:25px;bottom:43px;left:16px;max-width:43%;letter-spacing:-1px}.demo-portrait.is-photo>#demo-image{inset:0;width:100%;height:100%;padding:0}.demo-portrait.is-photo .demo-portrait-label{font-size:28px}.preview-sticker{font-size:8px;left:14px;top:18px;right:30%;letter-spacing:.5px;max-width:115px}.bubble-heart{top:35%;left:15%;right:auto;width:32px;height:32px;font-size:23px}.bubble-play{top:18%;left:50%;width:25px;height:29px}.demo-ratio{left:16px;bottom:15px}.editor-controls{padding-inline:3px}.editor-controls h3{font-size:28px;line-height:1.07;letter-spacing:-1.1px;margin-bottom:12px}.editor-controls p{font-size:12px;line-height:1.6}.control-kicker{font-size:8px;letter-spacing:1px;margin:0 0 10px}.editor-controls .button{font-size:12px;min-height:48px;margin-top:12px}.editor-controls .record-button{margin-top:0}.field-label{font-size:11px}.segmented button{font-size:11px;min-height:44px}.editor-controls select{font-size:12px;min-height:46px;padding:10px}.upload-link{font-size:11px;min-height:44px}.local-note{font-size:10px;line-height:1.6}.record-status{font-size:11px!important;margin:9px 0 15px!important}.social-format{font-size:11px!important}.editor-timeline>span{font-size:7px!important;display:block!important}.copy-preview{font-size:12px}.demo-feedback{font-size:11px;line-height:1.6}}
@media(max-width:380px){.feature-card{padding-inline:9px;min-height:260px}.feature-card h3{font-size:14px}.feature-card p{font-size:10px;line-height:1.5}.feature-mascot{width:105px;height:124px}.social-copy h2{font-size:29px}.social-orbit b{font-size:8px}}
@container studio-card (max-width:430px){.editor-main{grid-template-columns:1fr!important;gap:20px}.demo-portrait{height:290px;min-height:290px}.demo-portrait>#demo-image{left:32%;top:12px;width:67%;height:calc(100% - 25px);padding:0 5px}.demo-portrait-label{font-size:25px;bottom:43px;left:16px;max-width:43%;letter-spacing:-1px}.demo-portrait.is-photo>#demo-image{inset:0;width:100%;height:100%;padding:0}.demo-portrait.is-photo .demo-portrait-label{font-size:28px}.preview-sticker{font-size:8px;left:14px;top:18px;right:30%;letter-spacing:.5px;max-width:115px}.bubble-heart{top:35%;left:15%;right:auto;width:32px;height:32px;font-size:23px}.bubble-play{top:18%;left:50%;width:25px;height:29px}.demo-ratio{left:16px;bottom:15px}.editor-controls{padding-inline:3px}.editor-controls h3{font-size:28px;line-height:1.07;letter-spacing:-1.1px;margin-bottom:12px}.editor-controls p{font-size:12px;line-height:1.6}.control-kicker{font-size:8px;letter-spacing:1px;margin:0 0 10px}.editor-controls .button{font-size:12px;min-height:48px;margin-top:12px}.editor-controls .record-button{margin-top:0}.field-label{font-size:11px}.segmented button{font-size:11px;min-height:44px}.editor-controls select{font-size:12px;min-height:46px;padding:10px}.upload-link{font-size:11px;min-height:44px}.local-note{font-size:10px;line-height:1.6}.record-status{font-size:11px!important;margin:9px 0 15px!important}.social-format{font-size:11px!important}.editor-timeline>span{font-size:7px!important;display:block!important}.copy-preview{font-size:12px}.demo-feedback{font-size:11px;line-height:1.6}}

/* Brand appearance. Studio geometry above is intentionally unchanged. */
:root { color-scheme:light; --surface:#fff; --outer:#edf3f6; }
.appearance-control { width:100%; display:flex; justify-content:center; padding:12px 0; }
.appearance-control button { border:1px solid var(--line); border-radius:999px; padding:10px 16px; min-height:44px; background:var(--surface); color:var(--ink); font:inherit; font-size:13px; }
@media(prefers-color-scheme:dark) {
:root:not([data-theme="light"]) { color-scheme:dark; --paper:#071e30; --ink:#eef5f7; --muted:#b5cbd7; --mist:#10354e; --line:#2b4c61; --blue:#83c5ee; --surface:#0c2c43; --outer:#051724; background:var(--outer); }
:root:not([data-theme="light"]) body { background:var(--outer); }
:root:not([data-theme="light"]) .page-shell { background:var(--paper); }
:root:not([data-theme="light"]) .feature-card { background:linear-gradient(160deg,var(--surface),var(--mist)); }
:root:not([data-theme="light"]) .studio-card,:root:not([data-theme="light"]) .social-panel,:root:not([data-theme="light"]) .social-platforms>span,:root:not([data-theme="light"]) .social-orbit,:root:not([data-theme="light"]) .floating-output { background:var(--surface); border-color:var(--line); }
:root:not([data-theme="light"]) .social-panel:before { border-color:#173f59; }
:root:not([data-theme="light"]) .floating-output { box-shadow:0 5px 25px #0003; }
:root:not([data-theme="light"]) .button,:root:not([data-theme="light"]) .button:hover,:root:not([data-theme="light"]) .editor-controls .record-button,:root:not([data-theme="light"]) .editor-controls .record-button:hover { color:var(--deep); }
:root:not([data-theme="light"]) .button.small { background:var(--gold); color:var(--deep); }
:root:not([data-theme="light"]) .button:hover,:root:not([data-theme="light"]) .editor-controls .record-button:hover { background:#a5d5f2; color:var(--deep); }
:root:not([data-theme="light"]) .studio-card .button:hover { background:#f4cb76; }
:root:not([data-theme="light"]) .editor-controls .record-button.is-recording { background:var(--navy); color:var(--gold); }
:root:not([data-theme="light"]) .studio-card .button,:root:not([data-theme="light"]) .studio-card .button:hover { color:var(--deep); }
:root:not([data-theme="light"]) .segmented button[aria-pressed=true] { background:#204a65; color:var(--ink); }
:root:not([data-theme="light"]) .timeline-track { border-color:var(--surface); }
:root:not([data-theme="light"]) .demo-ratio { color:#1b5e8c; }
:root:not([data-theme="light"]) .final-cta>div { background:#0f3d5e; }
:root:not([data-theme="light"]) .menu-button { color:var(--ink); background:transparent; }
:root:not([data-theme="light"]) .orbit-two { background:var(--gold); color:var(--deep); }
}
:root[data-theme="dark"] { color-scheme:dark; --paper:#071e30; --ink:#eef5f7; --muted:#b5cbd7; --mist:#10354e; --line:#2b4c61; --blue:#83c5ee; --surface:#0c2c43; --outer:#051724; background:var(--outer); }
:root[data-theme="dark"] body { background:var(--outer); }
:root[data-theme="dark"] .page-shell { background:var(--paper); }
:root[data-theme="dark"] .feature-card { background:linear-gradient(160deg,var(--surface),var(--mist)); }
:root[data-theme="dark"] .studio-card,:root[data-theme="dark"] .social-panel,:root[data-theme="dark"] .social-platforms>span,:root[data-theme="dark"] .social-orbit,:root[data-theme="dark"] .floating-output { background:var(--surface); border-color:var(--line); }
:root[data-theme="dark"] .social-panel:before { border-color:#173f59; }
:root[data-theme="dark"] .floating-output { box-shadow:0 5px 25px #0003; }
:root[data-theme="dark"] .button,:root[data-theme="dark"] .button:hover,:root[data-theme="dark"] .editor-controls .record-button,:root[data-theme="dark"] .editor-controls .record-button:hover { color:var(--deep); }
:root[data-theme="dark"] .button.small { background:var(--gold); color:var(--deep); }
:root[data-theme="dark"] .button:hover,:root[data-theme="dark"] .editor-controls .record-button:hover { background:#a5d5f2; color:var(--deep); }
:root[data-theme="dark"] .studio-card .button:hover { background:#f4cb76; }
:root[data-theme="dark"] .editor-controls .record-button.is-recording { background:var(--navy); color:var(--gold); }
:root[data-theme="dark"] .studio-card .button,:root[data-theme="dark"] .studio-card .button:hover { color:var(--deep); }
:root[data-theme="dark"] .segmented button[aria-pressed=true] { background:#204a65; color:var(--ink); }
:root[data-theme="dark"] .timeline-track { border-color:var(--surface); }
:root[data-theme="dark"] .demo-ratio { color:#1b5e8c; }
:root[data-theme="dark"] .final-cta>div { background:#0f3d5e; }
:root[data-theme="dark"] .menu-button { color:var(--ink); background:transparent; }
:root[data-theme="dark"] .orbit-two { background:var(--gold); color:var(--deep); }
