/* ZOOLOGIC / BBC — visual concept, November 2026 */
:root[data-theme="light"]{--bg:#f3f5f4;--card:#fff;--soft:#edf1ee;--line:#dde3df;--ink:#202321;--ink2:#343d37;--muted:#65716a;--accent:#007c88;--accent-ink:#006773;--accent-soft:#e6f4f2;--accent-line:#a4d7d2;--nav-on:#d4f18d;--nav-on-ink:#202820;--zoo-blue:#202321;--good:#427025;--good-bg:#edf5df;--warn:#006773;--warn-bg:#e6f4f2;--bad:#ad235f;--bad-bg:#fbeaf2;--info:#40658b;--info-bg:#edf2fa;--radius:12px;--display:Poppins,'Arial Black',sans-serif;--body:'Instrument Sans','Helvetica Neue',Arial,sans-serif;color-scheme:light}
body{font-size:14px;-webkit-font-smoothing:antialiased}
.app{grid-template-columns:258px minmax(0,1fr)}
.sidebar{background:#202321;color:#f5f7f3;border-right:0;padding:29px 19px 22px;gap:23px;isolation:isolate}
.brand{padding:0 8px 8px}.logo{display:block;background:white;border-radius:3px;padding:9px 10px;line-height:0;max-width:202px}.logo img{width:100%;height:auto;display:block}.brand small{font-size:9px;color:#b1bdb4;letter-spacing:2px;margin-top:14px}
.sidebar>.client{border:1px solid #414943;background:#2c322e;padding:13px 11px;align-items:flex-start;border-radius:10px;gap:10px}
.sidebar .client strong{color:#fff}.sidebar .tiny{color:#b9c4bc;font-size:11px;line-height:1.5}.sidebar .client .avatar{background:#d4f18d;color:#263023;width:31px;height:31px;font-size:10px}
.member-switch{margin-top:11px}.member-switch label{font-size:10px!important}.member-switch select{background:#242a26;border-color:#4c5750;color:#edf3ee;font-size:10px;padding:5px 7px;border-radius:5px}
.nav-label{font-family:var(--mono);font-size:9px;letter-spacing:1.8px;color:#a4b2a7;padding:0 13px;margin-bottom:-12px}
.nav{gap:5px}.nav a{font-size:12px;min-height:46px;padding:11px 12px;color:#c5cec7;border-radius:7px;line-height:1.4}.nav a .i{width:17px;height:17px;stroke-width:1.5}.nav a:hover{background:#333c35;color:#fff}.nav a.on{background:#d4f18d;color:#202b20;font-weight:600}.nav .count{background:#3b463e;color:#e4ebe5;font-family:var(--mono);font-size:10px}.nav a.on .count{background:#bedb78;color:#263624}.nav-sep{background:#3d4740;margin:9px 12px}
.side-help{border-top-color:#465048;padding:20px 10px 0}.side-help h3{color:#ecf6e8;font-size:14px;font-weight:600}.side-help p{color:#b3c0b6;font-size:11px;line-height:1.8}.side-help .tiny{color:#d4f18d}
.top{min-height:75px;background:#fff;padding:12px 38px;z-index:8}.crumb{font-size:12px;gap:13px}.crumb>span:first-of-type{font-family:var(--mono);font-size:11px;letter-spacing:1px}.crumb b{font-weight:600}.top-right{gap:20px}.board-status{font-size:11px;color:#677269;display:flex;gap:7px;align-items:center}.board-status i{width:6px;height:6px;background:#71a847;border-radius:50%}.top-avatar{display:grid;place-items:center;width:32px;height:32px;border:1px solid #d5ddcf;border-radius:50%;background:#f0f4e9;color:#42513b;font-size:10px;font-weight:600}
.prototype-tools{position:relative}.prototype-tools summary{cursor:pointer;color:#667067;font-size:11px;list-style:none;border-left:1px solid #dce2dc;padding-left:18px;min-height:32px;display:flex;align-items:center;gap:8px}.prototype-tools summary::after{content:'⌄'}.tools-menu{position:absolute;right:0;top:42px;width:265px;background:white;border:1px solid var(--line);box-shadow:0 12px 32px #19291d20;border-radius:12px;padding:16px;display:grid;gap:10px;z-index:20}.tools-menu .toggle{font-size:11px;border-radius:6px}.tools-menu p{font-size:11px;color:var(--muted);line-height:1.6}.prototype-tools summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
.content{max-width:1440px;padding:32px 38px 30px}.hero{background:#222925;color:#fff;border:0;border-radius:14px;padding:38px 38px 25px;min-height:316px;margin-bottom:23px;align-items:flex-start}.hero::before{content:'';position:absolute;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,#00afdc,#35b7ae 46%,#8cc63f)}.hero-copy{max-width:75%}.hero h1{font-size:43px;line-height:1.13;letter-spacing:-1.8px;font-weight:800;color:#f8faf5;margin-top:16px}.hero .kicker{color:#b9cdbf;font-family:var(--mono);font-size:9px;font-weight:400;letter-spacing:1.5px}.hero-kicker-sep{margin:0 10px;color:#8cc63f}.hero p.hero-sub{color:#c8d3ca;font-size:13px;line-height:1.7;margin-top:14px;max-width:440px}.hero-art{height:100%;width:390px;max-width:45%;right:-25px;bottom:-18px;opacity:.65}.hero-cta{display:flex;align-items:center;gap:24px;margin-top:23px}.hero-review{background:#d4f18d;color:#202b20;border:0;min-height:39px;font-size:11px;font-weight:600;border-radius:6px;padding:9px 15px;gap:24px}.hero-review span{font-size:17px}.hero-jobs{color:#eef6ed;font-size:11px;display:flex;gap:15px;align-items:center}.hero-jobs:hover{color:#d4f18d}.hero-pills{margin-top:24px;gap:15px}.hero .pill{background:none;border:0;color:#d3ddcf;padding:0;font-size:10px;font-weight:400;white-space:normal}.hero .pill.warn{color:#d4f18d}.hero .pill::before{width:5px;height:5px}.hero .pill.acc::before{color:#72cad2}
.stats{gap:13px;margin-bottom:25px}.stat{border-radius:10px;padding:18px 19px 16px;gap:8px;min-height:128px;transition:transform .18s,border-color .18s}.stat.act:hover{transform:translateY(-2px);border-color:#91b4a0}.stat .k{font-family:var(--mono);font-size:9px;letter-spacing:1px;font-weight:400}.stat .v{font-size:29px;letter-spacing:-1px;font-weight:600;line-height:1.15}.stat .d{font-size:11px}.stat.alert{background:#edf5df;border-color:#c7dba5}.stat.alert .v{color:#324f27}.stat.alert .k{color:#526940}.stat:last-child .v{font-size:22px;letter-spacing:-.6px;margin-top:4px}.stat:nth-child(3){position:relative}.stat:nth-child(3)::after{content:'';height:3px;border-radius:2px;background:linear-gradient(90deg,#52b5af 70%,#e7ede8 70%);position:absolute;bottom:0;left:19px;right:19px}
.columns{grid-template-columns:minmax(0,1.8fr) minmax(270px,1fr);gap:20px}.stack{gap:20px}.panel{padding:23px;border-radius:12px}.panel h2{font-size:16px;letter-spacing:-.5px;font-weight:600}.panel .sub{font-size:11px;margin-top:4px}.section-head{margin-bottom:17px}.section-head>.link{font-size:10px;min-height:30px;gap:4px}.row{padding:15px 0;gap:11px}.row-main .link{font-size:12px;line-height:1.6}.row-title{font-size:12px;line-height:1.6;font-weight:500}.row-meta{font-size:10px;line-height:1.6;margin-top:5px}.row .pill{font-size:10px}.row>.pill:empty{padding:7px;background:transparent}.row>.pill:empty::before{width:6px;height:6px}.row>.muted{font-size:10px}.pill{border-radius:4px;font-size:11px;padding:4px 8px}.pill.dot::before{width:5px;height:5px}
.meeting-feature{background:#e6eee7!important;color:#233829!important;position:relative;overflow:hidden}.meeting-feature::after{content:'↗';position:absolute;right:22px;top:15px;font-size:33px;color:#66856d;font-weight:400}.meeting-feature .kicker{font-family:var(--mono);font-size:9px;letter-spacing:1px;color:#5f7565!important}.meeting-feature h2{color:#263f2e!important;font-size:20px!important;line-height:1.3;max-width:210px;margin-top:15px}.meeting-feature>p{color:#627569!important;font-size:11px!important}.meeting-feature .cal{background:#fff!important;color:#31553b;border-radius:6px;font-size:24px;padding:7px 11px}.meeting-feature .cal small{font-size:9px}.meeting-feature .btn{background:#fff!important;border:1px solid #d5e0d7!important;color:#2c4a35!important;font-size:10px;min-height:38px;border-radius:5px;padding:8px}
.btn{border-radius:6px;font-size:12px}.btn.accent{background:#202b24;border-color:#202b24}.btn.go{background:#456c30;border-color:#456c30}.btn.outline{border-color:#d7dfd8}.panel .btn.outline{font-size:11px}.link{color:#007b85}.tabs button{font-size:12px}.tabs button.on{border-color:#007c88}.chip{border-radius:6px}.search{border-radius:6px}.tile,.acard,.pcard{box-shadow:none!important}.tile:hover,.acard:hover,.pcard:hover{border-color:#91b4a0}.page-heading h1{font-weight:700;letter-spacing:-1.1px;font-size:30px}.page-heading .kicker{font-family:var(--mono);font-size:10px}.page-heading p.lede{font-size:13px}.lead{font-size:13px;border-radius:8px}.footer{font-size:10px;margin-top:30px;padding-top:19px}.footer span:last-child{font-size:9px}.tbl,.plan{border-radius:10px}.modal{border-radius:14px}.ask textarea:focus,.ask input:focus{border-color:#007c88}
@media(min-width:1600px){.content{padding-left:48px;padding-right:48px}.hero{min-height:340px;padding:41px}.hero h1{font-size:49px}.hero-art{width:470px}.hero-copy{max-width:65%}}
@media(max-width:1200px) and (min-width:981px){.app{grid-template-columns:235px minmax(0,1fr)}.content{padding:25px}.top{padding:12px 25px}.columns{grid-template-columns:minmax(0,1.5fr) minmax(245px,1fr)}.hero{padding:30px}.hero h1{font-size:37px}.stat{padding:16px 13px}.stat .v{font-size:25px}.stat:last-child .v{font-size:18px}.stat .d{font-size:10px}.panel{padding:19px}.board-status{display:none}}
@media(max-width:980px){.app{grid-template-columns:1fr}.sidebar{height:auto;position:static;gap:20px}.sidebar.open{display:flex}.sidebar .nav{display:grid;grid-template-columns:1fr 1fr}.sidebar .nav-sep{display:none}.side-help{margin-top:0}.brand .logo{max-width:185px}.sidebar>.client{max-width:340px}.nav-label{margin-bottom:-8px}.content{padding:22px}.top{padding:10px 22px;min-height:65px;gap:10px}.top-right{gap:15px}.hero{min-height:300px;padding:30px}.hero-copy{max-width:75%}.hero-art{display:block;max-width:42%;opacity:.35}.hero h1{font-size:40px}.stats{grid-template-columns:repeat(4,minmax(0,1fr))}.stat{padding:16px 13px;min-height:120px}.stat .v{font-size:24px}.stat:last-child .v{font-size:18px}.columns{grid-template-columns:1fr}.columns>.stack:last-child{grid-template-columns:1fr 1fr}.columns>.stack:last-child>.panel:last-child{grid-column:1/-1}.meeting-feature h2{max-width:none}.grid2,.grid3,.rep-month{grid-template-columns:1fr}}
@media(max-width:600px){.top{padding:8px 14px;gap:8px;flex-wrap:nowrap}.crumb{gap:5px;font-size:11px}.menu-toggle{width:30px}.board-status,.top-avatar{display:none}.prototype-tools summary{font-size:10px;padding-left:10px}.tools-menu{right:0}.content{padding:17px 15px 24px}.hero{padding:26px 23px;min-height:328px;border-radius:10px}.hero-copy{max-width:100%}.hero h1{font-size:36px;letter-spacing:-1.5px;margin-top:20px}.hero .kicker{font-size:8px;letter-spacing:1px}.hero-kicker-sep{margin:0 5px}.hero p.hero-sub{font-size:12px}.hero-art{right:-70px;width:300px;max-width:65%;opacity:.2}.hero-cta{gap:19px}.hero-pills{gap:9px;margin-top:22px;flex-direction:column}.stats{grid-template-columns:1fr 1fr;gap:10px}.stat{min-height:119px;padding:16px}.stat .v{font-size:26px}.stat .k{font-size:8px}.stat .d{font-size:10px}.stat:last-child .v{font-size:20px}.columns>.stack:last-child{grid-template-columns:1fr}.panel{padding:20px 18px}.row>.muted{white-space:normal!important;max-width:58px;text-align:right}.row-title{font-size:12px}.section-head>.link{font-size:10px}.footer{align-items:flex-start;gap:8px}.footer span{font-size:9px}.page-heading h1{font-size:27px}.sidebar .nav{grid-template-columns:1fr}.search{max-width:100%;min-width:0}.tbl table{min-width:800px}.hero-review{font-size:10px;gap:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* Reversed wordmark used directly on the charcoal sidebar. */
.brand .logo{background:transparent;border-radius:0;padding:0 2px;max-width:196px}
.brand .logo img{width:100%;height:auto;display:block}
/* Agency calendar-only preview */
body.role-agency .nav a:not([data-v="calendar"]),body.role-agency .nav-sep,body.role-agency .side-help,body.role-agency .nav-label{display:none}
.role-banner{background:#f0e9ff;border:1px solid #d7c4ff;border-left:5px solid #6e29f6;color:#5520bd;border-radius:8px;padding:12px 16px;font-size:12px;line-height:1.6;margin-bottom:18px}

/* blog hand-over: copy buttons */
.copybar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:14px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--soft,#f3f4f1)}
.copybar .tiny{margin-right:4px}
.notice{margin-top:10px;font-size:13px;padding:8px 12px;border-radius:8px;background:#e6ebf7;color:#2e4ea2;display:inline-block}
.notice.warn{background:#fdf1dc;color:#8a5200}.notice.good{background:#e6f3df;color:#2f6b19}