/* Shared premium controls and an in-app sales page. Typography follows landing.css. */
.plus-upgrade{display:inline-flex;align-items:center;justify-content:center;gap:5px;border:1px solid var(--accent);border-radius:8px;padding:8px 11px;color:var(--accent-2);font-size:var(--font-small);line-height:1.4;white-space:nowrap;text-decoration:none}
.plus-upgrade:hover{background:var(--accent-soft);color:var(--text)}
.plus-badge{display:inline-flex;align-items:center;background:var(--accent-soft);border:1px solid #8aa9ff55;border-radius:7px;padding:5px 10px;color:var(--accent-2);font-size:var(--font-caption);font-weight:800;letter-spacing:.02em;width:fit-content}
.plus-landing{max-width:1200px;margin-inline:auto;font-size:var(--font-body);line-height:1.75}
.plus-landing .icon{flex-shrink:0}
.plus-page-nav{display:flex;align-items:center;flex-wrap:wrap;gap:16px 28px;font-size:var(--font-small);color:var(--muted);padding-bottom:24px;border-bottom:1px solid var(--line)}
.plus-page-nav>.plus-badge{margin-right:auto}
.plus-page-nav a:hover{color:var(--text)}
.plus-hero{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:40px;padding:60px 0 44px}
.plus-kicker{display:block;font-size:var(--font-caption);letter-spacing:.1em;font-weight:700;color:var(--muted)}
.plus-hero h1{font-size:clamp(42px,4.3vw,63px);line-height:1.13;letter-spacing:-.055em;font-weight:600;margin:24px 0}
.plus-hero h1 em{font-style:normal;color:#c5b1ff}
.plus-hero-copy>p{color:var(--muted);margin:0;max-width:580px}
.plus-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px 24px;margin:28px 0 18px}
.plus-landing .primary-button,.plus-landing .secondary-button{font-size:var(--font-body);padding:15px 20px;line-height:1.4;max-width:100%;text-align:center}
.plus-landing .text-link{font-size:var(--font-small);font-weight:700}
.plus-hero-copy>.plus-payment-note{font-size:var(--font-small);line-height:1.7}
.plus-payment-note strong{color:var(--text)}
.plus-pass{position:relative;isolation:isolate;min-width:0;overflow:hidden;border:1px solid #e2d2ff70;border-radius:24px;padding:30px;color:#25213d;background:linear-gradient(140deg,#b6c7ff 0%,#cbb3fa 45%,#f6b9bc 100%);box-shadow:0 24px 70px #211d3e35;transform:rotate(2deg)}
.plus-pass:before{content:"";position:absolute;z-index:-1;width:300px;height:300px;right:-130px;top:-150px;border:45px solid #ffffff25;border-radius:50%}
.plus-pass-top,.plus-pass-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:var(--font-caption)}
.plus-pass-top>span:first-child{font-size:25px;font-weight:800;letter-spacing:-.06em}
.plus-pass-top>span:last-child{font-size:var(--font-caption);text-align:right;max-width:170px;font-weight:700;line-height:1.5}
.plus-pass-logo{display:flex;justify-content:space-between;align-items:center;font-size:clamp(64px,7vw,110px);font-weight:800;letter-spacing:-.065em;line-height:1.2;margin:30px 0 15px}
.plus-pass-logo>span{font-size:.7em;color:#fff6dd;letter-spacing:0}
.plus-pass>p{font-size:var(--font-body);max-width:240px;line-height:1.5;margin:0 0 24px}
.plus-pass-tiles{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.plus-pass-tiles>span{display:flex;align-items:center;gap:7px;border:1px solid #ffffff70;background:#ffffff35;border-radius:9px;padding:9px 10px;font-size:var(--font-caption);font-weight:700}
.plus-pass-tiles .icon{width:18px;height:18px}
.plus-pass-bottom{border-top:1px solid #25213d30;padding-top:18px}
.plus-community{display:flex;align-items:center;gap:20px;padding:24px 28px;border:1px solid #c6afff38;border-radius:16px;background:linear-gradient(110deg,#c7b1ff15,#8aa9ff08);font-size:var(--font-small)}
.plus-community p{margin:0;color:var(--muted);line-height:1.65;flex:1}
.plus-community strong{color:var(--text);font-size:var(--font-body)}
.plus-avatars{display:flex;padding-left:9px;flex-shrink:0}
.plus-avatars span{width:38px;height:38px;border:2px solid var(--bg);border-radius:50%;background:#b6c7ff;color:#25213d;display:grid;place-items:center;font-size:var(--font-small);font-weight:700;margin-left:-9px}
.plus-avatars span:nth-child(2){background:#efbd95}.plus-avatars span:nth-child(3){background:#a5d8bc}.plus-avatars span:nth-child(4){background:#c9b0f5}
.plus-community-star{font-size:45px;color:#c5b1ff}
.plus-section{padding-top:72px;scroll-margin-top:30px}
.plus-section-heading{display:flex;gap:30px;justify-content:space-between;align-items:flex-end;margin-bottom:30px}
.plus-section h2,.plus-final h2{font-size:clamp(29px,3vw,42px);line-height:1.25;letter-spacing:-.05em;font-weight:600;margin:16px 0 0}
.plus-section-heading>p{font-size:var(--font-body);line-height:1.75;color:var(--muted);margin:0 0 2px;max-width:330px}
.plus-features{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.plus-feature{--feature-color:#cbb8ff;display:flex;flex-direction:column;min-width:0;border:1px solid color-mix(in srgb,var(--feature-color) 35%,transparent);border-radius:20px;padding:30px;background:radial-gradient(ellipse at top right,color-mix(in srgb,var(--feature-color) 15%,transparent),transparent 70%),var(--surface)}
.plus-feature-money{--feature-color:#a4dbc0}.plus-feature-plan{--feature-color:#f2b492}.plus-feature-tools{--feature-color:#a7c6ff}
.plus-feature-top{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--feature-color)}
.plus-feature-label{font-size:var(--font-caption);font-weight:700;letter-spacing:.1em}
.plus-art-icon{display:grid;place-items:center;width:48px;height:48px;border:1px solid color-mix(in srgb,var(--feature-color,var(--accent)) 35%,transparent);border-radius:13px;background:color-mix(in srgb,var(--feature-color,var(--accent)) 12%,transparent);color:var(--feature-color,var(--accent))}
.plus-art-icon .icon{width:25px;height:25px}
.plus-feature h3{font-size:clamp(25px,2.4vw,32px);line-height:1.3;font-weight:600;letter-spacing:-.04em;margin:24px 0 16px}
.plus-feature p{font-size:var(--font-body);line-height:1.75;color:var(--muted);margin:0 0 24px}
.plus-feature-pills{display:flex;flex-wrap:wrap;gap:8px;margin:auto 0 24px;padding-top:8px}
.plus-feature-pills>span{font-size:var(--font-caption);color:var(--feature-color);background:color-mix(in srgb,var(--feature-color) 10%,transparent);border:1px solid color-mix(in srgb,var(--feature-color) 25%,transparent);border-radius:20px;padding:5px 12px}
.plus-feature>.text-link{color:var(--feature-color);margin-top:auto}
.plus-mini-budget{display:grid;gap:9px;margin:auto 0 24px;padding-top:8px;font-size:var(--font-caption);color:var(--feature-color)}
.plus-mini-budget>span{display:grid;grid-template-columns:90px 1fr;align-items:center;gap:12px}
.plus-mini-budget i{height:7px;border-radius:10px;background:linear-gradient(to right,var(--feature-color) var(--fill),#a4dbc025 var(--fill))}
.plus-plans{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.plus-plan{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:20px;padding:30px;background:var(--surface)}
.plus-plan-label{font-size:var(--font-caption);line-height:1.7;letter-spacing:.06em;color:var(--muted);font-weight:700}
.plus-plan h3{font-size:28px;font-weight:700;letter-spacing:-.04em;margin:20px 0}
.plus-price{font-size:clamp(36px,4vw,48px);letter-spacing:-.05em;font-weight:800;line-height:1.3}
.plus-price small{display:block;font-size:var(--font-small);letter-spacing:0;font-weight:500;margin-top:8px;color:var(--muted)}
.plus-plan>p{color:var(--muted);font-size:var(--font-small);line-height:1.75;margin:20px 0 8px}
.plus-plan ul{list-style:none;padding:0;margin:0 0 30px;flex:1}
.plus-plan li{font-size:var(--font-small);line-height:1.65;display:flex;align-items:flex-start;gap:10px;margin:16px 0}
.plus-plan li .icon{width:18px;height:18px;color:var(--accent);margin-top:4px;flex-shrink:0}
.plus-plan .plus-unavailable{color:var(--subtle);padding-left:28px}
.plus-plan-featured{border-color:#c5b1ff;background:radial-gradient(ellipse at top right,#c5b1ff25,transparent 70%),var(--surface);box-shadow:0 12px 45px #0001}
.plus-plan-featured h3 span{color:#c5b1ff}
.plus-plan-featured .primary-button{background:#c5b1ff;border-color:#c5b1ff;color:#25213d}
.plus-plan>small{display:block;text-align:center;font-size:var(--font-caption);line-height:1.7;color:var(--muted);margin-top:16px}
.plus-plan-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;min-height:34px}
.plus-plan-monthly>.plus-plan-label{display:flex;align-items:center;min-height:34px}
.plus-discount{display:inline-flex;align-items:center;border-radius:8px;padding:3px 10px;background:#c5b1ff;color:#25213d;font-size:var(--font-small);font-weight:800;white-space:nowrap}
.plus-plan-featured{border-width:2px;padding:29px}
.plus-plan-featured .plus-price{color:#d5c5ff}
.plus-plan-total{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 12px;margin-top:14px;font-size:var(--font-small)}
.plus-plan-total s{color:var(--muted)}
.plus-plan-featured>.plus-coffee{color:var(--text);margin:16px 0}
.plus-plan-saving{border:1px solid #a4dbc040;border-radius:12px;padding:12px 16px;margin-bottom:10px;background:#a4dbc00d;color:#b9e7cf;font-size:var(--font-body);font-weight:700}
.plus-plan-saving span{display:block;margin-top:3px;font-size:var(--font-caption);font-weight:400;color:var(--muted);line-height:1.6}
.plus-plan-basic{grid-column:1/-1;flex-direction:row;align-items:center;gap:24px;padding:24px 30px}
.plus-plan-basic>div{flex:1;min-width:0}
.plus-plan-basic h3{font-size:22px;margin:8px 0}
.plus-plan-basic h3 span{color:var(--muted);white-space:nowrap}
.plus-plan-basic p{color:var(--muted);font-size:var(--font-small);margin:0;max-width:680px}
.plus-plan-basic>.text-link{flex-shrink:0}
.plus-pricing-note{color:var(--muted);font-size:var(--font-caption);line-height:1.8;margin:18px 0 0;max-width:850px}
.plus-checkout-plans{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:24px 0}
.plus-checkout-plans a{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;border:1px solid var(--line);border-radius:10px;padding:12px;font-size:var(--font-small);text-align:center;text-decoration:none}
.plus-checkout-plans a[aria-current=page]{background:var(--accent-soft);border-color:var(--accent)}
.plus-checkout-plans span{color:#b9e7cf;font-weight:800}
.plus-checkout-saving{font-size:var(--font-small);color:var(--muted)}
@media(max-width:767px){.plus-plan-featured{order:-1}.plus-plan-basic{flex-direction:column;align-items:flex-start}}
.plus-reviews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.plus-review{display:flex;flex-direction:column;padding:24px;border:1px solid var(--line);border-radius:18px;margin:0;background:var(--surface)}
.plus-placeholder{font-size:var(--font-caption);color:var(--warning);line-height:1.6}
.plus-review-quote{font-size:64px;color:#c5b1ff;height:66px;line-height:1.4;font-family:Georgia,serif}
.plus-review blockquote{font-size:var(--font-body);line-height:1.75;flex:1;margin:0 0 25px}
.plus-review figcaption{display:flex;gap:12px;align-items:center}
.plus-review figcaption strong{font-size:var(--font-small);display:block}
.plus-review figcaption small{font-size:var(--font-caption);color:var(--muted);display:block;margin-top:4px}
.plus-review .avatar{flex-shrink:0;width:36px;height:36px;font-size:var(--font-small)}
.plus-faq{display:grid;grid-template-columns:1fr 1.4fr;gap:40px}
.plus-faq details{border-bottom:1px solid var(--line);padding:20px 0}
.plus-faq details:first-child{border-top:1px solid var(--line)}
.plus-faq summary{font-size:var(--font-body);line-height:1.65;cursor:pointer;font-weight:600}
.plus-faq details p{font-size:var(--font-body);line-height:1.75;color:var(--muted);margin:18px 0 0}
.plus-final{padding:48px 28px;margin:72px 0 10px;text-align:center;border:1px solid #c5b1ff60;border-radius:22px;background:radial-gradient(ellipse at top left,#c5b1ff25,transparent 60%),radial-gradient(ellipse at bottom right,#a4dbc018,transparent 65%),var(--surface)}
.plus-final h2{margin:24px 0 18px}
.plus-final p{font-size:var(--font-body);color:var(--muted);line-height:1.75;margin:0 auto 26px;max-width:580px}
.plus-final>small{display:block;font-size:var(--font-caption);margin-top:18px;color:var(--muted)}
/* Financial demos wrap the same templates as the user's working pages. */
.plus-preview{position:relative;isolation:isolate;min-height:760px;overflow:hidden;border-radius:15px}
.plus-preview-demo{filter:blur(6px);opacity:.55;pointer-events:none;user-select:none;padding:6px}
.plus-preview-demo .page-intro{min-height:110px}
.plus-preview-overlay{position:absolute;z-index:1;top:140px;left:50%;transform:translateX(-50%);width:min(550px,calc(100% - 32px));padding:32px;text-align:center;border:1px solid #c5b1ff66;background:linear-gradient(145deg,#4e495bf9,#414146fc);box-shadow:0 25px 90px #0004;border-radius:20px;display:flex;align-items:center;flex-direction:column}
.plus-lock{display:grid;place-items:center;width:50px;height:50px;border-radius:14px;background:var(--accent-soft);color:var(--accent);margin-bottom:18px}
.plus-lock .icon{width:26px;height:26px}
.plus-preview-overlay h2{font-size:32px;line-height:1.25;letter-spacing:-.04em;margin:22px 0 16px}
.plus-preview-overlay p{color:var(--muted);font-size:var(--font-body);line-height:1.75;margin-bottom:24px}
.plus-preview-overlay .primary-button{font-size:var(--font-small);max-width:100%}
.plus-preview-overlay>small{font-size:var(--font-caption);color:var(--muted);margin-top:16px}
.plus-demo-disclaimer{font-size:var(--font-caption);color:var(--muted);margin-top:20px;line-height:1.6}
.plus-content-lock{max-width:720px;display:flex;flex-direction:column;align-items:center;text-align:center;padding:42px 25px}
.plus-content-lock p{max-width:490px;color:var(--muted);line-height:1.9;margin:18px 0 25px}
.plus-content-lock small{display:block;color:var(--muted);font-size:var(--font-caption);margin:16px 0 24px}
.plus-checkout .plus-badge{display:block;margin-top:20px}
.plus-checkout-price{font-size:38px;font-weight:800;letter-spacing:-1px;margin:25px 0 12px}
.plus-checkout-price small{font-size:var(--font-small);font-weight:400;letter-spacing:0;color:var(--muted)}
.plus-checkout p{line-height:1.8}.plus-checkout input[type=checkbox]{display:block;min-height:20px;margin-top:10px}.plus-checkout button:disabled{cursor:not-allowed}
@media(min-width:992px) and (max-width:1199px){.plus-hero{grid-template-columns:1fr;gap:28px}.plus-pass{width:min(100%,570px);margin-inline:auto;transform:none}.plus-hero-copy>p{max-width:650px}.plus-pass-logo{font-size:96px}.plus-reviews{grid-template-columns:1fr}.plus-faq{grid-template-columns:1fr 1.5fr;gap:24px}}
@media(max-width:767px){.plus-hero{grid-template-columns:1fr;padding:40px 0 32px;gap:32px}.plus-hero h1{font-size:clamp(41px,7vw,56px)}.plus-pass{max-width:530px;width:100%;margin-inline:auto;transform:none}.plus-pass-logo{font-size:90px}.plus-page-nav{gap:14px 20px}.plus-page-nav>.plus-badge{flex-basis:auto}.plus-community{padding:22px;flex-wrap:wrap;gap:16px}.plus-community p{flex-basis:65%}.plus-community-star{display:none}.plus-section{padding-top:55px}.plus-section-heading{display:block}.plus-section-heading>p{max-width:none;margin-top:20px}.plus-features,.plus-plans,.plus-reviews,.plus-faq{grid-template-columns:1fr}.plus-feature,.plus-plan{padding:26px}.plus-feature h3{font-size:30px}.plus-faq{gap:26px}.plus-final{padding:38px 22px;margin-top:55px}.plus-preview-overlay{top:120px;padding:28px 24px}.plus-preview{min-height:900px}.plus-preview-overlay h2{font-size:29px}}
@media(max-width:479px){.topbar{flex-wrap:wrap;gap:12px}.topbar-left{flex-basis:100%}.topbar-actions{flex-wrap:wrap;gap:10px;margin-left:auto}.topbar-actions .plus-upgrade{font-size:var(--font-caption);padding:8px}.plus-page-nav{font-size:var(--font-caption);gap:12px 18px}.plus-page-nav>.plus-badge{margin-right:50%}.plus-pass{padding:24px}.plus-pass-top{gap:12px}.plus-pass-top>span:last-child{max-width:140px}.plus-pass-logo{font-size:78px}.plus-community{display:block}.plus-avatars{margin-bottom:14px}.plus-feature,.plus-plan{padding:24px}.plus-actions{align-items:flex-start;flex-direction:column}.plus-feature h3{font-size:28px}.plus-preview-overlay{width:calc(100% - 16px);padding:26px 18px}.plus-preview-overlay h2{font-size:27px}.plus-preview{min-height:1000px}.landing-page .lp-header-inner{flex-wrap:wrap}.landing-page .lp-header-actions .plus-upgrade{font-size:var(--font-caption);padding:8px}}