/* Homepage is the Sites design authority. Both documents load this one file. */
:root { --ink:#17211d; --muted:#617068; --paper:#fffdf8; --soft:#f4f1e8; --line:#d8ddd7; --green:#176b52; --green-dark:#0f4e3c; --coral:#ef654f; --coral-text:#b84335; --yellow:#f5c84c; --teal:#2c8c88; --white:#fff; --shadow:0 12px 30px rgba(23,33,29,.1); --site-width:1180px; --site-gutter:20px; --site-card-radius:24px; --site-card-line:#d9e2dc; --site-card-shadow:0 12px 28px rgba(22,55,43,.09); --site-section-gap:20px; --site-control-height:44px; }
html:has(.site-shell-body), body.site-shell-body { background:var(--paper); }
body.site-shell-body { color:var(--ink); font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:16px; line-height:normal; }
.site-shell-body .page-shell { width:min(var(--site-width),calc(100% - var(--site-gutter)*2)); margin-inline:auto; }
.shared-site-header { position:sticky; z-index:50; top:0; min-height:66px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 max(var(--site-gutter),calc((100vw - var(--site-width))/2)); border:0; border-bottom:1px solid rgba(23,33,29,.12); background:var(--paper); backdrop-filter:none; }
.shared-site-header .brand { display:flex; min-height:44px; align-items:center; gap:10px; color:var(--ink); text-decoration:none; font-size:16px; font-weight:900; white-space:nowrap; }
.shared-site-header .brand-mark { display:grid; flex:0 0 38px; width:38px; height:38px; place-items:center; transform:rotate(-3deg); }
.shared-site-header .brand-mark img { display:block; width:100%; height:100%; }
.shared-site-header .brand>span { font-size:inherit; }
.shared-site-header .brand:hover .brand-mark,.shared-site-header .brand:focus-visible .brand-mark { transform:rotate(3deg) scale(1.05); }
.shared-site-header .main-nav { display:flex; align-self:stretch; gap:0; flex-wrap:nowrap; }
.shared-site-header .nav-button { min-width:72px; min-height:44px; border:0; border-bottom:3px solid transparent; border-radius:0; padding:2px 6px; background:transparent; color:var(--ink); font:inherit; font-weight:800; cursor:pointer; }
.shared-site-header .nav-button:hover,.shared-site-header .nav-button.is-active { color:var(--green); border-bottom-color:var(--coral); }
.shared-site-header button:focus-visible,.shared-site-header a:focus-visible { outline:2px solid var(--green); outline-offset:-3px; }
.shared-site-header .nav-icon { display:none; }
.shared-site-header [data-mobile-account-label],.shared-site-header .mobile-member-button,.shared-site-header .mobile-menu-toggle,.shared-site-header .mobile-quick-menu { display:none; }
.shared-site-header [data-desktop-handle] { display:inline-block; max-width:10em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; }
.shared-site-header [hidden] { display:none!important; }
.shared-site-header .nav-button[data-view="reports"] { position:relative; }
.shared-site-header .nav-button[data-view="reports"].member-has-unread::after { position:absolute; top:5px; right:5px; width:9px; height:9px; border-radius:50%; background:#e1433b; content:""; }
/* The existing homepage cards now consume the same tokens as Growth. */
.site-shell-body .home-highlight-panel { border-radius:var(--site-card-radius); border-right-color:var(--site-card-line); border-bottom-color:var(--site-card-line); border-left-color:var(--site-card-line); box-shadow:var(--site-card-shadow); }
@media(max-width:760px) {
  :root { --site-gutter:12px; }
  .shared-site-header { min-height:60px; gap:6px; padding-inline:12px; }
  .shared-site-header .brand { flex:0 0 auto; gap:8px; font-size:13px; }
  .shared-site-header .brand-mark { flex-basis:34px; width:34px; height:34px; }
  .shared-site-header .main-nav { position:fixed; z-index:100; right:12px; bottom:calc(10px + env(safe-area-inset-bottom)); left:12px; display:flex; height:66px; gap:4px; align-items:stretch; min-width:0; border:1px solid rgba(23,33,29,.12); border-radius:999px; padding:5px; background:var(--paper); box-shadow:0 8px 28px rgba(23,33,29,.2); }
  .shared-site-header .nav-button { position:relative; display:flex; flex:1 1 0; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-width:0; min-height:44px; border:0; border-radius:999px; padding:3px 2px; font-size:11px; line-height:1.2; white-space:nowrap; }
  .shared-site-header .nav-button:hover,.shared-site-header .nav-button.is-active { border:0; background:#e7f1eb; color:var(--green-dark); }
  .shared-site-header .nav-icon { display:block; width:19px; height:19px; flex:0 0 19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .shared-site-header [data-desktop-handle] { display:none; }
  .shared-site-header [data-mobile-account-label] { display:block; }
  .shared-site-header .mobile-member-button { position:relative; display:flex; width:44px; height:44px; flex:0 0 44px; align-items:center; justify-content:center; overflow:visible; border:2px solid var(--green); border-radius:50%; color:var(--ink); background:#fff8d9; text-decoration:none; box-shadow:0 3px 10px rgba(23,33,29,.1); }
  .shared-site-header [data-member-avatar] { display:flex; width:100%; height:100%; align-items:center; justify-content:center; font-size:24px; line-height:1; }
  .shared-site-header .mobile-member-button.is-logged-in { width:auto; min-width:44px; max-width:170px; flex:0 1 auto; gap:5px; padding:2px 8px 2px 2px; border-radius:999px; justify-content:flex-start; }
  .shared-site-header .mobile-member-button.is-logged-in [data-member-avatar] { width:36px; height:36px; flex:0 0 36px; }
  .shared-site-header .mobile-member-button [data-member-handle] { min-width:0; flex:1 1 auto; max-width:110px; font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .shared-site-header .mobile-member-button img { width:100%; height:100%; object-fit:cover; border-radius:50%; }
  .shared-site-header .mobile-member-button.member-has-unread [data-member-avatar]::after { position:absolute; top:-1px; right:-1px; width:12px; height:12px; border:2px solid var(--paper); border-radius:50%; background:#e1433b; content:""; box-shadow:0 1px 3px rgba(23,33,29,.24); }
  .shared-site-header .mobile-menu-toggle { display:grid; flex:0 0 44px; width:44px; height:44px; place-items:center; border:1px solid rgba(23,33,29,.12); border-radius:14px; background:#fffdfa; color:var(--ink); box-shadow:0 3px 10px rgba(23,33,29,.08); font-size:21px; }
  .shared-site-header .mobile-menu-toggle[aria-expanded="true"] { background:#e7f1eb; color:var(--green-dark); }
  .shared-site-header .mobile-quick-menu:not([hidden]) { position:absolute; z-index:120; top:calc(100% + 7px); right:12px; display:grid; width:min(260px,calc(100vw - 24px)); gap:4px; padding:8px; border:1px solid rgba(23,33,29,.12); border-radius:18px; background:rgba(255,253,248,.98); box-shadow:0 12px 32px rgba(23,33,29,.2); }
  .shared-site-header .mobile-quick-menu button { display:flex; align-items:center; gap:12px; min-height:46px; border:0; border-radius:12px; padding:0 12px; background:transparent; color:var(--ink); text-align:left; font:inherit; font-weight:750; }
  .shared-site-header .mobile-quick-menu button:hover { background:#e7f1eb; }
  .shared-site-header .mobile-quick-menu button>span { display:grid; width:26px; height:26px; place-items:center; border-radius:9px; background:#edf3ee; }
}
@media(max-width:640px) and (max-height:500px) { .shared-site-header .main-nav { bottom:calc(6px + env(safe-area-inset-bottom)); height:56px; padding:4px; } .shared-site-header .nav-button { gap:1px; padding:2px; font-size:10px; } .shared-site-header .nav-icon { width:16px; height:16px; flex-basis:16px; } }