/* Social commerce: a consistent return, purchase and account experience.
   Loaded after the legacy Customer sheet rules; all values inherit its theme. */
.lumi-writing-prompts { padding-bottom:18px; border-bottom:1px solid var(--customer-line); }
.lumi-writing-prompts-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:5px 12px; margin-bottom:12px; }
.lumi-writing-prompts-heading > span { font-size:calc(14px + var(--lumi-font-delta,0px)); font-weight:600; }
.lumi-writing-prompts-heading > small { font-size:calc(11px + var(--lumi-font-delta,0px)); color:var(--customer-muted); }
.lumi-writing-prompts > [role="group"] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.lumi-writing-prompts button { position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:10px; min-width:0; min-height:88px; padding:13px 10px; border:1px solid var(--customer-line); border-radius:14px; background:var(--customer-surface); color:var(--customer-muted); text-align:left; transition:background 160ms ease,border-color 160ms ease; }
.lumi-writing-prompts button[aria-pressed="true"] { background:var(--customer-soft); color:var(--customer-text); border-color:var(--customer-text); }
.lumi-writing-prompts button > span { font-size:calc(12px + var(--lumi-font-delta,0px)); line-height:1.4; font-weight:550; overflow-wrap:anywhere; }
.lumi-writing-prompts button > svg:last-child:not(:first-child) { position:absolute; top:13px; right:9px; }
.lumi-create-post-caption-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.lumi-create-post-caption-heading label { font-size:calc(14px + var(--lumi-font-delta,0px)); font-weight:600; }
.lumi-create-post-caption-heading > span { color:var(--customer-muted); font-size:11px; font-variant-numeric:tabular-nums; }
.lumi-create-post .lumi-create-post-caption-input { min-height:132px; padding:14px; font-size:calc(14px + var(--lumi-font-delta,0px)); line-height:1.6; }
.lumi-create-post .lumi-create-post-media-add { border-color:var(--customer-line-strong); background:var(--customer-soft); color:var(--customer-text); }
.lumi-create-post-publish { min-height:44px; background:var(--customer-primary-fill); color:var(--customer-primary-ink); }
/* A chunked video upload is the longest wait in the app. The bar reports real
   transferred bytes; the indeterminate sweep is used only where the route
   genuinely cannot measure progress, so it never implies a false number. */
.lumi-upload-progress { display:flex; flex-direction:column; gap:7px; margin-bottom:16px; padding:12px 14px; border:1px solid var(--customer-line); border-radius:14px; background:var(--customer-soft); }
.lumi-upload-progress > p { font-size:calc(12px + var(--lumi-font-delta,0px)); font-weight:600; color:var(--customer-text); font-variant-numeric:tabular-nums; }
.lumi-upload-progress-track { position:relative; overflow:hidden; height:6px; border-radius:999px; background:var(--customer-line); }
.lumi-upload-progress-track > span { display:block; height:100%; border-radius:inherit; background:var(--customer-primary-fill); transition:width 220ms ease; }
.lumi-upload-progress-track > span[data-indeterminate="true"] { width:38% !important; animation:lumi-upload-sweep 1200ms ease-in-out infinite; }
@keyframes lumi-upload-sweep { 0% { transform:translateX(-100%); } 100% { transform:translateX(320%); } }
@media (prefers-reduced-motion:reduce) {
  .lumi-upload-progress-track > span { transition:none; }
  .lumi-upload-progress-track > span[data-indeterminate="true"] { animation:none; width:100% !important; opacity:.55; }
}
.lumi-create-post .lumi-create-post-affiliate { border-top:1px solid var(--customer-line); padding-top:18px; }
.lumi-create-post .lumi-create-post-note { background:var(--customer-soft); border-color:var(--customer-line); }
.lumi-create-post .lumi-create-post-note p { color:var(--customer-muted); }
@media (prefers-reduced-motion:reduce) { .lumi-writing-prompts button { transition:none; } }
.lumi-customer-column {
  --experience-radius:16px;
  --experience-gap:12px;
}
/* Two wordmark placements, deliberately different faces. The launch screen
   keeps the Pinyon Script the owner asked to have back; the top navigator uses
   Pacifico, because Poppins Bold read as too rigid at bar size and Pinyon is
   too fine to hold the gradient there. Pacifico has a large x-height for a
   script, so 31px matches the optical weight the 56px bar needs.

   Set in the interface face at the owner's request on 2026-09-09 and reverted
   the same day: upright Inter at wordmark weight read as a UI label rather
   than a mark, and lost the brand. Do not try it again without new artwork.

   This rule is typography only. It previously also carried background:none and
   -webkit-text-fill-color:currentColor, which silently overrode the
   `--ig-gradient` clip in the shell and flattened the owner's brand mark to
   solid ink. Never set fill, background or colour here. */
