/*
Theme Name: Kilode Premium
Theme URI: https://kilode.com.ng
Author: Kilode Media
Description: Nigeria's Most Addictive Entertainment Platform
Version: 22.22.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GPL-2.0+
Text Domain: kilode-premium
*/

/* ═══════════════════════════════════════════════
   DESIGN TOKENS — Black dominant, green minimal
   ═══════════════════════════════════════════════ */
:root {
  /* Core colors — Premium Kilode Green (mature, not neon) */
  --k-green: #A8C846;
  --k-green-d: #93B23A;
  --k-green-dd: #7C9830;
  --k-green-rgb: 168,200,70;
  --k-green-pale: rgba(168,200,70,0.06);

  /* Pure black surfaces — NO green tint */
  --k-bg: #0D0D0D;
  --k-surface: #141414;
  --k-surface2: #1A1A1A;
  --k-surface3: #212121;
  --k-surface4: #2A2A2A;

  /* Text */
  --k-ink: #EFEFED;
  --k-ink-2: #A0A09C;
  --k-ink-3: #4C4C48;

  /* Borders — white-based ONLY */
  --k-border: rgba(255,255,255,0.08);
  --k-border-2: rgba(255,255,255,0.14);

  /* Status colors */
  --k-red: #FF3B3B;
  --k-gold: #F5A623;
  --k-blue: #38BDF8;

  /* Radius — tightened for a smaller, denser premium feel */
  --k-r: 7px;
  --k-r-sm: 4px;
  --k-r-lg: 11px;

  /* Shadows — tighter offset, less blur, crisper edges (premium, not soft/gradienty) */
  --k-sh-sm: 0 1px 4px rgba(0,0,0,0.55);
  --k-sh: 0 2px 12px rgba(0,0,0,0.6);
  --k-sh-lg: 0 6px 28px rgba(0,0,0,0.7);
  /* Green glow — ONLY for primary action buttons */
  --k-sh-g: 0 3px 14px rgba(168,200,70,0.26);

  /* Accent roles used across the platform (already present in the live palette,
     named here so every component below can reference one consistent set) */
  --k-coral: #E5484D;
  --k-purple: #7C5CFC;

  /* Motion */
  --k-ease: cubic-bezier(0.4,0,0.2,1);
  --k-trans: all .15s var(--k-ease);

  /* Layout */
  --k-sidebar: 280px;
  --k-max-w: 1240px;

  /* Density scale — a shared spacing ramp so every template pulls from
     the same tight rhythm instead of one-off pixel values */
  --k-sp-1: 4px;
  --k-sp-2: 8px;
  --k-sp-3: 12px;
  --k-sp-4: 16px;
  --k-sp-5: 20px;

  /* Fonts */
  --k-font-h: 'Syne', 'Arial Black', system-ui, sans-serif;
  --k-font-b: 'Plus Jakarta Sans', 'DM Sans', -apple-system, sans-serif;
  --k-font-m: 'JetBrains Mono', 'Courier New', monospace;

  /* Legacy aliases */
  --k-orange: var(--k-green);
  --k-text: var(--k-ink);
  --k-text-s: var(--k-ink-2);
  --k-text-m: var(--k-ink-3);
  --k-shadow-sm: var(--k-sh-sm);
  --k-shadow: var(--k-sh);
  --k-shadow-lg: var(--k-sh-lg);
  --k-shadow-3d: 0 3px 0 rgba(0,0,0,0.7);
  --k-green-xl: rgba(0,0,0,0);
  --k-green-2: var(--k-green-d);
  --k-lime: rgba(0,0,0,0);
  --k-pink: #E879A0;
}

/* ═══ RESET ═══ */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { font-size:16px; scroll-behavior:smooth }
body { font-family:var(--k-font-b); background:var(--k-bg); color:var(--k-ink);
       line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden }
