@import url('/brand.css');
:root{--sv-brand:#BC2854;--sv-brand-hover:#992044;--sv-ink:#252331;--sv-muted:#625F6C;--sv-canvas:#F6F5F8;--sv-surface:#FFFFFF;--sv-soft:#FCEBF0;--sv-line:#D7CFD7;--sv-control:#8B8191;--sv-accent:#F9BCCC;--sv-error:#A12632;--sv-success:#236B4D;--sv-warning:#805414}
.guide-rename{margin:.45rem 0}.guide-rename>button{padding:.4rem .8rem;min-height:36px}.guide-rename form{max-width:32rem}.guide-rename .actions{flex-wrap:wrap}.template-intent-choice{margin:1rem 0;padding:1.25rem;border-left:4px solid var(--sv-ink);background:var(--sv-soft);display:flex;gap:1.25rem;align-items:center;justify-content:space-between}.template-intent-choice h2{font-size:1.2rem;margin:.25rem 0}.template-intent-choice p{margin:.35rem 0}.template-intent-choice .actions{flex-wrap:wrap}.answer-row{border-bottom:1px solid var(--sv-line);padding:.65rem 0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.65rem;align-items:end}.answer-controls{display:flex;gap:.35rem;align-items:center;padding-bottom:.75rem}.answer-controls button{min-width:42px;min-height:44px;padding:.45rem .6rem}.answer-row input{min-width:0;width:100%;box-sizing:border-box}.rule-sentence{padding:1rem;border-left:3px solid var(--sv-ink);background:var(--sv-soft);color:var(--sv-ink);overflow-wrap:anywhere}.rule-advanced{margin:1rem 0}.rule-advanced summary{cursor:pointer;min-height:36px}.rule-line{align-items:start;gap:.75rem}.rule-line .actions{flex-wrap:wrap}.creator-identity{font-weight:600;margin:.75rem 0}.creator-identity a{color:var(--sv-ink);text-underline-offset:.2em}.audit-example-promo{margin:3rem auto;padding:1.5rem;max-width:68rem;background:var(--sv-soft);color:var(--sv-ink);border-radius:12px}.audit-example-promo .actions{display:flex;flex-wrap:wrap;gap:1rem}.audit-example-promo a{color:inherit;text-underline-offset:.2em;font-weight:600}.example-body{margin:0;background:var(--sv-surface);color:var(--sv-ink);font-family:var(--sv-font);line-height:1.6}.example-body *{box-sizing:border-box}.example-top{max-width:72rem;margin:auto;padding:1.25rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}.example-top a,.example-body a{color:inherit}.example-main{max-width:48rem;margin:1rem auto 4rem;padding:0 1.25rem}.example-main h1{font-family:var(--sv-font);font-weight:500;font-size:clamp(2rem,5vw,3.5rem);line-height:1.12}.example-main fieldset{border:0;border-top:1px solid var(--sv-line);padding:1.5rem 0;margin:0}.example-main legend{font-weight:700;padding:.5rem 0}.example-main .choice{display:flex;gap:.8rem;align-items:center;background:white;border:1px solid var(--sv-line);margin:.5rem 0;padding:1rem;border-radius:8px;cursor:pointer}.example-main input{accent-color:var(--sv-ink)}.example-main button,.example-main .cta{display:inline-block;border:0;border-radius:8px;background:var(--sv-ink);color:var(--sv-surface);padding:1rem 1.25rem;font:inherit;cursor:pointer}.example-main .result{background:var(--sv-soft);padding:1.5rem;margin:1.5rem 0;border-radius:12px}.example-main .template-list{display:flex;flex-wrap:wrap;gap:1rem;padding:0;list-style:none}.example-main .template-list a[aria-current]{font-weight:700;text-decoration-thickness:3px}.example-main a:focus-visible,.example-main button:focus-visible,.answer-row button:focus-visible{outline:3px solid var(--sv-ink);outline-offset:4px}.example-note{font-size:.92rem;color:var(--sv-muted)}.example-main select{max-width:100%}@media(max-width:600px){.template-intent-choice{display:block}.answer-row{grid-template-columns:minmax(0,1fr)}.answer-controls{justify-content:flex-end}.rule-line{display:block}.audit-example-promo{margin:2rem .75rem;padding:1.1rem}.example-top{flex-wrap:wrap}.template-intent-choice .actions{margin-top:1rem}}@media(prefers-reduced-motion:reduce){.example-body *{scroll-behavior:auto}}

html[data-signup-access="locked"] .template-intent-choice,html[data-signup-access="pending"] .template-intent-choice{display:none!important}

.template-picker .template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:430px){.template-picker .template-grid{grid-template-columns:minmax(0,1fr)}}

