/* Chat2Mind product experience refresh */
:root {
  --font-product: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --primary: #635bff;
  --primary-dark: #4f46e5;
  --foreground: #111827;
  --background: #ffffff;
  --background-alt: #f7f8fc;
  --muted: #f2f3f8;
  --muted-foreground: #667085;
  --border: #d8dbe7;
  --border-light: #e8eaf1;
  --card-bg: #ffffff;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.04), 0 5px 18px rgba(16, 24, 40, 0.06);
  --shadow-lg: 0 24px 70px rgba(56, 48, 125, 0.14);
}

body { color: var(--foreground); background: var(--background); }
.product-home,.account-page,.editor-page { font-family: var(--font-product); }
.product-home button,.product-home input,.product-home textarea,.product-home select,
.account-page button,.account-page input,.editor-page button { font-family: var(--font-product); }
.container-wide { max-width: 76rem; }
.btn { border-radius: var(--radius-sm); font-family: var(--font-body); font-weight: 600; letter-spacing: 0; text-transform: none; transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease; }
.btn:hover:not(:disabled) { transform: translateY(-1px); }
.btn-primary { border-color: var(--primary) !important; background: var(--primary) !important; box-shadow: 0 8px 22px rgba(99, 91, 255, 0.2); }
.btn-primary:hover:not(:disabled) { background: var(--primary-dark) !important; border-color: var(--primary-dark) !important; box-shadow: 0 10px 26px rgba(99, 91, 255, 0.28); }
.btn-secondary { background: #fff; border-color: var(--border); color: var(--foreground); }
.btn-ghost { border-color: transparent; }

.header-minimal { padding: .75rem 0; position: sticky; top: 0; z-index: 80; background: rgba(255,255,255,0.92); backdrop-filter: blur(16px); }
.header-minimal::after { background: var(--border-light); position: absolute; left: 0; right: 0; bottom: 0; }
.header-minimal .container-wide { display: grid; grid-template-columns: 1fr auto 1fr; min-height: 2.5rem; }
.logo-minimal { justify-self: start; font-family: var(--font-product); font-size: 1.2rem; font-weight: 760; letter-spacing: -0.04em; }
.header-nav { display: flex; align-items: center; gap: 1.75rem; }
.nav-link { position: relative; padding: .48rem 0; color: var(--muted-foreground); text-decoration: none; font-size: .86rem; font-weight: 600; transition: color 160ms ease; }
.nav-link::after { content: ''; position: absolute; right: 0; bottom: .2rem; left: 0; height: 2px; border-radius: 99px; background: var(--primary); transform: scaleX(0); transition: transform 160ms ease; }
.nav-link:hover { color: var(--foreground); }
.nav-link:hover::after { transform: scaleX(1); }
.header-actions { justify-self: end; gap: .5rem; }
.header-create-btn { min-height: 2.35rem; padding-inline: .95rem; font-family: var(--font-product); box-shadow: none; }
.header-language-link { padding: .45rem .35rem; color: var(--muted-foreground); font-size: .76rem; font-weight: 750; text-decoration: none; }
.user-menu-btn { min-height: 2.35rem; padding: .2rem .42rem .2rem .22rem; border: 0; border-radius: 11px; background: transparent; color: var(--foreground); font-family: var(--font-product); cursor: pointer; transition: background 160ms ease; }
.user-menu-btn:hover,.user-menu-btn.open { background: var(--muted); }
.user-avatar { display: grid; place-items: center; width: 1.85rem; height: 1.85rem; border-radius: 9px; background: #e9e7ff; color: #5149ca; font-size: .74rem; font-weight: 800; }
.user-name { max-width: 8.5rem; overflow: hidden; color: #475467; font-size: .83rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.user-menu-btn svg { color: #98a2b3; }
.user-dropdown { border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 14px 36px rgba(16,24,40,.12); overflow: hidden; min-width: 220px; }
.user-dropdown-identity { display: flex; flex-direction: column; gap: .15rem; padding: .8rem .85rem; border-bottom: 1px solid var(--border-light); }
.user-dropdown-identity span { color: var(--muted-foreground); font-size: .7rem; }
.user-dropdown-identity strong { max-width: 12rem; overflow: hidden; font-size: .78rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.dropdown-item { text-decoration: none; padding: .7rem .85rem; }
.dropdown-item:hover { background: var(--muted); }
.header-buy-credits { min-height: 2.35rem; padding-inline: .65rem; white-space: nowrap; border-color: transparent; color: var(--primary); background: transparent; box-shadow: none; }
.header-buy-credits:hover:not(:disabled) { border-color: transparent; background: #f1efff; }
.header-login-btn { color: var(--muted-foreground); }
.generator-credit-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-top: .8rem; }
.generator-credit-row .quota-display { margin: 0; }
.generator-buy-credits { flex: 0 0 auto; border: 0; padding: .45rem .7rem; border-radius: 9px; background: #eeecff; color: var(--primary); font-size: .82rem; font-weight: 750; cursor: pointer; }
.generator-buy-credits:hover { background: #dedaff; }

.product-home .hero-workspace-section { padding: clamp(3rem, 7vw, 6.5rem) 0 4.5rem; border-bottom: 0; background: radial-gradient(circle at 78% 8%, rgba(99,91,255,.13), transparent 31rem), linear-gradient(180deg,#fff 0%,#fafaff 100%); }
.product-home #hero-demo,.product-home #examples,.product-home #generator { scroll-margin-top: 5rem; }
.product-home .hero-workspace-grid { grid-template-columns: minmax(0,1.08fr) minmax(29rem,.92fr); grid-template-areas: 'copy form' 'aha form'; column-gap: clamp(2.5rem,5vw,4.75rem); row-gap: 1.5rem; align-items: start; }
.product-home .hero-content { grid-area: copy; max-width: 39rem; }
.product-home .hero-kicker { border: 0; padding: .45rem .7rem; margin-bottom: 1.25rem; border-radius: 999px; background: #eeecff; color: #5149ca; font-family: var(--font-product); font-weight: 700; letter-spacing: 0; text-transform: none; }
.product-home .hero-title { font-family: var(--font-product); font-size: clamp(2.8rem,4.5vw,4.15rem); font-weight: 760; letter-spacing: -.055em; line-height: 1.03; }
.product-home .hero-subtitle { font-family: var(--font-product); font-size: 1.15rem; line-height: 1.65; }
.product-home .hero-assurances { display: flex; flex-wrap: wrap; gap: .55rem 1.1rem; margin: -.25rem 0 1.5rem; color: var(--muted-foreground); font-size: .78rem; font-weight: 650; }
.product-home .hero-assurances span { display: inline-flex; align-items: center; gap: .4rem; }
.product-home .hero-assurances span::before { content: '✓'; color: #079669; font-weight: 850; }
.product-home .hero-aha { display: grid; grid-area: aha; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); gap: .7rem; align-items: stretch; }
.product-home .hero-aha-card { display: flex; min-width: 0; flex-direction: column; padding: .9rem; border: 1px solid var(--border); border-radius: 14px; background: rgba(255,255,255,.78); color: inherit; box-shadow: var(--shadow-sm); text-decoration: none; }
.product-home .hero-aha-after { border-color: #bbb6ff; background: linear-gradient(145deg,#fff 0%,#f4f2ff 100%); }
.product-home .hero-aha-card { transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.product-home .hero-aha-card:hover { transform: translateY(-2px); border-color: #aaa4ff; box-shadow: 0 14px 32px rgba(56,48,125,.12); }
.product-home .hero-aha-card:focus-visible { outline: 3px solid rgba(99,91,255,.35); outline-offset: 3px; }
.product-home .hero-aha-label { display: flex; justify-content: space-between; gap: .5rem; color: #98a2b3; font-size: .66rem; font-weight: 700; }
.product-home .hero-aha-label span { color: var(--foreground); text-transform: uppercase; letter-spacing: .08em; }
.product-home .hero-aha-arrow { display: grid; place-items: center; color: var(--primary); font-size: 1.35rem; font-weight: 800; }
.product-home .hero-chat-window { display: grid; gap: .38rem; min-height: 8.8rem; margin: .8rem 0; padding: .65rem; overflow: hidden; border-radius: 10px; background: #f7f8fb; }
.product-home .hero-chat-line { width: 88%; padding: .4rem .5rem; border-radius: 7px; background: #fff; color: #667085; font-size: .62rem; line-height: 1.35; }
.product-home .hero-chat-line.is-user { width: 76%; margin-left: auto; background: #e9e7ff; color: #4f46a5; }
.product-home .hero-chat-fade { color: #98a2b3; font-size: .6rem; mask-image: linear-gradient(to bottom,#000 30%,transparent); }
.product-home .hero-mini-map { display: grid; place-items: center; min-height: 8.8rem; margin: .8rem 0; padding: .65rem; border-radius: 10px; background: #fff; }
.product-home .hero-mini-root { position: relative; z-index: 1; padding: .45rem .65rem; border-radius: 7px; background: var(--primary); color: #fff; font-size: .68rem; font-weight: 750; }
.product-home .hero-mini-branches { display: grid; grid-template-columns: 1fr 1fr; gap: .42rem; width: 100%; margin-top: .5rem; }
.product-home .hero-mini-branches span { position: relative; padding: .32rem .28rem; border: 1px solid #d8d5ff; border-radius: 6px; background: #f7f6ff; color: #5149ca; font-size: .58rem; font-weight: 650; text-align: center; }
.product-home .hero-aha-result { display: flex; justify-content: space-between; gap: .5rem; align-items: baseline; padding-top: .7rem; border-top: 1px solid var(--border-light); }
.product-home .hero-aha-result strong { font-size: .72rem; }
.product-home .hero-aha-result span { color: var(--muted-foreground); font-size: .6rem; text-align: right; }
.product-home .hero-aha-card-action { display: flex; justify-content: flex-end; gap: .3rem; align-items: center; margin-top: .7rem; color: var(--primary); font-size: .65rem; font-weight: 750; }
.product-home .hero-aha-card-action span { transition: transform 160ms ease; }
.product-home .hero-aha-card:hover .hero-aha-card-action span { transform: translate(2px,-2px); }
.product-home .benefit-item { font-size: .95rem; }
.product-home .benefit-item::before { border-radius: 50%; width: .45rem; height: .45rem; }
.product-home .hero-scroll-cta { font-family: var(--font-product); font-weight: 700; letter-spacing: 0; text-transform: none; }
.product-home .preview-input-stack { grid-area: form; gap: 1rem; }
.product-home .workspace-input { border: 1px solid rgba(206,207,223,.9); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); padding: clamp(1.35rem,2.6vw,1.75rem); }
.product-home .generator-steps { position: relative; border: 0; padding: 0; margin-bottom: 1.25rem; gap: .5rem; }
.product-home .generator-steps::before { content: ''; position: absolute; top: .76rem; left: 1rem; right: 1rem; height: 1px; background: var(--border-light); }
.product-home .generator-steps li { position: relative; z-index: 1; width: fit-content; padding-right: .45rem; background: #fff; font-family: var(--font-product); font-size: .72rem; letter-spacing: 0; text-transform: none; font-weight: 650; }
.product-home .generator-steps li:nth-child(2) { justify-self: center; padding-left: .45rem; }
.product-home .generator-steps li:last-child { justify-self: end; padding-left: .45rem; padding-right: 0; }
.product-home .generator-steps span { border-radius: 50%; border-color: var(--border); background: #fff; }
.product-home .input-title { font-family: var(--font-product); font-size: 1.65rem; letter-spacing: -.025em; }
.product-home .input-card-header { margin-bottom: 1rem; }
.product-home .input-eyebrow { font-family: var(--font-product); letter-spacing: 0; text-transform: none; color: var(--muted-foreground); font-weight: 650; }
.product-home .input-pill { border: 0; border-radius: 999px; background: #ecfdf3; color: #087a55; font-family: var(--font-product); font-size: .72rem; letter-spacing: 0; text-transform: none; font-weight: 750; }
.product-home .workspace-input .input-tabs { padding: .25rem; border-radius: 12px; background: var(--muted); }
.product-home .workspace-input .input-tab { min-height: 2.55rem; padding: .55rem .75rem; border: 0; border-radius: 9px; background: transparent; color: var(--muted-foreground); font-family: var(--font-product); font-size: .78rem; font-weight: 650; }
.product-home .workspace-input .input-tab.active { background: #fff; color: var(--foreground); box-shadow: 0 1px 3px rgba(16,24,40,.1); }
.product-home .workspace-input .magazine-input-group input,
.product-home .workspace-input .magazine-input-group textarea { border: 1px solid var(--border); border-radius: 12px; background: #fff; font-family: var(--font-product); font-size: .92rem; line-height: 1.55; }
.product-home .workspace-input .magazine-input-group textarea::placeholder { color: #98a2b3; font-style: normal; }
.product-home .workspace-input .magazine-input-group input:focus,
.product-home .workspace-input .magazine-input-group textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(99,91,255,.11); }
.product-home .input-validation:empty { display: none; }
.product-home .input-meta { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; }
.product-home .input-help { font-family: var(--font-product); font-size: .78rem; }
.product-home .character-count { flex: 0 0 auto; float: none; color: #98a2b3; font-family: var(--font-product); font-size: .72rem; }
.product-home .generation-settings { grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; margin-top: .85rem; }
.product-home .generation-option label,.product-home .generation-setting-label { display: block; margin-bottom: .35rem; color: #667085; font-family: var(--font-product); font-size: .72rem; font-weight: 650; }
.product-home .generation-option select { border-color: var(--border); border-radius: 10px; font-family: var(--font-product); font-size: .82rem; }
.product-home .advanced-generation-settings summary { font-family: var(--font-product); }
.product-home .advanced-settings-values { max-width: 100%; margin-left: 0; overflow: hidden; color: #344054; font-size: .8rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.product-home .advanced-generation-option:has(.advanced-generation-settings[open]) { grid-column: 1 / -1; }
.product-home .workspace-input .magazine-actions { gap: .65rem; margin-top: 1rem; }
.product-home .workspace-input #generate-btn { min-height: 3.25rem; border-radius: 11px; font-family: var(--font-product); font-weight: 700; }
.product-home .workspace-input #generate-btn:disabled { opacity: 1; border-color: #dedcff !important; background: #e8e7ff !important; color: #8580c6; box-shadow: none; }
.product-home .try-example-btn { justify-content: center; width: 100%; padding: .35rem 0; font-family: var(--font-product); font-size: .76rem; letter-spacing: 0; text-decoration: none; color: var(--muted-foreground); font-weight: 600; }
.product-home .try-example-btn:hover { color: var(--primary); }
.product-home .generator-assurance { margin: .25rem 0 0; font-family: var(--font-product); font-size: .7rem; letter-spacing: 0; text-align: left; text-transform: none; }
.product-home .generator-credit-row { margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--border-light); }
.product-home .mindmap-preview { display: none; }

.proof-strip { padding: 1.4rem 0; border: 0; border-top: 1px solid var(--border-light); border-bottom: 1px solid var(--border-light); background: #fff; }
.proof-item { padding: .5rem 1.4rem; }
.proof-item strong { font-family: var(--font-body); font-size: 1rem; }

.transformation-section { padding: 6rem 0; border: 0; background: var(--background-alt); }
.section-title { font-family: var(--font-product); letter-spacing: -.04em; }
.section-intro { max-width: 47rem; margin: 1.25rem 0 0; color: var(--muted-foreground); font-size: 1.08rem; line-height: 1.7; }
.source-card,.outcome-card { border: 1px solid var(--border); border-radius: var(--radius-md); }
.outcome-card { box-shadow: var(--shadow-sm); }
.transformation-card-label,.section-eyebrow { font-family: var(--font-body); letter-spacing: 0; text-transform: none; font-weight: 700; }
.mini-map-root,.mini-map-branches span { border-radius: 9px; }
.outcome-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.outcome-benefit { padding: 1.6rem; border: 1px solid var(--border-light); border-radius: var(--radius-md); background: #fff; box-shadow: var(--shadow-sm); }
.outcome-number { display: inline-block; margin-bottom: 2.5rem; color: var(--primary); font-size: .75rem; font-weight: 800; }
.outcome-benefit h3 { margin: 0 0 .65rem; font-size: 1.12rem; letter-spacing: -.02em; }
.outcome-benefit p { margin: 0; color: var(--muted-foreground); font-size: .9rem; line-height: 1.65; }

.examples-section { padding: 6rem 0; background: #fff; }
.examples-header { display: flex; justify-content: space-between; gap: 2rem; align-items: end; margin-bottom: 2.5rem; }
.examples-header .section-title { margin-bottom: 0; }
.examples-demo-note { max-width: 22rem; color: var(--muted-foreground); font-size: .86rem; font-weight: 650; line-height: 1.5; text-align: right; }
.examples-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.example-card { display: flex; min-width: 0; flex-direction: column; padding: 1.35rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: #fff; color: inherit; box-shadow: var(--shadow-sm); text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; }
.example-card:hover { transform: translateY(-3px); border-color: #c7c3ff; box-shadow: 0 18px 45px rgba(56,48,125,.12); }
.example-card:focus-visible { outline: 3px solid rgba(99,91,255,.3); outline-offset: 3px; }
.example-card-featured { border-color: #aaa4ff; background: linear-gradient(145deg,#fff 0%,#f7f6ff 100%); }
.example-card-topline { display: flex; justify-content: space-between; gap: .75rem; color: var(--muted-foreground); font-size: .68rem; font-weight: 700; }
.example-card-topline span:first-child { color: var(--primary); }
.example-card h3 { margin: .65rem 0 .45rem; font-size: 1.2rem; letter-spacing: -.025em; }
.example-insight { min-height: 3.9rem; margin: 0 0 1rem; color: var(--muted-foreground); font-size: .8rem; line-height: 1.55; }
.example-map { display: grid; place-items: center; min-height: 10rem; margin-bottom: 1rem; padding: 1rem; border-radius: 12px; background-image: linear-gradient(#eceef4 1px,transparent 1px),linear-gradient(90deg,#eceef4 1px,transparent 1px); background-size: 18px 18px; background-color: #fafbfc; }
.example-map strong { padding: .5rem .7rem; border-radius: 7px; background: #252338; color: #fff; font-size: .7rem; }
.example-map div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .42rem; width: 100%; margin-top: 1.3rem; }
.example-map span { padding: .4rem .3rem; border: 1px solid #cbc8ff; border-radius: 6px; background: rgba(247,246,255,.95); color: #5149ca; font-size: .62rem; font-weight: 650; text-align: center; }
.example-card-action { display: flex; gap: .35rem; align-items: center; margin-top: auto; color: var(--foreground); font-size: .82rem; font-weight: 750; }
.example-card-action span { transition: transform 160ms ease; }
.example-card:hover .example-card-action { color: var(--primary); }
.example-card:hover .example-card-action span { transform: translate(2px,-2px); }

.pricing-section { padding: 6rem 0; background: #17152e; color: #fff; }
.pricing-section .container-wide { display: grid; grid-template-columns: minmax(0,.9fr) minmax(30rem,1.1fr); gap: 5rem; align-items: center; }
.pricing-intro { max-width: 31rem; }
.pricing-intro .section-eyebrow { color: #aaa4ff; }
.pricing-intro .section-title { color: #fff; margin-bottom: 1.25rem; }
.pricing-intro > p:last-child { color: #b9b6cb; }
.pricing-options { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.pricing-option { position: relative; display: flex; flex-direction: column; gap: 1.2rem; padding: 1.6rem; border: 1px solid #39364e; border-radius: var(--radius-md); background: #211f37; }
.pricing-option.recommended { border-color: #8d86ff; background: #292643; box-shadow: 0 20px 50px rgba(0,0,0,.25); }
.pricing-option > div { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; }
.pricing-option strong { font-size: 2rem; }
.pricing-option p { color: #b9b6cb; font-size: .9rem; min-height: 4.5rem; }
.pricing-label { font-weight: 700; }
.pricing-badge { position: absolute; right: 1rem; top: -.7rem; padding: .3rem .65rem; border-radius: 999px; background: #8d86ff; font-size: .7rem; font-weight: 800; }
.pricing-option .btn-secondary { color: #fff; background: transparent; border-color: #5b576e; }

.features-section,.use-cases-section,.how-it-works-section { display: none; }
.faq-section { padding: 6rem 0; background: #fff; }
.faq-section .container-wide { max-width: 60rem; }
.faq-item { border-color: var(--border-light); }
.seo-links-section { padding: 3rem 0; background: var(--background-alt); }
.seo-links-section .section-title { font-size: 1.75rem; }
.footer-minimal { padding: clamp(3rem,6vw,4.5rem) 0 1.5rem; border-color: var(--border-light); background: #fff; }
.footer-grid { display: grid; grid-template-columns: minmax(18rem,1.7fr) repeat(3,minmax(8.5rem,1fr)); gap: clamp(2rem,5vw,4.5rem); align-items: start; }
.footer-brand { max-width: 25rem; }
.footer-logo { display: inline-block; margin-bottom: .8rem; color: var(--foreground); font-family: var(--font-product); font-size: 1.2rem; font-weight: 760; letter-spacing: -.04em; text-decoration: none; }
.footer-minimal .footer-main { max-width: 23rem; color: var(--muted-foreground); font-family: var(--font-product); font-size: .95rem; line-height: 1.6; letter-spacing: 0; }
.footer-primary-link { display: inline-flex; gap: .4rem; align-items: center; margin-top: 1.15rem; color: var(--primary); font-family: var(--font-product); font-size: .9rem; font-weight: 700; text-decoration: none; }
.footer-primary-link span { transition: transform 160ms ease; }
.footer-primary-link:hover span { transform: translateX(3px); }
.footer-minimal .footer-contact { margin: .9rem 0 0; color: var(--muted-foreground); font-family: var(--font-product); font-size: .84rem; line-height: 1.5; letter-spacing: 0; }
.footer-minimal .footer-contact a { color: var(--foreground); font-weight: 650; text-decoration: none; text-underline-offset: .2em; }
.footer-minimal .footer-contact a:hover { text-decoration: underline; }
.footer-group { display: flex; flex-direction: column; align-items: flex-start; gap: .7rem; }
.footer-minimal .footer-heading { margin: 0 0 .25rem; color: var(--foreground); font-family: var(--font-product); font-size: .78rem; font-weight: 750; letter-spacing: .02em; }
.footer-minimal .footer-link { color: var(--muted-foreground); font-family: var(--font-product); font-size: .88rem; line-height: 1.4; letter-spacing: 0; text-decoration: none; transition: color 160ms ease; }
.footer-minimal .footer-link:hover { color: var(--foreground); }
.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; margin-top: 3.25rem; padding-top: 1.25rem; border-top: 1px solid var(--border-light); }
.footer-minimal .footer-bottom p { color: var(--muted-foreground); font-family: var(--font-product); font-size: .76rem; letter-spacing: 0; }

.modal-content,.credit-paywall-content { border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.source-demo-content { display: flex; width: min(48rem,calc(100vw - 2rem)); max-height: min(52rem,calc(100vh - 2rem)); flex-direction: column; padding: 0; overflow: hidden; }
.source-demo-header { position: relative; padding: 1.5rem 4rem 1.25rem 1.5rem; border-bottom: 1px solid var(--border-light); }
.source-demo-header h2 { margin: .25rem 0 .45rem; font-family: var(--font-product); font-size: 1.55rem; letter-spacing: -.035em; }
.source-demo-header > div > p:last-child { margin: 0; color: var(--muted-foreground); font-size: .86rem; }
.source-demo-eyebrow { margin: 0; color: var(--primary); font-size: .72rem; font-weight: 750; }
.source-demo-header .modal-close { top: 1.2rem; right: 1.2rem; }
.source-demo-thread { display: grid; gap: 1rem; padding: 1.25rem 1.5rem; overflow-y: auto; background: #f7f8fb; }
.source-demo-message { max-width: 86%; padding: .9rem 1rem; border: 1px solid var(--border-light); border-radius: 14px; background: #fff; box-shadow: 0 3px 12px rgba(16,24,40,.04); }
.source-demo-message span { display: block; margin-bottom: .45rem; color: var(--muted-foreground); font-size: .68rem; font-weight: 750; }
.source-demo-message p { margin: 0 0 .65rem; color: #344054; font-size: .88rem; line-height: 1.65; }
.source-demo-message p:last-child { margin-bottom: 0; }
.source-demo-user { justify-self: end; border-color: #d6d2ff; background: #f0efff; }
.source-demo-user span { color: var(--primary); }
.source-demo-footer { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 1rem 1.5rem; border-top: 1px solid var(--border-light); background: #fff; }
.source-demo-footer > span { max-width: 25rem; color: var(--muted-foreground); font-size: .75rem; line-height: 1.45; }
.source-demo-footer .btn { flex: 0 0 auto; }
.credit-product-card { border: 1px solid var(--border); border-radius: var(--radius-md); }
.credit-product-card.popular { border: 2px solid var(--primary); background: #f7f6ff; }
.checkout-policy-note { margin: .75rem 0 0; color: var(--muted-foreground); font-size: .78rem; line-height: 1.55; text-align: center; }
.checkout-policy-note a { color: var(--foreground); font-weight: 700; }
.legal-section { padding: 2rem 0 5rem; }
.legal-content { color: var(--muted-foreground); line-height: 1.75; }
.legal-content h2 { margin: 2.25rem 0 .75rem; color: var(--foreground); font-family: var(--font-product); font-size: 1.35rem; letter-spacing: -.025em; }
.legal-content p { margin: 0 0 1rem; }
.legal-content ul { margin: 0 0 1.25rem; padding-left: 1.35rem; }
.legal-content li { margin-bottom: .5rem; }
.legal-content a { color: var(--primary); }

.account-page { background: var(--background-alt); }
.account-page .account-panel { border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.account-page .account-title,.account-page .account-panel-title,.account-page .orders-title { font-family: var(--font-body); letter-spacing: -.04em; }
.account-page .account-product { border-color: var(--border); border-radius: var(--radius-md); }
.account-page .account-product.recommended { border: 2px solid var(--primary); background: #f7f6ff; }
.account-page .orders-list { border-color: var(--border); }
.payment-success-card { display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: center; margin-bottom: 1.5rem; padding: 1rem 1.1rem; border: 1px solid #a7e5c7; border-radius: var(--radius-md); background: #f0fdf7; color: #075f43; box-shadow: var(--shadow-sm); }
.payment-success-card.hidden { display: none; }
.payment-success-card p { margin: .2rem 0 0; color: #39715e; font-size: .9rem; }
.payment-success-icon { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: #079669; color: #fff; font-weight: 900; }

.generation-progress { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 1.25rem; background: rgba(17,24,39,.52); backdrop-filter: blur(14px); }
.generation-progress.hidden { display: none; }
.generation-progress-card { width: min(36rem,100%); padding: clamp(1.6rem,5vw,2.5rem); border: 1px solid rgba(255,255,255,.7); border-radius: 24px; background: #fff; box-shadow: 0 30px 90px rgba(13,12,34,.3); text-align: center; }
.generation-orbit { position: relative; width: 5rem; height: 5rem; margin: 0 auto 1.25rem; border-radius: 50%; background: #eeecff; animation: generationPulse 1.8s ease-in-out infinite; }
.generation-orbit span { position: absolute; width: .7rem; height: .7rem; border-radius: 50%; background: var(--primary); }
.generation-orbit span:nth-child(1){left:2.15rem;top:.65rem}.generation-orbit span:nth-child(2){right:.8rem;bottom:1.2rem}.generation-orbit span:nth-child(3){left:.8rem;bottom:1.2rem}
.generation-progress-kicker { color: var(--primary); font-size: .78rem; font-weight: 750; margin: 0 0 .5rem; }
.generation-progress-card h2 { font-family: var(--font-product); font-size: clamp(1.5rem,4vw,2rem); letter-spacing: -.035em; margin-bottom: .6rem; }
.generation-progress-card > p { color: var(--muted-foreground); }
.generation-progress-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: .45rem; list-style: none; margin: 1.8rem 0 1rem; padding: 0; }
.generation-progress-steps li { display: flex; flex-direction: column; gap: .35rem; align-items: center; color: #98a2b3; font-size: .72rem; font-weight: 650; }
.generation-progress-steps span { display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border: 1px solid var(--border); border-radius: 50%; }
.generation-progress-steps li.active { color: var(--primary); }.generation-progress-steps li.active span{background:var(--primary);border-color:var(--primary);color:#fff}.generation-progress-steps li.complete{color:#079669}.generation-progress-steps li.complete span{background:#dcfce9;border-color:#a7e5c7;color:#057a55}
.generation-progress-track { height: .45rem; overflow: hidden; border-radius: 99px; background: #eceef4; }
.generation-progress-track span { display: block; width: 18%; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#635bff,#9b8cff); transition: width 700ms ease; }
.generation-progress-note { margin-top: .9rem; font-size: .75rem; }
@keyframes generationPulse { 0%,100%{transform:scale(.96);box-shadow:0 0 0 0 rgba(99,91,255,.16)}50%{transform:scale(1.04);box-shadow:0 0 0 14px rgba(99,91,255,0)} }
@media(max-width:600px){.payment-success-card{grid-template-columns:auto 1fr}.payment-success-card .btn{grid-column:1/-1}.generation-progress-steps li{font-size:.62rem}}

.editor-page { background: #f4f5f9; }
.editor-page .editor-header { border-bottom: 1px solid var(--border-light); box-shadow: 0 1px 10px rgba(16,24,40,.05); }
.editor-page .editor-header-content { padding-left: 1rem; padding-right: 1rem; }
.editor-page .editor-title-block { text-align: left; max-width: 24rem; }
.editor-page .editor-title { font-family: var(--font-product); font-weight: 700; letter-spacing: -.025em; }
.editor-action-group { display: flex; align-items: center; gap: .45rem; }
.editor-action-label { color: var(--muted-foreground); font-size: .7rem; font-weight: 700; }
.editor-page .editor-back-btn,.editor-page .segmented-control,.editor-page .editor-icon-btn,.editor-page .export-menu { border-radius: var(--radius-sm); }
.editor-page .editor-back-btn { padding: .55rem .7rem; border: 1px solid var(--border-light); font-family: var(--font-product); font-size: .8rem; letter-spacing: 0; text-transform: none; }
.editor-page .segmented-control { gap: 2px; padding: 3px; border: 1px solid var(--border-light); border-radius: 11px; background: var(--muted); overflow: visible; }
.editor-page .segmented-btn { display: inline-flex; min-height: 2rem; align-items: center; gap: .35rem; padding: .38rem .55rem; border: 0; border-right: 0; border-radius: 8px; background: transparent; color: var(--muted-foreground); font-family: var(--font-product); font-size: .72rem; font-weight: 650; letter-spacing: 0; line-height: 1; text-transform: none; white-space: nowrap; }
.editor-page .segmented-btn:hover { background: rgba(255,255,255,.72); color: var(--foreground); }
.editor-page .segmented-btn.active { background: #fff; color: var(--primary); box-shadow: 0 1px 3px rgba(16,24,40,.12), inset 0 0 0 1px rgba(99,91,255,.14); }
.editor-page .segmented-btn:focus-visible { outline: 2px solid rgba(99,91,255,.45); outline-offset: 1px; }
.editor-page .layout-icon { width: .9rem; height: .9rem; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
.editor-page .editor-hints {
  bottom: 1.25rem;
  gap: 0;
  padding: .38rem;
  color: var(--foreground);
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(99,91,255,.3);
  border-radius: 14px;
  box-shadow: 0 10px 28px rgba(16,24,40,.14), 0 2px 6px rgba(16,24,40,.08);
  font-family: var(--font-product);
  font-size: .75rem;
  letter-spacing: 0;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.editor-page .editor-hints .hint-title,
.editor-page .editor-hints .hint-item { display: inline-flex; align-items: center; gap: .42rem; min-height: 2rem; white-space: nowrap; }
.editor-page .editor-hints .hint-title { padding: 0 .72rem; color: var(--primary); font-size: .76rem; font-weight: 750; }
.editor-page .editor-hints .hint-title svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.editor-page .editor-hints .hint-item { position: relative; padding: 0 .72rem; color: var(--muted-foreground); }
.editor-page .editor-hints .hint-item::before { position: absolute; left: 0; width: 1px; height: 1.15rem; background: var(--border-light); content: ""; }
.editor-page .editor-hints .hint-item b { color: var(--foreground); font-weight: 700; }
.editor-page .editor-hints .hint-icon,
.editor-page .editor-hints kbd { display: inline-grid; min-width: 1.45rem; height: 1.45rem; place-items: center; padding: 0 .3rem; color: var(--primary); background: rgba(99,91,255,.1); border: 1px solid rgba(99,91,255,.18); border-radius: 6px; font-family: var(--font-product); font-size: .7rem; font-weight: 750; line-height: 1; }
.editor-page .editor-utility-actions { border-radius: var(--radius-sm); overflow: hidden; }
.editor-page .export-menu { border: 1px solid var(--border); box-shadow: var(--shadow-sm); overflow: hidden; }
.editor-page .editor-mindmap-container { inset: .75rem; border: 1px solid var(--border-light); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); overflow: hidden; }
.editor-page .demo-banner { border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.editor-page .editor-onboarding { border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); }

@media (max-width: 960px) {
  .header-minimal .container-wide { grid-template-columns: auto 1fr; }
  .header-nav { display: none; }
  .product-home .hero-workspace-grid { grid-template-columns: 1fr; grid-template-areas: 'copy' 'form' 'aha'; row-gap: 2rem; }
  .product-home .hero-content { max-width: 44rem; }
  .outcome-grid,.examples-grid { grid-template-columns: 1fr 1fr; }
  .outcome-benefit:last-child,.example-card:last-child { grid-column: 1 / -1; }
  .pricing-section .container-wide { grid-template-columns: 1fr; gap: 2.5rem; }
  .footer-grid { grid-template-columns: repeat(3,1fr); }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 680px) {
  .editor-page .editor-hints { bottom: calc(var(--space-4) + 80px + env(safe-area-inset-bottom)) !important; max-width: calc(100vw - 1rem); padding: .3rem; }
  .editor-page .editor-hints .hint-title { display: none; }
  .editor-page .editor-hints .hint-item { padding: 0 .42rem; }
  .editor-page .editor-hints .hint-item:first-of-type::before { display: none; }
  .footer-minimal { padding-top: 2.75rem; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.25rem 1.5rem; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-bottom { align-items: flex-start; flex-direction: column; margin-top: 2.5rem; }
  .nav-link { display: none; }
  .product-home .hero-workspace-section { padding-top: 2.5rem; }
  .product-home .hero-title { font-size: clamp(2.45rem,12vw,3.4rem); }
  .product-home .hero-aha { grid-template-columns: 1fr; }
  .product-home .hero-aha-arrow { min-height: 1.25rem; transform: rotate(90deg); }
  .product-home .hero-assurances { gap: .45rem .8rem; }
  .product-home .workspace-input { margin: 0; box-shadow: 0 16px 42px rgba(56,48,125,.13); border-radius: 18px; }
  .product-home .generation-settings { grid-template-columns: 1fr; }
  .product-home .advanced-generation-option:has(.advanced-generation-settings[open]) { grid-column: auto; }
  .product-home .input-meta { align-items: flex-start; flex-direction: column; gap: .3rem; }
  .pricing-section { padding: 4rem 0; }
  .pricing-options { grid-template-columns: 1fr; }
  .pricing-option p { min-height: 0; }
  .outcome-grid,.examples-grid { grid-template-columns: 1fr; }
  .outcome-benefit:last-child,.example-card:last-child { grid-column: auto; }
  .outcome-number { margin-bottom: 1.5rem; }
  .examples-header { align-items: flex-start; flex-direction: column; }
  .examples-demo-note { text-align: left; }
  .source-demo-content { max-height: calc(100vh - 1rem); }
  .source-demo-header { padding: 1.2rem 3.5rem 1rem 1rem; }
  .source-demo-thread { padding: 1rem; }
  .source-demo-message { max-width: 94%; }
  .source-demo-footer { align-items: stretch; flex-direction: column; padding: 1rem; }
  .source-demo-footer .btn { width: 100%; }
  .header-actions { gap: .35rem; }
  .header-create-btn { display: none; }
  .header-buy-credits { padding-inline: .65rem; }
  .user-name { display: none; }
  .user-menu-btn { padding-right: .3rem; }
  .header-language-link { display: none; }
  .generator-credit-row { align-items: flex-start; flex-direction: column; }
  .editor-page .editor-mindmap-container { inset: .4rem; }
  .editor-library-link,.editor-action-label { display: none; }
}