.lumi-customer-column .lumi-customer-brand-name { font-family:var(--font-wordmark-top) !important; font-size:31px !important; font-weight:400 !important; line-height:38px !important; letter-spacing:0 !important; }
.lumi-customer-column .lumi-customer-header-primary { padding-left:calc(var(--lumi-safe-left,0px) + 16px); }
.lumi-customer-column .lumi-customer-brand-area { overflow:visible; }
.lumi-customer-column .lumi-customer-brand-name { box-sizing:content-box; padding-left:2px; transform:translateX(-2px); }
/* The orb mark is tinted to ink for light surfaces in the shell. Dark surfaces
   keep the white strokes of the derived artwork. Both theme carriers are
   covered because the attribute is set on the Customer column and, in some
   entry points, on the document element. */
.lumi-customer-column[data-theme="dark"] .lumi-bottom-nav-avatar > img,
[data-theme="dark"] .lumi-customer-column .lumi-bottom-nav-avatar > img { filter:none !important; }
.lumi-account-heading .lumi-screen-title { font-size:calc(22px + var(--lumi-font-delta,0px)) !important; letter-spacing:-.035em; }
.customer-profile .lumi-profile-identity-card { margin:0 16px 14px; padding:0; overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; }
.customer-profile .lumi-profile-identity-card .lumi-profile-row { min-height:72px; padding:10px 0; border-radius:0; background:transparent; }
.customer-profile .lumi-profile-identity-card .lumi-profile-row + .lumi-profile-row { border-top:1px solid var(--customer-line); }
[data-theme="dark"] .customer-profile .lumi-profile-identity-card { border:0 !important; background:transparent !important; box-shadow:none !important; }
.customer-profile .lumi-profile-personal-row { padding-block:12px; }
.customer-profile .lumi-profile-personal-row .lumi-profile-row-title { font-size:calc(16px + var(--lumi-font-delta,0px)); letter-spacing:-.02em; }
.customer-profile .lumi-profile-personal-row .lumi-profile-row-subtitle { font-size:12px; line-height:1.6; }
.customer-profile .lumi-account-shortcuts { border:0; background:transparent; padding:0; gap:8px; box-shadow:none; }
.customer-profile .lumi-account-shortcuts > button { min-height:82px; border:0; border-radius:14px; background:var(--customer-soft); }
.customer-profile .lumi-account-shortcuts .lumi-profile-quick-icon { width:36px; height:36px; border-radius:11px; background:transparent; }
.lumi-cart-screen .lumi-empty-state { margin:24px 16px; padding:48px 24px; border:1px solid var(--customer-line); border-radius:24px; background:var(--customer-surface); }
@media (min-width:768px) and (pointer:fine) { .lumi-customer-column .lumi-customer-brand-name { font-size:33px !important; line-height:40px !important; } }
.lumi-customer-column[data-theme="dark"] {
  --customer-bg:#17181e;
  --customer-surface:#1e2027;
  --customer-elevated:#272a33;
  --customer-text:#f5f6fa;
  --customer-muted:#b5b9c3;
  --customer-faint:#9ca3b2;
  --customer-line:#363a45;
  --customer-line-strong:#4a5060;
  --customer-soft:#272a33;
  --customer-header:#1e2027;
  --customer-glass:#1e2027;
  --customer-glass-strong:#272a33;
  --customer-glass-border:#363a45;
}
.lumi-customer-main:has(> section[data-customer-tab-panel="favorites"]:not([hidden])),
.lumi-customer-main:has(> section[data-customer-tab-panel="shops"]:not([hidden])),
.lumi-customer-main:has(> section[data-customer-tab-panel="cart"]:not([hidden])),
.lumi-customer-main:has(> section[data-customer-tab-panel="profile"]:not([hidden])) { background:var(--customer-bg); }
.lumi-customer-column :is(button,a,input,textarea,select):focus-visible {
  outline:2px solid var(--customer-accent);
  outline-offset:3px;
}
.lumi-customer-column .lumi-empty-state { padding:40px 24px; }
.lumi-customer-column .lumi-empty-state-icon {
  width:64px; height:64px; border:1px solid var(--customer-line);
  background:var(--customer-surface); box-shadow:var(--customer-shadow-rest); color:var(--customer-muted);
}
.lumi-customer-column .lumi-empty-state-icon svg { color:var(--customer-muted); }
.lumi-customer-column .lumi-empty-state-title { color:var(--customer-text); font-size:calc(16px + var(--lumi-font-delta,0px)); font-weight:650; }
.lumi-customer-column .lumi-empty-state-copy { color:var(--customer-muted); font-size:calc(13px + var(--lumi-font-delta,0px)); line-height:1.6; }
.lumi-account-heading { display:flex; align-items:center; gap:16px; padding:0 16px 20px; }
.lumi-account-heading > div { min-width:0; flex:1; }
.lumi-account-heading p { margin:6px 0 0; color:var(--customer-muted); font-size:calc(12px + var(--lumi-font-delta,0px)); line-height:1.5; }
.lumi-account-create { width:44px; height:44px; flex:none; display:grid; place-items:center; border:1px solid var(--customer-line); border-radius:50%; background:var(--customer-surface); color:var(--customer-text); }
.lumi-account-section-label { margin:20px 2px 8px !important; font-size:calc(12px + var(--lumi-font-delta,0px)); font-weight:600; color:var(--customer-muted); }
.lumi-account-shortcuts { border-radius:var(--experience-radius); box-shadow:var(--customer-shadow-rest); }
.lumi-account-shortcuts > button { min-width:0; min-height:84px; padding:10px 3px; }
.lumi-account-shortcuts > button > span { text-align:center; line-height:1.4; overflow-wrap:anywhere; }
.lumi-account-shortcuts .lumi-profile-quick-icon { width:40px; height:40px; border-radius:50%; background:var(--customer-soft); color:var(--customer-text); }
.customer-profile .lumi-profile-row { min-height:68px; }
.customer-profile .lumi-profile-row-title { font-weight:600; }
.customer-profile .lumi-profile-group:not(.lumi-profile-identity-card) { border-radius:var(--experience-radius); }
.lumi-flow-notice { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid var(--customer-line); border-radius:12px; color:var(--customer-text); background:var(--customer-soft); font-size:calc(12px + var(--lumi-font-delta,0px)); line-height:1.5; }
.lumi-flow-notice > svg { flex:none; color:var(--customer-muted); }
.lumi-flow-notice > span { flex:1; min-width:0; }
.lumi-flow-notice > button { min-height:44px; padding:0 8px; flex:none; font-weight:650; color:var(--customer-accent); }
.lumi-purchase-card { background:var(--customer-surface); border-color:var(--customer-line); box-shadow:var(--customer-shadow-rest); }
.lumi-purchase-card-status { max-width:40%; flex:none; }
.lumi-purchase-card-status > p { white-space:nowrap; color:var(--customer-text); font-variant-numeric:tabular-nums; }
.lumi-purchase-card-status > span { white-space:normal; }
.lumi-cart-screen .lumi-cart-line { border:1px solid var(--customer-line) !important; box-shadow:var(--customer-shadow-rest) !important; }
.lumi-cart-screen .lumi-cart-price { color:var(--customer-text); font-variant-numeric:tabular-nums; }
.lumi-cart-screen .lumi-cart-checkout-button { box-shadow:none; }
.lumi-checkout-content { display:flex; flex-direction:column; gap:16px; }
.lumi-checkout-content > * { margin-top:0 !important; }
.lumi-checkout-section { border-radius:var(--experience-radius); background:var(--customer-surface) !important; border-color:var(--customer-line) !important; box-shadow:var(--customer-shadow-rest); }
.lumi-checkout-section-title { display:flex; align-items:center; gap:10px; margin:0 0 16px; font-size:calc(14px + var(--lumi-font-delta,0px)); font-weight:650; color:var(--customer-text); }
.lumi-checkout-section-title > span { width:28px; height:28px; flex:none; display:grid; place-items:center; border-radius:50%; border:1px solid var(--customer-line); background:var(--customer-soft); font-size:12px; font-variant-numeric:tabular-nums; color:var(--customer-muted); }
.lumi-invitation-card, .lumi-help-intro { border:1px solid var(--customer-line); border-radius:20px; padding:24px 20px; background:var(--customer-surface); box-shadow:var(--customer-shadow-rest); color:var(--customer-text); }
.lumi-invitation-icon, .lumi-flow-intro-icon { width:48px; height:48px; flex:none; display:grid; place-items:center; border-radius:50%; border:1px solid var(--customer-line); background:var(--customer-soft); color:var(--customer-accent); }
.lumi-invitation-card h3, .lumi-help-intro h3 { margin:16px 0 6px; font-size:calc(21px + var(--lumi-font-delta,0px)); font-weight:650; line-height:1.25; letter-spacing:-.02em; }
.lumi-invitation-card p, .lumi-help-intro p, .lumi-flow-intro p { font-size:calc(13px + var(--lumi-font-delta,0px)); line-height:1.6; color:var(--customer-muted); }
.lumi-invitation-code { display:block; margin:20px 0 0; padding:16px 10px; border:1px dashed var(--customer-line-strong,var(--customer-line)); border-radius:12px; background:var(--customer-soft); font-size:calc(22px + var(--lumi-font-delta,0px)); font-weight:650; letter-spacing:.12em; text-align:center; overflow-wrap:anywhere; }
.lumi-invitation-copy { min-height:44px; border:1px solid var(--customer-line); background:var(--customer-surface); color:var(--customer-text); }
.lumi-flow-intro { display:flex; align-items:center; gap:14px; padding:4px 0 14px; }
.lumi-flow-intro h3 { font-size:calc(16px + var(--lumi-font-delta,0px)); font-weight:650; margin:0 0 4px; }
.lumi-help-screen > a { background:var(--customer-surface); overflow-wrap:anywhere; }
.lumi-customer-column .lumi-notification-center { background:var(--customer-surface); }
.lumi-customer-column .lumi-notification-group { padding-top:8px; }
.lumi-customer-column .lumi-notification-group > h3 { margin:0; padding:16px 20px 8px; font-size:calc(12px + var(--lumi-font-delta,0px)); font-weight:600; color:var(--customer-muted); }
.lumi-customer-column .lumi-notification-row { gap:12px; padding:16px 20px; border:0; border-bottom:1px solid var(--customer-line); border-radius:0; }
.lumi-customer-column .lumi-notification-row.is-unread { background:color-mix(in srgb,var(--customer-accent) 5%,var(--customer-surface)); }
.lumi-customer-column .lumi-notification-copy > strong { font-size:calc(14px + var(--lumi-font-delta,0px)); font-weight:600; }
.lumi-customer-column .lumi-notification-copy > span { font-size:calc(13px + var(--lumi-font-delta,0px)); line-height:1.5; }
.lumi-customer-column .lumi-notification-copy > small { margin-top:5px; font-size:calc(11px + var(--lumi-font-delta,0px)); }
.lumi-customer-column .lumi-message-inbox { padding-inline:0; background:var(--customer-surface); }
.lumi-customer-column .lumi-message-search { margin:12px 16px 8px; min-height:44px; padding:0 14px; border:0; border-radius:12px; background:var(--customer-soft); }
.lumi-customer-column .lumi-message-chat-list { padding:0; }
.lumi-customer-column .lumi-message-chat-row { gap:12px; min-height:80px; margin:0; padding:10px 16px; border:0; border-radius:0; background:transparent; box-shadow:none; transition:background-color 140ms ease; }
.lumi-customer-column .lumi-message-chat-row:active { background:var(--customer-soft); }
.lumi-customer-column .lumi-message-chat-row .lumi-message-preview { margin-top:2px; }
.lumi-customer-column .lumi-message-chat-row .lumi-message-identity span { font-weight:600; letter-spacing:-.01em; }
.lumi-customer-column .lumi-message-chat-row > button:last-child { min-width:42px !important; }

