/* Arc Studio 5.3 commercial elements follow existing tokens and stay out of the canvas. */
.sales-manager,.sales-readiness,.sales-trust,.sales-push{--sales-ink:var(--text,#20242c);--sales-muted:var(--text-secondary,#667085);color:var(--sales-ink);font-size:13px;line-height:1.5;min-width:0}
.sales-payment{display:flex;flex-direction:column;font-size:12px;line-height:1.5;min-height:44px;padding:6px 0}.sales-payment>span{font-weight:400;color:var(--text-secondary,#667085)}.sales-trust{border-top:1px solid var(--border,#d8dee7);margin-top:14px;padding-top:8px}.sales-trust>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--brand,#930337)}.sales-trust p{font-size:13px;line-height:1.6}.sales-trust summary::after{content:' +';margin-left:auto}
.sales-readiness{padding:0 0 20px;border-bottom:1px solid var(--border,#d8dee7);margin-bottom:20px}.sales-readiness h2{font-size:19px;line-height:1.35}.sales-readiness ul{margin:16px 0;padding:0;list-style:none;display:grid;gap:10px}.sales-readiness li{display:flex;gap:10px}.sales-readiness li>span{color:var(--brand,#930337)}.sales-readiness strong,.sales-readiness small{display:block}.sales-readiness small{color:var(--sales-muted)}.sales-readiness p{font-size:12px!important;line-height:1.5!important}.sales-next{margin:20px 0}.sales-next ol{list-style:none;counter-reset:sales-step;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.sales-next li{position:relative;counter-increment:sales-step;padding-left:30px}.sales-next li::before{content:counter(sales-step);position:absolute;left:0;color:var(--brand,#930337);font-weight:700}.sales-next strong,.sales-next span{display:block;font-size:13px}.sales-next span{margin-top:4px;color:var(--text-secondary,#667085);line-height:1.5}
.price-card .price-note{font-size:11px;line-height:1.45}.price-card .price-breakdown>summary{min-height:44px}.price-card .price-cta{order:3}.price-card .price-note{order:4}.price-card .price-breakdown{order:5}.price-card>.sales-payment{order:6}.price-card .price-breakdown a{display:block;min-height:44px;padding:8px 0;color:var(--brand,#930337)}
.sales-push{padding:14px;border:1px solid var(--border,#d8dee7);border-radius:12px;margin:16px 0}.sales-push p{margin:4px 0 10px;font-size:13px}.sales-push button{min-height:44px}.sales-push-status{display:block;margin-top:8px;font-size:12px;overflow-wrap:anywhere}
.sales-admin-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.85fr);gap:24px}.sales-admin-preview{position:sticky;top:90px;align-self:start}.sales-key{overflow-wrap:anywhere;font-size:12px}.sales-metrics{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.sales-metrics dt{overflow-wrap:anywhere}.sales-metrics dd{margin:0}.sales-admin-preview .sales-person strong{font-size:15px}
.sales-contact-actions a:focus-visible,.sales-contacts summary:focus-visible,.sales-trust summary:focus-visible{outline:2px solid var(--brand,#930337);outline-offset:3px;border-radius:4px}
html[data-theme=dark] .sales-manager,html[data-theme=dark] .sales-push,html[data-theme=dark] .sales-readiness,html[data-theme=dark] .sales-trust{--sales-ink:#f5f7fa;--sales-muted:#b0b8c4;background:var(--surface,#181b1f);border-color:var(--border,#30363d)}
@media(max-width:767px){.price-card{padding:14px;gap:5px;margin:12px 0}.price-card .price-cta{margin-top:4px!important}.price-card .price-note{font-size:11px}.price-card--form{padding:10px 12px}.price-card--form .price-amount{font-size:22px}.sales-manager{padding:10px 12px;margin:10px 0}.sales-manager--compact .sales-person small{font-size:11px}.sales-contact-actions{margin-top:0;gap:4px 18px}.sales-next ol{grid-template-columns:1fr;gap:14px}.sales-admin-grid{grid-template-columns:1fr}.sales-admin-preview{position:static;order:-1}.sales-readiness button{min-height:48px}.sales-push .sales-contact-actions{gap:8px}}

/* Reuse staff theme tokens for new preview components, including system-dark. */
.sales-admin-grid>div{display:grid;gap:16px;align-content:start}
.sales-contact-actions{display:flex;flex-wrap:wrap;align-items:flex-start;gap:4px 14px;margin-top:6px}
.sales-contact-actions a,.sales-payment{color:var(--brand,#930337);font-weight:600;text-decoration:none}
.sales-contact-actions a{min-height:44px;display:inline-flex;align-items:center;padding:6px 0;box-sizing:border-box}

/* UI-2: quiet card, one-column actions, independently positioned channel list. */
.sales-manager {
  --manager-surface: var(--surface, #fff);
  --manager-ink: var(--text, #20242c);
  --manager-muted: var(--text-secondary, #667085);
  --manager-border: var(--border, #d8dee7);
  --manager-accent: #930337;
  --manager-soft: #f8edf1;
  --manager-focus: #930337;
  min-width: 0;
  padding: 12px;
  margin: 12px 0;
  border: 1px solid var(--manager-border);
  border-radius: 12px;
  background: var(--manager-surface);
  color: var(--manager-ink);
  box-shadow: none;
}
.sales-manager *, .sales-channel-panel, .sales-channel-panel * { box-sizing: border-box; }
.sales-manager .sales-person { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sales-manager .sales-person > div { min-width: 0; }
.sales-manager .sales-person strong { display: block; color: var(--manager-ink); font-size: 14px; font-weight: 650; line-height: 1.4; overflow-wrap: anywhere; }
.sales-manager .sales-person small { display: block; color: var(--manager-muted); font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; margin-top: 2px; }
.sales-manager .sales-person img, .sales-manager .sales-avatar { display: block; flex: 0 0 40px; width: 40px; height: 40px; object-fit: cover; border-radius: 50%; box-shadow: none; }
.sales-manager .sales-avatar { display: grid; place-items: center; background: var(--manager-soft); color: var(--manager-accent); font-size: 17px; font-weight: 600; }
.sales-manager p.sales-manager-note { color: var(--manager-muted); font-size: 13px; line-height: 1.55; margin: 10px 0 0; overflow-wrap: anywhere; }
.sales-manager .sales-contact-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; align-items: stretch; margin: 10px 0 0; min-width: 0; }
.sales-manager .sales-phone-link { display: flex; align-items: center; justify-content: flex-start; width: 100%; min-width: 0; min-height: 44px; padding: 6px 2px; border: 0; border-radius: 6px; background: transparent; color: var(--manager-accent); font-family: inherit; font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.45; text-decoration: none; box-shadow: none; transform: none; }
.sales-manager .sales-phone-desktop { display: inline; overflow-wrap: anywhere; }
.sales-manager .sales-phone-mobile { display: none; }
.sales-manager .sales-contacts { position: relative; display: block; width: 100%; min-width: 0; margin: 0; }
.sales-manager .sales-message-toggle { display: flex; align-items: center; gap: 9px; width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; margin: 0; border: 1px solid var(--manager-border); border-radius: 9px; background: var(--manager-surface); color: var(--manager-ink); font-family: inherit; font-size: 13px; line-height: 1.45; font-weight: 600; text-align: left; list-style: none; cursor: pointer; box-shadow: none; transition: border-color 140ms ease, background-color 140ms ease; }
.sales-manager .sales-message-toggle::-webkit-details-marker { display: none; }
.sales-manager .sales-message-toggle::marker { content: ''; }
.sales-manager .sales-message-toggle > span { flex: 1; min-width: 0; }
.sales-manager .sales-icon, .sales-channel-panel .sales-icon { display: block; flex: 0 0 18px; width: 18px; height: 18px; color: var(--manager-muted); }
.sales-manager .sales-message-toggle > .sales-icon:last-child { width: 14px; height: 14px; flex-basis: 14px; transition: transform 160ms ease; }
.sales-manager .sales-contacts[open] > .sales-message-toggle > .sales-icon:last-child { transform: rotate(180deg); }
.sales-manager .sales-contacts[open] > .sales-message-toggle { background: var(--manager-soft); border-color: var(--manager-border); }
.sales-manager .sales-contacts:not([open]) > .sales-channel-panel { display: none; }
.sales-channel-panel {
  --manager-surface: #fff; --manager-ink: #20242c; --manager-muted: #667085;
  --manager-border: #d8dee7; --manager-accent: #930337; --manager-soft: #f8edf1; --manager-focus: #930337;
  display: block; min-width: 0; max-width: none; padding: 6px; margin: 6px 0 0;
  border: 1px solid var(--manager-border); border-radius: 11px;
  background: var(--manager-surface); color: var(--manager-ink);
  box-shadow: 0 6px 24px rgb(16 24 40 / 12%);
  font-family: inherit; font-size: 13px; line-height: 1.45;
  overflow: auto; overscroll-behavior: contain; transition: none;
}
/* No fixed width/min-width in the card: a 220px inspector is a supported case. */
.sales-channel-panel[data-floating] { position: fixed; inset: auto; margin: 0; z-index: 10020; height: auto; }
.sales-channel-panel[popover]:not(:popover-open) { display: none; }
.sales-channel-panel::backdrop { background: transparent; pointer-events: none; }
.sales-channel-panel .sales-channel-link { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; min-height: 44px; padding: 10px; margin: 0; border: 0; border-radius: 6px; background: transparent; color: var(--manager-ink); font-family: inherit; font-weight: 500; font-size: 13px; line-height: 1.45; text-align: left; text-decoration: none; box-shadow: none; transform: none; transition: background-color 120ms ease; }
.sales-channel-panel .sales-channel-link > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.sales-channel-panel .sales-channel-link > .sales-icon:last-child { width: 12px; height: 12px; flex-basis: 12px; }
.sales-channel-panel .sales-channel-support:not(:first-child) { margin-top: 4px; border-top: 1px solid var(--manager-border); border-radius: 0 0 6px 6px; padding-top: 12px; }
.sales-manager .sales-phone-link:focus-visible, .sales-manager .sales-message-toggle:focus-visible, .sales-channel-panel .sales-channel-link:focus-visible { outline: 2px solid var(--manager-focus); outline-offset: 2px; }
@media (hover: hover) {
  .sales-manager .sales-phone-link:hover { text-decoration: underline; text-underline-offset: 4px; }
  .sales-manager .sales-message-toggle:hover { background: var(--manager-soft); }
  .sales-channel-panel .sales-channel-link:hover { background: var(--manager-soft); color: var(--manager-ink); }
}
.sales-manager--form { margin: 12px 0; }
/* Account area can be wide; contact controls stay legible without becoming a banner. */
.arc-account > .sales-manager { max-width: 360px; }
html[data-theme=dark] .sales-manager { --manager-surface: #181b1f; --manager-ink:#f5f7fa; --manager-muted:#b0b8c4; --manager-border:#30363d; --manager-accent:#ff86b2; --manager-soft:#30212b; --manager-focus:#ff86b2; background:var(--manager-surface); border-color:var(--manager-border); }
html .a-layout .sales-manager { --manager-surface:var(--a-surface); --manager-ink:var(--a-ink); --manager-muted:var(--a-muted); --manager-border:var(--a-line); --manager-accent:var(--a-brand-text); --manager-soft:var(--a-brand-soft); --manager-focus:var(--a-brand-text); background:var(--a-surface); border-color:var(--a-line); }
.a-layout .sales-manager .sales-channel-panel { --manager-surface:var(--a-surface); --manager-ink:var(--a-ink); --manager-muted:var(--a-muted); --manager-border:var(--a-line); --manager-accent:var(--a-brand-text); --manager-soft:var(--a-brand-soft); --manager-focus:var(--a-brand-text); }
@media (max-width:767px) {
 .sales-manager { padding:12px; margin:10px 0; }
 .sales-manager .sales-contact-actions { grid-template-columns:minmax(0,1fr); gap:8px; }
 .sales-manager .sales-phone-desktop { display:none; }
 .sales-manager .sales-phone-mobile { display:flex; align-items:center; gap:9px; }
 .sales-manager .sales-phone-link { min-height:44px; padding:10px 12px; border:1px solid var(--manager-border); border-radius:9px; color:var(--manager-ink); font-size:13px; }
 .sales-manager .sales-person small { font-size:12px; }
}
@media (prefers-reduced-motion:reduce) {
 .sales-manager .sales-message-toggle, .sales-manager .sales-message-toggle > .sales-icon, .sales-channel-panel .sales-channel-link { transition:none; }
}

@media(prefers-reduced-motion:reduce){.sales-channel-panel{transition:none!important;animation:none!important;}}
