@import url('./begin-study.css');
.quick{--bg:#f6f1e6;--ink:#324f43;--muted:#7c8271;--accent:#8b9a72;--solid:#324f43;--on:#fffdf4;--paper:#fffdf6;--wash:#e8ecdf;--line:#dbe0cf;--customer:#e6ebdc;--stage:transparent;--head:transparent;--head-ink:var(--ink)}
.quick .welcome-main{gap:15px;padding-top:10px}.quick .copy h1{font-size:40px}.quick .copy .eyebrow{font-size:7px;letter-spacing:1.2px;margin-bottom:9px}.quick .lead{font-size:12px;line-height:1.55;margin-top:11px}.quick .join>p{font-size:10px;color:var(--muted);margin-bottom:9px}.quick .scene{max-width:370px}.conversation{background:var(--stage);border-radius:19px}.storefront{display:flex;align-items:center;gap:10px;padding:12px 13px;background:var(--head);color:var(--head-ink);border-bottom:1px solid var(--line);position:relative}.store-avatar{width:33px;height:35px;border-radius:10px;display:grid;place-items:center;background:var(--wash);color:var(--ink);font:20px Georgia,serif;flex-shrink:0}.store-name{flex:1;min-width:0}.store-name strong{font-size:14px;font-weight:550;letter-spacing:-.3px;display:block}.store-name small{display:block;font-size:8px;line-height:1.4;margin-top:3px;opacity:.68}.store-link{opacity:.65;display:flex}.store-link svg{width:16px;height:16px}.canopy{display:none}.thread{display:flex;flex-direction:column;gap:8px;padding:11px 12px 12px}.bubble{padding:8px 11px;border-radius:12px 12px 3px 12px;background:var(--customer);color:var(--ink);align-self:flex-end;max-width:90%;font-size:10px;line-height:1.45}.bubble small{display:block;font-size:6px;letter-spacing:.8px;opacity:.6;margin-bottom:4px}.owner-intro{display:flex;gap:7px;align-items:center}.owner-dot{width:20px;height:22px;border-radius:7px;background:var(--solid);color:var(--on);display:grid;place-items:center;font:12px Georgia,serif;flex-shrink:0}.owner-intro p{font-size:10px;line-height:1.4;margin:0;max-width:260px}.service-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.service-options button{border:1px solid var(--line);border-radius:10px;padding:8px 7px;background:var(--paper);color:var(--ink);text-align:left;position:relative;min-height:65px;transition:background .15s,border-color .15s}.service-options button[aria-pressed=true]{border-color:var(--accent);background:var(--wash)}.service-symbol{display:block;font-size:18px;line-height:1;margin-bottom:7px;color:var(--accent)}.service-copy strong{font-size:9px;font-weight:600;display:block;line-height:1.3}.service-copy small{display:block;font-size:7px;line-height:1.3;opacity:.62;margin-top:3px}.service-check{position:absolute;right:7px;top:7px;font-size:10px;color:var(--accent)}.choice{font-size:10px;padding:7px 11px}.resolution{min-height:53px}.offer{display:grid;grid-template-columns:20px 1fr auto;gap:7px;align-items:center;min-height:53px}.offer p{font-size:9px;line-height:1.4;margin:0}.offer button{display:flex;align-items:center;gap:5px;min-height:42px;border:0;border-radius:10px;padding:7px 9px;background:var(--solid);color:var(--on);font-size:8px;white-space:nowrap}.offer button svg{width:12px;height:12px}.confirmation{display:flex;gap:9px;align-items:center;min-height:53px;padding:8px 10px;border-radius:11px;background:var(--wash);color:var(--ink)}.confirmation>span{height:23px;width:23px;display:grid;place-items:center;border-radius:50%;background:var(--solid);color:var(--on);font-size:12px;flex-shrink:0}.confirmation strong{display:block;font-size:10px;font-weight:550}.confirmation small{display:block;font-size:8px;opacity:.7;margin-top:4px}.confirmation button{margin-left:auto;background:none;color:var(--ink);border:0;min-width:32px;min-height:36px;font-size:19px}.scene-caption{font-size:8px;text-align:center;color:var(--muted);margin-top:8px}.quick .scene>div{animation:none}.quick .provider{min-height:45px;padding:10px 16px;font-size:12px}.quick .study-nav{min-height:48px;margin-top:0}.quick .top{height:57px}
/* 01: an arched storefront opening directly into a conversation. */
.q1{--head:#f0e6d1;--stage:#fffaf1;--customer:#e8ecde;--accent:#899a6d}.q1 h1{font-family:Georgia,serif;font-weight:400}.q1 .conversation{border:1px solid #dddcc9;border-radius:30px 30px 15px 15px;overflow:hidden}.q1 .storefront{padding-top:16px}.q1 .service-options{margin-left:27px}.q1 .service-options button{border-radius:15px 15px 7px 7px}
/* 02: the warm night studio, now showing the actual exchange. */
.q2{--bg:#19232e;--ink:#f0e8da;--muted:#a0aab0;--accent:#d4b07c;--solid:#e6c18b;--on:#26303b;--paper:#293646;--wash:#3a4654;--line:#ffffff16;--customer:#324151;--stage:#202d3a;--head:#263544}.q2 .conversation{border:1px solid #ffffff12;overflow:hidden;box-shadow:0 12px 30px #10192330}.q2 .store-avatar{background:#d4b07c;color:#26303b}.q2 .service-options button[aria-pressed=true]{background:#3c4145;border-color:#d4b07c}.q2 .service-symbol{font-family:Georgia,serif}.q2 .confirmation{background:#334138}.q2 .storefront{padding:14px}
/* 03: an airy messenger with one integrated services strip. */
.q3{--bg:#eef3e9;--accent:#789368;--solid:#315a46;--customer:#e1e9d9;--stage:#fcfdf8;--line:#dce5d3}.q3 .conversation{border:1px solid var(--line)}.q3 .storefront{border-radius:19px 19px 0 0}.q3 .service-options{gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}.q3 .service-options button{border:0;border-radius:0;border-right:1px solid var(--line);padding:10px 8px}.q3 .service-options button:last-child{border-right:0}.q3 .service-options button[aria-pressed=true]{box-shadow:inset 0 -2px var(--accent)}.q3 .service-symbol{display:none}.q3 .service-check{position:static;display:block;margin-top:5px}.q3 .service-copy strong{font-size:10px}
/* 04: a small menu nested in a personal conversation. */
.q4{--bg:#faf2e8;--ink:#3d5245;--accent:#a58a68;--solid:#3d5848;--muted:#8b8577;--wash:#eee6d7;--line:#e4ddce;--stage:#fffaf3;--head:#f1e7d6}.q4 h1{font-family:Georgia,serif;font-weight:400}.q4 .conversation{border:1px solid var(--line);overflow:hidden}.q4 .service-options{grid-template-columns:1fr;gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-left:27px}.q4 .service-options button{min-height:39px;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:6px 29px 6px 9px;display:flex;align-items:center;gap:9px;background:transparent}.q4 .service-options button:last-child{border-bottom:0}.q4 .service-symbol{font-size:16px;margin:0}.q4 .service-copy{display:flex;align-items:center;gap:9px;flex:1}.q4 .service-copy small{margin:0;font-size:7px}.q4 .service-check{top:12px}.q4 .thread{gap:7px}.q4 .service-options button[aria-pressed=true]{background:#eee7d9}
/* 05: expressive but contained; rounded offerings from the owner. */
.q5{--bg:#f0e7ee;--ink:#5d3e57;--muted:#947d90;--accent:#a77896;--solid:#68465f;--on:#fff4e8;--wash:#eadbe5;--line:#e0d0dc;--customer:#fff9f0;--paper:#f9f3f6;--head:#68465f;--head-ink:#fff4e8}.q5 .conversation{background:transparent}.q5 .storefront{border-radius:17px;margin:0 10px;border:0}.q5 .store-avatar{background:#e7d4e1;color:#68465f}.q5 .thread{padding:12px 0 0}.q5 .service-options{margin:0 23px 0 27px}.q5 .service-options button{border-radius:17px}.q5 .service-copy small{display:none}.q5 .choice{margin-right:6px}.q5 .offer{padding-left:2px}.q5 h1 em{color:#9c698b}
/* 06: a schedule note alongside the service choices. */
.q6{--bg:#eaf0f1;--ink:#344f57;--accent:#7b9697;--solid:#355762;--muted:#7d9093;--wash:#dde8e7;--line:#d3dfe0;--paper:#f9fcfa;--customer:#e1e9e8;--stage:#f8fbf8}.q6 .conversation{border-radius:7px;border-left:4px solid #7b9697;box-shadow:5px 5px 0 #dce6e5}.q6 .storefront{padding-top:14px}.q6 .service-symbol{display:none}.q6 .service-options button{min-height:58px;padding-top:20px;border-radius:5px}.q6 .service-options{gap:7px}.q6 .offer{background:#e7eeee;border-radius:6px;padding:7px;grid-template-columns:1fr auto}.q6 .offer .owner-dot{display:none}.q6 .confirmation{border-radius:6px}.q6 .customer{border-radius:12px 12px 2px 12px}
/* 07: the offerings feel like a reply, rather than a separate page. */
.q7{--bg:#f8e9e7;--ink:#623f47;--accent:#a5787a;--solid:#6c4952;--muted:#9c8384;--wash:#efdfdc;--line:#e6d4d2;--paper:#fff9f2;--customer:#f2dcd9;--stage:#fffbf6}.q7 .conversation{border:1px solid #e5d8cf;border-radius:23px}.q7 .storefront{border:0;padding-bottom:5px}.q7 .service-options{margin-left:27px;background:#f3ebe5;padding:7px;border-radius:3px 15px 15px 15px;gap:5px}.q7 .service-options button{border-radius:8px;min-height:67px;padding:7px 5px}.q7 .service-copy strong{font-size:8px}.q7 .service-copy small{font-size:6px}.q7 .service-symbol{font-size:16px}.q7 .service-check{right:5px;top:5px}.q7 .choice{margin-right:4px}
/* 08: a storefront sign, with the conversation right beneath it. */
.q8{--bg:#faf0e2;--ink:#5c4a37;--accent:#b27d59;--solid:#79513e;--muted:#97836c;--wash:#f0e1cd;--line:#e6d6bf;--paper:#fffaf2;--customer:#eee4d4;--stage:#fff9ef;--head:#e9c9a9}.q8 .conversation{border:1px solid #dec7ad;border-radius:13px;overflow:hidden}.q8 .storefront{padding-top:28px}.q8 .canopy{display:block;position:absolute;top:0;left:0;right:0;height:14px;background:repeating-linear-gradient(90deg,#79513e 0 20px,#f4ddbc 20px 40px)}.q8 .store-name strong{font-family:Georgia,serif;font-size:16px}.q8 .service-options button{border-radius:7px}.q8 .service-symbol{color:#ae7952}.q8 .store-avatar{background:#f5e3cb;color:#79513e}
/* 09: a working studio; neat rows and a clear next step. */
.q9{--bg:#f1f1e3;--ink:#4c5940;--muted:#8a9079;--accent:#929c69;--solid:#536144;--wash:#e4e8d2;--line:#dce0ca;--paper:#fbfcf2;--customer:#e7ead9;--stage:#fafbf2}.q9 .conversation{border:1px solid var(--line);border-radius:10px}.q9 .storefront{border-bottom:1px dashed #c9d0b5}.q9 .store-avatar{border-radius:5px}.q9 .service-options{grid-template-columns:1fr;gap:4px;margin:0 0 0 27px}.q9 .service-options button{min-height:36px;display:flex;align-items:center;gap:8px;padding:6px 27px 6px 10px;border-radius:5px}.q9 .service-symbol{font-size:14px;margin:0}.q9 .service-copy{display:flex;align-items:center;gap:10px}.q9 .service-copy small{margin:0}.q9 .service-check{top:10px}.q9 .thread{gap:6px}.q9 .offer button{border-radius:5px}
/* 10: a warm invitation in the owner's space. */
.q10{--bg:#352f38;--ink:#f3e7d9;--muted:#baa8b1;--accent:#d7ab91;--solid:#d9b297;--on:#463640;--wash:#594a53;--line:#ffffff16;--paper:#443942;--customer:#594750;--stage:#3e343d;--head:#e1bfa4;--head-ink:#4e3841}.q10 h1{font-family:Georgia,serif;font-weight:400}.q10 .conversation{border:1px solid #d4ab8e35;border-radius:22px;overflow:hidden}.q10 .storefront{padding:14px 15px}.q10 .store-avatar{color:#4e3841;background:#f3d8be}.q10 .service-options button{border-style:dashed;border-radius:9px}.q10 .service-options button[aria-pressed=true]{border-style:solid;background:#604c54}.q10 .confirmation{background:#594a53}.round-three .collection-wrap header{padding-bottom:25px}
@media(min-width:760px){.quick .welcome-main{padding:35px 0;gap:25px 60px}.quick .copy h1{font-size:54px}.quick .copy .eyebrow{font-size:9px;margin-bottom:20px}.quick .lead{font-size:14px;margin-top:21px}.quick .top{height:85px}.quick .scene{max-width:430px!important}.quick .join{max-width:340px}.quick .join>p{font-size:11px}.quick .provider{min-height:49px;font-size:13px}.quick .storefront{padding:17px}.quick .store-name strong{font-size:19px}.quick .store-name small{font-size:10px}.quick .store-avatar{width:40px;height:42px;font-size:25px}.quick .thread{padding:17px;gap:12px}.quick .bubble{font-size:12px;padding:10px 14px}.quick .bubble small{font-size:7px}.quick .owner-intro p{font-size:12px}.quick .owner-dot{width:24px;height:26px;font-size:14px}.quick .service-options button{min-height:82px;padding:11px}.quick .service-copy strong{font-size:11px}.quick .service-copy small{font-size:8px}.quick .service-symbol{font-size:20px}.quick .offer{grid-template-columns:24px 1fr auto;min-height:59px}.quick .offer p{font-size:11px}.quick .offer button{font-size:10px;min-height:44px;padding:10px}.quick .confirmation{min-height:59px}.quick .confirmation strong{font-size:12px}.quick .confirmation small{font-size:10px}.quick .scene-caption{font-size:9px;margin-top:12px}.q4 .service-options button,.q9 .service-options button{min-height:43px;padding:8px 28px 8px 10px}.q4 .service-check,.q9 .service-check{top:14px}.q6 .offer{grid-template-columns:1fr auto}.q8 .storefront{padding-top:32px}.q7 .service-options{margin-left:31px}.q5 .thread{padding-left:0;padding-right:0}.q5 .storefront{padding:18px}.quick .study-nav{min-height:55px}}
@media(max-width:359px){.quick .welcome{padding:0 16px}.quick .copy h1{font-size:36px}.quick .thread{padding:9px;gap:7px}.quick .store-name strong{font-size:13px}.quick .service-copy strong{font-size:8px}.quick .service-copy small{font-size:6px}.quick .offer p{font-size:8px}.quick .offer button{font-size:7px;padding:7px}.quick .lead{font-size:11px}.quick .copy .eyebrow{font-size:6px}.quick .scene-caption{font-size:7px}}

/* Shared storefront silhouette: portrait content, without a phone frame. */
.quick .scene{width:100%;max-width:342px!important}
.quick .conversation{width:100%;min-height:460px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:28px;overflow:hidden;background:var(--stage);box-shadow:0 12px 30px -24px #17382d45}
.quick.q5 .conversation{background:var(--paper)}
.quick .storefront{margin:0;border-radius:0;padding:20px 18px;min-height:83px;flex-shrink:0}
.quick .store-avatar{width:38px;height:40px;border-radius:13px;font-size:23px}
.quick .store-name strong{font-size:16px;line-height:1.2;overflow-wrap:anywhere}
.quick .store-name small{font-size:10px}
.quick .thread{flex:1;padding:18px 16px;gap:13px}
.quick .bubble{font-size:12px;line-height:1.45;padding:10px 13px;border-radius:17px 17px 4px 17px}
.quick .bubble small{font-size:7px}
.quick .owner-intro p{font-size:12px;line-height:1.45}
.quick .owner-dot{width:24px;height:26px;font-size:14px;border-radius:8px}
.quick .try-note{display:flex;align-items:center;justify-content:center;gap:6px;color:var(--ink);padding:0 3px;min-height:48px;margin:0 0 -7px 24px}
.try-note>span{font-family:'Segoe Print','Bradley Hand',cursive;font-size:19px;line-height:1.2;transform:rotate(-4deg)}
.try-note small{font-family:DM,'Segoe UI',sans-serif;display:block;font-size:10px;line-height:1.5;margin-top:5px;transform:rotate(4deg);color:var(--muted)}
.quick .try-note svg{width:53px;height:43px;align-self:flex-end;flex-shrink:0;color:var(--accent)}
.quick .service-options button{min-height:76px;padding:10px 7px}
.quick .service-copy strong{font-size:10px;overflow-wrap:anywhere}
.quick .service-copy small{font-size:8px}
.quick .service-symbol{font-size:18px}
.quick.q4 .service-options button,.quick.q9 .service-options button{min-height:44px;padding:8px 26px 8px 9px}
.quick.q4 .service-copy,.quick.q9 .service-copy{flex-wrap:wrap;gap:2px 8px}
.quick.q4 .service-check,.quick.q9 .service-check{top:14px}
.quick.q7 .service-options{margin-left:18px;padding:6px}
.quick.q7 .service-options button{padding:10px 5px}
.quick.q5 .service-options{margin-right:0;margin-left:18px}
.quick .resolution{margin-top:auto;min-height:70px}
.quick .offer{grid-template-columns:24px 1fr;gap:7px;min-height:70px}
.quick .offer p{font-size:12px;line-height:1.4}
.quick .offer button{grid-column:2;justify-self:start;font-size:11px;padding:10px 14px;min-height:44px;border-radius:13px}
.quick.q6 .offer{grid-template-columns:1fr;padding:10px}

.quick .confirmation{min-height:70px;border-radius:15px}
.quick .confirmation strong{font-size:12px}
.quick .confirmation small{font-size:10px;line-height:1.4}
.quick .confirmation button{min-height:44px;min-width:44px}
.quick.q8 .storefront{padding-top:29px}
.quick .scene-caption{font-size:9px;margin-top:9px}
@media(min-width:760px){.quick .welcome-main{grid-template-columns:minmax(0,1fr) 342px;gap:25px 55px}.quick .scene{max-width:342px!important}.quick .conversation{min-height:480px}}
@media(max-width:359px){.quick .thread{padding:15px 12px}.quick .storefront{padding-left:14px;padding-right:14px}.quick .service-copy strong{font-size:9px}.quick .service-copy small{font-size:7px}.quick .try-note{margin-left:0}.try-note>span{font-size:18px}}

.carousel-entry{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;margin-bottom:24px;border-radius:18px;background:#244e41;color:#fffdf5;font-size:17px}

/* A quiet slideshow of the original layouts, with signup in normal flow. */
.quick .scene>.try-note{display:flex;justify-content:flex-end;align-items:center;gap:3px;padding:0 12px 0 0;margin:0 0 7px;min-height:40px;color:var(--ink)}
.quick .scene>.try-note>span{font-size:20px;transform:rotate(-5deg)}
.quick .scene>.try-note svg{width:44px;height:39px;transform:rotate(9deg);color:var(--accent)}
.carousel-mode{transition:background-color .45s ease,color .45s ease}
.carousel-slide{display:contents;touch-action:pan-y}
.carousel-controls{display:flex;align-items:center;justify-content:center;gap:0;min-height:44px;margin:0 auto;color:var(--ink)}
.carousel-controls button{display:grid;place-items:center;min-width:36px;min-height:44px;border:0;background:transparent;padding:0;color:inherit}
.carousel-controls button span{display:block;width:10px;height:1px;border-radius:1px;background:currentColor;opacity:.16}
.carousel-controls #rotation{min-width:46px}
.carousel-controls #rotation span{width:30px;opacity:.28}
.carousel-controls button:hover span,.carousel-controls button:focus-visible span{opacity:.65}
.carousel-studies{font-size:10px;color:var(--muted);padding:5px 0 15px}
@media(prefers-reduced-motion:reduce){.carousel-mode{transition:none}}

/* Owner's offer followed by a distinct, compact customer reply. */
.quick .offer,.quick.q6 .offer{display:grid;grid-template-columns:24px minmax(0,1fr);gap:8px;background:transparent;padding:0}
.quick.q6 .offer .owner-dot{display:grid}
.quick .offer .customer-confirm{grid-column:1 / -1;justify-self:end;align-self:end;width:auto;min-height:0;min-width:0;max-width:90%;padding:10px 13px;border:0;border-radius:17px 17px 4px 17px;background:var(--customer);color:var(--ink);font:inherit;font-size:12px;line-height:1.45;white-space:normal}
.carousel-mode .copy{min-height:var(--carousel-copy-height,0px)}
.carousel-mode .conversation{min-height:var(--carousel-card-height,460px)}
.carousel-mode .welcome-main{justify-content:flex-start}
.carousel-measure{position:absolute;left:-10000px;top:0;visibility:hidden;pointer-events:none;contain:layout style;--carousel-copy-height:0px;--carousel-card-height:0px}
@media(min-width:760px){.carousel-mode .welcome-main{grid-template-rows:var(--carousel-copy-height,auto) auto;align-content:center}.carousel-mode .join{align-self:start}}

.carousel-mode .returning-signin{display:flex;justify-content:center;align-items:center;gap:5px;min-height:44px;margin-top:8px;color:var(--muted);font-size:11px}
.carousel-mode .returning-signin span{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

.quick .join>p>.signup-prompt{display:inline-block;position:relative;padding-right:38px;margin-left:0;color:inherit;font-weight:inherit}
.signup-prompt .signup-sketch{position:absolute;right:0;top:-2px;width:32px;height:26px;color:var(--accent);opacity:.85;pointer-events:none}

/* Inline authentication only; the carousel composition remains unchanged. */
.inline-auth .auth-greeting{font-size:10px;color:var(--muted);margin:0 0 9px;font-weight:500}
.inline-auth .signup-prompt{display:inline-block;position:relative;padding-right:38px}
.auth-methods{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.auth-methods.one-method{grid-template-columns:1fr}
.quick .auth-methods .provider{margin:0;width:100%;gap:9px;border-radius:999px;min-height:45px;padding:10px 12px;font-size:12px}
.quick .auth-methods button.email{border:1px solid transparent}
.auth-methods svg{width:19px;height:19px}
.auth-panel{overflow:hidden}
.auth-panel-inner{padding-top:18px}
.auth-panel-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;margin-bottom:8px}
.auth-quiet{padding:5px 0;min-height:32px;background:none;border:0;color:var(--muted);font:inherit;font-size:10px;cursor:pointer}
.auth-quiet:disabled{opacity:.55;cursor:default}
.trouble{display:block;margin:8px auto 0;opacity:.7}
.trouble:hover,.trouble:focus-visible{opacity:1}
.auth-email-field{display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:transparent;transition:border-color .2s ease,box-shadow .2s ease}
.auth-email-icon{display:grid;place-items:center;flex:0 0 43px;color:var(--muted)}
.auth-email-icon svg{width:19px;height:19px}
.inline-auth .auth-email-field input[type=email]{display:block;flex:1;min-width:0;width:100%;height:46px;margin:0 16px 0 0;padding:11px 0;font:inherit;font-size:16px;border:0;border-radius:0;background:transparent;color:var(--ink);outline:none;box-shadow:none}
.auth-email-field:focus-within{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.auth-email-field:focus-within .auth-email-icon{color:var(--ink)}
.inline-auth .auth-email-field input:focus{outline:none;border:0}
.inline-auth input::placeholder{color:var(--muted)}
.inline-auth .auth-submit{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:44px;background:var(--solid);color:var(--on);border:0;border-radius:999px;font:inherit;font-size:12px;padding:10px 14px;cursor:pointer}
.inline-auth .auth-submit:disabled{opacity:.6;cursor:default}
.auth-submit svg{width:17px;height:17px}
.auth-error{font-size:11px;line-height:1.5;color:var(--ink);min-height:17px;margin:5px 0 8px}
.auth-hint{font-size:10px;line-height:1.6;color:var(--muted);margin-top:8px}
.auth-address{font-size:12px;color:var(--muted);overflow-wrap:anywhere;margin:0 0 14px}
.inline-code{position:relative}
.inline-code input{position:absolute;inset:0;z-index:2;width:100%;height:100%;opacity:0;font-size:16px;cursor:text}
.inline-code-slots{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}
.inline-code-slots>span{position:relative;display:grid;place-items:center;height:46px;border:1px solid var(--line);background:var(--paper);border-radius:10px;color:var(--ink);overflow:hidden}
.inline-code-slots b{font-size:20px;font-weight:500}
.inline-code:focus-within .active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.inline-code:focus-within{outline:1px solid var(--accent);outline-offset:4px;border-radius:10px}
.auth-code-actions{display:flex;justify-content:space-between;align-items:center;margin-top:7px}
.auth-success{display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.5;min-height:100px}
.auth-success svg{width:26px;height:26px;color:var(--accent)}
.auth-phase{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 12px;font-size:9px;color:var(--muted);padding:10px 0 16px}
.auth-phase button,.auth-phase select{background:none;border:0;color:inherit;font:inherit;min-height:32px;padding:4px;cursor:pointer}
.auth-phase button[aria-pressed=true]{text-decoration:underline;text-underline-offset:4px}
.auth-phase label{display:flex;align-items:center;gap:4px}
@media(min-width:760px){.inline-auth .auth-greeting{font-size:11px}}
.carousel-mode #carousel-auth{min-height:70px}

/* Browser autofill must retain the current carousel palette. */
.inline-auth .auth-email-field input:is(:autofill,:-webkit-autofill){-webkit-box-shadow:0 0 0 1000px var(--bg) inset!important;box-shadow:0 0 0 1000px var(--bg) inset!important;-webkit-text-fill-color:var(--ink)!important;caret-color:var(--ink);background-color:var(--bg)!important}
/* BEUI OTP source, with local theme styles instead of Tailwind utilities. */
.beui-otp{display:flex;flex-direction:column;gap:8px}
.beui-otp fieldset{position:relative;margin:0;padding:0;border:0;min-width:0}
.beui-otp fieldset>input{position:absolute;inset:0;z-index:20;width:100%;height:100%;opacity:0;font-size:16px;cursor:text}
.beui-otp fieldset>div{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.beui-otp [data-active]{position:relative;display:grid;place-items:center;height:50px;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink);font-size:20px;font-weight:500;font-variant-numeric:tabular-nums;transition:border-color .2s}
.beui-otp [data-active=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.beui-otp [data-active]>span:not([aria-hidden]){position:absolute;inset:0;display:grid;place-items:center;line-height:1}
.beui-otp [data-active]>span[aria-hidden]{position:absolute;top:50%;left:50%;width:1px;height:22px;background:var(--ink);transform:translate(-50%,-50%)}
.beui-otp [data-filled=true]>span[aria-hidden]{left:auto;right:8px}
