/* One vocabulary for feedback in pages, forms, overlays and sign-in. */
body.wf-studio,body.studio-auth { --feedback-error:#a33d55; --feedback-error-bg:#fff4f6; --feedback-error-border:#efcdd5; --feedback-warning:#725b98; --feedback-warning-bg:#f6f2fc; --feedback-warning-border:#dfd3ed; --feedback-success:#327367; --feedback-success-bg:#edf8f4; --feedback-success-border:#c8e3d9; }
:is(.wf-studio,.studio-auth) :is(.flash,.form-error-summary,.auth-alert,.wf-client-summary) { padding:12px 14px; border:1px solid var(--feedback-error-border); border-inline-start:3px solid var(--feedback-error); border-radius:10px; background:var(--feedback-error-bg); color:var(--feedback-error); font-family:inherit; font-size:13px; line-height:1.6; box-shadow:none; overflow-wrap:anywhere; }
:is(.wf-studio,.studio-auth) :is(.flash,.auth-alert) { display:flex; align-items:flex-start; gap:10px; }
:is(.wf-studio,.studio-auth) :is(.flash,.form-error-summary,.auth-alert)>svg { width:18px; height:18px; flex:none; margin-top:2px; vertical-align:middle; }
:is(.wf-studio,.studio-auth) :is(.flash,.form-error-summary)>:is(div,p,ul) { min-width:0; }
:is(.wf-studio,.studio-auth) :is(.flash,.form-error-summary) :is(p,ul) { margin:4px 0 0; }
:is(.wf-studio,.studio-auth) :is(.flash,.form-error-summary) ul { padding-left:18px; }
:is(.wf-studio,.studio-auth) :is(.flash,.form-error-summary) strong { font-weight:650; }
:is(.wf-studio,.studio-auth) .flash-success { background:var(--feedback-success-bg); border-color:var(--feedback-success-border); border-inline-start-color:var(--feedback-success); color:var(--feedback-success); }
.wf-business.wf-studio :is(.accounting-notice,.expense-balance-notice,.studio-reconciliation-warning,.studio-report-warning,.studio-balance-warning,.team-warning,.wf-live-error) { padding:12px 14px; border:1px solid var(--feedback-warning-border); border-inline-start:3px solid var(--feedback-warning); border-radius:10px; background:var(--feedback-warning-bg); color:var(--feedback-warning); font-size:13px; line-height:1.6; }
:is(.wf-studio,.studio-auth) .field-error { margin:6px 0 0; color:var(--feedback-error); font-size:12px; line-height:1.5; font-weight:500; }
:is(.wf-studio,.studio-auth) :is(input,select,textarea).is-invalid,:is(.wf-studio,.studio-auth) [aria-invalid=true],.wf-studio .field:has([data-client-invalid]) .studio-select-trigger { border-color:#cc94a4!important; background-color:#fff!important; box-shadow:0 0 0 2px #a33d5507!important; }
:is(.wf-studio,.studio-auth) .wf-client-summary { display:grid; grid-template-columns:32px minmax(0,1fr); gap:3px 10px; margin:12px 0; padding:12px 14px; border:1px solid #eadde3; background:#fcf8fa; color:#5e4655; }
.wf-client-summary::before { content:'!' / ''; grid-row:1/3; display:grid; place-items:center; align-self:center; width:30px; height:30px; border-radius:10px; background:#f4e7ee; color:#a3677b; font-size:17px; font-weight:650; }
:is(.wf-studio,.studio-auth) .wf-client-summary>strong { grid-column:2; font-size:13px; }
:is(.wf-studio,.studio-auth) .wf-client-summary ul { display:flex; flex-wrap:wrap; gap:4px 14px; grid-column:2; list-style:none; padding:0; margin:0; }
:is(.wf-studio,.studio-auth) .wf-client-summary a { color:#926778; font-size:12px; text-decoration:none; border-bottom:1px dashed #d5b6c2; }
.wf-client-summary a:hover { color:#72465b; border-bottom-style:solid; }
:is(.wf-studio,.studio-auth) .wf-submit-status { padding:10px 12px; margin:12px 0; border:1px solid #ddd4ed; border-radius:10px; background:#f6f2fc; color:#685584; font-size:12px; line-height:1.6; }
:is(.wf-studio,.studio-auth) .wf-action-confirm { position:fixed; inset:0; margin:auto; width:min(460px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:24px; border:1px solid #e0d9eb; border-radius:18px; background:linear-gradient(145deg,#fcfaff,#fff 55%); color:#332c43; font:inherit; overflow:auto; box-shadow:0 24px 80px #30203d38; }
.wf-action-confirm::backdrop { background:#30263e65; backdrop-filter:blur(4px); }
:is(.wf-studio,.studio-auth) .wf-action-confirm h2 { margin:0; font-size:20px; font-weight:700; line-height:1.35; letter-spacing:-.3px; }
.wf-action-confirm h2::before { content:'?' / ''; display:grid; place-items:center; width:36px; height:36px; margin-bottom:16px; border:1px solid #e1d7f1; border-radius:11px; background:#f0e9fb; color:#8161b7; font-size:19px; font-weight:600; }
.wf-action-confirm[data-tone=danger] h2::before { content:'!'; color:var(--feedback-error); background:var(--feedback-error-bg); border-color:var(--feedback-error-border); }
:is(.wf-studio,.studio-auth) .wf-action-confirm p { margin:12px 0 20px; color:#746a83; font-size:13px; line-height:1.65; }
:is(.wf-studio,.studio-auth) .wf-action-confirm .form-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; margin:0; padding:16px 0 0; border-top:1px solid #e8e1f0; }
.wf-action-confirm .btn { min-height:40px; font:inherit; font-size:13px; }
html:has(.wf-action-confirm[open]) { overflow:hidden; }
html:has(.wf-action-confirm[open]) :is(.studio-record-dialog,.studio-settlement-dialog)::backdrop { background:transparent; backdrop-filter:none; }
.studio-auth:has(.studio-auth-error-code) { background:radial-gradient(ellipse at 80% 10%,#e6dcf6,transparent 55%),linear-gradient(145deg,#f5f2fb,#efeff7)!important; }
.studio-auth:has(.studio-auth-error-code) .auth-card-wrap { max-width:580px!important; }
.studio-auth:has(.studio-auth-error-code) .auth-shell:not(.has-marketing) .auth-card-wrap { padding:0!important; background:transparent; border:0; box-shadow:none; }
.studio-auth .auth-card:has(.studio-auth-error-code) { padding:28px!important; border:1px solid #e1d8ed!important; border-radius:18px!important; background:#ffffffeb!important; box-shadow:0 16px 48px #4932610d!important; }
.studio-auth:has(.studio-auth-error-code) .studio-auth-brand { margin-bottom:24px; font-size:20px; }
.studio-auth .studio-auth-error-code { display:inline-flex; padding:5px 10px; margin-bottom:18px; border:1px solid #ddd0ee; border-radius:8px; background:#f0eafa; color:#8060ae; font-size:12px; letter-spacing:1px; }
.studio-auth .auth-card:has(.studio-auth-error-code) h1 { font-size:26px!important; letter-spacing:-.6px; }
.studio-auth .auth-card:has(.studio-auth-error-code) .btn { white-space:normal; text-align:center; }
.studio-auth .auth-card:has(.studio-auth-error-code) .btn-primary { border-color:#7560ce; background:linear-gradient(125deg,#8067df,#6951c9)!important; box-shadow:0 3px 9px #7654bb18!important; }
@media(max-width:520px) { :is(.wf-studio,.studio-auth) .wf-action-confirm { padding:20px; } .wf-action-confirm .form-actions .btn { flex:1 1 100%; min-height:44px; white-space:normal; } .studio-auth .auth-card:has(.studio-auth-error-code) { padding:22px!important; } }
@media(prefers-reduced-motion:no-preference) { .wf-action-confirm[open] { animation:feedback-appear .16s ease-out; } @keyframes feedback-appear { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } } }

/* Status pages use the open space and lavender depth of the sign-in screen. */
.studio-auth:has(.studio-status-stage) { display:block; margin:0; background:#f6f3fb!important; }
.studio-status-stage *,.studio-status-stage *::before,.studio-status-stage *::after { box-sizing:border-box; }
.studio-status-stage { box-sizing:border-box; min-height:100dvh; display:grid; grid-template-rows:auto 1fr auto; padding:32px 44px 24px; position:relative; overflow:hidden; isolation:isolate; background:radial-gradient(ellipse at 92% 2%,#dcd0f48a,transparent 55%),radial-gradient(ellipse at 4% 100%,#d8eae76b,transparent 48%),linear-gradient(135deg,#f8f6fc,#f0ecf8); }
.studio-status-stage::before { content:''; position:absolute; width:800px; height:800px; border:1px solid #daceee5c; border-radius:50%; right:-300px; top:-290px; z-index:-1; }
.studio-status-stage::after { content:''; position:absolute; width:540px; height:540px; border:1px solid #daceee50; border-radius:50%; left:-360px; bottom:-240px; z-index:-1; }
.studio-status-brand { display:inline-flex; align-items:center; gap:12px; text-decoration:none; color:#342c46; }
.studio-status-brand>span { display:grid; place-items:center; width:40px; height:43px; border:1px solid #b29af0; border-radius:12px; transform:rotate(-7deg); background:linear-gradient(145deg,#9b80f3,#795dd9); color:#fff; font-size:29px; font-weight:800; box-shadow:0 5px 12px #73529c20; }
.studio-status-brand strong { display:block; font-size:20px; font-weight:750; letter-spacing:-.5px; }
.studio-status-brand small { display:block; margin-top:2px; color:#81718f; font-size:11px; }
.studio-status-content { display:grid; grid-template-columns:360px minmax(0,450px); align-items:center; justify-content:center; gap:70px; width:100%; max-width:1000px; margin:30px auto 65px; }
.studio-status-copy { min-width:0; }
.studio-status-eyebrow { font-size:11px; font-weight:650; letter-spacing:1.4px; color:#9b85b8; text-transform:uppercase; }
.studio-status-copy h1 { color:#352c45; font-size:38px; line-height:1.18; letter-spacing:-1.3px; font-weight:750; margin:16px 0; }
.studio-status-copy p { color:#756783; font-size:14px; line-height:1.85; margin:0; max-width:390px; }
.studio-status-action { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:44px; padding:0 20px; margin-top:28px; border:1px solid #8f76dd; border-radius:11px; background:linear-gradient(125deg,#9477e5,#785bd0); box-shadow:0 5px 14px #8868be20,inset 0 1px 0 #ffffff26; color:#fff; font-size:13px; font-weight:650; text-decoration:none; transition:box-shadow .15s,transform .15s; }
.studio-status-action svg { width:17px; height:17px; }
.studio-status-action:hover { transform:translateY(-1px); box-shadow:0 7px 18px #8868be2e; }
.studio-status-action:focus-visible,.studio-status-brand:focus-visible { outline:3px solid #bda1f5; outline-offset:5px; }
.studio-status-visual { position:relative; height:320px; display:grid; place-items:center; }
.studio-status-orbit { position:absolute; width:310px; height:310px; border:1px solid #d7cae98c; border-radius:50%; background:radial-gradient(ellipse,#e6dcf7a8,transparent 67%); }
.studio-status-sheet { position:absolute; width:176px; height:212px; top:43px; left:111px; padding:25px; border:1px solid #ffffff; border-radius:20px; background:linear-gradient(150deg,#ffffffef,#f5effcbf); box-shadow:0 16px 36px #7656940d; transform:rotate(9deg); }
.studio-status-sheet.is-back { top:28px; left:64px; transform:rotate(-13deg); background:#eee6f8a6; border-color:#e5d9f2; }
.studio-status-sheet>span { display:block; width:65px; height:5px; margin-bottom:11px; border-radius:5px; background:#e4daef; }
.studio-status-sheet>span:nth-child(2) { width:90px; background:#eae1f3; }
.studio-status-sheet>span:nth-child(3) { width:46px; background:#eee7f5; }
.studio-status-visual>strong { position:relative; margin-top:45px; color:#9b81bd; font-size:132px; line-height:1; font-weight:750; letter-spacing:-9px; text-shadow:0 3px 0 #ffffffdc; }
.studio-status-search { position:absolute; right:22px; bottom:33px; display:grid; place-items:center; width:62px; height:62px; border:1px solid #ffffff; border-radius:20px; background:linear-gradient(135deg,#ffffff,#ede5f8); box-shadow:0 10px 25px #9276b320; transform:rotate(11deg); color:#a18bbd; }
.studio-status-search svg { width:29px; height:29px; }
.studio-status-spark { position:absolute; width:8px; height:8px; border-radius:3px; background:#beaad8; transform:rotate(24deg); }
.studio-status-spark.is-one { top:50px; right:34px; }.studio-status-spark.is-two { left:24px; bottom:56px; width:5px; height:5px; background:#a7c8c0; }
.studio-status-stage footer { color:#a99eb4; font-size:11px; }
@media(max-width:760px) {
 .studio-status-stage { padding:24px; }
 .studio-status-content { grid-template-columns:minmax(0,1fr); justify-items:center; align-content:center; text-align:center; gap:16px; margin:28px auto 42px; }
 .studio-status-visual { width:300px; height:245px; transform:scale(.85); margin:-15px 0; }
 .studio-status-orbit { width:255px; height:255px; }.studio-status-sheet { top:10px; left:87px; }.studio-status-sheet.is-back { top:0; left:39px; }
 .studio-status-visual>strong { margin-top:37px; font-size:118px; }.studio-status-search { right:5px; bottom:0; }
 .studio-status-copy h1 { font-size:29px; letter-spacing:-.8px; margin:13px 0; }
 .studio-status-copy p { font-size:13px; max-width:350px; margin-inline:auto; }
 .studio-status-action { margin-top:23px; }.studio-status-stage footer { text-align:center; }
}
@media(max-width:360px) { .studio-status-stage { padding:20px; }.studio-status-visual { width:270px; transform:scale(.8); margin:-22px 0; }.studio-status-copy h1 { font-size:27px; } }