/* Feed destinations read as one restrained editorial switcher. The former
   outlined circles made four equal destinations look like unrelated action
   buttons and spent too much visual weight above every post. */
.lumi-customer-column .lumi-home-feed-tabs { gap:4px; margin:0; padding:7px 10px 8px; border-bottom:1px solid var(--customer-line); }
.lumi-customer-column .lumi-home-feed-tabs .lumi-feed-tab { min-height:52px; gap:3px; border-radius:13px; padding:5px 2px; color:var(--customer-muted); font-weight:570; }
.lumi-customer-column .lumi-home-feed-tabs .lumi-feed-tab::after { display:none; }
.lumi-customer-column .lumi-home-feed-tabs .lumi-feed-tab-icon { width:25px; height:25px; flex-basis:25px; border:0; border-radius:0; background:transparent; color:currentColor; }
.lumi-customer-column .lumi-home-feed-tabs .lumi-feed-tab-icon svg { width:19px; height:19px; stroke-width:1.75; }
.lumi-customer-column .lumi-home-feed-tabs .lumi-feed-tab[aria-pressed="true"] { background:color-mix(in srgb,var(--customer-accent) 8%,var(--customer-surface)); color:var(--customer-accent); font-weight:680; }
.lumi-customer-column .lumi-home-feed-tabs .lumi-feed-tab[aria-pressed="true"] .lumi-feed-tab-icon,
.lumi-customer-column .lumi-home-feed-tabs .lumi-feed-tab.is-reels .lumi-feed-tab-icon { border:0; background:transparent; color:currentColor; transform:none; }
.lumi-customer-column .lumi-home-feed-tabs .lumi-feed-tab.is-reels:not([aria-pressed="true"]) { color:var(--customer-muted); }

