/* backlinks.semalt.com — design system v40 "Analytics Cockpit"
   Elevated Semalt-brand dashboard: blue→cyan signature gradient, full dark mode,
   depth, tabular numerics, tasteful motion. Every legacy class name preserved. */

/* ---- self-hosted Inter (proper: body used to fall back to system sans) ---- */
@font-face{font-family:Inter;font-weight:400;font-display:swap;src:url(/assets/fonts/inter-400.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:500;font-display:swap;src:url(/assets/fonts/inter-500.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:600;font-display:swap;src:url(/assets/fonts/inter-600.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:700;font-display:swap;src:url(/assets/fonts/inter-700.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:800;font-display:swap;src:url(/assets/fonts/inter-800.woff2) format("woff2")}
/* ---- display face: Schibsted Grotesk (variable 400..800), headings only ---- */
@font-face{font-family:"Schibsted Grotesk";font-weight:400 800;font-style:normal;font-display:swap;
  src:url(/assets/fonts/schibsted-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:"Schibsted Grotesk";font-weight:400 800;font-style:normal;font-display:swap;
  src:url(/assets/fonts/schibsted-latinext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+1E00-1E9F,U+2020,U+20A0-20AB,U+2C60-2C7F,U+A720-A7FF}

/* ============================ TOKENS (light) ============================ */
:root{
  /* brand */
  --c-primary:#0288d1; --c-primary-hover:#0277b6; --c-primary-strong:#015d8f;
  --c-primary-light:#0288d10f; --c-primary-mid:#0288d122; --c-primary-high:#0288d180;
  --c-cyan:#06b6d4; --c-cyan-light:#06b6d41a; --c-violet:#6d28d9; --c-violet-light:#ede9fe;
  --grad-brand:linear-gradient(135deg,#0288d1 0%,#06b6d4 100%);
  --grad-brand-soft:linear-gradient(135deg,#0288d114,#06b6d414);
  --grad-hero:radial-gradient(1200px 500px at 12% -10%,#0288d122,transparent 60%),radial-gradient(900px 500px at 100% 0,#06b6d41f,transparent 55%);
  /* semantic */
  --c-green:#10b981; --c-green-light:#10b9811a; --c-green-ink:#047857;
  --c-red:#ef4444; --c-red-light:#ef444416; --c-red-ink:#b91c1c;
  --c-amber:#f59e0b; --c-amber-light:#f59e0b1e; --c-amber-ink:#92400e;
  --c-slate:#64748b; --c-slate-light:#64748b16;
  /* neutral surfaces / text (subtle cool bias = on-brand) */
  --c-surface:#ffffff; --c-surface-2:#f7fafc; --c-surface-3:#eef3f9;
  --c-bg:radial-gradient(1100px 700px at 8% -5%,#ffffff 0,#f2f7fc 45%,#eaf1f9 100%);
  --c-border:#e4ebf3; --c-border-dark:#cdd8e5; --c-hair:#eef2f7;
  --c-text:#0f1e33; --c-text-secondary:#48586c; --c-text-muted:#8595a9;
  /* elevation */
  --shadow-xs:0 1px 2px rgba(15,30,51,.05);
  --shadow-sm:0 1px 3px rgba(15,30,51,.07),0 1px 2px rgba(15,30,51,.04);
  --shadow:0 4px 12px rgba(15,30,51,.07),0 1px 3px rgba(15,30,51,.05);
  --shadow-md:0 8px 24px rgba(15,30,51,.09),0 2px 6px rgba(15,30,51,.05);
  --shadow-lg:0 18px 44px rgba(15,30,51,.13),0 4px 12px rgba(15,30,51,.06);
  --shadow-brand:0 8px 24px rgba(2,136,209,.22);
  --ring:0 0 0 3px var(--c-primary-mid);
  /* geometry */
  --r-xs:6px; --r-sm:8px; --r:10px; --r-lg:14px; --r-xl:20px; --r-pill:999px;
  --sb:220px; --hd:60px;
  --ease:cubic-bezier(.4,0,.2,1);
  --font-display:"Schibsted Grotesk",Inter,system-ui,sans-serif;
  /* legacy aliases kept */
  --c-dark:#0f172a; --c-dark-mid:#1e293b; --c-dark-soft:#334155;
  --bd:var(--c-border); --mut:var(--c-text-muted); --pri:var(--c-primary);
  color-scheme:light;
}
/* ============================ TOKENS (dark) ============================ */
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --c-primary:#38b6f0; --c-primary-hover:#5cc4f5; --c-primary-strong:#7fd0f7;
  --c-primary-light:#38b6f014; --c-primary-mid:#38b6f02b; --c-primary-high:#38b6f088;
  --c-cyan:#22d3ee; --c-cyan-light:#22d3ee1f; --c-violet:#a78bfa; --c-violet-light:#a78bfa1f;
  --grad-brand:linear-gradient(135deg,#0d8ecf 0%,#18b6d8 100%);
  --grad-brand-soft:linear-gradient(135deg,#38b6f018,#22d3ee14);
  --grad-hero:radial-gradient(1200px 520px at 12% -10%,#0e7fc033,transparent 60%),radial-gradient(900px 520px at 100% 0,#22d3ee1f,transparent 55%);
  --c-green:#34d399; --c-green-light:#34d39920; --c-green-ink:#6ee7b7;
  --c-red:#f87171; --c-red-light:#f8717120; --c-red-ink:#fca5a5;
  --c-amber:#fbbf24; --c-amber-light:#fbbf2422; --c-amber-ink:#fcd34d;
  --c-slate:#94a3b8; --c-slate-light:#94a3b81f;
  --c-surface:#131c2e; --c-surface-2:#0f1728; --c-surface-3:#1b2740;
  --c-bg:radial-gradient(1100px 760px at 8% -8%,#132135 0,#0c1322 55%,#080e1a 100%);
  --c-border:#24314a; --c-border-dark:#33425f; --c-hair:#1e293b;
  --c-text:#e8eef7; --c-text-secondary:#a9b6c9; --c-text-muted:#6b7a92;
  --shadow-xs:0 1px 2px rgba(0,0,0,.4);
  --shadow-sm:0 1px 3px rgba(0,0,0,.5);
  --shadow:0 4px 14px rgba(0,0,0,.45);
  --shadow-md:0 10px 28px rgba(0,0,0,.5);
  --shadow-lg:0 22px 50px rgba(0,0,0,.6);
  --shadow-brand:0 8px 26px rgba(2,136,209,.35);
  color-scheme:dark;
}}
[data-theme="dark"]{
  --c-primary:#38b6f0; --c-primary-hover:#5cc4f5; --c-primary-strong:#7fd0f7;
  --c-primary-light:#38b6f014; --c-primary-mid:#38b6f02b; --c-primary-high:#38b6f088;
  --c-cyan:#22d3ee; --c-cyan-light:#22d3ee1f; --c-violet:#a78bfa; --c-violet-light:#a78bfa1f;
  --grad-brand:linear-gradient(135deg,#0d8ecf 0%,#18b6d8 100%);
  --grad-brand-soft:linear-gradient(135deg,#38b6f018,#22d3ee14);
  --grad-hero:radial-gradient(1200px 520px at 12% -10%,#0e7fc033,transparent 60%),radial-gradient(900px 520px at 100% 0,#22d3ee1f,transparent 55%);
  --c-green:#34d399; --c-green-light:#34d39920; --c-green-ink:#6ee7b7;
  --c-red:#f87171; --c-red-light:#f8717120; --c-red-ink:#fca5a5;
  --c-amber:#fbbf24; --c-amber-light:#fbbf2422; --c-amber-ink:#fcd34d;
  --c-slate:#94a3b8; --c-slate-light:#94a3b81f;
  --c-surface:#131c2e; --c-surface-2:#0f1728; --c-surface-3:#1b2740;
  --c-bg:radial-gradient(1100px 760px at 8% -8%,#132135 0,#0c1322 55%,#080e1a 100%);
  --c-border:#24314a; --c-border-dark:#33425f; --c-hair:#1e293b;
  --c-text:#e8eef7; --c-text-secondary:#a9b6c9; --c-text-muted:#6b7a92;
  --shadow-xs:0 1px 2px rgba(0,0,0,.4); --shadow-sm:0 1px 3px rgba(0,0,0,.5);
  --shadow:0 4px 14px rgba(0,0,0,.45); --shadow-md:0 10px 28px rgba(0,0,0,.5);
  --shadow-lg:0 22px 50px rgba(0,0,0,.6); --shadow-brand:0 8px 26px rgba(2,136,209,.35);
  color-scheme:dark;
}

/* ============================ BASE ============================ */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,"Google Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color:var(--c-text);font-size:14px;line-height:1.5;background:var(--c-bg) fixed;min-height:100vh;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;
  font-feature-settings:"cv05","cv11";transition:background .3s var(--ease),color .2s var(--ease)}
a{color:var(--c-primary);text-decoration:none;transition:color .15s var(--ease)}
a:hover{color:var(--c-primary-hover)}
.muted{color:var(--c-text-muted)}
::selection{background:var(--c-primary-mid);color:var(--c-text)}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--r-xs)}
/* custom scrollbars */
*{scrollbar-width:thin;scrollbar-color:var(--c-border-dark) transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:var(--c-border-dark);border-radius:99px;border:2px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background:var(--c-slate)}
img{max-width:100%}
b,strong{font-weight:700}

/* ============================ TOPBAR ============================ */
.app-header{position:fixed;top:0;left:0;right:0;height:var(--hd);z-index:60;display:flex;align-items:center;gap:16px;
  padding:0 20px;background:color-mix(in srgb,var(--c-surface) 82%,transparent);
  backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid var(--c-border);transition:box-shadow .25s var(--ease),background .3s var(--ease)}
.app-header.scrolled{box-shadow:var(--shadow-sm)}
.app-brand{display:flex;align-items:center;gap:9px;width:calc(var(--sb) - 12px);flex:none}
.app-brand img{filter:none}
[data-theme="dark"] .app-brand img{filter:brightness(0) invert(1) opacity(.92)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .app-brand img{filter:brightness(0) invert(1) opacity(.92)}}
.app-brand span{font-weight:700;color:var(--c-text);font-size:14px;letter-spacing:-.01em;
  padding-left:9px;margin-left:1px;border-left:1px solid var(--c-border)}
.app-search{flex:1;max-width:640px;position:relative;display:flex;align-items:center}
.app-search .s-ic{position:absolute;left:15px;font-size:14px;color:var(--c-text-muted);pointer-events:none;transition:color .15s}
.app-search:focus-within .s-ic{color:var(--c-primary)}
.app-search input{flex:1;height:42px;padding:0 12px 0 40px;border:1px solid var(--c-border);border-right:0;
  border-radius:var(--r-sm) 0 0 var(--r-sm);background:var(--c-surface);color:var(--c-text);outline:none;font-size:14px;
  transition:border-color .15s,box-shadow .15s,background .3s}
.app-search input::placeholder{color:var(--c-text-muted)}
.app-search:focus-within input{border-color:var(--c-primary-high);box-shadow:var(--ring)}
.app-search button{height:42px;padding:0 20px;border:0;border-radius:0 var(--r-sm) var(--r-sm) 0;background:var(--grad-brand);
  color:#fff;font-weight:700;cursor:pointer;transition:filter .15s,box-shadow .15s}
.app-search button:hover{filter:brightness(1.06);box-shadow:var(--shadow-brand)}
.app-search .kbd-hint{position:absolute;right:96px;top:50%;transform:translateY(-50%);pointer-events:none;
  color:var(--c-text-muted);opacity:.75}
.app-header__right{margin-left:auto;display:flex;align-items:center;gap:10px}
.badge-free{display:inline-flex;align-items:center;gap:6px;background:var(--c-green-light);color:var(--c-green-ink);
  font-weight:700;font-size:12px;padding:6px 12px;border-radius:var(--r-pill);border:1px solid transparent}
.badge-free::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c-green);box-shadow:0 0 0 3px var(--c-green-light);animation:pulse 2.4s var(--ease) infinite}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex:none;cursor:pointer;
  border:1px solid var(--c-border);border-radius:var(--r-sm);background:var(--c-surface);color:var(--c-text-secondary);
  font-size:15px;transition:all .15s var(--ease)}
.icon-btn:hover{border-color:var(--c-border-dark);color:var(--c-primary);transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.icon-btn:active{transform:translateY(0)}
.nav-toggle{display:none}
.kbd{display:inline-flex;align-items:center;gap:2px;min-width:18px;height:20px;padding:0 5px;font-size:11px;font-weight:600;
  font-family:inherit;color:var(--c-text-muted);background:var(--c-surface-3);border:1px solid var(--c-border);
  border-bottom-width:2px;border-radius:5px;line-height:1}

/* ============================ SIDEBAR ============================ */
.sidebar{position:fixed;top:var(--hd);left:0;bottom:0;width:var(--sb);background:var(--c-surface);
  border-right:1px solid var(--c-border);overflow-y:auto;display:flex;flex-direction:column;z-index:50;
  transition:transform .25s var(--ease)}
.sidebar-nav{padding:16px 10px 10px}
.sidebar-target{display:flex;align-items:center;gap:9px;margin:0 4px 12px;padding:10px 12px;border:1px solid var(--c-primary-mid);
  background:var(--grad-brand-soft);border-radius:var(--r);font-weight:700;font-size:13px;color:var(--c-text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-shadow:var(--shadow-xs)}
.sidebar-target .dot{width:9px;height:9px;border-radius:50%;background:var(--c-green);flex:none;
  box-shadow:0 0 0 3px var(--c-green-light);animation:pulse 2.4s var(--ease) infinite}
.sidebar-section{margin-bottom:10px;padding-bottom:10px}
.sidebar-section:not(:last-child){border-bottom:1px solid var(--c-border)}
.sidebar-section-title{display:flex;gap:8px;align-items:center;width:100%;padding:6px 12px 8px;color:var(--c-text-muted);
  font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.sidebar-item{position:relative;display:flex;gap:11px;align-items:center;padding:9px 12px;margin:2px 0;color:var(--c-text-secondary);
  font-size:.8125rem;border-radius:var(--r-sm);font-weight:500;transition:background .15s var(--ease),color .15s var(--ease),transform .1s var(--ease)}
.sidebar-item i{width:18px;font-size:.9rem;text-align:center;color:var(--c-text-muted);flex:none;transition:color .15s}
.sidebar-item:hover{background:var(--c-surface-3);color:var(--c-text)}
.sidebar-item:hover i{color:var(--c-primary)}
.sidebar-item.active{background:var(--c-primary-light);color:var(--c-primary);font-weight:600}
.sidebar-item.active i{color:var(--c-primary)}
.sidebar-item.active::before{content:"";position:absolute;left:-10px;top:50%;transform:translateY(-50%);
  width:3px;height:20px;border-radius:0 3px 3px 0;background:var(--grad-brand)}
.sidebar-foot{margin-top:auto;padding:14px;font-size:11px;line-height:1.6;color:var(--c-text-muted);border-top:1px solid var(--c-border)}
.scrim{position:fixed;inset:var(--hd) 0 0 0;background:rgba(8,14,26,.5);z-index:45;opacity:0;visibility:hidden;transition:.2s}
.scrim.show{opacity:1;visibility:visible}

.page-with-sidebar{margin-left:var(--sb);min-height:100vh}
.page-wrapper{max-width:1720px;margin:0 auto;padding:calc(var(--hd) + 26px) 26px 64px}
@media(max-width:1024px){
  .sidebar{transform:translateX(-100%);box-shadow:var(--shadow-lg)}
  .sidebar.open{transform:none}
  .page-with-sidebar{margin-left:0}
  .app-brand{width:auto}
  .nav-toggle{display:inline-flex}
  .app-search{max-width:none}
  .app-search .kbd-hint{display:none}
}

/* ============================ PAGE HEADER ============================ */
.page-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-bottom:1.4rem}
.page-title{color:var(--c-text);font-size:1.6rem;font-weight:800;line-height:1.15;margin:0 0 .3rem;letter-spacing:-.02em}
.page-subtitle{color:var(--c-text-secondary);font-size:.875rem;line-height:1.5}
.page-subtitle strong{color:var(--c-primary);font-weight:700}
.page-header__actions{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}

/* ============================ STAT CARDS ============================ */
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-bottom:1.1rem}
.stat-card{position:relative;display:flex;align-items:center;gap:.85rem;padding:1.05rem 1.1rem;min-width:0;
  border:1px solid var(--c-border);border-radius:var(--r-lg);background:var(--c-surface);box-shadow:var(--shadow-sm);
  overflow:hidden;transition:transform .18s var(--ease),box-shadow .18s var(--ease),border-color .18s var(--ease)}
.stat-card::after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--grad-brand);opacity:0;transition:opacity .18s}
.stat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--c-border-dark)}
.stat-card:hover::after{opacity:1}
.stat-card__icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 46px;width:46px;height:46px;
  border-radius:var(--r);font-size:1.05rem;transition:transform .18s var(--ease)}
.stat-card:hover .stat-card__icon{transform:scale(1.06) rotate(-3deg)}
.stat-card__icon--primary{background:var(--c-primary-light);color:var(--c-primary)}
.stat-card__icon--blue{background:var(--c-cyan-light);color:var(--c-cyan)}
.stat-card__icon--green{background:var(--c-green-light);color:var(--c-green)}
.stat-card__icon--purple{background:var(--c-violet-light);color:var(--c-violet)}
.stat-card__label{color:var(--c-text-muted);font-size:.6875rem;font-weight:600;line-height:1.2;text-transform:uppercase;letter-spacing:.06em}
.stat-card__sub{margin-top:3px;color:var(--c-text-muted);font-size:.75rem;font-weight:500;line-height:1.2}
.stat-card__value{margin-top:.28rem;color:var(--c-text);font-size:1.6rem;font-weight:800;line-height:1.1;
  font-variant-numeric:tabular-nums;white-space:nowrap;letter-spacing:-.02em}
.dr-num{font-weight:800;font-variant-numeric:tabular-nums}
.dr-num--high{color:var(--c-green-ink)} .dr-num--medium{color:var(--c-amber-ink)} .dr-num--low{color:var(--c-slate)}
@media(max-width:1100px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.stats-grid{grid-template-columns:1fr}}

/* ============================ FILTER BAR + FORMS ============================ */
.filter-bar{padding:1rem 1.05rem .85rem;margin-bottom:1.1rem;border:1px solid var(--c-border);border-radius:var(--r-lg);
  background:var(--c-surface);box-shadow:var(--shadow-sm)}
.filter-bar__row{display:flex;flex-wrap:wrap;align-items:end;gap:.6rem}
.fb-field label{display:block;font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--c-text-muted);margin-bottom:5px}
.input-icon{position:relative}
.input-icon-addon{position:absolute;top:50%;left:12px;color:var(--c-text-muted);font-size:.8125rem;transform:translateY(-50%);pointer-events:none}
.input-icon .form-control{padding-left:34px}
.form-control{width:100%;border:1px solid var(--c-border);border-radius:var(--r-sm);background:var(--c-surface);color:var(--c-text);
  outline:none;transition:border-color .15s var(--ease),box-shadow .15s var(--ease),background .3s}
.form-control::placeholder{color:var(--c-text-muted)}
.form-control:hover{border-color:var(--c-border-dark)}
.form-control:focus{border-color:var(--c-primary-high);box-shadow:var(--ring)}
.form-control-sm{height:38px;padding:0 12px;font-size:.8125rem}
select.form-control-sm{padding-right:8px;cursor:pointer}

/* ============================ TABLE CARD + TABLES ============================ */
.table-card{position:relative;overflow:hidden;border:1px solid var(--c-border);border-radius:var(--r-lg);
  background:var(--c-surface);box-shadow:var(--shadow-sm);transition:box-shadow .2s var(--ease)}
.table-card:hover{box-shadow:var(--shadow)}
.table-card__header,.table-card__footer{padding:.75rem 1.05rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.table-card__header{border-bottom:1px solid var(--c-border);font-weight:700}
.table-card__header b{font-size:.9rem;letter-spacing:-.01em}
.table-card__footer{border-top:1px solid var(--c-border);background:var(--c-surface-2)}
.table-caption{font-size:.75rem;color:var(--c-text-muted);font-weight:500}
.table-responsive{width:100%;overflow-x:auto}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:.85rem .7rem;border-bottom:1px solid var(--c-hair)}
.table th{text-align:left}
.table-vcenter td{vertical-align:middle}
.data-table{font-size:.8125rem}
.data-table thead th{position:sticky;top:0;z-index:1;background:var(--c-surface-2);color:var(--c-text-muted);
  font-size:.6875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;user-select:none;white-space:nowrap;
  border-bottom:1px solid var(--c-border);box-shadow:inset 0 -1px 0 var(--c-border)}
.data-table tbody tr{transition:background .12s var(--ease)}
.data-table tbody tr:hover{background:var(--c-primary-light)}
.data-table tbody tr:hover .rownum{color:var(--c-primary)}
.th-sort{cursor:pointer;transition:color .15s}
.th-sort:hover,.th-sort.sorted{color:var(--c-primary)}
.sort-icon{margin-left:3px;font-size:.625rem;opacity:.4}
.th-sort.sorted .sort-icon{opacity:1}
.cell-end{text-align:right}.cell-center{text-align:center}
.num-col{width:48px;text-align:right;padding-right:14px!important}
.rownum{color:var(--c-text-muted);font-size:.75rem;font-weight:700;font-variant-numeric:tabular-nums;transition:color .12s}
.t-metric{color:var(--c-text);font-size:.8125rem;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.t-date{color:var(--c-text-secondary);font-size:.8125rem;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.donor-link{display:inline-flex;align-items:center;gap:.35rem;max-width:340px;color:var(--c-primary);font-size:.8125rem;font-weight:650}
.donor-link::before{content:"\f0c1";font-family:"Font Awesome 6 Free";font-weight:900;font-size:.62rem;opacity:.35;flex:none}
.donor-link span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.donor-link:hover{text-decoration:underline}.donor-link:hover::before{opacity:.7}
.topic-cell{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:360px;
  color:var(--c-text-secondary);font-size:.8125rem;line-height:1.4}
.table-state{padding:2.25rem 1rem!important;color:var(--c-text-muted);font-size:.875rem;font-weight:600;text-align:center}

/* ============================ BADGES ============================ */
.dr-badge{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:24px;padding:0 .5rem;
  border-radius:var(--r-pill);font-size:.75rem;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;border:1px solid transparent}
.dr-badge--high{background:var(--c-green-light);color:var(--c-green-ink);border-color:color-mix(in srgb,var(--c-green) 22%,transparent)}
.dr-badge--medium{background:var(--c-amber-light);color:var(--c-amber-ink);border-color:color-mix(in srgb,var(--c-amber) 22%,transparent)}
.dr-badge--low{background:var(--c-slate-light);color:var(--c-slate);border-color:color-mix(in srgb,var(--c-slate) 20%,transparent)}
.type-badge{display:inline-flex;align-items:center;gap:.35rem;min-height:22px;padding:0 .5rem;border-radius:var(--r-pill);
  font-size:.625rem;font-weight:800;line-height:1;text-transform:uppercase;white-space:nowrap;letter-spacing:.02em}
.type-badge--do{background:var(--c-green-light);color:var(--c-green-ink)}
.type-badge--no{background:var(--c-red-light);color:var(--c-red-ink)}
.type-badge--a{background:var(--c-cyan-light);color:var(--c-cyan)}
.type-badge--img{background:var(--c-violet-light);color:var(--c-violet)}
.pct-cell{min-width:120px}
.pct-bar{height:6px;border-radius:4px;background:var(--c-surface-3);overflow:hidden;margin-top:4px}
.pct-bar>i{display:block;height:100%;background:var(--grad-brand);border-radius:4px;transition:width .6s var(--ease)}
.follow-split{height:9px;border-radius:5px;background:var(--c-red-light);overflow:hidden;min-width:120px}
.follow-split>i{display:block;height:100%;background:var(--c-green);border-radius:5px;transition:width .8s var(--ease)}

/* ============================ BUTTONS ============================ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:var(--r-sm);border:1px solid transparent;
  padding:.55rem .95rem;font-weight:700;font-size:.8125rem;line-height:1.15;cursor:pointer;white-space:nowrap;
  transition:background .15s var(--ease),border-color .15s var(--ease),color .15s var(--ease),box-shadow .15s var(--ease),transform .1s var(--ease);text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn-sm{min-height:38px;padding:.45rem .8rem;font-size:.8125rem}
.btn-primary{background:var(--grad-brand);color:#fff;box-shadow:var(--shadow-xs)}
.btn-primary:hover{color:#fff;filter:brightness(1.06);box-shadow:var(--shadow-brand);transform:translateY(-1px)}
.btn-outline-secondary,.btn.ghost{border-color:var(--c-border);background:var(--c-surface);color:var(--c-text-secondary)}
.btn-outline-secondary:hover,.btn.ghost:hover{border-color:var(--c-border-dark);color:var(--c-primary);box-shadow:var(--shadow-xs);transform:translateY(-1px)}
.btn.sm{padding:.35rem .6rem;font-size:.75rem;min-height:0}

/* ============================ PAGER ============================ */
.pager{display:flex;align-items:center;gap:10px;justify-content:center}
.pager .btn i{font-size:.7rem}
.empty{padding:40px;text-align:center;color:var(--c-text-muted)}
.err,.data-note--warning{margin:0 0 1.1rem;padding:.85rem 1rem;border-radius:var(--r);font-size:.8125rem;font-weight:600;line-height:1.45;
  background:var(--c-amber-light);color:var(--c-amber-ink);border:1px solid color-mix(in srgb,var(--c-amber) 24%,transparent);
  display:flex;gap:.6rem;align-items:center}
.data-note--warning::before{content:"\f071";font-family:"Font Awesome 6 Free";font-weight:900;opacity:.8}

/* ============================ OVERVIEW WIDGETS ============================ */
.ov-cols{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem;margin-top:1.1rem}
@media(max-width:1024px){.ov-cols{grid-template-columns:1fr}}
.ov-cols h4{margin:0 0 8px;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--c-text-muted);font-weight:700}
.view-all{color:var(--c-primary);font-size:.8125rem;font-weight:650;display:inline-flex;align-items:center;gap:6px;transition:gap .15s var(--ease)}
.view-all i{font-size:.6rem;transition:transform .15s var(--ease)}
.view-all:hover{text-decoration:none}.view-all:hover i{transform:translateX(3px)}
.ov-cols2{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.1rem}
@media(max-width:900px){.ov-cols2{grid-template-columns:1fr}}
.cloud{padding:1.1rem;display:flex;flex-wrap:wrap;gap:.4rem .7rem;align-items:baseline}
.cloud .cw{color:var(--c-primary);line-height:1.2;cursor:default;transition:color .15s}
.cloud .cw:nth-child(3n){color:var(--c-violet)} .cloud .cw:nth-child(3n+1){color:var(--c-text)}
.dist-col{display:flex;flex-direction:column;gap:1rem}
.distbars{padding:.9rem 1.05rem;display:flex;flex-direction:column;gap:.55rem}
.bar{display:grid;grid-template-columns:70px 1fr 62px;align-items:center;gap:.55rem;font-size:.75rem}
.bar .bl{color:var(--c-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.bar .bt{background:var(--c-surface-3);border-radius:5px;height:9px;overflow:hidden}
.bar .bt i{display:block;height:100%;background:var(--grad-brand);border-radius:5px;transition:width .7s var(--ease)}
.bar .bv{text-align:right;color:var(--c-text);font-variant-numeric:tabular-nums;font-weight:700}

/* mini metric tiles */
.mini-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:.8rem;margin-top:1.1rem}
@media(max-width:900px){.mini-stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.mini-stats{grid-template-columns:repeat(2,1fr)}}
.mini{position:relative;border:1px solid var(--c-border);border-radius:var(--r);background:var(--c-surface);padding:.8rem .9rem;
  box-shadow:var(--shadow-xs);transition:transform .16s var(--ease),box-shadow .16s var(--ease),border-color .16s}
.mini:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);border-color:var(--c-border-dark)}
.mini-v{font-size:1.3rem;font-weight:800;color:var(--c-text);font-variant-numeric:tabular-nums;line-height:1.1;letter-spacing:-.02em}
.mini-l{margin-top:.25rem;font-size:.7rem;color:var(--c-text-muted);text-transform:uppercase;letter-spacing:.05em;line-height:1.25;font-weight:600}

/* active-filter chips */
.fchips{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.7rem}
.fchip{display:inline-flex;align-items:center;gap:.4rem;padding:.25rem .6rem;font-size:.72rem;border:1px solid var(--c-border);
  border-radius:var(--r-pill);background:var(--c-surface);color:var(--c-text-muted);box-shadow:var(--shadow-xs)}
.fchip b{color:var(--c-text);font-weight:700}
.fchip i{cursor:pointer;color:var(--c-text-muted);transition:color .15s}
.fchip i:hover{color:var(--c-red)}

/* ============================ HERO / HOME ============================ */
.hero{position:relative;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-xl);
  padding:40px 40px;margin-bottom:22px;box-shadow:var(--shadow);overflow:hidden;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;background:var(--grad-hero);z-index:-1}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.5;
  background-image:linear-gradient(var(--c-border) 1px,transparent 1px),linear-gradient(90deg,var(--c-border) 1px,transparent 1px);
  background-size:34px 34px;-webkit-mask-image:radial-gradient(650px 340px at 78% 8%,#000,transparent 72%);
  mask-image:radial-gradient(650px 340px at 78% 8%,#000,transparent 72%)}
.hero .eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:.72rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.09em;color:var(--c-primary);background:var(--c-primary-light);border:1px solid var(--c-primary-mid);
  padding:5px 12px;border-radius:var(--r-pill);margin-bottom:16px}
.hero h1{font-size:2.35rem;font-weight:800;letter-spacing:-.03em;line-height:1.08;max-width:20ch;margin:0 0 .5rem}
.hero h1 .grad{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:var(--c-text-secondary);max-width:62ch;font-size:1rem;line-height:1.6;margin:.5rem 0}
.hero b{color:var(--c-text);font-weight:700}
.bigsearch{display:flex;gap:0;max-width:660px;margin:22px 0 6px;box-shadow:var(--shadow-sm);border-radius:var(--r-lg)}
.bigsearch input{flex:1;height:54px;padding:0 18px;border:1px solid var(--c-border-dark);border-right:0;
  border-radius:var(--r-lg) 0 0 var(--r-lg);font-size:15px;outline:none;background:var(--c-surface);color:var(--c-text);
  transition:border-color .15s,box-shadow .15s}
.bigsearch input::placeholder{color:var(--c-text-muted)}
.bigsearch input:focus{border-color:var(--c-primary);box-shadow:var(--ring)}
.bigsearch button{height:54px;padding:0 28px;border:0;border-radius:0 var(--r-lg) var(--r-lg) 0;background:var(--grad-brand);
  color:#fff;font-weight:700;font-size:15px;cursor:pointer;transition:filter .15s,box-shadow .15s}
.bigsearch button:hover{filter:brightness(1.06);box-shadow:var(--shadow-brand)}
.hero-suggests{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:14px;align-items:center}
.hero-suggests .lbl{font-size:.75rem;color:var(--c-text-muted);margin-right:.2rem}
.hero-suggests a{font-size:.78rem;font-weight:600;color:var(--c-text-secondary);background:var(--c-surface-2);
  border:1px solid var(--c-border);padding:4px 11px;border-radius:var(--r-pill);transition:all .15s var(--ease)}
.hero-suggests a:hover{color:var(--c-primary);border-color:var(--c-primary-high);transform:translateY(-1px)}
.stat-row{display:flex;flex-wrap:wrap;gap:30px;margin-top:18px}
.stat-row>div{display:flex;flex-direction:column}
.stat-row b{font-size:1.35rem;font-weight:800;color:var(--c-text);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.stat-row span{font-size:.78rem;color:var(--c-text-muted)}
@media(max-width:600px){.hero{padding:28px 22px}.hero h1{font-size:1.85rem}}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:1100px){.grid2{grid-template-columns:1fr}}
.ov-cols--home{grid-template-columns:1.15fr .85fr}
@media(max-width:900px){.ov-cols--home{grid-template-columns:1fr}}
.home-tools{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;padding:1.05rem}
@media(max-width:520px){.home-tools{grid-template-columns:1fr}}
.home-tool{display:block;padding:.85rem .95rem;border:1px solid var(--c-border);border-radius:var(--r);background:var(--c-surface);
  color:inherit;text-decoration:none;transition:border-color .16s var(--ease),box-shadow .16s var(--ease),transform .16s var(--ease)}
.home-tool:hover{border-color:var(--c-primary-high);box-shadow:var(--shadow);transform:translateY(-3px)}
.home-tool h3{margin:0 0 .25rem;font-size:.85rem;font-weight:700;color:var(--c-text);display:flex;align-items:center;gap:.4rem}
.home-tool h3::before{content:"\f0da";font-family:"Font Awesome 6 Free";font-weight:900;color:var(--c-primary);font-size:.7rem;transition:transform .16s}
.home-tool:hover h3::before{transform:translateX(3px)}
.home-tool p{margin:0;font-size:.74rem;color:var(--c-text-muted);line-height:1.4}

/* ============================ HEADINGS / MISC PAGES ============================ */
.main h1,h1{font-size:1.7rem;font-weight:800;color:var(--c-text);margin:0 0 .5rem;line-height:1.15;letter-spacing:-.02em}
h2{font-size:1.2rem;font-weight:700;margin:0 0 .75rem;letter-spacing:-.01em}
h3{font-size:.95rem;font-weight:700;margin:0 0 .35rem}
code{background:var(--c-slate-light);color:var(--c-text);padding:2px 6px;border-radius:5px;font-size:.85em;
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace}
pre{background:#0d1526;color:#dce6f3;padding:18px;border-radius:var(--r-lg);overflow-x:auto;font-size:.8rem;line-height:1.65;
  border:1px solid var(--c-border);font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace}
.panel{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);margin-bottom:16px;overflow:hidden}
.panel-b{padding:18px 20px}
.panel-h{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--c-border)}
.panel-h h2{margin:0;font-size:1rem}
table.data{width:100%;border-collapse:collapse;font-size:.8125rem}
table.data th{background:var(--c-surface-2);color:var(--c-text-muted);text-align:left;font-weight:700;font-size:.6875rem;
  text-transform:uppercase;letter-spacing:.05em;padding:11px 14px;border-bottom:1px solid var(--c-border);white-space:nowrap}
table.data td{padding:11px 14px;border-bottom:1px solid var(--c-hair);vertical-align:middle}
table.data tbody tr{transition:background .12s}
table.data tbody tr:hover{background:var(--c-primary-light)}
.data .num{text-align:right;font-variant-numeric:tabular-nums}
.data .dom a{font-weight:650}
.nos{white-space:nowrap}
.dr{display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:22px;padding:0 6px;border-radius:var(--r-pill);font-size:.72rem;font-weight:800;font-variant-numeric:tabular-nums}
.dr.dr-hi{background:var(--c-green-light);color:var(--c-green-ink)}
.dr.dr-mid{background:var(--c-primary-light);color:var(--c-primary)}
.dr.dr-lo{background:var(--c-amber-light);color:var(--c-amber-ink)}
.dr.dr-min{background:var(--c-slate-light);color:var(--c-slate)}

/* tools grid */
.toolgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(266px,1fr));gap:14px;margin-bottom:8px}
.tool{position:relative;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:16px 18px;
  box-shadow:var(--shadow-xs);transition:border-color .16s var(--ease),box-shadow .16s var(--ease),transform .16s var(--ease)}
.tool h3{margin:0 0 5px;font-size:.9rem}
.tool p{margin:0;font-size:.8rem;color:var(--c-text-secondary);line-height:1.45}
a.tool:hover{border-color:var(--c-primary-high);box-shadow:var(--shadow-md);transform:translateY(-3px)}
.cathead{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--c-text-muted);font-weight:800;
  margin:26px 0 12px;display:flex;align-items:center;gap:.6rem}
.cathead::after{content:"";flex:1;height:1px;background:var(--c-border)}
.badge{font-size:.58rem;font-weight:800;padding:2px 8px;border-radius:var(--r-pill);background:var(--c-green-light);
  color:var(--c-green-ink);text-transform:uppercase;letter-spacing:.03em;vertical-align:middle}
.badge.soon{background:var(--c-slate-light);color:var(--c-slate)}
.chip{display:inline-flex;align-items:center;font-size:.62rem;font-weight:700;padding:2px 8px;border-radius:var(--r-pill);background:var(--c-slate-light);color:var(--c-slate)}
.chip.r{background:var(--c-red-light);color:var(--c-red-ink)}
.chip.g{background:var(--c-green-light);color:var(--c-green-ink)}

/* legacy filters + pager (top/report pages) */
.filters{display:flex;flex-wrap:wrap;align-items:end;gap:12px;padding:16px 18px;border-bottom:1px solid var(--c-border)}
.filters .f{display:flex;flex-direction:column}
.filters .f label{font-size:.6875rem;font-weight:700;text-transform:uppercase;color:var(--c-text-muted);margin-bottom:5px}
.filters .f input,.filters .f select{height:38px;padding:0 12px;border:1px solid var(--c-border);border-radius:var(--r-sm);font-size:.85rem;outline:none;background:var(--c-surface);color:var(--c-text)}
.filters .f input:focus,.filters .f select:focus{border-color:var(--c-primary-high);box-shadow:var(--ring)}
.pager.pg-split{justify-content:space-between;align-items:center}
.pager .pg{display:flex;gap:8px;align-items:center}
.pager .pg a{padding:7px 13px;border:1px solid var(--c-border);border-radius:var(--r-sm);color:var(--c-text-secondary);transition:all .15s}
.pager .pg a:hover{border-color:var(--c-primary-high);color:var(--c-primary)}
.pager .pg .cur{font-weight:700;color:#fff;background:var(--grad-brand);border-color:transparent;padding:7px 13px;border-radius:var(--r-sm)}
.prbar-bg{display:inline-block;width:60px;height:6px;background:var(--c-surface-3);border-radius:3px;margin-left:6px;vertical-align:middle;overflow:hidden}
.prbar{display:inline-block;height:6px;background:var(--grad-brand);border-radius:3px;vertical-align:middle}

/* ============================ DISPLAY FONT (headings only) ============================ */
.hero h1,.page-title,.main h1,h1,h2,.table-card__header b,.cathead,.panel-h h2{
  font-family:var(--font-display);letter-spacing:-.02em;font-feature-settings:"ss01"}
.hero h1{letter-spacing:-.035em}

/* ============================ SPARKLINE / TREND ============================ */
.stat-card__spark{margin-left:auto;flex:none;align-self:stretch;display:flex;align-items:flex-end;width:76px;opacity:.95}
.stat-card__spark svg{width:100%;height:38px;overflow:visible;display:block}
.spark-line{fill:none;stroke:var(--c-primary);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  filter:drop-shadow(0 1px 2px var(--c-primary-mid))}
.spark-area{fill:url(#sparkfill);opacity:.5}
.spark-dot{fill:var(--c-surface);stroke:var(--c-primary);stroke-width:2}
.spark-line--anim{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:sparkdraw 1s var(--ease) forwards}
@keyframes sparkdraw{to{stroke-dashoffset:0}}
/* growth panel */
.trend-card{padding:1rem 1.15rem 1.1rem}
.trend-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.4rem}
.trend-head .tt{font-size:.9rem;font-weight:700;font-family:var(--font-display);letter-spacing:-.01em}
.trend-head .ts{font-size:.72rem;color:var(--c-text-muted)}
.trend-legend{display:flex;gap:1rem;font-size:.7rem;color:var(--c-text-muted);margin-top:.5rem}
.trend-legend i{display:inline-block;width:10px;height:3px;border-radius:2px;vertical-align:middle;margin-right:5px}
.trend-svg{width:100%;height:120px;display:block;overflow:visible}

/* ============================ EXPANDABLE REF-DOMAIN ROWS ============================ */
.rd-toggle{display:inline-flex;align-items:center;gap:.45rem;cursor:pointer;color:var(--c-primary);font-weight:650;max-width:300px;vertical-align:middle}
.rd-toggle .caret{font-size:.62rem;color:var(--c-text-muted);transition:transform .18s var(--ease),color .18s}
.rd-toggle.open .caret{transform:rotate(90deg);color:var(--c-primary)}
.rd-toggle span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rd-toggle:hover span{text-decoration:underline}
.rd-toggle:hover .caret{color:var(--c-primary)}
.rd-ext{margin-left:.5rem;color:var(--c-text-muted);font-size:.72rem;vertical-align:middle}
.rd-ext:hover{color:var(--c-primary)}
tr.rd-children>td{padding:0!important;background:var(--c-surface-2)}
.rd-sub{padding:.75rem .9rem .9rem 1.5rem;border-left:3px solid var(--c-primary)}
.rd-sub-h{font-size:.75rem;color:var(--c-text-secondary);font-weight:600;margin-bottom:.55rem;display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.rd-sub-h i{color:var(--c-primary)}
.rd-sub-h b{color:var(--c-text)}
.rd-subtable{font-size:.78rem;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-sm);overflow:hidden}
.rd-subtable thead th{position:static;background:var(--c-surface-3);box-shadow:none}
.rd-subtable td,.rd-subtable th{padding:.55rem .6rem}
.rd-subtable tbody tr:hover{background:var(--c-primary-light)}

/* ============================ SKELETON / LOADING ============================ */
.skeleton{position:relative;overflow:hidden;display:inline-block;height:12px;border-radius:var(--r-xs);
  background:var(--c-surface-3)}
.skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--c-surface) 65%,transparent),transparent);
  animation:shimmer 1.35s infinite}
