:root {
  color-scheme: dark;
  --bg: #071019;
  --panel: #101b27;
  --panel-soft: #0b1621;
  --line: #21364a;
  --line-bright: #31516b;
  --text: #eef6ff;
  --muted: #94a9bd;
  --accent: #43d8a5;
  --accent-soft: #123d31;
  --blue: #62aef7;
  --danger: #ff6f7a;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 15% -10%, #173954 0, transparent 38%),
    radial-gradient(circle at 90% 10%, #102d29 0, transparent 28%),
    var(--bg);
  color: var(--text);
  font: 15px/1.55 system-ui, -apple-system, "Segoe UI", sans-serif;
}
button, input { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }

.auth-page { display: grid; place-items: center; padding: 28px; }
.auth-card, .panel {
  background: rgba(16, 27, 39, .96);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .46);
}
.auth-card { width: min(900px, 100%); padding: 38px; }
.brand-mark {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--accent), #7bf1c9);
  color: #05261c;
  font-size: 22px;
  font-weight: 900;
}
.login-brand-logo { display:block;width:min(210px,55vw);height:auto;object-fit:contain; }
.demo-brand img { display:block;width:170px;height:auto;object-fit:contain; }
.eyebrow, .step-label {
  color: var(--accent);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .18em;
}
h1 { margin: 10px 0 14px; font-size: clamp(31px, 5vw, 50px); line-height: 1.06; }
h2 { margin: 0; font-size: 23px; }
h3 { margin: 0 0 5px; font-size: 19px; }
.auth-lead { max-width: 620px; color: var(--muted); font-size: 16px; }
.muted { color: var(--muted); }
.auth-card form { display: grid; gap: 14px; max-width: 500px; margin-top: 24px; }

