/* Shared colour layer for the tool pages: each step of the research journey has its own tone
   (Learn = gold, Collect = purple, Analyse = teal), matching the homepage. */
body[data-tone]{--tone:#0F6B73;--tone-soft:#E3F5F0;--tone-line:#BFE8DE;--tone-dot:#7FD6C2}
body[data-tone="learn"]{--tone:#93600F;--tone-soft:#FDF3DD;--tone-line:#F3D9A4;--tone-dot:#F2C46B}
body[data-tone="collect"]{--tone:#5B52BF;--tone-soft:#ECEBFA;--tone-line:#CFCBF2;--tone-dot:#B3ACF5}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) body[data-tone]{--tone:#7FD6C2;--tone-soft:#173A3B;--tone-line:#24504F}
  :root:not([data-theme="light"]) body[data-tone="learn"]{--tone:#F2C46B;--tone-soft:#3A2F17;--tone-line:#5A4A26}
  :root:not([data-theme="light"]) body[data-tone="collect"]{--tone:#B3ACF5;--tone-soft:#272452;--tone-line:#3C3870}}
:root[data-theme="dark"] body[data-tone]{--tone:#7FD6C2;--tone-soft:#173A3B;--tone-line:#24504F}
:root[data-theme="dark"] body[data-tone="learn"]{--tone:#F2C46B;--tone-soft:#3A2F17;--tone-line:#5A4A26}
:root[data-theme="dark"] body[data-tone="collect"]{--tone:#B3ACF5;--tone-soft:#272452;--tone-line:#3C3870}

body[data-tone] .steptag{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.3);color:#fff;font-size:13px;font-weight:700;padding:4px 12px;border-radius:99px;margin:0 0 10px;text-decoration:none;font-family:inherit;letter-spacing:0}
body[data-tone] .steptag i{width:9px;height:9px;border-radius:50%;background:var(--tone-dot)}
body[data-tone] .steptag:hover{background:rgba(255,255,255,.22)}
body[data-tone] .title p{font-size:16px}

body[data-tone] .panel{border-top:4px solid var(--tone)}
body[data-tone] .panel h2{font-size:24px}
body[data-tone] .panel .sub,body[data-tone] .panel>p{font-size:15px}

body[data-tone] nav.steps button{border:1.5px solid transparent}
body[data-tone] nav.steps button .n{background:var(--tone-soft);color:var(--tone)}
body[data-tone] nav.steps button[aria-selected="true"]{border-color:var(--tone);background:var(--card,#fff)}
body[data-tone] nav.steps button[aria-selected="true"] .n{background:var(--tone);color:#fff}
body[data-tone] nav.steps button b{font-size:16px}
body[data-tone] nav.steps button small{font-size:13px}

body[data-tone] .drop{border-color:var(--tone-line);background:linear-gradient(180deg,var(--card,#fff),var(--tone-soft))}
body[data-tone] .drop .ic{background:var(--tone)}

body[data-tone] .promo{background:#FDF3DD;color:#10242B;border:0;border-left:5px solid #F2B84B;border-radius:12px;font-size:15px}
body[data-tone] .promo a{color:#0F6B73}

body[data-tone]>footer,body[data-tone] footer.wrap{background:var(--tone-soft);border:1px solid var(--tone-line);border-radius:14px;padding:14px 18px;margin:28px auto 24px;font-size:13.5px;line-height:1.6;color:var(--ink-2,#2E4550);max-width:calc(1500px - 32px)}
@media (max-width:1532px){body[data-tone]>footer,body[data-tone] footer.wrap{margin-left:16px;margin-right:16px}}
body[data-tone]>footer a,body[data-tone] footer.wrap a{color:var(--tone);font-weight:600}
body[data-tone] .mod.on{border-color:var(--tone);background:var(--tone-soft)}