/* Shared with the unchanged homepage background definition in brand.css. */
html.experience-studio body,html.experience-studio body.hub-studio,html.experience-studio body.trial-entry-anonymous{--ink:var(--selvup-ink);--muted:var(--selvup-muted);--line:var(--selvup-line);background:var(--selvup-page-background);color:var(--selvup-ink);font-family:var(--selvup-sans)}
html.experience-studio.trial-entry-anonymous #account-workspace{background:transparent;border-color:transparent;box-shadow:none}
html.experience-studio #signup-flow,html.experience-studio #login-panel.trial-auth{background:var(--selvup-auth-surface);border-color:var(--selvup-line);box-shadow:0 12px 36px color-mix(in srgb, var(--sv-ink) 3.14%, transparent)}
html.experience-studio #login-panel .account-grid>section{background:transparent;border-color:var(--selvup-line)}
html.experience-studio #signup-flow h2,html.experience-studio .account-top h1,html.experience-studio .account-top h2{color:var(--selvup-ink)}
html.experience-studio .signup-promise,html.experience-studio #signup-flow .signup-step{color:var(--selvup-muted)}
.example-body{background:var(--selvup-page-background);font-family:var(--selvup-sans)}

/* Template cards: columns follow their available width, not only the viewport. */
body.marketing .template-grid,
body.marketing .template-grid:has(> article:nth-child(2):last-child) {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
}
body.marketing .template-grid > *,
.template-picker .template-grid > * {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
body.marketing .template-card > *,
.template-picker .template-grid strong {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

/* Native owner-only guide deletion: sibling actions, never nested buttons. */
.guide-entry{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem;align-items:stretch;min-width:0}
.guide-entry .guide-item{width:100%;min-width:0;margin:0;overflow-wrap:anywhere}
.guide-entry .guide-delete{min-height:44px;align-self:center;white-space:normal}
@media(max-width:430px){.guide-entry{grid-template-columns:minmax(0,1fr)}.guide-entry .guide-delete{justify-self:start}}
/* Keep every guide action in the page flow instead of a clipped 180px list. */
.guide-list:has(>.guide-entry){height:auto;max-height:none;overflow:visible}

/* Idle lock hides the working surface without clearing its unsaved forms. */
body.session-idle-locked > :not(#session-idle-dialog){visibility:hidden!important}
#session-idle-dialog{visibility:visible!important;box-sizing:border-box;width:min(100% - 24px,480px);max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #d9d1d5;border-radius:18px;padding:24px;background:#fff;color:#2a2530;box-shadow:0 16px 60px #26182324}
#session-idle-dialog::backdrop{background:#f8f5f7}
#session-idle-dialog h2{font-size:clamp(22px,4vw,28px);line-height:1.2;margin:0 0 16px}
#session-idle-dialog p{font-size:16px;line-height:1.5;overflow-wrap:anywhere}
#session-idle-login{display:grid;gap:16px}
#session-idle-login label{display:grid;gap:8px}
#session-idle-login input{box-sizing:border-box;width:100%;min-width:0;padding:12px;min-height:44px;border:1px solid #8f858e;border-radius:8px;background:#fff;color:#2a2530;font:inherit}
#session-idle-login button{min-height:44px;padding:12px 20px}
#session-idle-login :focus-visible{outline:3px solid #8a1746;outline-offset:3px}