label { color: #cfdeec; font-weight: 700; }
input {
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  color: var(--text);
  background: #08131e;
  border: 1px solid #2b4358;
  border-radius: 12px;
  outline: none;
  transition: border-color .18s, box-shadow .18s, background .18s;
}
input::placeholder { color: #657d92; }
.secret-token-field { -webkit-text-security: disc; font-family: ui-monospace, "Cascadia Mono", monospace; }
input:focus {
  border-color: var(--accent);
  background: #0a1723;
  box-shadow: 0 0 0 4px rgba(67, 216, 165, .12);
}
button {
  min-height: 44px;
  padding: 11px 17px;
  color: #05261c;
  background: linear-gradient(135deg, var(--accent), #64e7ba);
  border: 0;
  border-radius: 11px;
  font-weight: 850;
  transition: transform .16s, filter .16s;
}
button:hover { filter: brightness(1.06); transform: translateY(-1px); }
button.secondary { color: var(--text); background: #192a3a; border: 1px solid #304a62; }
.compact { min-height: 36px; padding: 7px 12px; font-size: 13px; }
.check { display: flex; align-items: center; gap: 9px; font-weight: 550; }
.check input { width: auto; min-height: auto; accent-color: var(--accent); }
.status { min-height: 25px; color: #ffd781; }

.auth-options { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 26px; }
.auth-option {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 270px;
  padding: 24px;
  background: linear-gradient(155deg, #0d1c29, #0a151f);
  border: 1px solid var(--line);
  border-radius: 17px;
}
.auth-option h2 { margin-top: 14px; font-size: 20px; }
.auth-option p { color: var(--muted); flex: 1; }
.auth-option button { width: 100%; }
.option-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  color: var(--accent);
  background: var(--accent-soft);
  border-radius: 12px;
}
.option-icon svg { width: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.qr-option { align-items: center; text-align: center; }
.qr-frame { padding: 10px; background: #fff; border-radius: 14px; box-shadow: 0 10px 28px #0005; }
.qr-frame img { display: block; width: 150px; height: 150px; }
#restartButton { margin-top: 15px; }

.topbar {
  position: sticky;
  z-index: 10;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 66px;
  padding: 0 max(20px, 4vw);
  background: rgba(7, 16, 25, .88);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
}
.connect-close {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  color: #99a9b8;
  background: transparent;
  border: 0;
  border-radius: 9px;
  font-size: 30px;
  font-weight: 300;
  line-height: 1;
  text-decoration: none;
  transition: color .18s, background .18s, border-color .18s, transform .18s;
}
.connect-close:hover,
.connect-close:focus-visible {
  color: #fff;
  background: rgba(255, 255, 255, .07);
  outline: none;
  transform: scale(1.05);
}
.shell { width: min(1180px, calc(100% - 28px)); margin: 14px auto; }
.hero { margin-bottom: 18px; }
.hero h1 { max-width: 760px; }
.hero-copy { max-width: 720px; color: var(--muted); font-size: 17px; }
.panel { padding: 24px; margin: 12px 0; }
.panel-heading, .section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
}
.panel-note { max-width: 430px; margin: 0; color: var(--muted); font-size: 13px; }
.setup-grid, .field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.setup-grid { margin-top: 26px; }
.field-block { display: grid; align-content: start; gap: 8px; }
.field-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.marketplace-select { position: relative; }
.marketplace-trigger {
  display: grid;
  grid-template-columns: 1fr 12px;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 48px;
  padding: 11px 15px;
  color: var(--text);
  text-align: left;
  background: linear-gradient(135deg, #0a1723, #0d202e);
  border: 1px solid var(--line-bright);
  border-radius: 13px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}
.marketplace-trigger:hover { filter: none; transform: none; border-color: #47708f; background: linear-gradient(135deg, #0c1b28, #102636); }
.marketplace-trigger:focus-visible, .marketplace-select.open .marketplace-trigger {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 4px rgba(67, 216, 165, .12);
}
.marketplace-trigger strong, .marketplace-option strong { font-size: 14px; letter-spacing: .08em; }
.marketplace-chevron {
  width: 9px;
  height: 9px;
  border-right: 2px solid var(--accent);
  border-bottom: 2px solid var(--accent);
  transform: translateY(-2px) rotate(45deg);
  transition: transform .18s;
}
.marketplace-select.open .marketplace-chevron { transform: translateY(3px) rotate(225deg); }
.marketplace-menu {
  position: absolute;
  z-index: 25;
  top: calc(100% + 9px);
  left: 0;
  width: 100%;
  padding: 7px;
  background: rgba(12, 27, 40, .99);
  border: 1px solid #31516b;
  border-radius: 15px;
  box-shadow: 0 22px 55px rgba(0, 0, 0, .55);
  backdrop-filter: blur(16px);
}
.marketplace-option {
  display: grid;
  grid-template-columns: 1fr 20px;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 44px;
  padding: 9px 12px;
  color: var(--text);
  text-align: left;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 11px;
}
.marketplace-option:hover, .marketplace-option:focus-visible { filter: none; transform: none; outline: none; background: #14293a; border-color: #29475e; }
.marketplace-option.selected { background: rgba(67, 216, 165, .075); }
.option-check { color: var(--accent); font-size: 16px; opacity: 0; }
.marketplace-option.selected .option-check { opacity: 1; }
.connect-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 18px; align-items: start; }
.connection-mode { display:grid;grid-template-columns:minmax(180px,.6fr) auto minmax(240px,1fr);gap:14px;align-items:end;margin:14px 0 18px;padding:15px 17px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.025); }
.connection-mode h2 { margin:3px 0 0;font-size:17px; }
.connection-mode-actions { display:flex;gap:8px; }
.connection-mode-actions button.active { color:#fff;border-color:rgba(126,249,198,.42);background:rgba(58,196,144,.15); }
.existing-company-field { margin:0; }
.company-select .marketplace-option>span:first-child { display:grid;gap:3px;text-align:left; }
.company-select .marketplace-option small { color:var(--muted);font-size:10px;font-weight:500; }
.connect-panel .connect-workspace { grid-template-columns:minmax(0,900px);justify-content:center; }
.connect-panel #credentialForm { width:100%;grid-template-columns:1fr; }
.connect-panel #credentialForm > * { grid-column:1; }
.connect-panel .companies-pane { display:none !important; }
.connect-panel .credential-group { box-shadow:0 14px 40px rgba(0,0,0,.12); }
.connect-panel .setup-grid { padding:16px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.018); }
.credential-saved-state { display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 15px;padding:13px 14px;border:1px solid rgba(73,221,163,.25);border-radius:13px;background:rgba(73,221,163,.07); }
.credential-saved-state div { display:grid;gap:4px; }
.credential-saved-state b { color:var(--green);font-size:13px; }
.credential-saved-state span { color:var(--muted);font-size:11px; }
.embedded-connect .topbar,.embedded-connect .hero,.embedded-connect .companies-pane { display:none; }
.embedded-connect .shell { width:100%;max-width:none;margin:0;padding:0; }
.embedded-connect .connect-panel { min-height:100vh;border:0;border-radius:0;box-shadow:none; }
.embedded-connect .connect-workspace { grid-template-columns:1fr; }
@media (max-width:900px){.connection-mode{grid-template-columns:1fr}.connection-mode-actions{flex-wrap:wrap}}
.companies-pane { position: sticky; top: 82px; min-height: 300px; margin-top: 26px; padding: 18px; background: var(--panel-soft); border: 1px solid var(--line); border-radius: 17px; }
.companies-pane .section-head { align-items: center; }
.companies-pane h2 { font-size: 18px; }
.companies-pane .company-list { max-height: calc(100vh - 240px); overflow-y: auto; padding-right: 3px; }
.companies-pane .company-card,.companies-pane .company-actions { align-items: flex-start; flex-direction: column; }
[data-protected] { -webkit-user-select: none; user-select: none; }
.access-banner { margin: 14px 0 0; padding: 10px 13px; color: #bcebd9; background: rgba(67,216,165,.08); border: 1px solid rgba(67,216,165,.25); border-radius: 11px; font-size: 12px; }
.access-banner.warning { color: #ffe0a3; background: rgba(255,189,91,.08); border-color: rgba(255,189,91,.3); }
.access-banner.expired { color: #ffc0c6; background: rgba(255,111,122,.08); border-color: rgba(255,111,122,.3); }
.access-banner a { margin-left: 6px; color: inherit; font-weight: 900; }
.connection-success { position:fixed;z-index:120;inset:0;display:grid;place-items:center;padding:20px;background:rgba(3,7,12,.78);backdrop-filter:blur(12px); }
.connection-success.hidden { display:none; }
.connection-success>div { width:min(520px,100%);padding:32px;text-align:center;border:1px solid rgba(73,221,163,.38);border-radius:23px;background:linear-gradient(155deg,#14231f,#0c151d);box-shadow:0 35px 100px rgba(0,0,0,.66),0 0 55px rgba(73,221,163,.08); }
.connection-success span { display:inline-block;padding:6px 11px;color:#aef3d5;background:rgba(73,221,163,.1);border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.15em; }
.connection-success h2 { margin:18px 0 10px;font-size:26px; }
.connection-success p { margin:0;color:var(--muted);line-height:1.65; }
.connection-success button { width:100%;min-height:46px;margin-top:24px;border:0;border-radius:12px;color:#07100d;background:linear-gradient(135deg,#49dda3,#5acff2);font-weight:900;cursor:pointer; }
@media (min-width: 961px) {
  .connect-panel { padding: 14px 20px; }
  .connect-panel .setup-grid { margin-top: 12px; }
  .companies-pane { margin-top: 12px; }
  .connect-panel + .panel { display: none; }
  .hero h1 { margin: 4px 0 7px; font-size: 32px; }
  .hero-copy { max-width: none; margin: 0; font-size: 13px; }
  #credentialForm { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  #credentialForm > .setup-grid,
  #credentialForm > .submit-button,
  #credentialForm > .status { grid-column: 1 / -1; }
  #credentialForm > .credential-group { margin-top: 0; padding: 18px; }
  #credentialForm > .credential-group .field-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  #credentialForm > .credential-group .group-heading { margin-bottom: 13px; }
  #credentialForm > .credential-group .group-heading p { font-size: 12px; line-height: 1.45; }
  #credentialForm > .credential-group .benefit-line { margin-top: 12px; padding: 9px 11px; font-size: 12px; }
  #credentialForm > .submit-button { margin-top: 0; }
  #credentialForm.wb-mode > .primary-group { grid-column: 1 / -1; }
  #credentialForm.wb-mode > .primary-group .field-grid { grid-template-columns: 1fr 1fr; }
}
.credential-group {
  margin-top: 22px;
  padding: 24px;
  background: var(--panel-soft);
  border: 1px solid var(--line);
  border-radius: 17px;
}
.credential-group.ads-group { border-color: #294b66; background: linear-gradient(145deg, #0b1722, #0a1b29); }
.optional-badge { display:inline-flex;align-items:center;margin-left:7px;padding:4px 7px;border:1px solid var(--line-bright);border-radius:999px;color:var(--muted);font-size:10px;font-weight:750;vertical-align:middle; }
.group-heading { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 20px; }
.group-heading p { max-width: 770px; margin: 0; color: var(--muted); }
.group-number {
  display: grid;
  place-items: center;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  color: var(--accent);
  background: var(--accent-soft);
  border: 1px solid #276753;
  border-radius: 10px;
  font-weight: 900;
}
.benefit-line {
  margin: 16px 0 0;
  padding: 12px 14px;
  color: #a9dcca;
  background: rgba(67, 216, 165, .07);
  border-left: 3px solid var(--accent);
  border-radius: 0 9px 9px 0;
}
.submit-button { width: 100%; margin-top: 22px; min-height: 52px; font-size: 16px; }

.help-button {
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 23px;
  width: 23px;
  min-height: 23px;
  height: 23px;
  padding: 0;
  color: #b8d8f3;
  background: #173047;
  border: 1px solid #315674;
  border-radius: 50%;
  font-size: 12px;
  font-weight: 900;
}
.help-button::after {
  content: attr(data-tooltip);
  position: absolute;
  z-index: 30;
  right: -6px;
  bottom: calc(100% + 10px);
  width: max-content;
  max-width: 260px;
  padding: 8px 10px;
  color: var(--text);
  background: #172838;
  border: 1px solid #365069;
  border-radius: 8px;
  box-shadow: 0 8px 28px #0008;
  font-size: 12px;
  font-weight: 550;
  opacity: 0;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity .16s, transform .16s;
}
.help-button:hover::after, .help-button:focus-visible::after { opacity: 1; transform: translateY(0); }

.drawer-overlay {
  position: fixed;
  z-index: 40;
  inset: 0;
  background: rgba(0, 0, 0, .58);
  backdrop-filter: blur(3px);
}
.help-drawer {
  position: fixed;
  z-index: 50;
  top: 0;
  right: 0;
  width: min(460px, 94vw);
  height: 100vh;
  padding: 42px 32px;
  overflow-y: auto;
  background: #0d1924;
  border-left: 1px solid var(--line-bright);
  box-shadow: -28px 0 70px #0008;
  transform: translateX(104%);
  transition: transform .24s ease;
}
.help-drawer.open { transform: translateX(0); }
.drawer-close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 38px;
  min-height: 38px;
  padding: 0;
  color: var(--text);
  background: #192a3a;
  border: 1px solid #304a62;
  font-size: 26px;
}
.drawer-intro { color: var(--muted); font-size: 16px; }
.drawer-steps { display: grid; gap: 13px; padding-left: 24px; margin: 26px 0; }
.drawer-steps li { padding-left: 7px; }
.drawer-steps li::marker { color: var(--accent); font-weight: 900; }
.template-note { padding: 17px; background: #142536; border: 1px dashed #3a5870; border-radius: 12px; }
.template-note p { margin-bottom: 0; color: var(--muted); }

.company-list { display: grid; gap: 10px; margin-top: 20px; }
.company-card, .company-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.company-card { padding: 15px; background: #0a1520; border: 1px solid var(--line); border-radius: 12px; }
.company-card div:first-child { display: grid; }
.company-card span { color: var(--muted); font-size: 13px; }
.badge { padding: 6px 9px; background: #3a2730; border-radius: 999px; }
.badge.ok { color: #7af0c6; background: #12382d; }
.danger { color: var(--danger); background: transparent; border: 1px solid #6c3339; }

.demo-page { --accent: #8b70ff; --accent-soft: #272044; --line-bright: #514376; background: #080b10; }
.demo-topbar { position: fixed; z-index: 40; inset: 0 0 auto 0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 64px; padding: 0 24px; background: rgba(8,11,16,.94); border-bottom: 1px solid rgba(255,255,255,.08); backdrop-filter: blur(15px); }
.demo-brand { display: flex; align-items: center; gap: 10px; color: var(--text); text-decoration: none; }
.demo-brand span { display: grid; place-items: center; width: 34px; height: 34px; color: #fff; background: linear-gradient(145deg,#8b70ff,#5439dd); border-radius: 10px; font-weight: 900; }
.demo-label { justify-self: center; padding: 7px 12px; color: #d7cbff; background: rgba(139,112,255,.12); border: 1px solid rgba(139,112,255,.32); border-radius: 999px; font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.demo-label i { display: inline-block; width: 6px; height: 6px; margin-right: 6px; background: #9a83ff; border-radius: 50%; box-shadow: 0 0 12px #8b70ff; }
.demo-cta { justify-self: end; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 16px; color: #fff; background: linear-gradient(135deg,#8065ff,#6044e9); border-radius: 11px; text-decoration: none; font-weight: 850; }
.demo-layout { display: grid; grid-template-columns: 210px 1fr; min-height: 100vh; padding-top: 64px; }
.demo-sidebar { position: fixed; inset: 64px auto 0 0; display: flex; flex-direction: column; width: 210px; padding: 28px 16px 20px; background: #0b0e14; border-right: 1px solid rgba(255,255,255,.07); }
.demo-sidebar > p { padding: 0 11px; color: #696f7d; font-size: 9px; font-weight: 900; letter-spacing: .18em; }
.demo-sidebar nav { display: grid; gap: 5px; }
.demo-sidebar nav button { min-height: 44px; color: #9ca5b5; background: transparent; border: 0; text-align: left; }
.demo-sidebar nav button:hover { color: #fff; background: rgba(255,255,255,.035); }
.demo-sidebar nav button.active { color: #fff; background: linear-gradient(90deg,rgba(139,112,255,.2),rgba(139,112,255,.03)); box-shadow: inset 2px 0 #8b70ff; transform: none; }
.demo-sidebar-note { display: grid; gap: 4px; margin-top: auto; padding: 14px; color: #bdb4e9; background: rgba(139,112,255,.08); border: 1px solid rgba(139,112,255,.18); border-radius: 12px; }
.demo-sidebar-note span { color: #777f8e; font-size: 11px; }
.demo-main { grid-column: 2; width: min(1260px, 100%); padding: 28px 32px 60px; }
.demo-hero { display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.demo-hero h1 { margin: 5px 0; font-size: clamp(30px,4vw,44px); }
.demo-hero p { margin-bottom: 0; color: var(--muted); }
.demo-notice { display: flex; gap: 12px; margin: 20px 0; padding: 12px 15px; color: #cfc4ff; background: rgba(139,112,255,.08); border: 1px solid rgba(139,112,255,.22); border-radius: 12px; }
.demo-notice span { color: #9ba3b1; }
.demo-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; }
.demo-metrics article { display: grid; gap: 9px; padding: 19px; background: #111620; border: 1px solid rgba(255,255,255,.075); border-radius: 16px; box-shadow: 0 16px 35px rgba(0,0,0,.2); }
.demo-metrics span { color: #8790a0; font-size: 12px; }
.demo-metrics strong { font-size: clamp(19px,2vw,27px); }
.demo-metrics small { color: #56dfa9; }
.demo-grid { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(260px,.8fr); gap: 14px; margin-top: 14px; }
.demo-chart-card,.demo-insight { min-height: 330px; padding: 23px; background: #111620; border: 1px solid rgba(255,255,255,.075); border-radius: 17px; }
.demo-chart { display: flex; align-items: flex-end; gap: clamp(10px,3vw,30px); height: 220px; margin-top: 18px; padding: 20px 18px 0; background: repeating-linear-gradient(to top,rgba(255,255,255,.04) 0 1px,transparent 1px 55px); border-bottom: 1px solid rgba(255,255,255,.1); }
.demo-chart i { position: relative; flex: 1; min-width: 16px; background: linear-gradient(to top,#6044e9,#45d9ef); border-radius: 7px 7px 2px 2px; box-shadow: 0 8px 25px rgba(96,68,233,.18); }
.demo-chart i span { position: absolute; left: 50%; bottom: -23px; color: #677080; font-size: 9px; transform: translateX(-50%); }
.demo-insight { background: linear-gradient(145deg,#151525,#101720); }
.demo-insight p:not(.step-label) { color: #aab2c1; font-size: 16px; }
.demo-insight a { color: #a995ff; text-decoration: none; font-weight: 800; }
.demo-backdrop { position: fixed; z-index: 80; inset: 0; display: none; place-items: center; padding: 20px; background: rgba(2,4,7,.74); backdrop-filter: blur(12px); }
.demo-backdrop.open { display: grid; }
.demo-modal { width: min(560px,100%); padding: 35px; text-align: center; background: linear-gradient(155deg,#171a28,#0d121b); border: 1px solid rgba(139,112,255,.35); border-radius: 23px; box-shadow: 0 35px 100px rgba(0,0,0,.65); }
.demo-modal-badge { display: inline-block; padding: 6px 12px; color: #d9d0ff; background: rgba(139,112,255,.14); border-radius: 999px; font-size: 11px; font-weight: 900; letter-spacing: .16em; }
.demo-modal h2 { margin-top: 18px; font-size: 28px; }
.demo-modal p { color: #9ca5b5; font-size: 15px; }
.demo-modal-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; margin-top: 25px; }
.demo-modal-actions a { display: grid; place-items: center; color: #ded7ff; border: 1px solid rgba(139,112,255,.4); border-radius: 11px; text-decoration: none; font-weight: 800; }
.secondary-link { padding: 8px 12px; color: var(--text); background: #192a3a; border: 1px solid #304a62; border-radius: 10px; text-decoration: none; font-weight: 800; }
.plans-shell { width: min(900px,calc(100% - 30px)); margin: 55px auto; text-align: center; }
.plans-shell h1 { margin-bottom: 8px; }
.plans-lead { max-width: 650px; margin: 0 auto; color: var(--muted); }
.plans-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 30px; text-align: left; }
.plans-grid article { padding: 27px; background: var(--panel); border: 1px solid var(--line); border-radius: 19px; box-shadow: 0 24px 60px rgba(0,0,0,.3); }
.plans-grid article.featured { border-color: rgba(67,216,165,.45); background: linear-gradient(145deg,#11231f,#101b27); }
.plans-grid article > span { color: var(--accent); font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.plans-grid article > strong { display: block; margin-top: 18px; font-size: 30px; }
.plans-grid article > strong small { color: var(--muted); font-size: 12px; }
.plans-grid ul { display: grid; gap: 9px; min-height: 150px; padding-left: 20px; color: #b9c8d6; }
.plans-grid button { width: 100%; }

@media (max-width: 760px) {
  .auth-card, .panel { padding: 22px; }
  .auth-options, .setup-grid, .field-grid { grid-template-columns: 1fr; }
  .auth-option { min-height: auto; }
  .connect-workspace { grid-template-columns: 1fr; }
  .companies-pane { position: static; margin-top: 0; }
  .panel-heading, .section-head { align-items: stretch; flex-direction: column; }
  .connect-panel .panel-heading { align-items: flex-start; flex-direction: row; }
  .connect-panel .panel-heading > div { min-width: 0; flex: 1; }
  .company-card, .company-actions { align-items: flex-start; flex-direction: column; }
  .topbar .muted { display: none; }
  .help-button::after { right: auto; left: -8px; max-width: 220px; }
  .demo-topbar { grid-template-columns: 1fr auto; padding: 0 14px; }
  .demo-label { display: none; }
  .demo-layout { display: block; }
  .demo-sidebar { position: static; width: auto; padding: 12px; overflow-x: auto; }
  .demo-sidebar > p,.demo-sidebar-note { display: none; }
  .demo-sidebar nav { display: flex; min-width: max-content; }
  .demo-main { padding: 22px 15px 45px; }
  .demo-hero { align-items: flex-start; flex-direction: column; }
  .demo-notice { flex-direction: column; }
  .demo-metrics { grid-template-columns: 1fr 1fr; }
  .demo-grid { grid-template-columns: 1fr; }
  .demo-modal-actions { grid-template-columns: 1fr; }
  .demo-modal-actions a { min-height: 44px; }
  .plans-grid { grid-template-columns: 1fr; }
}
.admin-page { min-height: 100vh; background: #080b12; color: #f4f6fb; }
.admin-shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto; padding: 36px 0; }
.admin-head { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; margin-bottom: 24px; }
.admin-head h1 { margin: 5px 0 8px; font-size: clamp(30px, 5vw, 52px); }
.admin-head p { color: #99a3b6; max-width: 720px; }
.admin-head a { color: white; border: 1px solid #7868df; border-radius: 10px; padding: 11px 15px; text-decoration: none; }
.admin-grid { display: grid; grid-template-columns: minmax(300px,.8fr) minmax(360px,1.2fr); gap: 18px; }
.admin-card { border: 1px solid #252b39; background: #10141e; border-radius: 18px; padding: 22px; }
.admin-card h2 { margin-top: 0; }
.admin-card label { display: grid; gap: 7px; margin: 12px 0; color: #b9c1d0; font-size: 13px; }
.admin-card input,.admin-card select,.admin-card textarea { width: 100%; box-sizing: border-box; border: 1px solid #31394a; background: #0a0e16; color: white; border-radius: 10px; padding: 11px; font: inherit; }
.admin-card textarea { min-height: 90px; resize: vertical; }
.admin-card > button { border: 0; border-radius: 10px; background: #7967e8; color: white; padding: 12px 18px; cursor: pointer; }
.admin-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
#status { min-height: 20px; color: #a99bff; }
.override-list { display: grid; gap: 9px; }
.override-list article { display: flex; justify-content: space-between; gap: 14px; padding: 13px; border-radius: 12px; background: #0a0e16; border: 1px solid #252b39; }
.override-list small,.override-list em { display: block; margin-top: 5px; color: #8f99aa; font-size: 11px; font-style: normal; }
.override-list button { align-self: center; border: 1px solid #5a3140; background: #28131b; color: #ff9caf; border-radius: 8px; padding: 8px 10px; cursor: pointer; }
.admin-empty { color: #8f99aa; }
@media (max-width: 760px) { .admin-grid { grid-template-columns: 1fr; } .admin-head { flex-direction: column; } }

/* Administrative control center */
.admin-page { background:radial-gradient(circle at 15% 0,rgba(121,103,232,.12),transparent 34rem),#080b12;font-family:Manrope,Arial,sans-serif; }
.admin-shell { width:min(1440px,calc(100% - 36px)); }
.admin-head { align-items:center; }
.admin-head h1 { font-size:clamp(32px,4vw,52px); }
.admin-tabs { position:sticky;top:0;z-index:20;display:flex;gap:6px;margin:0 0 14px;padding:8px;border:1px solid #252b39;border-radius:15px;background:rgba(10,14,22,.94);backdrop-filter:blur(16px); }
.admin-tabs button { min-height:40px;padding:0 16px;border:0;border-radius:10px;color:#8f99aa;background:transparent;cursor:pointer;font-weight:700; }
.admin-tabs button:hover,.admin-tabs button.active { color:#fff;background:#27213f; }
.admin-global-status { min-height:22px;margin:10px 2px 18px;color:#9f92ff;font-size:12px; }
.admin-global-status.error { color:#ff8ca2; }
.admin-section { display:none;animation:adminIn .2s ease; }
.admin-section.active { display:block; }
@keyframes adminIn { from { opacity:0;transform:translateY(5px); } }
.admin-stat-grid { display:grid;grid-template-columns:repeat(6,minmax(130px,1fr));gap:12px;margin-bottom:18px; }
.admin-stat-grid article { min-height:128px;padding:18px;border:1px solid #252b39;border-radius:16px;background:linear-gradient(155deg,#121725,#0d111a); }
.admin-stat-grid span,.admin-stat-grid small { display:block;color:#8993a5;font-size:11px; }
.admin-stat-grid b { display:block;margin:15px 0 7px;color:#fff;font-size:24px; }
.admin-overview-grid { grid-template-columns:1fr 1fr; }
.admin-card-head,.admin-section-head,.admin-account header,.admin-account footer,.admin-sync-card header,.admin-sync-card footer { display:flex;align-items:center;justify-content:space-between;gap:16px; }
.admin-card-head span,.admin-section-head>div>span,.admin-sync-card header>div>span { color:#8f7dff;font-size:9px;font-weight:800;letter-spacing:.16em; }
.admin-card-head h2,.admin-section-head h2 { margin:5px 0 0; }
.admin-card-head button { border:1px solid #3b4355;border-radius:9px;padding:8px 11px;color:#c9cfdb;background:#151b27;cursor:pointer; }
.admin-storage-total { padding:24px 0;border-bottom:1px solid #252b39; }
.admin-storage-total b { display:block;font-size:34px; }.admin-storage-total span { color:#8993a5; }
.admin-card dl { margin:10px 0 0; }.admin-card dl div { display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #1f2633; }.admin-card dt { color:#8993a5; }.admin-card dd { margin:0;font-weight:700; }
.admin-storage-list { display:grid;gap:9px;margin-top:16px; }.admin-storage-list>div { display:flex;justify-content:space-between;gap:15px;padding:9px 0;border-bottom:1px solid #202633; }.admin-storage-list span { min-width:0;display:flex;align-items:center;gap:10px; }.admin-storage-list b { overflow:hidden;text-overflow:ellipsis; }.admin-storage-list i { width:6px;height:6px;border-radius:50%;background:#7967e8; }.admin-storage-list strong { color:#aeb6c5; }
.admin-section-head { margin:2px 0 18px; }.admin-section-head h2 { font-size:27px; }.admin-section-head p { margin:8px 0 0;color:#8993a5; }.admin-section-head>input { width:min(320px,100%);padding:12px 14px;border:1px solid #31394a;border-radius:11px;color:#fff;background:#0a0e16; }
.admin-account-list,.admin-sync-list { display:grid;gap:13px; }
.admin-account,.admin-sync-card { padding:19px;border:1px solid #252b39;border-radius:17px;background:#10141e; }
.admin-account header { padding-bottom:15px;border-bottom:1px solid #252b39; }.admin-account header>div:first-child { display:grid;grid-template-columns:auto 1fr;gap:3px 9px;align-items:center; }.admin-account header b { font-size:16px; }.admin-account header small { color:#8993a5;font-size:10px; }.admin-account header>div:last-child { text-align:right; }.admin-account header>div:last-child strong,.admin-account header>div:last-child small { display:block; }
.admin-user-state { width:9px;height:9px;grid-row:1/3;border-radius:50%;background:#ffbd5b;box-shadow:0 0 12px currentColor; }.admin-user-state.active { color:#49dda3;background:#49dda3; }.admin-user-state.disabled { color:#ff6482;background:#ff6482; }
.admin-account-fields,.admin-sync-card>div { display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px;margin:16px 0; }
.admin-account label,.admin-sync-card label { display:grid;gap:6px;color:#8f99aa;font-size:10px; }.admin-account input,.admin-account select,.admin-sync-card input { width:100%;min-height:41px;padding:8px 10px;border:1px solid #303849;border-radius:9px;color:#f4f6fb;background:#0a0e16; }
.admin-account footer,.admin-sync-card footer { color:#8993a5;font-size:10px; }.admin-account footer button,.admin-sync-card footer button { padding:10px 14px;border:0;border-radius:9px;color:#fff;background:#7967e8;cursor:pointer;font-weight:700; }.admin-account footer button:disabled,.admin-sync-card footer button:disabled { opacity:.55; }
.admin-account { padding:15px 17px; }.admin-account header { padding-bottom:11px; }.admin-account header a { grid-column:2;color:#9e91ff;font-size:11px;text-decoration:none; }.admin-user-summary { min-width:210px; }.admin-user-summary em { display:block;margin-top:5px;color:#ffba55;font-size:9px;font-style:normal;font-weight:900;letter-spacing:.08em; }.admin-account.risk-yellow { border-color:#7d5b24;box-shadow:inset 3px 0 #e5a83e; }.admin-account.risk-red { border-color:#793343;box-shadow:inset 3px 0 #ff5f7d; }.admin-account.risk-red .admin-user-summary em { color:#ff718c; }.admin-account details { margin:10px 0; }.admin-account summary { cursor:pointer;color:#aeb6c5;font-size:11px;font-weight:700; }.admin-account details:not([open]) + footer { border-top:0; }.admin-account footer>div,.admin-plan footer>div { display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end; }.admin-account footer button.secondary { background:#283044; }.admin-account footer button.danger,.admin-plan button.danger { background:#351821;color:#ff9caf; }
.admin-plan-list { display:grid;grid-template-columns:repeat(2,minmax(360px,1fr));gap:13px; }.admin-plan { padding:18px;border:1px solid #252b39;border-radius:17px;background:#10141e; }.admin-plan header,.admin-plan footer { display:flex;justify-content:space-between;align-items:center;gap:16px; }.admin-plan header span { color:#66dcac;font-size:9px;font-weight:900;letter-spacing:.15em; }.admin-plan header h3 { margin:5px 0;font-size:20px; }.admin-plan header small,.admin-plan footer small { color:#8993a5; }.admin-plan header>strong { font-size:18px;text-align:right; }.admin-plan-fields { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0; }.admin-plan-fields label { display:grid;gap:5px;color:#8f99aa;font-size:10px; }.admin-plan-fields input,.admin-plan-fields select { min-height:39px;padding:8px;border:1px solid #303849;border-radius:9px;color:#f4f6fb;background:#0a0e16; }.admin-plan footer button,.admin-section-head>button { padding:10px 14px;border:0;border-radius:9px;color:#fff;background:#7967e8;cursor:pointer;font-weight:700; }
.admin-confirm { position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;background:rgba(2,4,9,.78);backdrop-filter:blur(10px); }.admin-confirm[hidden] { display:none; }.admin-confirm>div { position:relative;width:min(480px,100%);padding:28px;border:1px solid #343b4c;border-radius:20px;background:#10141e;box-shadow:0 30px 90px #000; }.admin-confirm span { color:#ff8ca2;font-size:9px;font-weight:900;letter-spacing:.16em; }.admin-confirm p { color:#a6afbf;line-height:1.55; }.admin-confirm code { display:block;padding:11px;border-radius:9px;color:#ffb2c0;background:#090c13;word-break:break-all; }.admin-confirm input { width:100%;margin:12px 0;padding:12px;border:1px solid #3a4355;border-radius:10px;color:#fff;background:#080b12; }.admin-confirm>div>button:last-child { width:100%;padding:12px;border:0;border-radius:10px;color:#fff;background:#b53652;font-weight:800; }.admin-confirm>div>button:last-child:disabled { opacity:.35; }.admin-confirm-close { position:absolute;right:14px;top:12px;border:0;color:#aab2c0;background:transparent;font-size:25px;cursor:pointer; }
.admin-sync-list { grid-template-columns:repeat(2,minmax(360px,1fr)); }.admin-sync-card header h3 { margin:5px 0 0;font-size:18px; }.admin-sync-card>div { grid-template-columns:repeat(3,1fr); }
.admin-switch { display:flex!important;grid-template:none!important;flex-direction:row;align-items:center;cursor:pointer; }.admin-switch input { position:absolute;opacity:0;pointer-events:none; }.admin-switch i { position:relative;width:38px;height:22px;border-radius:20px;background:#343b49; }.admin-switch i::after { content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:white;transition:.2s; }.admin-switch input:checked+i { background:#7967e8; }.admin-switch input:checked+i::after { transform:translateX(16px); }
@media (max-width:1100px) { .admin-stat-grid { grid-template-columns:repeat(3,1fr); }.admin-account-fields { grid-template-columns:repeat(2,1fr); } }
@media (max-width:820px) { .admin-overview-grid,.admin-sync-list,.admin-plan-list { grid-template-columns:1fr; }.admin-section-head { align-items:flex-start;flex-direction:column; }.admin-tabs { overflow-x:auto; }.admin-tabs button { white-space:nowrap; }.admin-sync-card>div,.admin-plan-fields { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px) { .admin-stat-grid { grid-template-columns:repeat(2,1fr); }.admin-account-fields,.admin-sync-card>div { grid-template-columns:1fr; }.admin-account footer,.admin-sync-card footer { align-items:stretch;flex-direction:column; }.admin-account footer button,.admin-sync-card footer button { width:100%; }.admin-shell { width:min(100% - 20px,1440px);padding-top:20px; } }
.admin-automation-layout { display:grid;grid-template-columns:minmax(560px,1.55fr) minmax(300px,.65fr);gap:16px;align-items:start;margin-bottom:16px; }
.admin-automation-settings-card { min-width:0; }.admin-automation-settings-card .admin-card-head input { width:min(270px,45%);padding:10px 12px;border:1px solid #31394a;border-radius:10px;color:#fff;background:#0a0e16; }
.admin-filter-row { display:flex;gap:7px;overflow:auto;padding:14px 0 10px;scrollbar-width:thin; }.admin-filter-row button { flex:0 0 auto;padding:8px 11px;border:1px solid #303849;border-radius:9px;color:#aeb6c5;background:#0a0e16;cursor:pointer;font-size:10px;font-weight:800; }.admin-filter-row button.active { color:#fff;border-color:#7967e8;background:#2a2247; }
.admin-setting-list { display:grid;gap:8px;max-height:720px;overflow:auto;padding-right:4px; }.admin-setting { display:grid;grid-template-columns:minmax(210px,1fr) minmax(120px,.42fr) auto;gap:12px;align-items:center;padding:12px;border:1px solid #252c3a;border-radius:12px;background:#0c111a; }.admin-setting.review { border-color:#6d4c25;background:#17130d; }.admin-setting.deprecated { opacity:.7; }.admin-setting b,.admin-setting small { display:block; }.admin-setting small { margin-top:4px;color:#8792a5;font-size:9px;line-height:1.45; }.admin-setting label { position:relative;margin:0; }.admin-setting input[type="number"],.admin-setting input[type="text"] { padding-right:45px; }.admin-setting label>span { position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#7f899a;font-size:9px;pointer-events:none; }.admin-setting-actions { display:flex;align-items:center;gap:7px; }.admin-setting-actions button { padding:9px 11px;border:0;border-radius:8px;color:#fff;background:#7967e8;cursor:pointer;font-weight:800; }.admin-setting-actions button:disabled { opacity:.45; }.admin-setting .admin-switch { margin:0; }
.admin-finding-list { display:grid;gap:9px;margin-top:14px; }.admin-finding-list article { padding:13px;border-left:3px solid #e7a347;border-radius:8px;background:#0b1018; }.admin-finding-list article.critical { border-color:#ff5e7c; }.admin-finding-list b { display:block;font-size:12px; }.admin-finding-list p { margin:6px 0 0;color:#929cad;font-size:10px;line-height:1.55; }
.admin-functions-card { margin-top:0; }.admin-function-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px; }.admin-function-grid article { min-width:0;padding:14px;border:1px solid #252c3a;border-radius:13px;background:#0c111a; }.admin-function-grid header { display:flex;justify-content:space-between;gap:8px;color:#8476e7;font-size:8px;font-weight:800;text-transform:uppercase; }.admin-function-grid h3 { margin:9px 0 6px;font-size:13px; }.admin-function-grid p { min-height:44px;margin:0;color:#929cad;font-size:9px;line-height:1.55; }.admin-function-grid footer { margin-top:10px;padding-top:9px;border-top:1px solid #222a37;color:#788396;font-size:8px; }
@media(max-width:1050px){.admin-automation-layout{grid-template-columns:1fr}.admin-function-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.admin-setting{grid-template-columns:1fr}.admin-automation-settings-card .admin-card-head{align-items:flex-start;flex-direction:column}.admin-automation-settings-card .admin-card-head input{width:100%}.admin-function-grid{grid-template-columns:1fr}}

/* Visual CMS */
.admin-visual-layout { display:grid;grid-template-columns:minmax(260px,.72fr) minmax(360px,1fr);gap:14px;align-items:start; }
.admin-catalog-card,.admin-overrides-card { max-height:780px;overflow:auto; }
.admin-preview-card { grid-column:1/-1; }
.admin-preview-card>p { color:#8993a5;font-size:11px; }
.admin-preview-card iframe { display:block;width:100%;height:min(76vh,920px);min-height:620px;border:1px solid #303849;border-radius:15px;background:#080b10; }
.visual-catalog { display:grid;gap:7px;max-height:580px;overflow:auto;padding-right:4px; }
.visual-catalog button { display:grid;grid-template-columns:auto 1fr;gap:3px 9px;width:100%;padding:10px;border:1px solid #252b39;border-radius:10px;color:#dce1ea;background:#0a0e16;text-align:left;cursor:pointer; }
.visual-catalog button:hover,.visual-catalog button.active { border-color:#7967e8;background:#18152a; }
.visual-catalog i { grid-row:1/3;align-self:center;padding:4px 6px;border-radius:6px;color:#a99dff;background:#292340;font-size:8px;font-style:normal;font-weight:900;text-transform:uppercase; }
.visual-catalog b { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px; }
.visual-catalog small { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7f899b;font-size:9px; }
.visual-form-actions { display:flex;gap:8px;margin-top:15px; }
.visual-form-actions button { flex:1;min-height:42px;border:0;border-radius:10px;color:#fff;background:#7967e8;cursor:pointer;font-weight:800; }
.visual-form-actions button.secondary { border:1px solid #343d50;background:#151b27;color:#aeb6c5; }
.visual-extra-fields { padding-top:8px;border-top:1px solid #252b39; }
.admin-overrides-card { grid-column:2; }
.override-list article.selected { border-color:#7967e8; }
.override-list [data-edit-visual] { border-color:#3c4560;background:#182033;color:#bac7e8; }
#toggleInspector { padding:10px 14px;border:1px solid #4b416e;border-radius:10px;color:#dcd6ff;background:#201a35;cursor:pointer;font-weight:800; }
#toggleInspector.off { color:#9ba4b4;background:#151b27;border-color:#343d50; }
@media (max-width:980px) { .admin-visual-layout { grid-template-columns:1fr; }.admin-overrides-card,.admin-preview-card { grid-column:1; }.admin-preview-card iframe { min-height:540px; } }