/* Ads-only client portal (js/ads-portal.js).
   One dark ground, one centred column, large light type, hairline dividers,
   aqua used in at most three places per screen. No sidebar, no cards.
   Tokens live in tokens.css (rule 3); every colour here is a var(--ads-…). */

.ads{min-height:100vh;background:var(--ads-bg);color:var(--ads-ink);font-family:var(--font);
  display:flex;flex-direction:column;align-items:center;padding:40px 24px 72px;
  -webkit-font-smoothing:antialiased;}
.ads *{box-sizing:border-box;}
.ads a{color:var(--ads-accent);text-decoration:none;cursor:pointer;}
.ads__col{width:100%;max-width:680px;display:flex;flex-direction:column;gap:56px;}

/* ---------- top line ---------- */
.ads__nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;}
.ads__who{font-size:14px;color:var(--ads-muted);}
/* stakeholder logins: the business name becomes a quiet picker */
.ads__switch{position:relative;}
.ads__switch__btn{font-family:var(--font);font-size:14px;color:var(--ads-muted);background:none;border:0;
  padding:12px 0;min-height:44px;cursor:pointer;display:inline-flex;align-items:center;gap:10px;transition:color .15s;}
.ads__switch__btn:hover,.ads__switch.open .ads__switch__btn{color:var(--ads-ink);}
.ads__switch__btn:focus-visible{outline:1px solid var(--ads-accent);outline-offset:4px;}
.ads__switch__chev{width:6px;height:6px;border-right:1px solid var(--ads-accent);border-bottom:1px solid var(--ads-accent);
  transform:translateY(-2px) rotate(45deg);transition:transform .15s;}
.ads__switch.open .ads__switch__chev{transform:translateY(1px) rotate(-135deg);}
.ads__switch__menu{position:absolute;top:100%;left:0;z-index:10;min-width:220px;display:flex;flex-direction:column;
  background:var(--ads-bg);border:1px solid var(--ads-line);padding:6px 0;}
.ads__switch__menu[hidden]{display:none;}
.ads__switch__menu button{font-family:var(--font);font-size:14px;font-weight:300;text-align:left;color:var(--ads-muted);
  background:none;border:0;padding:12px 18px;min-height:44px;cursor:pointer;white-space:nowrap;}
.ads__switch__menu button:hover,.ads__switch__menu button:focus-visible{color:var(--ads-ink);outline:none;background:var(--ads-line);}
.ads__switch__menu button.on{color:var(--ads-accent);}
.ads__links{display:flex;flex-wrap:wrap;column-gap:28px;row-gap:0;}
.ads__links a{font-size:14px;color:var(--ads-muted);padding:12px 0;border-bottom:1px solid transparent;}
.ads__links a.on{color:var(--ads-ink);border-bottom-color:var(--ads-accent);}
.ads__banner{font-size:13px;color:var(--ads-muted);display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;
  padding:10px 0;border-bottom:1px solid var(--ads-line);margin-bottom:-32px;}

/* ---------- type ---------- */
.ads h1{margin:0;font-size:40px;font-weight:300;line-height:1.15;letter-spacing:-.01em;color:var(--ads-ink);}
.ads__row{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px;}
.ads__p{margin:0;font-size:22px;font-weight:300;line-height:1.5;}
.ads__p--soft{color:var(--ads-soft);font-size:16px;}
.ads__meta{font-size:13px;color:var(--ads-dim);}
.ads__meta--accent{color:var(--ads-accent);}
/* the organic insight: the page it names is a quiet underlined link */
.ads .ads__insight a{color:var(--ads-ink);border-bottom:1px solid var(--ads-line-strong);padding-bottom:1px;}
.ads .ads__insight a:hover{border-bottom-color:var(--ads-accent);}
.ads__tag{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ads-dim);}
/* a section title that should stand out a little more (Results: From your ads, From organic) */
.ads__tag--strong{font-size:13px;font-weight:600;color:var(--ads-soft);}
.ads__tag__soft{font-weight:400;color:var(--ads-dim);}
.ads__foot{font-size:13px;color:var(--ads-dim);display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;justify-content:space-between;
  border-top:1px solid var(--ads-line);padding-top:20px;}
