:root{
  --blue-900:#00375a;
  --blue-800:#005580;
  --blue-700:#0071a8;
  --blue-600:#0082c2;
  --blue-500:#008ed4;
  --blue-100:#e7f3f8;
  --blue-050:#f4f9fb;
  --red-600:#d81f2a;
  --red-700:#b3141d;
  --ink:#152238;
  --muted:#66738a;
  --line:#e1e8f2;
  --white:#ffffff;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
html{scrollbar-width:thin;scrollbar-color:var(--blue-500) var(--blue-050);}
html::-webkit-scrollbar{width:10px;}
html::-webkit-scrollbar-track{background:var(--blue-050);}
html::-webkit-scrollbar-thumb{background:var(--blue-500);border-radius:6px;}
html::-webkit-scrollbar-thumb:hover{background:var(--blue-700);}
body{
  font-family:'Noto Sans Devanagari', 'Noto Sans', Arial, sans-serif;
  background:var(--blue-050);
  color:var(--ink);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{font-family:'Noto Serif Devanagari','Noto Sans Devanagari',serif;margin:0;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:1220px;margin:0 auto;padding:0 16px;}

/* Topbar */
.topbar{background:var(--blue-900);color:#c8d6ea;font-size:12px;}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;height:34px;gap:16px;}
.topbar-links{display:flex;gap:16px;flex:1;justify-content:center;}
.topbar-links a{color:#c8d6ea;}
.topbar-links a:hover{color:#fff;}
.topbar-social{display:flex;gap:8px;}
.topbar-social a{color:#fff;background:rgba(255,255,255,.12);width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;text-transform:uppercase;}
.topbar-social a:hover{background:var(--blue-500);}
.topbar-date{white-space:nowrap;}

/* Masthead */
.masthead{background:var(--white);border-bottom:1px solid var(--line);padding:16px 0;}
.masthead-inner{display:flex;align-items:center;gap:22px;}
.brand img{height:54px;width:auto;}
.masthead-spacer{flex:1;}

/* Navbar (mobile fallback only — desktop uses the sidebar) */
.navbar{display:none;background:linear-gradient(90deg,var(--blue-800),var(--blue-700));position:sticky;top:0;z-index:50;transition:box-shadow .2s;}
.navbar.scrolled{box-shadow:0 3px 14px rgba(10,37,64,.25);}
.navbar-inner{display:flex;overflow-x:auto;}
.navbar a{color:#eaf2fc;padding:13px 16px;font-weight:600;font-size:14px;white-space:nowrap;border-bottom:3px solid transparent;}
.navbar a:hover,.navbar a.active{background:rgba(255,255,255,.1);border-bottom-color:#ffffff;color:#fff;}

/* Ticker */
.ticker{background:var(--blue-100);border-bottom:1px solid var(--line);}
.ticker-inner{display:flex;align-items:center;height:38px;gap:12px;}
.ticker-label{background:var(--red-600);color:#fff;font-weight:700;font-size:12px;padding:5px 12px;border-radius:14px;flex-shrink:0;}
.ticker-track{overflow:hidden;flex:1;}
.ticker-content{display:flex;gap:40px;white-space:nowrap;animation:scrollTicker 9s linear infinite;}
.ticker-content a{font-size:13.5px;color:var(--blue-900);}
.ticker-content a:hover{color:var(--blue-500);}
@keyframes scrollTicker{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* Ad slots */
.ad-slot{border:2px dashed #9fb6d6;background:#eef4fb;color:#7d8db0;display:flex;align-items:center;justify-content:center;font-size:12px;text-transform:uppercase;letter-spacing:1.5px;border-radius:8px;}
.ad-slot span{opacity:.6;}
.ad-banner{width:100%;min-height:90px;margin:18px 0;}
.ad-sidebar{width:100%;aspect-ratio:9/16;max-height:420px;margin-bottom:20px;}
.ad-infeed{grid-column:1/-1;min-height:110px;margin-top:6px;}
.ad-hero-916{width:100%;max-width:260px;aspect-ratio:9/16;margin:18px auto;}

/* Photo thumbnails + no-photo fallback tile (never the stretched brand logo) */
.thumb-abs{position:absolute;inset:0;width:100%;height:100%;background-size:cover;background-position:center;background-color:var(--blue-050);}
.thumb-box{background-size:cover;background-position:center;background-color:var(--blue-050);}
.thumb-fallback{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;background:linear-gradient(135deg,var(--tint,#1257a3),var(--blue-900));color:#fff;}
.thumb-fallback-icon{font-size:26px;}
.thumb-fallback-label{font-size:10px;opacity:.85;letter-spacing:.5px;}
.row-item-thumb.thumb-fallback .thumb-fallback-icon,.mini-thumb.thumb-fallback .thumb-fallback-icon{font-size:15px;}
.row-item-thumb{width:88px;height:64px;border-radius:6px;flex-shrink:0;}
.mini-thumb{width:78px;height:56px;border-radius:6px;flex-shrink:0;}

/* Hero */
.hero{padding:20px 0 6px;background:var(--white);}
.hero-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;}
.hero-main{position:relative;display:block;border-radius:10px;overflow:hidden;background:var(--blue-900);min-height:360px;box-shadow:0 8px 24px rgba(10,37,64,.15);}
.hero-main .thumb-abs{opacity:.85;}
.hero-main-overlay{position:relative;z-index:2;background:linear-gradient(0deg,rgba(10,37,64,.94) 8%,rgba(10,37,64,.05) 95%);color:#fff;padding:26px 22px 20px;min-height:360px;display:flex;flex-direction:column;justify-content:flex-end;gap:9px;}
.hero-main-overlay h1{font-size:27px;line-height:1.3;}
.hero-main-overlay p{font-size:14px;color:#dce6f5;margin:0;}
.hero-side{display:flex;flex-direction:column;gap:12px;}
.row-item{display:flex;gap:10px;border-bottom:1px solid var(--line);padding-bottom:10px;}
.row-item:last-child{border-bottom:0;}
.row-item h4{font-size:14.5px;line-height:1.35;margin:2px 0 4px;}
.row-item:hover h4{color:var(--accent,var(--blue-700));}
.row-tag{color:var(--accent,var(--blue-700));font-size:11px;font-weight:700;}
.row-date{color:#93a0b8;font-size:11.5px;}

/* Tag pill */
.card-tag{display:inline-block;background:var(--accent,var(--blue-700));color:#fff;font-size:10.5px;font-weight:700;padding:4px 10px;border-radius:14px;position:absolute;top:10px;left:10px;z-index:2;letter-spacing:.3px;}
.card-tag.static{position:static;margin-bottom:12px;}

/* Sections */
.section{padding:28px 0 6px;}
.section-head{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.section-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.section-head h2{font-size:20px;color:var(--blue-900);}
.section-line{flex:1;height:1px;background:var(--line);}
.section-more{font-size:12.5px;font-weight:700;color:var(--red-600);white-space:nowrap;}
.section-more:hover{color:var(--red-700);}

.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.card{background:var(--white);border:1px solid var(--line);border-top:3px solid var(--accent,var(--blue-700));border-radius:10px;overflow:hidden;display:flex;flex-direction:column;transition:transform .18s, box-shadow .18s;}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(10,37,64,.12);}
.card-thumb{position:relative;display:block;height:150px;}
.card-body{padding:13px;display:flex;flex-direction:column;gap:6px;flex:1;}
.card-body h3{font-size:15px;line-height:1.35;}
.card-body h3 a:hover{color:var(--accent,var(--blue-700));}
.card-snippet{font-size:12.5px;color:var(--muted);margin:0;flex:1;}
.card-meta{display:flex;justify-content:space-between;font-size:11px;color:#9aa5ba;border-top:1px solid var(--line);padding-top:7px;}

/* Wide row (category archive) */
.wide-row{display:grid;grid-template-columns:230px 1fr;gap:18px;background:var(--white);border:1px solid var(--line);border-left:4px solid var(--accent,var(--blue-700));border-radius:10px;overflow:hidden;margin-bottom:16px;transition:box-shadow .18s;}
.wide-row:hover{box-shadow:0 8px 20px rgba(10,37,64,.1);}
.wide-row-thumb{position:relative;display:block;height:100%;min-height:150px;}
.wide-row-body{padding:16px 18px 16px 0;display:flex;flex-direction:column;gap:8px;}
.wide-row-body h3{font-size:18px;line-height:1.35;}
.wide-row-body h3 a:hover{color:var(--accent,var(--blue-700));}
.wide-row-body p{font-size:13.5px;color:var(--muted);margin:0;}
.read-more{color:var(--red-600);font-weight:700;margin-left:auto;}
.read-more:hover{color:var(--red-700);}

/* Category head */
.category-head{display:flex;align-items:center;gap:12px;padding:22px 16px 6px;}
.category-head h1{font-size:26px;color:var(--blue-900);}
.category-count{margin-left:auto;font-size:12.5px;color:var(--muted);background:var(--blue-100);padding:5px 12px;border-radius:14px;}
.empty-msg{color:var(--muted);padding:30px;text-align:center;}

/* Footer */
.site-footer{background:var(--blue-900);color:#c8d6ea;margin-top:34px;}
.footer-inner{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;padding:36px 16px;}
.footer-logo{height:44px;filter:brightness(0) invert(1);margin-bottom:10px;}
.footer-about p{font-size:13px;line-height:1.6;color:#a9bad8;}
.footer-col h4{color:#fff;font-size:15px;margin-bottom:12px;border-bottom:2px solid var(--blue-500);display:inline-block;padding-bottom:4px;}
.footer-links{display:flex;flex-direction:column;gap:8px;font-size:13px;}
.footer-links a:hover{color:#fff;}
.footer-social{display:flex;flex-direction:column;gap:8px;font-size:13px;}
.footer-social a:hover{color:#fff;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:14px 0;font-size:12px;color:#8497b8;text-align:center;}
.footer-bottom a{color:#a9c2e0;}
.footer-bottom a:hover{color:#fff;}

/* Breadcrumb + Article */
.breadcrumb{font-size:12.5px;color:var(--muted);padding:14px 16px;}
.breadcrumb a:hover{color:var(--blue-700);}
.article-layout{display:grid;grid-template-columns:2.3fr 1fr;gap:26px;align-items:start;padding-bottom:34px;}
.article-main{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:24px;position:relative;}
.article-title{font-size:28px;line-height:1.35;margin:8px 0 12px;color:var(--blue-900);}
.article-meta{display:flex;gap:16px;font-size:12.5px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:16px;}
.article-hero-img{width:100%;height:360px;border-radius:8px;margin-bottom:18px;background-size:cover;background-position:center;background-color:var(--blue-050);}
.article-body p{font-size:16px;line-height:1.9;color:#242f42;margin:0 0 16px;}
.article-share{display:flex;align-items:center;gap:10px;margin-top:20px;border-top:1px solid var(--line);padding-top:16px;font-size:13px;}
.article-share a{background:var(--blue-050);border:1px solid var(--line);padding:6px 14px;border-radius:16px;}
.article-share a:hover{background:var(--blue-700);color:#fff;border-color:var(--blue-700);}
.related-item,.popular-item,.picked-item{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);align-items:center;}
.related-item:last-child,.popular-item:last-child,.picked-item:last-child{border-bottom:0;}
.related-item h5,.popular-item h5,.picked-item h5{font-size:13px;line-height:1.3;margin:2px 0 4px;font-weight:600;}
.related-item:hover h5,.popular-item:hover h5,.picked-item:hover h5{color:var(--blue-700);}
.picked-num{width:20px;height:20px;border-radius:50%;background:var(--blue-700);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.sidebar-cat-list{display:flex;flex-wrap:wrap;gap:8px;}
.sidebar-cat-list a{background:var(--blue-050);border:1px solid var(--line);font-size:12px;padding:6px 12px;border-radius:14px;}
.sidebar-cat-list a:hover,.sidebar-cat-list a.active{background:var(--blue-700);color:#fff;border-color:var(--blue-700);}

/* Static pages (about/privacy/disclaimer) */
.static-page{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:30px;margin-bottom:34px;}
.static-page h1{font-size:28px;color:var(--blue-900);margin-bottom:16px;}
.static-page h2{font-size:19px;color:var(--blue-800);margin:22px 0 10px;}
.static-page p{font-size:15px;line-height:1.85;color:#2b3750;margin:0 0 12px;}
.static-page a{color:var(--blue-700);font-weight:600;}
.admin-note-inline{font-size:12.5px;color:var(--muted);background:var(--blue-050);border:1px solid var(--line);border-radius:8px;padding:9px 12px;margin:14px 0;}

/* Articles injected client-side by assets/live-sync.js from the admin panel */
.admin-article-card{display:flex;gap:12px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:10px;}
.admin-article-card:hover{border-color:var(--blue-500);}
.admin-article-card-body{min-width:0;}
.admin-article-card-body h5{font-size:13.5px;margin:2px 0 4px;color:var(--ink);}
.admin-article-badge{display:inline-block;background:var(--red-600);color:#fff;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:2px 7px;border-radius:8px;margin-bottom:3px;}

/* Video page */
.video-channel-card{display:flex;align-items:center;gap:18px;background:linear-gradient(135deg,var(--blue-800),var(--blue-900));color:#fff;border-radius:12px;padding:20px;margin-bottom:18px;}
.video-channel-play{width:56px;height:56px;border-radius:50%;background:var(--red-600);color:#fff;font-size:20px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.video-channel-card h2{color:#fff;font-size:17px;margin:0 0 6px;}
.video-channel-card p{color:#dce8f5;font-size:13.5px;margin:0 0 8px;}
.video-channel-cta{color:#fff;font-weight:700;font-size:13px;}
.video-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:14px;}
.video-tile{display:block;text-decoration:none;}
.video-tile-thumb{aspect-ratio:16/9;border-radius:8px;background:linear-gradient(135deg,var(--blue-700),var(--blue-900));display:flex;align-items:center;justify-content:center;}
.video-tile .video-play{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.25);color:#fff;font-size:14px;display:flex;align-items:center;justify-content:center;}
.video-tile-label{font-size:12.5px;font-weight:600;color:var(--ink);margin-top:6px;text-align:center;}

/* Contact page */
.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:26px;padding-bottom:34px;}
.contact-info{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:28px;}
.contact-info h1{font-size:26px;color:var(--blue-900);margin-bottom:12px;}
.contact-info p{color:var(--muted);font-size:14px;margin-bottom:18px;}
.contact-details{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:10px;font-size:14px;}
.contact-social{flex-direction:row;flex-wrap:wrap;gap:10px;}
.contact-social a{background:var(--blue-050);border:1px solid var(--line);padding:6px 14px;border-radius:16px;font-size:13px;}
.contact-social a:hover{background:var(--blue-700);color:#fff;}
.contact-form{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:28px;display:flex;flex-direction:column;gap:14px;}
.contact-form h3{color:var(--blue-900);font-size:19px;}
.contact-form label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted);font-weight:600;}
.contact-form input,.contact-form textarea{border:1px solid var(--line);border-radius:6px;padding:10px 12px;font-family:inherit;font-size:14px;outline:none;}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--blue-500);}
.contact-form button{background:var(--red-600);color:#fff;border:0;padding:11px 18px;border-radius:24px;font-weight:700;cursor:pointer;font-size:14.5px;align-self:flex-start;}
.contact-form button:hover{background:var(--red-700);}
.contact-form button:hover{background:var(--blue-600);}

/* Three-column app shell: sidebar | main | right rail */
.layout-shell{display:grid;grid-template-columns:230px minmax(0,1fr) 260px;gap:20px;align-items:start;padding-top:18px;}
.main-col{min-width:0;}

/* Sidebar */
.side-nav{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:10px;position:sticky;top:66px;max-height:calc(100vh - 84px);overflow-y:auto;}
.side-link{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--ink);}
.side-link:hover{background:var(--blue-050);color:var(--blue-700);}
.side-link.active{background:var(--blue-100);color:var(--blue-700);border-left:3px solid var(--blue-700);padding-left:7px;}
.side-icon{font-size:15px;width:20px;text-align:center;flex-shrink:0;}
.side-label{flex:1;}
.side-count{font-size:10.5px;color:var(--muted);background:var(--blue-050);border-radius:10px;padding:1px 7px;}
.side-group summary{list-style:none;cursor:pointer;}
.side-group summary::-webkit-details-marker{display:none;}
.side-group summary .side-link::after{content:'›';margin-left:auto;transform:rotate(90deg);transition:transform .15s;color:var(--muted);}
.side-group[open] summary .side-link::after{transform:rotate(-90deg);}
.side-children{padding-left:22px;display:flex;flex-direction:column;max-height:260px;overflow-y:auto;}
.side-children .side-link{font-weight:500;font-size:12.5px;padding:6px 10px;}
.side-divider{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin:12px 6px 6px;font-weight:700;}
.home-link{margin-bottom:4px;}

/* Trending strip */
.trending-strip{display:flex;align-items:center;gap:12px;background:var(--red-600);border:1px solid var(--red-700);border-radius:10px;padding:9px 14px;margin-bottom:16px;overflow:hidden;}
.trending-label{background:var(--red-700);color:#fff;font-size:11px;font-weight:700;padding:4px 10px;border-radius:12px;flex-shrink:0;}
.trending-pills{display:flex;gap:10px;overflow-x:auto;white-space:nowrap;}
.trending-pills a{font-size:12.5px;color:#fff;background:rgba(255,255,255,.16);padding:5px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.25);}
.trending-pills a:hover{background:rgba(255,255,255,.3);}

/* External nav highlight (ई-पेपर etc.) */
.side-link-highlight{color:var(--red-600) !important;font-weight:700;}
.side-link-highlight:hover{background:#fdecec !important;color:var(--red-700) !important;}
.side-link-highlight .side-icon{filter:none;}

/* Right rail */
.right-rail{display:flex;flex-direction:column;gap:16px;position:sticky;top:66px;align-self:start;}
.widget{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:16px;}
.widget h4{color:var(--blue-900);font-size:14.5px;margin-bottom:12px;}
.follow-card{background:var(--blue-800);color:#fff;border-radius:10px;padding:16px;border-color:var(--blue-800);}
.follow-card-text{font-size:13px;line-height:1.5;margin-bottom:12px;color:#eaf2fc;}
.follow-card-icons{display:flex;gap:8px;flex-wrap:wrap;}
.follow-card-icons a{background:rgba(255,255,255,.15);color:#fff;font-size:12px;padding:6px 11px;border-radius:14px;}
.follow-card-icons a:hover{background:rgba(255,255,255,.3);}

/* Score card */
.score-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.score-tag{background:var(--blue-700);color:#fff;font-size:11px;font-weight:700;padding:3px 9px;border-radius:10px;}
.sport-tabs{display:flex;gap:6px;margin-bottom:12px;border-bottom:1px solid var(--line);padding-bottom:10px;}
.sport-tab{background:var(--blue-050);color:var(--blue-800);border:0;font-size:12px;font-weight:600;padding:6px 12px;border-radius:14px;cursor:pointer;font-family:inherit;}
.sport-tab:hover{background:var(--blue-100);}
.sport-tab.active{background:var(--red-600);color:#fff;}
.sport-panel{display:none;}
.sport-panel.active{display:block;}
.score-series{font-size:11.5px;color:var(--muted);margin-bottom:8px;display:block;}
.score-card-body{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;}
.score-team{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12.5px;font-weight:600;color:var(--ink);}
.score-flag{font-size:22px;}
.score-vs{font-size:11px;color:var(--muted);font-weight:700;}
.score-result{font-size:12.5px;font-weight:600;color:var(--blue-800);background:var(--blue-050);border-radius:6px;padding:7px 10px;text-align:center;margin-bottom:10px;}
.score-upcoming{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.score-upcoming-tag{background:var(--red-600);color:#fff;font-size:10px;font-weight:700;padding:2px 8px;border-radius:8px;}

/* Video card */
.video-card{padding:0;overflow:hidden;}
.video-card-thumb{background:linear-gradient(135deg,var(--blue-800),var(--blue-900));height:120px;display:flex;align-items:center;justify-content:center;}
.video-play{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.2);color:#fff;font-size:16px;display:flex;align-items:center;justify-content:center;}
.video-card-body{padding:14px;}
.video-card-body h5{font-size:13.5px;margin-bottom:6px;color:var(--ink);}
.video-card-body p{font-size:12px;color:var(--muted);line-height:1.5;margin-bottom:10px;}
.video-link{font-size:12.5px;font-weight:700;color:var(--red-600);}
.video-link:hover{color:var(--red-700);text-decoration:underline;}

/* Rashifal card */
.rashifal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.rashifal-head h4{margin-bottom:0;}
.rashifal-date{font-size:11.5px;color:var(--blue-700);font-weight:600;background:var(--blue-050);padding:3px 9px;border-radius:10px;}
.rashifal-select{width:100%;font-family:inherit;font-size:13px;font-weight:600;color:var(--blue-900);background:var(--blue-050);border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin-bottom:10px;cursor:pointer;}
.rashifal-text{display:none;font-size:12.5px;line-height:1.6;color:var(--muted);margin:0;}
.rashifal-text.active{display:block;}

/* Social card */
.social-icons{display:flex;gap:10px;}
.social-icon{flex:1;display:flex;align-items:center;justify-content:center;height:42px;border-radius:8px;background:var(--blue-050);color:var(--blue-700);}
.social-icon:hover{background:var(--blue-700);color:#fff;}
.social-icon.fb:hover{background:#1877f2;}
.social-icon.x:hover{background:#000;}
.social-icon.ig:hover{background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af);}
.social-icon.yt:hover{background:var(--red-600);}

/* Picks card */
.picked-item{text-decoration:none;}

/* District hub */
.district-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.district-card{display:flex;align-items:center;gap:8px;background:var(--white);border:1px solid var(--line);border-radius:8px;padding:12px 14px;font-size:13.5px;font-weight:600;}
.district-card:hover{background:var(--blue-050);border-color:var(--blue-500);color:var(--blue-700);}

/* Related block inside article */
.related-block{border-top:1px solid var(--line);margin-top:22px;padding-top:18px;}
.related-block h4{color:var(--blue-900);font-size:15px;margin-bottom:10px;}

/* Responsive */
@media(max-width:1180px){
  .layout-shell{grid-template-columns:210px minmax(0,1fr) 230px;}
}
@media(max-width:980px){
  .layout-shell{grid-template-columns:1fr;}
  /* On mobile, show news first: the compact horizontal category strip
     (.navbar) replaces the full sidebar at the top, and the full sidebar
     (with district/sub-category lists) moves below the article content
     instead of blocking it. position:static (instead of the desktop
     sticky-top:0) keeps it from ever floating over/overlapping the topbar
     above it, and hiding topbar-links here avoids clutter next to it. */
  .navbar{display:block;position:static;}
  .topbar-links{display:none;}
  .main-col{order:1;}
  .right-rail{position:static;flex-direction:row;flex-wrap:wrap;order:2;}
  .right-rail>*{flex:1 1 240px;}
  .side-nav{position:static;max-height:none;order:3;}
  .hero-grid{grid-template-columns:1fr;}
  .card-grid{grid-template-columns:repeat(2,1fr);}
  .footer-inner{grid-template-columns:1fr;}
  .contact-layout{grid-template-columns:1fr;}
  .wide-row{grid-template-columns:1fr;}
  .wide-row-thumb{min-height:180px;}
  .wide-row-body{padding:14px;}
  .district-grid{grid-template-columns:repeat(2,1fr);}
  .video-grid{grid-template-columns:repeat(2,1fr);}
  .video-channel-card{flex-direction:column;text-align:center;}
}
@media(max-width:600px){
  .card-grid{grid-template-columns:1fr;}
  .topbar-links{display:none;}
  .district-grid{grid-template-columns:1fr;}
}

/* ---------------------------------------------------------------------- */
/* Admin panel (not part of the public v9 design)                         */
/* ---------------------------------------------------------------------- */
.admin-shell { display: flex; min-height: 100vh; }
.admin-side { width: 250px; flex-shrink: 0; background: var(--blue-900); color: #fff; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; }
.admin-brand { font-size: 16px; font-weight: 800; padding: 20px 18px; border-bottom: 1px solid rgba(255,255,255,.12); }
.admin-brand span { font-weight: 600; font-size: 12px; opacity: .75; display: block; }
.admin-nav { flex: 1; display: flex; flex-direction: column; padding: 10px; gap: 2px; overflow-y: auto; }
.admin-tab { display: flex; align-items: center; gap: 10px; background: transparent; border: 0; color: #cfe0f5; text-align: left; padding: 11px 12px; border-radius: 8px; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.admin-tab:hover, .admin-tab.active { background: var(--red-600); color: #fff; }
.admin-side-footer { padding: 14px; border-top: 1px solid rgba(255,255,255,.12); }
.admin-user-chip { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.admin-user-avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--blue-500); display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; }
.admin-logout { width: 100%; background: rgba(255,255,255,.1); color: #fff; border: 0; padding: 9px; border-radius: 8px; font-weight: 600; font-size: 12.5px; cursor: pointer; margin-bottom: 8px; }
.admin-logout:hover { background: rgba(255,255,255,.2); }
.admin-back-link { display: block; text-align: center; font-size: 11.5px; color: #a9c2e0; }
.admin-main { flex: 1; padding: 28px 34px; min-width: 0; }
.admin-panel { max-width: 920px; }
.admin-panel h2 { color: var(--blue-900); font-size: 20px; margin: 0 0 10px; }
.admin-panel-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.admin-note { font-size: 12.5px; color: var(--muted); background: var(--blue-050); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; line-height: 1.6; margin-bottom: 14px; }
.admin-note-warn { background: #fff8e6; border-color: #f0e0a8; color: #8a6d10; }
.stat-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
@media (max-width: 800px) { .stat-grid { grid-template-columns: repeat(2, 1fr); } }
.stat-card { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 14px; text-align: center; }
.stat-num { font-size: 22px; font-weight: 800; color: var(--blue-900); }
.stat-label { font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.admin-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; font-size: 13px; }
.admin-table th, .admin-table td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; }
.admin-table th { background: var(--blue-050); color: var(--blue-900); font-size: 11.5px; text-transform: uppercase; letter-spacing: .5px; }
.admin-table tr:last-child td { border-bottom: 0; }
.admin-row-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.thumb-sm { width: 44px; height: 34px; border-radius: 5px; object-fit: cover; }
.pill { font-size: 10.5px; font-weight: 700; padding: 3px 9px; border-radius: 10px; }
.pill-green { background: #e3f6ea; color: #1a8a4a; }
.pill-gray { background: var(--blue-050); color: var(--muted); }
.admin-btn-primary { background: var(--red-600); color: #fff; border: 0; padding: 10px 18px; border-radius: 20px; font-weight: 700; font-size: 13.5px; cursor: pointer; }
.admin-btn-primary:hover { background: var(--red-700); }
.admin-btn-ghost { background: transparent; border: 1px solid var(--line); color: var(--blue-800); padding: 9px 16px; border-radius: 20px; font-weight: 600; font-size: 13px; cursor: pointer; }
.admin-btn-sm { background: var(--blue-050); border: 1px solid var(--line); color: var(--blue-800); padding: 5px 10px; border-radius: 14px; font-size: 11.5px; font-weight: 700; cursor: pointer; }
.admin-btn-danger { background: #fdecec; border-color: #f3c9c9; color: var(--red-700); }
.admin-form { display: flex; flex-direction: column; gap: 6px; max-width: 560px; }
.admin-form label { font-size: 12.5px; font-weight: 700; color: var(--blue-900); margin-top: 10px; }
.admin-form input, .admin-form select, .admin-form textarea { padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; font-size: 13.5px; font-family: inherit; width: 100%; }
.admin-check { display: flex; align-items: center; gap: 8px; flex-direction: row; font-weight: 600; }
.category-checklist { max-height: 230px; overflow-y: auto; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; background: #fff; display: flex; flex-direction: column; gap: 8px; }
.category-checklist .admin-check { font-weight: 500; font-size: 13px; margin-top: 0; }
.category-checklist input[type="checkbox"] { width: auto; }
.admin-form-actions { display: flex; gap: 10px; margin-top: 18px; }
.img-preview { max-width: 220px; max-height: 140px; border-radius: 8px; margin-top: 8px; object-fit: cover; }
.admin-inline-form { display: flex; gap: 8px; margin-bottom: 14px; max-width: 420px; }
.share-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 620px; }
.share-btn { display: block; text-align: center; padding: 13px; border-radius: 10px; color: #fff; font-weight: 700; font-size: 13.5px; border: 0; cursor: pointer; }
.share-fb { background: #1877f2; } .share-x { background: #000; } .share-wa { background: #25d366; }
.share-tg { background: #229ed9; } .share-ig { background: linear-gradient(135deg,#f58529,#dd2a7b,#8134af); } .share-yt { background: #ff0000; }
.login-screen { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(160deg, var(--blue-900), var(--blue-700)); padding: 20px; }
.login-card { background: #fff; border-radius: 14px; padding: 34px 32px; width: 100%; max-width: 380px; box-shadow: 0 20px 50px rgba(10,37,64,.35); }
.login-card h1 { font-size: 20px; margin: 0 0 4px; color: var(--blue-900); }
.login-card h1 span { display: block; font-size: 13px; font-weight: 600; color: var(--muted); margin-top: 2px; }
.login-card form { display: flex; flex-direction: column; gap: 6px; }
.login-card label { font-size: 12.5px; font-weight: 700; color: var(--blue-900); margin-top: 8px; }
.login-card input { padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; }
.login-card button { margin-top: 16px; background: var(--red-600); color: #fff; border: 0; padding: 12px; border-radius: 24px; font-weight: 700; font-size: 14.5px; cursor: pointer; width: 100%; }
.login-error { color: var(--red-600); font-size: 12.5px; min-height: 16px; }
.success-msg { color: #1a8a4a; font-size: 12.5px; min-height: 16px; }