/* Figgy Studio layout. Colours and tokens live in system.css (see DESIGN.md). */
html { scroll-behavior:smooth; scroll-padding-top:28px; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0; }
.skip-link { position:fixed;left:20px;top:12px;clip-path:inset(100%);padding:12px 20px;background:var(--ink);color:white;z-index:100; }
.skip-link:focus { clip-path:none; }
.btn { border-radius:7px; }
.btn.ink { background:var(--forest);border-color:var(--forest); }
.brand { font-size:27px;letter-spacing:-1.4px; }
.brand svg { width:34px;height:34px;box-shadow:none;color:var(--forest);--logo-ink:#f8f6f0; }
.studio-nav { min-height:100px;max-width:1360px;margin:auto;padding:20px 48px;display:flex;align-items:center;gap:42px; }
.studio-nav nav { display:flex;gap:26px;margin-left:auto; }
.studio-nav a:not(.brand):not(.btn) { font-size:13px;text-decoration:none;font-weight:600; }
.studio-nav a:hover:not(.btn) { text-decoration:underline;text-underline-offset:5px; }
.nav-account { display:flex;align-items:center;gap:25px; }
.nav-account .btn { gap:26px;font-size:13px;height:44px; }
.studio-hero { max-width:1360px;margin:0 auto;padding:48px 48px 88px;display:grid;grid-template-columns:1.05fr 1fr;gap:60px;align-items:center; }
.studio-copy { padding:18px 0;min-width:0; }
.studio-kicker { display:flex;align-items:center;gap:10px;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin:0 0 26px; }
.studio-kicker > span { width:7px;height:7px;background:var(--clay);border-radius:50%; }
.studio-copy h1 { font-size:clamp(64px,7.6vw,108px);line-height:.99;letter-spacing:-.065em;font-weight:600;margin:0 0 28px; }
.serif-word { font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:italic;letter-spacing:-.055em; }
.studio-copy h1 .serif-word { color:var(--clay); }
.studio-lede { max-width:390px;font-size:17px;line-height:1.7;color:var(--muted);margin:0 0 28px; }
.studio-claim { display:flex;gap:8px;max-width:510px; }
.claim-field { display:flex;align-items:center;background:white;border:1px solid #c9cbbf;border-radius:7px;min-width:0;flex:1;padding:0 12px; }
.claim-field > span { max-width:44%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:var(--muted); }
.claim-field input { margin:0!important;border:0!important;box-shadow:none!important;padding:14px 0!important;background:transparent!important;min-width:0;font-size:13px!important; }
.claim-field:focus-within { outline:3px solid var(--focus);outline-offset:3px; }
.studio-claim .btn { height:50px;gap:20px;font-size:13px; }
.studio-fine { margin:12px 0 26px;color:var(--muted);font-size:11px; }
.text-link { font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:5px;display:inline-flex;gap:25px;min-height:44px;align-items:center; }
.hero-caption { margin-top:56px;display:flex;align-items:center;gap:14px;font-size:11px;line-height:1.6;color:var(--muted); }
.tiny-mark { font-size:42px;line-height:1;color:var(--clay); }
.studio-stage { background:#eae9df;border-radius:4px;position:relative;display:flex;flex-direction:column;align-items:center;padding:27px 38px 24px;isolation:isolate; }
.studio-stage::before { content:'';position:absolute;inset:90px 0 110px;background:repeating-linear-gradient(0deg,transparent,transparent 47px,#d4d5c84d 48px),repeating-linear-gradient(90deg,transparent,transparent 47px,#d4d5c84d 48px);z-index:-1; }
.stage-top { width:100%;display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:0;font-weight:600;margin-bottom:22px;color:#555f51; }
.stage-top span:last-child { font-size:24px; }
.sample-label { display:flex;align-items:center;gap:7px;background:#fffdf6;padding:7px 12px;font-size:10px;border-radius:4px 4px 0 0;align-self:center; }
.sample-dot { width:5px;height:5px;border-radius:50%;background:#526a40; }
.demo-page { width:100%;max-width:320px;border:6px solid #fffdf6;border-radius:15px;box-shadow:0 18px 35px -20px #17241966;overflow:hidden;background:#1f2b22; }
#demo-screen { height:455px;overflow:auto;scrollbar-width:thin;scrollbar-color:#87937b #1f2b22; }
#demo-screen .tp { min-height:100%;padding:26px 24px 22px;background-attachment:scroll; }
#demo-screen .tp-avatar { width:66px;height:66px;margin-bottom:14px; }
#demo-screen .tp-name { font-size:29px; }
#demo-screen .tp-bio { font-size:12px;line-height:1.5; }
#demo-screen .tp-head { margin-bottom:18px;padding-bottom:16px; }
#demo-screen .tp-socials { margin-top:10px; }
#demo-screen .tp-socials a { padding:8px; }
#demo-screen .tp-socials svg { width:18px;height:18px; }
#demo-screen .tp-links { gap:8px; }
#demo-screen .tp-btn { min-height:46px;padding:12px 31px 12px 17px;font-size:12px; }
#demo-screen .tp-hl { min-height:65px;font-size:16px;animation:none; }
#demo-screen .tp-arrow { right:12px;font-size:18px; }
#demo-screen .tp-header { margin-top:11px;font-size:9px; }
#demo-screen .tp-foot { margin-top:24px;font-size:10px; }
.demo-controls { width:100%;max-width:320px;margin-top:23px;background:#fffdf6;border:1px solid #dcddd0;border-radius:8px;padding:15px 17px; }
.control-title { display:flex;justify-content:space-between;font-size:11px;margin-bottom:10px; }
.control-title > span { color:var(--muted); }
.studio-swatches { display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:1px; }
.studio-swatch { width:34px;height:36px;display:grid;place-items:center;background:none;border:1px solid transparent;border-radius:50%;padding:4px;cursor:pointer; }
.studio-swatch span { width:24px;height:24px;border-radius:50%;background:var(--swatch);border:1px solid #202b2440;position:relative; }
.studio-swatch[aria-pressed=true] { border-color:var(--ink); }
.studio-swatch[aria-pressed=true] span::after { content:'✓';color:var(--swatch-ink);font-size:13px;position:absolute;inset:0;display:grid;place-items:center; }
.demo-details { border-top:1px solid var(--line);margin-top:11px;padding-top:4px;font-size:11px; }
.demo-details summary { display:flex;justify-content:space-between;align-items:center;cursor:pointer;min-height:35px; }
.demo-details label { margin-top:10px;font-size:11px; }
.demo-details input { font-size:12px!important; }
.layout-choices { display:flex;gap:6px; }
.layout-choices button { flex:1;padding:10px;border:1px solid var(--line);background:transparent;border-radius:5px;cursor:pointer; }
.layout-choices button[aria-pressed=true] { background:var(--forest);color:#fff; }
.stage-note { font:italic 14px Georgia,serif;margin-top:18px;color:#596250; }
.studio-stage { min-width:0; }
.possibility-band { border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 24px;display:flex;align-items:center;justify-content:center;gap:38px;flex-wrap:wrap; }
.possibility-band > span:first-child { font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted); }
.possibility-band strong { font:italic 28px Georgia,serif;letter-spacing:-1px; }
.possibility-band > span:not(:first-child) { font-size:24px;color:var(--clay); }
.studio-features { max-width:1264px;margin:0 auto;padding:95px 48px 85px; }
.section-intro { display:grid;grid-template-columns:1.5fr 1fr;gap:0 70px;align-items:end;margin-bottom:45px; }
.section-intro .studio-kicker { grid-column:1/-1;margin-bottom:18px; }
.section-intro h2,.studio-faq h2,.studio-invite h2 { font-size:clamp(32px,4vw,54px);font-weight:500;line-height:1.12;letter-spacing:-.045em;margin:0; }
.section-intro > p:last-child { max-width:340px;font-size:14px;color:var(--muted);line-height:1.7;margin:0 0 4px; }
.feature-spread { display:grid;grid-template-columns:1.35fr 1fr;gap:24px; }
.feature-main,.feature-side { border:1px solid var(--line);border-radius:6px;overflow:hidden; }
.feature-illustration { background:#e9bca1;min-height:270px;padding:35px 48px 24px;display:flex;flex-direction:column;justify-content:center;gap:12px; }
.link-slip { background:#fff9eb;display:flex;align-items:center;gap:18px;padding:17px 18px;border:1px solid #ab795c55;box-shadow:0 5px 0 #ad795c22;border-radius:3px;font-size:13px; }
.link-slip:first-child { transform:rotate(-3deg);background:#294131;color:#fcfaee; }
.link-slip:nth-child(2) { transform:rotate(1.5deg); }
.link-slip span { font-size:10px; }
.link-slip span:last-child { margin-left:auto;font-size:18px; }
.slip-caption { text-align:center;font:italic 13px Georgia,serif;margin-top:10px; }
.feature-text { padding:30px 34px 34px; }
.feature-index { font-size:10px;letter-spacing:.12em;color:var(--muted); }
.feature-text h3 { font-size:28px;font-weight:500;line-height:1.15;letter-spacing:-1px;margin:14px 0; }
.feature-text p { font-size:14px;line-height:1.75;color:var(--muted);margin:0;max-width:49ch; }
.feature-side { background:#eeefe5; }
.type-study { height:270px;display:flex;align-items:center;justify-content:center;gap:16px;position:relative;padding-bottom:40px; }
.type-study > span { font-size:57px;letter-spacing:-4px; }
.type-study > span:nth-child(2) { font-family:Georgia,serif;font-style:italic;color:var(--clay); }
.type-study > span:nth-child(3) { font-family:monospace;font-size:48px; }
.type-study > div { position:absolute;bottom:40px;display:flex;gap:9px; }
.type-study i { width:28px;height:28px;border-radius:50%;background:#294131; }
.type-study i:nth-child(2) { background:#a3432e; }.type-study i:nth-child(3) { background:#d8c5a2; }.type-study i:nth-child(4) { background:#b4c5be; }
.feature-notes { display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin-top:60px; }
.feature-notes article > span { font-size:29px;color:var(--clay); }
.feature-notes h3 { font-size:17px;font-weight:600;margin:14px 0 10px;letter-spacing:-.4px; }
.feature-notes p { color:var(--muted);font-size:13px;line-height:1.75;margin:0; }
.studio-faq { max-width:1168px;margin:0 auto;border-top:1px solid var(--line);padding:70px 0 85px;display:grid;grid-template-columns:1fr 1fr;gap:80px; }
.studio-faq h2 { font-size:37px; }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { min-height:65px;display:flex;align-items:center;justify-content:space-between;font-size:14px;cursor:pointer;gap:20px;list-style:none; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:'+';font-size:23px;font-weight:400; }
.faq-list details[open] summary::after { content:'−'; }
.faq-list p { font-size:13px;line-height:1.8;color:var(--muted);margin:0 22px 22px 0; }
.studio-invite { padding:65px 24px 75px;background:#e9ecdf;text-align:center; }
.studio-invite > span { display:block;font-size:48px;color:var(--clay);margin-bottom:18px; }
.studio-invite .btn { margin-top:30px;font-size:14px;gap:36px; }
.studio-footer { max-width:1360px;margin:0 auto;padding:35px 48px;display:flex;align-items:center;gap:28px;flex-wrap:wrap; }
.studio-footer p,.studio-footer a:not(.brand),.studio-footer > span { font-size:11px;color:var(--muted); }
.studio-footer a:not(.brand) { margin-left:auto; }
/* Editor: retain the familiar controls, make the hierarchy intentional. */
.dash-top { height:78px;background:#f8f6f0f5;gap:52px;padding:0 36px; }
.dash-top .brand { font-size:24px; }
.tabs { gap:18px; }
.tabs button { font-size:13px; }
.tabs button[aria-selected=true] { border-bottom-color:var(--clay); }
.share-bar { max-width:1160px;margin-top:24px;background:#e9ecdf;border-color:#d9ddce;border-radius:7px;padding-left:20px; }
.share-url { font-size:12px; }
.share-url a { margin-left:6px; }
.dash-body { max-width:1208px;grid-template-columns:minmax(0,1fr) 360px;gap:70px;padding-top:30px; }
.workspace-heading { margin:0 0 28px; }
.workspace-heading > p { font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:var(--muted);margin:0 0 12px; }
.workspace-heading h1 { font-size:38px;line-height:1.1;font-weight:500;letter-spacing:-1.6px;margin:0 0 12px; }
.workspace-heading > span { font-size:13px;color:var(--muted); }
.dash-preview { top:104px;background:#eaece2;padding:24px 20px 14px;border-radius:10px; }
.dash-preview .phone { width:290px;height:580px;border:1px solid #d5d9cc;background:#fdfcf7;padding:7px;border-radius:35px;box-shadow:0 10px 30px -20px #243d3066; }
.dash-preview .phone-screen { border-radius:28px; }
.dash-preview > p { font-size:10px;text-transform:uppercase;letter-spacing:.15em; }
.card { border-radius:8px; }
.card h2 { font-size:16px;font-weight:600; }
.add-card { background:#e9ecdf;border-color:#d9ddce;padding:18px; }
.add-form { grid-template-columns:minmax(0,1fr) minmax(0,.7fr) auto; }
.add-form input { font-size:12px!important; }
.link-item { border-radius:8px;padding-top:16px;padding-bottom:12px; }
.li-tools button { min-height:32px;min-width:32px; }
.li-body input.li-title { font-size:15px!important; }
.li-body input.li-url { font-size:12px!important; }
.li-tools button span { font-size:11px; }
.seg[role=group] button[aria-pressed=true] { background:var(--ink);color:#fff; }
.theme-grid { gap:12px; }
.auth { background:var(--paper); }
.auth-card { max-width:460px;border-color:var(--line);border-radius:10px;padding:42px;box-shadow:0 18px 65px -40px #253d3044; }
.auth-card h1 { font-weight:500;font-size:35px;letter-spacing:-1.3px; }
.auth-card .brand { margin-bottom:36px; }
.auth-card .muted { font-size:14px; }
.save-state.ok::before { content:'✓ '; }
.cross-tab-warning { max-width:1160px;margin:16px auto 0;padding:12px 16px;background:#fff3ce;border:1px solid #ddc37a;border-radius:7px;font-size:13px;color:#392e0b; }
@media (max-width:1208px) { .cross-tab-warning { margin-left:24px;margin-right:24px; } }
@media (max-width:640px) { .save-state { display:block;font-size:10px;max-width:90px; } }
.preview-toggle:active { transform:translateX(-50%) scale(.98); }
@media (min-width:981px) { .phone-screen .tp-layout-editorial .tp-name { font-size:29px; }.phone-screen .tp-layout-editorial .tp-hl { min-height:76px;font-size:16px; } }
@media (max-width:1100px) { .studio-nav { padding:20px 28px;gap:25px; }.studio-nav nav { gap:16px; }.studio-hero { padding:35px 28px 65px;gap:30px; }.studio-stage { padding:22px; }.studio-copy h1 { font-size:80px; }.studio-claim { flex-direction:column; }.studio-claim .btn { align-self:flex-start; }.claim-field { min-height:48px; }.studio-faq { margin:0 48px;gap:35px; }.dash-body { gap:30px; } }
@media (max-width:980px) { .dash-body { grid-template-columns:1fr; }.dash-top { height:auto;gap:12px;padding:12px 20px; }.dash-preview { align-self:center;width:min(100%,360px);margin:auto; }.tabs { gap:4px; }.tabs button { min-height:44px; }.dash-main { padding-bottom:30px; } }
@media (max-width:760px) { .studio-nav nav { display:none; }.studio-nav { min-height:80px;justify-content:space-between; }.studio-hero { grid-template-columns:1fr;gap:40px;padding-top:30px; }.studio-copy { max-width:570px; }.studio-copy h1 { font-size:clamp(68px,13vw,100px); }.studio-claim { flex-direction:row; }.studio-stage { max-width:530px;width:100%;margin:auto;padding:24px 35px; }.hero-caption { display:none; }.studio-fine { margin-bottom:10px; }.studio-stage .demo-page { max-width:340px; }.studio-controls { max-width:340px; }.section-intro { grid-template-columns:1fr;gap:20px; }.section-intro .studio-kicker { margin-bottom:0; }.section-intro > p:last-child { max-width:45ch; }.feature-spread { grid-template-columns:1fr; }.feature-notes { gap:24px;grid-template-columns:1fr; }.feature-notes article { display:grid;grid-template-columns:38px 1fr;gap:0 12px; }.feature-notes article > span { grid-row:1/3; }.feature-notes h3 { margin-top:0; }.studio-faq { grid-template-columns:1fr; }.studio-features { padding:60px 28px; }.studio-faq { margin:0 28px;padding:55px 0; }.studio-footer { padding:30px 28px;gap:18px; }.studio-footer p { width:100%;order:3;margin:0; }.studio-footer > span { display:none; }.possibility-band { gap:18px; }.possibility-band strong { font-size:23px; }.possibility-band > span:first-child { width:100%;text-align:center; } }
@media (max-width:480px) { .studio-nav { padding:18px 20px; }.studio-nav .brand { font-size:24px; }.nav-account { gap:15px; }.nav-account .btn { padding:0 12px;font-size:11px; }.nav-account .btn span { display:none; }.studio-hero { padding:24px 20px 46px; }.studio-kicker { font-size:9px;letter-spacing:.1em; }.studio-lede { font-size:15px; }.studio-claim { flex-direction:column; }.studio-claim .btn { width:100%;align-self:stretch; }.studio-stage { padding:20px 16px; }.stage-top { font-size:8px; }.studio-swatches { gap:0; }.studio-swatch { width:32px; }.studio-fine { font-size:10px; }.possibility-band { gap:12px; }.possibility-band strong { font-size:19px; }.possibility-band > span:not(:first-child) { font-size:16px; }.feature-illustration { padding:30px 20px;min-height:240px; }.link-slip { gap:12px;font-size:12px; }.feature-text { padding:26px; }.studio-features { padding:50px 20px; }.studio-faq { margin:0 20px; }.studio-faq h2 { font-size:34px; }.studio-footer { padding:28px 20px; }.dash-top { padding:12px 16px; }.share-actions .btn { min-height:40px; }.add-form { grid-template-columns:1fr; }.workspace-heading h1 { font-size:32px; }.save-state { display:block;font-size:10px;max-width:90px; }.dash-top-r { gap:4px; }.dash-top .brand { font-size:21px; }.dash-top .brand svg { width:28px;height:28px; }.dash-preview .phone { width:min(290px,100%); }.li-tools { gap:0; }.li-tools button { min-width:30px;padding:7px; }.auth-card { padding:30px 24px; } }
@media (max-width:480px) { .studio-copy h1 { font-size:clamp(56px,14vw,68px); }.studio-swatch { width:100%;padding:2px; }.studio-hero { grid-template-columns:minmax(0,1fr); }.nav-account { gap:10px; }.studio-nav { gap:10px; }.nav-account .btn { font-size:10px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }*,*::before,*::after { animation:none!important;transition:none!important; } }

/* Product direction: functional, high-contrast, and centered on the live page. */
.is-land { background:#f5f5f2; }
.studio-nav { max-width:1440px;min-height:80px;border-bottom:1px solid var(--line); }
.studio-nav .btn.ink,.studio-claim .btn.ink,.studio-invite .btn.ink { background:#b9f360;border-color:#b9f360;color:#151714; }
.studio-nav svg:not(.brand svg),.studio-claim svg,.text-link svg,.studio-invite svg,.studio-footer svg:not(.brand svg) { width:16px;height:16px; }
.studio-hero { max-width:1440px;padding-top:64px;padding-bottom:64px;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); }
.studio-copy h1 { font-size:clamp(58px,7vw,100px);letter-spacing:-.07em;line-height:.95;font-weight:700; }
.studio-copy h1 .serif-word,.serif-word { font-family:inherit;font-style:normal;font-weight:inherit;color:inherit;letter-spacing:inherit; }
.studio-lede { font-size:18px;max-width:31ch;color:#434a40; }
.studio-kicker { color:#3c4d3d;letter-spacing:.07em; }
.studio-stage { background:#d8e0d1;border-radius:12px; }
.studio-stage::before { display:none; }
.stage-top { color:#354337; }
.stage-top svg { width:22px;height:22px;flex:none; }
.demo-page { box-shadow:0 12px 35px #202b241c;border-color:#fff; }
.demo-controls { background:#fff; }
.stage-note { font:500 12px Archivo,system-ui,sans-serif; }
.hero-caption,.possibility-band,.feature-illustration,.type-study { display:none; }
.studio-features { max-width:1344px; }
.section-intro h2,.studio-faq h2,.studio-invite h2 { letter-spacing:-.045em;font-weight:650; }
.feature-spread { grid-template-columns:1fr 1fr; }
.feature-main,.feature-side { background:#fff;border-radius:10px; }
.feature-text { padding:36px; }
.feature-notes article > svg { width:24px;height:24px;color:#245b46; }
.studio-faq { max-width:1248px; }
.studio-invite { background:#1a271f;color:#fff; }
.studio-invite > span { display:none; }
.studio-footer { max-width:1440px; }
@media (max-width:760px) { .studio-hero { grid-template-columns:minmax(0,1fr); }.feature-spread { grid-template-columns:1fr; }.feature-notes article > svg { grid-row:1/3; } }
@media (max-width:480px) { .studio-copy h1 { font-size:clamp(54px,13vw,64px); }.studio-nav .btn.ink { font-size:10px; }.studio-hero { padding-top:32px; }.feature-text { padding:26px; } }
@media (max-width:360px) { .studio-nav { padding-left:12px;padding-right:12px; }.studio-nav .brand { font-size:20px; }.studio-nav .brand svg { width:28px;height:28px; }.nav-account { gap:8px; }.nav-account .btn { gap:6px;padding:0 8px; } }
@media (max-width:640px) { #retry-saves { white-space:normal;height:auto;min-height:36px;max-width:108px;font-size:10px;padding:5px 8px; }.dash-top-r { flex-wrap:wrap;justify-content:flex-end; } }

/* The homepage preview is the real renderer; its controls are visible and usable. */
.studio-copy h1 { max-width:10ch; }
.studio-lede { max-width:35ch; }
.stage-top { font-size:13px;letter-spacing:0;text-transform:none; }
.stage-top span:last-child { font-size:12px;font-weight:500; }
.demo-controls { padding:18px; }
.demo-name-label { margin:0 0 18px;font-size:13px; }
.demo-name-label input { font-size:16px!important;margin-top:8px!important; }
.control-title { font-size:13px;margin-bottom:8px; }
.layout-title { margin-top:18px; }
.studio-swatches { grid-template-columns:repeat(4,44px);justify-content:space-between;gap:2px; }
.studio-swatch { width:44px;height:44px; }
.layout-choices button { min-height:44px;font-size:13px; }
.section-intro { align-items:end; }
.section-intro h2 { max-width:15ch; }
@media (min-width:1200px) {
  .studio-stage { display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,230px);gap:0 20px;align-items:center; }
  .stage-top { grid-column:1/-1; }
  .sample-label { grid-column:1;justify-self:center; }
  .demo-page { grid-column:1;grid-row:3;justify-self:center; }
  .demo-controls { grid-column:2;grid-row:2 / span 2;margin:0;align-self:center; }
  .stage-note { grid-column:1;justify-self:center; }
}

/* Blocks: text, players, email signup, audience. */
.add-blocks { display:flex;align-items:center;flex-wrap:wrap;gap:4px 6px; }
.add-blocks > span { margin-right:2px;font-weight:600; }
.add-blocks .btn { border:1px dashed #b9bdaf;background:rgba(255,255,255,.5); }
.add-blocks .btn:hover { border-style:solid;border-color:var(--ink);background:#fff; }
.add-tip { margin:0;max-width:62ch; }
.li-body textarea.li-text { display:block;width:100%;margin:0!important;padding:6px 8px!important;border:1px solid var(--line)!important;border-radius:8px!important;font-size:14px!important;line-height:1.5;resize:vertical;min-height:72px;background:#fff; }
.li-warn { color:var(--bad)!important;font-weight:600; }
.toggle-row { display:flex;align-items:center;justify-content:space-between;gap:16px;font-weight:400;margin:0;cursor:pointer; }
.toggle-row b { display:block;font-size:14px; }
.toggle-row small { display:block;font-size:12.5px;margin-top:2px; }
.toggle-row .switch { margin:0; }
.kpis.two { grid-template-columns:1fr 1fr; }
.sub-list { list-style:none;margin:0;padding:0;border-top:1px solid var(--line); }
.sub-list li { display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:8px 0 8px 4px;border-bottom:1px solid var(--line); }
.sub-email { font-weight:600;font-size:14px;overflow-wrap:anywhere; }
.empty-state { text-align:center;padding:20px 12px 8px; }
.empty-state p { margin:0 0 6px; }
.empty-state .btn { margin-top:10px; }
@media (max-width:480px) { .sub-list li { grid-template-columns:minmax(0,1fr) auto;row-gap:0; }.sub-list li > .small { grid-row:2;grid-column:1; }.sub-list li .icon-btn { grid-row:1/3;grid-column:2; } }

/* Design-guidance pass: see docs/design-repository-review.md. */
html, body { overflow-x: clip; }
a { text-underline-offset: .18em; }
h1, h2, h3 { text-wrap: balance; }
p, dd, summary { text-wrap: pretty; }
.clicks, .kpi b, .bar-label b, .counter { font-variant-numeric: tabular-nums; }
.btn { touch-action: manipulation; transition: background-color .16s cubic-bezier(.23,1,.32,1), border-color .16s cubic-bezier(.23,1,.32,1), color .16s cubic-bezier(.23,1,.32,1), transform .16s cubic-bezier(.23,1,.32,1); }
.btn:active { transform: scale(.97); }
.dash-preview > p { text-transform: none; letter-spacing: 0; font-size: 12px; }
@media (prefers-reduced-motion: reduce) { .btn:active { transform: none; } }
.preview-toggle:active { transform: translateX(-50%) scale(.97); }
@media (prefers-reduced-motion: reduce) { .preview-toggle:active { transform: translateX(-50%); } }
.undo-toast { position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:14px;max-width:calc(100vw - 32px);padding:8px 8px 8px 16px;border-radius:12px;background:var(--ink);color:#fff;font-size:14px;box-shadow:0 10px 30px rgba(0,0,0,.25); }
.undo-toast span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0; }
.undo-toast .btn { background:#b9f360;border-color:#b9f360;color:#151714;flex:none; }
@media (max-width:980px) { .undo-toast { bottom:84px; } }
.li-tools button.is-on { color:var(--ink);background:#e9ecdf; }
.cover-row { display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px; }
.cover-row img { width:160px;height:80px;object-fit:cover;border-radius:8px;border:1px solid var(--line); }
.studio-swatch span { background:linear-gradient(135deg, var(--swatch) 0 52%, var(--swatch-btn, var(--swatch)) 52% 100%); }
.studio-swatch[aria-pressed=true] span::after { content:'';inset:auto;width:8px;height:8px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);background:var(--swatch-ink);box-shadow:0 0 0 2px var(--swatch); }
.li-meta { flex-wrap:wrap; }
.trend { display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums; }
.trend b { font-weight:600;color:var(--ink); }
.trend b.up { color:#1d6b45; }
.trend b.down { color:var(--bad); }
.spark { display:block;flex:none; }
.spark polyline { fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--ink); }
.photo-row { display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0 4px; }
.photo-row img { width:54px;height:96px;object-fit:cover;border-radius:8px;border:1px solid var(--line); }

.templates { border-color:#d9ddce; }
.template-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(124px,1fr));gap:10px; }
.template { font:inherit;text-align:left;display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;transition:border-color .16s cubic-bezier(.23,1,.32,1),transform .16s cubic-bezier(.23,1,.32,1); }
@media (hover:hover) and (pointer:fine) { .template:hover { border-color:var(--ink); } }
.template:active { transform:scale(.98); }
.template:disabled { opacity:.6;cursor:progress; }
.template b { font-size:15px; }
.template-sw { height:54px;border-radius:8px;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:0 14px;border:1px solid rgba(0,0,0,.08); }
.template-sw i { display:block;height:9px;border-radius:4px; }
@media (prefers-reduced-motion: reduce) { .template:active { transform:none; } }
.auth-forgot { margin:14px 0 0;text-align:center;font-size:14px; }
.form-ok { background:#ecf6ef;color:#14532d;padding:10px 14px;border-radius:10px;font-size:14px;margin:0 0 14px; }

.an-actions { display:flex;align-items:center;gap:8px;flex-wrap:wrap; }

.audiences { margin-top:28px;padding-top:22px;border-top:1px solid var(--line); }
.aud-head { display:flex;justify-content:space-between;gap:20px;align-items:flex-start; }
.aud-head h3 { margin:0 0 6px; }
.aud-head p { margin:0;max-width:62ch; }
.aud-list { list-style:none;margin:18px 0 8px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px; }
.aud-list > li { border:1px solid var(--line);border-radius:12px;padding:14px; }
.aud-name { display:flex;flex-direction:column;gap:2px;margin-bottom:10px; }
.aud-top { margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:14px; }
.aud-top li span { overflow-wrap:anywhere; }
.aud-top li { display:list-item; }
.aud-top li b { float:right;font-variant-numeric:tabular-nums;margin-left:8px; }

.li-pay { display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:8px;margin:6px 0 2px; }
.li-pay label, .li-body > label.small { font-weight:600;margin:6px 0 0; }
.pro-badge { display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:#b9f360;color:#151714!important;font-size:11px;font-weight:700;letter-spacing:.02em;text-decoration:none;vertical-align:middle; }
.toggle-row.is-locked { opacity:.75;cursor:default; }
.pro-card .pro-perks { margin:4px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:14px; }
.pro-card.is-pro { border-color:#b9f360; }
.ok-text { color:var(--ok); }
.sub-list li > b { font-variant-numeric:tabular-nums; }
/* Pricing page */
.pro-buy { display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end; }
.studio-fine a { color:inherit; }
.studio-nav nav a[aria-current=page] { text-decoration:underline;text-underline-offset:5px; }
.pricing-head { max-width:880px;margin:0 auto;padding:72px 24px 36px;text-align:center; }
.pricing-head h1 { font-size:clamp(44px,6vw,78px);letter-spacing:-.06em;line-height:.98;font-weight:700;margin:0 0 20px; }
.pricing-head .studio-lede { margin:0 auto;max-width:44ch; }
.pricing-note { display:table;margin:22px auto 0;padding:10px 14px;border-radius:8px;background:#fff7d6;border:1px solid #eadb9c;font-size:13px; }
.billing-toggle { display:inline-flex;margin-top:30px;padding:4px;border-radius:999px;background:#fff;border:1px solid var(--line); }
.billing-toggle button { min-height:40px;padding:0 18px;border:0;border-radius:999px;background:none;color:var(--ink);font:600 13px Archivo,system-ui,sans-serif;cursor:pointer; }
.billing-toggle button[aria-pressed=true] { background:var(--ink);color:#fff; }
.billing-toggle button span { font-weight:500;font-size:11px;color:var(--clay); }
.billing-toggle button[aria-pressed=true] span { color:#b9f360; }
.plans { max-width:920px;margin:0 auto;padding:12px 24px 56px;display:grid;grid-template-columns:1fr 1fr;gap:20px; }
.plan { background:#fff;border:1px solid var(--line);border-radius:12px;padding:30px; }
.plan-pro { border:2px solid #151714;box-shadow:0 14px 40px #202b2418; }
.plan h2 { font-size:22px;margin:0;display:flex;align-items:center;gap:6px;letter-spacing:-.02em; }
.plan-price { margin:18px 0 4px;display:flex;align-items:baseline;gap:8px; }
.plan-price b { font-size:46px;letter-spacing:-.05em;line-height:1; }
.plan-price span,.plan-sub { color:var(--muted);font-size:13px; }
.plan-sub { margin:0 0 22px; }
.plan ul { list-style:none;padding:0;margin:24px 0 0;display:flex;flex-direction:column;gap:12px;font-size:14px; }
.plan li { display:grid;grid-template-columns:18px 1fr;gap:10px;align-items:start;line-height:1.45; }
.plan li svg { width:18px;height:18px;color:var(--clay);margin-top:1px; }
.calc { max-width:872px;margin:0 auto 70px;padding:34px;border-radius:12px;background:#d8e0d1;display:grid;grid-template-columns:1.1fr 1fr;gap:34px;align-items:center; }
.calc h2 { margin:0 0 10px;font-size:28px;letter-spacing:-.03em; }
.calc .muted { font-size:13px;line-height:1.6;margin:0 0 20px;color:#354337; }
.calc-input { display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:600; }
.calc-field { display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #b9c4b2;border-radius:8px;padding:0 14px;min-height:52px;font-size:22px;font-weight:700; }
.calc-field:focus-within { outline:2px solid var(--focus);outline-offset:2px; }
.calc .calc-field input { border:0 !important;box-shadow:none !important;background:none !important;margin:0 !important;padding:0 !important;font:inherit;font-size:22px !important;font-weight:700 !important;width:100%;min-width:0;min-height:48px;color:var(--ink);outline:none; }
.pricing .studio-faq { max-width:872px;gap:48px; }
.billing-toggle { display:flex;width:max-content;margin-left:auto;margin-right:auto; }
.calc-out { margin:0;display:grid;grid-template-columns:1fr 1fr;gap:12px; }
.calc-out > div { background:#fff;border-radius:10px;padding:18px; }
.calc-out dt { font-size:12px;color:var(--muted);margin-bottom:6px; }
.calc-out dd { margin:0;font-size:28px;font-weight:700;letter-spacing:-.04em; }
.calc-verdict { margin:14px 0 0;font-size:15px;font-weight:600;min-height:1.4em; }
@media (max-width:760px) { .plans,.calc { grid-template-columns:1fr; }.pricing-head { padding-top:44px; }.calc { margin:0 20px 56px;padding:24px; }.plan { padding:24px; } }
@media (max-width:480px) { .plans { padding:8px 16px 40px; }.calc { margin:0 16px 48px; }.calc-out dd { font-size:22px; }.billing-toggle button { padding:0 12px; } }
.li-pay-opts { grid-template-columns:minmax(0,1fr) 150px;align-items:end; }
.li-check { display:flex!important;align-items:center;gap:8px;min-height:44px;flex-wrap:wrap; }
.li-check input { width:18px;height:18px;margin:0; }
@media (max-width:480px) { .li-pay-opts { grid-template-columns:1fr; } }
/* Inbox */
.msg-list { list-style:none;margin:0;padding:0;display:flex;flex-direction:column; }
.msg-list li { padding:14px 0;border-top:1px solid var(--line); }
.msg-list li:first-child { border-top:0; }
.msg-list li.is-new .msg-head b::before { content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--clay);margin-right:8px;vertical-align:middle; }
.msg-head { display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline; }
.msg-body { margin:6px 0 10px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.55; }
.msg-actions { display:flex;gap:8px; }
.li-count-opts { grid-template-columns:1fr 1fr; }
@media (max-width:480px) { .li-count-opts { grid-template-columns:1fr; } }
/* FAQ editor rows */
.faq-rows { list-style:none;margin:8px 0;padding:0;display:flex;flex-direction:column;gap:10px; }
.faq-row { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;padding:10px;border:1px dashed var(--line);border-radius:10px; }
.faq-row label { grid-column:1;margin:0; }
.faq-row .icon-btn { grid-column:2;grid-row:1;align-self:start; }
/* Gallery editor */
.gal-grid { list-style:none;margin:8px 0;padding:0;display:flex;flex-direction:column;gap:8px; }
.gal-item { display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px;border:1px dashed var(--line);border-radius:10px; }
.gal-item img { width:72px;height:90px;object-fit:cover;border-radius:6px;background:var(--line); }
.gal-item label { margin:0; }
.gal-add { margin:4px 0 2px; }
/* Analytics: forms and sales */
.block-stats { list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column; }
.block-stats li { display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0;border-top:1px solid var(--line);font-size:14px; }
.block-stats li:first-child { border-top:0; }
.bs-name { display:flex;flex-direction:column;min-width:0;overflow-wrap:anywhere; }
.bs-name small { font-size:12px; }
.block-stats b { white-space:nowrap;font-size:13px; }
/* Events editor rows */
.ev-rows { list-style:none;margin:8px 0;padding:0;display:flex;flex-direction:column;gap:10px; }
.ev-row { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:10px;border:1px dashed var(--line);border-radius:10px; }
.ev-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px; }
.ev-grid label { margin:0; }
.ev-wide { grid-column:1/-1; }
.ev-row .icon-btn { align-self:start; }
@media (min-width:1100px) { .ev-grid { grid-template-columns:150px 110px minmax(0,1fr) minmax(0,1fr); }.ev-wide { grid-column:1/4; } }