.ads__foot__links{display:flex;align-items:center;gap:24px;}
.ads .ads__foot__links a{color:var(--ads-muted);}
.ads .ads__foot__links a:hover,.ads .ads__foot__links a.on{color:var(--ads-ink);}
.ads__hr{height:1px;background:var(--ads-line);}
.ads__stack{display:flex;flex-direction:column;gap:12px;}
.ads__stack--lg{gap:24px;}
.ads__stack--xl{gap:32px;}

/* ---------- the three numbers; a second row "Without ads" when the month has one ---------- */
.ads__rows{display:flex;flex-direction:column;gap:40px;}
.ads__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
.ads__stat{display:flex;flex-direction:column;gap:8px;}
.ads__big{font-size:64px;font-weight:300;line-height:1;letter-spacing:-.02em;}
.ads__lab{font-size:14px;color:var(--ads-muted);}
.ads__delta{font-size:13px;color:var(--ads-accent);}
.ads__delta--dim{color:var(--ads-dim);}

/* month switcher: small text, the current month is the heading itself */
.ads__months{display:flex;gap:20px;}
.ads__months button{font-family:var(--font);font-size:14px;color:var(--ads-muted);background:none;border:0;padding:10px 0;cursor:pointer;}
.ads__months button:hover{color:var(--ads-ink);}

/* the year beside a month heading when it is not this year */
.ads__year{font-size:20px;color:var(--ads-muted);margin-left:8px;}

/* every month, grouped by year: one line each, tap to open */
.ads__list{display:flex;flex-direction:column;gap:0;margin-top:-24px;}
.ads__list .ads__tag{padding:20px 0 8px;}
.ads__mrow{font-family:var(--font);display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:24px;align-items:baseline;
  width:100%;text-align:left;background:none;border:0;border-top:1px solid var(--ads-line);padding:14px 0;cursor:pointer;
  color:var(--ads-ink);font-size:16px;font-weight:300;min-height:44px;}
.ads__mrow span:nth-child(2),.ads__mrow span:nth-child(3){font-size:14px;color:var(--ads-muted);white-space:nowrap;}
.ads__mrow:hover span:first-child,.ads__mrow.on span:first-child{color:var(--ads-accent);}
.ads__mrow:last-child{border-bottom:1px solid var(--ads-line);}

/* where the leads came from: a 2px track per source */
.ads__bars{display:flex;flex-direction:column;gap:14px;}
.ads__bar{display:flex;align-items:center;gap:16px;}
.ads__bar__lab{font-size:14px;color:var(--ads-muted);width:120px;flex:none;}
.ads__track{flex:1;height:2px;background:var(--ads-line);}
.ads__fill{height:100%;background:var(--ads-accent);}
.ads__fill--alt{background:var(--ads-ink);}
.ads__bar__val{font-size:14px;width:96px;flex:none;text-align:right;}
/* where the searches go: longer product names, a short percentage */
.ads__bars--share .ads__bar__lab{width:170px;}
.ads__bars--share .ads__bar__val{width:48px;}
@media (max-width:520px){.ads__bars--share .ads__bar__lab{width:120px;}}

/* ---------- chips, fields, buttons ---------- */
.ads__chips{display:flex;flex-wrap:wrap;gap:10px;}
.ads__chip{font-family:var(--font);font-size:14px;color:var(--ads-ink);background:none;padding:10px 18px;
  border:1px solid var(--ads-line-strong);border-radius:999px;min-height:44px;cursor:pointer;
  display:inline-flex;align-items:center;transition:border-color .15s,background .15s,color .15s;}
.ads__chip:hover{border-color:var(--ads-muted);}
.ads__chip--quiet{color:var(--ads-muted);border-color:transparent;}
.ads__chip.on{background:var(--ads-grad);color:var(--ads-bg);border-color:transparent;}
.ads__chip:disabled{cursor:default;opacity:.7;}

