/* Customer account (pingpaid.ca/account) and admin site. */
@font-face { font-family: "Inter"; font-weight: 400; font-display: swap; src: url(/fonts/inter-400.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 500; font-display: swap; src: url(/fonts/inter-500.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 600; font-display: swap; src: url(/fonts/inter-600.woff2) format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-weight: 500; font-display: swap; src: url(/fonts/mono-500.woff2) format("woff2"); }
:root {
  --green: #0E7C66; --green-dark: #0B5E4E; --mint: #E7F4F0; --mist: #F2FAF7; --ping: #9BE3CF; --mint-line: #B7DFD3;
  --ink: #1D2327; --slate: #50575E; --muted: #757575; --line: #E0E0E0; --soft: #F0F0F0; --paper: #F6F7F7; --field: #949494;
  --amber-bg: #FFF8E6; --amber-line: #F0DCA0; --amber-ink: #4D3800;
  --red: #8A2424; --red-bg: #FCF0F1; --red-dot: #D63638; --ok-bg: #E6F4EA; --ok-ink: #1E5631; --ok-dot: #008A20; --warn-dot: #DBA617;
  --ring: 0 0 0 1px rgba(0,0,0,.08), 0 1px 3px rgba(0,0,0,.04);
  --mono: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 14px/1.5 Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--green); }
a:hover { color: var(--green-dark); }
:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 22px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
h2 { font-size: 15px; font-weight: 600; }
code, .mono { font-family: var(--mono); font-size: 13px; }
.muted { color: var(--muted); }
.slate { color: var(--slate); }
.small { font-size: 13px; }
.xs { font-size: 12px; }
.b { font-weight: 600; }
.right { text-align: right; }
.nowrap { white-space: nowrap; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.stack { display: flex; flex-direction: column; gap: 16px; }
.stack-s { display: flex; flex-direction: column; gap: 8px; }
.row { display: flex; align-items: center; gap: 12px; }
.row-wrap { flex-wrap: wrap; }
.grow { flex: 1; min-width: 0; }
.spread { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.mt { margin-top: 16px; }
.mt-s { margin-top: 8px; }

/* Cards and tables */
.card { background: #fff; border-radius: 8px; box-shadow: var(--ring); }
.card-pad { padding: 20px; }
.card-h { padding: 14px 20px; border-bottom: 1px solid var(--soft); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.card-f { padding: 14px 20px; border-top: 1px solid var(--soft); }
.card-key { box-shadow: 0 0 0 2px var(--green); }
.card-warn { box-shadow: 0 0 0 1px #F2C4C4; }
.list { margin: 0; padding: 0; list-style: none; }
.list > li { display: flex; align-items: center; gap: 12px; padding: 14px 20px; border-bottom: 1px solid var(--soft); }
.list > li:last-child { border-bottom: 0; }
.t { width: 100%; border-collapse: collapse; font-size: 13px; }
.t th { text-align: left; font-weight: 500; color: var(--muted); padding: 9px 16px; border-bottom: 1px solid var(--soft); background: #FAFAFA; white-space: nowrap; }
.t td { padding: 11px 16px; border-bottom: 1px solid var(--soft); vertical-align: middle; }
.t tr:last-child td { border-bottom: 0; }
.t tr.sel td { background: var(--mist); }
.t-wrap { overflow-x: auto; }
.empty { padding: 32px 20px; text-align: center; color: var(--muted); }

/* Pills and dots */
.pill { display: inline-flex; align-items: center; min-height: 22px; padding: 1px 8px; border-radius: 99px; font-size: 12px; font-weight: 500; white-space: nowrap; }
.ok { background: var(--ok-bg); color: var(--ok-ink); }
.warn { background: #FCF9E8; color: #614200; }
.bad { background: var(--red-bg); color: var(--red); }
.mute { background: #F0F0F1; color: var(--slate); }
.info { background: var(--mint); color: var(--green-dark); }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.dot-ok { background: var(--ok-dot); } .dot-warn { background: var(--warn-dot); } .dot-bad { background: var(--red-dot); } .dot-mute { background: #A7AAAD; }

/* Buttons and fields */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 0 16px; border-radius: 6px; border: 0; background: var(--green); color: #fff !important; font-family: inherit; font-size: 14px; font-weight: 600; line-height: 1; text-decoration: none; cursor: pointer; white-space: nowrap; }
.btn:hover { background: var(--green-dark); }
.btn-2 { background: #fff; color: var(--ink) !important; box-shadow: inset 0 0 0 1px #C3C4C7; font-weight: 500; }
.btn-2:hover { background: #F6F7F7; }
.btn-danger { background: #fff; color: #B32D2E !important; box-shadow: inset 0 0 0 1px #E3A5A5; font-weight: 500; }
.btn-danger:hover { background: var(--red-bg); }
.btn-s { min-height: 30px; padding: 0 10px; font-size: 13px; }
.btn-block { width: 100%; }
.linkbtn { background: none; border: 0; padding: 0; font: inherit; color: var(--green); cursor: pointer; text-decoration: underline; }
form.inline { display: inline; }
.field { display: flex; flex-direction: column; gap: 6px; }
.label { font-weight: 500; font-size: 13px; }
.help { font-size: 12px; color: var(--muted); }
.input, select.input, textarea.input { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--field); border-radius: 6px; font: inherit; color: var(--ink); background: #fff; }
textarea.input { resize: vertical; min-height: 96px; line-height: 1.5; }
.input:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 1px var(--green); }
.check { display: flex; gap: 8px; align-items: flex-start; }
.check input { margin-top: 2px; accent-color: var(--green); }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }

/* Notices */
.notice { display: flex; gap: 10px; padding: 12px 16px; border-radius: 8px; font-size: 14px; }
.notice-info { background: var(--mist); color: var(--green-dark); box-shadow: inset 0 0 0 1px var(--mint-line); }
.notice-warning, .notice-outage { background: var(--amber-bg); color: var(--amber-ink); box-shadow: inset 0 0 0 1px var(--amber-line); }
.notice-error { background: var(--red-bg); color: var(--red); box-shadow: inset 0 0 0 1px #F2C4C4; }
.notice-ok { background: var(--ok-bg); color: var(--ok-ink); }
.banner { border-bottom: 1px solid var(--amber-line); }
.banner .notice { border-radius: 0; box-shadow: none; }
.banner-in { width: 100%; max-width: 1088px; margin: 0 auto; padding: 0 24px; }

/* Account shell */
.acct-top { height: 60px; background: #fff; border-bottom: 1px solid var(--line); display: flex; align-items: center; gap: 28px; padding: 0 28px; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; font-weight: 600; font-size: 15px; }
.tabs { display: flex; align-self: stretch; gap: 4px; }
.tabs a { display: flex; align-items: center; padding: 0 12px; color: var(--slate); text-decoration: none; }
.tabs a[aria-current="page"] { color: var(--ink); font-weight: 600; box-shadow: inset 0 -2px 0 var(--green); }
.acct-user { margin-left: auto; display: flex; align-items: center; gap: 16px; font-size: 13px; color: var(--slate); }
.acct-user .linkbtn { color: var(--slate); }
.acct-main { width: 100%; max-width: 1088px; margin: 0 auto; padding: 32px 24px 64px; }
.acct-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; }
.center-box { max-width: 420px; margin: 72px auto 0; padding: 0 16px; }
.auth-top { height: 64px; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; }
.bar { width: 100%; height: 6px; border: 0; border-radius: 99px; background: var(--soft); overflow: hidden; appearance: none; -webkit-appearance: none; }
.bar::-webkit-progress-bar { background: var(--soft); border-radius: 99px; }
.bar::-webkit-progress-value { background: var(--green); border-radius: 99px; }
.bar::-moz-progress-bar { background: var(--green); border-radius: 99px; }
.notes ul { margin: 0; padding-left: 18px; }

/* Ticket thread */
.thread { display: flex; flex-direction: column; gap: 14px; padding: 20px; }
.msg { max-width: 560px; padding: 12px 14px; border-radius: 8px; background: var(--paper); white-space: pre-wrap; overflow-wrap: anywhere; }
.msg-me { align-self: flex-end; background: var(--mint); }
.msg-note { background: #FFF8E6; box-shadow: inset 0 0 0 1px var(--amber-line); }
.msg-meta { display: block; margin-bottom: 4px; font-size: 12px; color: var(--slate); white-space: normal; }
.tk-list a { display: block; padding: 12px 16px; border-bottom: 1px solid var(--soft); color: var(--ink); text-decoration: none; }
.tk-list a[aria-current="true"] { background: var(--mist); box-shadow: inset 3px 0 0 var(--green); }
.tk-list a:hover { background: #FAFAFA; }

/* Admin shell */
.adm { display: flex; min-height: 100vh; background: linear-gradient(to right, #0B2E27 232px, var(--paper) 232px); }
.adm-side { width: 232px; flex: 0 0 auto; background: #0B2E27; padding: 18px 12px; display: flex; flex-direction: column; gap: 2px; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.adm-brand { display: flex; align-items: center; gap: 10px; padding: 0 8px 18px; color: #fff; font-weight: 600; font-size: 15px; text-decoration: none; }
.adm-badge { margin-left: auto; font-size: 10px; font-weight: 600; letter-spacing: .06em; color: var(--ping); border: 1px solid #2F5A50; border-radius: 4px; padding: 1px 5px; }
.adm-side a.nav { display: flex; align-items: center; gap: 10px; min-height: 36px; padding: 0 12px; border-radius: 6px; text-decoration: none; font-size: 13px; color: #B9CEC8; }
.adm-side a.nav:hover { color: #fff; background: rgba(255,255,255,.06); }
.adm-side a.nav[aria-current="page"] { background: rgba(255,255,255,.12); color: #fff; font-weight: 600; }
.adm-count { margin-left: auto; font-size: 11px; font-weight: 600; background: var(--red-dot); color: #fff; border-radius: 99px; padding: 0 7px; line-height: 18px; }
.adm-me { margin-top: auto; padding: 12px; border-radius: 8px; background: rgba(255,255,255,.06); color: #B9CEC8; font-size: 12px; }
.adm-me b { color: #fff; display: block; }
.adm-me .linkbtn { color: var(--ping); }
.adm-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.adm-top { height: 56px; display: flex; align-items: center; gap: 16px; padding: 0 28px; background: #fff; border-bottom: 1px solid var(--line); }
.adm-top form { width: 380px; max-width: 50vw; }
.adm-main { padding: 24px 28px 48px; display: flex; flex-direction: column; gap: 16px; }
.kpi { padding: 16px 18px; }
.kpi .v { font-size: 24px; font-weight: 600; letter-spacing: -.01em; margin-top: 2px; }
.filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.filters a.pill { min-height: 28px; padding: 0 12px; text-decoration: none; }
.hide { color: transparent; background: #E0E0E0; border-radius: 3px; user-select: none; }
.reveal { box-shadow: 0 0 0 2px var(--green); }
.kv { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 6px 16px; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; overflow-wrap: anywhere; }
.adm-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); }
.adm-tabs a { padding: 8px 14px; color: var(--slate); text-decoration: none; }
.adm-tabs a[aria-current="page"] { color: var(--ink); font-weight: 600; box-shadow: inset 0 -2px 0 var(--green); }
.secret-box { padding: 12px 14px; border-radius: 6px; background: var(--mist); box-shadow: inset 0 0 0 1px var(--mint-line); font-family: var(--mono); word-break: break-all; }
.dark-page { min-height: 100vh; background: #0B2E27; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 24px; }
.dark-page .path { font: 500 12px var(--mono); color: var(--ping); background: rgba(255,255,255,.06); border-radius: 6px; padding: 6px 12px; }
.dark-page .foot { color: #7FA79D; font-size: 12px; max-width: 400px; text-align: center; }

@media (max-width: 900px) {
  .adm { background: var(--paper); }
  .acct-grid, .grid-2, .grid-3, .grid-4 { grid-template-columns: minmax(0, 1fr); }
  .acct-top { padding: 0 16px; gap: 12px; overflow-x: auto; }
  .acct-user span { display: none; }
  .acct-main { padding: 24px 16px 48px; }
  .adm { flex-direction: column; }
  .adm-side { width: 100%; height: auto; position: static; flex-direction: row; flex-wrap: wrap; }
  .adm-me { display: none; }
  .adm-main, .adm-top { padding-left: 16px; padding-right: 16px; }
  .kv { grid-template-columns: minmax(0, 1fr); }
}
.grid-tk { display: grid; grid-template-columns: 320px minmax(0, 1fr) 280px; gap: 16px; align-items: start; }
@media (max-width: 1200px) { .grid-tk { grid-template-columns: minmax(0, 1fr); } }
.reveal .kv { grid-template-columns: 112px minmax(0, 1fr); }
.grid-log { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
.mail-frame { width: 100%; height: 640px; border: 0; background: var(--paper); border-radius: 0 0 8px 8px; }
.filters select.input, .filters input.input { width: auto; min-width: 160px; }
@media (max-width: 1200px) { .grid-log { grid-template-columns: minmax(0, 1fr); } }
.auth-card { width: 100%; max-width: 400px; }
[hidden] { display: none !important; }

/* Account v2: sidebar layout */
.ac { display: flex; min-height: 100vh; background: linear-gradient(to right, #fff 247px, #D9DDE3 247px, #D9DDE3 248px, #F3F4F6 248px); }
.ac-side { width: 248px; flex: 0 0 auto; background: #fff; border-right: 1px solid #D9DDE3; padding: 20px 14px; display: flex; flex-direction: column; gap: 4px; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.ac-brand { display: flex; align-items: center; gap: 10px; padding: 0 8px 20px; color: var(--ink); text-decoration: none; font-weight: 700; font-size: 17px; letter-spacing: -.01em; }
.ac-navs { display: flex; flex-direction: column; gap: 4px; }
.ac-nav { display: flex; align-items: center; gap: 12px; min-height: 40px; padding: 0 12px; border-radius: 8px; color: #374151; text-decoration: none; font-size: 14px; }
.ac-nav:hover { background: #F6F7F8; color: var(--ink); }
.ac-nav[aria-current="page"] { background: var(--mint); color: var(--green-dark); font-weight: 600; }
.ac-subnav { display: flex; flex-direction: column; gap: 2px; margin: 2px 0 6px 42px; }
.ac-subnav a { padding: 6px 10px; border-radius: 6px; font-size: 13px; color: #4B5563; text-decoration: none; }
.ac-subnav a:hover { background: #F6F7F8; }
.ac-subnav a[aria-current="page"] { color: var(--green-dark); font-weight: 600; background: var(--mist); }
.ac-me { margin-top: auto; padding: 12px; border-radius: 10px; background: #F6F7F8; font-size: 12px; color: #4B5563; display: flex; flex-direction: column; gap: 8px; }
.ac-me .linkbtn { color: #4B5563; font-size: 12px; }
.ac-email { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); font-size: 13px; }
.ac-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--green); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; flex: 0 0 auto; }
.ac-avatar-s { background: #E5E7EB; color: var(--ink); font-size: 13px; }
.ac-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ac-body .banner-in { max-width: none; padding: 0 12px; }
.ac-main { width: 100%; max-width: 1120px; padding: 28px 36px 64px; display: flex; flex-direction: column; gap: 18px; }
.ac-head { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.ac-head h1 { font-size: 26px; font-weight: 700; letter-spacing: -.02em; }
.ac-head p { margin-top: 4px; }
.ac .card { border-radius: 12px; border: 1px solid #D9DDE3; box-shadow: 0 1px 2px rgba(16,24,40,.06); }
.ac .card-h { background: #FAFBFC; border-bottom: 1px solid #E5E7EB; border-radius: 12px 12px 0 0; }
.ac .card-f { border-top: 1px solid #E5E7EB; }
.ac .list > li { border-bottom-color: #E9ECEF; }
.ac .t th { background: #FAFBFC; border-bottom-color: #E5E7EB; }
.ac .t td { border-bottom-color: #EEF0F2; }
.ac .ac-row-link { border-top-color: #E9ECEF; }
.ac .card-h { padding: 16px 24px; }
.ac .card-f { padding: 16px 24px; }
.ac .card-pad { padding: 20px 24px; }
.ac .list > li { padding: 14px 24px; }
.ac .pill { min-height: 24px; padding: 1px 10px; font-weight: 600; }
.ac .warn { background: #FFF4D6; color: #7A4E00; }
.ac-clip { overflow: hidden; }
.ac-split { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.ac-split-pitch { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: stretch; }
.ac-split-even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.ac-split-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ac-split-thread { grid-template-columns: minmax(0, 1fr) 280px; }
.ac-split-form { grid-template-columns: minmax(0, 1fr) 300px; }

/* Store card */
.ac-store { display: flex; align-items: center; gap: 16px; padding: 20px 24px; }
.ac-band-ok { background: var(--mist); border-bottom: 1px solid #D7EDE5; }
.ac-band-ok .ac-line { color: var(--ok-ink); }
.ac-band-warn { background: #FFF8E6; border-bottom: 1px solid var(--amber-line); }
.ac-band-warn .ac-line { color: var(--amber-ink); }
.ac-band-bad { background: var(--red-bg); border-bottom: 1px solid #F2C4C4; }
.ac-band-bad .ac-line { color: var(--red); }
.ac-line { margin-top: 2px; color: var(--slate); }
.ac-host { font-size: 17px; }
.ac-actions { justify-content: flex-end; }
.ac-init { width: 44px; height: 44px; border-radius: 10px; background: #F6F7F8; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; color: #4B5563; flex: 0 0 auto; }
.ac-status { width: 40px; height: 40px; border-radius: 50%; background: #16A34A; color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; font-weight: 700; font-size: 18px; }
.ac-status-warn { background: #D97706; }
.ac-status-bad { background: #DC2626; }
.ac-status-l { width: 64px; height: 64px; }
.ac-trialbar { display: block; width: 100%; height: 6px; border: 0; background: #F1F2F4; appearance: none; -webkit-appearance: none; }
.ac-trialbar::-webkit-progress-bar { background: #F1F2F4; }
.ac-trialbar::-webkit-progress-value { background: #D97706; }
.ac-trialbar::-moz-progress-bar { background: #D97706; }
.ac-tiles { display: grid; }
.ac-tiles-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ac-tiles-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ac-tile { padding: 18px 24px; border-right: 1px solid #F1F2F4; }
.ac-tile:last-child { border-right: 0; }
.ac-tiles-3:not(.ac-steps) .ac-tile, .ac-tiles-4 .ac-tile { border-top: 1px solid #F1F2F4; }
.ac-band-ok + .ac-tiles .ac-tile, .ac-band-warn + .ac-tiles .ac-tile, .ac-band-bad + .ac-tiles .ac-tile, .ac-trialbar + .ac-tiles .ac-tile { border-top: 0; }
.ac-tile-v { margin-top: 2px; font-size: 24px; font-weight: 700; letter-spacing: -.01em; }
.ac-fwd { font-size: 16px; font-weight: 600; }
.ac-ok { color: #16A34A; } .ac-warn { color: #B45309; } .ac-bad { color: #DC2626; }
.ac-step-h { font-size: 16px; }
.ac-steps .pill { align-self: flex-start; }
.ac-steps .btn { align-self: flex-start; }

/* Store card: one sentence per store */
.ac-sc { display: flex; align-items: center; gap: 18px; padding: 20px 24px; }
.ac-si { width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; font-size: 20px; line-height: 1; border: 1px solid; }
.ac-si-ok { background: #E8F6EE; color: #16A34A; border-color: #BFE5CD; }
.ac-si-warn { background: #FFF4DE; color: #D97706; border-color: #F5D9A3; }
.ac-si-bad { background: #FDECEC; color: #DC2626; border-color: #F5C2C2; }
.ac-si-mute { background: #F3F4F6; color: #6B7280; border-color: #E5E7EB; }
.ac-sc-h { font-size: 17px; font-weight: 600; margin-top: 2px; }
.ac-sc-main .slate { margin-top: 2px; }
.ac-sc-plan { padding: 0 20px; border-left: 1px solid #E5E7EB; width: 240px; flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.ac-sc-plan .pill { font-size: 13px; }
.ac-sc-act { flex: 0 0 auto; width: 170px; display: flex; justify-content: flex-end; }

/* Welcome (no store yet) */
.ac-fit { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); overflow: hidden; }
.ac-fit-main { padding: 22px 24px; display: flex; flex-direction: column; gap: 14px; }
.ac-fit-main h2 { font-size: 16px; font-weight: 700; }
.ac-fit-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ac-fit-list li { display: flex; gap: 12px; align-items: flex-start; }
.ac-fit-list b { display: block; }
.ac-fit-tick { width: 22px; height: 22px; border-radius: 50%; background: #E8F6EE; color: #15803D; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; margin-top: 1px; }
.ac-fit-side { padding: 22px 24px; background: #FAFBFC; border-left: 1px solid #E5E7EB; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.ac-mailhead { display: flex; align-items: center; gap: 8px; }
.ac-mailhead svg { color: #D93025; flex: 0 0 auto; }
.ac-steps3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ac-step { padding: 24px; border-right: 1px solid #E5E7EB; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.ac-step:last-child { border-right: 0; }
.ac-step-n { width: 32px; height: 32px; border-radius: 50%; background: var(--mint); color: var(--green-dark); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
.ac-step-n.on { background: var(--green); color: #fff; }
.ac-step .ac-step-h { font-size: 17px; }
.ac-step b { color: var(--ink); }
.ac-trialnote { display: flex; align-items: center; gap: 10px; padding: 12px 24px; border-top: 1px solid #E5E7EB; background: var(--mist); color: var(--green-dark); font-size: 13px; }
.ac-know summary { padding: 14px 24px; font-weight: 600; cursor: pointer; }
.ac-know ul { margin: 0; padding: 0 24px 18px 42px; display: flex; flex-direction: column; gap: 8px; }
.ac-know b { color: var(--ink); }

/* Premium pitch */
.ac-pitch { border-radius: 12px; border: 1px solid #0B5E4E; padding: 22px 24px; background: linear-gradient(135deg, #0E7C66, #0B5E4E); color: #fff; display: flex; flex-direction: column; gap: 12px; }
.ac-pitch-tag { align-self: flex-start; display: inline-flex; align-items: center; min-height: 24px; padding: 0 10px; border-radius: 99px; background: rgba(255,255,255,.16); font-size: 12px; font-weight: 600; }
.ac-pitch-h { font-size: 22px; font-weight: 700; line-height: 1.25; letter-spacing: -.01em; }
.ac-pitch-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; color: #D7F0E8; }
.ac-pitch-list li, .ac-checks li { display: flex; align-items: center; gap: 8px; }
.ac-pitch-note { color: #CDEDE4; }
.ac-btn-white { background: #fff; color: var(--green-dark) !important; }
.ac-btn-white:hover { background: #E7F4F0; }
.ac-checks { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.ac-checks svg, .ac-chk { color: var(--green); flex: 0 0 auto; display: inline-flex; }
.ac-todo { width: 16px; height: 16px; border-radius: 50%; border: 2px solid #D1D5DB; flex: 0 0 auto; }
.ac .list form { display: inline; }

/* Billing */
.ac-plan { padding: 18px 24px !important; }
.ac-plan.sel { background: var(--mist); box-shadow: inset 3px 0 0 var(--green); }
.ac-founding { margin: 0; padding: 12px 24px; background: var(--mist); border-bottom: 1px solid #CDEDE4; color: var(--green-dark, #0B5E4E); font-size: 14px; }
.ac-t { font-size: 14px; }
.ac-t th { padding: 10px 24px; }
.ac-t td { padding: 14px 24px; }
.ac-thanks { padding: 32px 36px; display: flex; align-items: center; gap: 28px; flex-wrap: wrap; background: var(--mist) !important; border-color: #CDEDE4 !important; }
.ac-thanks h1 { font-size: 26px; font-weight: 700; letter-spacing: -.02em; }
.ac-thanks p { margin-top: 6px; }
.ac-ok-ink { color: var(--ok-ink); }
.ac-thanks-wait { background: #fff !important; border-color: #D9DDE3 !important; }
.ac-spin { width: 40px; height: 40px; border-radius: 50%; border: 4px solid var(--mint); border-top-color: var(--green); animation: ac-spin 0.9s linear infinite; flex: 0 0 auto; }
@keyframes ac-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ac-spin { animation: none; } }
.ac-kv { grid-template-columns: 110px minmax(0, 1fr); font-size: 14px; }
.ac-kv.small { grid-template-columns: 64px minmax(0, 1fr); font-size: 13px; }

/* Help & tickets */
.ac-search { position: relative; }
.ac-search svg { position: absolute; left: 14px; top: 14px; color: var(--muted); }
.ac-search .input { min-height: 46px; padding-left: 42px; font-size: 15px; border-color: #C9CDD2; border-radius: 8px; }
.ac-row-link { display: flex; align-items: center; gap: 12px; padding: 14px 24px; border-top: 1px solid #F1F2F4; color: var(--ink); text-decoration: none; }
.ac-row-link:hover { background: #FAFAFA; color: var(--ink); }
.ac-row-link b { display: block; font-weight: 600; }
.ac-row-link .slate { display: block; }
.card-h + div > .ac-row-link:first-child { border-top: 0; }
.ac-more summary { padding: 12px 24px; border-top: 1px solid #F1F2F4; cursor: pointer; color: var(--green); font-size: 13px; }
.ac-foot { background: #FAFAFA; border-radius: 0 0 12px 12px; }
.ac-article { font-size: 15px; line-height: 1.65; }
.ac-ol { margin: 0; padding-left: 20px; }
.ac-tlink { color: var(--ink); text-decoration: none; }
.ac-tlink:hover { color: var(--green); }
.ac-tr:hover td { background: #FAFAFA; }
.ac .filters a.pill { min-height: 30px; padding: 0 14px; }
.ac-thread-card { display: flex; flex-direction: column; }
.ac-thread { padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.ac-msg { display: flex; align-items: flex-start; gap: 12px; }
.ac-msg-us { padding: 14px; border-radius: 10px; background: var(--mist); }
.ac-msg-us svg { flex: 0 0 auto; }
.ac-msg-body { margin-top: 4px; white-space: pre-wrap; overflow-wrap: anywhere; }
.ac-consent { padding: 12px 14px; border-radius: 10px; background: #F6F7F8; }

@media (max-width: 1000px) {
  .ac-fit, .ac-steps3, .ac-split, .ac-split-pitch, .ac-split-even, .ac-split-3, .ac-split-thread, .ac-split-form { grid-template-columns: minmax(0, 1fr); }
  .ac-tiles-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ac-tiles-4 .ac-tile:nth-child(2) { border-right: 0; }
}
@media (max-width: 760px) {
  .ac { flex-direction: column; }
  .ac-side { width: 100%; height: auto; position: static; flex-direction: row; align-items: center; flex-wrap: wrap; padding: 12px 16px; border-right: 0; border-bottom: 1px solid #E5E7EB; }
  .ac-brand { padding: 0 8px 0 0; }
  .ac-navs { flex-direction: row; overflow-x: auto; width: 100%; order: 3; }
  .ac-nav { white-space: nowrap; }
  .ac-nav svg { display: none; }
  .ac-subnav { display: none; }
  .ac-me { margin: 0 0 0 auto; padding: 0; background: none; flex-direction: row; align-items: center; }
  .ac-me .row { display: none; }
  .ac-main { padding: 20px 16px 48px; }
  .ac-tiles-3, .ac-tiles-4 { grid-template-columns: minmax(0, 1fr); }
  .ac-tile { border-right: 0; border-top: 1px solid #F1F2F4; }
  .ac-step { border-right: 0; border-bottom: 1px solid #E5E7EB; }
  .ac-fit-side { border-left: 0; border-top: 1px solid #E5E7EB; }
  .ac { background: #F6F7F8; }
  .ac-store { flex-wrap: wrap; }
  .ac-store > .grow { flex: 1 1 calc(100% - 64px); }
  .ac-actions { justify-content: flex-start; }
  .ac-thanks { padding: 24px; }
  .ac-sc { flex-wrap: wrap; align-items: flex-start; }
  .ac-sc-main { flex: 1 1 calc(100% - 64px); }
  .ac-sc-act { width: auto; }
  .ac-sc-plan { border-left: 0; padding: 12px 0 0; border-top: 1px solid #E5E7EB; width: 100%; min-width: 0; flex-direction: row; align-items: center; }
}