a { color:inherit; text-decoration:none; transition:color .15s }
a:hover { color:var(--k-green) }
img { max-width:100%; height:auto; display:block }
ul { list-style:none }
button,input,textarea,select { font-family:inherit; font-size:inherit }
h1,h2,h3,h4,h5,h6 { font-family:var(--k-font-h); line-height:1.2; font-weight:800 }
::selection { background:var(--k-green); color:#000 }
:focus-visible { outline:2px solid var(--k-green); outline-offset:2px }

/* ═══ LAYOUT ═══ */
.k-container { max-width:var(--k-max-w); margin:0 auto; padding:0 24px }
.k-grid-layout { display:grid; grid-template-columns:1fr var(--k-sidebar); gap:28px;
                  align-items:start; margin-bottom:40px }
.k-primary { min-width:0 }
.k-read-progress { position:fixed; top:0; left:0; width:0; height:3px;
                   background:var(--k-green); z-index:10000 }

/* ═══ TOPBAR ═══ */
.k-topbar { background:#070707; border-bottom:1px solid var(--k-border);
            height:36px; display:flex; align-items:center }
.k-topbar-inner { display:flex; justify-content:space-between; align-items:center;
                  width:100%; max-width:var(--k-max-w); margin:0 auto; padding:0 24px }
.k-topbar-left { display:flex; align-items:center; gap:8px }
.k-topbar-dot { width:6px; height:6px; border-radius:50%; background:var(--k-green);
                animation:k-pulse 2s ease-in-out infinite; flex-shrink:0 }
.k-topbar-date { font-size:.61rem; color:var(--k-ink-3) }
.k-topbar-tag { font-size:.61rem; color:rgba(255,255,255,.28); font-weight:500 }
.k-topbar-sep { width:1px; height:12px; background:var(--k-border); flex-shrink:0; margin:0 4px }
.k-topbar-right { display:flex; align-items:center; gap:4px }
.k-topbar-social { width:24px; height:24px; display:flex; align-items:center;
                   justify-content:center; color:var(--k-ink-3); transition:color .15s; border-radius:4px }
.k-topbar-social:hover { color:var(--k-ink) }
.k-topbar-social svg { width:12px; height:12px; fill:currentColor }
.k-topbar-theme { display:none }

/* ═══ HEADER ═══ */
.k-header { background:var(--k-surface); position:sticky; top:0; z-index:1000;
            border-bottom:1px solid var(--k-border); transition:box-shadow .2s }
.k-header.scrolled { box-shadow:0 4px 24px rgba(0,0,0,.8) }
.k-header-row { display:flex; align-items:center; gap:14px; padding:9px 0; width:100% }
.k-logo { display:flex; align-items:center; flex-shrink:0; text-decoration:none }
.k-logo:hover { opacity:.88 }
.k-logo-img { width:40px; height:40px; display:block; flex-shrink:0 }
.k-header-search { flex:1 1 0; min-width:0; max-width:280px; background:var(--k-surface2);
                   border:1.5px solid var(--k-border); border-radius:100px;
                   display:flex; align-items:center; gap:10px;
                   padding:0 16px; height:40px; transition:border-color .2s; position:relative }
.k-header-search:focus-within { border-color:var(--k-green) }
.k-header-search svg { width:14px; height:14px; flex-shrink:0; stroke:var(--k-ink-3);
                       fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round }
.k-search-input { flex:1; background:transparent; border:none; outline:none;
                  font-size:.84rem; color:var(--k-ink) }
.k-search-input::placeholder { color:var(--k-ink-3) }
.k-search-results { position:absolute; top:calc(100% + 8px); left:0; right:0;
                    background:var(--k-surface2); border:1px solid var(--k-border-2);
                    border-radius:var(--k-r-lg); box-shadow:var(--k-sh-lg);
                    max-height:360px; overflow-y:auto; display:none; z-index:200 }
.k-search-results.active { display:block }
.k-search-item { display:flex; align-items:center; gap:12px; padding:10px 16px;
                 border-bottom:1px solid var(--k-border); transition:background .12s }
.k-search-item:hover { background:var(--k-surface3) }
.k-search-item img { width:50px; height:36px; object-fit:cover;
                     border-radius:var(--k-r-sm); flex-shrink:0 }
.k-search-item-info h4 { font-size:.82rem; font-weight:600; color:var(--k-ink) }
.k-search-item-info span { font-size:.66rem; color:var(--k-ink-3) }
.k-search-empty { padding:18px 16px; text-align:center; font-size:.78rem; color:var(--k-ink-3); }
.k-header-actions { display:flex; gap:7px; align-items:center; flex-shrink:0; margin-left:auto }
.k-hdr-pill { display:inline-flex; align-items:center; gap:4px; padding:6px 12px;
              border-radius:100px; font-size:.68rem; font-weight:700;
              transition:var(--k-trans); border:1.5px solid var(--k-border-2);
              color:var(--k-ink-2); cursor:pointer }
.k-hdr-pill-store { background:var(--k-green); color:#000; border-color:var(--k-green) }
.k-hdr-pill-store:hover { background:var(--k-green-d); color:#000; border-color:var(--k-green-d) }
.k-hdr-btn { width:38px; height:38px; border-radius:var(--k-r); background:var(--k-surface2);
             border:1px solid var(--k-border); color:var(--k-ink-3);
             display:flex; align-items:center; justify-content:center;
             cursor:pointer; transition:var(--k-trans); font-size:.95rem }
.k-hdr-btn:hover { border-color:var(--k-border-2); color:var(--k-ink) }
.k-menu-toggle { flex-direction:column; gap:5px; display:none }
.k-menu-toggle span { display:block; width:18px; height:2px;
                      background:var(--k-ink-3); border-radius:2px }
.k-search-toggle-mobile { display:none }
.k-mobile-nav-overlay { position:fixed; inset:0; background:rgba(0,0,0,.75);
                        z-index:999; opacity:0; pointer-events:none; transition:opacity .3s }
.k-mobile-nav-overlay.active { opacity:1; pointer-events:auto }
.k-search-bar { max-height:0; overflow:hidden; transition:max-height .3s;
                background:var(--k-surface); border-bottom:1px solid var(--k-border) }
.k-search-bar.active { max-height:80px }
.k-search-inner { display:flex; align-items:center; gap:12px; padding:12px 0; position:relative }
.k-search-close { background:none; border:none; color:var(--k-ink-3); cursor:pointer; font-size:1.2rem }

/* ═══ CATEGORY TABS ═══ */
.k-cattabs { background:var(--k-surface); border-bottom:1px solid var(--k-border) }
.k-cattabs-inner { display:flex; overflow-x:auto; scrollbar-width:none; padding:0 }
.k-cattabs-inner::-webkit-scrollbar { display:none }
.k-cattab { display:flex; align-items:center; gap:4px; padding:9px 11px;
            font-family:var(--k-font-b); font-size:.71rem; font-weight:600;
            color:var(--k-ink-3); white-space:nowrap; border-bottom:2px solid transparent;
            margin-bottom:-1px; cursor:pointer; transition:var(--k-trans) }
.k-cattab.active { color:var(--k-ink); border-bottom-color:var(--k-green); font-weight:700 }
.k-cattab-icon { font-size:.86rem }

/* ═══ BADGES — minimal use ═══ */
.k-badge,.k-cat-badge,.k-new-badge {
  display:inline-flex; align-items:center; gap:4px; padding:2px 8px;
  border-radius:100px; font-family:var(--k-font-b);
  font-size:.53rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase }
.k-flash-badge { background:var(--k-red); color:#fff }
.k-cat-badge { color:#000 }
.k-new-badge { background:var(--k-green); color:#000 }
.k-section-badge { display:inline-flex; align-items:center; gap:5px;
                   font-family:var(--k-font-b); font-size:.54rem; font-weight:800;
                   padding:3px 10px; border-radius:100px;
                   background:var(--k-green); color:#000;
                   letter-spacing:.07em; text-transform:uppercase }
.k-live-dot { width:6px; height:6px; border-radius:50%;
              background:var(--k-green); animation:k-pulse 1.5s infinite; flex-shrink:0 }
@keyframes k-pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.75)} }
@keyframes k-badge-pulse { 0%,100%{opacity:1} 50%{opacity:.62} }
@keyframes k-marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@keyframes k-spin { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }

/* ═══ SECTION HEADS ═══ */
.k-sec-head { display:flex; justify-content:space-between; align-items:flex-end;
              margin-bottom:12px; padding-bottom:9px; border-bottom:1px solid var(--k-border) }
.k-sec-title { font-family:var(--k-font-h); font-size:.98rem; font-weight:800;
               color:var(--k-ink); display:flex; align-items:center; gap:7px }
.k-sec-title::before { content:''; display:block; width:3px; height:15px;
                       background:var(--k-green); border-radius:2px; flex-shrink:0 }
.k-sec-sub { font-size:.62rem; font-weight:600; color:var(--k-ink-3);
             letter-spacing:.06em; text-transform:uppercase; margin-top:3px }
.k-sec-more { font-size:.68rem; font-weight:700; color:var(--k-ink-2);
              padding:5px 12px; border:1px solid var(--k-border);
              border-radius:100px; transition:var(--k-trans);
              white-space:nowrap; text-decoration:none }
.k-sec-more:hover { border-color:var(--k-border-2); color:var(--k-ink) }
/* Legacy */
.k-section-title { font-family:var(--k-font-h); font-size:1.05rem; font-weight:800;
                   color:var(--k-ink); margin-bottom:4px;
                   display:flex; align-items:center; gap:8px }
.k-section-title::before { content:''; display:block; width:3px; height:15px;
                            background:var(--k-green); border-radius:2px; flex-shrink:0 }
.k-section-sub { font-family:var(--k-font-m); font-size:.63rem; color:var(--k-ink-3);
                 letter-spacing:1.5px; text-transform:uppercase }
.k-section-header { margin-bottom:16px; padding-bottom:11px; border-bottom:1px solid var(--k-border);
                    display:flex; justify-content:space-between; align-items:flex-end }

/* ═══ CARDS — no green on hover ═══ */
.k-card { background:var(--k-surface); border:1px solid var(--k-border);
          border-radius:var(--k-r); overflow:hidden; transition:transform .2s,box-shadow .2s;
          box-shadow:var(--k-sh-sm); display:block }
/* Card badge — only breaking/hot, small */
.k-card-badge { position:absolute; top:8px; left:8px; z-index:2 }
/* Category text — white/muted, NO color badge */
.k-card-title { font-family:var(--k-font-h); font-size:.88rem; font-weight:800;
                line-height:1.28; color:var(--k-ink); margin-bottom:8px }
.k-card-title a:hover, .k-card:hover .k-card-title { color:var(--k-green) }
.k-card-meta { display:flex; gap:6px; align-items:center;
               font-size:.58rem; color:var(--k-ink-3); font-weight:500; flex-wrap:wrap }
.k-card-meta-dot { width:3px; height:3px; border-radius:50%; background:currentColor;
                   opacity:.4; display:inline-block; flex-shrink:0 }
.k-card-h { display:flex; gap:10px; padding:10px }
.k-card-h .k-card-thumb { width:76px; height:56px; flex-shrink:0;
                           border-radius:var(--k-r-sm); aspect-ratio:auto }
.k-card-h .k-card-body { padding:0; flex:1 }
.k-card-h .k-card-title { font-size:.8rem; margin-top:1px }
.k-card-featured .k-card-thumb { aspect-ratio:16/8 }

/* ═══ POSTER CARDS — movie grid ═══ */
.k-poster-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:10px }
.k-poster-card { background:var(--k-surface); border:1px solid var(--k-border);
                 border-radius:var(--k-r); overflow:hidden; transition:var(--k-trans);
                 text-decoration:none; display:block }
.k-poster-card:hover { transform:translateY(-2px); box-shadow:0 5px 18px rgba(0,0,0,.65) }
.k-poster-thumb { position:relative; aspect-ratio:2/3;
                  background:var(--k-surface2); overflow:hidden; display:block }
.k-poster-thumb img { width:100%; height:100%; object-fit:cover;
                      transition:transform .4s ease }
.k-poster-card:hover .k-poster-thumb img { transform:scale(1.05) }
/* Category badge on poster — top right, small, NO colored background */
.k-poster-info { padding:9px 10px 11px }
.k-poster-title { font-family:var(--k-font-h); font-size:.76rem; font-weight:800;
                  color:var(--k-ink); line-height:1.25; margin-bottom:4px;
                  white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.k-poster-meta { font-size:.57rem; color:var(--k-ink-3);
                 display:flex; gap:6px; align-items:center; flex-wrap:wrap }

/* ═══ GRIDS ═══ */
.k-grid-2 { grid-template-columns:repeat(2,1fr) }

/* ═══ HERO ═══ */
.k-hero-3col { display:grid; grid-template-columns:1.55fr 1fr; gap:12px; margin:22px 0 18px }
.k-hero-main { position:relative; border-radius:var(--k-r-lg); overflow:hidden;
               min-height:440px; display:flex; flex-direction:column;
               text-decoration:none; cursor:pointer; background:var(--k-surface2) }
.k-hero-main img { position:absolute; inset:0; width:100%; height:100%;
                   object-fit:cover; transition:transform .5s var(--k-ease) }
.k-hero-main:hover img { transform:scale(1.04) }
.k-hero-main-ov { position:absolute; inset:0;
                  background:linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.45) 55%,rgba(0,0,0,.04) 100%) }
.k-hero-main-body { position:relative; z-index:2; margin-top:auto;
                    padding:22px 20px 20px; display:flex; flex-direction:column; gap:8px }
.k-hero-main h2 { font-family:var(--k-font-h); font-size:clamp(1rem,3vw,1.55rem); font-weight:800;
                  color:#fff; line-height:1.17 }
.k-hero-main-meta { display:flex; gap:7px; align-items:center;
                    font-size:.62rem; color:rgba(255,255,255,.48); flex-wrap:wrap }
.k-hero-col { display:grid; grid-template-rows:1fr 1fr; gap:12px }
.k-hero-sm { position:relative; border-radius:var(--k-r); overflow:hidden;
             display:block; text-decoration:none; min-height:164px; background:var(--k-surface2) }
.k-hero-sm img { position:absolute; inset:0; width:100%; height:100%;
                 object-fit:cover; transition:transform .4s var(--k-ease) }
.k-hero-sm:hover img { transform:scale(1.04) }
.k-hero-sm-ov { position:absolute; bottom:0; left:0; right:0; z-index:2;
                padding:12px 12px 10px;
                background:linear-gradient(to top,rgba(0,0,0,.9),rgba(0,0,0,.04));
                display:flex; flex-direction:column; gap:5px }
.k-hero-sm-ov h3 { font-family:var(--k-font-h); font-size:.85rem; font-weight:800;
                   color:#fff; line-height:1.25 }
.k-hero-sm-meta { display:flex; gap:6px; align-items:center;
                  font-size:.59rem; color:rgba(255,255,255,.44); flex-wrap:wrap }
/* Hero cat badge — minimal */
.k-hero-cat { font-size:.52rem; font-weight:800; color:rgba(255,255,255,.65);
              background:rgba(0,0,0,.5); padding:2px 8px; border-radius:100px;
              text-transform:uppercase; letter-spacing:.06em; backdrop-filter:blur(4px) }

/* ═══ TICKER ═══ */
.k-ticker { display:flex; align-items:center; background:var(--k-surface2);
            border:1px solid var(--k-border); border-radius:var(--k-r-sm);
            margin-bottom:24px; overflow:hidden }
.k-ticker-label { padding:10px 16px; background:var(--k-green);
                  font-size:.62rem; font-weight:800; color:#000; white-space:nowrap;
                  display:flex; align-items:center; gap:6px; flex-shrink:0;
                  letter-spacing:.1em; font-family:var(--k-font-b) }
.k-ticker-dot { width:5px; height:5px; border-radius:50%;
                background:#000; animation:k-pulse 1.5s infinite }
.k-ticker-track { overflow:hidden; flex:1; padding:0 14px }
.k-ticker-inner { display:flex; gap:36px; animation:k-marquee 40s linear infinite; width:max-content }
.k-ticker-inner a { font-size:.72rem; font-weight:600; color:var(--k-ink-2);
                    white-space:nowrap }
.k-ticker-inner a:hover { color:var(--k-green) }

/* ═══ HOT / RANKING LISTS ═══ */
.k-hot-item { display:flex; gap:12px; align-items:center; padding:11px 7px;
              border-bottom:1px solid var(--k-border); cursor:pointer;
              border-radius:var(--k-r-sm); transition:var(--k-trans);
              text-decoration:none }
.k-hot-item:last-child { border-bottom:none }
.k-hot-item:hover { background:var(--k-surface2); padding-left:12px }
.k-hot-rank { font-family:var(--k-font-h); font-size:1.1rem; font-weight:800;
              min-width:26px; text-align:center; color:var(--k-surface4) }
.k-hot-rank.top { color:var(--k-green) }
.k-hot-rank.reg { color:var(--k-surface4) }
.k-hot-title { font-family:var(--k-font-h); font-size:.83rem; font-weight:700;
               line-height:1.3; color:var(--k-ink); margin-bottom:4px }
.k-hot-item:hover .k-hot-title { color:var(--k-green) }
.k-hot-meta { font-size:.59rem; color:var(--k-ink-3) }
/* Hotgist legacy */
.k-hotgist-item { display:flex; gap:12px; align-items:center; padding:11px 7px;
                  border-bottom:1px solid var(--k-border); transition:var(--k-trans);
                  border-radius:var(--k-r-sm) }
.k-hotgist-item:hover { background:var(--k-surface2); padding-left:12px }
.k-hotgist-rank { font-family:var(--k-font-h); font-size:1.1rem; font-weight:800; min-width:26px; text-align:center }
.k-hotgist-rank.top { color:var(--k-green) }
.k-hotgist-rank.reg { color:var(--k-surface4) }

/* ═══ TRENDING ═══ */
.k-trending-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px }
.k-trending-hero { position:relative; border-radius:var(--k-r-lg); overflow:hidden;
                   min-height:260px; box-shadow:var(--k-sh-lg); background:var(--k-surface2) }
.k-trending-hero img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0 }
.k-trending-item { display:flex; gap:10px; align-items:center; padding:11px 0;
                   border-bottom:1px solid var(--k-border); transition:var(--k-trans) }
.k-trending-item:hover { padding-left:5px }
.k-trending-rank { font-family:var(--k-font-h); font-size:1.2rem; font-weight:800; min-width:30px; text-align:center }
.k-trending-rank.top { color:var(--k-green) }
.k-trending-rank.reg { color:var(--k-surface4) }
.k-trending-item img { width:56px; height:42px; object-fit:cover; border-radius:var(--k-r-sm); flex-shrink:0 }
.k-trending-info { flex:1; min-width:0 }
.k-trending-info strong { display:block; font-size:.83rem; font-weight:700;
                          margin-bottom:2px; color:var(--k-ink) }
.k-trending-info strong a { color:var(--k-ink) }
.k-trending-info strong a:hover { color:var(--k-green) }
.k-trending-info span { font-size:.62rem; color:var(--k-ink-3) }

/* ═══ GOSSIP STRIP ═══ */
.k-gossip-strip-full { background:var(--k-surface2); border-top:1px solid var(--k-border);
                       border-bottom:1px solid var(--k-border); padding:22px 0; margin:24px 0 }
.k-gossip-strip-inner { display:flex; gap:16px; align-items:stretch }
.k-gist-label { writing-mode:vertical-lr; font-family:var(--k-font-h);
                font-size:.76rem; font-weight:800; letter-spacing:3px;
                color:var(--k-green); text-transform:uppercase; flex-shrink:0; padding:0 8px }

/* ═══ LOAD MORE — base (see consolidated .k-load-more-tiny below for the
   category-section variant with the chevron icon) ═══ */
.k-load-more-wrap { text-align:center; margin:18px 0 6px }
.k-load-more-btn { padding:9px 24px; border-radius:100px;
                   border:1px solid var(--k-border-2); background:transparent;
                   color:var(--k-ink-2); font-size:.73rem; font-weight:700;
                   cursor:pointer; transition:var(--k-trans); font-family:var(--k-font-b) }

/* ═══ JOIN STRIP ═══ */
.k-join-strip { display:flex; align-items:center; gap:14px; padding:16px 20px;
                border-radius:var(--k-r-lg); background:var(--k-surface2);
                border:1px solid var(--k-border); flex-wrap:wrap; margin:22px 0 }
.k-join-strip-text strong { font-family:var(--k-font-h); font-weight:800; color:var(--k-ink) }
.k-join-strip-text span { font-size:.76rem; color:var(--k-ink-3); display:block; margin-top:2px }
.k-join-strip-btns { display:flex; gap:7px; flex-wrap:wrap; margin-left:auto }
.k-join-wa { padding:7px 14px; border-radius:100px; background:#25D366;
             color:#fff; font-size:.7rem; font-weight:700 }
.k-join-wa:hover { background:#1fbb58; color:#fff }
.k-join-tg { padding:7px 14px; border-radius:100px; background:#0088cc;
             color:#fff; font-size:.7rem; font-weight:700 }
.k-join-tg:hover { background:#0077b3; color:#fff }
.k-join-socials { padding:7px 14px; border-radius:100px; background:var(--k-green);
                  color:#000; font-size:.7rem; font-weight:700 }
.k-join-socials:hover { background:var(--k-green-d); color:#000 }

/* ═══ REACTIONS ═══ */
.k-reactions { display:flex; gap:7px; flex-wrap:wrap }
.k-reaction-btn { display:inline-flex; align-items:center; gap:5px; padding:7px 13px;
                  border-radius:var(--k-r); background:var(--k-surface);
                  border:1px solid var(--k-border); font-size:.76rem; font-weight:600;
                  cursor:pointer; transition:var(--k-trans); color:var(--k-ink-2) }
.k-reaction-btn:hover { transform:translateY(-2px) }
.k-reaction-btn.active { background:var(--k-surface3); border-color:var(--k-border-2); color:var(--k-ink) }

/* ═══ POLL ═══ */
.k-poll-wrap,.k-poll-widget,.k-poll-block { background:var(--k-surface); border:1px solid var(--k-border);
                              border-radius:var(--k-r); padding:18px }
.k-poll-q,.k-poll-question { font-size:.86rem; font-weight:700; color:var(--k-ink);
                              margin-bottom:13px; line-height:1.45 }
.k-poll-option,.k-poll-opt { margin-bottom:9px; cursor:pointer }
.k-poll-label { display:flex; justify-content:space-between;
                font-size:.69rem; font-weight:600; color:var(--k-ink-2); margin-bottom:4px }
.k-poll-bar { height:5px; background:var(--k-surface3); border-radius:100px; overflow:hidden }
.k-poll-fill { height:100%; background:var(--k-green); border-radius:100px }
.k-poll-submit,.k-poll-vote-btn { padding:9px; width:100%; background:var(--k-green);
                                  color:#000; border-radius:100px; font-size:.76rem;
                                  font-weight:700; cursor:pointer; margin-top:11px;
                                  border:none; font-family:var(--k-font-b) }
.k-poll-submit:hover,.k-poll-vote-btn:hover { background:var(--k-green-d) }
.k-poll-options { display:flex; flex-direction:column; gap:8px }

/* ═══ SIDEBAR WIDGETS ═══ */
.k-sidebar .widget, .k-sidebar-widget {
  background:var(--k-surface);
  border:1px solid var(--k-border);
  border-radius:var(--k-r);
  padding:17px;
  box-shadow:var(--k-sh-sm);
  margin-bottom:14px }
.k-widget-title, .widget-title {
  font-family:var(--k-font-h); font-size:.84rem; font-weight:800;
  color:var(--k-ink); margin-bottom:12px;
  display:flex; align-items:center; gap:7px }
.k-widget-title::before, .widget-title::before {
  content:''; display:block; width:3px; height:12px;
  background:var(--k-green); border-radius:2px; flex-shrink:0 }
.k-widget-newsletter { background:var(--k-surface2); border-color:var(--k-border-2) }
.k-nl-input { width:100%; padding:9px 11px; border:1px solid var(--k-border);
              border-radius:var(--k-r-sm); font-size:.8rem; margin-bottom:8px;
              color:var(--k-ink); background:var(--k-surface3); transition:border-color .18s }
.k-nl-input:focus { border-color:var(--k-green); outline:none }
.k-sub-btn, .k-btn-orange {
  width:100%; padding:10px; background:var(--k-green); color:#000;
  border-radius:var(--k-r-sm); font-size:.77rem; font-weight:700;
  cursor:pointer; border:none; transition:background .18s }
.k-sub-btn:hover, .k-btn-orange:hover { background:var(--k-green-d) }
.k-tags { display:flex; flex-wrap:wrap; gap:6px }
.k-tag { padding:3px 10px; border-radius:100px; background:var(--k-surface2);
         border:1px solid var(--k-border); font-size:.61rem; font-weight:600;
         color:var(--k-ink-3); cursor:pointer; transition:var(--k-trans) }
/* Tatafo */
.k-tatafo-item { display:flex; gap:9px; align-items:flex-start; padding:9px 7px;
                 border-bottom:1px solid var(--k-border); cursor:pointer;
                 transition:var(--k-trans); border-radius:var(--k-r-sm) }
.k-tatafo-item:last-child { border-bottom:none }
.k-tatafo-item:hover { background:var(--k-surface2); padding-left:11px }
.k-tatafo-emoji { font-size:.95rem; flex-shrink:0; margin-top:1px }
.k-tatafo-title { font-family:var(--k-font-h); font-size:.76rem; font-weight:700;
                  color:var(--k-ink); line-height:1.3; margin-bottom:2px; transition:color .15s }
.k-tatafo-item:hover .k-tatafo-title { color:var(--k-green) }
.k-tatafo-meta { font-size:.59rem; color:var(--k-ink-3) }
/* Drama Alert */
.k-drama-item { display:flex; gap:10px; align-items:center; padding:10px 7px;
                border-bottom:1px solid var(--k-border); cursor:pointer;
                transition:var(--k-trans); border-radius:var(--k-r-sm) }
.k-drama-item:last-child { border-bottom:none }
.k-drama-item:hover { background:var(--k-surface2); padding-left:11px }
.k-drama-thumb { width:56px; height:40px; border-radius:var(--k-r-sm); overflow:hidden;
                 flex-shrink:0; position:relative; background:var(--k-surface3) }
.k-drama-thumb img { width:100%; height:100%; object-fit:cover }
.k-drama-title { font-family:var(--k-font-h); font-size:.75rem; font-weight:700;
                 color:var(--k-ink); line-height:1.3; margin-bottom:2px; transition:color .15s }
.k-drama-item:hover .k-drama-title { color:var(--k-green) }
.k-drama-meta { font-size:.58rem; color:var(--k-ink-3) }
/* Just Dropped */
.k-jd-item { display:flex; gap:10px; padding:11px 15px;
             border-bottom:1px solid var(--k-border); transition:background .14s; cursor:pointer }
.k-jd-title { font-family:var(--k-font-h); font-size:.76rem; font-weight:700;
              color:var(--k-ink); line-height:1.3; margin-bottom:2px; transition:color .15s }
.k-jd-item:hover .k-jd-title { color:var(--k-green) }

/* ═══ KILODE TV WIDGET ═══ */
.k-tv-widget { padding:0; overflow:hidden }
.k-tv-head { padding:13px 16px 11px; border-bottom:1px solid var(--k-border);
             display:flex; align-items:center; justify-content:space-between }
.k-tv-embed { position:relative; padding-bottom:56.25%; height:0; overflow:hidden }
.k-tv-embed iframe { position:absolute; inset:0; width:100%; height:100%; border:none }
.k-tv-footer { padding:10px 14px; font-size:.68rem; color:var(--k-ink-3);
               border-top:1px solid var(--k-border) }

/* ═══ KILODE SOCIAL MINI WIDGET ═══ */
.k-social-mini { padding:0; overflow:hidden }
.k-social-mini-head { padding:12px 15px 10px; border-bottom:1px solid var(--k-border);
                      display:flex; align-items:center; justify-content:space-between }
.k-social-mini-msgs { padding:10px 12px; max-height:200px; overflow-y:auto;
                      display:flex; flex-direction:column; gap:7px;
                      scrollbar-width:thin; scrollbar-color:var(--k-border) transparent }
.k-social-mini-msg { display:flex; gap:7px; align-items:flex-end }
.k-social-mini-av { width:24px; height:24px; border-radius:50%; flex-shrink:0;
                    display:flex; align-items:center; justify-content:center;
                    font-size:.6rem; font-weight:800; color:#000 }
.k-social-mini-bubble { padding:6px 10px; border-radius:10px 10px 10px 0;
                        background:var(--k-surface2); font-size:.74rem;
                        color:var(--k-ink-2); line-height:1.4;
                        border:1px solid var(--k-border); word-break:break-word }
.k-social-mini-footer { padding:10px 12px; border-top:1px solid var(--k-border) }
.k-social-mini-join { display:flex; align-items:center; justify-content:center;
                      gap:6px; padding:9px; background:var(--k-green); color:#000;
                      border-radius:var(--k-r-sm); font-size:.76rem; font-weight:700;
                      text-decoration:none; transition:background .18s }

/* ═══ CRYPTO/STOCKS WIDGET ═══ */
.k-market-item { display:flex; align-items:center; justify-content:space-between;
                 padding:8px 0; border-bottom:1px solid var(--k-border) }
.k-market-item:last-child { border-bottom:none }
.k-market-name { font-size:.76rem; font-weight:700; color:var(--k-ink) }
.k-market-sym { font-size:.6rem; color:var(--k-ink-3); margin-top:1px }
.k-market-right { text-align:right }
.k-market-price { font-size:.8rem; font-weight:700; color:var(--k-ink); font-family:var(--k-font-m) }
.k-market-change { font-size:.62rem; font-weight:700; font-family:var(--k-font-m) }
.k-market-change.up { color:#22C55E }
.k-market-change.down { color:var(--k-red) }
.k-market-refresh { font-size:.62rem; color:var(--k-ink-3); text-align:center;
                    margin-top:8px; cursor:pointer }

/* ═══ MUSIC PLAYER WIDGET ═══ */
.k-music-player { padding:0; overflow:hidden }
.k-mp-head { padding:12px 14px 10px; border-bottom:1px solid var(--k-border);
             display:flex; align-items:center; justify-content:space-between }
.k-mp-track { display:flex; gap:11px; padding:12px 14px;
              border-bottom:1px solid var(--k-border); align-items:center }
.k-mp-cover { width:42px; height:42px; border-radius:var(--k-r-sm);
              overflow:hidden; flex-shrink:0; background:var(--k-surface3) }
.k-mp-cover img { width:100%; height:100%; object-fit:cover }
.k-mp-info { flex:1; min-width:0 }
.k-mp-title { font-size:.78rem; font-weight:700; color:var(--k-ink);
              white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.k-mp-artist { font-size:.64rem; color:var(--k-ink-3) }
.k-mp-play { width:30px; height:30px; border-radius:50%; background:var(--k-green);
             display:flex; align-items:center; justify-content:center;
             flex-shrink:0; cursor:pointer; border:none; transition:background .18s }
.k-mp-play svg { width:12px; height:12px; fill:#000; margin-left:2px }

/* ═══ STORE STRIP ═══ */
.k-store-promo-strip { background:var(--k-surface2); border-top:1px solid var(--k-border); padding:22px 0 }
.k-store-promo-inner { display:flex; align-items:center; justify-content:space-between;
                       gap:22px; flex-wrap:wrap }
.k-store-promo-badge { display:inline-block; font-size:.52rem; font-weight:800;
                       background:var(--k-green); color:#000; padding:2px 8px;
                       border-radius:100px; letter-spacing:.07em; margin-bottom:5px }
.k-store-promo-title { font-family:var(--k-font-h); font-size:1.1rem; font-weight:800;
                       color:var(--k-ink); margin:4px 0 }
.k-store-promo-sub { font-size:.72rem; color:var(--k-ink-3) }
.k-store-promo-btn { padding:10px 24px; background:var(--k-green); color:#000;
                     border-radius:100px; font-size:.75rem; font-weight:700;
                     transition:all .18s; white-space:nowrap; display:inline-block }
.k-store-promo-btn:hover { background:var(--k-green-d); color:#000; transform:translateY(-2px) }

/* ═══ COMMUNITY BANNER ═══ */
.k-social-banner { background:var(--k-surface2); border-top:1px solid var(--k-border);
                   border-bottom:1px solid var(--k-border); padding:0; position:relative }
.k-social-banner-inner { display:flex; align-items:center; gap:24px;
                         padding:22px 0; flex-wrap:wrap }
.k-sb-left { flex:1; min-width:200px }
.k-sb-badge { display:inline-flex; align-items:center; gap:6px;
              font-size:.57rem; font-weight:800; color:var(--k-green);
              letter-spacing:.12em; text-transform:uppercase; margin-bottom:7px }
.k-sb-title { font-family:var(--k-font-h); font-size:1.2rem; font-weight:800;
              color:var(--k-ink); margin-bottom:4px }
.k-sb-sub { font-size:.74rem; color:var(--k-ink-3) }
.k-sb-stats { display:flex; gap:20px; flex-shrink:0; flex-wrap:wrap }
.k-sb-stat { text-align:center }
.k-sb-stat-n { display:block; font-family:var(--k-font-h); font-size:1.4rem;
               font-weight:800; color:var(--k-green) }
.k-sb-stat-l { display:block; font-size:.57rem; color:var(--k-ink-3);
               letter-spacing:.06em; text-transform:uppercase; margin-top:2px }
.k-sb-right { display:flex; flex-direction:column; gap:9px; flex-shrink:0; min-width:200px }
.k-sb-av { width:26px; height:26px; border-radius:50%; border:2px solid var(--k-bg);
           display:flex; align-items:center; justify-content:center;
           font-size:.64rem; font-weight:800; flex-shrink:0 }
.k-sb-av-more { width:26px; height:26px; border-radius:50%; border:2px solid var(--k-bg);
                background:var(--k-surface4); font-size:.54rem; font-weight:700;
                color:var(--k-ink-3); display:flex; align-items:center; justify-content:center }
.k-sb-join-btn { display:flex; align-items:center; justify-content:center; gap:6px;
                 padding:11px 20px; background:var(--k-green); color:#000;
                 border-radius:100px; font-size:.78rem; font-weight:700;
                 transition:all .18s; border:none; cursor:pointer;
                 font-family:var(--k-font-b); text-decoration:none; width:100% }
.k-sb-join-btn:hover { background:var(--k-green-d); color:#000; transform:translateY(-2px);
                       box-shadow:var(--k-sh-g) }

/* ═══ NEWSLETTER BANNER ═══ */
.k-newsletter-banner { background:var(--k-surface2); border-top:1px solid var(--k-border); padding:24px 0 }
.k-nl-inner { display:flex; align-items:center; gap:24px; flex-wrap:wrap }
.k-nl-text h3 { font-family:var(--k-font-h); font-size:1rem; font-weight:800; color:var(--k-ink) }
.k-nl-text p { font-size:.76rem; color:var(--k-ink-3) }
.k-nl-form { display:flex; gap:8px; flex:1; max-width:400px; flex-wrap:wrap }
.k-nl-form input[type="email"] { flex:1; min-width:150px; padding:10px 13px;
                                  border:1px solid var(--k-border); border-radius:100px;
                                  font-size:.8rem; background:var(--k-surface3); color:var(--k-ink);
                                  font-family:var(--k-font-b) }
.k-nl-form input[type="email"]:focus { border-color:var(--k-green); outline:none }
.k-nl-form button { padding:10px 18px; border-radius:100px; background:var(--k-green);
                    color:#000; font-weight:700; font-size:.78rem; border:none; cursor:pointer }

/* Old footer styles removed — using kf- prefix now */

/* ═══ BACK TO TOP ═══ */
.k-back-top { position:fixed; bottom:22px; right:22px; width:38px; height:38px;
              border-radius:50%; background:var(--k-green); color:#000; border:none;
              font-size:.9rem; cursor:pointer; box-shadow:0 4px 16px rgba(0,0,0,.5);
              transition:all .2s; z-index:999; opacity:0; pointer-events:none;
              display:flex; align-items:center; justify-content:center; font-weight:800 }
.k-back-top:hover { transform:translateY(-3px) }

/* ═══ SINGLE POST ═══ */
.k-post-header { max-width:800px; margin:0 auto; padding:30px 24px 0 }
.k-breadcrumb { font-size:.61rem; color:var(--k-ink-3); margin-bottom:12px;
                display:flex; align-items:center; gap:6px; flex-wrap:wrap }
.k-breadcrumb a { color:var(--k-ink-2) }
.k-breadcrumb a:hover { color:var(--k-green) }
.k-breadcrumb span { opacity:.35 }
.k-post-title { font-family:var(--k-font-h); font-size:clamp(1.3rem, 4vw, 2rem); font-weight:800;
                line-height:1.14; color:var(--k-ink); margin:10px 0 17px; letter-spacing:-.02em }
.k-post-byline { display:flex; align-items:center; gap:12px;
                 padding-bottom:17px; border-bottom:1px solid var(--k-border); flex-wrap:wrap }
.k-author-ava { width:38px; height:38px; border-radius:50%; background:var(--k-surface3);
                border:1.5px solid var(--k-border); overflow:hidden; flex-shrink:0 }
.k-author-ava img { width:100%; height:100%; object-fit:cover }
.k-author-name { font-size:.78rem; font-weight:700; color:var(--k-ink) }
.k-post-date { font-size:.65rem; color:var(--k-ink-3) }
.k-share-row { display:flex; gap:6px; flex-wrap:wrap; margin-left:auto }
.k-shr { display:flex; align-items:center; gap:5px; padding:5px 12px;
         border-radius:100px; font-size:.66rem; font-weight:700;
         border:1px solid var(--k-border); color:var(--k-ink-2);
         cursor:pointer; transition:var(--k-trans); background:transparent;
         font-family:var(--k-font-b) }
.k-shr:hover { border-color:var(--k-border-2); color:var(--k-ink) }
.k-shr-wa { background:#25D366; color:#fff; border-color:#25D366 }
.k-shr-wa:hover { background:#1fbb58; color:#fff; border-color:#1fbb58 }
.k-post-hero { width:100%; height:420px; overflow:hidden;
               position:relative; background:var(--k-surface2) }
.k-post-hero img { width:100%; height:100%; object-fit:cover }
.k-post-hero figcaption { position:absolute; bottom:10px; left:20px;
                          font-size:.6rem; color:rgba(255,255,255,.35) }
.k-post-layout { display:grid; grid-template-columns:1fr 268px;
                 gap:34px; max-width:1100px; margin:0 auto; padding:30px 24px 48px; align-items:start }
.k-post-body-area { min-width:0 }
.k-post-content { font-size:.97rem; line-height:1.87; color:var(--k-ink-2) }
.k-post-content p { margin-bottom:1.25em }
.k-post-content h2 { font-family:var(--k-font-h); font-size:1.28rem; font-weight:800;
                     color:var(--k-ink); margin:1.9em 0 .6em }
.k-post-content h3 { font-family:var(--k-font-h); font-size:1.06rem; font-weight:800;
                     color:var(--k-ink); margin:1.5em 0 .5em }
.k-post-content blockquote { border-left:3px solid var(--k-green); padding:12px 17px;
                              margin:1.3em 0; background:var(--k-surface2);
                              border-radius:0 var(--k-r) var(--k-r) 0;
                              font-style:italic; color:var(--k-ink-2) }
.k-post-content strong { color:var(--k-ink); font-weight:700 }
.k-post-content a { color:var(--k-green); font-weight:600 }
.k-post-content img { border-radius:var(--k-r); margin:1.5em 0 }
.k-post-content ul,.k-post-content ol { margin:1em 0; padding-left:1.4em }
.k-post-content li { margin-bottom:.4em }
.k-post-tags { display:flex; flex-wrap:wrap; gap:6px; margin:20px 0 }
.k-post-tag { padding:4px 12px; border-radius:100px; border:1px solid var(--k-border);
              font-size:.65rem; font-weight:600; color:var(--k-ink-3);
              cursor:pointer; background:transparent; transition:var(--k-trans) }
.k-post-tag:hover { border-color:var(--k-border-2); color:var(--k-ink) }
.k-author-bio { background:var(--k-surface); border-radius:var(--k-r);
                border:1px solid var(--k-border); padding:18px;
                display:flex; gap:13px; margin:20px 0; box-shadow:var(--k-sh-sm) }
.k-author-bio-ava { width:50px; height:50px; border-radius:50%;
                    background:var(--k-surface3); overflow:hidden; flex-shrink:0 }
.k-author-bio-ava img { width:100%; height:100%; object-fit:cover }
.k-author-bio-name { font-family:var(--k-font-h); font-size:.88rem; font-weight:800; color:var(--k-ink) }
.k-author-bio-role { font-size:.62rem; color:var(--k-green); font-weight:700;
                     margin-bottom:3px; letter-spacing:.04em }
.k-author-bio-desc { font-size:.72rem; color:var(--k-ink-3); line-height:1.5 }
.k-post-sidebar { position:sticky; top:80px; display:flex; flex-direction:column; gap:11px }
.k-post-sidebar .k-sidebar-widget { background:var(--k-surface); border:1px solid var(--k-border);
                                    border-radius:var(--k-r); padding:17px; box-shadow:var(--k-sh-sm) }
.k-prog-bar { height:3px; background:var(--k-surface3); border-radius:100px; overflow:hidden; margin-bottom:9px }
.k-prog-fill { height:100%; background:var(--k-green); border-radius:100px }
/* Comments */
.k-comments { margin-top:30px }
.k-comments h3 { font-family:var(--k-font-h); font-size:1.05rem; font-weight:800;
                 color:var(--k-ink); margin-bottom:16px;
                 display:flex; align-items:center; gap:8px }
.k-comments h3::before { content:''; display:block; width:3px; height:15px;
                         background:var(--k-green); border-radius:2px; flex-shrink:0 }
.comment-body { padding:13px; background:var(--k-surface); border-radius:var(--k-r);
                border:1px solid var(--k-border); margin-bottom:9px }
.comment-meta { display:flex; gap:8px; align-items:center;
                margin-bottom:6px; font-size:.68rem; color:var(--k-ink-3) }
.comment-author-name { font-weight:700; color:var(--k-ink) }
.comment-content { font-size:.84rem; color:var(--k-ink-2); line-height:1.6 }
.comment-form input,.comment-form textarea { width:100%; padding:9px 12px;
  border:1px solid var(--k-border); border-radius:var(--k-r-sm);
  font-size:.83rem; color:var(--k-ink); background:var(--k-surface2);
  margin-bottom:9px; transition:border-color .18s; font-family:var(--k-font-b) }
.comment-form input:focus,.comment-form textarea:focus { border-color:var(--k-green); outline:none }
.comment-form textarea { min-height:88px; resize:vertical }
.comment-form .submit { padding:10px 24px; border-radius:100px;
  background:var(--k-green); color:#000; border:none; font-weight:800;
  cursor:pointer; transition:all .18s; font-family:var(--k-font-b) }
.comment-form .submit:hover { background:var(--k-green-d); transform:translateY(-1px) }

/* ═══ STATS ═══ */
.k-stats-strip { display:flex; gap:10px; padding:14px 0; justify-content:center; flex-wrap:wrap }
.k-stat-chip { background:var(--k-surface); border:1px solid var(--k-border);
               border-radius:var(--k-r); padding:12px 20px;
               transition:all .2s; display:flex; align-items:center; gap:10px }
.k-stat-chip:hover { transform:translateY(-2px) }
.k-stat-num { font-family:var(--k-font-h); font-size:1.3rem; font-weight:800;
              color:var(--k-green); display:block }
.k-stat-label { font-family:var(--k-font-m); font-size:.6rem; color:var(--k-ink-3); display:block }
.k-stat-icon { font-size:1.2rem }

/* ═══ TOP STORY ═══ */
.k-top-story { border-radius:var(--k-r-lg); overflow:hidden; position:relative;
               min-height:260px; margin-bottom:24px; display:block;
               box-shadow:var(--k-sh); background:var(--k-surface2) }
.k-top-story img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0 }
.k-top-story-ov { position:absolute; inset:0;
                  background:linear-gradient(to top,rgba(0,0,0,.92),rgba(0,0,0,.15) 65%,transparent);
                  display:flex; flex-direction:column; justify-content:flex-end; padding:22px 20px }
.k-top-story h2 { font-family:var(--k-font-h); font-size:1.3rem; font-weight:800;
                  color:#fff; line-height:1.2; margin:6px 0 9px }

/* ═══ ARCHIVE / 404 ═══ */
.k-archive-header { padding:28px 0 16px; border-bottom:1px solid var(--k-border); margin-bottom:22px }
.k-archive-title { font-family:var(--k-font-h); font-size:clamp(1.1rem,4vw,1.6rem); font-weight:800;
                   color:var(--k-ink); margin-bottom:4px }
.k-archive-desc { font-size:.82rem; color:var(--k-ink-3) }
.k-404-title { font-family:var(--k-font-h); font-size:1.4rem; font-weight:800;
               color:var(--k-ink); margin:12px 0 7px }
.k-404-desc { font-size:.84rem; color:var(--k-ink-3); margin-bottom:20px }
.k-404-btn:hover { background:var(--k-green-d); color:#000 }

/* ═══ MISC LEGACY ═══ */
.k-dropped-item,.k-amebo-item { display:flex; gap:11px; align-items:center;
  padding:10px 7px; border-bottom:1px solid var(--k-border);
  transition:var(--k-trans); border-radius:var(--k-r-sm) }
.k-dropped-item:hover,.k-amebo-item:hover { background:var(--k-surface2); padding-left:11px }
.k-follow-btn { padding:6px 18px; border-radius:100px; background:var(--k-green);
                color:#000; border:none; font-weight:800; cursor:pointer; transition:all .18s }
.k-follow-btn:hover { background:var(--k-green-d) }
.k-follow-btn.following { background:var(--k-surface2); border:1px solid var(--k-border); color:var(--k-ink-3) }
.k-love-banner { text-align:center; padding:20px; border-radius:var(--k-r-lg);
                 background:var(--k-surface2); border:1px solid var(--k-border); margin-bottom:13px }
.k-love-banner h3 { font-size:1.1rem; font-weight:800 }
.k-love-banner p { color:var(--k-ink-3); font-size:.8rem }
.k-movies-grid { display:flex; gap:12px; overflow-x:auto; scrollbar-width:none; padding-bottom:6px }
.k-movies-grid::-webkit-scrollbar { display:none }
.k-play-btn { width:34px; height:34px; border-radius:50%; background:var(--k-green);
              color:#000; display:flex; align-items:center; justify-content:center }
.k-sb-cat-item { display:flex; align-items:center; gap:8px; padding:7px;
                 border-radius:var(--k-r-sm); transition:var(--k-trans) }
.k-sb-cat-item:hover { background:var(--k-surface2) }

/* ═══ AI NEWS GENERATOR ADMIN ═══ */
.kilode-gen-box { background:#0D0F0D; border:1px solid rgba(255,255,255,.08);
                  border-radius:10px; padding:20px; margin-bottom:16px }
.kilode-gen-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px }
.kilode-gen-title { font-family:'Syne',sans-serif; font-size:1.05rem; font-weight:800;
                    color:#F0F0EE; display:flex; align-items:center; gap:8px }
.kilode-gen-badge { font-size:.58rem; font-weight:800; padding:2px 8px;
                    border-radius:100px; background:var(--k-green); color:#000; letter-spacing:.06em }
.kilode-gen-fields { display:grid; grid-template-columns:1fr 1fr 1fr; gap:11px; margin-bottom:13px }
.kilode-gen-field label { display:block; font-size:.68rem; font-weight:700;
                          color:#666; margin-bottom:4px; letter-spacing:.05em; text-transform:uppercase }
.kilode-gen-field input,.kilode-gen-field select { width:100%; padding:9px 11px;
  background:#161C16; border:1px solid rgba(255,255,255,.1); border-radius:6px;
  font-size:.83rem; color:#F0F0EE; font-family:'Plus Jakarta Sans',sans-serif; transition:border-color .18s }
.kilode-gen-field input:focus,.kilode-gen-field select:focus { border-color:var(--k-green); outline:none }
.kilode-gen-topic { margin-bottom:13px }
.kilode-gen-topic input { width:100%; padding:11px 13px; background:#161C16;
  border:1px solid rgba(255,255,255,.1); border-radius:8px; font-size:.95rem;
  color:#F0F0EE; font-family:'Plus Jakarta Sans',sans-serif; transition:border-color .18s }
.kilode-gen-topic input:focus { border-color:var(--k-green); outline:none }
.kilode-gen-toggles { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:15px }
.kilode-gen-toggle { display:flex; align-items:center; gap:7px; cursor:pointer; user-select:none }
.kilode-gen-toggle input[type="checkbox"] { width:15px; height:15px; accent-color:var(--k-green) }
.kilode-gen-toggle span { font-size:.72rem; color:#A8A8A4 }
.kilode-gen-btn { width:100%; padding:13px; background:var(--k-green); color:#000;
  border:none; border-radius:100px; font-family:'Syne',sans-serif;
  font-size:.9rem; font-weight:800; cursor:pointer; transition:all .18s;
  display:flex; align-items:center; justify-content:center; gap:8px }
.kilode-gen-btn:hover { background:var(--k-green-d) }
.kilode-gen-btn:disabled { opacity:.5; cursor:not-allowed }
.kilode-gen-result { margin-top:13px; padding:13px; background:#161C16;
  border:1px solid rgba(255,255,255,.08); border-radius:8px;
  font-size:.82rem; color:#A8A8A4; display:none }
.kilode-gen-result.active { display:block }
.kilode-gen-result.success { border-color:rgba(168,200,70,.28); color:#F0F0EE }
.kilode-gen-result.error { border-color:rgba(255,59,59,.28) }

/* ═══ BEAST MODE — FULLY HIDDEN ═══ */
#k-beast-btn,#k-beast-banner,#k-beast-xp-bar,.k-beast-mode-banner { display:none !important }

/* ═══ RESPONSIVE ═══ */
@media(max-width:900px){
  .k-hero-3col{grid-template-columns:1fr}
  .k-hero-col{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:10px}
  .k-hero-main{min-height:290px}
  .k-hero-main h2{font-size:1.25rem}
  .k-grid-layout{grid-template-columns:1fr}
  .k-footer-top{grid-template-columns:1fr 1fr;gap:20px}
  .k-store-promo-inner,.k-nl-inner{flex-direction:column;text-align:center}
  .k-post-layout{grid-template-columns:1fr;padding:20px}
  .k-post-sidebar{display:none}
  .k-post-title{font-size:1.55rem}
  .k-post-hero{height:240px}
  .k-poster-grid{grid-template-columns:repeat(3,1fr)}
  .k-social-banner-inner{flex-direction:column;text-align:center}
  .k-sb-stats{justify-content:center}
  .k-sb-right{min-width:auto;width:100%}
}
@media(max-width:768px){
  .k-header-search{display:none}
  .k-hdr-pill{display:none}
  .k-menu-toggle{display:flex}
  .k-search-toggle-mobile{display:flex}
  .k-grid-3,.k-grid-4{grid-template-columns:repeat(2,1fr)}
  .k-poster-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:500px){
  .k-hero-col{grid-template-columns:1fr}
  .k-footer-top{grid-template-columns:1fr}
  .k-topbar-date,.k-topbar-sep{display:none}
  .k-post-title{font-size:1.3rem}
  .k-share-row{margin-left:0}
  .k-grid-2,.k-grid-3,.k-grid-4{grid-template-columns:1fr}
  .k-poster-grid{grid-template-columns:repeat(2,1fr)}
}

/* ═══════════════════════════════════════════════
   KILODE v20 — VISUAL OVERHAUL & BUG-FIX PATCH
   Black dominant · Green ≤20% · No color riot
   ═══════════════════════════════════════════════ */

/* ── Movies header pill ── */
.k-hdr-pill-movies { border-color:var(--k-border-2) }
.k-hdr-pill-movies:hover { border-color:rgba(255,255,255,.22); color:var(--k-ink) }

/* ── Remove ALL green glow shadows on cards/sections ── */
.k-card:hover,
.k-poster-card:hover,
.k-hot-item:hover,
.k-tatafo-item:hover,
.k-drama-item:hover,
.k-jd-item:hover { box-shadow:0 6px 24px rgba(0,0,0,.7) !important }

/* ── Kill green play button in movie grids ── */
.k-play-btn,
.k-movie-overlay .k-play-btn,
.k-poster-thumb .k-play-btn { display:none !important }

/* ── k-movie-overlay — just darken, no play icon ── */
.k-movie-overlay { position:absolute; inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.65) 0%,rgba(0,0,0,0) 55%);
  pointer-events:none }

/* ── Poster grid — 4 columns on desktop (not 6 — too tiny) ── */
.k-poster-grid { grid-template-columns:repeat(4,1fr) !important; gap:14px !important }
@media(max-width:1024px){ .k-poster-grid{ grid-template-columns:repeat(3,1fr) !important } }
@media(max-width:768px) { .k-poster-grid{ grid-template-columns:repeat(2,1fr) !important } }
@media(max-width:480px) { .k-poster-grid{ grid-template-columns:repeat(2,1fr) !important } }

/* ── Movie card grid (horizontal scroll sections) — clean ── */
.k-movies-grid { display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:14px; overflow-x:unset; flex-wrap:unset }
.k-movie-card { position:relative; border-radius:var(--k-r); overflow:hidden;
  background:var(--k-surface); border:1px solid var(--k-border); display:block;
  transition:transform .2s,box-shadow .2s }
.k-movie-card:hover { transform:translateY(-3px); box-shadow:0 8px 28px rgba(0,0,0,.7) }
.k-movie-card img { width:100%; aspect-ratio:2/3; object-fit:cover; display:block }

/* ── Category labels — colorless, bordered, clean everywhere ── */
.k-cat-badge,
span.k-cat-badge,
.k-card .k-cat-badge,
.k-card-body .k-cat-badge {
  background:transparent !important;
  color:var(--k-ink-3) !important;
  border:1px solid var(--k-border-2) !important;
  font-size:.54rem !important; font-weight:700 !important;
  padding:2px 8px !important; border-radius:100px !important;
  letter-spacing:.07em !important; text-transform:uppercase !important;
  display:inline-block !important }

/* ── Section headers — white title, no colored accent ── */
.k-section-header { margin-bottom:14px }
.k-section-title {
  font-family:var(--k-font-h);
  font-size:1.05rem; font-weight:800;
  color:var(--k-ink) !important;
  display:flex; align-items:center; gap:8px;
  border-left:3px solid var(--k-green);
  padding-left:10px; line-height:1 }
.k-section-title::before { display:none !important }
.k-sec-head { display:flex; align-items:flex-start; justify-content:space-between;
  gap:12px; margin-bottom:14px; flex-wrap:wrap }
.k-sec-title { font-family:var(--k-font-h); font-size:1rem; font-weight:800;
  color:var(--k-ink); border-left:3px solid var(--k-green); padding-left:9px;
  line-height:1.1 }
.k-sec-sub { font-size:.62rem; color:var(--k-ink-3); margin-top:4px;
  padding-left:12px }
.k-sec-more { font-size:.68rem; font-weight:700; color:var(--k-ink-3);
  white-space:nowrap; transition:color .15s }
.k-sec-more:hover { color:var(--k-green) }

/* ── Homepage section spacing — breathe ── */

/* ── Grid max 3 columns — no huge ugly grids ── */
.k-grid-3 { grid-template-columns:repeat(3,1fr) }
.k-grid-4 { grid-template-columns:repeat(3,1fr) } /* cap at 3 */
@media(max-width:900px){
  .k-grid-3,.k-grid-4 { grid-template-columns:repeat(2,1fr) }
}
@media(max-width:480px){
  .k-grid-2,.k-grid-3,.k-grid-4 { grid-template-columns:1fr }
}

.k-poster-cat-badge {
  background:rgba(0,0,0,.7) !important;
  color:rgba(255,255,255,.75) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  backdrop-filter:blur(4px); font-size:.46rem;
  font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  padding:2px 7px; border-radius:100px;
  position:absolute; top:6px; left:6px }

/* ── JOIN STRIP removed from homepage body — lives in footer only ── */
.k-join-strip { display:none }

/* ── Social banner — centered, clean, before footer ── */
/* ── Premium ticker — second row, premium look ── */
.k-ticker-premium { display:flex; align-items:center; gap:0;
  background:var(--k-surface2); border-top:1px solid var(--k-border);
  border-bottom:1px solid var(--k-border); overflow:hidden; height:34px }
.k-ticker-premium .k-ticker-label {
  background:var(--k-surface3); color:var(--k-ink-2);
  border-right:1px solid var(--k-border); font-size:.6rem;
  font-weight:700; padding:0 14px; height:100%; display:flex;
  align-items:center; white-space:nowrap; letter-spacing:.1em;
  text-transform:uppercase }
.k-ticker-premium .k-ticker-track { flex:1; overflow:hidden }
.k-ticker-premium .k-ticker-inner a { font-size:.7rem; color:var(--k-ink-2); white-space:nowrap }
.k-ticker-premium .k-ticker-inner a:hover { color:var(--k-green) }

/* ── Widgets premium look ── */
.k-sidebar-widget,
.k-sidebar .widget {
  background:var(--k-surface) !important;
  border:1px solid var(--k-border) !important;
  border-radius:var(--k-r) !important;
  box-shadow:none !important;
  margin-bottom:16px !important }
.k-widget-title,
.widget-title {
  font-family:var(--k-font-h); font-size:.82rem; font-weight:800;
  color:var(--k-ink); margin-bottom:12px;
  display:flex; align-items:center; gap:7px;
  border-bottom:1px solid var(--k-border); padding-bottom:10px }
.k-widget-title::before,
.widget-title::before {
  content:''; display:block; width:3px; height:12px;
  background:var(--k-green); border-radius:2px; flex-shrink:0 }

/* ── Fix TV/Socials/Music widget head alignment ── */
.k-tv-head,
.k-social-mini-head,
.k-mp-head {
  padding:13px 16px 11px;
  border-bottom:1px solid var(--k-border) }
.k-tv-head .k-widget-title,
.k-social-mini-head .k-widget-title,
.k-mp-head .k-widget-title {
  border-bottom:none !important;
  padding-bottom:0 !important;
  margin-bottom:0 !important }

/* ── Promo artist button — not green, clean ── */
.k-mp-promo-btn { background:var(--k-surface2); color:var(--k-ink-2);
  border-top:1px solid var(--k-border); display:block; text-align:center;
  padding:10px 14px; font-size:.73rem; font-weight:700; transition:var(--k-trans) }
.k-mp-promo-btn:hover { background:var(--k-surface3); color:var(--k-ink) }
.k-mp-play { background:rgba(255,255,255,.1) !important; border:1px solid var(--k-border) !important }
.k-mp-play:hover { background:var(--k-green) !important; border-color:var(--k-green) !important }
.k-mp-play svg { fill:var(--k-ink) !important }
.k-mp-play:hover svg { fill:#000 !important }

/* ── Market widget ── */
.k-market-widget { padding:6px 14px 12px }
.k-market-refresh { text-align:center; padding:8px 0 2px; cursor:pointer;
  font-size:.62rem; color:var(--k-ink-3) }
.k-market-refresh:hover { color:var(--k-green) }

/* ── Social mini join button ── */
.k-social-mini-join { background:var(--k-surface3) !important; color:var(--k-ink) !important;
  border:1px solid var(--k-border-2) !important }
.k-social-mini-join:hover { background:var(--k-green) !important; color:#000 !important;
  border-color:var(--k-green) !important }

/* ── Poll submit button — only slight green touch ── */
.k-poll-submit,.k-poll-vote-btn { background:var(--k-surface3);
  color:var(--k-ink); border:1px solid var(--k-border-2) }
.k-poll-submit:hover,.k-poll-vote-btn:hover { background:var(--k-green); color:#000; border-color:var(--k-green) }
.k-poll-fill { background:rgba(168,200,70,.6) }

/* ── Subscribe button — only primary CTA gets green ── */
.k-sub-btn,.k-btn-orange { background:var(--k-surface3) !important;
  color:var(--k-ink) !important; border:1px solid var(--k-border-2) !important }
.k-sub-btn:hover,.k-btn-orange:hover { background:var(--k-green) !important;
  color:#000 !important; border-color:var(--k-green) !important }

/* ── Trending tags — minimal ── */
.k-tag { background:var(--k-surface2); border:1px solid var(--k-border);
  color:var(--k-ink-3); font-size:.6rem; font-weight:600; padding:3px 10px;
  border-radius:100px; transition:var(--k-trans); display:inline-block }
.k-tag:hover { color:var(--k-ink); border-color:var(--k-border-2) }

/* ── Tatafo Arena — no colored emojis ── */

/* ── Back to top button ── */
.k-back-top { position:fixed; bottom:24px; right:20px; width:38px; height:38px;
  background:var(--k-surface2); border:1px solid var(--k-border-2); color:var(--k-ink-2);
  border-radius:var(--k-r); font-size:.9rem; cursor:pointer; opacity:0;
  pointer-events:none; transition:all .2s; z-index:9000; display:flex;
  align-items:center; justify-content:center }
.k-back-top.show { opacity:1; pointer-events:auto }
.k-back-top:hover { background:var(--k-green); color:#000; border-color:var(--k-green) }

/* ── Remove GIST label rotated text that looks bad ── */
.k-gist-label { display:none }

/* ── Store promo strip — clean ── */
/* ── Newsletter banner — minimal ── */
.k-newsletter-banner { background:var(--k-surface) !important;
  border-top:1px solid var(--k-border) }
.k-nl-form button { background:var(--k-green); color:#000 }
.k-nl-form button:hover { background:var(--k-green-d) }

/* ── Category tabs — clean ── */
.k-cattab.active { color:var(--k-ink); border-bottom-color:var(--k-green) }
.k-cattab:hover { color:var(--k-ink-2) }

/* ── Load more button ── */
.k-load-more-btn:hover { color:var(--k-ink); border-color:var(--k-border-2) }

/* ── Discussion widget (single post) clean ── */
.k-discussion-wrap { margin:32px 0 }

/* ── Footer clean ── */
.k-footer-logo-icon { background:var(--k-green); color:#000 }
.k-footer-logo-text em { color:var(--k-green) }
.k-footer-col h4 { color:var(--k-ink-2) !important }
.k-footer-col a:hover { color:var(--k-ink) }

/* ── Mobile fixes ── */
@media(max-width:768px){
  .k-poster-grid { grid-template-columns:repeat(2,1fr) !important }
  .k-movies-grid { grid-template-columns:repeat(2,1fr) !important }
  .k-social-banner-inner { flex-direction:column; align-items:center; text-align:center }
  .k-sb-right { width:100% }
  .k-hdr-pill { display:none }
  .k-hdr-pill-store { display:inline-flex !important }
}
@media(max-width:480px){
  .k-poster-grid { grid-template-columns:repeat(2,1fr) !important }
  .k-movies-grid { grid-template-columns:repeat(2,1fr) !important }
  .k-hero-3col { grid-template-columns:1fr }
  .k-footer-top { grid-template-columns:1fr }
}

/* ── Scrollbar — minimal dark ── */
::-webkit-scrollbar { width:6px; height:6px }
::-webkit-scrollbar-track { background:var(--k-bg) }
::-webkit-scrollbar-thumb { background:var(--k-surface4); border-radius:3px }
::-webkit-scrollbar-thumb:hover { background:var(--k-ink-3) }


/* ═══════════════════════════════════════════════════════════
   KILODE v20 FINAL — SINGLE PAGE · WIDGETS · LIGHT MODE · ALL
   ═══════════════════════════════════════════════════════════ */

/* ── SINGLE POST — PROPERLY CONTAINERISED ── */
.ksp-header { max-width:820px; margin:0 auto; padding:28px 0 0 }
.ksp-badges { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:10px }
.ksp-cat-label { font-size:.6rem; font-weight:700; color:var(--k-ink-3);
  border:1px solid var(--k-border-2); border-radius:100px; padding:2px 10px;
  display:inline-block; text-transform:uppercase; letter-spacing:.07em }
.ksp-byline { display:flex; align-items:center; gap:12px; padding-bottom:16px;
  border-bottom:1px solid var(--k-border); flex-wrap:wrap }
.ksp-byline-info { flex:1; min-width:0 }
.ksp-share-inline { display:flex; gap:6px; flex-wrap:wrap; margin-left:auto }
.ksp-shr { display:inline-flex; align-items:center; gap:5px; padding:5px 11px;
  border-radius:100px; font-size:.65rem; font-weight:700; border:1px solid var(--k-border);
  color:var(--k-ink-2); cursor:pointer; background:transparent; transition:var(--k-trans) }
.ksp-shr:hover { border-color:var(--k-border-2); color:var(--k-ink) }
.ksp-shr-wa { background:#25D366; color:#fff; border-color:#25D366 }
.ksp-hero { width:100%; max-height:480px; overflow:hidden; border-radius:var(--k-r);
  margin:20px 0; background:var(--k-surface2) }
.ksp-hero-img { width:100%; height:100%; object-fit:cover; display:block }
.ksp-layout { display:grid; grid-template-columns:1fr 272px;
  gap:32px; margin:24px 0 48px; align-items:start }
.ksp-body-area { min-width:0 }
.ksp-content h2 { font-family:var(--k-font-h); font-size:1.25rem; font-weight:800;
  color:var(--k-ink); margin:1.8em 0 .55em }
.ksp-content h3 { font-family:var(--k-font-h); font-size:1.05rem; font-weight:800;
  color:var(--k-ink); margin:1.4em 0 .45em }
.ksp-content blockquote { border-left:3px solid var(--k-green); padding:12px 16px;
  margin:1.2em 0; background:var(--k-surface2); border-radius:0 var(--k-r) var(--k-r) 0;
  font-style:italic; color:var(--k-ink-2) }
.ksp-content img { border-radius:var(--k-r); margin:1.4em 0; max-width:100% }
.ksp-content a { color:var(--k-green); font-weight:600 }
.ksp-content ul,.ksp-content ol { margin:1em 0; padding-left:1.4em }
.ksp-content li { margin-bottom:.4em }

/* ── SHARE BAR ── */
.ksp-share-bar { background:var(--k-surface); border:1px solid var(--k-border);
  border-radius:var(--k-r); padding:14px 16px; margin:22px 0;
  display:flex; align-items:center; gap:12px; flex-wrap:wrap }
.ksp-share-label { font-size:.68rem; font-weight:700; color:var(--k-ink-3);
  white-space:nowrap; text-transform:uppercase; letter-spacing:.06em }
.ksp-share-btns { display:flex; gap:7px; flex-wrap:wrap }
.ksp-share-btn { display:inline-flex; align-items:center; gap:5px;
  padding:6px 14px; border-radius:100px; font-size:.68rem; font-weight:700;
  cursor:pointer; border:1px solid var(--k-border); background:transparent;
  color:var(--k-ink-2); transition:var(--k-trans); font-family:var(--k-font-b) }
.ksp-share-btn:hover { border-color:var(--k-border-2); color:var(--k-ink) }
.ksp-share-wa { background:#25D366; color:#fff; border-color:#25D366 }
.ksp-share-wa:hover { background:#1fbb58; color:#fff; border-color:#1fbb58 }
.ksp-share-x { background:var(--k-surface2) }
.ksp-share-fb { background:#1877f2; color:#fff; border-color:#1877f2 }
.ksp-share-fb:hover { background:#1565c0; color:#fff }
.ksp-share-tg { background:#0088cc; color:#fff; border-color:#0088cc }
.ksp-share-tg:hover { background:#0077b3; color:#fff }

/* ── AUTHOR BOX ── */
.ksp-author-box { background:var(--k-surface); border:1px solid var(--k-border);
  border-radius:var(--k-r); padding:18px; display:flex; gap:14px;
  margin:22px 0; align-items:flex-start }
.ksp-author-ava { width:52px; height:52px; border-radius:50%;
  overflow:hidden; flex-shrink:0; background:var(--k-surface3) }
.ksp-author-ava img { width:100%; height:100%; object-fit:cover }
.ksp-author-name { font-family:var(--k-font-h); font-size:.9rem; font-weight:800; color:var(--k-ink) }
.ksp-author-role { font-size:.62rem; color:var(--k-green); font-weight:700;
  margin-bottom:4px; letter-spacing:.04em }
.ksp-author-bio { font-size:.72rem; color:var(--k-ink-3); line-height:1.5 }

/* ── RELATED POSTS ── */
.ksp-related { margin-top:36px }
.ksp-section-label { font-family:var(--k-font-h); font-size:.9rem; font-weight:800;
  color:var(--k-ink); border-left:3px solid var(--k-green);
  padding-left:9px; margin-bottom:14px }

/* ── DISCUSSION WRAP ── */
.ksp-discussion-wrap { margin:28px 0 }

/* ── COMMENTS WRAP ── */
.ksp-comments-wrap { margin:28px 0 }
.ksp-comments-wrap .comments-title,
.ksp-comments-wrap h3 { font-family:var(--k-font-h); font-size:1rem;
  font-weight:800; color:var(--k-ink); margin-bottom:16px;
  border-left:3px solid var(--k-green); padding-left:9px }
.ksp-comments-wrap .comment-list { list-style:none; padding:0; margin:0 }
.ksp-comments-wrap .comment { padding:14px 0; border-bottom:1px solid var(--k-border) }
.ksp-comments-wrap .comment-meta { display:flex; align-items:center; gap:8px; margin-bottom:7px }
.ksp-comments-wrap .fn { font-weight:700; font-size:.82rem; color:var(--k-ink) }
.ksp-comments-wrap .comment-metadata time { font-size:.62rem; color:var(--k-ink-3) }
.ksp-comments-wrap .comment-content p { font-size:.86rem; color:var(--k-ink-2); line-height:1.6 }
.ksp-comments-wrap .reply a { font-size:.65rem; font-weight:700; color:var(--k-ink-3);
  text-decoration:none; border:1px solid var(--k-border); padding:2px 9px;
  border-radius:100px; transition:var(--k-trans) }
.ksp-comments-wrap .reply a:hover { color:var(--k-ink); border-color:var(--k-border-2) }
/* Comment likes */
.comment-like-btn { display:inline-flex; align-items:center; gap:4px;
  font-size:.62rem; color:var(--k-ink-3); cursor:pointer; background:none; border:none;
  padding:2px 0; transition:color .15s }
.comment-like-btn:hover,.comment-like-btn.active { color:var(--k-green) }
/* Comment form */
#respond { margin-top:20px }
#respond h3#reply-title { font-family:var(--k-font-h); font-size:.96rem;
  font-weight:800; color:var(--k-ink); margin-bottom:14px }
#respond .comment-form textarea,
#respond .comment-form input[type="text"],
#respond .comment-form input[type="email"] {
  width:100%; padding:10px 13px; background:var(--k-surface2);
  border:1px solid var(--k-border); border-radius:var(--k-r-sm);
  color:var(--k-ink); font-size:.84rem; font-family:var(--k-font-b);
  transition:border-color .18s; resize:vertical }
#respond .comment-form textarea:focus,
#respond .comment-form input:focus { border-color:var(--k-green); outline:none }
#respond .form-submit input[type="submit"],
#respond .comment-form input[type="submit"] {
  padding:9px 22px; background:var(--k-surface3); color:var(--k-ink);
  border:1px solid var(--k-border-2); border-radius:100px;
  font-size:.75rem; font-weight:700; cursor:pointer;
  transition:var(--k-trans); font-family:var(--k-font-b) }
#respond input[type="submit"]:hover { background:var(--k-green); color:#000; border-color:var(--k-green) }

/* ── POST SIDEBAR ── */
.ksp-sidebar { position:sticky; top:80px; display:flex; flex-direction:column; gap:12px }
.ksp-progress-widget { padding:14px 16px }
.ksp-prog-label { font-size:.62rem; font-weight:700; color:var(--k-ink-3);
  letter-spacing:.07em; text-transform:uppercase; margin-bottom:8px }
.ksp-prog-meta { font-size:.68rem; color:var(--k-ink-3); margin-top:7px }
.ksp-sb-share { display:flex; flex-direction:column; gap:7px }
.ksp-sb-shr { display:flex; align-items:center; gap:7px; padding:9px 13px;
  border-radius:var(--k-r-sm); font-size:.73rem; font-weight:700;
  cursor:pointer; border:1px solid var(--k-border); background:transparent;
  color:var(--k-ink-2); transition:var(--k-trans); font-family:var(--k-font-b); width:100% }
.ksp-sb-shr:hover { border-color:var(--k-border-2); color:var(--k-ink) }
.ksp-sb-wa { background:#25D366; color:#fff; border-color:#25D366 }
.ksp-sb-wa:hover { background:#1fbb58; color:#fff }
.ksp-sb-x { background:var(--k-surface2) }
.ksp-sb-fb { background:#1877f2; color:#fff; border-color:#1877f2 }
.ksp-sb-fb:hover { background:#1565c0; color:#fff }

/* ── AD SLOTS ── */
.k-ad-slot { text-align:center; margin:18px 0; overflow:hidden }
.k-ad-slot img { max-width:100%; border-radius:var(--k-r-sm) }
.k-ad-single-top { border-bottom:1px solid var(--k-border); padding-bottom:16px }
.k-ad-sidebar-single { background:var(--k-surface); border:1px solid var(--k-border);
  border-radius:var(--k-r); padding:12px; text-align:center }

/* ── REACTIONS ── */
.ksp-reactions-wrap { margin:20px 0 }

/* ── WIDGET UNIVERSAL STYLE (market widgets) ── */
.k-market-wgt,.k-weather-widget,.k-currency-widget,.k-cal-widget { }
.k-mwgt-head { padding:12px 15px 10px; border-bottom:1px solid var(--k-border);
  display:flex; align-items:center; justify-content:space-between }
.k-mwgt-refresh { display:inline-flex; align-items:center; gap:4px;
  font-size:.6rem; font-weight:700; color:var(--k-ink-3); cursor:pointer;
  background:none; border:none; padding:0; transition:color .15s }
.k-mwgt-refresh:hover { color:var(--k-green) }
.k-mwgt-body { padding:2px 0 }
.k-mwgt-loading { text-align:center; padding:16px; font-size:.72rem; color:var(--k-ink-3) }
.k-mwgt-item { display:flex; align-items:center; justify-content:space-between;
  padding:9px 14px; border-bottom:1px solid var(--k-border) }
.k-mwgt-item:last-child { border-bottom:none }
.k-mwgt-left { display:flex; flex-direction:column; gap:2px }
.k-mwgt-sym { font-size:.78rem; font-weight:700; color:var(--k-ink) }
.k-mwgt-sub { font-size:.58rem; color:var(--k-ink-3) }
.k-mwgt-right { text-align:right }
.k-mwgt-price { font-size:.82rem; font-weight:700; color:var(--k-ink);
  font-family:var(--k-font-m) }
.k-mwgt-ch { font-size:.65rem; font-weight:700; font-family:var(--k-font-m) }
.k-mwgt-ch.up { color:var(--k-green) }
.k-mwgt-ch.dn { color:var(--k-red) }
.k-mwgt-footer { padding:7px 14px; font-size:.58rem; color:var(--k-ink-3);
  border-top:1px solid var(--k-border); text-align:center }
.k-live-badge { display:inline-flex; align-items:center; gap:4px;
  font-size:.57rem; font-weight:800; color:var(--k-red); letter-spacing:.08em }

/* ── WEATHER WIDGET ── */
.k-weather-search { display:flex; gap:0; padding:10px 12px;
  border-bottom:1px solid var(--k-border) }
.k-weather-input { flex:1; background:var(--k-surface2); border:1px solid var(--k-border);
  border-right:none; border-radius:var(--k-r-sm) 0 0 var(--k-r-sm);
  padding:6px 10px; font-size:.76rem; color:var(--k-ink); transition:border-color .18s }
.k-weather-input:focus { border-color:var(--k-green); outline:none }
.k-weather-btn { padding:6px 12px; background:var(--k-green); color:#000;
  border:none; border-radius:0 var(--k-r-sm) var(--k-r-sm) 0;
  font-size:.72rem; font-weight:700; cursor:pointer; transition:background .18s }
.k-weather-btn:hover { background:var(--k-green-d) }
.k-weather-body { padding:12px 14px }
.k-weather-main { display:flex; align-items:center; gap:12px; margin-bottom:11px }
.k-weather-icon { font-size:2.4rem; line-height:1 }
.k-weather-temp { font-family:var(--k-font-h); font-size:1.6rem;
  font-weight:800; color:var(--k-ink) }
.k-weather-desc { font-size:.72rem; color:var(--k-ink-2) }
.k-weather-loc { font-size:.62rem; color:var(--k-ink-3) }
.k-weather-details { display:grid; grid-template-columns:repeat(3,1fr);
  gap:6px; border-top:1px solid var(--k-border); padding-top:10px }
.k-weather-det-item { text-align:center }
.k-weather-det-item span { display:block; font-size:.57rem; color:var(--k-ink-3) }
.k-weather-det-item strong { font-size:.72rem; font-weight:700; color:var(--k-ink) }

/* ── CURRENCY WIDGET ── */
.k-currency-body { padding:14px }
.k-currency-row { display:flex; gap:7px; align-items:center; margin-bottom:4px }
.k-currency-input { flex:1; background:var(--k-surface2); border:1px solid var(--k-border);
  border-radius:var(--k-r-sm); padding:8px 10px; font-size:.84rem; color:var(--k-ink);
  font-family:var(--k-font-m) }
.k-currency-input:focus { border-color:var(--k-green); outline:none }
.k-currency-sel { flex:1; background:var(--k-surface2); border:1px solid var(--k-border);
  border-radius:var(--k-r-sm); padding:8px 8px; font-size:.78rem; color:var(--k-ink);
  cursor:pointer }
.k-currency-result-val { flex:1; background:var(--k-surface3); border:1px solid var(--k-border);
  border-radius:var(--k-r-sm); padding:8px 10px; font-size:.84rem; font-weight:700;
  color:var(--k-green); font-family:var(--k-font-m) }
.k-currency-btn { width:100%; padding:9px; background:var(--k-surface3);
  color:var(--k-ink); border:1px solid var(--k-border-2);
  border-radius:var(--k-r-sm); font-size:.76rem; font-weight:700;
  cursor:pointer; margin-top:8px; transition:var(--k-trans) }
.k-currency-btn:hover { background:var(--k-green); color:#000; border-color:var(--k-green) }

/* ── CALENDAR WIDGET ── */
.k-cal-body { padding:12px 10px 14px }
.k-cal-header { text-align:center; font-size:.82rem; font-weight:700;
  color:var(--k-ink); margin-bottom:10px }
.k-cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:2px }
.k-cal-dh { text-align:center; font-size:.58rem; font-weight:700;
  color:var(--k-ink-3); padding:4px 0; text-transform:uppercase }
.k-cal-day { text-align:center; font-size:.7rem; color:var(--k-ink-2);
  padding:5px 2px; border-radius:4px; cursor:pointer; transition:background .12s }
.k-cal-day:hover { background:var(--k-surface3) }
.k-cal-today { background:var(--k-green) !important; color:#000 !important;
  font-weight:800; border-radius:4px }
.k-cal-nav-btn { background:none; border:1px solid var(--k-border);
  color:var(--k-ink-3); border-radius:4px; padding:2px 7px;
  cursor:pointer; font-size:.8rem; transition:var(--k-trans) }
.k-cal-nav-btn:hover { border-color:var(--k-border-2); color:var(--k-ink) }

/* ── MOVIES DOWNLOAD BUTTON ── */
.k-movies-dl-btn { display:flex; align-items:center; justify-content:center;
  gap:8px; padding:11px 16px; background:var(--k-surface2);
  border:1px solid var(--k-border-2); border-radius:var(--k-r);
  color:var(--k-ink); font-size:.78rem; font-weight:700;
  text-decoration:none; transition:var(--k-trans); width:100% }
.k-movies-dl-btn:hover { background:var(--k-green); color:#000;
  border-color:var(--k-green) }

/* ── KILODE TV WIDGET TWEAKS ── */
.k-tv-watch-btn { display:block; text-align:center; padding:9px 14px;
  font-size:.7rem; font-weight:700; color:var(--k-ink-2);
  text-decoration:none; border-top:1px solid var(--k-border);
  transition:var(--k-trans) }
.k-tv-watch-btn:hover { background:var(--k-surface2); color:var(--k-green) }

/* ── MUSIC PLAYER GENRE LABEL (no green) ── */
.k-mp-genre { font-size:.55rem; color:var(--k-ink-3); font-weight:700;
  text-transform:uppercase; letter-spacing:.07em; margin-top:2px }
.k-mp-cover-ph { width:100%; height:100%; background:var(--k-surface3);
  display:flex; align-items:center; justify-content:center; color:var(--k-ink-3) }

/* ── HEADER DARK/LIGHT TOGGLE ── */
.k-theme-toggle { display:flex; align-items:center; cursor:pointer;
  background:none; border:none; padding:0; margin-left:4px }
.k-theme-toggle-track { width:42px; height:22px; border-radius:100px;
  background:var(--k-surface3); border:1px solid var(--k-border-2);
  position:relative; transition:background .2s; display:flex; align-items:center }
.k-theme-toggle-thumb { position:absolute; left:3px; width:16px; height:16px;
  border-radius:50%; background:var(--k-ink-3); transition:all .2s }
.k-theme-icon-dark,.k-theme-icon-light { position:absolute; transition:opacity .2s }
.k-theme-icon-dark { right:5px; opacity:.6 }
.k-theme-icon-light { left:5px; opacity:0 }
.k-light-mode .k-theme-toggle-track { background:#e2e8f0; border-color:#cbd5e1 }
.k-light-mode .k-theme-toggle-thumb { left:calc(100% - 19px); background:#334155 }
.k-light-mode .k-theme-icon-dark { opacity:0 }
.k-light-mode .k-theme-icon-light { opacity:.6 }
.k-hdr-pill-tv:hover { border-color:rgba(255,255,255,.22); color:var(--k-ink) }

/* ── LIGHT MODE VARIABLES ── */
[data-theme="light"], body.k-light-mode {
  --k-bg: #f4f4f0;
  --k-surface: #ffffff;
  --k-surface2: #f0f0ec;
  --k-surface3: #e8e8e4;
  --k-surface4: #d8d8d4;
  --k-ink: #111110;
  --k-ink-2: #3a3a38;
  --k-ink-3: #8a8a86;
  --k-border: rgba(0,0,0,0.1);
  --k-border-2: rgba(0,0,0,0.18);
  --k-sh-sm: 0 2px 10px rgba(0,0,0,0.08);
  --k-sh: 0 4px 24px rgba(0,0,0,0.12);
  --k-sh-lg: 0 12px 48px rgba(0,0,0,0.16);
}
body.k-light-mode { background:var(--k-bg); color:var(--k-ink) }
body.k-light-mode .k-header { background:#fff; border-bottom-color:rgba(0,0,0,.1) }
body.k-light-mode .k-topbar { background:#f8f8f5 }
body.k-light-mode .k-ticker { background:#fff; border-color:rgba(0,0,0,.1) }
body.k-light-mode .k-search-results { background:#fff }
body.k-light-mode .k-card { background:#fff }
body.k-light-mode .k-sidebar-widget,.k-light-mode .k-sidebar .widget { background:#fff }
body.k-light-mode .k-poster-card { background:#fff }
body.k-light-mode .k-cattabs { background:#fff }
body.k-light-mode .k-footer { background:#f0f0ec }
body.k-light-mode .k-social-banner { background:#e8e8e4 }
body.k-light-mode .k-newsletter-banner { background:#f0f0ec }
body.k-light-mode .k-hot-item:hover { background:var(--k-surface2) }

/* ── TATAFO GRID ── */
.k-tatafo-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px }
.k-tatafo-card-link { text-decoration:none }
.k-tatafo-card { background:var(--k-surface); border:1px solid var(--k-border);
  border-radius:var(--k-r); padding:14px 16px; transition:var(--k-trans);
  display:flex; gap:10px; align-items:flex-start; height:100% }
.k-tatafo-card:hover { background:var(--k-surface2); transform:translateY(-2px) }
.k-tatafo-num { font-size:1.4rem; flex-shrink:0; line-height:1 }
.k-tatafo-card-title { font-family:var(--k-font-h); font-size:.82rem;
  font-weight:800; color:var(--k-ink); line-height:1.3; margin-bottom:4px }
.k-tatafo-card-link:hover .k-tatafo-card-title { color:var(--k-green) }
.k-tatafo-debates { font-size:.6rem; color:var(--k-ink-3) }

/* ── 6-COL POSTER GRID ── */
.k-poster-grid-6 { grid-template-columns:repeat(6,1fr) !important }
@media(max-width:1100px){ .k-poster-grid-6{ grid-template-columns:repeat(4,1fr) !important } }
@media(max-width:768px) { .k-poster-grid-6{ grid-template-columns:repeat(3,1fr) !important } }
@media(max-width:480px) { .k-poster-grid-6{ grid-template-columns:repeat(2,1fr) !important } }

/* ── META DOT HELPER ── */
.k-meta-dot { display:inline-block; width:3px; height:3px; border-radius:50%;
  background:currentColor; opacity:.35; flex-shrink:0; margin:0 2px }

/* ── REMOVE EMOJI FROM WIDGET TITLES (clean look) ── */
/* We handle icons via SVG or text — emojis off */
.k-widget-title .k-title-icon { font-size:.85rem }

/* ── RESPONSIVE SINGLE POST ── */
@media(max-width:900px){
  .ksp-layout { grid-template-columns:1fr }
  .ksp-sidebar { display:none }
  .k-post-title { font-size:1.5rem }
  .ksp-hero { max-height:260px }
}
@media(max-width:600px){
  .ksp-share-inline { display:none } /* only show share bar below content on mobile */
  .k-post-title { font-size:1.25rem }
  .k-tatafo-grid { grid-template-columns:1fr }
}

/* ── REMOVE EXCESS EMOJI FROM SECTION HEADERS ── */
.k-sec-title,.k-section-title { font-family:var(--k-font-h) }


/* ================================================================
   KILODE FOOTER v20 — SESSION 2 FIXED
   New classes: kf- prefix (no conflicts)
   3D Coloured Social Icons
   ================================================================ */

/* STORE STRIP */
.kf-store-strip { background:var(--k-surface2); border-top:2px solid rgba(168,200,70,.15); padding:20px 0; }
.kf-store-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.kf-store-left { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.kf-store-badge { display:inline-block; background:var(--k-green); color:#000; font-size:.58rem; font-weight:800; padding:3px 10px; border-radius:20px; text-transform:uppercase; letter-spacing:.08em; flex-shrink:0; }
.kf-store-title { font-family:var(--k-font-h); font-size:1rem; font-weight:800; color:var(--k-ink); }
.kf-store-sub { font-size:.72rem; color:var(--k-ink-3); }
.kf-store-btn { padding:10px 24px; background:var(--k-green); color:#000; border-radius:100px; font-size:.82rem; font-weight:800; text-decoration:none; white-space:nowrap; transition:all .2s; flex-shrink:0; }
.kf-store-btn:hover { background:var(--k-green-d); transform:translateY(-2px); box-shadow:0 6px 20px rgba(168,200,70,.3); }

/* SOCIAL BANNER */
.kf-soc-inner { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.kf-soc-left { flex:1; min-width:200px; }
.kf-soc-live { display:inline-flex; align-items:center; gap:6px; font-size:.62rem; font-weight:800; color:var(--k-green); letter-spacing:.1em; text-transform:uppercase; margin-bottom:6px; }
.kf-soc-title { font-family:var(--k-font-h); font-size:1.3rem; font-weight:800; color:var(--k-ink); margin-bottom:4px; }
.kf-soc-sub { font-size:.74rem; color:var(--k-ink-3); }
.kf-soc-stats { display:flex; gap:24px; flex-shrink:0; }
.kf-soc-stat { text-align:center; }
.kf-soc-stat-n { display:block; font-family:var(--k-font-h); font-size:clamp(1.1rem,3vw,1.5rem); font-weight:800; color:var(--k-ink); line-height:1; }
.kf-soc-stat-l { display:block; font-size:.58rem; color:var(--k-ink-3); text-transform:uppercase; letter-spacing:.07em; margin-top:3px; }
.kf-soc-right { display:flex; flex-direction:column; gap:8px; flex-shrink:0; min-width:180px; }
.kf-soc-avatars { display:flex; align-items:center; gap:3px; }
.kf-soc-av { width:28px; height:28px; border-radius:50%; border:2px solid var(--k-bg); display:flex; align-items:center; justify-content:center; font-size:.72rem; font-weight:800; color:#fff; font-family:var(--k-font-h); flex-shrink:0; }
.kf-soc-av-more { background:rgba(255,255,255,.12) !important; color:var(--k-ink-2) !important; font-size:.62rem; }
.kf-soc-activity { display:flex; align-items:center; gap:6px; font-size:.72rem; color:var(--k-ink-3); min-height:18px; }
.kf-soc-activity #kf-act-text { transition:opacity .28s ease; }
.kf-soc-dot { width:6px; height:6px; border-radius:50%; background:#2ecc71; animation:k-pulse 1.8s infinite; flex-shrink:0; }
.kf-soc-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; background:var(--k-green); color:#000; border-radius:100px; padding:10px 18px; font-size:.82rem; font-weight:800; text-decoration:none; transition:all .2s; font-family:var(--k-font-h); white-space:nowrap; }
.kf-soc-btn:hover { background:var(--k-green-d); transform:translateY(-2px); box-shadow:0 6px 20px rgba(168,200,70,.3); }

/* NEWSLETTER BAR */
.kf-nl-bar { background:var(--k-surface2); border-top:1px solid var(--k-border); padding:22px 0; }
.kf-nl-inner { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.kf-nl-text { flex:1; min-width:200px; }
.kf-nl-text strong { display:block; font-family:var(--k-font-h); font-size:.95rem; font-weight:800; color:var(--k-ink); margin-bottom:3px; }
.kf-nl-text span { font-size:.74rem; color:var(--k-ink-3); }
.kf-nl-form { display:flex; flex-wrap:wrap; gap:8px; flex-shrink:0; max-width:380px; width:100%; }
.kf-nl-form input[type="email"] { flex:1; padding:10px 14px; border:1px solid var(--k-border); border-radius:100px; background:var(--k-surface3); color:var(--k-ink); font-size:.84rem; outline:none; transition:border-color .2s; }
.kf-nl-form input[type="email"]:focus { border-color:var(--k-green); }
.kf-nl-form input[type="email"]::placeholder { color:var(--k-ink-3); }
.kf-nl-form button { padding:10px 20px; border-radius:100px; background:var(--k-green); color:#000; font-size:.82rem; font-weight:800; border:none; cursor:pointer; transition:all .2s; white-space:nowrap; font-family:var(--k-font-h); }
.kf-nl-form button:hover { background:var(--k-green-d); }
.kf-nl-msg { font-size:.74rem; margin-top:2px; min-height:16px; flex-basis:100%; width:100%; }

/* MAIN FOOTER */
.kf-footer { background:#060606; padding:44px 0 20px; border-top:1px solid var(--k-border); }
.kf-top { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; margin-bottom:32px; }

/* Brand column */
.kf-brand {}
.kf-logo { display:flex; align-items:center; gap:10px; margin-bottom:13px; }
.kf-logo-icon { width:32px; height:32px; background:var(--k-green); border-radius:8px; display:flex; align-items:center; justify-content:center; font-family:var(--k-font-h); font-size:1rem; font-weight:800; color:#000; flex-shrink:0; }
.kf-logo-text { font-family:var(--k-font-h); font-size:1.1rem; font-weight:800; color:var(--k-ink); }
.kf-logo-text em { color:var(--k-green); font-style:normal; }
.kf-desc { font-size:.72rem; color:var(--k-ink-3); line-height:1.65; margin-bottom:16px; }

/* 3D COLOURED SOCIAL ICONS */
.kf-socials { display:flex; gap:8px; flex-wrap:wrap; }
.kf-soc-icon {
  width:36px; height:36px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  text-decoration:none;
  transition:all .2s;
  position:relative;
  flex-shrink:0;
}
.kf-soc-icon svg { width:16px; height:16px; fill:#fff; position:relative; z-index:1; }
.kf-soc-icon:hover { transform:translateY(-3px) scale(1.08); }

/* 3D effect via box-shadow */
.kf-soc-x  { background:#1a1a1a; box-shadow:0 4px 12px rgba(0,0,0,.4), 0 2px 0 rgba(255,255,255,.08) inset; }
.kf-soc-x:hover { background:#222; box-shadow:0 8px 20px rgba(0,0,0,.5), 0 2px 0 rgba(255,255,255,.08) inset; }
.kf-soc-x svg { fill:#fff; }

.kf-soc-fb { background:linear-gradient(145deg,#2196f3,#1565c0); box-shadow:0 4px 14px rgba(25,118,210,.45), 0 2px 0 rgba(255,255,255,.15) inset; }
.kf-soc-fb:hover { box-shadow:0 8px 22px rgba(25,118,210,.6), 0 2px 0 rgba(255,255,255,.15) inset; }

.kf-soc-ig { background:linear-gradient(145deg,#f9a825,#e91e63,#7b1fa2); box-shadow:0 4px 14px rgba(233,30,99,.4), 0 2px 0 rgba(255,255,255,.12) inset; }
.kf-soc-ig:hover { box-shadow:0 8px 22px rgba(233,30,99,.55), 0 2px 0 rgba(255,255,255,.12) inset; }

.kf-soc-wa { background:linear-gradient(145deg,#43e97b,#1da851); box-shadow:0 4px 14px rgba(29,168,81,.45), 0 2px 0 rgba(255,255,255,.15) inset; }
.kf-soc-wa:hover { box-shadow:0 8px 22px rgba(29,168,81,.6), 0 2px 0 rgba(255,255,255,.15) inset; }

.kf-soc-yt { background:linear-gradient(145deg,#ff5252,#c62828); box-shadow:0 4px 14px rgba(229,57,53,.45), 0 2px 0 rgba(255,255,255,.12) inset; }
.kf-soc-yt:hover { box-shadow:0 8px 22px rgba(229,57,53,.6), 0 2px 0 rgba(255,255,255,.12) inset; }

.kf-soc-tg { background:linear-gradient(145deg,#40c4ff,#0277bd); box-shadow:0 4px 14px rgba(2,119,189,.45), 0 2px 0 rgba(255,255,255,.15) inset; }
.kf-soc-tg:hover { box-shadow:0 8px 22px rgba(2,119,189,.6), 0 2px 0 rgba(255,255,255,.15) inset; }

.kf-soc-tk { background:linear-gradient(145deg,#222,#111); box-shadow:0 4px 14px rgba(0,0,0,.5), 0 2px 0 rgba(255,255,255,.08) inset; }
.kf-soc-tk:hover { box-shadow:0 8px 22px rgba(0,0,0,.6), 0 2px 0 rgba(255,255,255,.08) inset; }

/* Footer columns */
.kf-col {}
.kf-col-title { font-family:var(--k-font-h); font-size:.68rem; font-weight:800; color:var(--k-ink-2); text-transform:uppercase; letter-spacing:.1em; margin:0 0 14px; }
.kf-col-links { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:9px; }
.kf-col-links li {}
.kf-col-links a { font-size:.74rem; color:var(--k-ink-3); text-decoration:none; transition:color .15s; display:block; }
.kf-col-links a:hover { color:var(--k-ink); }

/* Footer bottom bar */
.kf-bottom { padding-top:20px; border-top:1px solid var(--k-border); display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.kf-bottom-left { font-size:.66rem; color:var(--k-ink-3); }
.kf-bottom-right { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.kf-bottom-right a { font-size:.66rem; color:var(--k-ink-3); text-decoration:none; transition:color .15s; }
.kf-bottom-right a:hover { color:var(--k-ink); }
.kf-bottom-right span { color:var(--k-border-2); font-size:.7rem; }

/* RESPONSIVE FOOTER */
@media(max-width:1024px) {
  .kf-top { grid-template-columns:1fr 1fr 1fr; gap:24px; }
  .kf-brand { grid-column:1/-1; }
  .kf-top .kf-brand + .kf-col,
  .kf-top .kf-brand + .kf-col + .kf-col,
  .kf-top .kf-brand + .kf-col + .kf-col + .kf-col { grid-column:auto; }
}
@media(max-width:768px) {
  .kf-top { grid-template-columns:1fr 1fr; gap:20px; }
  .kf-brand { grid-column:1/-1; }
  .kf-soc-inner { flex-direction:column; align-items:flex-start; }
  .kf-soc-stats { justify-content:flex-start; gap:20px; }
  .kf-soc-right { width:100%; }
  .kf-soc-btn { width:100%; text-align:center; }
  .kf-nl-inner { flex-direction:column; }
  .kf-nl-form { max-width:100%; }
  .kf-store-inner { flex-direction:column; text-align:center; }
  .kf-store-left { flex-direction:column; text-align:center; }
  .kf-store-btn { width:100%; text-align:center; }
  .kf-bottom { flex-direction:column; text-align:center; gap:10px; }
}
@media(max-width:480px) {
  .kf-top { grid-template-columns:1fr; }
  .kf-socials { gap:6px; }
  .kf-soc-icon { width:34px; height:34px; }
  .kf-soc-icon svg { width:15px; height:15px; }
}

/* ================================================================
   SESSION 5 FIXES
   - Mobile actions drawer (hamburger → full list)
   - Card title font size fix (mobile too large)
   - Publish button styles
   - Header pills hide on mobile
   ================================================================ */

/* PUBLISH pill */
.k-hdr-pill-publish {
  background:linear-gradient(135deg,var(--k-green),var(--k-green-d)) !important;
  color:#000 !important;
  font-weight:800 !important;
}
.k-hdr-pill-publish:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(168,200,70,.3); }
.k-hdr-pill-join {
  background:linear-gradient(135deg,var(--k-red),#c72f2f) !important;
  color:#fff !important;
  font-weight:800 !important;
}



/* CARD TITLE FIX — mobile font too large */
@media(max-width:480px) {
  .k-card-title { font-size:.8rem !important; line-height:1.35 !important; }
  .k-card-body { padding:10px 12px 12px !important; }
  .k-grid-3,.k-grid-4 { grid-template-columns:repeat(2,1fr) !important; gap:10px !important; }
  .k-hero-main h2 { font-size:1.1rem !important; }
  .k-post-title { font-size:1.4rem !important; }
  /* Ensure single column on very small screens */
  .k-hero-3col { display:block !important; }
  .k-hero-col { display:none !important; }
}

/* MOBILE OVERLAY fix */

/* HEADER on mobile — cleaner layout */
@media(max-width:768px) {
  .k-header-row { gap:8px; }
  .k-header-search { display:none !important; }
}

/* SIGNUP/REGISTER SOCIALS BANNER — red/green/white premium */
.kf-soc-banner { background:linear-gradient(135deg,#060606 0%,#0a0f0a 100%); border-top:none; border-bottom:2px solid rgba(168,200,70,.15); padding:0; }
.kf-reg-banner {
  padding:32px 0;
  background:linear-gradient(135deg,#0a0a0a 0%,#0d150d 60%,#150a0a 100%);
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
  position:relative;
  overflow:hidden;
}
.kf-reg-banner::before {
  content:'';
  position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 100% at 0% 50%,rgba(168,200,70,.08) 0%,transparent 60%),
             radial-gradient(ellipse 40% 80% at 100% 50%,rgba(255,59,59,.06) 0%,transparent 60%);
  pointer-events:none;
}
.kf-reg-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  flex-wrap:wrap;
  position:relative;
}
.kf-reg-left { flex:1; min-width:200px; }
.kf-reg-badge {
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:rgba(255,59,59,.12);
  border:1px solid rgba(255,59,59,.25);
  color:var(--k-red);
  font-size:.62rem;
  font-weight:800;
  letter-spacing:.12em;
  padding:3px 10px;
  border-radius:20px;
  margin-bottom:8px;
  text-transform:uppercase;
}
.kf-reg-title {
  font-family:var(--k-font-h);
  font-size:1.4rem;
  font-weight:800;
  color:#fff;
  margin-bottom:5px;
  line-height:1.2;
}
.kf-reg-title span { color:#A8C846; }
.kf-reg-sub { font-size:.78rem; color:rgba(255,255,255,.45); line-height:1.6; }
.kf-reg-stats {
  display:flex;
  gap:20px;
  flex-shrink:0;
}
.kf-reg-stat { text-align:center; }
.kf-reg-stat-n { display:block; font-family:var(--k-font-h); font-size:1.3rem; font-weight:800; color:#fff; line-height:1; }
.kf-reg-stat-l { display:block; font-size:.58rem; color:rgba(255,255,255,.4); text-transform:uppercase; letter-spacing:.07em; margin-top:3px; }
.kf-reg-right { flex-shrink:0; display:flex; flex-direction:column; gap:10px; min-width:160px; }
.kf-reg-avatars { display:flex; align-items:center; gap:3px; }
.kf-reg-av { width:26px; height:26px; border-radius:50%; border:2px solid #0a0a0a; display:flex; align-items:center; justify-content:center; font-size:.68rem; font-weight:800; color:#fff; flex-shrink:0; }
.kf-reg-act { font-size:.7rem; color:rgba(255,255,255,.4); display:flex; align-items:center; gap:4px; }
.kf-reg-act span { transition:opacity .28s; }
.kf-reg-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  background:linear-gradient(135deg,var(--k-red),#c72f2f);
  color:#fff;
  border-radius:100px;
  padding:12px 22px;
  font-size:.88rem;
  font-weight:800;
  text-decoration:none;
  transition:all .2s;
  font-family:var(--k-font-h);
  box-shadow:0 4px 20px rgba(255,59,59,.3);
  white-space:nowrap;
}
.kf-reg-btn:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(255,59,59,.45); }
.kf-reg-btn-secondary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  background:rgba(168,200,70,.12);
  border:1px solid rgba(168,200,70,.3);
  color:#A8C846;
  border-radius:100px;
  padding:10px 22px;
  font-size:.82rem;
  font-weight:800;
  text-decoration:none;
  transition:all .2s;
  font-family:var(--k-font-h);
  white-space:nowrap;
}
.kf-reg-btn-secondary:hover { background:rgba(168,200,70,.2); transform:translateY(-1px); }
@media(max-width:768px) {
  .kf-reg-inner { flex-direction:column; align-items:flex-start; }
  .kf-reg-stats { justify-content:flex-start; gap:16px; }
  .kf-reg-right { width:100%; }
  .kf-reg-btn,.kf-reg-btn-secondary { width:100%; text-align:center; }
}

/* ================================================================
   SESSION 6 — MARKETING TICKER
   Slim branded bar before footer, red/green/black/white
   ================================================================ */

.k-mkticker-wrap {
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(255,255,255,.06);
}

.k-mkticker-slide {
  display: none;
  padding: 11px 0;
  transition: background .3s ease;
}
.k-mkticker-slide.active { display: block; }

.k-mkticker-inner {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: nowrap;
}

.k-mkticker-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  opacity: .7;
  animation: k-pulse 1.8s infinite;
  flex-shrink: 0;
}

.k-mkticker-msg {
  flex: 1;
  font-size: .84rem;
  font-weight: 600;
  line-height: 1.4;
  min-width: 0;
}

.k-mkticker-btn {
  display: inline-flex;
  align-items: center;
  padding: 4px 14px;
  border: 1px solid;
  border-radius: 20px;
  font-size: .72rem;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: opacity .15s;
  font-family: var(--k-font-h, sans-serif);
  letter-spacing: .03em;
}
.k-mkticker-btn:hover { opacity: .82; }

.k-mkticker-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 2px 6px;
  font-size: .9rem;
  opacity: .5;
  transition: opacity .15s;
  flex-shrink: 0;
  line-height: 1;
}
.k-mkticker-close:hover { opacity: 1; }

.k-mkticker-dots {
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 4px;
}
.k-mkticker-dot-btn {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,.3);
  cursor: pointer;
  padding: 0;
  transition: all .2s;
}
.k-mkticker-dot-btn.active {
  background: rgba(255,255,255,.8);
  width: 14px;
  border-radius: 3px;
}

@media(max-width:600px) {
  .k-mkticker-msg { font-size:.78rem; }
  .k-mkticker-btn { font-size:.68rem; padding:3px 10px; }
}

/* ================================================================
   KILODE MOBILE DRAWER v21 — Clean rebuild
   New class: k-mobile-drawer / k-mdr-*
   ================================================================ */

/* Hide desktop pills on mobile */
@media(max-width:768px) {
  .k-hdr-pill-d        { display:none !important; }
  .k-header-search     { display:none !important; }
  .k-hdr-pill-m-only   { display:inline-flex !important; }
}

/* Show mobile Socials pill only on mobile */
.k-hdr-pill-m-only {
  display: none;
  align-items: center;
  gap: 5px;
  font-size: .75rem;
  padding: 5px 14px;
  border-radius: 20px;
  text-decoration: none;
  transition: all .15s;
  white-space: nowrap;
  font-weight: 800;
}
/* Join pill on mobile */
.k-hdr-pill-m-join {
  background: var(--k-green) !important;
  border: 1px solid var(--k-green) !important;
  color: #000 !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  font-size: .7rem !important;
  padding: 5px 14px !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
}
.k-hdr-pill-m-join:hover { background: var(--k-green-d) !important; }

/* Publish pill (desktop) */
.k-hdr-pill-publish {
  background: linear-gradient(135deg,#A8C846,#00a050) !important;
  color: #000 !important;
  font-weight: 800 !important;
}

/* ── MOBILE DRAWER ── */
.k-mobile-drawer {
  position: fixed;
  top: 0;
  left: 0;
  width: 300px;
  max-width: 88vw;
  height: 100vh;
  background: #0a0a0a;
  border-right: 2px solid rgba(168,200,70,.2);
  z-index: 99999;
  transform: translateX(-100%);
  transition: transform .3s cubic-bezier(.4,0,.2,1);
  overflow-y: auto;
  overflow-x: hidden;
  box-shadow: 6px 0 40px rgba(0,0,0,.7);
  -webkit-overflow-scrolling: touch;
}
.k-mobile-drawer.open {
  transform: translateX(0) !important;
}

/* Drawer header */
.k-mdr-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px;
  background: rgba(168,200,70,.08);
  border-bottom: 1px solid rgba(168,200,70,.15);
  position: sticky;
  top: 0;
  z-index: 2;
}
.k-mdr-logo {
  font-family: var(--k-font-h, 'Syne', sans-serif);
  font-size: 1.1rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -.02em;
}
.k-mdr-logo em {
  color: #A8C846;
  font-style: normal;
}
.k-mdr-close {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  color: rgba(255,255,255,.7);
  font-size: 1rem;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
  flex-shrink: 0;
}
.k-mdr-close:hover { background: rgba(255,255,255,.15); color: #fff; }

/* Drawer nav list */
.k-mdr-list {
  list-style: none;
  margin: 0;
  padding: 10px 0 30px;
}
.k-mdr-list li {
  display: block;
  margin: 0;
  padding: 0;
}
.k-mdr-item {
  display: block !important;
  width: 100%;
  padding: 14px 22px;
  font-size: .95rem;
  font-weight: 600;
  color: rgba(255,255,255,.78);
  text-decoration: none;
  border-left: 3px solid transparent;
  transition: all .15s;
  box-sizing: border-box;
}
.k-mdr-item:hover {
  background: rgba(255,255,255,.05);
  color: #fff;
  border-left-color: #A8C846;
}
.k-mdr-socials {
  color: #A8C846 !important;
  font-weight: 700 !important;
}
.k-mdr-socials:hover {
  background: rgba(168,200,70,.08) !important;
  border-left-color: #A8C846 !important;
}
.k-mdr-publish {
  color: #A8C846 !important;
  font-weight: 800 !important;
}
.k-mdr-join {
  background: rgba(255,59,59,.08);
  color: #fff !important;
  font-weight: 800 !important;
  border-left-color: var(--k-red) !important;
}
.k-mdr-logout {
  color: rgba(255,255,255,.35) !important;
  font-size: .85rem;
}

/* Separator */
.k-mdr-sep {
  height: 1px;
  background: rgba(255,255,255,.07);
  margin: 8px 20px !important;
  padding: 0 !important;
  display: block !important;
}

/* Theme row */
.k-mdr-theme {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  padding: 12px 22px !important;
}
.k-mdr-theme span {
  font-size: .82rem;
  color: rgba(255,255,255,.4);
}
.k-mdr-theme-btn {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px;
  padding: 5px 14px;
  font-size: .78rem;
  color: rgba(255,255,255,.7);
  cursor: pointer;
  transition: all .15s;
}
.k-mdr-theme-btn:hover { background: rgba(255,255,255,.15); }

/* Overlay */
.k-mobile-nav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.65);
  z-index: 99998;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}
.k-mobile-nav-overlay.active { display: block; }

/* ================================================================
   KILODE v22 — PREMIUM HOMEPAGE REDESIGN
   Naijaloaded-inspired mature, editorial layout
   ================================================================ */

/* SOCIAL LINKS BAR */
.klp-social-bar { background:#111; border-bottom:1px solid rgba(255,255,255,.06); padding:10px 0; }
.klp-social-bar-inner { display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:center; }
.klp-sb-btn {
  display:inline-flex; align-items:center; gap:10px;
  padding:9px 16px; border-radius:6px; text-decoration:none;
  transition:opacity .15s; min-width:160px;
}
.klp-sb-btn:hover { opacity:.88; }
.klp-sb-btn svg { flex-shrink:0; }
.klp-sb-btn div { display:flex; flex-direction:column; }
.klp-sb-btn div span { font-size:.62rem; opacity:.8; font-weight:400; }
.klp-sb-btn div strong { font-size:.82rem; font-weight:700; }
.klp-sb-yt   { background:#c62828; color:#fff; }
.klp-sb-tk   { background:#00bfa5; color:#fff; }
.klp-sb-live { background:var(--k-red); color:#fff; }
.klp-sb-ig   { background:linear-gradient(135deg,#f9a825,#e91e63); color:#fff; }
@media(max-width:600px){ .klp-sb-btn{ min-width:calc(50% - 10px); flex:1; } }

/* SLIDER */
.klp-slider-wrap { position:relative; margin:16px 0; border-radius:12px; overflow:hidden; background:#111; }
.klp-slider { position:relative; height:340px; }
@media(max-width:600px){ .klp-slider { height:240px; } }
.klp-slide { position:absolute; inset:0; opacity:0; transition:opacity .5s ease; pointer-events:none; }
.klp-slide.active { opacity:1; pointer-events:auto; }
.klp-slide-inner { display:block; width:100%; height:100%; position:relative; text-decoration:none; }
.klp-slide-img { width:100%; height:100%; background-size:cover; background-position:center; background-color:#1a1a1a; }
.klp-slide-img-fallback { background:linear-gradient(135deg,#1a1a1a,#222); }
.klp-slide-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.3) 50%,transparent 100%); }
.klp-slide-info { position:absolute; bottom:0; left:0; right:0; padding:20px 24px; }
.klp-slide-cat { display:inline-block; background:var(--k-green); color:#000; font-size:.6rem; font-weight:800; padding:2px 8px; border-radius:3px; margin-bottom:8px; letter-spacing:.08em; text-transform:uppercase; }
.klp-slide-title { font-family:var(--k-font-h); font-size:clamp(1rem,2.5vw,1.4rem); font-weight:800; color:#fff; margin:0 0 8px; line-height:1.25; }
.klp-slide-artist { font-size:.75rem; color:rgba(255,255,255,.65); display:flex; align-items:center; gap:5px; }
.klp-slider-btn {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(0,0,0,.6); border:1px solid rgba(255,255,255,.12);
  color:#fff; font-size:1.6rem; width:40px; height:40px; border-radius:50%;
  cursor:pointer; transition:all .15s; display:flex; align-items:center; justify-content:center;
  z-index:10; line-height:1;
}
.klp-slider-btn:hover { background:rgba(168,200,70,.7); border-color:var(--k-green); }
.klp-slider-prev { left:12px; }
.klp-slider-next { right:12px; }
.klp-slider-dots { position:absolute; bottom:10px; left:50%; transform:translateX(-50%); display:flex; gap:5px; z-index:10; }
.klp-dot { width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.4); border:none; cursor:pointer; padding:0; transition:all .2s; }
.klp-dot.active { width:18px; border-radius:3px; background:var(--k-green); }

/* HERO GRID */
.klp-hero-grid { display:grid; grid-template-columns:2fr 1fr; gap:16px; margin:16px 0; }
@media(max-width:900px){ .klp-hero-grid{ grid-template-columns:1fr; } }

.klp-hero-main { display:block; position:relative; border-radius:10px; overflow:hidden; aspect-ratio:16/9; text-decoration:none; background:#111; }
.klp-hero-main img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.klp-hero-main:hover img { transform:scale(1.03); }
.klp-hero-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.88) 0%,rgba(0,0,0,.2) 60%,transparent 100%); }
.klp-hero-body { position:absolute; bottom:0; left:0; right:0; padding:20px; }
.klp-hero-cat { display:inline-block; background:var(--k-green); color:#000; font-size:.58rem; font-weight:800; padding:2px 8px; border-radius:3px; margin-bottom:8px; text-transform:uppercase; letter-spacing:.1em; }
.klp-breaking-badge { display:inline-block; background:#c62828; color:#fff; font-size:.58rem; font-weight:800; padding:2px 8px; border-radius:3px; margin-bottom:8px; margin-left:4px; text-transform:uppercase; letter-spacing:.1em; animation:blink 1s infinite; }
@keyframes blink { 50%{opacity:.7} }
.klp-hero-title { font-family:var(--k-font-h); font-size:clamp(1.1rem,2.5vw,1.5rem); font-weight:800; color:#fff; margin:0 0 8px; line-height:1.2; }
.klp-hero-meta { font-size:.72rem; color:rgba(255,255,255,.55); display:flex; align-items:center; gap:6px; }
.klp-dot { display:inline-block; width:3px; height:3px; background:currentColor; border-radius:50%; opacity:.5; }

.klp-hero-side { display:flex; flex-direction:column; gap:10px; }
.klp-side-item { display:flex; gap:10px; align-items:flex-start; padding:10px; background:var(--k-surface2); border:1px solid var(--k-border); border-radius:8px; text-decoration:none; transition:all .15s; }
.klp-side-item:hover { background:var(--k-surface3); border-color:rgba(168,200,70,.2); }
.klp-side-img { width:80px; height:56px; border-radius:6px; overflow:hidden; flex-shrink:0; background:var(--k-surface3); }
.klp-side-img img { width:100%; height:100%; object-fit:cover; }
.klp-side-body { flex:1; min-width:0; }
.klp-side-cat { font-size:.58rem; font-weight:800; color:var(--k-green); text-transform:uppercase; letter-spacing:.08em; display:block; margin-bottom:4px; }
.klp-side-title { font-family:var(--k-font-h); font-size:.83rem; font-weight:700; color:var(--k-ink); line-height:1.3; margin:0 0 4px; }
.klp-side-time { font-size:.66rem; color:var(--k-ink-3); }

/* TICKER */
.klp-ticker { display:flex; align-items:center; background:var(--k-surface2); border:1px solid var(--k-border); border-radius:6px; overflow:hidden; margin:12px 0; height:38px; }
.klp-ticker-label { background:var(--k-green); color:#000; font-size:.65rem; font-weight:800; padding:0 14px; height:100%; display:flex; align-items:center; letter-spacing:.1em; white-space:nowrap; flex-shrink:0; }
.klp-ticker-track { flex:1; overflow:hidden; position:relative; }
.klp-ticker-inner { display:flex; align-items:center; gap:0; animation:klp-tick 40s linear infinite; white-space:nowrap; }
.klp-ticker-inner:hover { animation-play-state:paused; }
.klp-ticker-inner a { color:var(--k-ink-2); font-size:.78rem; text-decoration:none; padding:0 20px; border-right:1px solid var(--k-border); transition:color .15s; }
.klp-ticker-inner a:hover { color:var(--k-green); }
@keyframes klp-tick { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* SECTION HEADERS */
.klp-section { margin:28px 0; }
.klp-sec-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.klp-sec-left { display:flex; align-items:center; gap:12px; }
.klp-sec-title { font-family:var(--k-font-h); font-size:clamp(.82rem,2vw,1.05rem); font-weight:800; color:var(--k-ink); margin:0; letter-spacing:-.01em; }
.klp-sec-line { display:block; width:40px; height:3px; background:var(--k-green); border-radius:2px; }
.klp-sec-more { font-size:.75rem; font-weight:700; color:var(--k-green); text-decoration:none; border:1px solid rgba(168,200,70,.3); padding:5px 14px; border-radius:20px; transition:all .15s; }
.klp-sec-more:hover { background:rgba(168,200,70,.1); }

/* PREMIUM CARD GRID */
.klp-grid { display:grid; gap:16px; }
.klp-grid-2 { grid-template-columns:repeat(2,1fr); }
.klp-grid-3 { grid-template-columns:repeat(3,1fr); }
.klp-grid-4 { grid-template-columns:repeat(4,1fr); }

.klp-card-cat { position:absolute; bottom:8px; left:8px; background:var(--k-green); color:#000; font-size:.56rem; font-weight:800; padding:2px 7px; border-radius:3px; text-transform:uppercase; letter-spacing:.08em; }
.klp-card-meta { font-size:.66rem; color:var(--k-ink-3); display:flex; gap:6px; align-items:center; }

/* LIST VIEW (Naijaloaded-style) */
.klp-list-view { display:flex; flex-direction:column; border:1px solid var(--k-border); border-radius:8px; overflow:hidden; }
.klp-list-item { display:flex; align-items:center; gap:12px; padding:11px 14px; border-bottom:1px solid var(--k-border); text-decoration:none; transition:background .12s; }
.klp-list-item:last-child { border-bottom:none; }
.klp-list-item:hover { background:var(--k-surface2); }
.klp-list-body { flex:1; min-width:0; }
.klp-list-cat { font-size:.6rem; font-weight:700; color:var(--k-green); text-transform:uppercase; letter-spacing:.07em; display:block; margin-bottom:3px; }
.klp-list-cat-music { color:#A8C846; }
.klp-list-title { font-size:.86rem; font-weight:700; color:var(--k-ink); display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.klp-list-icon { flex-shrink:0; opacity:.7; }

/* LOAD MORE */
.klp-load-more-wrap { text-align:center; margin-top:16px; }
.klp-load-more { padding:10px 28px; background:transparent; border:1px solid var(--k-border); color:var(--k-ink-2); border-radius:6px; font-size:.82rem; font-weight:700; cursor:pointer; transition:all .15s; }
.klp-load-more:hover { border-color:var(--k-green); color:var(--k-green); background:rgba(168,200,70,.06); }

/* AD SLOT */
.klp-ad-slot { text-align:center; margin:16px 0; overflow:hidden; border-radius:8px; }

/* RESPONSIVE GRIDS */
@media(max-width:1024px) { .klp-grid-4{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:768px)  { .klp-grid-3,.klp-grid-4{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px)  { .klp-grid-2,.klp-grid-3,.klp-grid-4{ grid-template-columns:1fr; gap:12px; } }

/* REMOVE EMOJIS FROM OLD SECTION HEADERS — override */
.k-sec-title::before,.k-sec-sub::before { content:none !important; }

/* HEADER NAV — Premium Naijaloaded-style */
.k-header-row { gap:12px; }
.k-hdr-pill {
  padding:6px 14px !important;
  font-size:.75rem !important;
  font-weight:700 !important;
  border:1px solid rgba(255,255,255,.15) !important;
  border-radius:5px !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
  background:transparent !important;
  color:var(--k-ink-2) !important;
  text-decoration:none;
}
.k-hdr-pill:hover { border-color:var(--k-green) !important; color:var(--k-green) !important; }
.k-hdr-pill-publish {
  background:var(--k-green) !important;
  color:#000 !important;
  border-color:var(--k-green) !important;
}

/* CATEGORY NAV — no emojis, clean text */
.k-cattab-icon { display:none !important; }
.k-cattab { font-size:.78rem !important; font-weight:600 !important; letter-spacing:.02em; padding:10px 14px !important; }

/* ── HEADER NAV PILL COLOURS — Naijaloaded style ── */
.k-hdr-pill-active { color:var(--k-green) !important; border-color:var(--k-green) !important; }
.k-hdr-pill-music  { color:#A8C846 !important; border-color:rgba(168,200,70,.4) !important; }
.k-hdr-pill-music:hover { background:rgba(168,200,70,.1) !important; }
.k-hdr-pill-tv     { color:var(--k-red) !important; border-color:rgba(255,59,59,.3) !important; }
.k-hdr-pill-upload {
  background:var(--k-green) !important; color:#000 !important;
  border-color:var(--k-green) !important; font-weight:800 !important;
}
.k-hdr-pill-upload:hover { background:var(--k-green-d) !important; color:#000 !important; }
.k-hdr-pill-artiste {
  background:linear-gradient(135deg,#6366f1,#4f46e5) !important;
  color:#fff !important; border-color:transparent !important;
}
.k-hdr-pill-artiste:hover { opacity:.9; }

/* Remove ALL emojis from section heads via CSS */
.k-sec-title,.klp-sec-title,.k-cattab span:first-child { font-family:var(--k-font-h) !important; }

/* ================================================================
   SESSION 1 — SHARE SCORE BUTTONS
   ================================================================ */
.kss-wrap { margin:22px 0 10px; }
.kss-nudge { font-size:.75rem; color:var(--k-green); font-weight:600; margin-bottom:10px; padding:8px 12px; background:rgba(168,200,70,.08); border-radius:6px; border-left:3px solid var(--k-green); }
.kss-buttons { display:flex; flex-wrap:wrap; gap:7px; }
.kss-btn { display:inline-flex; align-items:center; gap:6px; padding:7px 14px; border-radius:6px; font-size:.75rem; font-weight:700; color:#fff; text-decoration:none; cursor:pointer; border:none; transition:all .15s; }
.kss-btn:hover { opacity:.88; transform:translateY(-1px); }
.kss-cp { background:#333; }
.kss-toast { font-size:.72rem; font-weight:800; color:var(--k-green); height:0; overflow:hidden; transition:height .15s; margin-top:5px; }
.kss-toast.show { height:20px; }
/* Leaderboard */
.kss-board { background:var(--k-surface2); border:1px solid var(--k-border); border-radius:10px; overflow:hidden; }
.kss-board-head { background:var(--k-green); color:#000; font-family:var(--k-font-h); font-size:.82rem; font-weight:800; padding:10px 14px; text-transform:uppercase; letter-spacing:.06em; }
.kss-board-row { display:flex; align-items:center; gap:10px; padding:10px 14px; border-bottom:1px solid var(--k-border); }
.kss-board-row:last-child { border-bottom:none; }
.kss-top-1 { background:rgba(255,195,0,.06); }
.kss-top-2 { background:rgba(180,180,180,.04); }
.kss-top-3 { background:rgba(184,115,51,.04); }
.kss-rank { font-size:1rem; flex-shrink:0; min-width:28px; }
.kss-name { flex:1; font-size:.84rem; font-weight:700; color:var(--k-ink); }
.kss-score { font-family:var(--k-font-h); font-size:.82rem; font-weight:800; color:var(--k-green); }

/* ================================================================
   SESSION 2 — JOIN KILODE WIDGET
   ================================================================ */
.kjw-wrap { background:linear-gradient(135deg,var(--k-surface2),var(--k-surface3)); border:1px solid rgba(168,200,70,.2); border-radius:12px; padding:18px; }
.kjw-header { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.kjw-logo-mark { width:40px; height:40px; background:var(--k-green); border-radius:10px; display:flex; align-items:center; justify-content:center; font-family:var(--k-font-h); font-size:1.2rem; font-weight:800; color:#000; flex-shrink:0; }
.kjw-head-title { font-family:var(--k-font-h); font-size:1rem; font-weight:800; color:var(--k-ink); margin:0; }
.kjw-head-sub { font-size:.7rem; color:var(--k-green); font-weight:600; }
.kjw-perks { list-style:none; margin:0 0 14px; padding:0; display:flex; flex-direction:column; gap:5px; }
.kjw-perks li { font-size:.75rem; color:var(--k-ink-2); padding-left:16px; position:relative; }
.kjw-perks li::before { content:'✓'; position:absolute; left:0; color:var(--k-green); font-weight:700; }
.kjw-input { width:100%; padding:10px 12px; background:var(--k-surface); border:1px solid var(--k-border); border-radius:7px; color:var(--k-ink); font-size:.85rem; outline:none; box-sizing:border-box; font-family:inherit; }
.kjw-input:focus { border-color:var(--k-green); }
.kjw-btn { display:inline-flex; align-items:center; justify-content:center; padding:10px 16px; border-radius:7px; font-size:.82rem; font-weight:700; cursor:pointer; border:none; text-decoration:none; transition:all .15s; font-family:var(--k-font-h); }
.kjw-btn-green { background:var(--k-green); color:#000; }
.kjw-btn-green:hover { background:var(--k-green-d); }
.kjw-btn-outline { background:transparent; border:1px solid var(--k-border); color:var(--k-ink-2); }
.kjw-btn-outline:hover { border-color:var(--k-green); color:var(--k-green); }
.kjw-actions { display:flex; gap:8px; margin-bottom:8px; }
.kjw-avatar-row { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.kjw-avatar { width:44px; height:44px; border-radius:50%; object-fit:cover; border:2px solid var(--k-green); }
.kjw-welcome { font-size:.7rem; color:var(--k-ink-3); }
.kjw-name { font-family:var(--k-font-h); font-size:.95rem; font-weight:800; color:var(--k-ink); }
.kjw-socials-link { display:block; text-align:center; font-size:.75rem; color:var(--k-green); text-decoration:none; margin-top:10px; padding:7px; background:rgba(168,200,70,.08); border-radius:6px; }
.kjw-login-link { text-align:center; font-size:.72rem; color:var(--k-ink-3); margin-top:10px; }
.kjw-login-link a { color:var(--k-green); }

/* ================================================================
   SESSION 3 — AI SIDEBAR WIDGET
   ================================================================ */
.kaw-wrap { background:var(--k-surface2); border:1px solid var(--k-border); border-radius:12px; overflow:hidden; }
.kaw-head { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; cursor:pointer; background:var(--k-surface3); transition:background .15s; }
.kaw-head:hover { background:var(--k-surface4); }
.kaw-head-left { display:flex; align-items:center; gap:10px; }
.kaw-icon { width:36px; height:36px; border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.kaw-title { font-family:var(--k-font-h); font-size:.88rem; font-weight:800; color:var(--k-ink); margin:0; }
.kaw-sub { font-size:.64rem; color:var(--k-ink-3); }
.kaw-toggle-icon { font-size:1.2rem; color:var(--k-ink-3); transition:transform .2s; }
.kaw-body { display:none; padding:12px; }
.kaw-body.kaw-open { display:block; }
.kaw-messages { max-height:220px; overflow-y:auto; display:flex; flex-direction:column; gap:8px; margin-bottom:10px; scrollbar-width:thin; }
.kaw-msg { display:flex; }
.kaw-msg-ai .kaw-bubble { background:var(--k-surface3); border-radius:0 8px 8px 8px; align-self:flex-start; }
.kaw-msg-user { justify-content:flex-end; }
.kaw-msg-user .kaw-bubble { background:rgba(168,200,70,.15); border:1px solid rgba(168,200,70,.2); border-radius:8px 0 8px 8px; color:var(--k-ink); }
.kaw-bubble { font-size:.78rem; color:var(--k-ink-2); padding:8px 11px; max-width:90%; line-height:1.45; }
.kaw-input-row { display:flex; gap:7px; }
.kaw-input { flex:1; padding:9px 11px; background:var(--k-surface3); border:1px solid var(--k-border); border-radius:7px; color:var(--k-ink); font-size:.82rem; outline:none; font-family:inherit; }
.kaw-input:focus { border-color:var(--k-green); }
.kaw-send { width:36px; height:36px; border-radius:7px; border:none; cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center; transition:opacity .15s; }
.kaw-send:hover { opacity:.85; }
.kaw-powered { font-size:.6rem; color:var(--k-ink-3); text-align:center; margin-top:8px; }

/* ================================================================
   SESSION 4 — QR PWA WIDGET
   ================================================================ */
.kqr-wrap { background:var(--k-surface2); border:1px solid rgba(168,200,70,.2); border-radius:10px; padding:14px; margin:12px 0; }
.kqr-inner { display:flex; align-items:center; gap:14px; margin-bottom:12px; }
.kqr-frame { background:#0d0d0d; border:2px solid var(--k-green); border-radius:8px; padding:4px; flex-shrink:0; }
.kqr-frame img { display:block; border-radius:4px; }
.kqr-scan-text { font-size:.55rem; font-weight:800; color:var(--k-green); text-align:center; letter-spacing:.1em; margin-top:4px; }
.kqr-app-name { font-family:var(--k-font-h); font-size:.95rem; font-weight:800; color:var(--k-ink); margin-bottom:3px; }
.kqr-tagline { font-size:.72rem; color:var(--k-ink-3); margin-bottom:8px; }
.kqr-platforms { display:flex; gap:4px; align-items:center; margin-bottom:10px; }
.kqr-platform { font-size:.62rem; font-weight:700; color:var(--k-ink-3); background:var(--k-surface3); border-radius:3px; padding:2px 6px; }
.kqr-dot { color:var(--k-ink-3); font-size:.6rem; }
.kqr-install-btn { background:var(--k-green); color:#000; border:none; border-radius:6px; font-size:.75rem; font-weight:800; padding:7px 14px; cursor:pointer; width:100%; font-family:var(--k-font-h); transition:all .15s; }
.kqr-install-btn:hover { background:var(--k-green-d); }
.kqr-subscribe { display:flex; gap:6px; }
.kqr-email-inp { flex:1; padding:8px 10px; background:var(--k-surface3); border:1px solid var(--k-border); border-radius:6px; color:var(--k-ink); font-size:.76rem; outline:none; font-family:inherit; }
.kqr-email-inp:focus { border-color:var(--k-green); }
.kqr-sub-btn { background:var(--k-surface3); border:1px solid var(--k-border); color:var(--k-ink-2); border-radius:6px; font-size:.72rem; font-weight:700; padding:8px 12px; cursor:pointer; white-space:nowrap; transition:all .15s; }
.kqr-sub-btn:hover { border-color:var(--k-green); color:var(--k-green); }

/* Discussion Gate Tabs */
.kd-gate-tabs{display:flex;gap:4px;margin-bottom:12px;background:var(--k-surface3);border-radius:7px;padding:3px}
.kd-gate-tab{flex:1;padding:7px;border:none;background:transparent;color:var(--k-ink-3);font-size:.76rem;font-weight:700;border-radius:5px;cursor:pointer;transition:all .15s}
.kd-gate-tab.active{background:var(--k-green);color:#000}

/* ================================================================
   FEATURED PROFILES SECTION
   ================================================================ */
.kfp-section{padding:32px 0 20px;border-top:1px solid var(--k-border)}
.kfp-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:18px;flex-wrap:wrap;gap:10px}
.kfp-sponsored-label{display:inline-block;background:transparent;border:1px solid var(--k-border);color:var(--k-ink-3);font-size:.62rem;padding:2px 8px;border-radius:3px;margin-bottom:6px}
.kfp-title{font-family:var(--k-font-h);font-size:1.1rem;font-weight:800;color:var(--k-ink);margin:0 0 3px;text-transform:uppercase;letter-spacing:.04em}
.kfp-sub{font-size:.76rem;color:var(--k-ink-3);margin:0}
.kfp-take-space{font-size:.78rem;color:var(--k-green);font-weight:700;text-decoration:none;white-space:nowrap;padding:6px 14px;border:1px solid rgba(168,200,70,.3);border-radius:5px;transition:all .15s}
.kfp-take-space:hover{background:rgba(168,200,70,.08)}
.kfp-slider-wrap{position:relative}
.kfp-track{display:flex;gap:16px;overflow-x:auto;scroll-behavior:smooth;padding:4px 0 16px;scrollbar-width:none}
.kfp-track::-webkit-scrollbar{display:none}
.kfp-arrow{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;background:var(--k-surface3);border:1px solid var(--k-border);color:var(--k-ink);font-size:1.4rem;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;transition:all .15s;line-height:1}
.kfp-arrow:hover{background:var(--k-green);color:#000;border-color:var(--k-green)}
.kfp-prev{left:-18px}.kfp-next{right:-18px}
.kfp-card{flex-shrink:0;width:145px;text-align:center;padding:14px 10px;background:var(--k-surface2);border:1px solid var(--k-border);border-radius:10px;transition:all .18s}
.kfp-card:hover{border-color:rgba(168,200,70,.2);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.4)}
.kfp-avatar-wrap{position:relative;display:inline-block;margin-bottom:10px}
.kfp-avatar{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid var(--k-border);display:block}
.kfp-avatar-ph{background:var(--k-surface3);display:flex;align-items:center;justify-content:center;font-family:var(--k-font-h);font-size:1.6rem;font-weight:800;color:var(--k-ink)}
.kfp-flag{position:absolute;bottom:0;right:0;font-size:.85rem;line-height:1}
.kfp-name{font-family:var(--k-font-h);font-size:.84rem;font-weight:800;color:var(--k-ink);margin-bottom:2px}
.kfp-cat{font-size:.65rem;color:var(--k-ink-3);margin-bottom:6px}
.kfp-bio{font-size:.65rem;color:var(--k-ink-3);margin-bottom:8px;line-height:1.4}
.kfp-actions{display:flex;gap:6px;justify-content:center;align-items:center}
.kfp-follow-btn{display:inline-flex;align-items:center;gap:4px;background:transparent;border:1px solid var(--k-border);color:var(--k-ink-2);font-size:.68rem;font-weight:700;padding:5px 12px;border-radius:5px;cursor:pointer;text-decoration:none;transition:all .15s}
.kfp-follow-btn:hover{border-color:var(--k-green);color:var(--k-green);background:rgba(168,200,70,.06)}
.kfp-play-btn{width:28px;height:28px;border-radius:50%;background:var(--k-green);color:#000;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}
.kfp-play-btn:hover{background:var(--k-green-d);transform:scale(1.1)}
.kfp-footer{text-align:right;margin-top:6px}
.kfp-see-all{font-size:.78rem;font-weight:700;color:var(--k-green);text-decoration:none}

/* ================================================================
   SPONSOR FOOTER BAR
   ================================================================ */
.ksponsor-bar{border-top:1px solid var(--k-border);padding:18px 0;background:var(--k-surface)}
.ksponsor-inner{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.ksponsor-label{font-size:.68rem;font-weight:800;color:var(--k-ink-3);text-transform:uppercase;letter-spacing:.1em;flex-shrink:0;border-right:1px solid var(--k-border);padding-right:20px}
.ksponsor-logos{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.ksponsor-item{display:flex;align-items:center;opacity:.65;transition:opacity .15s;text-decoration:none}
.ksponsor-item:hover{opacity:1}
.ksponsor-logo{max-height:32px;max-width:120px;object-fit:contain;filter:grayscale(30%)}
.ksponsor-text{font-size:.82rem;font-weight:700;color:var(--k-ink-3)}
@media (max-width: 768px) {
  .ksponsor-bar{padding:12px 0}
  .ksponsor-inner{gap:12px}
  .ksponsor-label{font-size:.56rem;padding-right:11px;letter-spacing:.06em}
  .ksponsor-logos{gap:12px}
  .ksponsor-logo{max-height:20px;max-width:76px}
  .ksponsor-text{font-size:.68rem}
}

/* ================================================================
   SINGLE POST — HORIZONTAL BANNER AD + LIVE SCORES
   ================================================================ */
.ksp-ad-between{margin:22px 0;text-align:center;overflow:hidden;border-radius:6px}

.ksp-live-scores{background:var(--k-surface2);border:1px solid var(--k-border);border-radius:10px;margin:20px 0;overflow:hidden}
.ksp-ls-head{display:flex;align-items:center;gap:8px;padding:12px 14px;background:var(--k-surface3);border-bottom:1px solid var(--k-border);flex-wrap:wrap}
.ksp-ls-dot{width:8px;height:8px;border-radius:50%;background:var(--k-red);animation:blink 1s infinite;flex-shrink:0}
.ksp-ls-title{font-family:var(--k-font-h);font-size:.82rem;font-weight:800;color:var(--k-ink)}
.ksp-ls-league{font-size:.7rem;color:var(--k-ink-3);margin-left:auto}
.ksp-ls-source{font-size:.68rem;color:var(--k-green);text-decoration:none;font-weight:700}
.ksp-ls-tabs{display:flex;gap:4px;padding:8px 12px;border-bottom:1px solid var(--k-border);overflow-x:auto;scrollbar-width:none}
.ksp-ls-tabs::-webkit-scrollbar{display:none}
.ksp-ls-tab{background:none;border:1px solid var(--k-border);color:var(--k-ink-3);font-size:.68rem;font-weight:700;padding:4px 10px;border-radius:20px;cursor:pointer;transition:all .15s;white-space:nowrap}
.ksp-ls-tab.active,.ksp-ls-tab:hover{background:var(--k-green);color:#000;border-color:var(--k-green)}
.ksp-ls-body{padding:6px 0;max-height:280px;overflow-y:auto}
.ksp-ls-match{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--k-border);gap:8px;transition:background .12s}
.ksp-ls-match:last-child{border-bottom:none}
.ksp-ls-match:hover,.ksp-ls-live{background:rgba(255,59,59,.05)}
.ksp-ls-teams{display:flex;align-items:center;gap:8px;flex:1;min-width:0}
.ksp-ls-team{font-size:.78rem;color:var(--k-ink);flex:1}
.ksp-ls-home{text-align:right}
.ksp-ls-away{text-align:left}
.ksp-ls-score{font-family:var(--k-font-h);font-size:.88rem;font-weight:800;color:var(--k-ink);text-align:center;min-width:50px;white-space:nowrap}
.ksp-ls-meta{font-size:.62rem;text-align:right;flex-shrink:0;min-width:50px}
.ksp-ls-live-badge{background:var(--k-red);color:#fff;font-size:.58rem;font-weight:800;padding:2px 6px;border-radius:3px;letter-spacing:.08em;animation:blink 1.5s infinite}
.ksp-ls-ft{color:var(--k-ink-3);font-size:.65rem;font-weight:700}
.ksp-ls-date{color:var(--k-ink-3);font-size:.65rem}
.ksp-ls-loading,.ksp-ls-empty{padding:16px;text-align:center;color:var(--k-ink-3);font-size:.78rem}
.ksp-ls-empty a{color:var(--k-green)}
@media(max-width:480px){.ksp-ls-match{flex-direction:column;align-items:flex-start;gap:4px}.ksp-ls-teams{width:100%}.ksp-ls-meta{text-align:left}}

/* ================================================================
   SHARE BAR — Centered, premium, fixed colors
   ================================================================ */
/* Override old share btn styles */
.ksp-share-bar-centered .ksp-share-btn,
.ksp-shr-wa, .ksp-shr-x, .ksp-shr-fb, .ksp-shr-rd, .ksp-shr-cp {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  border-radius: 8px;
  font-size: .76rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  border: none;
  transition: all .15s;
  white-space: nowrap;
}
@media(max-width:480px) {
  .ksp-share-btns-centered { justify-content: flex-start; }
  .ksp-shr-wa,.ksp-shr-x,.ksp-shr-fb,.ksp-shr-rd,.ksp-shr-cp { padding:8px 12px; font-size:.72rem; }
}

/* ================================================================
   JOIN WIDGET — Updated CSS with logout link
   ================================================================ */

/* ================================================================
   SIDEBAR — Browse & Download Movies button
   ================================================================ */
.ksb-movies-btn svg { flex-shrink: 0; opacity: .7; }

/* SHARE BAR CENTERED */
.ksp-share-bar-centered{margin:20px 0;padding:18px;background:var(--k-surface2);border:1px solid var(--k-border);border-radius:12px}
.ksp-share-label-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:8px}
.ksp-share-label{font-family:var(--k-font-h);font-size:.8rem;font-weight:800;color:var(--k-ink);text-transform:uppercase;letter-spacing:.06em}
.ksp-share-score-nudge{font-size:.72rem;color:var(--k-green);font-weight:600}
.ksp-share-btns-centered{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.ksp-shr-wa{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:8px;font-size:.76rem;font-weight:700;text-decoration:none;cursor:pointer;border:none;transition:all .15s;white-space:nowrap;background:#25D366;color:#fff}
.ksp-shr-wa:hover{background:#1ebd5a;color:#fff}
.ksp-shr-x{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:8px;font-size:.76rem;font-weight:700;text-decoration:none;cursor:pointer;border:1px solid rgba(255,255,255,.12);transition:all .15s;white-space:nowrap;background:#1a1a1a;color:#fff}
.ksp-shr-x:hover{background:#333;color:#fff}
.ksp-shr-fb{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:8px;font-size:.76rem;font-weight:700;text-decoration:none;cursor:pointer;border:none;transition:all .15s;white-space:nowrap;background:#1877f2;color:#fff}
.ksp-shr-fb:hover{background:#1565c0;color:#fff}
.ksp-shr-rd{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:8px;font-size:.76rem;font-weight:700;text-decoration:none;cursor:pointer;border:none;transition:all .15s;white-space:nowrap;background:#ff4500;color:#fff}
.ksp-shr-rd:hover{background:#e03d00;color:#fff}
.ksp-shr-cp{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:8px;font-size:.76rem;font-weight:700;cursor:pointer;border:1px solid var(--k-border);transition:all .15s;white-space:nowrap;background:var(--k-surface3);color:var(--k-ink-2)}
.ksp-shr-cp:hover{border-color:var(--k-green);color:var(--k-green)}
/* JOIN WIDGET logout link */
.kjw-logout-link{display:block;text-align:center;font-size:.72rem;color:rgba(255,255,255,.35);text-decoration:none;margin-top:10px;transition:color .15s}
.kjw-logout-link:hover{color:var(--k-red)}
/* Browse Movies sidebar btn */
.ksb-movies-btn{display:flex;align-items:center;gap:10px;padding:14px 16px;background:var(--k-surface3);color:var(--k-ink);text-decoration:none;font-size:.85rem;font-weight:700;transition:background .15s}
.ksb-movies-btn:hover{background:var(--k-surface4);color:var(--k-green)}
.ksb-movies-sub{padding:6px 16px 12px;font-size:.65rem;color:var(--k-ink-3)}

/* ── DESKTOP HAMBURGER (3-line menu) ── */
.k-menu-toggle-desktop {
  display: flex;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: 1px solid var(--k-border);
  border-radius: 7px;
  padding: 8px 9px;
  transition: all .15s;
  flex-shrink: 0;
}
.k-menu-toggle-desktop span {
  display: block;
  width: 18px;
  height: 2px;
  background: var(--k-ink-2);
  border-radius: 2px;
  transition: background .15s;
}
.k-menu-toggle-desktop:hover {
  border-color: var(--k-green);
  background: rgba(168,200,70,.06);
}
.k-menu-toggle-desktop:hover span {
  background: var(--k-green);
}
@media(max-width:768px) {
  /* On mobile the regular k-menu-toggle handles this — hide desktop version */
  .k-menu-toggle-desktop { display:none !important; }
}

/* ================================================================
   INFLUENCER / VOTING POOL WIDGET
   ================================================================ */
.kinf-widget{background:var(--k-surface2);border:1px solid var(--k-border);border-radius:12px;padding:14px;overflow:hidden}
.kinf-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.kinf-head-left{display:flex;align-items:center;gap:6px}
.kinf-live-dot{width:7px;height:7px;border-radius:50%;background:var(--k-red);animation:blink 1s infinite;flex-shrink:0}
.kinf-title{font-family:var(--k-font-h);font-size:.82rem;font-weight:800;color:var(--k-ink)}
.kinf-timer{font-size:.65rem;color:var(--k-red);font-weight:700;background:rgba(255,59,59,.1);padding:3px 8px;border-radius:4px}
.kinf-desc{font-size:.72rem;color:var(--k-ink-3);margin:0 0 12px;line-height:1.4}
.kinf-circles{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}
.kinf-circles::-webkit-scrollbar{display:none}
.kinf-circle-btn{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:5px;flex-shrink:0;padding:2px;transition:transform .15s}
.kinf-circle-btn:hover{transform:scale(1.08)}
.kinf-circle-btn.kinf-voted .kinf-ring{box-shadow:0 0 0 3px var(--k-green)}
.kinf-circle-btn.kinf-voting{opacity:.6;pointer-events:none}
/* Ring styles */
.kinf-ring{width:52px;height:52px;border-radius:50%;padding:2px;position:relative;display:flex;align-items:center;justify-content:center}
.kinf-ring-green{background:linear-gradient(135deg,#A8C846,#93B23A)}
.kinf-ring-gold{background:linear-gradient(135deg,var(--k-gold),#d98f12)}
.kinf-ring-verified{background:linear-gradient(135deg,#a78bfa,#ec4899)}
.kinf-ring-fire{background:linear-gradient(135deg,#ff4500,var(--k-red))}
.kinf-ring-blue{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}
.kinf-avatar{width:46px;height:46px;border-radius:50%;background:var(--k-surface3);overflow:hidden;display:flex;align-items:center;justify-content:center}
.kinf-avatar img{width:100%;height:100%;object-fit:cover}
.kinf-initials{font-family:var(--k-font-h);font-size:.8rem;font-weight:800;color:var(--k-ink)}
.kinf-verified-badge{position:absolute;bottom:0;right:0;width:15px;height:15px;background:#3b82f6;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.45rem;color:#fff;font-weight:700;border:1.5px solid var(--k-surface2)}
.kinf-name{font-size:.6rem;color:var(--k-ink-2);font-weight:600;max-width:52px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}
/* Vote bars */
.kinf-bars{margin:12px 0 8px;display:flex;flex-direction:column;gap:7px}
.kinf-bar-row{width:100%}
.kinf-bar-info{display:flex;align-items:center;gap:6px;margin-bottom:3px}
.kinf-bar-rank{font-size:.6rem;font-weight:800;color:var(--k-ink-3);min-width:12px}
.kinf-bar-name{font-size:.72rem;font-weight:700;color:var(--k-ink);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kinf-bar-pct{font-size:.7rem;font-weight:800;color:var(--k-green);min-width:32px;text-align:right}
.kinf-bar-track{height:5px;background:var(--k-surface3);border-radius:3px;overflow:hidden}
.kinf-bar-fill{height:100%;background:rgba(168,200,70,.5);border-radius:3px;transition:width .4s ease}
.kinf-bar-leading{background:var(--k-green)}
.kinf-msg{font-size:.72rem;min-height:16px;font-weight:600;text-align:center;margin:4px 0}
.kinf-footer{display:flex;justify-content:flex-end}
.kinf-total-votes{font-size:.62rem;color:var(--k-ink-3)}

/* ================================================================
   SIDEBAR TOOLS BUTTON
   ================================================================ */
.ksb-tools-btn-wrap{padding:14px}
.ksb-tools-btn{display:block;width:100%;padding:12px 16px;background:transparent;border:2px solid var(--k-red);border-radius:10px;color:var(--k-ink);font-family:var(--k-font-h);font-size:.88rem;font-weight:800;text-align:center;text-decoration:none;cursor:pointer;transition:all .2s;animation:tools-pulse 2.5s ease-in-out infinite;position:relative;overflow:hidden}
.ksb-tools-btn:hover{background:var(--k-red);color:#fff;transform:scale(1.03);box-shadow:0 6px 24px rgba(255,59,59,.35);animation:none}
@keyframes tools-pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,59,59,.4)}50%{box-shadow:0 0 0 8px rgba(255,59,59,0)}}
.ksb-tools-sub{font-size:.68rem;color:var(--k-ink-3);text-align:center;margin-top:6px}

/* ── RECOMMEND WIDGET (sidebar) ── */
.ksb-recommend-widget{display:flex;align-items:center;gap:12px;padding:14px 16px;background:linear-gradient(135deg,rgba(255,59,59,.08),rgba(255,59,59,.04));border:2px solid rgba(255,59,59,.4);border-radius:10px;text-decoration:none;transition:all .2s;animation:tools-pulse 3s ease-in-out infinite}
.ksb-recommend-widget:hover{background:rgba(255,59,59,.15);border-color:var(--k-red);transform:translateY(-1px);box-shadow:0 6px 20px rgba(255,59,59,.2);animation:none}
.ksb-rec-icon{width:38px;height:38px;background:var(--k-red);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}
.ksb-rec-title{font-family:var(--k-font-h);font-size:.9rem;font-weight:800;color:var(--k-ink);margin:0 0 2px}
.ksb-rec-sub{font-size:.68rem;color:var(--k-ink-3)}
.ksb-rec-body{flex:1}
.ksb-rec-arrow{font-size:1.1rem;color:rgba(255,59,59,.6);font-weight:700;flex-shrink:0}

/* ── CHAT ROOM TICKER (sidebar) ── */
.ksct-wrap{background:var(--k-surface2);border:1px solid var(--k-border);border-radius:12px;overflow:hidden;margin-bottom:0}
.ksct-head{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--k-surface3);border-bottom:1px solid var(--k-border)}
.ksct-dot{width:7px;height:7px;border-radius:50%;background:#A8C846;animation:blink 1.2s infinite;flex-shrink:0}
.ksct-label{font-family:var(--k-font-h);font-size:.78rem;font-weight:800;color:var(--k-ink);flex:1}
.ksct-online{font-size:.62rem;color:var(--k-green);font-weight:700;background:rgba(168,200,70,.1);padding:2px 7px;border-radius:10px}
.ksct-ticker{height:100px;overflow:hidden;padding:8px 0;position:relative}
.ksct-ticker::before,.ksct-ticker::after{content:'';position:absolute;left:0;right:0;height:20px;z-index:2;pointer-events:none}
.ksct-ticker::before{top:0;background:linear-gradient(to bottom,var(--k-surface2),transparent)}
.ksct-ticker::after{bottom:36px;background:linear-gradient(to top,var(--k-surface2),transparent)}
.ksct-track{display:flex;flex-direction:column;gap:0;animation:ksct-scroll 20s linear infinite}
.ksct-track:hover{animation-play-state:paused}
@keyframes ksct-scroll{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
.ksct-msg-body{flex:1;min-width:0}
.ksct-msg-name{font-size:.65rem;font-weight:700;color:var(--k-green);margin-bottom:1px}
.ksct-msg-text{font-size:.72rem;color:var(--k-ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
.ksct-join-btn{display:block;width:100%;padding:10px;background:var(--k-green);color:#000;text-align:center;font-family:var(--k-font-h);font-size:.78rem;font-weight:800;border:none;cursor:pointer;text-decoration:none;transition:background .15s}
.ksct-join-btn:hover{background:var(--k-green-d);color:#000}

/* ── QR BARCODE HOMEPAGE ── */
.kqr-hp-wrap{background:var(--k-surface2);border:1px solid rgba(168,200,70,.2);border-radius:14px;padding:20px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin:20px 0 0}
.kqr-hp-qr{flex-shrink:0;text-align:center}
.kqr-hp-qr img{display:block;border:2px solid var(--k-green);border-radius:8px;padding:4px;background:#0d1117}
.kqr-hp-scan{font-size:.55rem;font-weight:800;color:var(--k-green);letter-spacing:.12em;margin-top:5px;text-transform:uppercase}
.kqr-hp-info{flex:1;min-width:180px}
.kqr-hp-name{font-family:var(--k-font-h);font-size:1.1rem;font-weight:800;color:var(--k-ink);margin-bottom:4px}
.kqr-hp-tagline{font-size:.78rem;color:var(--k-ink-3);margin-bottom:10px}
.kqr-hp-platforms{display:flex;gap:6px;align-items:center;margin-bottom:12px}
.kqr-hp-platforms span{font-size:.65rem;font-weight:700;color:var(--k-ink-3);background:var(--k-surface3);padding:3px 8px;border-radius:3px}
.kqr-hp-dot{background:none!important;padding:0!important;color:var(--k-ink-3)!important}
.kqr-hp-btn{background:var(--k-green);color:#000;border:none;border-radius:7px;padding:9px 18px;font-size:.8rem;font-weight:800;cursor:pointer;font-family:var(--k-font-h);transition:all .15s;width:100%}
.kqr-hp-btn:hover{background:var(--k-green-d)}
.kqr-hp-sub-row{display:flex;gap:8px;margin-top:14px;width:100%}
.kqr-hp-email{flex:1;padding:9px 12px;background:var(--k-surface3);border:1px solid var(--k-border);border-radius:7px;color:var(--k-ink);font-size:.82rem;font-family:inherit;outline:none}
.kqr-hp-email:focus{border-color:var(--k-green)}
.kqr-hp-sub-btn{background:var(--k-surface3);border:1px solid var(--k-border);color:var(--k-ink-2);border-radius:7px;padding:9px 14px;font-size:.78rem;font-weight:700;cursor:pointer;transition:all .15s;white-space:nowrap}
.kqr-hp-sub-btn:hover{border-color:var(--k-green);color:var(--k-green)}
@media(max-width:480px){.kqr-hp-wrap{flex-direction:column;align-items:center;text-align:center}.kqr-hp-platforms{justify-content:center}}

/* ── DRAWER SECTION LABELS ── */
.k-mdr-sections{padding:4px 14px 0}
.k-mdr-section-label{font-size:.58rem;font-weight:800;color:var(--k-ink-3);text-transform:uppercase;letter-spacing:.14em}
.k-mdr-music{color:var(--k-green)!important}
.k-mdr-tv{color:var(--k-red)!important}
.k-mdr-profile{color:var(--k-green)!important;font-weight:700!important}

/* ── MOBILE SCROLL & WIDTH FIX ── */
html, body { overflow-x: hidden !important; }
*, *::before, *::after { box-sizing: border-box; }
@media(max-width:768px) {
  .k-container { padding: 0 14px; }
  img, video, iframe { max-width: 100% !important; height: auto; }
  .ksp-layout { display: block !important; }
  .ksp-sidebar { display: none !important; }
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* Prevent content overflow */
  .k-post-content, .ksp-content { word-break: break-word; overflow-wrap: break-word; }
  /* Fix header on mobile */
  .k-header { width: 100%; overflow: hidden; }
  .k-header-row { overflow: visible; }
  /* Prevent horizontal scroll from animations */
  .ksct-track, .kfp-track, .kinf-circles { -webkit-overflow-scrolling: touch; }
}
/* Jobs + Trade pills */
.k-hdr-pill-jobs{background:var(--k-green)!important;color:#000!important;border-color:var(--k-green)!important;font-weight:800!important}
.k-hdr-pill-jobs:hover{background:var(--k-green-d)!important;color:#000!important}
.k-hdr-pill-trade{background:transparent!important;border-color:var(--k-gold)!important;color:var(--k-gold)!important;font-weight:700!important}
.k-hdr-pill-trade:hover{background:rgba(245,197,24,.1)!important}
.k-mdr-jobs{color:var(--k-green)!important;font-weight:800!important}
.k-mdr-trade{color:var(--k-gold)!important}

/* ══════════════════════════════════════════════════════
   SIDEBAR SCROLLBAR FIX
   Remove the overflow that hides sidebar content
══════════════════════════════════════════════════════ */
.k-sidebar {
  overflow: visible !important;
  overflow-y: visible !important;
  max-height: none !important;
}
.k-post-sidebar {
  overflow: visible !important;
  max-height: none !important;
}
/* Make sticky sidebar NOT have overflow restriction */
.k-post-sidebar, .ksp-sidebar {
  overflow: unset !important;
}

/* ══════════════════════════════════════════════════════
   HOMEPAGE GRID CARDS — Smaller, premium, readable
══════════════════════════════════════════════════════ */
/* Latest news first grid — compact */
.klp-card-cat {
  font-size: .58rem !important;
  font-weight: 700 !important;
  letter-spacing: .07em !important;
  padding: 2px 6px !important;
}
.klp-card-excerpt {
  font-size: .72rem !important;
  line-height: 1.45 !important;
  -webkit-line-clamp: 2 !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
/* k-card global */
.k-card-title, .k-card-title a {
  font-size: .82rem !important;
  font-weight: 700 !important;
  line-height: 1.28 !important;
  letter-spacing: -.01em !important;
}
.k-card-cat  { font-size: .57rem !important; padding: 2px 5px !important; }

/* ══════════════════════════════════════════════════════
   SINGLE POST READER — Readable typography
══════════════════════════════════════════════════════ */
.ksp-content {
  font-size: .9rem !important;
  line-height: 1.8 !important;
  color: var(--k-ink-2) !important;
  letter-spacing: .005em !important;
}
.ksp-content h2 {
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  margin: 1.4em 0 .5em !important;
  line-height: 1.2 !important;
}
.ksp-author { font-size: .72rem !important; }
.ksp-date   { font-size: .68rem !important; }

/* ══════════════════════════════════════════════════════
   AFRICA 50 CHART — Matching Image 1
══════════════════════════════════════════════════════ */
.kch-wrap { background: var(--k-surface); border: 1px solid var(--k-border); border-radius: 12px; overflow: hidden; margin: 0 0 28px; }
.kch-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--k-border); }
.kch-headline { display: flex; align-items: baseline; gap: 8px; }
.kch-headline h2 { font-family: var(--k-font-h); font-size: 1.15rem; font-weight: 900; color: var(--k-ink); letter-spacing: -.03em; }
.kch-headline em { font-style: normal; color: var(--k-ink-3); font-size: 1.5rem; font-weight: 300; }
.kch-sub { font-size: .67rem; color: var(--k-ink-3); margin-left: 4px; }
.kch-link { font-size: .68rem; font-weight: 700; color: var(--k-green); text-decoration: none; text-transform: uppercase; letter-spacing: .08em; }
.kch-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--k-border); }
.kch-row { display: flex; align-items: center; gap: 10px; padding: 11px 16px; border-bottom: 1px solid var(--k-border); transition: background .12s; cursor: pointer; }
.kch-row:hover { background: var(--k-surface2); }
.kch-row:nth-child(odd) { border-right: 1px solid var(--k-border); }
.kch-rk { font-family: var(--k-font-h); font-size: .8rem; font-weight: 900; color: var(--k-ink-3); width: 22px; flex-shrink: 0; font-style: italic; }
.kch-rk.kch-top { color: var(--k-green); }
.kch-cv { width: 36px; height: 36px; border-radius: 6px; flex-shrink: 0; position: relative; overflow: hidden; }
.kch-cv img { width: 100%; height: 100%; object-fit: cover; }
.kch-cv-ph { width: 100%; height: 100%; border-radius: 6px; }
.kch-info { flex: 1; min-width: 0; }
.kch-t { font-family: var(--k-font-h); font-size: .78rem; font-weight: 700; color: var(--k-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kch-a { font-size: .65rem; color: var(--k-ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kch-mv { font-size: .62rem; font-weight: 700; width: 36px; flex-shrink: 0; text-align: right; }
.kch-mv.kch-up   { color: var(--k-green); }
.kch-mv.kch-down { color: var(--k-red); }
.kch-mv.kch-new  { background: var(--k-green); color: #000; padding: 1px 5px; border-radius: 3px; font-size: .58rem; }
.kch-mv.kch-flat { color: var(--k-ink-3); }
.kch-play { width: 28px; height: 28px; border-radius: 50%; background: var(--k-surface2); border: 1px solid var(--k-border); color: var(--k-ink-2); flex-shrink: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all .15s; }
.kch-play:hover { background: var(--k-green); color: #000; border-color: var(--k-green); }
@media(max-width:640px) { .kch-grid { grid-template-columns: 1fr; } .kch-row:nth-child(odd) { border-right: none; } }

/* ══════════════════════════════════════════════════════
   DAILY POLL WIDGET — Matching Image 2
══════════════════════════════════════════════════════ */
.kdp-wrap { padding: 0; }
.kdp-label { display: flex; align-items: center; gap: 6px; font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: var(--k-green); margin-bottom: 10px; }
.kdp-label::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--k-green); flex-shrink: 0; }
.kdp-question { font-family: var(--k-font-h); font-size: .9rem; font-weight: 800; color: var(--k-ink); line-height: 1.3; margin-bottom: 12px; letter-spacing: -.02em; }
.kdp-options { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.kdp-opt { position: relative; cursor: pointer; border-radius: 6px; overflow: hidden; background: var(--k-surface2); border: 1px solid var(--k-border); transition: border-color .15s; }
.kdp-opt:hover { border-color: var(--k-green); }
.kdp-opt.kdp-voted { border-color: var(--k-green); }
.kdp-bar { position: absolute; inset: 0; height: 100%; background: rgba(var(--k-green-rgb,168,200,70),.12); transform-origin: left; transition: width .5s ease; border-radius: 6px; }
.kdp-opt-inner { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; padding: 8px 11px; }
.kdp-opt-label { font-family: var(--k-font-h); font-size: .78rem; font-weight: 700; color: var(--k-ink); }
.kdp-opt-pct { font-size: .72rem; font-weight: 800; color: var(--k-green); }
.kdp-meta { font-size: .65rem; color: var(--k-ink-3); }

/* ══════════════════════════════════════════════════════
   ARTIST OF THE WEEK WIDGET — Matching Image 2
══════════════════════════════════════════════════════ */
.kaw-label { display: flex; align-items: center; gap: 6px; font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: var(--k-green); margin-bottom: 12px; }
.kaw-label::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--k-green); flex-shrink: 0; }
.kaw-list { display: flex; flex-direction: column; gap: 0; }
.kaw-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--k-border); }
.kaw-row:last-child { border-bottom: none; padding-bottom: 0; }
.kaw-av { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--k-font-h); font-size: .82rem; font-weight: 800; color: #000; flex-shrink: 0; }
.kaw-info { flex: 1; min-width: 0; }
.kaw-name { font-family: var(--k-font-h); font-size: .82rem; font-weight: 700; color: var(--k-ink); }
.kaw-votes { font-size: .65rem; color: var(--k-ink-3); }
.kaw-vote-btn { background: var(--k-surface2); border: 1px solid var(--k-border); border-radius: 20px; padding: 5px 12px; font-size: .68rem; font-weight: 700; color: var(--k-ink-2); cursor: pointer; transition: all .15s; white-space: nowrap; display: flex; align-items: center; gap: 4px; }
.kaw-vote-btn:hover { background: var(--k-green); color: #000; border-color: var(--k-green); }
.kaw-vote-btn.kaw-voted { background: var(--k-green); color: #000; border-color: var(--k-green); }

/* ══════════════════════════════════════════════════════
   LIVE ROOMS SECTION — Matching Image 4
══════════════════════════════════════════════════════ */
.klr-wrap { border: 1px solid var(--k-border); border-radius: 12px; overflow: hidden; margin-bottom: 28px; }
.klr-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid var(--k-border); }
.klr-headline { display: flex; align-items: baseline; gap: 8px; }
.klr-headline h2 { font-family: var(--k-font-h); font-size: 1.15rem; font-weight: 900; color: var(--k-ink); letter-spacing: -.03em; }
.klr-headline em { font-style: italic; color: var(--k-ink-3); font-weight: 400; }
.klr-sub { font-size: .67rem; color: var(--k-ink-3); }
.klr-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.klr-room { padding: 14px 16px; border-bottom: 1px solid var(--k-border); border-right: 1px solid var(--k-border); cursor: pointer; transition: background .12s; }
.klr-room:hover { background: var(--k-surface2); }
.klr-room:nth-child(3n) { border-right: none; }
.klr-room:nth-last-child(-n+3) { border-bottom: none; }
.klr-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; }
.klr-status { font-size: .58rem; font-weight: 800; letter-spacing: .08em; padding: 2px 7px; border-radius: 3px; text-transform: uppercase; }
.klr-status.klr-live { background: var(--k-red); color: #fff; }
.klr-status.klr-sch  { background: var(--k-surface3); color: var(--k-ink-3); font-size: .56rem; }
.klr-host { font-size: .63rem; color: var(--k-ink-3); }
.klr-title { font-family: var(--k-font-h); font-size: .8rem; font-weight: 700; color: var(--k-ink); line-height: 1.3; margin-bottom: 8px; }
.klr-foot { display: flex; align-items: center; justify-content: space-between; }
.klr-avs { display: flex; }
.klr-av { width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid var(--k-surface); margin-right: -6px; font-family: var(--k-font-h); font-size: .58rem; font-weight: 700; color: #000; display: flex; align-items: center; justify-content: center; }
.klr-cnt { font-size: .65rem; color: var(--k-ink-3); margin-left: 12px; }
.klr-tag { font-size: .57rem; font-weight: 800; letter-spacing: .07em; color: var(--k-ink-3); background: var(--k-surface2); padding: 2px 6px; border-radius: 3px; }
.klr-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--k-border); }
.klr-btn-s { background: transparent; border: 1px solid var(--k-border); color: var(--k-ink-2); padding: 7px 14px; border-radius: 20px; font-size: .75rem; font-weight: 600; cursor: pointer; transition: all .15s; }
.klr-btn-s:hover { border-color: var(--k-ink-2); color: var(--k-ink); }
.klr-btn-p { background: var(--k-green); color: #000; padding: 7px 16px; border-radius: 20px; font-size: .75rem; font-weight: 700; cursor: pointer; border: none; transition: all .15s; }
.klr-btn-p:hover { background: var(--k-green-d, #9EE000); }
@media(max-width:680px) {
  .klr-grid { grid-template-columns: repeat(2,1fr); }
  .klr-room { border-right: 1px solid var(--k-border); padding: 10px 11px; }
  .klr-room:nth-child(2n) { border-right: none; }
  .klr-status { font-size: .5rem; padding: 2px 5px; }
  .klr-host { font-size: .56rem; }
  .klr-title { font-size: .68rem; margin-bottom: 5px; }
  .klr-av { width: 16px; height: 16px; font-size: .48rem; }
  .klr-cnt { font-size: .54rem; margin-left: 8px; }
  .klr-tag { font-size: .5rem; }
  .klr-actions { padding: 9px 11px; gap: 6px; }
  .klr-btn-s, .klr-btn-p { padding: 6px 11px; font-size: .64rem; }
}

/* ═══════════════════════════════════════════════════════════════
   UNIFIED PREMIUM GRID + CARD SYSTEM
   One consistent visual language across homepage, archive, search,
   category sections, TV page — small, dense, premium fonts.
═══════════════════════════════════════════════════════════════ */


/* ── Unify .k-card and .klp-card to the exact same visual language ── */
.k-card, .klp-card {
  background: var(--k-surface);
  border: 1px solid var(--k-border);
  border-radius: 9px;
  overflow: hidden;
  display: block;
  text-decoration: none;
  transition: all .18s ease;
}
.k-card:hover, .klp-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(0,0,0,.55);
  border-color: rgba(var(--k-green-rgb,168,200,70),.25);
}
.k-card-thumb, .klp-card-img {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: var(--k-surface3);
  display: block;
}
.k-card-thumb img, .klp-card-img img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .4s ease; display: block;
}
.k-card:hover .k-card-thumb img, .klp-card:hover .klp-card-img img { transform: scale(1.05); }

.k-card-body, .klp-card-body {
  padding: 9px 10px 10px !important;
}
.k-card-cat, .klp-card-cat {
  font-size: .56rem !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase;
  color: var(--k-ink-3);
  margin-bottom: 4px;
  display: inline-block;
}
.klp-card-cat {
  position: absolute; bottom: 7px; left: 7px;
  background: var(--k-green); color: #000;
  padding: 2px 6px; border-radius: 3px; margin-bottom: 0;
}
.k-card-title, .klp-card-title {
  font-family: var(--k-font-h) !important;
  font-size: .78rem !important;
  font-weight: 700 !important;
  line-height: 1.28 !important;
  letter-spacing: -.01em !important;
  color: var(--k-ink) !important;
  margin: 0 0 5px !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.k-card:hover .k-card-title, .klp-card:hover .klp-card-title { color: var(--k-green) !important; }
.k-card-meta, .klp-card-meta {
  font-size: .6rem !important;
  color: var(--k-ink-3) !important;
  display: flex; gap: 5px; align-items: center; flex-wrap: wrap;
}

/* ── Trending Now: convert list rows into a clean compact grid ── */
.klp-list-view {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 10px !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
}
.klp-list-item {
  display: flex !important;
  align-items: center;
  gap: 9px;
  padding: 8px !important;
  border: 1px solid var(--k-border) !important;
  border-bottom: 1px solid var(--k-border) !important;
  border-radius: 8px;
  background: var(--k-surface);
  transition: all .15s;
}
.klp-list-title {
  font-size: .73rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  white-space: normal !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.klp-list-icon { flex-shrink: 0; }
@media (max-width: 860px) { .klp-list-view { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 480px) { .klp-list-view { grid-template-columns: 1fr !important; } }

/* ── Hero / banner slider — smaller, premium ── */
.k-hero-main h2 {
  font-size: clamp(1rem, 2vw, 1.25rem) !important;
  line-height: 1.2 !important;
}
.klp-hero-cat, .k-hero-cat {
  font-size: .54rem !important;
  padding: 2px 7px !important;
}
.klp-hero-meta, .k-hero-sm-ov h3 {
  font-size: .66rem !important;
}
.klp-side-cat { font-size: .54rem !important; }
.klp-side-time { font-size: .6rem !important; }

/* ── Section headers — small, premium, consistent everywhere ── */
.klp-sec-title, .k-sec-title {
  font-size: .92rem !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
}
.klp-sec-more, .k-sec-more {
  font-size: .68rem !important;
  font-weight: 700 !important;
}

/* ── Archive / search page heading ── */
.k-display { font-size: clamp(1.1rem, 2.5vw, 1.6rem) !important; font-weight: 800 !important; letter-spacing: -.02em !important; }

/* ── News ticker ── */
.klp-ticker-inner a, .klp-ticker-track a { font-size: .73rem !important; }
.klp-ticker-label { font-size: .6rem !important; }

/* ── Editor's picks / influencer card variants share same system ── */
.k-card-h .k-card-title { font-size: .74rem !important; }
.k-card-featured .k-card-title { font-size: 1rem !important; -webkit-line-clamp: 3; }

/* ── Container tightening already applied via --k-max-w, reinforce padding consistency ── */
.k-container { padding: 0 20px !important; }
@media (max-width: 640px) { .k-container { padding: 0 14px !important; } }

/* ═══════════════════════════════════════════════════════════════
   LIVE ROOM MODAL
═══════════════════════════════════════════════════════════════ */
.klr-modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.75);
  z-index: 9999; display: flex; align-items: center; justify-content: center;
  opacity: 0; visibility: hidden; transition: opacity .2s ease;
  padding: 20px;
}
.klr-modal-overlay.klr-modal-active { opacity: 1; visibility: visible; }
.klr-modal {
  background: var(--k-surface2); border: 1px solid var(--k-border);
  border-radius: 16px; padding: 26px; max-width: 440px; width: 100%;
  position: relative; transform: scale(.95); transition: transform .2s ease;
}
.klr-modal-overlay.klr-modal-active .klr-modal { transform: scale(1); }
.klr-modal-close {
  position: absolute; top: 14px; right: 14px; background: var(--k-surface3);
  border: none; color: var(--k-ink-3); width: 28px; height: 28px; border-radius: 50%;
  font-size: 1.1rem; cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.klr-modal-close:hover { background: var(--k-red); color: #fff; }
.klr-modal-top { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.klr-modal-title { font-family: var(--k-font-h); font-size: 1.1rem; font-weight: 800; color: var(--k-ink); margin: 0 0 6px; line-height: 1.3; }
.klr-modal-host { font-size: .76rem; color: var(--k-green); font-weight: 600; margin-bottom: 14px; }
.klr-modal-desc { font-size: .82rem; color: var(--k-ink-2); line-height: 1.6; margin: 0 0 14px; }
.klr-modal-sched { font-size: .78rem; color: var(--k-ink-3); background: var(--k-surface3); padding: 9px 12px; border-radius: 8px; margin-bottom: 14px; }
.klr-modal-stats { font-size: .74rem; color: var(--k-ink-3); margin-bottom: 16px; }
.klr-modal-join {
  width: 100%; padding: 12px; background: var(--k-green); color: #000; border: none;
  border-radius: 9px; font-family: var(--k-font-h); font-size: .88rem; font-weight: 800;
  cursor: pointer; transition: all .15s;
}
.klr-modal-join:hover { background: var(--k-green-d); }

/* ═══════════════════════════════════════════════════════════════
   MUSIC CHART MODAL
═══════════════════════════════════════════════════════════════ */
.kch-modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.8);
  z-index: 9999; display: flex; align-items: center; justify-content: center;
  opacity: 0; visibility: hidden; transition: opacity .2s ease;
  padding: 20px;
}
.kch-modal-overlay.kch-modal-active { opacity: 1; visibility: visible; }
.kch-modal {
  background: var(--k-surface2); border: 1px solid var(--k-border);
  border-radius: 16px; overflow: hidden; max-width: 460px; width: 100%;
  position: relative; transform: scale(.95); transition: transform .2s ease;
}
.kch-modal-overlay.kch-modal-active .kch-modal { transform: scale(1); }
.kch-modal-close {
  position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,.55);
  border: none; color: #fff; width: 30px; height: 30px; border-radius: 50%;
  font-size: 1.1rem; cursor: pointer; display: flex; align-items: center; justify-content: center;
  z-index: 2; transition: all .15s;
}
.kch-modal-close:hover { background: var(--k-red); }
.kch-modal-player { width: 100%; aspect-ratio: 16/9; background: #000; display: none; }
.kch-modal-player iframe { width: 100%; height: 100%; border: none; display: block; }
.kch-modal-body { padding: 20px; }
.kch-modal-rank { font-size: .68rem; font-weight: 800; color: var(--k-green); text-transform: uppercase; letter-spacing: .07em; margin-bottom: 8px; }
.kch-modal-title { font-family: var(--k-font-h); font-size: 1.15rem; font-weight: 800; color: var(--k-ink); margin: 0 0 5px; line-height: 1.3; }
.kch-modal-artist { font-size: .85rem; color: var(--k-ink-2); margin-bottom: 6px; }
.kch-modal-genre { font-size: .7rem; color: var(--k-ink-3); background: var(--k-surface3); display: inline-block; padding: 3px 10px; border-radius: 20px; margin-bottom: 16px; }
.kch-modal-listen {
  display: inline-flex; align-items: center; justify-content: center; width: 100%;
  padding: 11px; background: var(--k-green); color: #000; border-radius: 9px;
  font-family: var(--k-font-h); font-size: .85rem; font-weight: 800; text-decoration: none;
  transition: all .15s;
}
.kch-modal-listen:hover { background: var(--k-green-d); }

@media (max-width: 480px) {
  .klr-modal, .kch-modal { max-width: 100%; }
  .klr-modal { padding: 16px; border-radius: 12px; }
  .klr-modal-close, .kch-modal-close { width: 24px; height: 24px; font-size: .92rem; top: 10px; right: 10px; }
  .klr-modal-title { font-size: .92rem; margin-bottom: 4px; }
  .klr-modal-host { font-size: .68rem; margin-bottom: 11px; }
  .klr-modal-desc { font-size: .74rem; margin-bottom: 11px; }
  .klr-modal-sched, .klr-modal-stats { font-size: .68rem; padding: 7px 10px; margin-bottom: 11px; }
  .klr-modal-join { padding: 10px; font-size: .78rem; }
  .kch-modal { border-radius: 12px; }
  .kch-modal-close { background: rgba(0,0,0,.6); }
  .kch-modal-body { padding: 14px; }
  .kch-modal-rank { font-size: .6rem; margin-bottom: 5px; }
  .kch-modal-title { font-size: .96rem; }
  .kch-modal-artist { font-size: .74rem; }
  .kch-modal-genre { font-size: .62rem; padding: 2px 8px; margin-bottom: 11px; }
  .kch-modal-listen { padding: 9px; font-size: .76rem; }
}

/* ═══════════════════════════════════════════════════════════════
   PREMIUM CATEGORY / ARCHIVE HEADER
═══════════════════════════════════════════════════════════════ */
.k-cat-header {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 26px; padding-bottom: 20px;
  border-bottom: 1px solid var(--k-border);
}
.k-cat-header-icon {
  font-size: 1.8rem; flex-shrink: 0; line-height: 1;
  width: 52px; height: 52px; background: var(--k-surface2);
  border: 1px solid var(--k-border); border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
}
.k-cat-header-title {
  font-family: var(--k-font-h); font-size: clamp(1.1rem,2.5vw,1.6rem);
  font-weight: 900; color: var(--k-ink); margin: 0 0 5px;
  letter-spacing: -.025em; line-height: 1.15;
}
.k-cat-header-meta {
  font-size: .72rem; color: var(--k-ink-3);
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
}
.k-cat-header-dot {
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--k-ink-3); flex-shrink: 0;
}

/* ── Pagination ── */
.nav-links { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 28px; }
.page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 34px; height: 34px; padding: 0 10px;
  background: var(--k-surface2); border: 1px solid var(--k-border);
  border-radius: 7px; font-size: .78rem; font-weight: 600;
  color: var(--k-ink-2); text-decoration: none; transition: all .15s;
}
.page-numbers:hover, .page-numbers.current {
  background: var(--k-green); border-color: var(--k-green); color: #000;
}
.page-numbers.dots { background: transparent; border-color: transparent; }

/* ═══════════════════════════════════════════════════════════════
   MUSIC PAGE
═══════════════════════════════════════════════════════════════ */
.k-music-hero {
  background: linear-gradient(180deg, var(--k-surface2), var(--k-bg));
  border-bottom: 1px solid var(--k-border);
}
.k-music-hero-title {
  font-family: var(--k-font-h);
  font-size: clamp(1.2rem, 3vw, 1.7rem);
  font-weight: 800;
  color: var(--k-ink);
  margin: 0 0 8px;
  letter-spacing: -.02em;
  line-height: 1.15;
}
.k-music-cta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 36px;
}
.k-music-cta-card {
  background: var(--k-surface2);
  border: 1px solid var(--k-border);
  border-radius: 14px;
  padding: 22px;
}
.k-music-cta-btn {
  display: inline-block;
  padding: 10px 22px;
  background: var(--k-green);
  color: #000;
  border-radius: 100px;
  font-weight: 700;
  font-size: .8rem;
  text-decoration: none;
  font-family: var(--k-font-h);
  transition: all .15s;
}
.k-music-cta-btn:hover { background: var(--k-green-d); }
.k-music-cta-btn-o {
  background: transparent;
  border: 1.5px solid var(--k-green);
  color: var(--k-green);
}
.k-music-cta-btn-o:hover { background: var(--k-green); color: #000; }
@media (max-width: 640px) {
  .k-music-cta-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════
   404 PAGE — premium, tightened fonts, button class fixed
   (.k-btn-orange was previously referenced but never defined —
   the "Back to Kilode" button rendered with zero styling)
═══════════════════════════════════════════════════════════════ */
.k-404-wrap {
  padding: 56px 20px; text-align: center; min-height: 56vh;
  display: flex; align-items: center; justify-content: center; flex-direction: column;
}
.k-404-emoji { font-size: 3.2rem; margin-bottom: 10px; line-height: 1; }
.k-404-num {
  font-family: var(--k-font-h); font-size: clamp(1.8rem, 5vw, 2.6rem);
  font-weight: 900; color: var(--k-green); letter-spacing: -.03em; line-height: 1;
  margin: 0 0 4px;
}
.k-404-sub {
  font-family: var(--k-font-h); font-size: clamp(1rem, 2.5vw, 1.25rem);
  font-weight: 700; color: var(--k-ink); margin: 0 0 10px;
}
.k-404-desc {
  font-size: .82rem; color: var(--k-ink-3); max-width: 380px; line-height: 1.55;
  margin: 0 0 20px;
}
.k-404-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 22px; background: var(--k-green); color: #000;
  border-radius: 100px; font-family: var(--k-font-h); font-weight: 700;
  font-size: .82rem; text-decoration: none; transition: all .15s;
}
.k-404-btn:hover { background: var(--k-green-d); transform: translateY(-1px); }
.k-404-latest { margin-top: 36px; width: 100%; max-width: 800px; }
.k-404-latest-title {
  font-family: var(--k-font-h); font-size: .92rem; font-weight: 800;
  color: var(--k-ink); margin: 0 0 14px; text-align: left;
}

/* ═══════════════════════════════════════════════════════════════
   TIP JAR — auto-injected after single post content
   (previously had ZERO CSS — rendered as unstyled raw HTML)
═══════════════════════════════════════════════════════════════ */
.k-tip-jar {
  margin: 32px 0 0; background: var(--k-surface2); border: 1px solid var(--k-border);
  border-radius: 14px; overflow: hidden;
}
.k-tip-inner { padding: 20px; }
.k-tip-icon { font-size: 1.6rem; display: block; margin-bottom: 8px; }
.k-tip-text h4 {
  font-family: var(--k-font-h); font-size: .95rem; font-weight: 800;
  color: var(--k-ink); margin: 0 0 5px;
}
.k-tip-text p { font-size: .8rem; color: var(--k-ink-3); margin: 0 0 16px; line-height: 1.5; }
.k-tip-amounts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 10px; }
.k-tip-btn {
  position: relative; padding: 11px 6px; background: var(--k-surface3);
  border: 1.5px solid var(--k-border); border-radius: 9px;
  font-family: var(--k-font-h); font-size: .76rem; font-weight: 700;
  color: var(--k-ink); cursor: pointer; transition: all .15s;
}
.k-tip-btn:hover { border-color: var(--k-green); color: var(--k-green); }
.k-tip-btn.popular { border-color: var(--k-green); }
.k-tip-btn[disabled] { opacity: .6; cursor: wait; }
.k-tip-popular-badge {
  position: absolute; top: -8px; left: 50%; transform: translateX(-50%);
  background: var(--k-green); color: #000; font-size: .54rem; font-weight: 800;
  padding: 1px 7px; border-radius: 20px; white-space: nowrap;
}
.k-tip-custom { display: flex; gap: 8px; }
.k-tip-custom input {
  flex: 1; padding: 10px 12px; background: var(--k-surface3);
  border: 1px solid var(--k-border); border-radius: 9px; color: var(--k-ink);
  font-size: .82rem; outline: none; transition: border-color .15s;
}
.k-tip-custom input:focus { border-color: var(--k-green); }
.k-tip-custom-btn {
  padding: 10px 16px; background: var(--k-green); color: #000; border: none;
  border-radius: 9px; font-family: var(--k-font-h); font-size: .78rem;
  font-weight: 700; cursor: pointer; white-space: nowrap; transition: all .15s;
}
.k-tip-custom-btn:hover { background: var(--k-green-d); }
.k-tip-custom-btn[disabled] { opacity: .6; cursor: wait; }
.k-tip-status { padding: 0 20px; font-size: .78rem; font-weight: 600; min-height: 0; }
.k-tip-status:not(:empty) { padding: 12px 20px; border-top: 1px solid var(--k-border); }
.k-tip-status.k-tip-ok { color: var(--k-green); }
.k-tip-status.k-tip-err { color: var(--k-red); }
@media (max-width: 480px) {
  .k-tip-amounts { grid-template-columns: repeat(2, 1fr); }
  .k-tip-custom { flex-direction: column; }
}


/* ═══════════════════════════════════════════════════════════════
   HOMEPAGE AD BANNER — between category sections (like LegitNG)
═══════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════
   HOMEPAGE SOCIALS PREVIEW — feed from Kilode Socials page
═══════════════════════════════════════════════════════════════ */

@keyframes khs-pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(.8)} }








/* ═══════════════════════════════════════════════════════════════
   PREMIUM TINY LOAD MORE — chevron pill, used under every category
   grid (homepage sections + latest news). Single source of truth —
   .k-load-more-tiny is the only definition; do not duplicate.
═══════════════════════════════════════════════════════════════ */
.k-load-more-right { text-align: right !important; margin: 8px 0 0 !important; }
.k-load-more-tiny {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  padding: 5px 8px 5px 14px !important; font-size: .66rem !important; font-weight: 700 !important;
  font-family: var(--k-font-b) !important; letter-spacing: .02em !important;
  color: var(--k-green) !important; background: transparent !important;
  border: 1px solid rgba(var(--k-green-rgb,168,200,70),.3) !important;
  border-radius: 100px !important; cursor: pointer !important; transition: var(--k-trans) !important;
}
.k-load-more-tiny:hover {
  background: rgba(var(--k-green-rgb,168,200,70),.08) !important;
  border-color: var(--k-green) !important;
  transform: translateY(-1px);
}
.k-load-more-tiny[disabled] { opacity: .55 !important; cursor: wait !important; transform:none; }
.k-lm-chevron {
  width: 18px; height: 18px; flex-shrink: 0; border-radius: 50%;
  background: rgba(var(--k-green-rgb,168,200,70),.14);
  display: flex; align-items: center; justify-content: center;
  transition: transform .3s var(--k-ease), background .15s;
}
.k-load-more-tiny:hover .k-lm-chevron { background: var(--k-green); }
.k-load-more-tiny:hover .k-lm-chevron svg { stroke: #000; }
.k-lm-chevron svg { width: 9px; height: 9px; stroke: var(--k-green); stroke-width: 2.6;
  fill: none; stroke-linecap: round; stroke-linejoin: round; transition: stroke .15s; }
.k-load-more-tiny.is-loading .k-lm-chevron { animation: k-lm-spin .7s linear infinite; }
.k-load-more-tiny.is-open .k-lm-chevron { transform: rotate(180deg); }
@keyframes k-lm-spin { to { transform: rotate(360deg); } }

/* ═══════════════════════════════════════════════════════════════
   HOMEPAGE AD BANNER — between category sections (LegitNG-style)
═══════════════════════════════════════════════════════════════ */
.k-homepage-ad-banner { margin: 12px 0; text-align: center; }
.k-homepage-ad-banner .klp-ad-slot { display: inline-block; max-width: 100%; border-radius: 8px; overflow: hidden; }

/* ═══════════════════════════════════════════════════════════════
   HOMEPAGE SOCIALS PREVIEW — live gist feed widget
═══════════════════════════════════════════════════════════════ */
.khs-wrap { background: var(--k-surface2); border: 1px solid var(--k-border); border-radius: 14px; overflow: hidden; margin-bottom: 28px; }
.khs-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--k-border); }
.khs-headline { display: flex; align-items: center; gap: 10px; }
.khs-headline h2 { font-family: var(--k-font-h); font-size: .96rem; font-weight: 900; color: var(--k-ink); margin: 0; letter-spacing: -.02em; }
.khs-live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--k-green); flex-shrink: 0; animation: khs-pulse 2s infinite; }
@keyframes khs-pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(.8)} }
.khs-link { font-size: .68rem; font-weight: 700; color: var(--k-green); text-decoration: none; text-transform: uppercase; letter-spacing: .07em; }
.khs-feed { display: grid; grid-template-columns: repeat(3, 1fr); }
.khs-item { padding: 13px 16px; border-right: 1px solid var(--k-border); border-bottom: 1px solid var(--k-border); transition: background .12s; }
.khs-item:nth-child(3n) { border-right: none; }
.khs-item:nth-last-child(-n+3) { border-bottom: none; }
.khs-item:hover { background: var(--k-surface3); }
.khs-item-top { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.khs-av { width: 28px; height: 28px; border-radius: 50%; font-family: var(--k-font-h); font-size: .65rem; font-weight: 800; color: #000; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.khs-user { font-size: .72rem; font-weight: 700; color: var(--k-ink); }
.khs-time { font-size: .62rem; color: var(--k-ink-3); }
.khs-group-badge { font-size: .58rem; font-weight: 700; padding: 1px 6px; border-radius: 3px; background: var(--k-surface3); color: var(--k-ink-3); text-transform: uppercase; letter-spacing: .06em; margin-left: auto; flex-shrink: 0; }
.khs-msg { font-size: .78rem; color: var(--k-ink-2); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.khs-foot { padding: 11px 18px; border-top: 1px solid var(--k-border); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.khs-stat { font-size: .72rem; color: var(--k-ink-3); }
.khs-stat strong { color: var(--k-ink); }
.khs-join-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; background: var(--k-green); color: #000; border-radius: 100px; font-family: var(--k-font-h); font-size: .76rem; font-weight: 700; text-decoration: none; transition: all .15s; }
.khs-join-btn:hover { background: var(--k-green-d); }
@media(max-width:680px) {
  .khs-wrap { border-radius: 12px; }
  .khs-head { padding: 10px 13px; }
  .khs-headline h2 { font-size: .8rem; }
  .khs-link { font-size: .58rem; }
  .khs-feed { grid-template-columns: repeat(2,1fr); }
  .khs-item { border-right: 1px solid var(--k-border); padding: 9px 10px; }
  .khs-item:nth-child(2n) { border-right: none; }
  .khs-item:nth-last-child(-n+3) { border-bottom: 1px solid var(--k-border); }
  .khs-item:nth-last-child(-n+2) { border-bottom: none; }
  .khs-av { width: 22px; height: 22px; font-size: .54rem; }
  .khs-user { font-size: .62rem; }
  .khs-time { font-size: .54rem; }
  .khs-group-badge { font-size: .5rem; padding: 1px 5px; }
  .khs-msg { font-size: .66rem; -webkit-line-clamp: 2; }
  .khs-foot { padding: 9px 13px; }
  .khs-stat { font-size: .6rem; }
  .khs-join-btn { padding: 6px 12px; font-size: .66rem; }
}

/* ═══════════════════════════════════════════════════════════════
   HOMEPAGE — UNIFIED PREMIUM VISUAL SYSTEM
   Category grids (Crime, Nollywood, South Africa, Romance, etc.)
   now match Latest Posts exactly: same card, same grid, same fonts.
   Old .k-poster-card and .k-poster-grid styles replaced.
═══════════════════════════════════════════════════════════════ */

/* Section spacing — consistent premium breathing room */
.k-section { margin: 32px 0; }
.k-section:first-child { margin-top: 0; }

/* Section header — tight, premium, editorial */
.k-sec-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  margin-bottom: 14px; gap: 12px;
}
.k-sec-title {
  font-family: var(--k-font-h);
  font-size: .92rem !important;
  font-weight: 800 !important;
  letter-spacing: -.015em !important;
  color: var(--k-ink);
  margin: 0;
  line-height: 1.2;
}
.k-sec-sub {
  font-size: .66rem !important;
  color: var(--k-ink-3);
  margin-top: 2px;
}
.k-sec-more {
  font-size: .68rem !important;
  font-weight: 700 !important;
  color: var(--k-green);
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
}
.k-sec-more:hover { text-decoration: underline; }

/* Homepage ad slot — premium styled, not raw */
.klp-ad-slot {
  background: var(--k-surface2);
  border: 1px dashed var(--k-border);
  border-radius: 8px;
  padding: 4px;
  text-align: center;
  overflow: hidden;
}
.klp-ad-slot:empty { display: none; }
.klp-ad-slot img, .klp-ad-slot a img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 6px;
}

/* ── Article card — the definitive, single set of rules ─────── */
/* (These override everything else; !important used deliberately) */
.k-card {
  background: var(--k-surface) !important;
  border: 1px solid var(--k-border) !important;
  border-radius: 10px !important;
  overflow: hidden;
  display: block;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  position: relative;
}
.k-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.6) !important;
  border-color: rgba(var(--k-green-rgb,168,200,70),.3) !important;
}
.k-card-thumb {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: var(--k-surface3);
  display: block;
}
.k-card-thumb img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform .4s ease;
}
.k-card:hover .k-card-thumb img { transform: scale(1.06); }
.k-card-no-img .k-card-thumb {
  background: linear-gradient(135deg, var(--k-surface3) 0%, var(--k-surface2) 100%);
  display: flex; align-items: center; justify-content: center;
}
.k-card-body { padding: 9px 11px 11px !important; }
.k-card-cat {
  font-size: .57rem !important;
  font-weight: 800 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase;
  color: var(--k-green);
  display: block;
  margin-bottom: 4px;
}
.k-card-title {
  font-family: var(--k-font-h) !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em !important;
  color: var(--k-ink) !important;
  margin: 0 0 6px !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.k-card-title a { color: inherit !important; text-decoration: none; }
.k-card:hover .k-card-title { color: var(--k-green) !important; }
.k-card-meta {
  font-size: .62rem !important;
  color: var(--k-ink-3) !important;
  display: flex; gap: 5px; align-items: center; flex-wrap: wrap;
}
.k-card-meta-dot {
  width: 2px; height: 2px; border-radius: 50%;
  background: var(--k-ink-3); flex-shrink: 0; display: inline-block;
}

/* klp-card mirrors k-card exactly — keep in sync */
.klp-card {
  background: var(--k-surface) !important;
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-r) !important;
  overflow: hidden; display: block; text-decoration: none;
  transition: var(--k-trans);
}
.klp-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--k-sh) !important;
  border-color: rgba(var(--k-green-rgb,168,200,70),.3) !important;
}
.klp-card-img {
  position: relative; aspect-ratio: 16/9;
  overflow: hidden; background: var(--k-surface3); display: block;
}
.klp-card-img img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .35s ease;
}
.klp-card:hover .klp-card-img img { transform: scale(1.05); }
.klp-card-body { padding: 8px 9px 9px !important; }
.klp-card-cat {
  font-size: .55rem !important; font-weight: 800 !important;
  letter-spacing: .07em !important; text-transform: uppercase;
  display: block; margin-bottom: 3px;
}
.klp-card-title {
  font-family: var(--k-font-h) !important;
  font-size: .77rem !important; font-weight: 700 !important;
  line-height: 1.28 !important; letter-spacing: -.01em !important;
  color: var(--k-ink) !important; margin: 0 0 5px !important;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.klp-card:hover .klp-card-title { color: var(--k-green) !important; }
.klp-card-meta { font-size: .58rem !important; color: var(--k-ink-3) !important; }

/* ── 6-column grid — final canonical definition ─────────────── */
.k-grid { display: grid; gap: 9px; }
.k-grid-6, .klp-grid-6 { grid-template-columns: repeat(6, 1fr); }
@media(max-width:1200px) { .k-grid-6, .klp-grid-6 { grid-template-columns: repeat(5,1fr); } }
@media(max-width:1024px) { .k-grid-6, .klp-grid-6 { grid-template-columns: repeat(4,1fr); } }
@media(max-width:860px)  { .k-grid-6, .klp-grid-6 { grid-template-columns: repeat(3,1fr); } }
@media(max-width:640px)  { .k-grid-6, .klp-grid-6 { grid-template-columns: repeat(2,1fr); gap:8px; } }
@media(max-width:380px)  { .k-grid-6, .klp-grid-6 { grid-template-columns: 1fr; gap:8px; } }

/* ── Trending Now — horizontal scrollable chip list on mobile ── */
.klp-list-view {
  display: grid !important;
  grid-template-columns: repeat(3,1fr) !important;
  gap: 10px !important;
}
.klp-list-item {
  display: flex !important; align-items: center; gap: 9px;
  padding: 8px !important; border: 1px solid var(--k-border) !important;
  border-radius: 8px; background: var(--k-surface); transition: all .15s;
  text-decoration: none;
}
.klp-list-item:hover { border-color: rgba(var(--k-green-rgb,168,200,70),.3); transform: translateY(-1px); }
.klp-list-thumb { width: 50px !important; height: 38px !important; border-radius: 5px; flex-shrink: 0; object-fit: cover; }
.klp-list-title { font-size: .74rem !important; font-weight: 700 !important; line-height: 1.25 !important; color: var(--k-ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.klp-list-cat { font-size: .56rem !important; color: var(--k-green); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
@media(max-width:860px) { .klp-list-view { grid-template-columns: repeat(2,1fr) !important; } }
@media(max-width:480px) { .klp-list-view { grid-template-columns: 1fr !important; } }

/* ── Hero slider — tightened premium typography ─────────────── */
.klp-hero-title { font-size: clamp(.95rem,2.2vw,1.3rem) !important; font-weight: 800 !important; line-height: 1.18 !important; letter-spacing: -.025em !important; }
.klp-slide-title { font-size: clamp(.88rem,1.8vw,1.1rem) !important; line-height: 1.2 !important; }
.k-hero-main h2, .klp-hero-main h2 { font-size: clamp(.95rem,2vw,1.25rem) !important; font-weight: 800 !important; line-height: 1.2 !important; }
.klp-hero-cat, .k-hero-cat, .klp-hero-category { font-size: .54rem !important; padding: 2px 7px !important; font-weight: 800 !important; letter-spacing: .07em !important; }
.klp-hero-meta, .klp-slide-meta { font-size: .64rem !important; }
.klp-side-title { font-size: .76rem !important; font-weight: 700 !important; line-height: 1.27 !important; }
.klp-side-meta { font-size: .6rem !important; }

/* ── Single post reader — premium readability ───────────────── */
.ksp-content { font-family: var(--k-font-b) !important; font-size: .9rem !important; line-height: 1.82 !important; color: var(--k-ink-2) !important; }
.ksp-content p { font-size: .9rem !important; line-height: 1.82 !important; margin-bottom: 1.15em !important; }
.ksp-content h2 { font-size: 1.05rem !important; font-weight: 800 !important; margin: 1.5em 0 .5em !important; }
.ksp-content h3 { font-size: .95rem !important; font-weight: 700 !important; margin: 1.2em 0 .4em !important; }
.ksp-title { font-size: clamp(1.1rem,3vw,1.55rem) !important; font-weight: 800 !important; line-height: 1.15 !important; letter-spacing: -.025em !important; }

/* ── Sidebar — no overflow/scrollbar ───────────────────────── */
.k-sidebar, .ksp-sidebar, .k-post-sidebar { overflow: visible !important; max-height: none !important; }
.k-sidebar-widget { margin-bottom: 14px; }

/* ═══════════════════════════════════════════════════════════════
   BREAKING NEWS TICKER — horizontal scrolling headline bar
   (LegitNG-style, between topbar and main header)
═══════════════════════════════════════════════════════════════ */
.k-ticker-bar {
  background: var(--k-surface2);
  border-bottom: 1px solid var(--k-border);
  height: 34px; overflow: hidden;
}
.k-ticker-inner {
  display: flex; align-items: center; height: 34px; gap: 0;
}
.k-ticker-label {
  font-size: .6rem; font-weight: 800; text-transform: uppercase;
  letter-spacing: .08em; color: #000; background: var(--k-green);
  padding: 3px 10px; white-space: nowrap; flex-shrink: 0;
  height: 100%; display: flex; align-items: center;
}
.k-ticker-track-wrap {
  flex: 1; overflow: hidden; position: relative; height: 100%;
  mask-image: linear-gradient(to right, transparent 0, #000 2%, #000 98%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 2%, #000 98%, transparent 100%);
}
.k-ticker-track {
  display: flex; align-items: center; height: 100%;
  white-space: nowrap; position: absolute; top: 0; left: 0;
}
.k-ticker-item {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .72rem; font-weight: 600; color: var(--k-ink-2);
  text-decoration: none; padding: 0 22px; transition: color .15s;
  white-space: nowrap; flex-shrink: 0;
}
.k-ticker-item:hover { color: var(--k-green); }
.k-ticker-dot { color: var(--k-green); font-size: .5rem; flex-shrink: 0; }
.k-ticker-stop {
  background: none; border: none; color: var(--k-ink-3);
  font-size: .72rem; cursor: pointer; padding: 0 10px;
  flex-shrink: 0; transition: color .15s;
}
.k-ticker-stop:hover { color: var(--k-green); }

/* ═══════════════════════════════════════════════════════════════
   MOST READ WIDGET — sidebar ranked list (LegitNG-style)
═══════════════════════════════════════════════════════════════ */



.k-mr-rank {
  font-family: var(--k-font-h); font-size: .8rem; font-weight: 900;
  color: var(--k-ink-3); width: 22px; flex-shrink: 0;
  font-style: italic; line-height: 1;
}





/* ═══════════════════════════════════════════════════════════════
   SOCIAL FOLLOW COUNTER WIDGET
═══════════════════════════════════════════════════════════════ */
.k-follow-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
}
.k-follow-item {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 14px; text-decoration: none;
  border-bottom: 1px solid var(--k-border);
  border-right: 1px solid var(--k-border);
  transition: background .15s;
}
.k-follow-item:nth-child(2n) { border-right: none; }
.k-follow-item:nth-last-child(-n+2) { border-bottom: none; }
.k-follow-item:hover { background: var(--k-surface3); }
.k-follow-icon {
  width: 34px; height: 34px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; color: #fff;
}
.k-follow-info { min-width: 0; }
.k-follow-count {
  font-family: var(--k-font-h); font-size: .88rem;
  font-weight: 800; color: var(--k-ink); line-height: 1;
}
.k-follow-label {
  font-size: .6rem; color: var(--k-ink-3);
  text-transform: uppercase; letter-spacing: .05em; margin-top: 2px;
}

/* ═══════════════════════════════════════════════════════════════
   MOST READ WIDGET
═══════════════════════════════════════════════════════════════ */
.k-mr-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-bottom: 1px solid var(--k-border);
  text-decoration: none; transition: background .12s;
}
.k-mr-item:last-child { border-bottom: none; }
.k-mr-item:hover { background: var(--k-surface3); }
.k-mr-rank {
  font-family: var(--k-font-h); font-size: .8rem; font-weight: 900;
  color: var(--k-ink-3); width: 22px; flex-shrink: 0; font-style: italic;
}
.k-mr-rank-top { color: var(--k-green); }
.k-mr-thumb {
  width: 48px; height: 36px; border-radius: 5px;
  overflow: hidden; flex-shrink: 0; background: var(--k-surface3);
}
.k-mr-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.k-mr-info { flex: 1; min-width: 0; }
.k-mr-cat {
  font-size: .57rem; font-weight: 800; color: var(--k-green);
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: 2px;
}
.k-mr-title {
  font-family: var(--k-font-h); font-size: .76rem; font-weight: 700;
  color: var(--k-ink); line-height: 1.28;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.k-mr-views { font-size: .62rem; color: var(--k-ink-3); margin-top: 2px; }

/* ═══════════════════════════════════════════════════════════════
   SIDEBAR — clean unified widget system
   All widgets use the same card surface, header, and body rhythm.
═══════════════════════════════════════════════════════════════ */

/* Widget card surface */
.k-sb-card {
  background: var(--k-surface);
  border: 1px solid var(--k-border);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 14px;
}

/* Widget card header — title bar */
.k-sb-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--k-border);
}
.k-sb-live-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--k-green); flex-shrink: 0;
  animation: khs-pulse 2s infinite;
}
.k-sb-see-all {
  font-size: .62rem; font-weight: 700; color: var(--k-green);
  text-decoration: none; margin-left: auto; white-space: nowrap;
}
.k-sb-see-all:hover { text-decoration: underline; }

/* Newsletter subtitle */
.k-sb-nl-sub {
  font-size: .72rem; color: var(--k-ink-3);
  margin-bottom: 10px; line-height: 1.4;
}

/* Sidebar widget title — consistent across all widgets */
.k-widget-title {
  font-family: var(--k-font-h) !important;
  font-size: .78rem !important;
  font-weight: 800 !important;
  color: var(--k-ink) !important;
  letter-spacing: -.01em !important;
  margin-bottom: 11px;
  display: block;
}

/* Just Dropped item */
.k-jd-item {
  display: flex; align-items: center; gap: 9px;
  padding: 9px 13px; border-bottom: 1px solid var(--k-border);
  transition: background .12s;
}
.k-jd-item:last-child { border-bottom: none; }
.k-jd-item:hover { background: var(--k-surface2); }
.k-jd-thumb {
  width: 52px; height: 38px; border-radius: 5px;
  overflow: hidden; flex-shrink: 0; background: var(--k-surface3);
}
.k-jd-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.k-jd-body { flex: 1; min-width: 0; }
.k-jd-title {
  font-family: var(--k-font-h); font-size: .76rem; font-weight: 700;
  color: var(--k-ink); line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
  margin-bottom: 3px;
}
.k-jd-meta { font-size: .6rem; color: var(--k-ink-3); }

/* Kilode Socials ticker inside sidebar */
.ksct-ticker {
  overflow: hidden;
  height: 180px;
  position: relative;
}
.ksct-track {
  display: flex;
  flex-direction: column;
  animation: ksct-scroll linear infinite;
  animation-duration: 24s; /* overridden by JS */
}
@keyframes ksct-scroll {
  0%   { transform: translateY(0); }
  100% { transform: translateY(-50%); }
}
.ksct-msg {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 8px 13px; border-bottom: 1px solid var(--k-border);
  flex-shrink: 0;
}
.ksct-av {
  width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0;
  font-size: .6rem; font-weight: 800; color: #000;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--k-font-h);
}
.ksct-body { flex: 1; min-width: 0; }
.ksct-name { font-size: .66rem; font-weight: 700; color: var(--k-ink); display: block; }
.ksct-text {
  font-size: .7rem; color: var(--k-ink-3); display: block;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ── MOBILE SIDEBAR: hidden below 1024px (full-width content only) ── */
@media (max-width: 1023px) {
  .k-sidebar, .ksp-sidebar { display: none !important; }
  .k-primary, .ksp-main    { max-width: 100% !important; width: 100% !important; }
  .k-grid-layout            { grid-template-columns: 1fr !important; }
}

/* ── GLOBAL FONT — mobile reading comfort ── */
body {
  font-family: var(--k-font-b);
  font-size: 15px;
  line-height: 1.68;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
@media (max-width: 640px) {
  body { font-size: 14px; }
  .k-card-title { font-size: .78rem !important; }
  .k-card-meta  { font-size: .6rem !important; }
}

/* ══════════════════════════════════════════════════════════════
   SESSION 2 — AUTHORITATIVE MOBILE MINIMALISM PASS
   Appended last on purpose: at equal specificity, source order
   wins, so these rules are the final word on small-viewport sizing
   across every template that shares these classes (header, hero,
   card grids, lists, tickers, sections). Keeps mobile tiny, dense,
   and legible instead of just a shrunk desktop layout.
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Header / logo */
  .k-logo-img { width:32px !important; height:32px !important; }
  .k-header-row { padding:7px 0 !important; gap:8px !important; }
  .k-hdr-pill { padding:5px 9px !important; font-size:.62rem !important; }
  .k-cattab { padding:8px 9px !important; font-size:.66rem !important; }

  /* Ticker */
  .klp-ticker { height:32px !important; margin:8px 0 !important; }
  .klp-ticker-label { font-size:.56rem !important; padding:0 10px !important; }
  .klp-ticker-inner a { font-size:.68rem !important; padding:0 14px !important; }

  /* Social bar */
  .klp-social-bar { padding:7px 0 !important; }
  .klp-sb-btn { padding:6px 10px !important; }
  .klp-sb-btn div span { font-size:.56rem !important; }
  .klp-sb-btn div strong { font-size:.72rem !important; }

  /* Slider */
  .klp-slider-wrap { margin:10px 0 !important; border-radius:8px !important; }
  .klp-slider { height:190px !important; }
  .klp-slide-info { padding:12px 14px !important; }
  .klp-slide-cat { font-size:.54rem !important; padding:2px 6px !important; margin-bottom:5px !important; }
  .klp-slide-title { font-size:.92rem !important; margin:0 0 4px !important; }
  .klp-slide-artist { font-size:.66rem !important; }

  /* Hero grid */
  .klp-hero-grid { gap:8px !important; margin:8px 0 !important; }
  .klp-hero-main { border-radius:8px !important; }
  .klp-hero-body { padding:12px !important; }
  .klp-hero-cat, .k-hero-cat { font-size:.5rem !important; padding:2px 6px !important; margin-bottom:5px !important; }
  .klp-hero-title { font-size:.92rem !important; line-height:1.2 !important; margin:0 0 5px !important; }
  .klp-hero-meta { font-size:.6rem !important; }
  .klp-hero-side { gap:7px !important; }
  .klp-side-item { padding:7px !important; gap:8px !important; border-radius:6px !important; }
  .klp-side-img { width:60px !important; height:44px !important; border-radius:5px !important; }
  .klp-side-title { font-size:.7rem !important; line-height:1.25 !important; }
  .klp-side-cat { font-size:.5rem !important; margin-bottom:3px !important; }
  .klp-side-time { font-size:.58rem !important; }

  /* Section rhythm */
  .klp-section { margin:18px 0 !important; }
  .klp-sec-head, .k-sec-head { margin-bottom:9px !important; padding-bottom:7px !important; }
  .klp-sec-title, .k-sec-title { font-size:.82rem !important; }
  .klp-sec-line { width:26px !important; height:2px !important; }
  .klp-sec-more, .k-sec-more { font-size:.64rem !important; padding:4px 10px !important; }

  /* Card grids — dense 4-up on mobile (matches PC's 6-up spirit), tiny premium type */
  .k-grid, .klp-grid { gap:6px !important; }
  .k-grid-6, .klp-grid-6,
  .klp-grid-3, .klp-grid-4 { grid-template-columns:repeat(4,1fr) !important; }
  .klp-grid-2 { grid-template-columns:repeat(2,1fr) !important; }
  .klp-card-body { padding:5px 6px 6px !important; }
  .klp-card-cat { font-size:.44rem !important; padding:2px 4px !important; margin-bottom:2px !important; letter-spacing:.04em !important; }
  .klp-card-title { font-size:.6rem !important; line-height:1.22 !important; margin:0 0 3px !important; font-weight:700 !important; }
  .klp-card-meta { font-size:.46rem !important; gap:3px !important; }

  /* Poster grids — 4-up on mobile too */
  .k-poster-grid, .k-poster-grid-6 { gap:6px !important; grid-template-columns:repeat(4,1fr) !important; }

  /* List views */
  .klp-list-item { padding:8px 9px !important; gap:8px !important; }
  .klp-list-thumb { width:42px !important; height:32px !important; }
  .klp-list-title { font-size:.68rem !important; }
  .klp-list-cat { font-size:.52rem !important; }

  /* Load more / buttons */
  .klp-load-more, .k-load-more-btn { padding:8px 20px !important; font-size:.74rem !important; }

  /* QR / install strip */
  .kqr-hp-qr img { width:64px !important; height:64px !important; }
  .kqr-hp-name { font-size:.85rem !important; }
  .kqr-hp-tagline { font-size:.68rem !important; }

  .k-container { padding:0 12px !important; }
}

@media (max-width: 420px) {
  /* Very small phones: stay at 4 columns per spec, drop only gap/padding further
     so it doesn't feel cramped — going below 4 would break the "PC and mobile
     both show 4" requirement */
  .k-grid-6, .klp-grid-6,
  .klp-grid-3, .klp-grid-4,
  .k-poster-grid, .k-poster-grid-6 { grid-template-columns:repeat(4,1fr) !important; gap:5px !important; }
  .klp-grid-2 { grid-template-columns:repeat(2,1fr) !important; }
  .klp-card-body { padding:4px 5px 5px !important; }
  .klp-card-cat { font-size:.42rem !important; }
  .klp-card-title { font-size:.56rem !important; line-height:1.2 !important; }
  .klp-card-meta { font-size:.44rem !important; }
  .klp-hero-side { flex-direction:column !important; }
}

/* ── Footer + registration banner density (was reflow-only, no shrink) ── */
@media (max-width: 768px) {
  .kf-reg-banner { padding:22px 0 !important; }
  .kf-reg-badge { font-size:.56rem !important; padding:2px 8px !important; }
  .kf-reg-title { font-size:1.05rem !important; }
  .kf-reg-sub { font-size:.7rem !important; }
  .kf-reg-stats { gap:14px !important; }
  .kf-reg-stat-n { font-size:1.05rem !important; }
  .kf-reg-stat-l { font-size:.52rem !important; }
  .kf-reg-btn, .kf-reg-btn-secondary { padding:9px 16px !important; font-size:.74rem !important; }
  .kf-reg-av { width:22px !important; height:22px !important; font-size:.58rem !important; }

  .kf-nl-bar { padding:14px 0 !important; }
  .kf-nl-text strong { font-size:.82rem !important; }
  .kf-nl-text span { font-size:.66rem !important; }
  .kf-nl-form input[type="email"] { padding:8px 12px !important; font-size:.76rem !important; }
  .kf-nl-form button { padding:8px 15px !important; font-size:.74rem !important; }

  .kf-footer { padding:24px 0 14px !important; }
  .kf-top { gap:16px !important; margin-bottom:18px !important; }
  .kf-logo-icon { width:26px !important; height:26px !important; font-size:.82rem !important; }
  .kf-logo-text { font-size:.92rem !important; }
  .kf-desc { font-size:.66rem !important; margin-bottom:11px !important; }
  .kf-soc-icon { width:30px !important; height:30px !important; }
  .kf-soc-icon svg { width:14px !important; height:14px !important; }
  .kf-col-title { font-size:.6rem !important; margin-bottom:9px !important; }
  .kf-col-links { gap:7px !important; }
  .kf-col-links a { font-size:.68rem !important; }
  .kf-bottom { padding-top:14px !important; gap:6px !important; }
  .kf-bottom-left, .kf-bottom-right a { font-size:.6rem !important; }

  .kf-visitor-counter { max-width:100% !important; padding:7px 10px !important; }
}

/* ═══════════════════════════════════════════════════════════════
   SOCIALS DM MODAL — paid direct-message unlock (was entirely
   unstyled; kilode_render_socials_page() renders this live on the
   Socials page, so this needed a real, complete, on-brand build)
═══════════════════════════════════════════════════════════════ */
.ks-dm-modal {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.75); display: flex;
  align-items: center; justify-content: center; padding: 20px;
}
.ks-dm-inner {
  background: var(--k-surface2); border: 1px solid var(--k-border);
  border-radius: 14px; max-width: 380px; width: 100%;
  overflow: hidden; animation: ks-dm-in .18s var(--k-ease);
}
@keyframes ks-dm-in { from { opacity:0; transform:scale(.96); } to { opacity:1; transform:scale(1); } }
.ks-dm-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid var(--k-border);
  background: rgba(168,200,70,.06);
}
.ks-dm-title { font-family: var(--k-font-h); font-size: .88rem; font-weight: 800; color: var(--k-ink); }
.ks-dm-close {
  width: 26px; height: 26px; border-radius: 50%; border: none;
  background: var(--k-surface3); color: var(--k-ink-3); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: .9rem; transition: var(--k-trans);
}
.ks-dm-close:hover { background: var(--k-red); color: #fff; }
.ks-dm-body { padding: 18px 16px 16px; }
.ks-dm-desc { font-size: .78rem; color: var(--k-ink-2); line-height: 1.6; margin: 0 0 12px; }
.ks-dm-desc strong { color: var(--k-green); }
.ks-dm-status { font-size: .72rem; color: var(--k-red); min-height: 16px; margin-bottom: 8px; font-weight: 600; }
.ks-dm-pay-btn {
  width: 100%; padding: 12px; background: var(--k-green); color: #000;
  border: none; border-radius: 9px; font-family: var(--k-font-h);
  font-size: .84rem; font-weight: 800; cursor: pointer; transition: var(--k-trans);
}
.ks-dm-pay-btn:hover { background: var(--k-green-d); transform: translateY(-1px); }
.ks-dm-pay-btn:disabled { opacity: .5; cursor: wait; transform: none; }
.ks-dm-note { font-size: .64rem; color: var(--k-ink-3); text-align: center; margin: 10px 0 0; }

@media (max-width: 480px) {
  .ks-dm-inner { border-radius: 12px; }
  .ks-dm-head { padding: 11px 13px; }
  .ks-dm-title { font-size: .8rem; }
  .ks-dm-close { width: 23px; height: 23px; font-size: .8rem; }
  .ks-dm-body { padding: 14px 13px 13px; }
  .ks-dm-desc { font-size: .72rem; margin-bottom: 10px; }
  .ks-dm-pay-btn { padding: 10px; font-size: .78rem; }
  .ks-dm-note { font-size: .6rem; }
}

/* ═══════════════════════════════════════════════════════════════
   KILODE FORUM — homepage preview box, sidebar mini-widget, and
   full forum page (categories / topic list / thread view)
═══════════════════════════════════════════════════════════════ */

/* ── Homepage preview ("long box") ── */
.kf-fp {
  background: var(--k-surface2); border: 1px solid var(--k-border);
  border-radius: var(--k-r-lg); overflow: hidden;
}
.kf-fp-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--k-border);
  background: rgba(168,200,70,.05);
}
.kf-fp-head-l { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.kf-fp-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--k-green);
  animation: kpulse 2s ease-in-out infinite; flex-shrink: 0; }
.kf-fp-title { font-family: var(--k-font-h); font-size: .92rem; font-weight: 800; color: var(--k-ink); }
.kf-fp-stat { font-family: var(--k-font-b); font-size: .64rem; color: var(--k-ink-3);
  background: var(--k-surface3); padding: 2px 8px; border-radius: 20px; }

.kf-fp-body { display: grid; grid-template-columns: 220px 1fr; }
.kf-fp-cats {
  border-right: 1px solid var(--k-border); padding: 8px;
  display: flex; flex-direction: column; gap: 2px;
}
.kf-fp-cat {
  display: flex; align-items: center; gap: 8px; padding: 8px 9px;
  border-radius: 8px; text-decoration: none; transition: var(--k-trans);
}
.kf-fp-cat:hover { background: var(--k-surface3); }
.kf-fp-cat-icon { font-size: .82rem; flex-shrink: 0; }
.kf-fp-cat-name { flex: 1; font-size: .72rem; font-weight: 600; color: var(--k-ink-2); }
.kf-fp-cat-count { font-size: .6rem; color: var(--k-ink-3); font-family: var(--k-font-b); }

.kf-fp-topics { padding: 6px 0; }
.kf-fp-topic {
  display: flex; align-items: center; gap: 10px; padding: 9px 14px;
  text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.04);
  transition: background .15s;
}
.kf-fp-topic:last-child { border-bottom: none; }
.kf-fp-topic:hover { background: rgba(255,255,255,.03); }
.kf-fp-topic-av {
  width: 28px; height: 28px; border-radius: 50%; background: var(--k-surface3);
  color: var(--k-green); font-size: .7rem; font-weight: 800; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-family: var(--k-font-h);
}
.kf-fp-topic-body { flex: 1; min-width: 0; }
.kf-fp-topic-title {
  font-size: .78rem; font-weight: 700; color: var(--k-ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.kf-fp-topic-meta {
  display: flex; align-items: center; gap: 5px; margin-top: 2px;
  font-size: .62rem; color: var(--k-ink-3); font-family: var(--k-font-b);
}
.kf-fp-dot-sep { width: 2px; height: 2px; border-radius: 50%; background: var(--k-ink-3); flex-shrink: 0; }
.kf-fp-topic-replies {
  font-size: .68rem; font-weight: 800; color: var(--k-green); text-align: right; flex-shrink: 0;
}
.kf-fp-topic-replies span { display: block; font-size: .52rem; color: var(--k-ink-3); font-weight: 500; }
.kf-fp-empty { padding: 24px; text-align: center; font-size: .78rem; color: var(--k-ink-3); }

.kf-fp-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 16px; border-top: 1px solid var(--k-border); flex-wrap: wrap;
}
.kf-fp-join {
  display: inline-flex; align-items: center; padding: 8px 18px;
  background: var(--k-green); color: #000; border-radius: 100px;
  font-family: var(--k-font-h); font-size: .76rem; font-weight: 800;
  text-decoration: none; transition: var(--k-trans);
}
.kf-fp-join:hover { background: var(--k-green-d); transform: translateY(-1px); }
.kf-fp-foot-note { font-size: .62rem; color: var(--k-ink-3); }

/* ── Sidebar mini-widget ── */
.kf-sb-list { padding: 4px 0; }
.kf-sb-item {
  display: flex; align-items: center; gap: 8px; padding: 7px 14px;
  text-decoration: none; transition: background .15s;
}
.kf-sb-item:hover { background: rgba(255,255,255,.03); }
.kf-sb-icon { font-size: .76rem; flex-shrink: 0; }
.kf-sb-name { flex: 1; font-size: .68rem; font-weight: 600; color: var(--k-ink-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kf-sb-count { font-size: .58rem; color: var(--k-ink-3); font-family: var(--k-font-b); }
.kf-sb-join {
  display: block; margin: 8px 12px 12px; padding: 9px; text-align: center;
  background: var(--k-green); color: #000; border-radius: 8px;
  font-family: var(--k-font-h); font-size: .72rem; font-weight: 800; text-decoration: none;
  transition: var(--k-trans);
}
.kf-sb-join:hover { background: var(--k-green-d); }

/* ── Full forum page ── */
.kf-page-head { margin-bottom: 14px; }
.kf-page-title { font-family: var(--k-font-h); font-size: 1.3rem; font-weight: 800; color: var(--k-ink); }
.kf-page-sub { font-size: .78rem; color: var(--k-ink-3); margin-top: 4px; }
.kf-page-cats { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.kf-page-cat-pill {
  padding: 6px 13px; border-radius: 100px; border: 1px solid var(--k-border-2);
  font-size: .7rem; font-weight: 700; color: var(--k-ink-2); text-decoration: none;
  transition: var(--k-trans); font-family: var(--k-font-b);
}
.kf-page-cat-pill:hover { border-color: var(--k-green); color: var(--k-green); }
.kf-page-cat-pill.active { background: var(--k-green); color: #000; border-color: var(--k-green); }

.kf-page-topics { background: var(--k-surface2); border: 1px solid var(--k-border); border-radius: var(--k-r-lg); overflow: hidden; margin-top: 14px; }
.kf-page-topic { padding: 12px 16px; }
.kf-pin { margin-right: 4px; }
.kf-empty { padding: 40px 20px; text-align: center; font-size: .82rem; color: var(--k-ink-3); }

/* New topic / reply forms — shared */
.kf-new-topic, .kf-reply-box {
  background: var(--k-surface2); border: 1px solid var(--k-border); border-radius: var(--k-r-lg);
  padding: 14px; margin: 14px 0; display: flex; flex-direction: column; gap: 9px;
}
.kf-reply-input {
  width: 100%; background: var(--k-surface3); border: 1px solid var(--k-border-2);
  border-radius: 9px; padding: 10px 12px; color: var(--k-ink); font-family: var(--k-font-b);
  font-size: .8rem; outline: none; transition: var(--k-trans); resize: vertical; min-height: 42px;
}
textarea.kf-reply-input { min-height: 90px; }
.kf-reply-input:focus { border-color: var(--k-green); }
.kf-reply-btn {
  align-self: flex-start; padding: 10px 22px; background: var(--k-green); color: #000;
  border: none; border-radius: 100px; font-family: var(--k-font-h); font-size: .8rem;
  font-weight: 800; cursor: pointer; transition: var(--k-trans);
}
.kf-reply-btn:hover { background: var(--k-green-d); transform: translateY(-1px); }
.kf-reply-btn:disabled { opacity: .5; cursor: wait; transform: none; }
.kf-reply-status { font-size: .7rem; color: var(--k-red); min-height: 14px; }
.kf-join-cta { text-align: center; padding: 24px; background: var(--k-surface2);
  border: 1px solid var(--k-border); border-radius: var(--k-r-lg); margin: 14px 0; }

/* Thread view */
.kf-back {
  display: inline-flex; align-items: center; gap: 4px; font-size: .74rem; font-weight: 700;
  color: var(--k-ink-3); text-decoration: none; margin-bottom: 14px; transition: color .15s;
}
.kf-back:hover { color: var(--k-green); }
.kf-thread-op {
  display: flex; gap: 12px; background: var(--k-surface2); border: 1px solid var(--k-border);
  border-radius: var(--k-r-lg); padding: 16px;
}
.kf-thread-op-av {
  width: 40px; height: 40px; border-radius: 50%; background: var(--k-surface3); color: var(--k-green);
  font-size: 1rem; font-weight: 800; flex-shrink: 0; display: flex; align-items: center;
  justify-content: center; font-family: var(--k-font-h);
}
.kf-thread-op-body { flex: 1; min-width: 0; }
.kf-thread-title { font-family: var(--k-font-h); font-size: 1.08rem; font-weight: 800; color: var(--k-ink); margin-bottom: 5px; }
.kf-thread-meta { display: flex; align-items: center; gap: 6px; font-size: .68rem; color: var(--k-ink-3); font-family: var(--k-font-b); margin-bottom: 10px; }
.kf-thread-text { font-size: .84rem; color: var(--k-ink-2); line-height: 1.7; white-space: pre-wrap; }

.kf-fr-list { margin-top: 14px; display: flex; flex-direction: column; gap: 10px; }
.kf-fr-reply {
  display: flex; gap: 10px; background: var(--k-surface2); border: 1px solid var(--k-border);
  border-radius: 12px; padding: 12px 14px;
}
.kf-fr-av {
  width: 30px; height: 30px; border-radius: 50%; background: var(--k-surface3); color: var(--k-green);
  font-size: .7rem; font-weight: 800; flex-shrink: 0; display: flex; align-items: center;
  justify-content: center; font-family: var(--k-font-h);
}
.kf-fr-body { flex: 1; min-width: 0; }
.kf-fr-name { font-size: .72rem; font-weight: 700; color: var(--k-ink); margin-bottom: 3px; }
.kf-fr-text { font-size: .78rem; color: var(--k-ink-2); line-height: 1.6; }

/* ── Mobile density ── */
@media (max-width: 768px) {
  .kf-fp-head { padding: 10px 12px; }
  .kf-fp-title { font-size: .82rem; }
  .kf-fp-stat { font-size: .58rem; padding: 2px 6px; }
  .kf-fp-body { grid-template-columns: 1fr; }
  .kf-fp-cats {
    border-right: none; border-bottom: 1px solid var(--k-border);
    flex-direction: row; overflow-x: auto; padding: 8px 10px; gap: 4px;
  }
  .kf-fp-cat { flex-direction: column; gap: 3px; padding: 7px 10px; min-width: 64px; text-align: center; }
  .kf-fp-cat-name { font-size: .58rem; white-space: nowrap; }
  .kf-fp-cat-count { display: none; }
  .kf-fp-topic { padding: 8px 12px; gap: 8px; }
  .kf-fp-topic:nth-child(n+4) { display: none; } /* cap at 3 rows on mobile — keeps the box short */
  .kf-fp-topic-av { width: 24px; height: 24px; font-size: .6rem; }
  .kf-fp-topic-title { font-size: .7rem; }
  .kf-fp-topic-meta { font-size: .56rem; }
  .kf-fp-topic-replies { font-size: .6rem; }
  .kf-fp-foot { padding: 10px 12px; }
  .kf-fp-join { padding: 7px 15px; font-size: .7rem; }
  .kf-fp-foot-note { font-size: .56rem; }

  .kf-page-title { font-size: 1.05rem; }
  .kf-page-cat-pill { padding: 5px 11px; font-size: .64rem; }
  .kf-new-topic, .kf-reply-box { padding: 11px; }
  .kf-reply-input { font-size: .76rem; padding: 8px 10px; }
  .kf-reply-btn { padding: 9px 18px; font-size: .74rem; }
  .kf-thread-op { padding: 12px; gap: 9px; }
  .kf-thread-op-av { width: 32px; height: 32px; font-size: .84rem; }
  .kf-thread-title { font-size: .92rem; }
  .kf-thread-text { font-size: .76rem; }
  .kf-fr-reply { padding: 10px 11px; gap: 8px; }
  .kf-fr-av { width: 26px; height: 26px; font-size: .62rem; }
}

/* ═══════════════════════════════════════════════════════════════
   KILODE ADS — self-serve marketplace page
═══════════════════════════════════════════════════════════════ */
.ka-wrap { padding: 24px 20px 48px; max-width: 900px; margin: 0 auto; }
.ka-head { margin-bottom: 20px; }
.ka-title { font-family: var(--k-font-h); font-size: 1.35rem; font-weight: 800; color: var(--k-ink); }
.ka-sub { font-size: .82rem; color: var(--k-ink-3); margin-top: 5px; }
.ka-section-title { font-family: var(--k-font-h); font-size: .96rem; font-weight: 800; color: var(--k-ink); margin: 22px 0 12px; }

/* My campaigns */
.ka-camp-list { display: flex; flex-direction: column; gap: 8px; }
.ka-camp-card {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: var(--k-surface2); border: 1px solid var(--k-border); border-radius: 12px; padding: 13px 15px;
}
.ka-camp-main { min-width: 0; flex: 1; }
.ka-camp-zone { font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 3px; }
.ka-camp-title { font-size: .84rem; font-weight: 700; color: var(--k-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ka-camp-meta { font-size: .66rem; color: var(--k-ink-3); font-family: var(--k-font-b); display: flex; align-items: center; gap: 5px; margin-top: 3px; }
.ka-camp-side { text-align: right; flex-shrink: 0; }
.ka-status { display: inline-block; padding: 3px 10px; border-radius: 100px; font-size: .6rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.ka-status-pending { background: rgba(245,166,35,.15); color: var(--k-gold); }
.ka-status-active { background: rgba(168,200,70,.15); color: var(--k-green); }
.ka-status-rejected { background: rgba(255,59,59,.15); color: var(--k-red); }
.ka-status-expired { background: rgba(255,255,255,.08); color: var(--k-ink-3); }
.ka-camp-stats { font-size: .62rem; color: var(--k-ink-3); margin-top: 5px; font-family: var(--k-font-b); }

/* Zone pricing grid */
.ka-zone-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.ka-zone-card {
  position: relative; display: block; background: var(--k-surface2); border: 1.5px solid var(--k-border);
  border-radius: 12px; padding: 14px; cursor: pointer; transition: var(--k-trans);
}
.ka-zone-card:hover { border-color: var(--k-border-2); }
.ka-zone-card.active { border-color: var(--k-green); background: rgba(168,200,70,.06); }
.ka-zone-radio { position: absolute; opacity: 0; pointer-events: none; }
.ka-zone-dot { width: 8px; height: 8px; border-radius: 50%; margin-bottom: 8px; }
.ka-zone-name { font-size: .76rem; font-weight: 700; color: var(--k-ink); margin-bottom: 4px; line-height: 1.3; }
.ka-zone-price { font-family: var(--k-font-h); font-size: .92rem; font-weight: 800; color: var(--k-green); }
.ka-zone-price span { font-size: .6rem; color: var(--k-ink-3); font-weight: 600; font-family: var(--k-font-b); }

/* Form */
.ka-form { background: var(--k-surface2); border: 1px solid var(--k-border); border-radius: var(--k-r-lg); padding: 18px; margin-top: 20px; }
.ka-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 9px; }
.ka-form textarea.kf-reply-input { margin-bottom: 14px; }
.ka-duration-row { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-bottom: 16px; }
.ka-duration-label { font-size: .74rem; font-weight: 700; color: var(--k-ink-2); margin-right: 3px; }
.ka-dur-pill {
  padding: 6px 14px; border-radius: 100px; border: 1.5px solid var(--k-border-2); background: transparent;
  color: var(--k-ink-2); font-size: .7rem; font-weight: 700; cursor: pointer; transition: var(--k-trans); font-family: var(--k-font-b);
}
.ka-dur-pill.active { background: var(--k-green); color: #000; border-color: var(--k-green); }
.ka-total-row {
  display: flex; align-items: center; justify-content: space-between; padding: 12px 14px;
  background: var(--k-surface3); border-radius: 9px; margin-bottom: 14px; font-size: .8rem; color: var(--k-ink-2);
}
.ka-total-row strong { font-family: var(--k-font-h); font-size: 1.1rem; color: var(--k-green); }
.ka-consent {
  display: flex; align-items: flex-start; gap: 8px; margin-bottom: 14px;
  font-size: .72rem; color: var(--k-ink-3); line-height: 1.5; cursor: pointer;
}
.ka-consent input[type="checkbox"] { margin-top: 2px; flex-shrink: 0; accent-color: var(--k-green); width: 15px; height: 15px; cursor: pointer; }
.ka-consent a { color: var(--k-green); text-decoration: underline; }

/* ── Mobile density ── */
@media (max-width: 768px) {
  .ka-wrap { padding: 16px 14px 36px; }
  .ka-title { font-size: 1.05rem; }
  .ka-sub { font-size: .72rem; }
  .ka-section-title { font-size: .84rem; margin: 16px 0 9px; }

  .ka-camp-card { padding: 10px 12px; gap: 8px; }
  .ka-camp-zone { font-size: .56rem; }
  .ka-camp-title { font-size: .74rem; }
  .ka-camp-meta { font-size: .58rem; }
  .ka-status { font-size: .52rem; padding: 2px 8px; }
  .ka-camp-stats { font-size: .54rem; }

  .ka-zone-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .ka-zone-card { padding: 11px; }
  .ka-zone-name { font-size: .68rem; }
  .ka-zone-price { font-size: .8rem; }
  .ka-zone-price span { font-size: .54rem; }

  .ka-form { padding: 13px; }
  .ka-form-grid { grid-template-columns: 1fr; gap: 8px; }
  .ka-duration-label { font-size: .68rem; width: 100%; margin-bottom: 2px; }
  .ka-dur-pill { padding: 5px 11px; font-size: .64rem; }
  .ka-total-row { padding: 10px 12px; font-size: .72rem; }
  .ka-total-row strong { font-size: .96rem; }
}
@media (max-width: 420px) {
  .ka-zone-grid { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════════════════════════════════
   KILODE ADS MARKETPLACE GRID — small premium banners, grouped by
   category, 8 per row on desktop. Images are lazy-loaded (see PHP
   loading="lazy") so this stays fast even with 100+ live ads.
═══════════════════════════════════════════════════════════════ */
.kam-market { margin-top: 28px; }
.kam-cat-block { margin-bottom: 24px; }
.kam-cat-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.kam-cat-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.kam-cat-title { font-family: var(--k-font-h); font-size: .82rem; font-weight: 800; color: var(--k-ink); }
.kam-cat-count { font-size: .6rem; color: var(--k-ink-3); background: var(--k-surface3); padding: 2px 8px; border-radius: 20px; font-family: var(--k-font-b); }

.kam-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 8px; }
.kam-banner {
  display: block; text-decoration: none; background: var(--k-surface2);
  border: 1px solid var(--k-border); border-radius: 9px; overflow: hidden;
  transition: var(--k-trans);
}
.kam-banner:hover { transform: translateY(-2px); border-color: var(--k-green); box-shadow: var(--k-sh-sm); }
.kam-banner-img { aspect-ratio: 16/9; background: var(--k-surface3); overflow: hidden; }
.kam-banner-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kam-banner-info { padding: 6px 7px; }
.kam-banner-title {
  font-size: .62rem; font-weight: 700; color: var(--k-ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.3;
}
.kam-banner-co { font-size: .54rem; color: var(--k-ink-3); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ka-empty-market { padding: 30px 20px; text-align: center; font-size: .8rem; color: var(--k-ink-3);
  background: var(--k-surface2); border: 1px dashed var(--k-border); border-radius: 12px; }

@media (max-width: 1024px) { .kam-grid { grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 768px) {
  .kam-market { margin-top: 20px; }
  .kam-cat-block { margin-bottom: 16px; }
  .kam-cat-title { font-size: .72rem; }
  .kam-cat-count { font-size: .54rem; padding: 1px 6px; }
  .kam-grid { grid-template-columns: repeat(4, 1fr); gap: 6px; }
  .kam-banner-info { padding: 5px 6px; }
  .kam-banner-title { font-size: .56rem; }
  .kam-banner-co { font-size: .48rem; }
  .ka-empty-market { padding: 20px 14px; font-size: .72rem; }
}
@media (max-width: 420px) { .kam-grid { grid-template-columns: repeat(3, 1fr); } }

/* ═══════════════════════════════════════════════════════════════
   SAFETY & TERMS TICKER — slim, admin-editable, appears at the top
   of every registered-user dashboard
═══════════════════════════════════════════════════════════════ */
.kst-ticker {
  display: flex; align-items: center; background: var(--k-surface2);
  border: 1px solid var(--k-border); border-radius: 8px; overflow: hidden;
  height: 34px; margin-bottom: 16px;
}
.kst-label {
  background: rgba(168,200,70,.14); color: var(--k-green);
  font-size: .6rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  padding: 0 12px; height: 100%; display: flex; align-items: center; white-space: nowrap; flex-shrink: 0;
  border-right: 1px solid var(--k-border);
}
.kst-track-wrap { flex: 1; overflow: hidden; position: relative; }
.kst-track { display: flex; white-space: nowrap; animation: kst-scroll 32s linear infinite; width: max-content; }
.kst-track:hover { animation-play-state: paused; }
.kst-item {
  display: inline-flex; align-items: center; gap: 6px; padding: 0 22px;
  font-size: .68rem; color: var(--k-ink-2); text-decoration: none; white-space: nowrap;
}
.kst-item:hover { color: var(--k-green); }
.kst-icon { font-size: .78rem; flex-shrink: 0; }
@keyframes kst-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

@media (max-width: 768px) {
  .kst-ticker { height: 30px; margin-bottom: 12px; border-radius: 7px; }
  .kst-label { font-size: .54rem; padding: 0 9px; }
  .kst-item { font-size: .6rem; padding: 0 16px; gap: 5px; }
  .kst-icon { font-size: .68rem; }
}

/* ═══════════════════════════════════════════════════════════════
   SIDEBAR PREMIUM MARKETPLACE ADS
═══════════════════════════════════════════════════════════════ */
.ksb-market-ads { padding: 6px; display: flex; flex-direction: column; gap: 6px; }
.ksb-market-ad {
  display: flex; align-items: center; gap: 9px; padding: 7px; border-radius: 8px;
  text-decoration: none; transition: background .15s;
}
.ksb-market-ad:hover { background: rgba(255,255,255,.03); }
.ksb-market-ad img { width: 44px; height: 44px; border-radius: 7px; object-fit: cover; flex-shrink: 0; background: var(--k-surface3); }
.ksb-market-ad-body { min-width: 0; }
.ksb-market-ad-title { font-size: .68rem; font-weight: 700; color: var(--k-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ksb-market-ad-co { font-size: .58rem; color: var(--k-ink-3); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ═══════════════════════════════════════════════════════════════
   PRE-FOOTER PREMIUM AD TICKER
═══════════════════════════════════════════════════════════════ */
.kft-ticker {
  display: flex; align-items: center; background: var(--k-surface2);
  border: 1px solid var(--k-border); border-radius: 8px; overflow: hidden;
  height: 36px; margin: 20px 0;
}
.kft-label {
  background: rgba(245,166,35,.14); color: var(--k-gold);
  font-size: .6rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  padding: 0 13px; height: 100%; display: flex; align-items: center; white-space: nowrap; flex-shrink: 0;
  border-right: 1px solid var(--k-border);
}
.kft-track-wrap { flex: 1; overflow: hidden; }
.kft-track { display: flex; white-space: nowrap; animation: kft-scroll 36s linear infinite; width: max-content; }
.kft-track:hover { animation-play-state: paused; }
.kft-item {
  display: inline-flex; align-items: center; gap: 7px; padding: 0 22px;
  font-size: .7rem; font-weight: 600; color: var(--k-ink-2); text-decoration: none; white-space: nowrap;
}
.kft-item:hover { color: var(--k-gold); }
.kft-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--k-gold); flex-shrink: 0; }
@keyframes kft-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

@media (max-width: 768px) {
  .ksb-market-ad img { width: 36px; height: 36px; }
  .ksb-market-ad-title { font-size: .6rem; }
  .ksb-market-ad-co { font-size: .52rem; }

  .kft-ticker { height: 30px; margin: 14px 0; }
  .kft-label { font-size: .52rem; padding: 0 9px; }
  .kft-item { font-size: .6rem; padding: 0 15px; gap: 5px; }
}

/* ═══════════════════════════════════════════════════════════════
   STORE RENTAL REQUEST — lead-capture form, manual onboarding
═══════════════════════════════════════════════════════════════ */
.kstore-rent-wrap { max-width: 640px; margin: 30px auto; padding: 0 20px; }
.kstore-rent-card { background: var(--k-surface2); border: 1px solid var(--k-border); border-radius: var(--k-r-lg); padding: 22px; }
.kstore-rent-title { font-family: var(--k-font-h); font-size: 1.1rem; font-weight: 800; color: var(--k-ink); margin-bottom: 6px; }
.kstore-rent-sub { font-size: .8rem; color: var(--k-ink-3); margin-bottom: 16px; line-height: 1.5; }
.kstore-rent-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 9px; }
.kstore-rent-card textarea.kf-reply-input { margin-bottom: 12px; }

@media (max-width: 768px) {
  .kstore-rent-wrap { padding: 0 14px; margin: 20px auto; }
  .kstore-rent-card { padding: 15px; }
  .kstore-rent-title { font-size: .92rem; }
  .kstore-rent-sub { font-size: .72rem; margin-bottom: 12px; }
  .kstore-rent-grid { grid-template-columns: 1fr; gap: 8px; }
}

/* ═══════════════════════════════════════════════════════════════
   KILODE MOVIES HUB
═══════════════════════════════════════════════════════════════ */
.kmv-wrap { padding: 24px 20px 48px; }
.kmv-head { margin-bottom: 20px; }
.kmv-title { font-family: var(--k-font-h); font-size: 1.35rem; font-weight: 800; color: var(--k-ink); }
.kmv-sub { font-size: .82rem; color: var(--k-ink-3); margin-top: 5px; }
.kmv-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.kmv-card { background: var(--k-surface2); border: 1px solid var(--k-border); border-radius: 12px; overflow: hidden; transition: var(--k-trans); }
.kmv-card:hover { transform: translateY(-3px); border-color: var(--k-green); box-shadow: var(--k-sh); }
.kmv-poster { position: relative; aspect-ratio: 2/3; background: var(--k-surface3); }
.kmv-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kmv-score-badge {
  position: absolute; top: 8px; right: 8px; width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-family: var(--k-font-h);
  font-weight: 800; font-size: .82rem; color: #000; background: var(--k-green); border: 2px solid #000;
}
.kmv-score-badge.kms-approved { background: #3498db; }
.kmv-score-badge.kms-decent { background: var(--k-gold); }
.kmv-score-badge.kms-skip { background: var(--k-ink-3); }
.kmv-body { padding: 10px; }
.kmv-title-row { font-size: .78rem; font-weight: 700; color: var(--k-ink); line-height: 1.3; }
.kmv-year { color: var(--k-ink-3); font-weight: 500; }
.kmv-genre { font-size: .62rem; color: var(--k-ink-3); margin: 3px 0 6px; }
.kmv-label { display: inline-block; font-size: .58rem; font-weight: 800; padding: 2px 8px; border-radius: 20px; margin-bottom: 8px; background: rgba(168,200,70,.14); color: var(--k-green); }
.kmv-label.kms-approved { background: rgba(52,152,219,.14); color: #3498db; }
.kmv-label.kms-decent { background: rgba(245,166,35,.14); color: var(--k-gold); }
.kmv-label.kms-skip { background: rgba(255,255,255,.08); color: var(--k-ink-3); }
.kmv-votes { display: grid; grid-template-columns: repeat(4,1fr); gap: 4px; }
.kmv-vote-btn {
  background: var(--k-surface3); border: 1px solid var(--k-border); border-radius: 7px;
  padding: 5px 2px; font-size: .64rem; font-weight: 700; color: var(--k-ink-2);
  cursor: pointer; transition: var(--k-trans); display: flex; align-items: center; justify-content: center; gap: 2px;
}
.kmv-vote-btn:hover:not(:disabled) { border-color: var(--k-green); }
.kmv-vote-btn:disabled { opacity: .5; cursor: default; }

@media (max-width: 1024px) { .kmv-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 768px) {
  .kmv-wrap { padding: 16px 14px 36px; }
  .kmv-title { font-size: 1.05rem; }
  .kmv-sub { font-size: .72rem; }
  .kmv-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .kmv-score-badge { width: 26px; height: 26px; font-size: .66rem; top: 5px; right: 5px; }
  .kmv-body { padding: 7px; }
  .kmv-title-row { font-size: .66rem; }
  .kmv-genre { font-size: .54rem; margin: 2px 0 4px; }
  .kmv-label { font-size: .5rem; padding: 1px 6px; margin-bottom: 5px; }
  .kmv-vote-btn { font-size: .52rem; padding: 4px 1px; }
}
@media (max-width: 420px) { .kmv-grid { grid-template-columns: repeat(2, 1fr); } }