.lumi-community-rooms { position:relative; display:grid; gap:9px; padding:13px 0 12px; border-bottom:1px solid var(--customer-line); background:var(--customer-surface); }
.lumi-community-room-heading { display:flex; align-items:center; gap:12px; padding:0 14px; }
.lumi-community-room-heading > div { min-width:0; flex:1; display:grid; gap:3px; }
.lumi-community-room-heading strong { overflow:hidden; color:var(--customer-text); font:750 calc(14px + var(--lumi-font-delta,0px))/1.2 var(--font-vi); letter-spacing:-.015em; text-overflow:ellipsis; white-space:nowrap; }
.lumi-community-room-heading small { color:var(--customer-muted); font:520 calc(10px + var(--lumi-font-delta,0px))/1.35 var(--font-vi); }
.lumi-community-room-heading > button { min-height:40px !important; display:inline-flex; align-items:center; justify-content:center; gap:6px; flex:none; padding:0 11px; border:1px solid var(--customer-line); border-radius:12px; background:transparent; color:var(--customer-text); font:650 calc(10px + var(--lumi-font-delta,0px))/1 var(--font-vi); }
.lumi-community-room-rail { display:flex; gap:7px; overflow-x:auto; padding:0 14px 2px; scrollbar-width:none; scroll-padding-inline:14px; }
.lumi-community-room-rail::-webkit-scrollbar { display:none; }
.lumi-community-room-rail > button { min-height:38px !important; min-width:0 !important; flex:none; display:inline-flex; align-items:center; gap:6px; padding:0 12px; border:1px solid var(--customer-line); border-radius:999px; background:transparent; color:var(--customer-muted); font:620 calc(11px + var(--lumi-font-delta,0px))/1 var(--font-vi); scroll-snap-align:start; }
.lumi-community-room-rail > button[aria-selected="true"] { border-color:color-mix(in srgb,var(--customer-accent) 42%,var(--customer-line)); background:color-mix(in srgb,var(--customer-accent) 8%,var(--customer-surface)); color:var(--customer-accent); }
.lumi-community-room-rail > button small { min-width:16px; color:inherit; font:650 9px/1 var(--font-vi); text-align:center; opacity:.72; }
.lumi-community-voice-entry { justify-self:start; min-height:38px !important; display:inline-flex; align-items:center; gap:6px; margin:0 14px; padding:0 12px; border:0; border-radius:11px; background:var(--customer-soft); color:var(--customer-text); font:650 calc(11px + var(--lumi-font-delta,0px))/1 var(--font-vi); }
.lumi-create-post-media-edit { position:absolute; z-index:4; left:6px; bottom:6px; min-width:0 !important; min-height:32px !important; display:inline-flex; align-items:center; gap:5px; padding:0 9px; border:1px solid rgba(255,255,255,.18); border-radius:10px; background:rgba(10,11,14,.72); color:#fff; box-shadow:0 4px 14px rgba(0,0,0,.2); backdrop-filter:blur(10px); font:650 10px/1 var(--font-vi); }
.lumi-auth-capability-note { display:flex; align-items:flex-start; gap:10px; padding:12px 13px; border:1px solid var(--customer-line); border-radius:13px; background:var(--customer-soft); color:var(--customer-muted); }
.lumi-auth-capability-note-mark { width:17px; height:17px; flex:none; display:grid; place-items:center; margin-top:1px; border:1px solid currentColor; border-radius:50%; font:650 12px/1 var(--font-vi); }
.lumi-auth-capability-note > span { min-width:0; display:grid; gap:3px; }
.lumi-auth-capability-note strong { color:var(--customer-text); font:650 calc(12px + var(--lumi-font-delta,0px))/1.25 var(--font-vi); }
.lumi-auth-capability-note small { font:520 calc(10.5px + var(--lumi-font-delta,0px))/1.45 var(--font-vi); }
.lumi-customer-column .lumi-social-profile-cover { border-radius:0; }
.lumi-customer-column .lumi-social-profile-info-card { margin:-44px 12px 0; padding:10px 12px 12px; border-color:color-mix(in srgb,var(--customer-line) 72%,transparent); border-radius:16px; box-shadow:0 7px 20px rgba(25,20,31,.07); }
.lumi-customer-column .lumi-social-profile-avatar,
.lumi-customer-column .lumi-social-profile-avatar-open { width:76px; height:76px; }
/* The picture has to follow the frame down.
   ------------------------------------------------------------
   The rule above resizes the frame to 76px, but `Avatar` is handed size={88}
   in the markup and writes that straight onto the img as an inline width and
   height. The img therefore rendered 88px inside a 76px box. The frame centres
   with place-items, and an overflowing grid item pins to the start edge, so
   all twelve pixels of the excess spilled right and down.
   The white ring is a box-shadow on the frame, so it stayed perfectly
   concentric with the FRAME while the photograph sat 12px past it on two
   sides, which reads exactly as a ring pushed up and to the left. Measuring
   the frame alone said it was centred; it was, and that was never the
   question. Sizing from the frame means the artwork cannot disagree with it
   again, whatever the markup asks for. */
.lumi-customer-column .lumi-social-profile-avatar-open > *,
.lumi-customer-column .lumi-social-profile-avatar-open img { width:100% !important; height:100% !important; }
.lumi-customer-column .lumi-social-profile-avatar { top:-42px; box-shadow:0 0 0 3px var(--customer-surface); }
.lumi-customer-column .lumi-social-profile-stats { padding-left:88px; }
.lumi-customer-column .lumi-purchase-card { border-radius:20px; padding:18px; }
.lumi-customer-column .lumi-purchase-card > div + div { margin-top:14px; }
.lumi-customer-column .lumi-cart-count { background:var(--customer-soft); border:1px solid var(--customer-line); color:var(--customer-muted); font-size:calc(11px + var(--lumi-font-delta,0px)); padding:7px 10px; }
@media (max-width:360px) {
  .lumi-flow-notice { flex-wrap:wrap; }
  .lumi-account-heading { padding-bottom:16px; }
  .lumi-invitation-card { padding:20px 16px; }
}
@media (prefers-reduced-motion:no-preference) {
  .lumi-account-create,.lumi-invitation-copy,.lumi-purchase-card { transition:background .16s ease,transform .16s ease; }
  .lumi-account-create:active,.lumi-invitation-copy:active { transform:scale(.96); }
}
.lumi-auth-google-primary { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; min-height:50px; padding:12px 18px; border:1px solid var(--customer-line); border-radius:14px; background:#fff; color:#1f1f1f; font:650 15px/1.4 var(--font-vi); }
.lumi-auth-google-primary:disabled { opacity:.6; cursor:wait; }
.lumi-auth-google-primary:focus-visible { outline:2px solid var(--customer-accent); outline-offset:3px; }
.lumi-auth-google-hint { margin:0; padding:0 6px 4px; color:var(--customer-muted); text-align:center; font:400 12px/1.6 var(--font-vi); }
.lumi-reels-refresh-error { position:absolute; top:calc(var(--lumi-safe-top,0px) + 60px); left:12px; right:12px; z-index:5; display:flex; align-items:center; gap:12px; padding:10px 14px; border-radius:12px; background:rgba(24,24,28,.94); color:#fff; font:500 12px/1.5 var(--font-vi); }
.lumi-reels-refresh-error span { flex:1; }
.lumi-reels-refresh-error button { min-height:44px; padding:0 10px; border:1px solid #73737a; border-radius:9px; color:#fff; background:transparent; white-space:nowrap; }
/* No backdrop-filter here on purpose. It blurs a live video frame every frame
   it is on screen, so the one moment the reader sees it — a clip that is
   already struggling to keep up — is the moment it costs the most. A flat
   translucent disc reads the same and is free. */
.lumi-reel-buffering { position:absolute; left:50%; top:45%; width:46px; height:46px; display:grid; place-items:center; padding:0; border:1px solid rgba(255,255,255,.12); border-radius:50%; transform:translate(-50%,-50%); background:rgba(18,18,22,.42); color:white; box-shadow:0 8px 28px rgba(0,0,0,.16); }
.lumi-reel-buffering .lumi-pull-refresh-spinner { width:20px; height:20px; border-color:rgba(255,255,255,.3); border-top-color:#fff; }
.lumi-reel-slide .lumi-reel-copy,
.lumi-reel-slide .lumi-reel-actions,
.lumi-reel-slide .lumi-reel-seek,
.lumi-reel-slide .lumi-reel-gradient { transition:opacity 180ms ease,visibility 180ms ease; }
.lumi-reel-slide[data-chrome-visible="false"] .lumi-reel-copy,
.lumi-reel-slide[data-chrome-visible="false"] .lumi-reel-actions,
.lumi-reel-slide[data-chrome-visible="false"] .lumi-reel-seek,
.lumi-reel-slide[data-chrome-visible="false"] .lumi-reel-gradient { visibility:hidden; opacity:0; pointer-events:none; }
.lumi-reel-seek { height:30px; left:10px; bottom:max(0px,var(--lumi-safe-bottom,0px)); width:calc(100% - 20px); filter:drop-shadow(0 1px 3px rgba(0,0,0,.72)); }
.lumi-reel-seek::-webkit-slider-runnable-track { height:2px; border-radius:999px; background:linear-gradient(to right,rgba(255,255,255,.96) var(--reel-progress),rgba(255,255,255,.26) var(--reel-progress)); }
.lumi-reel-seek::-webkit-slider-thumb { width:8px; height:8px; margin-top:-3px; border:1px solid rgba(255,255,255,.75); background:rgba(255,255,255,.94); box-shadow:0 1px 5px rgba(0,0,0,.35); transition:width 120ms ease,height 120ms ease,margin 120ms ease; }
.lumi-reel-seek:active::-webkit-slider-thumb,
.lumi-reel-seek:focus-visible::-webkit-slider-thumb { width:13px; height:13px; margin-top:-5.5px; }
.lumi-reel-seek::-moz-range-track { height:2px; border-radius:999px; background:rgba(255,255,255,.26); }
.lumi-reel-seek::-moz-range-progress { height:2px; border-radius:999px; background:rgba(255,255,255,.96); }
.lumi-reel-seek::-moz-range-thumb { width:8px; height:8px; border:1px solid rgba(255,255,255,.75); background:rgba(255,255,255,.94); box-shadow:0 1px 5px rgba(0,0,0,.35); }
.lumi-media-viewer-foreground::-webkit-media-controls-panel { background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.12) 42%,rgba(0,0,0,.58) 100%); }
.lumi-media-viewer-foreground::-webkit-media-controls-timeline { min-height:2px; border-radius:999px; background-color:rgba(255,255,255,.18); }
.lumi-reel-recovery { position:absolute; left:20px; right:72px; top:38%; z-index:3; max-width:360px; margin:auto; padding:18px; border:1px solid #62626b; border-radius:16px; background:rgba(24,24,28,.94); color:#fff; text-align:center; }
.lumi-reel-recovery p { margin:0 0 12px; font:500 14px/1.6 var(--font-vi); }
.lumi-reel-recovery button { min-height:44px; padding:10px 18px; border:0; border-radius:10px; background:#fff; color:#202024; font:650 14px/1.4 var(--font-vi); }
.lumi-story-media-recovery { position:absolute; z-index:6; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; padding:24px; color:#fff; background:rgba(13,14,18,.86); text-align:center; }
.lumi-story-media-recovery p { margin:0; max-width:28ch; font-size:15px; line-height:1.5; }
.lumi-story-media-recovery > div { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.lumi-story-media-recovery button { min-height:44px; padding:10px 18px; border:1px solid rgba(255,255,255,.45); border-radius:999px; background:transparent; color:#fff; font:inherit; cursor:pointer; }
.lumi-story-media-recovery button:first-child { background:#fff; color:#16171c; }
.lumi-story-media-recovery button:focus-visible { outline:3px solid #fff; outline-offset:4px; }

.customer-profile .lumi-profile-identity-card .lumi-profile-row-copy { display:block; overflow:visible; white-space:normal; -webkit-line-clamp:unset; line-height:1.5; }