:root{--bg:#f5f7fd;--panel:rgba(255,255,255,.9);--strong:#fff;--text:#11182b;--muted:#707b96;--line:rgba(30,46,84,.12);--blue:#3f7cff;--violet:#8569ee;--pink:#e761ba;--soft:linear-gradient(120deg,rgba(63,124,255,.13),rgba(133,105,238,.10),rgba(231,97,186,.12));--grad:linear-gradient(120deg,rgba(63,124,255,.84),rgba(133,105,238,.80),rgba(231,97,186,.78));--shadow:0 18px 58px rgba(28,44,82,.10);color-scheme:light}:root[data-studio-theme="dark"]{--bg:#0d1220;--panel:rgba(21,27,44,.92);--strong:#171e31;--text:#f7f9ff;--muted:#a7b0c5;--line:rgba(255,255,255,.11);--soft:linear-gradient(120deg,rgba(63,124,255,.18),rgba(133,105,238,.13),rgba(231,97,186,.15));--shadow:0 18px 58px rgba(0,0,0,.28);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 12% 0,rgba(63,124,255,.09),transparent 26%),radial-gradient(circle at 92% 3%,rgba(231,97,186,.08),transparent 28%),var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}.app{width:100dvw;height:100dvh;display:grid;grid-template-rows:58px 56px minmax(0,1fr);gap:8px;padding:calc(8px + env(safe-area-inset-top)) 10px calc(8px + env(safe-area-inset-bottom))}.appHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 3px}.brand,.headerMeta{display:flex;align-items:center;gap:9px}.brandMark{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;background:var(--soft);border:1px solid var(--line);color:var(--blue);font-size:1.15rem}.brand span,.micro{display:block;color:var(--blue);font-weight:950;letter-spacing:.17em;font-size:.58rem}.brand strong{display:block;font-size:.9rem;letter-spacing:-.02em}.publicBadge,.freePill,.pill{border:1px solid var(--line);background:var(--panel);border-radius:999px;color:var(--muted);font-weight:900}.publicBadge{padding:8px 11px;font-size:.58rem}.iconButton{width:40px;height:40px;border-radius:15px;border:1px solid var(--line);background:var(--panel);color:var(--text)}.topNav{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:5px;border:1px solid var(--line);border-radius:20px;background:var(--panel);box-shadow:var(--shadow)}.topNav button{border:0;border-radius:15px;background:transparent;color:var(--muted);font-weight:900;display:flex;align-items:center;justify-content:center;gap:7px;font-size:.7rem}.topNav button.isActive{background:var(--soft);color:var(--text)}.workspace{min-height:0;position:relative;overflow:hidden;border-radius:24px}.studioSection{position:absolute;inset:0;display:none;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y;overscroll-behavior:contain;padding:2px 1px 24px;scrollbar-width:none}.studioSection::-webkit-scrollbar{display:none}.studioSection.isActive{display:block}.introCard,.previewCard,.optionCard,.designCard,.publishCard,.integrationHero,.endpointCard,.integrationCard,.publishConnectCard,.chatGuideCard,.capabilityCard{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);border-radius:24px}.introCard{padding:18px;margin-bottom:10px}.introCard h1,.integrationHero h1{font-size:1.55rem;line-height:1.02;letter-spacing:-.055em;margin:8px 0}.introCard p,.integrationHero p,.copy,.endpointCard p,.publishCard p,.publishConnectCard p{margin:0;color:var(--muted);font-size:.84rem;line-height:1.45;font-weight:650}.modeRail,.choiceRail,.styleRail{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.modeRail::-webkit-scrollbar,.choiceRail::-webkit-scrollbar,.styleRail::-webkit-scrollbar{display:none}.modeRail{padding:4px;margin:0 0 10px}.modeRail button{flex:1 0 94px;min-height:54px;border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--muted);font-weight:900;display:flex;align-items:center;justify-content:center;gap:8px}.modeRail button.isActive{background:var(--soft);color:var(--text);border-color:rgba(63,124,255,.28)}.previewCard{padding:14px;margin-bottom:10px}.previewHead,.integrationCardHead,.endpointTop{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.previewHead h2,.designCard h2,.publishCard h2,.endpointCard h2,.integrationCard h2,.publishConnectCard h2,.capabilityCard h2{margin:5px 0 0;letter-spacing:-.04em}.previewHead h2{font-size:1.28rem}.pill{padding:7px 10px;font-size:.56rem}.previewStage{position:relative;margin-top:12px;min-height:300px;border:1px solid var(--line);border-radius:21px;background:radial-gradient(circle at 20% 20%,rgba(63,124,255,.08),transparent 28%),radial-gradient(circle at 83% 80%,rgba(231,97,186,.08),transparent 30%),var(--strong);overflow:hidden}.previewIdle{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px}.previewIcon{width:62px;height:62px;border-radius:22px;background:var(--soft);display:grid;place-items:center;color:var(--blue);font-size:1.5rem;margin-bottom:12px}.previewIdle strong{font-size:1rem}.previewIdle small{color:var(--muted);font-weight:750;margin:6px 0 18px}.primaryButton,.secondaryButton{border:0;border-radius:17px;font-weight:950}.primaryButton{min-height:50px;padding:0 20px;background:var(--grad);color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:9px}.secondaryButton{min-height:46px;padding:0 16px;background:var(--strong);border:1px solid var(--line);color:var(--text)}.inlineMount{display:none;position:absolute;inset:8px;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;border-radius:16px;background:var(--strong)}.previewStage.hasInline{min-height:460px}.previewStage.hasInline .previewIdle{display:none}.previewStage.hasInline .inlineMount{display:block}.resultBar{margin-top:10px;padding:10px 12px;border-radius:16px;background:var(--soft);display:flex;align-items:center;gap:10px}.resultBar i{color:var(--violet)}.resultBar span{display:block;color:var(--muted);font-size:.54rem;font-weight:900;text-transform:uppercase;letter-spacing:.09em}.resultBar strong{font-size:.75rem}.optionCard{padding:14px;margin-bottom:10px}.optionCard h3{margin:6px 0 10px}.choiceRail button{flex:0 0 82px;min-height:48px;border:1px solid var(--line);border-radius:15px;background:var(--strong);color:var(--muted);font-weight:900}.choiceRail button.isActive{background:var(--soft);color:var(--text);border-color:rgba(63,124,255,.3)}.styleRail button{flex:0 0 122px;min-height:58px;border:1px solid var(--line);border-radius:17px;background:var(--strong);color:var(--text);display:flex;align-items:center;gap:9px;padding:8px 10px;text-align:left}.styleRail button.isActive{background:var(--soft);border-color:rgba(63,124,255,.3)}.styleRail strong,.styleRail small{display:block}.styleRail small{color:var(--muted);font-size:.58rem}.swatch{width:18px;height:38px;border-radius:10px;flex:none}.swatch.aion{background:var(--grad)}.swatch.glass{background:linear-gradient(#e8f2ff,#fff)}.swatch.minimal{background:linear-gradient(#11182b,#7a839b)}.swatch.soft{background:linear-gradient(#cde2ff,#f2d8fa)}.subNav{display:flex;gap:6px;overflow-x:auto;margin:0 0 10px;padding:4px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}.subNav button{flex:1 0 90px;min-height:42px;border:0;border-radius:14px;background:transparent;color:var(--muted);font-weight:900}.subNav button.isActive{background:var(--soft);color:var(--text)}.designPanel{display:none}.designPanel.isActive{display:block}.designCard,.publishCard{padding:16px;margin-bottom:10px}.designCard h2,.publishCard h2{font-size:1.18rem}.themeGrid,.layoutGrid,.formGrid,.colorGrid,.capGrid{display:grid;gap:9px}.themeGrid{grid-template-columns:repeat(3,1fr);margin-top:13px}.themeGrid button{min-height:76px;border:1px solid var(--line);border-radius:18px;background:var(--strong);color:var(--text);display:flex;align-items:center;gap:8px;padding:10px}.themeGrid button.isActive{background:var(--soft);border-color:rgba(63,124,255,.3)}.themeGrid span,.themeGrid strong,.themeGrid small{display:block;text-align:left}.themeGrid small{color:var(--muted);font-size:.58rem}.layoutGrid{grid-template-columns:1fr 1fr;margin-top:12px}.layoutGrid button{min-height:72px;border:1px solid var(--line);border-radius:17px;background:var(--strong);color:var(--text);text-align:left;padding:12px}.layoutGrid button.isActive{background:var(--soft);border-color:rgba(63,124,255,.3)}.layoutGrid strong,.layoutGrid small{display:block}.layoutGrid small{color:var(--muted);margin-top:3px}.formGrid{grid-template-columns:1fr 1fr;margin-top:12px}.formGrid label.wide{grid-column:1/-1}.formGrid label span{display:block;color:var(--muted);font-size:.65rem;font-weight:850;margin:0 0 5px}.formGrid input,.formGrid select{width:100%;height:48px;border:1px solid var(--line);border-radius:15px;background:var(--strong);color:var(--text);font:inherit;font-size:16px;padding:0 12px}.weekdayButtons{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-top:12px}.weekdayButtons button{height:38px;border:1px solid var(--line);border-radius:12px;background:var(--strong);color:var(--muted);font-weight:900}.weekdayButtons button.isActive{background:var(--soft);color:var(--text)}.colorGrid{grid-template-columns:1fr 1fr;margin:14px 0}.colorGrid label{min-height:54px;border:1px solid var(--line);border-radius:16px;background:var(--strong);display:flex;align-items:center;justify-content:space-between;padding:8px 12px;font-weight:850}.colorGrid input{width:34px;height:34px;border:0;background:none}.publishCard{text-align:center;padding:24px 18px}.publishIcon{width:72px;height:72px;margin:0 auto 14px;border-radius:25px;background:var(--soft);display:grid;place-items:center;color:var(--blue);font-size:1.8rem}.publishedBox{margin-top:16px;padding:14px;border:1px solid var(--line);border-radius:17px;background:var(--strong);text-align:left}.publishedBox span{display:block;color:var(--muted);font-size:.58rem;font-weight:900;text-transform:uppercase}.publishedBox strong{display:block;word-break:break-all;margin:5px 0 8px;font-size:.72rem}.publishedBox p{font-size:.68rem}.publishedBox button{border:0;background:var(--soft);color:var(--text);border-radius:12px;padding:9px 11px;font-weight:900}.integrationHero{padding:20px;margin-bottom:10px}.integrationHero h1{font-size:1.7rem}.hostFlow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:6px;margin-top:16px}.hostFlow>div{min-height:84px;border:1px solid var(--line);border-radius:18px;background:var(--strong);padding:10px;display:flex;gap:8px;align-items:flex-start}.hostFlow>i{color:var(--muted)}.hostFlow span,.hostFlow strong,.hostFlow small{display:block}.hostFlow strong{font-size:.72rem}.hostFlow small{color:var(--muted);font-size:.57rem;margin-top:3px}.endpointCard,.integrationCard,.publishConnectCard,.chatGuideCard,.capabilityCard{padding:16px;margin-bottom:10px}.freePill{padding:7px 10px;font-size:.58rem}.endpointField{margin:13px 0 9px;border:1px solid var(--line);border-radius:16px;background:var(--strong);display:flex;align-items:center;gap:8px;padding:10px 10px 10px 12px}.endpointField strong{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.68rem}.endpointField button{width:38px;height:38px;border:0;border-radius:12px;background:var(--soft);color:var(--text)}.codeTabs{display:flex;gap:5px;overflow-x:auto;margin:12px 0}.codeTabs button{flex:1 0 70px;height:42px;border:1px solid var(--line);border-radius:13px;background:var(--strong);color:var(--muted);font-weight:900}.codeTabs button.isActive{background:var(--soft);color:var(--text)}.codeBlock{border-radius:18px;background:#111522;color:#f4f6ff;overflow:hidden}.codeBar{height:42px;padding:0 11px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.08);font-size:.58rem;font-weight:900}.codeBar button{border:0;background:rgba(255,255,255,.08);color:#fff;border-radius:10px;padding:7px 9px}.codeBlock pre{margin:0;max-height:300px;overflow:auto;padding:14px;-webkit-overflow-scrolling:touch}.codeBlock code{font:600 .69rem/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre}.codeHint{color:var(--muted);font-size:.68rem;font-weight:700;line-height:1.4}.publishConnectCard{display:flex;align-items:center;justify-content:space-between;gap:12px}.capGrid{grid-template-columns:1fr 1fr;margin-top:12px}.capGrid>div{min-height:82px;border:1px solid var(--line);border-radius:17px;background:var(--strong);padding:11px}.capGrid i{color:var(--blue)}.capGrid strong,.capGrid small{display:block}.capGrid strong{margin-top:7px;font-size:.72rem}.capGrid small{color:var(--muted);font-size:.58rem;margin-top:3px}.softToast{position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));max-width:min(330px,calc(100vw - 28px));padding:11px 14px;border:1px solid var(--line);border-radius:14px;background:var(--strong);box-shadow:var(--shadow);font-size:.72rem;font-weight:850;opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s;z-index:99999}.softToast.isVisible{opacity:1;transform:none}body[data-mode="date"] .timeOnly,body[data-mode="date"] .rangeOnly,body[data-mode="time"] .dateOnly,body[data-mode="time"] .rangeOnly,body[data-mode="range"] .timeOnly{display:none!important}@media(max-width:520px){.app{grid-template-rows:54px 52px minmax(0,1fr);padding-left:8px;padding-right:8px}.brand strong{font-size:.78rem}.publicBadge{display:none}.introCard{padding:16px}.introCard h1,.integrationHero h1{font-size:1.35rem}.previewStage{min-height:290px}.previewStage.hasInline{min-height:430px}.themeGrid{grid-template-columns:1fr}.themeGrid button{min-height:60px}.formGrid{grid-template-columns:1fr}.formGrid label.wide{grid-column:auto}.hostFlow{grid-template-columns:1fr}.hostFlow>i{transform:rotate(90deg);justify-self:center}.hostFlow>div{min-height:64px}.publishConnectCard{align-items:flex-start;flex-direction:column}.workspace{border-radius:18px}}@media(min-width:760px){.app{max-width:1100px;margin:auto}.previewStage{min-height:360px}.designPanel.isActive{display:grid;grid-template-columns:1fr 1fr;gap:10px}.designPanel.isActive .publishCard{grid-column:1/-1}.integrationHero,.endpointCard,.integrationCard,.publishConnectCard,.capabilityCard{max-width:900px;margin-left:auto;margin-right:auto}.capGrid{grid-template-columns:repeat(3,1fr)}}

.chatGuideCard{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);border-radius:24px}.chatGuideTop{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.chatGuideTop h2{margin:5px 0 0;font-size:1.3rem;letter-spacing:-.04em}.chatGuideCard>p{color:var(--muted);font-size:.78rem;line-height:1.5;font-weight:680;margin:10px 0 14px}.chatReadyPill{flex:none;border:1px solid rgba(63,124,255,.24);background:var(--soft);border-radius:999px;padding:7px 9px;color:var(--text);font-size:.56rem;font-weight:900}.chatGuideActions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.chatGuideActions a{text-decoration:none;min-width:0}.chatGuideActions .secondaryButton{display:flex;align-items:center;justify-content:center;gap:8px}.chatPromptBox{margin-top:12px;border:1px solid var(--line);border-radius:18px;background:var(--strong);overflow:hidden}.chatPromptBar{min-height:42px;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--soft)}.chatPromptBar span{font-size:.54rem;font-weight:950;letter-spacing:.08em;color:var(--muted)}.chatPromptBar button{border:0;border-radius:10px;background:var(--strong);color:var(--text);padding:7px 9px;font-weight:900;font-size:.62rem}.chatPromptBox p{margin:0;padding:12px;color:var(--text);font-size:.72rem;line-height:1.5;font-weight:650}.chatEndpointGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.chatEndpointGrid>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;align-items:center;border:1px solid var(--line);border-radius:16px;background:var(--strong);padding:10px}.chatEndpointGrid span{grid-column:1/-1;color:var(--muted);font-size:.54rem;font-weight:900;text-transform:uppercase;letter-spacing:.07em}.chatEndpointGrid strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.61rem}.chatEndpointGrid button{width:32px;height:32px;border:0;border-radius:10px;background:var(--soft);color:var(--text)}.chatGuideNote{display:flex;align-items:flex-start;gap:7px;color:var(--muted);font-size:.62rem;line-height:1.4;margin-top:10px}.chatGuideNote i{color:var(--blue)}@media(max-width:520px){.chatGuideActions,.chatEndpointGrid{grid-template-columns:1fr}.chatGuideTop{align-items:flex-start}.chatReadyPill{font-size:.5rem}.chatGuideActions .primaryButton,.chatGuideActions .secondaryButton{width:100%;min-height:48px}.chatPromptBox p{font-size:.7rem}}@media(min-width:760px){.chatGuideCard{max-width:900px;margin-left:auto;margin-right:auto}}