.ads__ta{font-family:var(--font);font-size:18px;font-weight:300;line-height:1.5;padding:0 0 16px;
  background:none;border:0;border-bottom:1px solid var(--ads-line-strong);color:var(--ads-ink);
  resize:none;width:100%;outline:none;display:block;}
.ads__ta--lg{font-size:20px;}
.ads__ta::placeholder{color:var(--ads-dim);}
.ads__ta:focus{border-bottom-color:var(--ads-accent);}
.ads label.ads__q{display:block;font-size:40px;font-weight:300;line-height:1.2;}

.ads__btn{font-family:var(--font);font-size:14px;font-weight:500;color:var(--ads-bg);background:var(--ads-grad);
  border:0;border-radius:999px;padding:12px 24px;min-height:44px;cursor:pointer;box-shadow:var(--ads-glow);
  display:inline-flex;align-items:center;justify-content:center;text-decoration:none;}
.ads__btn:disabled{opacity:.55;cursor:default;box-shadow:none;}
.ads__link{font-family:var(--font);font-size:14px;color:var(--ads-accent);background:none;border:0;padding:10px 0;cursor:pointer;}
.ads__quiet{font-family:var(--font);font-size:14px;color:var(--ads-muted);background:none;border:0;padding:10px 0;cursor:pointer;}
.ads__quiet:hover,.ads__link:hover{color:var(--ads-ink);}
.ads__actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;}
.ads__actions__r{display:flex;align-items:center;gap:24px;}
.ads__msg{font-size:13px;color:var(--ads-dim);}
.ads__msg:empty{display:none;}
.ads__msg--err{color:var(--ads-ink);}

/* ---------- your business: label left, one sentence right ---------- */
.ads__dl{margin:0;display:flex;flex-direction:column;}
.ads__dl > div{display:grid;grid-template-columns:180px minmax(0,1fr);gap:24px;padding:28px 0;border-top:1px solid var(--ads-line);}
.ads__dl > div:last-child{border-bottom:1px solid var(--ads-line);}
.ads__dl dt{margin:0;font-size:14px;color:var(--ads-muted);}
.ads__dl dd{margin:0;font-size:18px;font-weight:300;line-height:1.5;white-space:pre-line;overflow-wrap:anywhere;}

/* ---------- tell us: earlier notes ---------- */
.ads__log{display:flex;flex-direction:column;gap:20px;}
.ads__log__item{display:flex;flex-direction:column;gap:4px;}
.ads__log__item p{margin:0;font-size:16px;font-weight:300;line-height:1.5;color:var(--ads-soft);white-space:pre-line;overflow-wrap:anywhere;}

/* ---------- get started ---------- */
.ads--center{justify-content:center;padding-top:48px;}
.ads__progress{display:flex;align-items:center;justify-content:space-between;gap:16px;}
.ads__dashes{display:flex;gap:6px;}
.ads__dashes span{width:24px;height:2px;background:var(--ads-line);}
.ads__dashes span.on{background:var(--ads-accent);}

/* ---------- phone ---------- */
@media (max-width:640px){
  .ads{padding:24px 16px 56px;}
  .ads__col{gap:40px;}
  .ads h1,.ads label.ads__q{font-size:32px;}
  .ads__links{gap:18px;}
  .ads__stats{grid-template-columns:1fr;gap:28px;}
  .ads__big{font-size:52px;}
  .ads__p{font-size:19px;}
  .ads__dl > div{grid-template-columns:1fr;gap:6px;padding:20px 0;}
  .ads__bar__lab{width:76px;}
  .ads__bar__val{width:84px;}
}

