:root{--ink:#12243f;--muted:#617389;--sky:#7298b5;--snow:#f7fafc;--mist:#eef5f8;--celadon:#dbeae8;--peach:#f3b6be;--peach-deep:#a9475b;--line:#e3ebef;--white:#fff;--shadow:0 14px 45px rgba(18,36,63,.055)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--snow);color:var(--ink);font-family:"Be Vietnam Pro","Segoe UI",Arial,sans-serif;font-size:15px;line-height:1.5}
button,a{font:inherit}
button{cursor:pointer}
a{color:inherit}
.app-shell{display:grid;grid-template-columns:246px minmax(0,1fr);min-height:100vh}
.sidebar{background:#fff;border-right:1px solid var(--line);padding:32px 18px 24px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.brand{display:flex;align-items:center;gap:12px;padding:0 13px 34px}
.brand-mark{width:39px;height:39px;display:grid;place-items:center;border-radius:12px;background:var(--mist);overflow:hidden}
.brand-mark img{width:30px;height:30px;object-fit:contain}
.brand strong{display:block;font-size:17px;letter-spacing:.1em;line-height:1.1}
.brand small{display:block;font-size:10px;color:var(--muted);letter-spacing:.02em;margin-top:4px}
.sidebar-label,.section-kicker,.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:800;color:#6b8498}
.sidebar-label{padding:0 17px;margin:7px 0 11px}
.nav{display:grid;gap:5px}
.nav-item{width:100%;display:flex;align-items:center;gap:13px;border:0;border-radius:11px;background:transparent;color:#4a6076;font-weight:650;padding:12px 14px;text-align:left;transition:background .18s,color .18s}
.nav-item:hover{background:var(--snow)}
.nav-item.active{background:var(--mist);color:var(--ink)}
.nav-item:focus-visible,.source-link:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.nav-icon{width:20px;text-align:center;font-size:19px;line-height:1;font-weight:750;color:#8da8bb}
.nav-item.active .nav-icon{color:var(--ink)}
.nav-dot{width:6px;height:6px;border-radius:50%;background:var(--peach-deep);margin-left:auto}
.sidebar-bottom{margin-top:auto;padding:17px 13px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}
.private-dot{width:7px;height:7px;border-radius:50%;background:#54a089}
.main{min-width:0}
.topbar{height:72px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.86);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,4vw,65px)}
.topbar-right{display:flex;align-items:center;gap:22px;color:var(--muted);font-size:12px}
.privacy-pill{border:1px solid #d6e6e2;background:#f3faf8;color:#407565;border-radius:99px;padding:7px 11px;font-size:11px;font-weight:750}
.content{max-width:1370px;margin:auto;padding:42px clamp(24px,4vw,65px) 22px}
.view[hidden]{display:none!important}
.hero{min-height:266px;display:flex;justify-content:space-between;gap:35px;align-items:flex-end;padding:38px 44px;border-radius:20px;background:linear-gradient(118deg,#eaf3f6 0%,#f7fafc 55%,#faeded 100%);border:1px solid #dfecef;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;border:1px solid rgba(114,152,181,.17);right:180px;top:-175px;box-shadow:0 0 0 50px rgba(114,152,181,.045),0 0 0 100px rgba(114,152,181,.025);pointer-events:none}
.hero h1,.page-heading h1{font-size:clamp(32px,3.25vw,49px);letter-spacing:-.055em;line-height:1.14;margin:12px 0 17px;font-weight:750}
.hero h1 em{font-weight:450;font-style:normal;color:#6c90ab}
.hero p{max-width:610px;color:#5b7086;line-height:1.7;margin:0;font-size:14px}
.hero-aside{min-width:222px;border-left:1px solid rgba(18,36,63,.14);padding-left:26px;z-index:1;display:grid;gap:4px}
.hero-aside-label{font-size:10px;letter-spacing:.14em;color:#617b8f;font-weight:800}
.hero-aside strong{font-size:22px;letter-spacing:-.025em;white-space:nowrap}
.hero-aside span:last-child{font-size:12px;color:#60788b;line-height:1.5}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:15px;margin:38px 0 17px}
.section-head h2{margin:5px 0 0;font-size:23px;letter-spacing:-.035em}
.section-note{font-size:12px;color:#788a9b;padding-bottom:4px}
.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.metric-card{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:16px;min-height:188px;padding:21px 22px;display:flex;flex-direction:column}
.metric-top{display:flex;justify-content:space-between;align-items:center}
.channel-tag{font-size:10px;letter-spacing:.07em;font-weight:800;border-radius:99px;padding:5px 9px}
.channel-tag.facebook{background:#eaf2f9;color:#3d6d96}
.channel-tag.tiktok{background:#edf1f3;color:#284351}
.metric-spark{color:#bfd0dc;font-size:12px}
.metric-label{color:#5a6d80;font-size:13px;margin:21px 0 2px;font-weight:600}
.metric-value{font-size:34px;letter-spacing:-.06em;line-height:1.1;font-weight:780}
.metric-detail{margin:auto 0 0;color:#8191a0;font-size:11px;padding-top:13px;line-height:1.4}
.metric-card.unavailable{background:#fbfcfd;border-style:dashed;box-shadow:none}
.metric-card.unavailable .metric-value{color:#97a5af}
.overview-grid,.detail-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:16px;margin-top:18px}
.panel{background:#fff;border:1px solid var(--line);border-radius:17px;padding:25px 26px;min-height:265px;box-shadow:var(--shadow)}
.soft-panel{background:#f1f7f7;box-shadow:none}
.panel-head{display:flex;justify-content:space-between;margin-bottom:18px}
.panel h3{font-size:18px;letter-spacing:-.035em;margin:5px 0 0}
.channel-list{display:grid}
.channel-row{display:flex;align-items:center;gap:13px;padding:15px 0;border-top:1px solid var(--line)}
.channel-row:first-child{border-top:0;padding-top:2px}
.channel-logo{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;flex:none;font-size:21px;font-weight:800}
.fb-logo{background:#eaf2f9;color:#3d6d96}.tt-logo{background:#edf1f3;color:#223845}.web-logo{background:#f5eded;color:#ab6a79}
.channel-copy{min-width:0;display:grid;gap:1px;flex:1}.channel-copy strong{font-size:13px}.channel-copy span{font-size:11px;color:var(--muted)}
.status-pill{border-radius:99px;padding:5px 9px;font-size:9px;letter-spacing:.06em;font-weight:800;white-space:nowrap}
.status-pill.ready{background:#e8f5ef;color:#39735b}.status-pill.partial{background:#fff3e7;color:#986230}.status-pill.waiting{background:#f8ecee;color:#a9475b}
.social-links-intro{color:var(--muted);font-size:12px;line-height:1.6;margin:-7px 0 16px}
.social-links{display:grid;gap:10px}
.social-link{display:flex;align-items:center;gap:12px;min-width:0;padding:12px 14px;border:1px solid #d1e2e6;border-radius:12px;background:#fff;text-decoration:none;transition:transform .18s,border-color .18s,box-shadow .18s}
.social-link:hover{transform:translateY(-2px);border-color:#92b7c6;box-shadow:0 7px 18px rgba(18,36,63,.08)}
.social-link:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.social-link-copy{display:grid;gap:2px;min-width:0;flex:1}.social-link-copy strong{font-size:13px}.social-link-copy small{font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.social-link-arrow{font-size:20px;line-height:1;color:#527d96}
.page-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:9px 0 27px}
.page-heading h1{margin:7px 0 8px}.heading-sub{color:#8195a6;font-weight:450}.page-heading p{margin:0;color:var(--muted);font-size:13px}
.source-link{white-space:nowrap;text-decoration:none;background:var(--ink);color:white;border-radius:10px;padding:11px 16px;font-size:12px;font-weight:700;transition:transform .18s,background .18s}.source-link:hover{transform:translateY(-2px);background:#273e5e}
.detail-grid{grid-template-columns:1fr 1fr;margin-top:17px}
.bars{display:grid;gap:19px;margin-top:26px}.bar-label{display:flex;justify-content:space-between;margin-bottom:7px;color:#5b6f83;font-size:12px}.bar-label strong{color:var(--ink)}.bar-track{height:9px;border-radius:99px;background:#edf3f5;overflow:hidden}.bar-fill{height:100%;border-radius:99px;background:#779fba}.bar-fill.tone-2{background:#a3c1c5}.bar-fill.tone-3{background:#e6b2ba}
.data-note{display:flex;gap:10px;align-items:flex-start;margin:22px 0;color:#6c7f91;font-size:12px;line-height:1.65}.data-note p{margin:0}.note-icon{display:grid;place-items:center;flex:none;width:19px;height:19px;border-radius:50%;border:1px solid #9ab2c1;font-size:11px;font-weight:800}
.notice{display:flex;gap:15px;background:#fff7eb;border:1px solid #f2dfbf;border-radius:14px;padding:17px 20px;margin-bottom:18px}.notice-symbol{display:grid;place-items:center;width:24px;height:24px;background:#e5a75b;color:white;border-radius:50%;font-weight:800;flex:none}.notice strong{font-size:13px}.notice p{margin:4px 0 0;color:#7a6e60;font-size:12px;line-height:1.6}
.website-empty{min-height:530px;border:1px dashed #c9d9e0;border-radius:20px;background:linear-gradient(145deg,#f1f7f9,#fffafa);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:35px}.empty-symbol{font-size:50px;color:#8eafbf;line-height:1;margin-bottom:22px}.website-empty h2{font-size:clamp(23px,3vw,34px);letter-spacing:-.04em;margin:16px 0 8px}.website-empty p{max-width:470px;color:#687d90;line-height:1.7;margin:0;font-size:14px}
.footer{display:flex;justify-content:space-between;gap:15px;color:#91a0ad;border-top:1px solid var(--line);padding:24px 0 0;margin-top:50px;font-size:11px}
.load-error{background:#fff0f0;color:#963f4c;padding:14px 18px;border-radius:12px;margin-bottom:18px;border:1px solid #edcbd0}
@media(max-width:1150px){.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{align-items:flex-start}.hero-aside{align-self:end}.overview-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.app-shell{display:block}.sidebar{position:sticky;z-index:10;top:0;height:auto;padding:10px 14px;border-right:0;border-bottom:1px solid var(--line)}.brand{padding:0 1px 9px}.brand-mark{width:31px;height:31px}.brand-mark img{width:25px;height:25px}.brand strong{font-size:14px}.brand small,.sidebar-label,.sidebar-bottom{display:none}.nav{display:flex;overflow:auto;gap:5px}.nav-item{width:auto;white-space:nowrap;padding:9px 11px;font-size:12px}.nav-icon{font-size:16px;width:16px}.nav-dot{margin-left:1px}.topbar{height:51px;padding:0 20px}.privacy-pill{display:none}.content{padding:25px 19px 20px}.hero{display:block;min-height:0;padding:29px 25px}.hero h1{font-size:35px}.hero-aside{margin-top:26px;padding:0 0 0 17px}.section-head{margin-top:28px}.section-note{display:none}.overview-grid,.detail-grid{grid-template-columns:1fr}.page-heading{align-items:flex-start;flex-direction:column}.metric-grid{gap:10px}.metric-card{padding:17px;min-height:163px}.metric-value{font-size:30px}.channel-row{gap:9px}.status-pill{font-size:8px}.footer{display:block}.footer span{display:block;margin-bottom:4px}}
@media(max-width:410px){.metric-grid{grid-template-columns:1fr}.metric-card{min-height:145px}.hero h1{font-size:30px}}

/* PAMCO palette: ink navy anchors the navigation, sky leads data, peach is a small accent. */
:root{
  --muted:#526a7e;
  --line:#dbe7ed;
  --shadow:0 12px 35px rgba(18,36,63,.07);
}
.sidebar{
  background:#12243f;
  border-right:0;
  box-shadow:8px 0 30px rgba(18,36,63,.08);
}
.brand strong{color:#fff}
.brand small{color:#c0d2df}
.brand-mark{background:#fff}
.sidebar-label{color:#9db8ca}
.nav-item{color:#d5e2eb}
.nav-item:hover{background:rgba(238,245,248,.12);color:#fff}
.nav-item.active{background:#e5f1f6;color:#12243f;box-shadow:inset 3px 0 0 #7298b5}
.nav-icon{color:#a6c3d4}
.nav-item.active .nav-icon{color:#386784}
.nav-dot{background:#f3b6be}
.sidebar-bottom{border-top-color:rgba(255,255,255,.17);color:#c0d2df}
.private-dot{background:#a3d5c5}
.topbar{background:#fff}
.eyebrow,.section-kicker{color:#4b708a}
.hero{
  background:linear-gradient(120deg,#dbeae8 0%,#eaf3f6 62%,#f8edef 100%);
  border-color:#cadfe4;
  box-shadow:inset 5px 0 0 #7298b5;
}
.hero:after{border-color:rgba(169,71,91,.18);box-shadow:0 0 0 50px rgba(243,182,190,.07),0 0 0 100px rgba(243,182,190,.035)}
.hero h1 em{color:#a9475b;font-weight:650}
.hero p{color:#435d70}
.hero-aside{border-left-color:rgba(18,36,63,.2)}
.hero-aside-label,.hero-aside span:last-child{color:#4f697b}
.metric-card{border-color:#d6e5ea;border-top:3px solid #7298b5}
.metric-card.tiktok{border-top-color:#355c77}
.metric-card.unavailable{border-top-color:#c2d1d9;border-top-style:solid}
.metric-spark{color:#a9475b}
.metric-label{color:#4f667a}
.metric-detail{color:#657c8e}
.channel-tag.facebook{background:#e0eef5;color:#275878}
.channel-tag.tiktok{background:#e6edf1;color:#29495f}
.soft-panel{background:#e9f2f1}
.fb-logo{background:#dfedf5;color:#285f84}
.tt-logo{background:#e4ebef;color:#223f55}
.web-logo{background:#f7e8eb;color:#a9475b}
.source-link{background:#234b69}
.source-link:hover{background:#12243f}
.bar-fill{background:#7298b5}
.bar-fill.tone-2{background:#9bbdbb}
.bar-fill.tone-3{background:#c58291}
.website-empty{background:linear-gradient(145deg,#eaf3f6,#f7fafc 70%,#fbf0f1);border-color:#bed3dd}
.empty-symbol{color:#638fa9}
@media(max-width:760px){
  .sidebar{border-bottom:0;box-shadow:0 5px 16px rgba(18,36,63,.13)}
  .nav-item:hover{background:rgba(238,245,248,.12)}
  .hero{box-shadow:inset 4px 0 0 #7298b5}
}

.topbar-right{gap:12px}
.admin-entry{border:1px solid #cbdde5;border-radius:99px;padding:7px 11px;color:#315d79;text-decoration:none;font-size:11px;font-weight:750;white-space:nowrap}
.admin-entry:hover{background:#eaf3f6}
.admin-entry:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
@media(max-width:760px){
  .topbar{height:58px}
  .topbar-right{gap:7px}
  .privacy-pill{display:inline-flex;padding:5px 8px;font-size:10px}
  .admin-entry{padding:5px 8px;font-size:10px}
  .today{display:none}
}

.post-panel{margin-top:18px;min-height:0}
.post-source-note{color:var(--muted);font-size:12px;line-height:1.6;margin:-7px 0 15px}
.post-row{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:16px 0;border-top:1px solid var(--line)}
.post-copy{min-width:0;display:grid;gap:4px}
.post-copy strong{font-size:13px;line-height:1.45}
.post-copy a{text-decoration:none;color:var(--ink)}
.post-copy a:hover{text-decoration:underline;color:#315d79}
.post-copy a:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.post-copy span{font-size:11px;color:var(--muted)}
.post-stats{display:flex;align-items:center;gap:24px;flex:none}
.post-stat{display:grid;text-align:right;white-space:nowrap}
.post-stat strong{font-size:21px;line-height:1.1;color:#234b69}
.post-stat:last-child strong{color:#a35467}
.post-stat span{font-size:10px;color:var(--muted)}
@media(max-width:520px){.post-row{display:grid;gap:10px}.post-stats{gap:24px}.post-stat{text-align:left}.post-stat strong{font-size:18px}}