.ambassador-dropdown{position:absolute;top:calc(100% + 8px);left:16px;z-index:100;width:230px;padding:8px;border:1px solid #ffffff90;border-radius:20px;background:rgba(236,242,234,.96);backdrop-filter:blur(24px);box-shadow:0 14px 40px #102d3433;color:#173f35}.ambassador-dropdown button{display:block;width:100%;padding:14px;text-align:left;border:0;border-radius:12px;background:transparent;color:inherit;font:inherit}.ambassador-dropdown button:hover,.ambassador-dropdown button:focus-visible{background:#173f3515}.ambassador-nav{position:fixed;bottom:max(14px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(520px,calc(100% - 24px));display:grid;grid-template-columns:repeat(4,1fr);z-index:40;padding:8px;background:rgba(238,243,236,.97);border:1px solid #fff9;border-radius:24px;box-shadow:0 8px 32px #173f3526;color:#173f35}.ambassador-nav[hidden],.customer-nav[hidden]{display:none!important}.ambassador-nav button{border:0;border-radius:18px;padding:9px 2px;background:transparent;color:inherit;font:inherit;font-size:12px;display:grid;gap:4px;justify-items:center}.ambassador-nav button span{font-size:23px;line-height:1}.ambassador-nav .active{background:#173f35;color:white}.ambassador-panel{max-width:720px;margin:auto;padding-bottom:100px}.ambassador-panel h1{font-size:36px;margin:8px 0}.ambassador-eyebrow{letter-spacing:.17em;font-size:11px;font-weight:800}.ambassador-panel .card{margin-top:24px;padding:24px}.ambassador-panel form,.ambassador-panel label{display:grid;gap:10px}.ambassador-panel form{gap:20px}.ambassador-panel input,.ambassador-panel textarea,.ambassador-panel select{box-sizing:border-box;min-width:0;width:100%;font:inherit}.ambassador-panel textarea{min-height:130px}.ambassador-panel [role=status]{overflow-wrap:anywhere}.ambassador-member{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid #8884}.ambassador-member>div{min-width:0;display:grid;gap:5px;overflow-wrap:anywhere}.ambassador-member button{flex-shrink:0}.ambassador-status{text-transform:capitalize;font-size:12px;font-weight:700}.ambassador-user{padding:12px 0;border-bottom:1px solid #8884}.ambassador-welcome{box-sizing:border-box;border:1px solid #ffffff90;border-radius:30px;padding:36px 28px;width:min(460px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto;background:radial-gradient(ellipse at top,#fff6db,#edf2e9 70%);color:#173f35;text-align:center;box-shadow:0 25px 100px #0005}.ambassador-welcome::backdrop{background:#10251fe6;backdrop-filter:blur(12px)}.ambassador-welcome h1{font-size:clamp(27px,7vw,38px);line-height:1.15;letter-spacing:-.035em}.ambassador-welcome h1 em{font-style:normal;background:linear-gradient(100deg,#94622a,#315e48,#af8038,#315e48);background-size:200%;background-clip:text;color:transparent;animation:ambassador-shine 4s ease both}.ambassador-welcome p{line-height:1.6}.ambassador-actions{display:flex;gap:12px;justify-content:center}.ambassador-actions button{flex:1}.ambassador-cup{position:relative;width:126px;height:112px;margin:25px auto 32px;border-radius:12px 12px 48px 48px;background:linear-gradient(100deg,#c9ccbf,#fffef7 30%,#eeeee3 65%,#a7ac9d);box-shadow:inset 3px 0 4px #fff,0 22px 13px -15px #173f3566;animation:ambassador-arrive 1.4s cubic-bezier(.17,.8,.28,1) both;transform-style:preserve-3d}.ambassador-cup:after{content:'';position:absolute;right:-31px;top:17px;width:39px;height:50px;border:12px solid #e4e5da;border-left:0;border-radius:0 30px 30px 0;z-index:-1;box-shadow:inset -3px 2px 3px #9da494}.ambassador-cup span{position:absolute;top:55px;left:36px;font:italic 20px Georgia;color:#466253}.coffee-surface{position:absolute;top:-10px;left:0;width:126px;height:29px;box-sizing:border-box;border:7px solid #f8f8ef;border-radius:50%;background:radial-gradient(ellipse at 45% 45%,#f4d7a3 0 13%,#be864b 17% 24%,#f0ca89 27% 32%,#835127 36% 55%,#482a18 75%);box-shadow:0 3px 4px #909582}.ambassador-panel h2{font-size:20px}@keyframes ambassador-arrive{0%{transform:scale(.05) rotate(-300deg);opacity:0}70%{transform:scale(1.12) rotate(12deg);opacity:1}100%{transform:scale(1) rotate(0)}}@keyframes ambassador-shine{from{background-position:200%}to{background-position:0}}@media(prefers-reduced-motion:reduce){.ambassador-cup,.ambassador-welcome h1 em{animation:none}}@media(max-width:450px){.ambassador-panel .card{padding:18px}.ambassador-welcome{padding:24px}.ambassador-member{gap:10px}}

.customer-body{overflow-x:clip}.ambassador-panel input,.ambassador-panel select,.ambassador-panel textarea{padding:12px;border:1px solid var(--line);border-radius:12px;color:var(--ink);background:var(--paper)}.ambassador-panel label{font-size:13px;font-weight:600}.ambassador-panel [data-link]{margin:18px 0}.ambassador-panel [data-copy]{margin-top:10px}.customer-body:has(.ambassador-nav:not([hidden])){--customer-nav-space:100px}.ambassador-panel input:focus-visible,.ambassador-panel textarea:focus-visible,.ambassador-panel select:focus-visible{outline:2px solid var(--green);outline-offset:2px}
/* Ambassador visual identity and customer-style sliding navigation. */
html .customer-body.ambassador-mode {
  --ink: #3b2c12;
  --muted: #81714e;
  --green: #926715;
  --dark: #654810;
  --soft: #f3e4bb;
  --cream: #fbf7ec;
  --paper: #fffdf7;
  --line: #e7dcc1;
  --orange: #ae7b20;
  --customer-nav-space: calc(72px + env(safe-area-inset-bottom));
  background: var(--cream);
  color: var(--ink);
}
html .customer-body.ambassador-mode::before,
html .customer-body.ambassador-mode::after { display: none; }
html .ambassador-mode .customer-header { background: #fbf7ec; }
html .ambassador-mode .card { background: #fffdf7; border-color: #e7dcc1; }
html .ambassador-mode .button.primary { background: #926715; color: #fffdf7; }
.ambassador-nav {
  bottom: 0;
  left: 0;
  transform: none;
  width: 100%;
  height: calc(72px + env(safe-area-inset-bottom));
  padding: 7px 10px calc(7px + env(safe-area-inset-bottom));
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: #fffdf7;
  color: var(--muted);
  box-shadow: 0 -6px 24px #533b100d;
  z-index: 50;
  align-items: center;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}
.ambassador-nav::before {
  content: '';
  position: absolute;
  top: 7px;
  left: 10px;
  width: calc((100% - 20px) / 4);
  height: 56px;
  border-radius: 13px;
  background: var(--soft);
  box-shadow: inset 0 0 0 1px #9267151f;
  transform: translateX(calc(var(--amb-position, 0) * 100%));
  transition: transform .5s cubic-bezier(.22, 1, .36, 1);
  pointer-events: none;
}
.ambassador-nav.dragging::before { transition: none; }
.ambassador-nav button {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 52px;
  padding: 4px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
  touch-action: none;
}
.ambassador-nav button span { font-size: inherit; line-height: normal; }
.ambassador-nav button svg { width: 19px; height: 19px; }
.ambassador-nav button.active { background: transparent; color: var(--green); }
.customer-brand.has-mode-menu::after {
  content: '';
  width: 9px;
  height: 9px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-3px) rotate(45deg);
  margin-left: 3px;
  flex-shrink: 0;
}
.customer-brand.has-mode-menu[aria-expanded=true]::after { transform: translateY(2px) rotate(225deg); }
.ambassador-dropdown {
  top: calc(100% + 8px);
  left: 15px;
  width: min(292px, calc(100vw - 30px));
  padding: 10px;
  border: 1px solid #ffffff29;
  border-radius: 30px;
  background: linear-gradient(125deg, #3b3d47e8, #292a29ee 60%, #3d371eee);
  backdrop-filter: blur(28px) saturate(140%);
  -webkit-backdrop-filter: blur(28px) saturate(140%);
  box-shadow: inset 0 1px 1px #ffffff36, inset 0 -2px 2px #a58a3529, 0 18px 45px #0005;
  color: #fafafa;
}
.ambassador-dropdown button {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 20px 15px;
  border-radius: 20px;
  color: #fafafa;
  font-size: 23px;
  font-weight: 400;
}
.ambassador-dropdown button svg { width: 32px; height: 32px; flex-shrink: 0; }
.ambassador-dropdown button:hover,
.ambassador-dropdown button:focus-visible { background: #ffffff12; outline: none; }
.ambassador-cup { animation-duration: 3.6s; animation-timing-function: cubic-bezier(.25,.55,.3,1); }
.ambassador-cup span { top: 48px; left: 17px; width: 92px; font-size: 17px; line-height: 1.1; color: #785619; }
.account-slide-layer { position: fixed; left: 0; right: 0; bottom: 0; overflow: hidden; z-index: 35; background: var(--cream); pointer-events: none; }
@media(prefers-reduced-motion:reduce) { .ambassador-nav::before { transition: none; } .ambassador-cup { animation: none; } }
@media(max-width:360px) { .customer-brand.has-mode-menu { gap: 7px; } .customer-brand.has-mode-menu strong { font-size: 16px; } }
/* Keep the status paragraph's spacing in inert transition snapshots. */
.account-slide-layer .customer-settings .customer-notification-heading + p { margin: 12px 0 0; }
/* Let the menu blur the page instead of the header's already-filtered layer. */
.customer-header:has(.ambassador-dropdown) { backdrop-filter: none; -webkit-backdrop-filter: none; }
/* Compact selection menu with a short anchored opening transition. */
.ambassador-dropdown {
  width: min(228px, calc(100vw - 30px));
  padding: 6px;
  border-radius: 22px;
  transform-origin: top left;
  animation: ambassador-menu-open 180ms cubic-bezier(.2,.8,.2,1) both;
}
.ambassador-dropdown button { padding: 13px 12px; gap: 12px; border-radius: 16px; font-size: 18px; }
.ambassador-dropdown button svg { width: 25px; height: 25px; }
@keyframes ambassador-menu-open {
  from { opacity: 0; transform: translateY(-6px) scale(.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) { .ambassador-dropdown { animation: none; } }
/* Mode selection follows the active app palette on every device. */
.ambassador-dropdown {
  top: calc(100% + 18px);
  background: var(--paper);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 16px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 8px 24px #30250f1f;
}
.ambassador-dropdown button { color: var(--ink); font-size: 15px; font-weight: 600; border-radius: 10px; }
.ambassador-dropdown button svg { width: 21px; height: 21px; color: var(--green); }
.ambassador-dropdown button:hover, .ambassador-dropdown button:focus-visible { background: var(--soft); color: var(--green); }
.customer-body .customer-brand { -webkit-tap-highlight-color: transparent; }
.customer-body .customer-brand:focus:not(:focus-visible) { outline: none; box-shadow: none; }