/* Your market: the temperature dial, its word and line beside it */
.ads__temp{display:flex;align-items:center;gap:28px;}
.ads__dial{width:120px;height:64px;flex:none;}
.ads__dial__seg{fill:none;stroke:var(--ads-line-strong);stroke-width:6;stroke-linecap:round;}
.ads__dial__seg.on{stroke:var(--ads-accent);}
.ads__dial__needle{stroke:var(--ads-ink);stroke-width:2;stroke-linecap:round;}
.ads__dial__hub{fill:var(--ads-ink);}
.ads__temp__word{font-size:28px;font-weight:300;line-height:1.1;}
@media (max-width:520px){.ads__temp{gap:18px;}.ads__dial{width:96px;height:52px;}.ads__temp .ads__p--soft{font-size:15px;}}
/* how crowded each bar is: a quiet word after the share */
.ads__bars--crowd .ads__bar__val{width:44px;}
.ads__crowd{font-size:12px;width:64px;flex:none;text-align:right;color:var(--ads-dim);}
.ads__crowd--crowded{color:var(--ads-soft);}
/* insights: plain statements, a small aqua mark, hairlines between */
.ads__insights{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;}
.ads__insights li{position:relative;padding:14px 0 14px 20px;border-top:1px solid var(--ads-line);font-size:17px;font-weight:300;line-height:1.5;}
.ads__insights li::before{content:"";position:absolute;left:0;top:25px;width:6px;height:6px;border-radius:50%;background:var(--ads-accent);}
@media (max-width:520px){.ads__insights li{font-size:16px;}.ads__insights li::before{top:24px;}}
/* five links: on a phone they stay one row and swipe, rather than wrap */
@media (max-width:520px){
  .ads__links{flex-wrap:nowrap;overflow-x:auto;column-gap:22px;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
  .ads__links::-webkit-scrollbar{display:none;}
  .ads__links a{white-space:nowrap;}
}
.ads__list--flush{margin-top:0;}

/* ---------- footer: the light switch (stakeholder logins): a filled track, the knob in ink ---------- */
.ads__theme{display:inline-flex;align-items:center;gap:10px;color:var(--ads-muted);}
.ads__theme button{width:34px;height:20px;border-radius:999px;border:0;background:var(--ads-line-strong);padding:0;cursor:pointer;position:relative;flex:none;transition:background .15s;}
.ads__theme button i{position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:var(--ads-ink);transition:transform .15s;}
.ads__theme button[aria-checked="true"]{background:var(--ads-accent);}
.ads__theme button[aria-checked="true"] i{transform:translateX(14px);}
.ads__theme button:focus-visible{outline:1px solid var(--ads-accent);outline-offset:3px;}

/* ---------- how it works (stakeholder logins, js/ads-wiki.js) ---------- */
/* the section index sticks to the top as you read and marks the section in view; one row that swipes when narrow */
.ads__index{position:sticky;top:0;z-index:5;background:var(--ads-bg);display:flex;flex-wrap:nowrap;overflow-x:auto;column-gap:22px;
  padding:4px 0;margin:-24px 0;border-bottom:1px solid var(--ads-line);scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.ads__index::-webkit-scrollbar{display:none;}
.ads__index a{font-size:14px;color:var(--ads-muted);padding:12px 0;white-space:nowrap;flex:none;border-bottom:1px solid transparent;}
.ads__index a:hover{color:var(--ads-ink);}
.ads__index a.on{color:var(--ads-ink);border-bottom-color:var(--ads-accent);}
.ads__wiki section{scroll-margin-top:64px;}
.ads__wiki .ads__p{font-size:19px;}
.ads__wiki .ads__p--soft{font-size:16px;}
.ads__dl--wiki > div{padding:18px 0;grid-template-columns:160px minmax(0,1fr);}
.ads__dl--wiki dt{color:var(--ads-ink);}
.ads__dl--wiki dd{font-size:16px;color:var(--ads-soft);white-space:normal;}
.ads__wiki__pages{display:flex;flex-direction:column;}
.ads__wiki__pages a{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px 14px;padding:16px 0;border-top:1px solid var(--ads-line);color:var(--ads-ink);}
.ads__wiki__pages a:last-child{border-bottom:1px solid var(--ads-line);}
.ads__wiki__pages i{font-style:normal;font-size:13px;color:var(--ads-accent);grid-row:span 2;padding-top:2px;}
.ads__wiki__pages b{font-weight:400;font-size:16px;}
.ads__wiki__pages span{font-size:14px;color:var(--ads-muted);line-height:1.5;}
.ads__wiki__pages a:hover b{color:var(--ads-accent);}
.ads__wiki__rhythm{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;}
.ads__wiki__rhythm > div{display:flex;flex-direction:column;gap:10px;min-width:0;border-top:1px solid var(--ads-line-strong);padding-top:14px;}
.ads__wiki__rhythm .ads__tag{margin-top:8px;}
.ads__insights--plain li{font-size:15px;padding:8px 0 8px 16px;border-top:0;}
.ads__insights--plain li::before{top:17px;width:4px;height:4px;background:var(--ads-dim);}
.ads__wiki__steps{list-style:none;margin:0;padding:0;counter-reset:s;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px;}
.ads__wiki__steps li{counter-increment:s;min-width:0;border-top:1px solid var(--ads-line);padding-top:12px;display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--ads-soft);line-height:1.5;}
.ads__wiki__steps li::before{content:counter(s,decimal-leading-zero);font-size:12px;color:var(--ads-dim);}
.ads__wiki__steps b{font-weight:400;font-size:16px;color:var(--ads-ink);}
.ads__tag--accent{color:var(--ads-accent);}
.ads__wiki .ads__insights li b{font-weight:400;color:var(--ads-ink);}
.ads__wiki .ads__insights li{font-size:15px;color:var(--ads-soft);}
.ads__wiki__faq details{border-top:1px solid var(--ads-line);}
.ads__wiki__faq details:last-of-type{border-bottom:1px solid var(--ads-line);}
.ads__wiki__faq summary{cursor:pointer;padding:14px 0;font-size:16px;color:var(--ads-ink);list-style:none;display:flex;justify-content:space-between;gap:16px;}
.ads__wiki__faq summary::-webkit-details-marker{display:none;}
.ads__wiki__faq summary::after{content:"+";color:var(--ads-dim);flex:none;}
.ads__wiki__faq details[open] summary::after{content:"\2212";}
.ads__wiki__faq p{margin:0;padding:0 0 16px;font-size:15px;color:var(--ads-soft);line-height:1.5;}
@media (max-width:640px){
  .ads__wiki__rhythm{grid-template-columns:1fr;}
  .ads__wiki__steps{grid-template-columns:1fr;}
  .ads__dl--wiki > div{grid-template-columns:1fr;gap:4px;padding:14px 0;}
}

/* light: section titles carry the accent so they hold their own on a pale ground (the colour does
   the work, not the weight); headings a touch heavier, since 300 reads thin on white; the big
   numbers stay light */
.ads--light h1,.ads--light label.ads__q{font-weight:400;}
.ads--light .ads__tag{color:var(--ads-accent);font-weight:400;}
.ads--light .ads__tag--strong{font-weight:500;}
.ads--light .ads__tag__soft{color:var(--ads-dim);font-weight:400;}
.ads--light .ads__p{font-weight:400;}

/* the wiki's one picture: an inline SVG drawn on tokens, so it follows light and dark; swipes on a phone */
.ads__fig{margin:0;display:flex;flex-direction:column;gap:14px;}
.ads__fig__scroll{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.ads__fig__scroll::-webkit-scrollbar{display:none;}
.ads__fig svg{display:block;min-width:620px;width:100%;height:auto;font-family:var(--font);}
.ads__fig text{fill:var(--ads-ink);font-size:12px;font-weight:300;}
.ads__fig .t-b{font-size:13px;font-weight:400;}
.ads__fig .t-dim{fill:var(--ads-dim);font-size:10.5px;}
.ads__fig .t-lbl{fill:var(--ads-dim);font-size:10px;letter-spacing:.08em;}
.ads__fig .t-acc{fill:var(--ads-accent);}
.ads__fig .bx{fill:none;stroke:var(--ads-line-strong);}
.ads__fig .bx-acc{fill:none;stroke:var(--ads-accent);stroke-width:1.2;}
.ads__fig .ln{fill:none;stroke:var(--ads-muted);stroke-width:1.1;}
.ads__fig .ln-acc{stroke:var(--ads-accent);}
.ads__fig .hair{stroke:var(--ads-line);}
.ads__fig .arr{fill:var(--ads-muted);}
.ads__fig .arr-acc{fill:var(--ads-accent);}
.ads__fig figcaption{line-height:1.5;}