﻿.cb-root {
  --cb-accent: #EB8F40;
  --cb-accent-hover: black;
  --cb-text: #202b26;
  --cb-muted: #5d6962;
  --cb-border: #dfe5df;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--cb-text);
  font-size: 15px;
  line-height: 1.65;
}
.cb-root *, .cb-root *::before, .cb-root *::after { box-sizing: border-box; }
.cb-dialog { color: var(--cb-text); background: #fff; border: 1px solid var(--cb-border); padding: 32px; box-shadow: 0 16px 80px #152b2430; max-height: calc(100dvh - 32px); overflow: auto; }
.cb-dialog::backdrop { background: #15251f70; backdrop-filter: blur(4px); }
.cb-dialog h2 { font-size: 25px; line-height: 1.25; letter-spacing: -.6px; margin: 0; padding-top:5px; font-weight: 650; }
.cb-dialog p { margin: 0; color: var(--cb-muted); }
.cb-eyebrow { font-size: 10px; font-weight: 750; letter-spacing: 2px; color: var(--cb-accent); }
.cb-root button { appearance: none; border: 1px solid var(--cb-accent); background: var(--cb-accent); color: white; font: inherit; font-size: 14px; font-weight: 600; padding: 12px 20px; border-radius: 7px; cursor: pointer; line-height: 1.4; }
.cb-root button:hover { background: var(--cb-accent-hover); border-color: var(--cb-accent-hover); }
.cb-root :focus-visible { outline: 3px solid #b77720; outline-offset: 4px; }
.cb-banner h2[tabindex="-1"]:focus { outline: none; }
.cb-actions { display: flex; gap: 10px; margin-top: 26px; }
.cb-actions button { flex: 1; white-space: nowrap; }
.cb-banner--modal { position: fixed; inset: 0; margin: auto; width: min(680px, calc(100% - 32px)); border-radius: 16px; }
.cb-banner--footer { position: fixed; inset: auto 0 0; margin: 0; width: 100%; max-width: none; border-radius: 16px 16px 0 0; z-index: 10000; padding: 28px max(32px, calc((100vw - 1200px) / 2)); }
.cb-banner--footer[open] { display: flex; gap: 48px; align-items: center; }
.cb-banner--footer .cb-copy { flex: 1; }
.cb-banner--footer .cb-actions { flex: 0 0 auto; margin-top: 0; }
.cb-banner--footer h2 { font-size: 22px; margin-bottom: 10px; }
.cb-banner--footer p { font-size: 13px; }
.cb-banner--compact { position: fixed; inset: auto 24px 24px auto; width: min(420px, calc(100% - 32px)); margin: 0; border-radius: 16px; z-index: 10000; padding: 28px; }
.cb-banner--compact.cb-banner--left { left: 24px; right: auto; }
.cb-banner--compact h2 { font-size: 23px; }
.cb-banner--compact .cb-actions { gap: 7px; }
.cb-banner--compact button { padding: 11px 8px; font-size: 12px; }
.cb-settings { position: fixed; inset: 0; margin: auto; width: min(760px, calc(100% - 32px)); padding: 0; border-radius: 16px; }
.cb-settings[open] { display: flex; flex-direction: column; }
.cb-settings-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 28px 32px 20px; border-bottom: 1px solid var(--cb-border); }
.cb-settings-header h2 { margin-bottom: 0; }
.cb-root .cb-close { background: #f0f3ef; color: var(--cb-text); border: 0; padding: 0; width: 36px; height: 36px; flex-shrink: 0; font-size: 25px; font-weight: 400; }
.cb-root .cb-close:hover { background: #e1e7df; }
.cb-root .cb-banner-close { position: absolute; top: 12px; right: 12px; }
.cb-banner .cb-copy { padding-right: 28px; }
.cb-settings-body { padding: 24px 32px; overflow: auto; min-height: 0; }
.cb-settings-body > p { font-size: 14px; margin-bottom: 22px; }
.cb-category { display: flex; align-items: flex-start; gap: 28px; padding: 22px 0; border-top: 1px solid var(--cb-border); }
.cb-category > div { flex: 1; }
.cb-category label { font-weight: 650; cursor: pointer; }
.cb-category p { font-size: 13px; margin-top: 7px; }
.cb-required { display: inline-block; color: var(--cb-accent); font-size: 11px; font-weight: 650; margin-top: 7px; }
.cb-switch { appearance: none; flex: 0 0 44px; width: 44px; height: 26px; margin: 0; background: #b6c0b8; border: 1px solid #a4afa6; border-radius: 30px; cursor: pointer; position: relative; }
.cb-switch::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: white; transition: transform .15s; }
.cb-switch:checked { background: var(--cb-accent); border-color: var(--cb-accent); }
.cb-switch:checked::after { transform: translateX(18px); }
.cb-switch:disabled { opacity: .55; cursor: not-allowed; }
.cb-settings-footer { border-top: 1px solid var(--cb-border); padding: 18px 32px; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.cb-settings-footer .cb-timestamp { font-size: 12px; }
.cb-root .cb-launcher { position: fixed; left: 20px; bottom: 20px; z-index: 9999; width: 54px; height: 54px; border-radius: 50%; padding: 12px; box-shadow: 0 4px 20px #152b2430; display: grid; place-items: center; }
.cb-root .cb-launcher[hidden] { display: none; }
@media (max-width: 1000px) { .cb-banner--footer[open] { display: block; } .cb-banner--footer .cb-actions { margin-top: 20px; } }
@media (max-width: 540px) {
  .cb-dialog { padding: 24px; }
  .cb-banner--footer { padding: 22px 20px; }
  .cb-banner--compact, .cb-banner--compact.cb-banner--left { left: 16px; right: 16px; bottom: 16px; }
  .cb-actions { gap: 6px; }
  .cb-actions button { padding: 12px 7px; font-size: 12px; }
  .cb-settings { padding: 0; }
  .cb-settings-header, .cb-settings-body { padding: 22px; }
  .cb-settings-footer { padding: 16px 22px; }
  .cb-settings-footer button { width: 100%; }
  .cb-dialog h2 { font-size: 22px; }
}