/* skeleton table (replaces "Loading…") */
.skel-table{width:100%;border-collapse:collapse}
.skel-table td{padding:.9rem .7rem;border-bottom:1px solid var(--c-hair)}
.skel-table .skeleton{display:block;height:13px}
.skel-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:1.1rem}
@media(max-width:1100px){.skel-cards{grid-template-columns:repeat(2,1fr)}}
.skel-card{height:80px;border:1px solid var(--c-border);border-radius:var(--r-lg);background:var(--c-surface);
  box-shadow:var(--shadow-sm);position:relative;overflow:hidden}
.skel-card::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--c-surface-3) 80%,transparent),transparent);animation:shimmer 1.35s infinite}
.table-state{position:relative}
.table-state.loading::before{content:"";display:inline-block;width:16px;height:16px;margin-right:9px;vertical-align:-3px;
  border:2px solid var(--c-border-dark);border-top-color:var(--c-primary);border-radius:50%;animation:spin .7s linear infinite}

/* ============================ ANIMATIONS ============================ */
@keyframes shimmer{100%{transform:translateX(100%)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 var(--c-green-light)}50%{box-shadow:0 0 0 4px transparent}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.reveal{opacity:0}
.reveal.in{animation:fadeInUp .5s var(--ease) forwards}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1}
}