/* ============================================================================
   BrandPush Report v3 - report2.css
   reach · rankings · discovery · publications · trust badge · review · footer
   ============================================================================ */

/* ============================================================================
   REACH  (dramatic dark band)
   ============================================================================ */
.reach{ position:relative; background:var(--bp-indigo); color:var(--on-dark); overflow:hidden; }
.reach::before{ content:""; position:absolute; inset:0; pointer-events:none; background:
   radial-gradient(50% 70% at 15% -10%, rgba(108,92,231,.4), transparent 60%),
   radial-gradient(55% 80% at 92% 115%, rgba(251,93,109,.32), transparent 60%); }
.reach > .inner{ position:relative; z-index:1; }
.reach-top{ display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:end; }
.reach-head{ display:flex; flex-direction:column; align-items:flex-start; }
.reach-mega{ display:block; margin-top:1.3rem; padding-right:.14em; font-size:var(--d-mega); font-weight:800; line-height:.9; letter-spacing:-.05em; color:#fff; background:linear-gradient(120deg,#fff 30%, #FFB4BC 70%, #b3a5ff); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.reach-megacap{ font-size:clamp(1.1rem,.95rem + .6vw,1.5rem); font-weight:700; color:#fff; margin-bottom:.6rem; }
.reach-sub{ font-size:1.1rem; line-height:1.55; color:var(--on-dark-soft); max-width:38ch; }
.reach-figures{ margin-top:clamp(2.5rem,1.5rem + 3vw,3.8rem); display:grid; grid-template-columns:auto 1fr; gap:clamp(2rem,1rem + 4vw,4.5rem); align-items:center; }
.reach-nums{ display:flex; flex-direction:column; gap:1.6rem; }
.reach-num .rn-v{ display:block; font-size:2.6rem; font-weight:800; letter-spacing:-.035em; line-height:1; font-variant-numeric:tabular-nums; }
.reach-num .rn-v.c{ color:#FF8E9A; } .reach-num .rn-v.v{ color:#b3a5ff; }
.reach-num .rn-l{ font-size:var(--text-sm); color:var(--on-dark-soft); margin-top:.35rem; }

/* traffic bars viz */
.trafbars{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:var(--r-2xl); padding:clamp(1.4rem,1rem + 1.5vw,2rem); }
.trafbars .tb-h{ font-size:var(--text-sm); font-weight:700; letter-spacing:.02em; color:var(--on-dark); display:flex; justify-content:space-between; margin-bottom:1.2rem; }
.trafbars .tb-h span:last-child{ color:var(--on-dark-soft); font-weight:500; }
.trafrow{ display:grid; grid-template-columns:130px 1fr auto; gap:.9rem; align-items:center; padding-block:.5rem; }
.trafrow .tr-name{ font-size:var(--text-sm); font-weight:600; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.trafrow .tr-track{ display:block; height:10px; border-radius:var(--r-full); background:rgba(255,255,255,.1); overflow:hidden; }
.trafrow .tr-fill{ display:block; height:100%; width:0; border-radius:var(--r-full); background:linear-gradient(90deg,var(--bp-violet),#8b7bff); transition:width 1s var(--ease-out) .45s; }
.reach-figures.in .tr-fill{ width:var(--w); }
.reach-figures.in .trafrow:nth-child(3) .tr-fill{ transition-delay:.57s } .reach-figures.in .trafrow:nth-child(4) .tr-fill{ transition-delay:.69s } .reach-figures.in .trafrow:nth-child(5) .tr-fill{ transition-delay:.81s } .reach-figures.in .trafrow:nth-child(6) .tr-fill{ transition-delay:.93s } .reach-figures.in .trafrow:nth-child(7) .tr-fill{ transition-delay:1.05s } .reach-figures.in .trafrow:nth-child(6) .tr-fill{ transition-delay:.32s } .reach-figures.in .trafrow:nth-child(7) .tr-fill{ transition-delay:.4s }
.trafrow:nth-child(2) .tr-fill{ background:linear-gradient(90deg,var(--bp-coral),#ff8e9a); }
.trafrow .tr-val{ font-size:var(--text-sm); font-weight:700; font-variant-numeric:tabular-nums; color:var(--on-dark); white-space:nowrap; }

/* ============================================================================
   RANKINGS
   ============================================================================ */
.rank-hero{ display:grid; grid-template-columns:auto 1fr; gap:clamp(2rem,1rem + 4vw,4.5rem); align-items:center; margin-top:clamp(2.2rem,1.4rem + 2.5vw,3.5rem); }
.donut-wrap{ display:flex; flex-direction:column; align-items:center; gap:1.2rem; }
.donut-svg-wrap{ position:relative; width:clamp(200px,42vw,252px); aspect-ratio:1; }
.donut-svg{ width:100%; height:100%; display:block; overflow:visible; }
.donut-center{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; pointer-events:none; }
.donut-center .dc-num{ font-size:clamp(2.8rem,2rem + 2.6vw,3.7rem); font-weight:800; letter-spacing:-.04em; line-height:.9; color:var(--ink); font-variant-numeric:tabular-nums; transition:color .2s ease; }
.donut-center .dc-lab{ font-size:var(--text-sm); font-weight:600; color:var(--n-500); margin-top:.35rem; max-width:15ch; margin-inline:auto; line-height:1.3; }
.donut-legend{ display:flex; flex-wrap:wrap; justify-content:center; gap:.4rem .5rem; max-width:320px; }
.donut-legend .dl{ display:inline-flex; align-items:center; gap:.45rem; font-size:var(--text-sm); font-weight:600; color:var(--n-600); background:none; border:1px solid transparent; padding:.35rem .55rem; border-radius:var(--r-full); cursor:pointer; transition:background var(--dur-fast), border-color var(--dur-fast); }
.donut-legend .dl:hover, .donut-legend .dl.on{ background:#fff; border-color:var(--n-200); box-shadow:var(--shadow-xs); }
.donut-legend .dl .sw{ width:11px; height:11px; border-radius:3px; }
.donut-legend .dl b{ color:var(--ink); font-variant-numeric:tabular-nums; }

.rank-callouts{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(.9rem,.5rem + 1vw,1.3rem); }
.callout{ background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); padding:clamp(1.4rem,1rem + 1.5vw,2rem); }
.callout .co-num{ display:block; font-size:clamp(2.6rem,1.8rem + 2.6vw,3.6rem); font-weight:800; letter-spacing:-.04em; line-height:.95; font-variant-numeric:tabular-nums; }
.callout .co-num.c{ color:var(--bp-coral); } .callout .co-num.v{ color:var(--bp-violet); } .callout .co-num.g{ color:var(--green-solid); } .callout .co-num.a{ color:var(--amber); }
.callout .co-lab{ margin-top:.6rem; font-size:var(--text-base); font-weight:700; color:var(--ink); }
.callout .co-sub{ margin-top:.3rem; font-size:var(--text-sm); color:var(--n-500); line-height:1.45; }
.callout.wide{ grid-column:span 2; display:flex; align-items:center; gap:1.5rem; }
.callout.wide .co-num{ flex:none; }

/* shared table card */
.tablecard{ margin-top:clamp(2rem,1.2rem + 2vw,3rem); background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); box-shadow:var(--shadow-sm); overflow:hidden; }
.tc-head{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; padding:clamp(1.2rem,1rem + 1vw,1.6rem) clamp(1.2rem,1rem + 1vw,1.8rem); border-bottom:1px solid var(--n-150); }
.tc-head .tch-t{ font-size:1.15rem; font-weight:800; letter-spacing:-.01em; }
.tc-head .tch-s{ font-size:var(--text-sm); color:var(--n-500); margin-top:.15rem; }
.controls{ display:flex; flex-wrap:wrap; gap:.7rem; align-items:center; }
.searchbox{ position:relative; display:flex; align-items:center; }
.searchbox svg{ position:absolute; left:.85rem; color:var(--n-400); pointer-events:none; }
.searchbox input{ width:min(320px,58vw); padding:.7rem .9rem .7rem 2.5rem; border:1.5px solid var(--n-200); border-radius:var(--r-full); background:var(--color-surface-2); font-size:var(--text-sm); transition:border-color var(--dur-fast),background var(--dur-fast); }
.searchbox input:focus{ outline:none; border-color:var(--bp-violet); background:#fff; }
.filters{ display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.fbtn{ display:inline-flex; align-items:center; gap:.4rem; padding:.6rem .9rem; border-radius:var(--r-full); border:1.5px solid var(--n-200); background:#fff; font-size:var(--text-sm); font-weight:600; color:var(--n-600); transition:all var(--dur-fast); }
.fbtn:hover{ border-color:var(--n-300); }
.fbtn.on{ background:var(--bp-navy); border-color:var(--bp-navy); color:#fff; }
.sortsel{ padding:.6rem 2rem .6rem .9rem; border-radius:var(--r-full); border:1.5px solid var(--n-200); background:#fff; font-size:var(--text-sm); font-weight:600; color:var(--n-600); cursor:pointer; -webkit-appearance:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23888CA8' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .7rem center; }

/* rankings table */
.rtable{ }
.rt-head{ display:grid; grid-template-columns:64px 1.1fr 1.5fr 60px; gap:1rem; padding:.9rem clamp(1.2rem,1rem + 1vw,1.8rem); font-size:var(--text-xs); font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--n-500); border-bottom:1px solid var(--n-150); }
.rt-row{ display:grid; grid-template-columns:64px 1.1fr 1.5fr 60px; gap:1rem; align-items:center; padding:1rem clamp(1.2rem,1rem + 1vw,1.8rem); border-bottom:1px solid var(--n-100); transition:background var(--dur-fast); }
.rt-row:hover{ background:var(--color-surface-2); }
.rt-row:last-of-type{ border-bottom:none; }
.rchip{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; font-weight:800; font-size:1rem; font-variant-numeric:tabular-nums; }
.rchip.p1{ background:var(--green-soft); color:var(--green-solid); }
.rchip.p2{ background:var(--violet-50); color:var(--violet-700); }
.rchip.p3{ background:var(--coral-50); color:var(--coral-700); }
.rt-pub{ display:flex; align-items:center; gap:.75rem; min-width:0; }
.rt-pub-name{ font-weight:700; font-size:var(--text-base); }
.rt-pub-dom{ font-size:var(--text-xs); color:var(--n-500); }
.rt-kw{ display:flex; align-items:center; gap:.55rem; min-width:0; color:var(--n-700); font-size:var(--text-base); }
.rt-kw svg{ flex:none; }
.rt-kw span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rt-go{ justify-self:end; color:var(--n-400); }
.rt-row:hover .rt-go{ color:var(--bp-violet); }
.tbl-foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.8rem; padding:1rem clamp(1.2rem,1rem + 1vw,1.8rem); background:var(--color-surface-2); }
.tbl-foot .muted{ font-size:var(--text-sm); color:var(--n-500); }
.tbl-foot .muted b{ color:var(--ink); }
.linkbtn{ display:inline-flex; align-items:center; gap:.35rem; font-size:var(--text-sm); font-weight:700; color:var(--bp-violet); }
.linkbtn:hover{ color:var(--bp-coral); }
.empty{ padding:2.5rem; text-align:center; color:var(--n-500); font-size:var(--text-sm); }

/* ============================================================================
   DISCOVERY  (search + AI)
   ============================================================================ */
.disc-grid{ margin-top:clamp(2rem,1.2rem + 2vw,3rem); display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(1rem,.6rem + 1.5vw,1.6rem); }
.disc-card{ background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); padding:clamp(1.4rem,1.1rem + 1.5vw,2rem); }
.disc-head{ display:flex; align-items:center; gap:.6rem; font-size:1.1rem; font-weight:800; letter-spacing:-.01em; margin-bottom:1.4rem; }
.disc-head .dh-ic{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; background:var(--violet-50); color:var(--bp-violet); }
.disc-head .beta{ margin-left:auto; font-size:var(--text-2xs); font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:.25rem .55rem; border-radius:var(--r-full); background:var(--coral-50); color:var(--coral-700); }
.disc-search{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }
.se{ border:1px solid var(--n-150); border-radius:var(--r-xl); padding:1.1rem 1.2rem; background:var(--color-surface-2); }
.se-top{ display:flex; align-items:center; justify-content:space-between; }
.se-name{ font-weight:700; font-size:var(--text-base); }
.se-dot{ width:22px; height:22px; border-radius:50%; background:var(--green-soft); color:var(--green-solid); display:grid; place-items:center; }
.se-val{ font-size:2rem; font-weight:800; letter-spacing:-.03em; margin-top:.5rem; color:var(--ink); font-variant-numeric:tabular-nums; }
.se-note{ font-size:var(--text-xs); color:var(--n-500); margin-top:.1rem; }

.disc-ai{ display:flex; flex-direction:column; gap:.4rem; }
.airow{ display:grid; grid-template-columns:auto 1fr auto auto; gap:.9rem; align-items:center; padding:.75rem .3rem; border-bottom:1px solid var(--n-100); }
.airow:last-child{ border-bottom:none; }
.ai-mark{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; font-weight:800; font-size:1.05rem; background:linear-gradient(150deg,var(--bp-violet),#8b7bff); color:#fff; }
.ai-name{ font-weight:700; font-size:var(--text-base); }
.ai-vendor{ font-size:var(--text-xs); color:var(--n-500); }
.ai-status{ display:inline-flex; align-items:center; gap:.35rem; font-size:var(--text-xs); font-weight:700; padding:.35rem .65rem; border-radius:var(--r-full); }
.ai-status.g{ background:var(--green-soft); color:var(--green-solid); }
.ai-status.v{ background:var(--violet-50); color:var(--violet-700); }
.ai-check{ font-size:var(--text-xs); font-weight:700; color:var(--n-500); display:inline-flex; align-items:center; gap:.25rem; }
.ai-check:hover{ color:var(--bp-violet); }
.disc-note{ font-size:var(--text-sm); color:var(--n-500); margin:1.6rem auto 0; line-height:1.55; max-width:74ch; text-align:center; padding-top:1.2rem; border-top:1px solid var(--n-150); }

/* ============================================================================
   PUBLICATIONS TABLE
   ============================================================================ */
.ptable{ }
.pt-head{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr 1fr; gap:1rem; padding:.9rem clamp(1.2rem,1rem + 1vw,1.8rem); font-size:var(--text-xs); font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--n-500); border-bottom:1px solid var(--n-150); }
.pt-head .sortable{ cursor:pointer; display:inline-flex; align-items:center; gap:.3rem; user-select:none; }
.pt-head .sortable:hover{ color:var(--ink); }
.pt-row{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr 1fr; gap:1rem; align-items:center; padding:1rem clamp(1.2rem,1rem + 1vw,1.8rem); border-bottom:1px solid var(--n-100); transition:background var(--dur-fast); }
.pt-row:hover{ background:var(--color-surface-2); }
.pt-row:last-of-type{ border-bottom:none; }
.pt-name{ display:flex; align-items:center; gap:.75rem; min-width:0; }
.pt-name .nm{ font-weight:700; font-size:var(--text-base); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pt-name .sub{ display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.25rem; }
.tagchip{ display:inline-flex; align-items:center; gap:.25rem; font-size:var(--text-2xs); font-weight:700; padding:.2rem .45rem; border-radius:var(--r-sm); }
.tagchip.gn{ background:var(--violet-50); color:var(--violet-700); }
.tagchip.fcc{ background:var(--green-soft); color:var(--green-solid); }
.tagchip.plain{ background:var(--color-surface-2); color:var(--n-500); text-transform:capitalize; }
.authcell{ display:flex; flex-direction:column; gap:.4rem; }
.auth-score{ font-size:1.35rem; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.auth-meter{ height:6px; border-radius:var(--r-full); background:var(--n-100); overflow:hidden; max-width:80px; }
.auth-meter i{ display:block; height:100%; border-radius:var(--r-full); }
.stat-btn{ text-align:left; display:flex; flex-direction:column; }
.stat-val{ font-size:1.15rem; font-weight:700; letter-spacing:-.01em; font-variant-numeric:tabular-nums; color:var(--ink); }
.stat-lab{ font-size:var(--text-xs); color:var(--n-500); }
.stat-btn:hover .stat-val{ color:var(--bp-violet); }

/* verification tooltip */
.tip-wrap, .social-wrap{ position:relative; display:inline-block; }
.tip{ position:absolute; top:calc(100% + 10px); left:0; width:250px; background:var(--bp-navy); color:#fff; border-radius:var(--r-lg); padding:1rem 1.1rem; box-shadow:var(--shadow-lg); opacity:0; visibility:hidden; transform:translateY(-4px); transition:opacity var(--dur-fast),transform var(--dur-fast),visibility var(--dur-fast); z-index:var(--z-tooltip); pointer-events:none; }
.tip.open{ opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; }
.tip::before{ content:""; position:absolute; top:-6px; left:var(--ax,24px); width:12px; height:12px; background:var(--bp-navy); transform:rotate(45deg); }
.tip h5{ font-size:var(--text-sm); font-weight:800; margin-bottom:.4rem; }
.tip p{ font-size:var(--text-xs); line-height:1.5; color:rgba(255,255,255,.78); }
.tip-break{ list-style:none; display:flex; flex-direction:column; gap:.35rem; }
.tip-break li{ font-size:var(--text-xs); color:rgba(255,255,255,.8); }
.tip-break b{ color:#fff; font-variant-numeric:tabular-nums; }
.tip .verify{ display:inline-flex; align-items:center; gap:.3rem; margin-top:.7rem; font-size:var(--text-xs); font-weight:700; color:#FF97A2; }

/* social dropdown */
.social-menu{ position:absolute; top:calc(100% + 8px); left:0; width:236px; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); z-index:var(--z-dropdown); overflow:hidden; }
.social-menu-h{ font-size:var(--text-2xs); font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--n-500); padding:.7rem .9rem .5rem; }
.social-row{ display:grid; grid-template-columns:auto 1fr auto auto; gap:.6rem; align-items:center; padding:.6rem .9rem; transition:background var(--dur-fast); }
.social-row:hover{ background:var(--color-surface-2); }
.social-ic{ color:var(--n-600); display:inline-flex; }
.social-ic.ic-fb{ color:#1877F2; } .social-ic.ic-x{ color:#000; } .social-ic.ic-ig{ color:#E4405F; } .social-ic.ic-yt{ color:#FF0000; }
.social-name{ font-size:var(--text-sm); font-weight:600; }
.social-ct{ font-size:var(--text-sm); font-weight:700; font-variant-numeric:tabular-nums; }
.so-ext{ color:var(--n-400); }

/* mobile pub cards (hidden on desktop) */
.pcards{ display:none; }

/* ============================================================================
   TRUST BADGE
   ============================================================================ */
.tb-layout{ margin-top:clamp(2rem,1.2rem + 2vw,3rem); display:grid; grid-template-columns:1.25fr .9fr; gap:clamp(1.2rem,.7rem + 1.5vw,2rem); align-items:stretch; }
.tb-previewcol{ display:flex; flex-direction:column; gap:clamp(1.2rem,.7rem + 1.5vw,2rem); }
.tb-preview{ flex:1; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); overflow:hidden; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; }
.tb-preview-bar{ display:flex; align-items:center; justify-content:space-between; padding:.9rem 1.2rem; border-bottom:1px solid var(--n-150); }
.tb-eyebrow{ display:inline-flex; align-items:center; gap:.5rem; font-size:var(--text-xs); font-weight:700; color:var(--n-600); }
.tb-eyebrow .dot{ width:8px; height:8px; border-radius:50%; background:var(--bp-coral); box-shadow:0 0 0 4px var(--coral-50); }
.tb-dims{ font-size:var(--text-xs); color:var(--n-400); }
.tb-stage{ flex:1; padding:clamp(1.6rem,1rem + 3vw,3rem); background:repeating-conic-gradient(var(--n-50) 0% 25%, #fff 0% 50%) 50%/22px 22px; display:grid; place-items:center; }

/* the badge itself */
.asseen{ border-radius:var(--r-xl); padding:1.6rem 1.8rem; width:100%; max-width:520px; }
.asseen.bg-light{ background:#fff; }
.asseen.bg-dark{ background:var(--bp-indigo); }
.asseen.bg-transparent{ background:transparent; }
.asseen.shadow{ box-shadow:var(--shadow-lg); }
.ab-row{ display:flex; align-items:center; gap:1rem; justify-content:center; }
.laurel{ width:34px; height:64px; color:var(--amber); flex:none; }
.ab-center{ text-align:center; }
.ab-label{ font-size:var(--text-2xs); font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--n-500); }
.ab-logos{ display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem 1rem; margin-top:.6rem; }
.ab-logo{ font-size:1.05rem; font-weight:800; letter-spacing:-.01em; }
.ab-more{ font-size:var(--text-xs); color:var(--n-500); margin-top:.6rem; }
.ab-verified{ display:flex; align-items:center; justify-content:center; gap:.4rem; margin-top:1rem; padding-top:.9rem; border-top:1px solid var(--n-150); font-size:var(--text-xs); font-weight:600; color:var(--green-solid); }
.asseen.bg-dark .ab-verified{ border-color:rgba(255,255,255,.14); }

.tb-proof{ margin-top:0; display:flex; align-items:center; gap:1.3rem; background:linear-gradient(135deg,var(--coral-50),#fff); border:1px solid var(--coral-100); border-radius:var(--r-2xl); padding:1.5rem 1.7rem; }
.tb-proof-num{ font-size:3rem; font-weight:800; letter-spacing:-.04em; color:var(--bp-coral); line-height:.9; flex:none; }
.tb-proof-tx{ font-size:var(--text-base); line-height:1.5; color:var(--n-600); }
.tb-proof-tx b{ color:var(--ink); }

/* configurator */
.tb-config{ background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); box-shadow:var(--shadow-sm); overflow:hidden; display:flex; flex-direction:column; }
.tb-config-body{ padding:clamp(1.3rem,1rem + 1vw,1.8rem); display:flex; flex-direction:column; gap:1.6rem; }
.tb-section{ }
.tb-sec-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.8rem; }
.tb-sec-title{ font-size:var(--text-base); font-weight:800; }
.tb-sec-count{ font-size:var(--text-xs); color:var(--n-500); }
.tb-multi{ position:relative; }
.tb-multi-trigger{ width:100%; display:flex; align-items:center; justify-content:space-between; padding:.75rem 1rem; border:1.5px solid var(--n-200); border-radius:var(--r-lg); background:var(--color-surface-2); font-size:var(--text-sm); font-weight:600; color:var(--n-700); }
.tb-multi-trigger.open{ border-color:var(--bp-violet); background:#fff; }
.tb-multi-chev{ color:var(--n-400); transition:transform var(--dur-fast); }
.tb-multi-trigger.open .tb-multi-chev{ transform:rotate(90deg); }
.tb-multi-pop{ position:absolute; top:calc(100% + 6px); left:0; right:0; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); z-index:var(--z-dropdown); overflow:hidden; }
.tb-multi-acts{ display:flex; align-items:center; gap:.5rem; padding:.7rem .9rem; border-bottom:1px solid var(--n-150); font-size:var(--text-xs); }
.tb-multi-acts button{ font-weight:700; color:var(--bp-violet); }
.tb-multi-acts .sep{ color:var(--n-300); }
.tb-multi-list{ max-height:220px; overflow-y:auto; padding:.4rem; }
.tb-opt{ width:100%; display:flex; align-items:center; gap:.6rem; padding:.55rem .6rem; border-radius:var(--r-md); font-size:var(--text-sm); font-weight:600; color:var(--n-700); transition:background var(--dur-fast); }
.tb-opt:hover{ background:var(--color-surface-2); }
.checkbox{ width:18px; height:18px; border-radius:5px; border:1.5px solid var(--n-300); display:grid; place-items:center; color:#fff; flex:none; transition:all var(--dur-fast); }
.checkbox svg{ opacity:0; }
.checkbox.on{ background:var(--bp-violet); border-color:var(--bp-violet); }
.checkbox.on svg{ opacity:1; }

.tb-field{ margin-top:1rem; }
.tb-field label{ display:block; font-size:var(--text-sm); font-weight:600; color:var(--n-600); margin-bottom:.5rem; }
.seg{ display:flex; gap:.4rem; background:var(--color-surface-2); padding:.3rem; border-radius:var(--r-lg); }
.seg-btn{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:.4rem; padding:.55rem .5rem; border-radius:var(--r-md); font-size:var(--text-sm); font-weight:600; color:var(--n-600); transition:all var(--dur-fast); }
.seg-btn.on{ background:#fff; color:var(--ink); box-shadow:var(--shadow-sm); }
.seg-sw{ width:14px; height:14px; border-radius:4px; border:1px solid rgba(34,36,76,.14); }
.tb-switches{ display:flex; flex-direction:column; gap:.2rem; }
.switch-row{ display:flex; align-items:center; gap:.7rem; padding:.55rem 0; }
.switch{ width:38px; height:22px; border-radius:var(--r-full); background:var(--n-200); position:relative; transition:background var(--dur-fast); flex:none; }
.switch i{ position:absolute; top:2px; left:2px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:var(--shadow-sm); transition:transform var(--dur-fast); }
.switch.on{ background:var(--bp-violet); }
.switch.on i{ transform:translateX(16px); }
.switch-row .sl{ font-size:var(--text-sm); font-weight:600; color:var(--n-700); }
.tb-actions{ padding:clamp(1.3rem,1rem + 1vw,1.8rem); border-top:1px solid var(--n-150); background:var(--color-surface-2); display:flex; flex-direction:column; gap:.8rem; }
.tb-actions-row{ display:flex; gap:.7rem; }
.tb-actions-row .btn{ flex:1; width:auto; padding-inline:.9rem; }
.tb-update{ width:100%; }
.tb-install{ text-align:center; font-size:var(--text-sm); font-weight:600; color:var(--n-500); display:inline-flex; align-items:center; justify-content:center; gap:.35rem; }
.tb-install:hover{ color:var(--bp-violet); }

/* ============================================================================
   REVIEW
   ============================================================================ */
.review-grid{ margin-top:clamp(2rem,1.2rem + 2vw,3rem); display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(1.2rem,.7rem + 1.5vw,2rem); align-items:stretch; }
.review-aside{ display:flex; flex-direction:column; gap:1.4rem; }
.review-trust{ flex:1; display:flex; flex-direction:column; justify-content:center; background:var(--bp-navy); color:#fff; border-radius:var(--r-2xl); padding:1.9rem; }
.rt-stars{ display:flex; gap:.2rem; color:var(--amber); }
.rt-score{ font-size:2.6rem; font-weight:800; letter-spacing:-.03em; margin-top:.6rem; }
.rt-score span{ font-size:1.1rem; color:rgba(255,255,255,.6); font-weight:600; }
.rt-quote{ font-size:var(--text-base); line-height:1.55; color:rgba(255,255,255,.85); margin-top:.8rem; }
.rt-meta{ font-size:var(--text-sm); color:rgba(255,255,255,.6); margin-top:1rem; }
.rt-meta b{ color:#fff; }
.promo{ background:linear-gradient(135deg,var(--violet-50),#fff); border:1px solid var(--violet-100); border-radius:var(--r-2xl); padding:1.6rem; }
.promo-tag{ display:inline-flex; align-items:center; gap:.4rem; font-size:var(--text-xs); font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--violet-700); }
.promo-head{ font-size:1.35rem; font-weight:800; letter-spacing:-.02em; margin-top:.7rem; }
.promo-sub{ font-size:var(--text-sm); line-height:1.5; color:var(--n-600); margin-top:.4rem; }
.promo-code{ display:flex; align-items:center; gap:.7rem; margin-top:1.1rem; background:#fff; border:1px dashed var(--violet-100); border-radius:var(--r-lg); padding:.7rem .9rem; }
.pc-label{ font-size:var(--text-2xs); font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--n-400); }
.pc-value{ font-size:1.05rem; font-weight:800; letter-spacing:.02em; color:var(--bp-violet); flex:1; }
.pc-copy{ font-size:var(--text-sm); font-weight:700; color:var(--bp-violet); }

.review-card{ background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); box-shadow:var(--shadow-sm); padding:clamp(1.5rem,1.1rem + 1.5vw,2.2rem); display:flex; flex-direction:column; gap:1.4rem; }
.rate-layout{ display:flex; flex-direction:column; gap:1.4rem; }
.rate-banner{ display:flex; align-items:center; gap:1.3rem; background:var(--color-surface-2); border-radius:var(--r-xl); padding:1.3rem 1.5rem; }
.rb-score{ font-size:3rem; font-weight:800; letter-spacing:-.04em; color:var(--ink); line-height:.9; }
.rb-cap{ font-size:var(--text-sm); color:var(--n-500); }
.rate-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1rem 1.4rem; }
.rate-item{ display:flex; align-items:center; justify-content:space-between; gap:.8rem; }
.rl{ font-size:var(--text-base); font-weight:600; color:var(--n-700); }
.stars{ display:flex; gap:.15rem; flex:none; }
.stars button svg{ display:block; max-width:none; }
.stars button{ color:var(--n-200); transition:color var(--dur-fast),transform var(--dur-fast); }
.stars button:hover{ transform:scale(1.12); }
.stars button.on{ color:var(--amber); }
.stars.lg button{ color:var(--n-300); }
.stars.lg button.on{ color:var(--amber); }
.field{ display:flex; flex-direction:column; gap:.5rem; }
.flab{ font-size:var(--text-sm); font-weight:700; color:var(--ink); display:flex; align-items:center; gap:.5rem; }
.fhint{ font-size:var(--text-xs); font-weight:500; color:var(--n-400); }
.field textarea{ min-height:90px; padding:.85rem 1rem; border:1.5px solid var(--n-200); border-radius:var(--r-lg); background:var(--color-surface-2); font-size:var(--text-sm); line-height:1.5; resize:vertical; transition:border-color var(--dur-fast),background var(--dur-fast); }
.field textarea:focus{ outline:none; border-color:var(--bp-violet); background:#fff; }
.reveal-writer{ align-self:flex-start; display:inline-flex; align-items:center; gap:.45rem; font-size:var(--text-sm); font-weight:700; color:var(--bp-violet); padding:.35rem 0; }
.reveal-writer:hover{ color:var(--bp-coral); }
.consent{ display:flex; align-items:center; gap:.6rem; cursor:pointer; }
.consent .check{ width:26px; height:26px; border-radius:8px; border:1.5px solid var(--n-300); display:grid; place-items:center; color:#fff; flex:none; transition:all var(--dur-fast); }
.consent .check svg{ opacity:0; }
.consent .check.on{ background:var(--bp-violet); border-color:var(--bp-violet); }
.consent .check.on svg{ opacity:1; }
.consent span{ font-size:var(--text-sm); color:var(--n-600); line-height:1.5; }
.review-thanks{ text-align:center; align-items:center; padding-block:clamp(3rem,2rem + 3vw,4.5rem); }
.review-thanks .ic{ width:64px; height:64px; border-radius:50%; background:var(--green-soft); color:var(--green-solid); display:grid; place-items:center; margin:0 auto; }

/* ============================================================================
   FOOTER
   ============================================================================ */
.foot{ background:var(--bp-indigo); color:var(--on-dark-soft); padding-block:clamp(3rem,2rem + 3vw,4.5rem) 2rem; }
.foot-in{ max-width:var(--rp-maxw); margin-inline:auto; padding-inline:var(--rp-gut); display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:2rem; }
.foot-main{ max-width:30ch; }
.foot-main .brandlogo-link{ margin-bottom:1rem; }
.foot-main .brandlogo{ margin-bottom:0; }
.foot-main .muted{ font-size:var(--text-sm); line-height:1.55; color:var(--on-dark-soft); }
.foot .tp{ display:flex; align-items:center; gap:.5rem; margin-top:1.1rem; font-size:var(--text-sm); color:var(--on-dark); }
.foot .stars-mini{ display:flex; gap:.1rem; color:var(--amber); }
.foot-links h5{ font-size:var(--text-2xs); font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--on-dark-soft); margin-bottom:1rem; }
.foot-links a{ display:block; font-size:var(--text-sm); color:var(--on-dark); padding-block:.4rem; transition:color var(--dur-fast); }
.foot-links a:hover{ color:#FF97A2; }
.foot-bar{ max-width:var(--rp-maxw); margin:2.5rem auto 0; padding:1.5rem var(--rp-gut) 0; border-top:1px solid var(--on-dark-line); display:flex; flex-wrap:wrap; justify-content:space-between; gap:.8rem; font-size:var(--text-xs); color:var(--on-dark-soft); }

/* ============================================================================
   REVEAL + RESPONSIVE
   ============================================================================ */
.reveal-up{ opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease-out), transform .7s var(--ease-out); }
.reveal-up.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal-up{ opacity:1; transform:none; } }

@media (max-width:1000px){
  .hero-grid{ grid-template-columns:1fr; gap:2.5rem; }
  .hero-rail{ max-width:460px; }
  .story-lead{ grid-template-columns:1fr; }
  .rank-hero{ grid-template-columns:1fr; justify-items:center; }
  .rank-callouts{ width:100%; max-width:600px; }
  .disc-grid{ grid-template-columns:1fr; }
  .tb-layout{ grid-template-columns:1fr; }
  .review-grid{ grid-template-columns:1fr; }
  .foot-in{ grid-template-columns:1fr 1fr; gap:2rem 1.5rem; }
  .foot-main{ grid-column:1 / -1; }
}
@media (max-width:760px){
  .bstat.s-lg, .bstat.s-md, .bstat.s-sm{ grid-column:span 6; }
  .ministats{ grid-template-columns:1fr 1fr; }
  .feat-grid{ grid-template-columns:1fr; }
  .reach-figures{ grid-template-columns:1fr; }
  .reach-nums{ flex-direction:row; flex-wrap:wrap; gap:1.5rem 2.5rem; }
  .rank-callouts{ grid-template-columns:1fr; }
  .callout.wide{ grid-column:span 1; }
  .disc-search{ grid-template-columns:1fr 1fr; }
  .rate-grid{ grid-template-columns:1fr; }
  /* tables to cards */
  .ptable .pt-head, .ptable .pt-row{ display:none; }
  .pcards{ display:flex; flex-direction:column; gap:.8rem; padding:clamp(1rem,.8rem + 1vw,1.4rem); }
  .rt-head{ grid-template-columns:48px 1fr 44px; }
  .rt-head span:nth-child(3){ display:none; }
  .rt-row{ grid-template-columns:48px 1fr 44px; }
  .rt-row .rt-kw{ display:none; }
  .rt-pub .rt-pub-dom{ display:none; }
}
@media (max-width:520px){
  .masthead .report-tag{ display:none; }
  .bstat.s-lg, .bstat.s-md, .bstat.s-sm{ grid-column:span 12; }
  .ministats{ grid-template-columns:1fr; }
  .disc-search{ grid-template-columns:1fr; }
  .foot-in{ grid-template-columns:1fr; }
}

/* mobile publication cards */
.pcard{ border:1px solid var(--n-200); border-radius:var(--r-xl); overflow:hidden; }
.pcard-top{ display:flex; align-items:center; gap:.75rem; padding:1rem; }
.pcard-top .nm{ font-weight:700; }
.pcard-top .sub{ font-size:var(--text-xs); color:var(--n-500); display:flex; gap:.35rem; margin-top:.15rem; }
.pcard-top .sub .gn{ color:var(--violet-700); display:inline-flex; align-items:center; gap:.2rem; }
.pcard-prime{ margin-left:auto; display:flex; gap:1rem; text-align:right; }
.pcard-prime .pv{ display:block; font-weight:800; font-variant-numeric:tabular-nums; }
.pcard-prime .pl{ font-size:var(--text-2xs); color:var(--n-500); }
.pcard .chev{ color:var(--n-400); transition:transform var(--dur-fast); }
.pcard.open .chev{ transform:rotate(90deg); }
.pcard-body{ display:none; padding:0 1rem 1rem; }
.pcard.open .pcard-body{ display:flex; flex-wrap:wrap; gap:1.2rem; align-items:center; }
.pcard-body .mb .mv{ display:block; font-weight:700; font-variant-numeric:tabular-nums; }
.pcard-body .mb .ml{ font-size:var(--text-2xs); color:var(--n-500); }
.verify-link{ font-size:var(--text-xs); font-weight:700; color:var(--bp-violet); display:inline-flex; align-items:center; gap:.3rem; width:100%; }

/* ============================================================================
   FLOATING "How did we do?" CTA
   ============================================================================ */
.fab{ position:fixed; right:clamp(1rem,2vw,1.6rem); bottom:clamp(1rem,2vw,1.6rem); z-index:var(--z-sticky); display:inline-flex; align-items:center; gap:.55rem; padding:.9rem 1.35rem; border-radius:var(--r-full); background:var(--bp-coral); color:#fff; font-weight:700; font-size:var(--text-base); box-shadow:0 14px 30px -8px rgba(251,93,109,.8), 0 4px 12px rgba(8,8,34,.18); transform:translateY(160%); opacity:0; transition:transform .5s var(--ease-out-strong), opacity .35s, background var(--dur-fast); pointer-events:none; }
.fab.in{ transform:translateY(0); opacity:1; pointer-events:auto; }
.fab:hover{ background:var(--bp-coral-deep); transform:translateY(-2px); }
.fab svg{ color:#fff; }
@media (prefers-reduced-motion:reduce){ .fab{ transition:opacity .2s; transform:none; } }

/* ============================================================================
   PRINT / EXPORT
   ============================================================================ */
@media print{
  .fab, .hero-cta{ display:none !important; }
  .hero, .reach, .foot, .band.dark, .bstat.a-coral, .bstat.a-violet, .bstat.a-navy, .bstat.a-green, .review-trust, .tb-stage, .rt-stars, .foot .stars-mini{ -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .band{ break-inside:avoid; padding-block:2.2rem; }
  .reveal-up{ opacity:1 !important; transform:none !important; }
  .tablecard, .fcard, .callout, .disc-card, .bstat{ break-inside:avoid; }
}

/* ============================================================================
   ROUND 4 : diversity note · count-up fixes · AI Overview · outlet grid
   ============================================================================ */
.diversity-note{ display:flex; gap:.85rem; align-items:flex-start; margin-top:clamp(.9rem,.5rem + 1vw,1.3rem); margin-bottom:clamp(.9rem,.5rem + 1vw,1.3rem); padding:1rem 1.2rem; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-xl); box-shadow:var(--shadow-xs); }
.diversity-note .dn-ic{ flex:none; width:34px; height:34px; border-radius:9px; background:var(--violet-50); color:var(--bp-violet); display:grid; place-items:center; margin-top:1px; }
.diversity-note p{ font-size:var(--text-sm); line-height:1.55; color:var(--n-600); }
.diversity-note + .tablecard{ margin-top:0; }
.diversity-note b{ color:var(--ink); }

/* count-up span display fixes */
.bstat .bs-num{ display:block; }
.bstat .bs-num .u{ font-size:.5em; font-weight:800; margin-left:.03em; }
.reach-mega{ display:inline-block; margin-top:1.2rem; }
.reach-mega .u{ font-size:.5em; font-weight:800; letter-spacing:-.02em; }

/* Google AI Overview */
.ai-summary{ display:flex; align-items:center; gap:1.3rem; margin-top:clamp(1.5rem,1rem + 1.5vw,2.4rem); background:#fff; border:1px solid var(--violet-100); border-radius:var(--r-2xl); padding:1.3rem 1.7rem; box-shadow:var(--shadow-sm); }
.ai-sum-num{ font-size:3rem; font-weight:800; letter-spacing:-.04em; color:var(--bp-violet); line-height:.9; flex:none; font-variant-numeric:tabular-nums; }
.ai-sum-tx{ font-size:var(--text-base); color:var(--n-600); line-height:1.5; }
.ai-list{ margin-top:1.4rem; display:grid; grid-template-columns:repeat(auto-fill,minmax(338px,1fr)); gap:1.2rem; }
.aicard{ display:flex; flex-direction:column; gap:1rem; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); padding:1.5rem; box-shadow:var(--shadow-sm); transition:transform .2s var(--ease-out), box-shadow .2s; }
.aicard:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.aic-head{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
.aic-badge{ display:inline-flex; align-items:center; gap:.4rem; font-size:var(--text-2xs); font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:#fff; background:linear-gradient(135deg,var(--bp-violet),#8b7bff); padding:.32rem .62rem; border-radius:var(--r-full); }
.aic-brand{ display:inline-flex; align-items:center; gap:.5rem; font-weight:800; font-size:1.05rem; letter-spacing:-.01em; color:var(--ink); }
.aic-badge{ display:inline-flex; align-items:center; gap:.35rem; font-size:var(--text-2xs); font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--violet-700); background:var(--violet-50); border:1px solid var(--violet-100); padding:.3rem .6rem; border-radius:var(--r-full); }
.aic-q{ display:flex; justify-content:flex-start; }
.aic-bubble{ display:inline-flex; align-items:center; gap:.55rem; background:var(--color-surface-2); border:1px solid var(--n-150); border-radius:12px; padding:.7rem 1rem; font-size:var(--text-sm); font-weight:600; color:var(--n-700); max-width:100%; line-height:1.4; }
.aic-bubble > svg{ color:var(--n-400); flex:none; }
.aic-text{ font-size:var(--text-sm); line-height:1.62; color:var(--n-700); min-height:1.6em; }
.ai-brand{ color:var(--bp-violet); font-weight:700; }
.fade-words .fw{ display:inline-block; opacity:0; transform:translateY(3px); filter:blur(4px); transition:opacity .5s var(--ease-out), transform .5s var(--ease-out), filter .5s var(--ease-out); }
.fade-words.in .fw{ opacity:1; transform:none; filter:none; }
@media (prefers-reduced-motion:reduce){ .fade-words .fw{ opacity:1; transform:none; filter:none; transition:none; } }
.ai-list .aicard{ opacity:0; cursor:pointer; }
.ai-list.play .aicard{ animation:cardIn .55s var(--ease-out) both; animation-delay:var(--d,0ms); }
@media (prefers-reduced-motion:reduce){ .ai-list .aicard{ opacity:1; } .ai-list.play .aicard{ animation:none; } }
.aic-sources{ margin-top:auto; padding-top:1rem; border-top:1px solid var(--n-150); }
.aic-src-lab{ font-size:var(--text-2xs); font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--n-400); margin-bottom:.55rem; }
.aic-src{ display:inline-flex; align-items:center; gap:.5rem; border:1px solid var(--n-200); border-radius:var(--r-full); padding:.32rem .8rem .32rem .35rem; font-size:var(--text-sm); font-weight:700; color:var(--ink); background:#fff; transition:border-color .15s, box-shadow .15s; }
.aic-src .mono{ width:26px; height:26px; border-radius:50%; }
.aic-src svg{ color:var(--n-400); }
.aic-src:hover{ border-color:var(--bp-violet); box-shadow:var(--shadow-sm); }
.aic-foot{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; font-size:var(--text-xs); font-weight:600; color:var(--n-400); margin-top:.9rem; }
.aic-foot-meta{ display:inline-flex; align-items:center; gap:.4rem; min-width:0; }
.aic-check{ display:inline-flex; align-items:center; gap:.3rem; flex:none; font-weight:700; color:var(--bp-violet); }
.aicard:hover .aic-check{ text-decoration:underline; }
.aic-foot svg{ color:var(--bp-violet); }
.ai-empty{ text-align:left; margin:clamp(1.5rem,1rem + 1.5vw,2.4rem) 0 0; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); padding:clamp(1.5rem,1.1rem + 1.5vw,2.1rem); box-shadow:var(--shadow-xs); }
.ai-empty .aie-ic{ width:48px; height:48px; border-radius:13px; background:var(--violet-50); color:var(--bp-violet); display:grid; place-items:center; margin:0 0 1.1rem; }
.aie-t{ font-size:1.2rem; font-weight:800; }
.aie-s{ font-size:var(--text-sm); color:var(--n-600); margin-top:.6rem; line-height:1.6; max-width:70ch; }

/* package placeholder cards (rankings / AI on smaller packages) */
.pkg-note{ margin-top:clamp(1.5rem,1rem + 1.5vw,2.4rem); display:grid; grid-template-columns:1fr 1fr; gap:clamp(1rem,.6rem + 1vw,1.4rem); }
.pkg-card{ background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); padding:clamp(1.5rem,1.1rem + 1.5vw,2.1rem); box-shadow:var(--shadow-xs); }
.pkg-ic{ width:48px; height:48px; border-radius:13px; display:grid; place-items:center; background:var(--violet-50); color:var(--bp-violet); margin-bottom:1.1rem; }
.pkg-ic.amber{ background:var(--amber-soft); color:var(--amber); }
.pkg-h{ font-size:1.2rem; font-weight:800; letter-spacing:-.01em; line-height:1.25; color:var(--ink); }
.pkg-p{ margin-top:.6rem; font-size:var(--text-sm); line-height:1.6; color:var(--n-600); }
.pkg-p a{ font-weight:700; }
@media (max-width:760px){ .pkg-note{ grid-template-columns:1fr; } }

/* Publications outlet card grid */
.pub-toolbar{ display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; margin-top:clamp(1.5rem,1rem + 2vw,2.5rem); }
.pubgrid{ margin-top:1.4rem; display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.1rem; }
.ocard{ position:relative; display:flex; flex-direction:column; gap:1rem; background:#fff; border:1px solid var(--n-200); border-radius:var(--r-2xl); padding:1.4rem; transition:transform .2s var(--ease-out), box-shadow .2s; }
.ocard:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); z-index:30; }
.oc-head{ display:flex; align-items:center; gap:.7rem; }
.oc-id{ flex:1; min-width:0; }
.oc-name{ font-weight:800; font-size:1.02rem; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.oc-dom{ font-size:var(--text-xs); color:var(--n-500); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.oc-tier{ flex:none; font-size:var(--text-2xs); font-weight:800; letter-spacing:.05em; text-transform:uppercase; padding:.28rem .55rem; border-radius:var(--r-full); }
.oc-tier.t-premium{ background:var(--violet-50); color:var(--violet-700); }
.oc-tier.t-major{ background:var(--color-surface-2); color:var(--n-700); }
.oc-tier.t-standard{ background:var(--color-surface-2); color:var(--n-500); }
.oc-auth-row{ display:flex; align-items:baseline; justify-content:space-between; gap:.5rem; margin-bottom:.5rem; }
.oc-auth-lab{ font-size:var(--text-sm); color:var(--n-500); font-weight:600; }
.oc-auth-score{ font-size:1.6rem; font-weight:800; letter-spacing:-.02em; color:var(--ink); font-variant-numeric:tabular-nums; }
.oc-bar{ height:8px; border-radius:var(--r-full); background:var(--n-100); overflow:hidden; }
.oc-fill{ display:block; height:100%; width:var(--w); border-radius:var(--r-full); }
.pubgrid.play .ocard{ animation:cardIn .5s var(--ease-out) both; animation-delay:var(--d,0ms); }
.pubgrid.play .oc-fill{ width:0; animation:barGrow .8s var(--ease-out) both; animation-delay:calc(var(--d,0ms) + .18s); }
@keyframes cardIn{ from{ opacity:0; transform:translateY(-16px) scale(.985); filter:blur(7px); } 60%{ filter:blur(0); } to{ opacity:1; transform:none; filter:none; } }
@keyframes barGrow{ from{ width:0 } to{ width:var(--w) } }
@media (prefers-reduced-motion:reduce){ .pubgrid.play .ocard{ animation:none } .pubgrid.play .oc-fill{ animation:none; width:var(--w) } }
.oc-tags{ display:flex; flex-wrap:wrap; gap:.4rem; }
.oc-metrics{ display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; padding-top:1rem; border-top:1px solid var(--n-150); }
.pub-foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.8rem; margin-top:1.4rem; }
.viewtoggle{ display:inline-flex; background:var(--color-surface-2); border:1px solid var(--n-200); border-radius:var(--r-full); padding:.22rem; gap:.15rem; }
.viewtoggle button{ display:inline-flex; align-items:center; gap:.35rem; padding:.48rem .8rem; border-radius:var(--r-full); font-size:var(--text-sm); font-weight:700; color:var(--n-500); transition:all var(--dur-fast); }
.viewtoggle button.on{ background:#fff; color:var(--ink); box-shadow:var(--shadow-sm); }
.pubtable{ margin-top:1.4rem; border:1px solid var(--n-200); border-radius:var(--r-xl); background:#fff; }
.put-head{ display:grid; grid-template-columns:2.4fr 1.1fr 1fr 1fr 1fr; gap:1rem; padding:.85rem 1.3rem; font-size:var(--text-xs); font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--n-500); background:var(--color-surface-2); border-bottom:1px solid var(--n-150); border-radius:13px 13px 0 0; }
.put-head span:not(:first-child){ text-align:right; }
.put-row{ display:grid; grid-template-columns:2.4fr 1.1fr 1fr 1fr 1fr; gap:1rem; align-items:center; padding:.8rem 1.3rem; border-bottom:1px solid var(--n-100); transition:background var(--dur-fast); }
.put-row:last-child{ border-bottom:none; }
.put-row:hover{ background:var(--color-surface-2); }
.put-name{ display:flex; align-items:center; gap:.7rem; min-width:0; }
.put-name .mono{ flex:none; width:40px; height:40px; border-radius:10px; }
.put-name .mono img{ object-fit:contain; padding:7px; }
.put-name > div:not(.mono){ flex:1; min-width:0; }
.put-nm{ font-weight:700; font-size:var(--text-base); display:flex; align-items:center; gap:.35rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.put-dom{ font-size:var(--text-xs); color:var(--n-500); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.put-name .oc-tier{ flex:none; }
.put-flag{ display:inline-flex; }
.put-flag.gn{ color:var(--violet-700); } .put-flag.fcc{ color:var(--green-solid); }
.put-c{ display:flex; flex-direction:column; align-items:flex-end; gap:.28rem; }
.put-num{ font-size:var(--text-base); font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.put-mini{ width:66px; height:5px; border-radius:var(--r-full); background:var(--n-100); overflow:hidden; }
.put-mini i{ display:block; height:100%; border-radius:var(--r-full); }
.put-row{ position:relative; opacity:0; }
.pubtable.play .put-row{ animation:cardIn .5s var(--ease-out) both; animation-delay:var(--d,0ms); }
.put-row:hover{ z-index:30; }
.put-c .stat-lab{ display:none; }
.put-c .stat-btn{ align-items:flex-end; }
.put-c .stat-val, .put-c .auth-score{ font-size:var(--text-base); font-weight:700; color:var(--ink); }
.put-c .stat-btn:hover .stat-val, .put-c .stat-btn:hover .auth-score{ color:var(--bp-violet); }
@media (prefers-reduced-motion:reduce){ .put-row{ opacity:1 } .pubtable.play .put-row{ animation:none } }
@media (max-width:720px){ .pubtable{ overflow-x:auto; -webkit-overflow-scrolling:touch; } .put-head,.put-row{ grid-template-columns:190px .9fr .9fr .9fr .9fr; min-width:660px; } }

@media (max-width:560px){
  .masthead{ flex-direction:column; align-items:flex-start; gap:1rem; }
  .mh-actions{ width:100%; }
  .ai-list{ grid-template-columns:1fr; }
  .pubgrid{ grid-template-columns:1fr; }
  .ai-summary{ flex-direction:column; align-items:flex-start; gap:.7rem; }
}