/* Top10 hero enhancement — preserves Instant Blog's original navbar/logo/footer/feed */
.top10-preserve-home{overflow-x:hidden}
.t10p-hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(circle at 67% 14%,rgba(68,66,177,.19),transparent 26%),radial-gradient(circle at 93% 76%,rgba(160,44,189,.18),transparent 25%),linear-gradient(180deg,#0b1221 0%,#0a111e 100%);border-top:1px solid rgba(255,255,255,.025);border-bottom:1px solid rgba(255,255,255,.055);color:#fff;min-height:530px}
.t10p-glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.26;pointer-events:none;z-index:-1}.t10p-glow-a{width:420px;height:420px;background:#3a45ff;right:23%;top:-230px}.t10p-glow-b{width:390px;height:390px;background:#bd37e7;right:-150px;bottom:-180px}
.t10p-inner{width:min(1460px,100%);min-height:530px;margin:auto;padding:34px 4vw 18px;display:grid;grid-template-columns:38% 62%;align-items:center;gap:10px}
.t10p-copy{z-index:5;align-self:center;padding-bottom:15px}.t10p-kicker{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:999px;background:rgba(21,29,44,.88);border:1px solid rgba(255,255,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.035);font-size:12px;color:#d2d8e3;letter-spacing:.35px}.t10p-copy h1{font-size:78px;line-height:.92;letter-spacing:-5px;margin:38px 0 24px;font-weight:900;color:#fff}.t10p-copy h1 span{background:linear-gradient(90deg,#9b69ff 0%,#5f8eff 54%,#8b62f1 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.t10p-copy p{max-width:520px;font-size:18px;line-height:1.55;color:#abb5c7;margin:0 0 30px}
.t10p-search{width:min(520px,100%);height:62px;display:flex;align-items:center;gap:12px;padding:0 9px 0 18px;border-radius:20px;border:1px solid rgba(150,173,220,.29);background:rgba(12,21,36,.72);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 14px 40px rgba(0,0,0,.12)}.t10p-search i{font-size:23px;color:#d2d8e4}.t10p-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:#fff;font-size:14px}.t10p-search input::placeholder{color:#8f99ab}.t10p-search button{width:49px;height:49px;border:0;border-radius:15px;background:linear-gradient(135deg,#5d7cff,#8d4fff);color:#fff;font-size:27px;box-shadow:0 0 24px rgba(94,84,255,.48)}
.t10p-proof{height:62px;display:flex;align-items:center;gap:11px;color:#aeb7c7;font-size:13px}.t10p-proof b{color:#fff}.t10p-proof>i{width:1px;height:25px;background:rgba(255,255,255,.17);margin:0 7px}.t10p-crown{color:#ffd35d;font-size:26px}.t10p-avatars{display:flex}.t10p-avatars span{width:24px;height:24px;margin-left:-7px;border-radius:50%;border:2px solid #0a1220;background:linear-gradient(145deg,#67bbce,#e8b58c)}.t10p-avatars span:first-child{margin-left:0}.t10p-avatars span:nth-child(2){background:linear-gradient(145deg,#efaa51,#825331)}.t10p-avatars span:nth-child(3){background:linear-gradient(145deg,#7cc6ff,#324e76)}.t10p-avatars span:nth-child(4){background:linear-gradient(145deg,#eba68f,#654e70)}
.t10p-stage{height:455px;position:relative;perspective:1500px;overflow:visible;transform-style:preserve-3d}.t10p-track{position:absolute;inset:0;transform-style:preserve-3d}.t10p-card{position:absolute;left:50%;top:17px;width:300px;height:405px;border-radius:30px;overflow:hidden;display:block;transform-origin:center;transition:transform .72s cubic-bezier(.2,.78,.2,1),opacity .5s ease,filter .5s ease,box-shadow .35s ease;border:1px solid rgba(185,194,255,.32);background:rgba(18,26,45,.52);box-shadow:0 30px 60px rgba(0,0,0,.36),0 0 0 1px rgba(255,255,255,.035) inset;will-change:transform,opacity;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}.t10p-card::before{content:"";position:absolute;inset:0;z-index:4;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,0) 28%,rgba(139,93,255,.08) 68%,rgba(255,255,255,.08));mix-blend-mode:screen}.t10p-card::after{content:"";position:absolute;inset:1px;z-index:4;border-radius:29px;pointer-events:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(255,255,255,.05)}.t10p-card.is-active{border-color:rgba(160,132,255,.83);box-shadow:0 38px 76px rgba(0,0,0,.44),0 0 35px rgba(104,83,255,.28),inset 0 1px 0 rgba(255,255,255,.18)}.t10p-card-glass{position:absolute;inset:0;z-index:1;background:linear-gradient(135deg,rgba(91,126,255,.14),rgba(91,77,188,.04) 40%,rgba(220,75,255,.10));pointer-events:none}.t10p-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform .65s ease}.t10p-card.is-active img,.t10p-card:hover img{transform:scale(1.035)}.t10p-card-shade{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(3,8,18,.02) 18%,rgba(4,9,20,.13) 45%,rgba(5,9,20,.86) 100%),linear-gradient(110deg,rgba(64,94,255,.12),transparent 46%,rgba(223,77,255,.1))}.t10p-card-head{position:absolute;left:20px;top:20px;z-index:5;display:flex;align-items:center;gap:12px;color:#fff;text-shadow:0 3px 13px rgba(0,0,0,.52)}.t10p-card-icon{width:47px;height:47px;border-radius:14px;display:grid;place-items:center;font-size:22px;background:linear-gradient(145deg,rgba(83,128,255,.93),rgba(91,52,222,.91));border:1px solid rgba(255,255,255,.25);box-shadow:0 0 23px rgba(73,95,255,.45),inset 0 1px rgba(255,255,255,.2)}.t10p-card-head-text b{display:block;max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:21px;line-height:1.02}.t10p-card-head-text small{display:block;font-size:15px;color:#eef2f8;margin-top:3px}.t10p-card-bottom{position:absolute;left:21px;right:72px;bottom:25px;z-index:5;color:#fff;text-shadow:0 3px 14px rgba(0,0,0,.65)}.t10p-card-bottom small{display:block;font-size:14px;color:#d4dbe7;margin-bottom:3px}.t10p-card-bottom strong{display:block;font-size:21px;line-height:1.16;font-weight:800}.t10p-card-go{position:absolute;right:19px;bottom:19px;z-index:6;width:51px;height:51px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#5a7cff,#8a4fff);border:1px solid rgba(255,255,255,.29);box-shadow:0 0 27px rgba(87,80,255,.58),inset 0 1px rgba(255,255,255,.25);color:#fff;font-size:28px}
.t10p-nav{position:absolute;top:48%;transform:translateY(-50%);z-index:60;width:58px;height:58px;border-radius:50%;border:1px solid rgba(145,159,195,.28);background:rgba(16,25,42,.86);backdrop-filter:blur(14px);color:#fff;font-size:40px;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 24px rgba(0,0,0,.18)}.t10p-prev{left:-9px}.t10p-next{right:-4px}.t10p-dots{position:absolute;left:50%;bottom:3px;transform:translateX(-50%);z-index:70;display:flex;gap:7px}.t10p-dots button{width:7px;height:7px;border:0;border-radius:50%;padding:0;background:#586176}.t10p-dots button.active{width:20px;border-radius:999px;background:linear-gradient(90deg,#625dff,#a058ff)}.t10p-empty{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:330px;padding:25px;border-radius:22px;border:1px dashed rgba(255,255,255,.15);background:rgba(16,24,40,.62);backdrop-filter:blur(18px);color:#9da8bb;text-align:center}
.t10p-category-strip{background:#0a111e;border-bottom:1px solid rgba(255,255,255,.05)}.t10p-category-inner{width:min(1460px,100%);margin:auto;padding:13px 4vw 18px;display:flex;align-items:center;gap:10px;overflow-x:auto;scrollbar-width:none}.t10p-category-inner::-webkit-scrollbar{display:none}.t10p-category-inner a{flex:0 0 auto;height:48px;padding:0 18px;display:flex;align-items:center;gap:10px;border-radius:17px;border:1px solid rgba(255,255,255,.105);background:linear-gradient(180deg,rgba(25,34,50,.94),rgba(16,23,37,.94));box-shadow:inset 0 1px rgba(255,255,255,.035);color:#dfe5ef!important;text-decoration:none!important;font-size:14px;font-weight:700}.t10p-category-inner a.active{background:linear-gradient(180deg,#453ca1,#282668);border-color:#6260f1}.t10p-category-inner a span{font-size:19px}
.t10p-trending{background:#0a111e;padding:22px 4vw 34px}.t10p-section-head{width:min(1460px,100%);margin:0 auto 17px;display:flex;align-items:flex-end;justify-content:space-between}.t10p-section-head h2{margin:0 0 3px;color:#f5f7fb;font-size:25px;font-weight:800}.t10p-section-head h2 span{color:#5d9fff}.t10p-section-head p{margin:0;color:#919cad;font-size:13px}.t10p-section-head>a{padding:10px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.09);background:#111927;color:#dfe6ef!important;text-decoration:none!important;font-size:12px}.t10p-trending-grid{width:min(1460px,100%);margin:auto;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}.t10p-trend-card{position:relative;min-width:0;overflow:hidden;border-radius:18px;background:linear-gradient(180deg,#171f30,#111827);border:1px solid rgba(255,255,255,.11);box-shadow:0 18px 37px rgba(0,0,0,.18);transition:.27s ease}.t10p-trend-card:hover{transform:translateY(-6px);box-shadow:0 27px 54px rgba(0,0,0,.28);border-color:rgba(118,129,255,.32)}.t10p-trend-link{position:absolute;inset:0;z-index:10}.t10p-trend-media{height:165px;display:block;position:relative;overflow:hidden}.t10p-trend-media img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.t10p-trend-card:hover .t10p-trend-media img{transform:scale(1.045)}.t10p-trend-media span{position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(6,10,20,.4))}.t10p-rank{position:absolute;left:12px;top:12px;z-index:3;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#ffca61,#ef9000);border:2px solid rgba(255,255,255,.35);box-shadow:0 0 23px rgba(255,158,0,.34);font-size:19px;color:#fff}.t10p-trend-card>em{position:absolute;right:12px;top:14px;z-index:3;padding:5px 10px;border-radius:99px;background:rgba(42,50,76,.78);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(8px);font-size:10px;font-weight:800;font-style:normal;color:#fff;text-transform:uppercase;max-width:46%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.t10p-meta{display:flex;gap:14px;padding:11px 13px 2px;color:#98a4b6;font-size:10px}.t10p-trend-title{padding:8px 13px 16px;display:flex;gap:12px;align-items:flex-start;color:#fff}.t10p-trend-title strong{flex:1;font-size:16px;line-height:1.32}.t10p-trend-title span{width:31px;height:31px;flex:0 0 31px;border-radius:50%;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;font-size:18px}
.t10p-original-feed{background:transparent}.dark .t10p-original-feed{background:#0b101a}.light .t10p-hero,.light .t10p-category-strip,.light .t10p-trending{filter:none}
@media(max-width:1180px){.t10p-inner{grid-template-columns:42% 58%;padding-left:28px;padding-right:28px}.t10p-copy h1{font-size:64px}.t10p-stage{transform:scale(.91);transform-origin:center}.t10p-trending-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.t10p-inner{grid-template-columns:1fr;padding:30px 20px 18px}.t10p-copy{text-align:center}.t10p-copy p{margin-left:auto;margin-right:auto}.t10p-search{margin-left:auto;margin-right:auto}.t10p-proof{justify-content:center}.t10p-stage{height:390px;transform:none;margin-top:10px}.t10p-category-inner,.t10p-trending{padding-left:20px;padding-right:20px}.t10p-trending-grid{display:flex;overflow-x:auto;gap:14px;scroll-snap-type:x mandatory;scrollbar-width:none}.t10p-trending-grid::-webkit-scrollbar{display:none}.t10p-trend-card{min-width:265px;scroll-snap-align:start}}
@media(max-width:600px){.t10p-copy h1{font-size:51px;letter-spacing:-3px}.t10p-copy p{font-size:15px}.t10p-proof{font-size:11px;flex-wrap:wrap}.t10p-proof>i,.t10p-crown,.t10p-proof span:last-child{display:none}.t10p-stage{height:330px}.t10p-card{width:225px;height:306px}.t10p-card-head{left:13px;top:13px}.t10p-card-icon{width:38px;height:38px;font-size:18px}.t10p-card-head-text b{font-size:16px;max-width:130px}.t10p-card-head-text small{font-size:12px}.t10p-card-bottom{left:15px;right:56px;bottom:18px}.t10p-card-bottom strong{font-size:17px}.t10p-card-go{width:40px;height:40px;right:12px;bottom:12px;font-size:22px}.t10p-nav{width:43px;height:43px;font-size:31px}.t10p-prev{left:0}.t10p-next{right:0}.t10p-trending{padding-top:18px}.t10p-section-head h2{font-size:21px}.t10p-section-head>a{display:none}}

/* === v6: EXACT 3-CARD CLOSE GLASS CAROUSEL === */
.t10p-stage{perspective:1800px;overflow:visible}
.t10p-track{overflow:visible}
.t10p-card{
  width:300px;
  height:405px;
  border:1px solid rgba(202,211,255,.42);
  background:linear-gradient(145deg,rgba(31,42,67,.48),rgba(17,24,42,.34));
  -webkit-backdrop-filter:blur(24px) saturate(135%);
  backdrop-filter:blur(24px) saturate(135%);
  box-shadow:
    0 30px 70px rgba(0,0,0,.38),
    0 0 0 1px rgba(255,255,255,.055) inset,
    0 0 24px rgba(96,91,255,.09);
}
.t10p-card::before{
  background:linear-gradient(135deg,rgba(255,255,255,.23),rgba(255,255,255,.02) 28%,rgba(119,95,255,.08) 64%,rgba(255,255,255,.11));
}
.t10p-card.is-active{
  border-color:rgba(167,145,255,.96);
  box-shadow:
    0 38px 85px rgba(0,0,0,.50),
    0 0 42px rgba(103,82,255,.44),
    0 0 16px rgba(180,96,255,.28),
    inset 0 1px 0 rgba(255,255,255,.22);
}
.t10p-card:not(.is-active){
  border-color:rgba(173,187,236,.34);
  box-shadow:
    0 24px 55px rgba(0,0,0,.34),
    0 0 25px rgba(78,100,255,.15),
    inset 0 1px 0 rgba(255,255,255,.12);
}
.t10p-card-glass{
  background:linear-gradient(135deg,rgba(92,129,255,.16),rgba(109,83,210,.035) 42%,rgba(221,76,255,.13));
}
.t10p-card-shade{
  background:linear-gradient(180deg,rgba(3,8,18,.01) 14%,rgba(4,9,20,.12) 48%,rgba(5,9,20,.88) 100%),linear-gradient(110deg,rgba(64,94,255,.14),transparent 46%,rgba(223,77,255,.12));
}
.t10p-dots{bottom:0}

@media (min-width:901px){
  .t10p-stage{height:455px}
  .t10p-nav{top:48%}
  .t10p-prev{left:4px}
  .t10p-next{right:4px}
}

@media(max-width:900px){
  .t10p-card{width:275px;height:372px}
}

@media(max-width:600px){
  .t10p-card{width:225px;height:306px}
}

/* ============================================================
   v8 — theme consistency + All Posts section
   Uses Instant Blog's own CSS variables so dark/light stay unified.
   ============================================================ */

/* Whole custom homepage follows Instant Blog theme background. */
.top10-preserve-home,
.t10p-category-strip,
.t10p-trending,
.t10p-all-posts-head,
.t10p-original-feed {
  background-color: var(--bg-color) !important;
  color: var(--text-color);
}

/* Keep section transitions seamless. */
.t10p-category-strip,
.t10p-trending,
.t10p-all-posts-head,
.t10p-original-feed {
  border-color: color-mix(in srgb, var(--text-color) 9%, transparent) !important;
}

/* DARK MODE — one continuous dark canvas. */
:root.dark .t10p-hero,
:root:not(.light) .t10p-hero {
  background:
    radial-gradient(circle at 67% 14%,rgba(68,66,177,.19),transparent 26%),
    radial-gradient(circle at 93% 76%,rgba(160,44,189,.18),transparent 25%),
    linear-gradient(180deg,#0b1221 0%,#0a111e 100%) !important;
  color:#fff;
  border-color:rgba(255,255,255,.055) !important;
}
:root.dark .t10p-category-strip,
:root.dark .t10p-trending,
:root.dark .t10p-all-posts-head,
:root.dark .t10p-original-feed,
:root:not(.light) .t10p-category-strip,
:root:not(.light) .t10p-trending,
:root:not(.light) .t10p-all-posts-head,
:root:not(.light) .t10p-original-feed {
  background:#0a111e !important;
}

/* LIGHT MODE — hero, categories, trending and posts all become light. */
:root.light .t10p-hero {
  background:
    radial-gradient(circle at 68% 12%,rgba(99,102,241,.12),transparent 28%),
    radial-gradient(circle at 93% 78%,rgba(192,132,252,.14),transparent 28%),
    linear-gradient(180deg,#f8faff 0%,#f2f5fb 100%) !important;
  color:#151b2a;
  border-color:rgba(28,42,70,.10) !important;
}
:root.light .t10p-category-strip,
:root.light .t10p-trending,
:root.light .t10p-all-posts-head,
:root.light .t10p-original-feed {
  background:#f7f7f7 !important;
  border-color:rgba(31,43,65,.08) !important;
}
:root.light .t10p-glow{opacity:.12}
:root.light .t10p-copy h1{color:#151b2a}
:root.light .t10p-copy p{color:#5f6d82}
:root.light .t10p-kicker{
  background:rgba(255,255,255,.78);
  border-color:rgba(70,84,112,.14);
  color:#4b5870;
  box-shadow:0 8px 24px rgba(51,65,85,.06),inset 0 1px 0 rgba(255,255,255,.95);
}
:root.light .t10p-search{
  background:rgba(255,255,255,.82);
  border-color:rgba(95,111,148,.20);
  box-shadow:0 14px 34px rgba(51,65,85,.08),inset 0 1px 0 rgba(255,255,255,.95);
}
:root.light .t10p-search i{color:#59667c}
:root.light .t10p-search input{color:#1d2534}
:root.light .t10p-search input::placeholder{color:#8993a5}
:root.light .t10p-proof{color:#657188}
:root.light .t10p-proof b{color:#1c2433}
:root.light .t10p-proof>i{background:rgba(33,45,68,.14)}
:root.light .t10p-avatars span{border-color:#f2f5fb}

:root.light .t10p-category-inner a{
  background:linear-gradient(180deg,#fff,#f1f4f8);
  border-color:rgba(70,84,110,.14);
  color:#2c3547 !important;
  box-shadow:0 8px 22px rgba(51,65,85,.05),inset 0 1px rgba(255,255,255,.95);
}
:root.light .t10p-category-inner a.active{
  background:linear-gradient(180deg,#6a5cf2,#5046c7);
  border-color:#7468f5;
  color:#fff !important;
}
:root.light .t10p-section-head h2,
:root.light .t10p-all-posts-head h2{color:#171e2c}
:root.light .t10p-section-head p,
:root.light .t10p-all-posts-head p{color:#69758a}
:root.light .t10p-section-head>a{
  background:#fff;
  color:#2d3748 !important;
  border-color:rgba(70,84,110,.14);
}
:root.light .t10p-trend-card{
  background:linear-gradient(180deg,#fff,#f3f5f9);
  border-color:rgba(70,84,110,.13);
  box-shadow:0 18px 36px rgba(51,65,85,.07);
}
:root.light .t10p-meta{color:#68758a}
:root.light .t10p-trend-title{color:#1b2432}
:root.light .t10p-trend-title span{border-color:rgba(55,67,90,.16)}
:root.light .t10p-trend-card>em{
  background:rgba(255,255,255,.84);
  color:#263247;
  border-color:rgba(70,84,110,.16);
}
:root.light .t10p-card{
  border-color:rgba(123,111,255,.42);
  box-shadow:0 28px 65px rgba(79,70,229,.14),0 10px 35px rgba(51,65,85,.10),inset 0 1px 0 rgba(255,255,255,.24);
}
:root.light .t10p-nav{
  background:rgba(255,255,255,.88);
  border-color:rgba(91,104,136,.18);
  color:#263247;
  box-shadow:0 10px 26px rgba(51,65,85,.10);
}
:root.light .t10p-dots button{background:#a7afbf}
:root.light .t10p-dots button.active{background:linear-gradient(90deg,#665cff,#9b55ff)}

/* All Posts: aligned heading, clear breathing room, then original feed. */
.t10p-all-posts-head{
  padding:50px 0 0 !important;
  margin:0 !important;
  border-top:1px solid rgba(127,139,166,.10);
}
.t10p-all-posts-inner{
  width:min(1460px,92vw) !important;
  margin:0 auto !important;
  padding:0 !important;
}
.t10p-all-posts-head h2{
  margin:0 !important;
  color:var(--text-color);
  font-size:27px;
  line-height:1.15;
  font-weight:800;
  letter-spacing:-.35px;
}
.t10p-all-posts-head p{
  margin:7px 0 0 !important;
  color:color-mix(in srgb, var(--text-color) 58%, transparent);
  font-size:13px;
}
.t10p-original-feed{
  margin:0 !important;
  padding:32px 4vw 52px !important;
  min-height:0;
}

/* Prevent a white strip from any bootstrap/container background. */
.top10-preserve-home #maincontent,
.top10-preserve-home #maincontent > .row,
.top10-preserve-home .t10p-all-posts-head {
  background-color:inherit !important;
}

@media(max-width:900px){
  .t10p-all-posts-head{padding-top:38px !important}
  .t10p-all-posts-inner{width:calc(100% - 40px) !important}
  .t10p-original-feed{padding:26px 20px 44px !important}
}

/* ============================================================
   v9 — exact Instant Blog theme harmony
   No split canvas: every section after the hero uses the SAME
   Instant Blog theme colors (--bg-color / --card-bg / --text-color).
   ============================================================ */

/* One continuous canvas for categories, trending, All Posts and feed. */
.top10-preserve-home,
.top10-preserve-home .t10p-category-strip,
.top10-preserve-home .t10p-trending,
.top10-preserve-home .t10p-all-posts-head,
.top10-preserve-home .t10p-original-feed,
.top10-preserve-home #maincontent,
.top10-preserve-home #maincontent > .row,
.top10-preserve-home #maincontent .grid {
  background: var(--bg-color) !important;
  background-color: var(--bg-color) !important;
  color: var(--text-color) !important;
}

/* Remove the previous forced navy block that made dark mode look split. */
:root.dark .top10-preserve-home .t10p-category-strip,
:root.dark .top10-preserve-home .t10p-trending,
:root.dark .top10-preserve-home .t10p-all-posts-head,
:root.dark .top10-preserve-home .t10p-original-feed,
:root:not(.light) .top10-preserve-home .t10p-category-strip,
:root:not(.light) .top10-preserve-home .t10p-trending,
:root:not(.light) .top10-preserve-home .t10p-all-posts-head,
:root:not(.light) .top10-preserve-home .t10p-original-feed {
  background: var(--bg-color) !important;
}

/* Hero stays premium, but fades into the exact active theme background. */
:root.dark .top10-preserve-home .t10p-hero,
:root:not(.light) .top10-preserve-home .t10p-hero {
  background:
    radial-gradient(circle at 67% 14%, rgba(82,78,210,.20), transparent 28%),
    radial-gradient(circle at 94% 76%, rgba(171,53,202,.18), transparent 27%),
    linear-gradient(180deg, #171b2a 0%, var(--bg-color) 100%) !important;
  border-bottom-color: rgba(255,255,255,.055) !important;
}

:root.light .top10-preserve-home .t10p-hero {
  background:
    radial-gradient(circle at 67% 14%, rgba(99,102,241,.10), transparent 28%),
    radial-gradient(circle at 94% 76%, rgba(192,132,252,.10), transparent 27%),
    linear-gradient(180deg, #ffffff 0%, var(--bg-color) 100%) !important;
  border-bottom-color: rgba(31,43,65,.08) !important;
}

/* Category strip: same canvas, no separate dark bar. */
.top10-preserve-home .t10p-category-strip {
  border-top: 1px solid color-mix(in srgb, var(--text-color) 6%, transparent) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--text-color) 7%, transparent) !important;
}

/* Trending cards inherit Instant Blog card palette. */
.top10-preserve-home .t10p-trend-card {
  background: var(--card-bg) !important;
  border: var(--card-brd) !important;
  color: var(--text-color) !important;
  box-shadow: var(--crd-shdw) !important;
}
.top10-preserve-home .t10p-trend-title,
.top10-preserve-home .t10p-trend-title strong,
.top10-preserve-home .t10p-section-head h2,
.top10-preserve-home .t10p-all-posts-head h2 {
  color: var(--text-color) !important;
}
.top10-preserve-home .t10p-meta,
.top10-preserve-home .t10p-section-head p,
.top10-preserve-home .t10p-all-posts-head p {
  color: color-mix(in srgb, var(--text-color) 62%, transparent) !important;
}
.top10-preserve-home .t10p-section-head > a {
  background: var(--card-bg) !important;
  color: var(--text-color) !important;
  border: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent) !important;
}

/* All Posts header and feed are one block, not two different shades. */
.top10-preserve-home .t10p-all-posts-head {
  padding: 46px 0 12px !important;
  border-top: 1px solid color-mix(in srgb, var(--text-color) 7%, transparent) !important;
  border-bottom: 0 !important;
}
.top10-preserve-home .t10p-original-feed {
  padding-top: 26px !important;
}

/* Original Instant Blog post cards: force their body to the native theme card color. */
.top10-preserve-home #maincontent .card:not(.cover):not(.stripes),
.top10-preserve-home #maincontent .card-blog-body {
  background-color: var(--card-bg) !important;
  color: var(--text-color) !important;
}
.top10-preserve-home #maincontent .card:not(.cover):not(.stripes) h4,
.top10-preserve-home #maincontent .card:not(.cover):not(.stripes) p,
.top10-preserve-home #maincontent .card:not(.cover):not(.stripes) small,
.top10-preserve-home #maincontent .card:not(.cover):not(.stripes) .author {
  color: var(--text-color) !important;
}

/* Dark mode: chips/cards fit original Instant Blog dark palette (#1f1d2b / #292e3c). */
:root.dark .top10-preserve-home .t10p-category-inner a,
:root:not(.light) .top10-preserve-home .t10p-category-inner a {
  background: var(--card-bg) !important;
  color: var(--text-color) !important;
  border-color: color-mix(in srgb, var(--text-color) 10%, transparent) !important;
}

/* Light mode: ALL custom sections and native feed use the exact original light palette. */
:root.light .top10-preserve-home,
:root.light .top10-preserve-home .t10p-category-strip,
:root.light .top10-preserve-home .t10p-trending,
:root.light .top10-preserve-home .t10p-all-posts-head,
:root.light .top10-preserve-home .t10p-original-feed,
:root.light .top10-preserve-home #maincontent,
:root.light .top10-preserve-home #maincontent > .row,
:root.light .top10-preserve-home #maincontent .grid {
  background: var(--bg-color) !important;
  background-color: var(--bg-color) !important;
}
:root.light .top10-preserve-home .t10p-category-inner a {
  background: var(--card-bg) !important;
  color: var(--text-color) !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  box-shadow: var(--crd-shdw) !important;
}
:root.light .top10-preserve-home .t10p-category-inner a.active {
  background: linear-gradient(180deg,#725ff0,#5d4bd4) !important;
  color:#fff !important;
  border-color:#7968f4 !important;
}
:root.light .top10-preserve-home .t10p-trend-card,
:root.light .top10-preserve-home #maincontent .card:not(.cover):not(.stripes),
:root.light .top10-preserve-home #maincontent .card-blog-body {
  background: var(--card-bg) !important;
  color: var(--text-color) !important;
  border-color: rgba(0,0,0,.125) !important;
  box-shadow: var(--crd-shdw) !important;
}

/* Prevent inherited Bootstrap white/gray section backgrounds. */
.top10-preserve-home .container-fluid.t10p-original-feed,
.top10-preserve-home .t10p-original-feed .row,
.top10-preserve-home .t10p-original-feed .grid,
.top10-preserve-home .t10p-all-posts-head,
.top10-preserve-home .t10p-all-posts-inner {
  background-color: var(--bg-color) !important;
}