:root {
  color-scheme: light;
  --bg: #fff;
  --surface: #fff;
  --tint: #f4f6fd;
  --text: #141c32;
  --muted: #5d667a;
  --line: #e1e5ef;
  --primary: #2b50ef;
  --primary-hover: #1e40cf;
  --on-primary: #fff;
  --soft: #eaf0ff;
  --danger: #b42335;
  --danger-bg: #fff1f2;
  --focus: #2b50ef;
  --radius: 12px;
  --control-radius: 7px;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.5;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); }
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; }
button, a { touch-action: manipulation; }
button {
  min-height: 44px;
  padding: 9px 14px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text);
  border-radius: var(--control-radius);
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
  transition: background-color .15s, color .15s;
}
button:hover:not(:disabled) { background: var(--soft); }
button:disabled { opacity: .5; cursor: default; }
button.primary { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }
button.primary:hover:not(:disabled) { background: var(--primary-hover); border-color: var(--primary-hover); }
input, select, textarea {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: var(--control-radius);
  background: var(--surface);
  color: var(--text);
  padding: 10px 12px;
}
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
textarea { resize: vertical; }
label { display: block; color: var(--text); font-weight: 600; margin: 16px 0 6px; }
a { color: var(--primary); text-underline-offset: 3px; overflow-wrap: anywhere; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
h1 { font-size: 1.8rem; line-height: 1.25; margin: 0; }
h2 { font-size: 1.4rem; line-height: 1.3; margin: 0; }
h3 { font-size: 1rem; margin: 0 0 8px; }
p { margin: 12px 0; }
.muted { color: var(--muted); font-size: .9375rem; }
.error { color: var(--danger); white-space: pre-wrap; }
.error:empty { display: none; }
.actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.topbar {
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  padding: 10px max(20px, calc((100vw - 1280px)/2));
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.brand { display: flex; min-height: 44px; align-items: center; gap: 12px; color: var(--text); text-decoration: none; font-weight: 600; }
.brand picture { display: block; flex-shrink: 0; }
.brand img { display: block; width: 210px; height: 70px; object-fit: contain; }
.brand span { border-left: 1px solid var(--line); padding-left: 12px; }
main { max-width: 1280px; margin: auto; padding: 28px 20px max(32px, env(safe-area-inset-bottom)); }
.heading-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.auth-panel { max-width: 420px; margin: 48px auto; padding: 28px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.auth-panel .primary { width: 100%; margin-top: 12px; }
.password-field { display: flex; gap: 8px; }
.password-field input { flex: 1 1 0%; min-width: 0; }
#show-password { flex: 0 0 auto; min-width: 5rem; white-space: nowrap; overflow-wrap: normal; }
.standalone-status { text-align: center; }
.stats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin: 24px 0; }
.stats > div { background: var(--tint); color: var(--text); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; display: flex; flex-direction: column; }
.stats strong { font-size: 1.6rem; font-variant-numeric: tabular-nums; }
.stats span { font-size: .875rem; color: var(--muted); }
.stats .warning { border-color: var(--danger); color: var(--danger); }
.scope-nav { display: flex; gap: 8px; flex-wrap: wrap; padding: 4px 0 16px; }
.scope-nav button { border-color: transparent; background: transparent; color: var(--text); }
.scope-nav button[aria-current] { background: var(--soft); color: var(--primary); border-color: var(--line); }
.filters { display: flex; gap: 12px; align-items: center; }
.search-field { flex: 1; }
.filters > div:nth-child(2) { min-width: 180px; }
.lead-list { background: var(--surface); color: var(--text); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
table { border-collapse: collapse; width: 100%; text-align: left; }
th { color: var(--muted); font-size: .875rem; font-weight: 600; background: var(--tint); padding: 12px 16px; }
td { padding: 12px 16px; border-top: 1px solid var(--line); vertical-align: middle; }
td:first-child { width: 31%; }
.shop-name { display: block; border: 0; padding: 4px 0; min-height: 44px; text-align: left; color: var(--text); background: transparent; font-size: 1rem; line-height: 1.4; font-weight: 650; max-width: 100%; }
.shop-name:hover:not(:disabled) { background: transparent; color: var(--primary); }
.shop-suburb { display: block; color: var(--muted); font-size: .875rem; }
.listing-link { min-height: 44px; display: inline-flex; align-items: center; white-space: normal; }
.status-tag { font-size: .875rem; background: var(--soft); color: var(--primary); padding: 5px 8px; border-radius: var(--control-radius); display: inline-block; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.status-tag.danger { color: var(--danger); background: var(--danger-bg); }
.followup-date { display: block; margin-top: 4px; font-size: .875rem; color: var(--muted); }
.empty { padding: 32px 16px; text-align: center; color: var(--muted); }
.pagination { display: flex; justify-content: flex-end; align-items: center; gap: 16px; margin-top: 16px; }
.pagination span { color: var(--muted); font-size: .875rem; }
.notice { padding: 12px 16px; margin-top: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--soft); color: var(--text); white-space: pre-wrap; }
.notice.is-error { color: var(--danger); background: var(--danger-bg); border-color: var(--danger); }
dialog { max-height: calc(100dvh - 32px); max-width: 560px; width: calc(100% - 32px); padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); color: var(--text); overflow: auto; }
dialog::backdrop { background: rgb(16 22 37 / .65); }
.lead-dialog { max-width: 660px; }
.dialog-heading { display: flex; gap: 16px; justify-content: space-between; align-items: flex-start; }
.dialog-heading h2 { padding-top: 6px; overflow-wrap: anywhere; }
.dialog-heading button { flex-shrink: 0; }
.dialog-footer { display: flex; align-items: center; justify-content: flex-end; gap: 12px; flex-wrap: wrap; margin-top: 20px; }
.dialog-footer > span { flex: 1; min-width: 180px; }
.lead-links { margin: 16px 0; }
.lead-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 9px 12px; border: 1px solid var(--line); border-radius: var(--control-radius); background: var(--surface); color: var(--primary); line-height: 1.4; text-decoration: none; }
.lead-links a:hover { background: var(--soft); }
.facts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 24px; margin: 20px 0; }
.facts > div { min-width: 0; overflow-wrap: anywhere; }
.facts dt { color: var(--muted); font-size: .875rem; }
.facts dd { margin: 0; color: var(--text); font-size: 1rem; font-weight: 600; }
.conflict { margin-top: 20px; padding: 16px; border: 1px solid var(--danger); border-radius: var(--radius); background: var(--danger-bg); color: var(--text); }
.conflict pre { font: inherit; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 200px; overflow: auto; padding: 12px; background: var(--surface); color: var(--text); border: 1px solid var(--line); border-radius: var(--control-radius); }
.checkbox-label { font-weight: 400; display: flex; align-items: center; gap: 12px; margin-top: 20px; min-height: 44px; cursor: pointer; }
.checkbox-label input { width: 24px; min-height: 24px; flex-shrink: 0; accent-color: var(--primary); }
.draft-row { padding: 16px 0; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.draft-row > div { min-width: 0; overflow-wrap: anywhere; }
.draft-row p { margin: 0; }
.report-list { padding-left: 24px; font-size: .9375rem; }
.skip-link { position: absolute; left: 12px; top: -100px; z-index: 50; background: var(--surface); color: var(--primary); padding: 12px; }
.skip-link:focus { top: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
details { border: 1px solid var(--line); border-radius: var(--radius); padding: 0 12px; margin: 16px 0; }
summary { cursor: pointer; min-height: 44px; display: list-item; padding: 10px 0; color: var(--text); font-weight: 600; }
details[open] { padding-bottom: 16px; }
summary:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.campaign-tag { display: inline-block; margin-top: 6px; padding: 3px 8px; border-radius: var(--control-radius); background: var(--soft); color: var(--primary); font-size: .875rem; font-weight: 600; line-height: 1.4; max-width: 100%; overflow-wrap: anywhere; }
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg: #101625;
    --surface: #171f31;
    --tint: #141c2e;
    --text: #f4f6fd;
    --muted: #adb7cd;
    --line: #2a354d;
    --primary: #a9bbff;
    --primary-hover: #c4d0ff;
    --on-primary: #101b3c;
    --soft: #26375e;
    --danger: #ffa4b1;
    --danger-bg: #38232e;
    --focus: #a9bbff;
  }
}
@media (max-width: 950px) {
  .stats { gap: 8px; }
  .stats > div { padding: 12px; }
  .stats strong { font-size: 1.35rem; }
  td, th { padding: 12px; }
  .topbar { padding: 8px 20px; }
  .topbar .actions { gap: 6px; }
  .topbar button { padding: 9px 10px; }
}
@media (max-width: 740px) {
  main { padding: 20px 16px max(32px, env(safe-area-inset-bottom)); }
  .topbar { padding: 8px 16px 12px; gap: 8px; }
  .topbar .actions { width: 100%; }
  .topbar .actions button { flex: 1 1 auto; padding: 9px 8px; }
  .brand img { width: 192px; height: 64px; }
  .heading-row { align-items: flex-start; }
  .heading-row .actions { width: 100%; }
  .heading-row .actions .primary { flex: 1; }
  .stats { grid-template-columns: repeat(2, 1fr); margin: 20px 0; }
  .stats > div { padding: 12px 16px; }
  .stats .storage { grid-column: span 2; flex-direction: row; gap: 8px; align-items: baseline; }
  .stats .storage strong { font-size: 1.1rem; }
  .scope-nav { gap: 4px; }
  .scope-nav button { padding: 9px 10px; }
  .filters { flex-wrap: wrap; gap: 8px; }
  .search-field { flex-basis: 100%; }
  .filters > div:nth-child(2) { flex: 1; min-width: 0; }
  .lead-list { border: 0; border-radius: 0; background: transparent; }
  table, tbody { display: block; }
  thead { display: none; }
  tr { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; padding: 16px; background: var(--surface); color: var(--text); border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 12px; }
  td { display: block; padding: 0; border: 0; overflow-wrap: anywhere; min-width: 0; }
  td:first-child { width: auto; grid-column: span 2; }
  td::before { content: attr(data-label); display: block; font-size: .875rem; color: var(--muted); margin-bottom: 3px; }
  td:first-child::before, td:last-child::before { display: none; }
  .listing-link { padding: 0; }
  .pagination { justify-content: space-between; gap: 8px; }
  .pagination span { text-align: center; }
  .auth-panel { margin-top: 24px; padding: 24px; }
  .dialog-footer > button { flex-grow: 1; }
  dialog { padding: 20px; max-height: calc(100dvh - 24px); width: calc(100% - 24px); }
  .facts { gap: 12px 16px; }
  .dialog-heading h2 { font-size: 1.25rem; }
  .dialog-heading { gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}

.phone-focus { border: 1px solid var(--primary); border-radius: var(--radius); background: var(--tint); padding: 22px; margin: 22px 0; }
.phone-focus-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.phone-focus h2 { font-size: 1rem; color: var(--primary); }
.phone-focus h3 { font-size: 1.55rem; line-height: 1.3; margin: 16px 0 6px; overflow-wrap: anywhere; }
.phone-focus p { margin: 8px 0; }
.phone-follow { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: .9375rem; min-height: 44px; cursor: pointer; }
.phone-follow input { width: 20px; min-height: 20px; accent-color: var(--primary); }
.phone-shop-notes { white-space: pre-wrap; max-height: 8rem; overflow: auto; }
.phone-focus .actions { margin-top: 16px; gap: 12px; }
.phone-focus-number { font-variant-numeric: tabular-nums; }
tr.is-phone-focus { background: var(--soft); }
tr.is-phone-focus .shop-name::before { content: 'iPhone · '; color: var(--primary); }
@media (max-width: 600px) { .phone-focus { padding: 16px; } .phone-focus h3 { font-size: 1.3rem; } }
/* Team workspace: shared brand tokens, compact navigation, readable data. */
.workspace-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}.workspace-bar>span{font-weight:600}.workspace-nav{display:flex;gap:6px;overflow-x:auto;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:28px}.workspace-nav button{white-space:nowrap;border:0;background:transparent;color:var(--muted)}.workspace-nav button[aria-current]{background:var(--soft);color:var(--primary)}.team-card{padding:22px;border:1px solid var(--line);border-radius:var(--radius);margin:20px 0;max-width:850px}.team-card h2{font-size:1.1rem}.team-card p:last-child{margin-bottom:0}.team-card input{margin-bottom:14px}.team-table{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);margin:16px 0}.team-table table{width:100%;min-width:650px}.team-table td>div{display:flex;flex-direction:column;gap:5px}.team-table input[type=checkbox]{width:20px;height:20px;min-height:20px}.inventory-filters{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.7fr;gap:10px;align-items:end}.inventory-filters label{font-size:.875rem;margin:0 0 6px}.assignment-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.assignment-toolbar select{width:auto;min-width:180px}.script-card p{white-space:pre-line;line-height:1.7}.text-button{border:0;background:transparent;color:var(--primary);padding-left:0;text-align:left}.phone-focus select{max-width:210px}#team-workspace details a{display:block;margin:14px 0}#team-lead-actions{margin:14px 0}.checkbox-label input{width:20px;min-height:20px}.auth-panel #forgot-password{margin:8px 0 0}
@media(max-width:800px){.inventory-filters{grid-template-columns:1fr 1fr}.inventory-filters>div:first-child,.inventory-filters>div:nth-child(5){grid-column:1/-1}.workspace-nav{margin-left:-6px;margin-right:-6px}.workspace-bar>a{font-size:.9rem}.team-card{padding:18px}.assignment-toolbar select{flex:1}.team-table table{min-width:650px}.topbar .actions button{font-size:.875rem;padding:8px}.brand img{width:170px;height:56px}}
