/* ===== ui-shell.css ===== */
/* Nerpathram V2 shared shell — keeps section pages visually aligned with Home. */
:root{
  --np-shell-bg:#f4f5f7;
  --np-shell-card:#fff;
  --np-shell-text:#17171c;
  --np-shell-muted:#6b6d75;
  --np-shell-line:#e5e7eb;
  --np-shell-brand:#160f2d;
  --np-shell-accent:#d51f31;
  --np-malayalam-font:"Nirmala UI","Noto Sans Malayalam","Kartika","Meera",system-ui,-apple-system,"Segoe UI",sans-serif;
}
html,body,button,input,textarea,select,a{font-family:var(--np-malayalam-font)!important}
html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3,strong,.brand strong,.copy h2,.community-copy h2,.result-copy h3,.topbar-title strong{font-weight:700!important;letter-spacing:0!important}
p{letter-spacing:0}

/* Shared permanent header. */
.unified-header{
  height:62px;position:sticky;top:0;z-index:90;
  color:#fff;background:linear-gradient(105deg,#100b22,#26103e 70%,#3c1119);
  display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;
  padding:0 9px;box-shadow:0 1px 0 rgba(255,255,255,.08)
}
.unified-icon{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:#fff;text-decoration:none;position:relative}
.unified-icon:active{background:rgba(255,255,255,.12)}
.unified-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.unified-brand{min-width:0;color:#fff;text-decoration:none;text-align:center;line-height:1}
.unified-brand strong{display:block;font-size:23px;line-height:1.08}
.unified-brand small{display:block;font-size:8px;line-height:1.1;opacity:.76;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.unified-actions{display:flex;align-items:center}
.unified-badge{position:absolute;top:2px;right:0;min-width:16px;height:16px;border:2px solid var(--np-shell-brand);border-radius:9px;background:#ef233c;color:#fff;font-size:8px;line-height:12px;text-align:center;font-style:normal}

.unified-tabs{
  position:sticky;top:62px;z-index:85;height:48px;display:flex;overflow-x:auto;
  background:#fff;border-bottom:1px solid var(--np-shell-line);padding:0 8px;scrollbar-width:none
}
.unified-tabs::-webkit-scrollbar{display:none}
.unified-tab{
  flex:0 0 auto;position:relative;display:flex;align-items:center;color:#202027;text-decoration:none;
  font-size:12.5px;font-weight:650;padding:0 11px;white-space:nowrap
}
.unified-tab.active{color:var(--np-shell-accent);font-weight:700}
.unified-tab.active:after{content:"";position:absolute;left:11px;right:11px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--np-shell-accent)}

/* Same content x-position and width on every major section. */
.global-page-shell{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr)}
.global-main-column{min-width:0;width:100%;max-width:720px;margin:0 auto}
.global-desktop-rail{display:none}
.global-rail-card{background:#fff;border:1px solid var(--np-shell-line);border-radius:14px;padding:12px}
.global-rail-card h3{font-size:13px;margin:0 0 8px}
.global-rail-card a{display:block;color:#45464d;text-decoration:none;font-size:11px;line-height:1.35;padding:7px 0;border-top:1px solid #eef0f2}
.global-rail-card a:first-of-type{border-top:0}
.global-left-nav{background:#fff;border:1px solid var(--np-shell-line);border-radius:14px;padding:8px}
.global-left-nav a{display:flex;align-items:center;gap:9px;color:#45464d;text-decoration:none;font-size:12px;font-weight:650;padding:10px;border-radius:10px}
.global-left-nav a.active{background:#f1ebfb;color:#6326a2}
.global-left-nav svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* Align section layouts with Home and remove oversized desktop reflow. */
.global-main-column .community-shell,.global-main-column.page,.global-main-column .page{width:100%;max-width:720px;margin:0 auto}
.community-page .community-shell{padding:8px 8px 0}
.community-page .community-heading{border-radius:12px;padding:10px 11px}
.community-page .community-heading h1{font-size:17px;line-height:1.28;margin:1px 0 2px}
.community-page .community-heading p{font-size:10.5px;line-height:1.35}
.community-page .community-feed{grid-template-columns:1fr!important;gap:7px}
.community-page .community-card.featured,.community-page .community-ad{grid-column:auto!important}
.community-page .community-copy h2{font-size:14px;line-height:1.38}
.community-page .community-copy p{line-height:1.4}

/* Discovery pages keep their controls beneath the shared two-row shell. */
body.has-unified-shell .search-wrap{top:110px}
body.has-unified-shell .chips{position:sticky;top:110px;z-index:35}
body.has-unified-shell .category-hero{padding:12px 13px}
body.has-unified-shell .category-hero h1{font-size:19px;line-height:1.25}
body.has-unified-shell .category-hero p{font-size:10.5px;line-height:1.35}
body.has-unified-shell .page{padding-top:0}

/* Normalize existing Home typography without changing its layout. */
.brand strong{font-size:23px!important;line-height:1.08!important}
.copy h2{font-size:15.5px!important;line-height:1.36!important;margin:1px 0 4px!important}
.copy p{font-size:11.5px!important;line-height:1.42!important}
.post-label{font-weight:700!important}
.tab{font-weight:650!important}
.card-top{min-height:33px}

@media(max-width:420px){
  .unified-brand strong{font-size:22px}
  .unified-tab{font-size:12px;padding:0 9px}
  .unified-tab.active:after{left:9px;right:9px}
}
@media(min-width:760px){
  .unified-header{height:66px;padding:0 max(18px,calc((100vw - 1180px)/2));grid-template-columns:44px minmax(0,1fr) auto}
  .unified-brand{text-align:left;max-width:300px;padding-left:6px}
  .unified-tabs{top:66px;justify-content:center}
  .global-page-shell{grid-template-columns:180px minmax(0,690px) 260px;gap:16px;padding:16px}
  .global-desktop-rail{display:block;position:sticky;top:130px;height:max-content}
  .global-right-rail{display:grid;gap:12px}
  .global-main-column{max-width:690px}
  body.has-unified-shell .search-wrap{top:0;position:relative}
  body.has-unified-shell .chips{top:114px}
  .community-page .community-shell{width:100%!important;max-width:690px!important;padding:0}
  .community-page .community-card .media.portrait{height:330px}
}

/* ===== responsive-polish.css ===== */
/* Nerpathram V2 Phase 11 — compact tablet and desktop adaptation. */
:root{--np-content-max:660px;--np-desktop-max:1120px}
@media (min-width:600px) and (max-width:959px){
  body{padding-bottom:72px!important}
  .bottom-nav{display:grid!important;max-width:720px;left:50%!important;right:auto!important;width:100%;transform:translateX(-50%);border-left:1px solid var(--line,#e5e7eb);border-right:1px solid var(--line,#e5e7eb)}
  .desktop-rail,.global-desktop-rail{display:none!important}
  .page-shell,.global-page-shell{display:grid!important;grid-template-columns:minmax(0,1fr)!important;padding:0!important;max-width:760px!important}
  .feed-column,.global-main-column,.community-shell,.page{max-width:700px!important;margin-inline:auto!important}
  .app-header,.unified-header{padding-inline:max(12px,calc((100vw - 720px)/2))!important}
  .brand,.unified-brand{text-align:center!important;max-width:none!important;padding-left:0!important}
  .category-tabs,.unified-tabs{justify-content:flex-start!important;padding-inline:max(8px,calc((100vw - 720px)/2))!important}
  .feed{padding:8px!important;gap:7px!important}
  .copy h2,.community-copy h2{font-size:16px!important;line-height:1.34!important}
}
@media (min-width:960px){
  .page-shell,.global-page-shell{max-width:var(--np-desktop-max)!important;grid-template-columns:158px minmax(0,630px) 238px!important;gap:14px!important;padding:14px!important}
  .feed-column,.global-main-column{max-width:630px!important}
  .community-page .community-shell{max-width:630px!important}
  .left-rail,.global-left-nav,.side-card,.global-rail-card{border-radius:12px!important}
  .rail-item,.global-left-nav a{font-size:11.5px!important;padding:9px!important}
  .copy h2,.community-copy h2{font-size:16.5px!important;line-height:1.35!important}
  .copy p,.community-copy p{font-size:11.5px!important;line-height:1.42!important}
  .feed{gap:7px!important;padding:7px!important}
}
@media (min-width:960px) and (max-width:1080px){
  .page-shell,.global-page-shell{grid-template-columns:150px minmax(0,630px)!important;max-width:820px!important}
  .right-rail,.global-right-rail{display:none!important}
}
@media (min-width:1280px){
  .page-shell,.global-page-shell{max-width:1140px!important}
}

/* Phase 12 desktop Swipe navigation fix: compact app rail, aligned with the card. */
@media (min-width:960px){
  .swipe-page .bottom-nav{
    position:fixed!important;
    display:flex!important;
    flex-direction:column!important;
    grid-template-columns:none!important;
    width:150px!important;
    height:auto!important;
    top:132px!important;
    bottom:auto!important;
    left:max(18px,calc(50vw - 560px))!important;
    right:auto!important;
    transform:none!important;
    padding:8px!important;
    gap:3px!important;
    border:1px solid var(--line,#e0e2e8)!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.98)!important;
    box-shadow:0 8px 24px rgba(16,24,40,.08)!important;
    backdrop-filter:blur(12px);
  }
  .swipe-page .bottom-item{
    width:100%!important;
    height:42px!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:10px!important;
    padding:0 10px!important;
    border-radius:9px!important;
    color:#52555e!important;
    font-size:11px!important;
    text-decoration:none!important;
  }
  .swipe-page .bottom-item:hover{background:#f6f3fb!important;color:#4e2588!important}
  .swipe-page .bottom-item.active{background:#f1ebfb!important;color:#6326a2!important;font-weight:700!important}
  .swipe-page .bottom-item svg{width:19px!important;height:19px!important;flex:0 0 19px!important}
  .swipe-page .bottom-item span{font-size:11px!important;line-height:1!important}
  .swipe-page .bottom-item em{top:3px!important;left:25px!important}
  .swipe-shell{max-width:640px!important}
}

/* Keep the fixed rail beside, not over, the central Swipe reader on medium desktop. */
@media (min-width:960px) and (max-width:1120px){
  .swipe-page .bottom-nav{left:16px!important;width:138px!important}
  .swipe-shell{max-width:610px!important}
}

/* ===== branding.css ===== */
:root{
  --brand:#07377f;--brand-2:#0c4aa3;--accent:#e20e18;--brand-soft:#eaf1fb;
  --bg:#f4f6f9;--card:#fff;--text:#151a22;--muted:#667085;--line:#e1e6ee;
}
html,body{background:var(--bg)}
.app-header,.unified-header,.article-topbar,.swipe-topbar,.account-topbar,.contrib-topbar{
  background:#fff!important;color:#14213a!important;border-bottom:1px solid var(--line)!important;box-shadow:0 2px 10px rgba(7,55,127,.06)!important;
}
.brand,.unified-brand,.article-logo,.swipe-brand{display:flex!important;align-items:center!important;justify-content:center!important;min-width:0!important;text-decoration:none!important}
.brand-logo{display:block;width:min(100%,225px);height:48px;object-fit:contain;object-position:center}
.unified-brand .brand-logo,.article-logo .brand-logo,.swipe-brand .brand-logo{width:min(100%,210px);height:45px}
.app-header .icon-btn,.unified-icon,.article-icon,.swipe-icon,.account-icon,.contrib-icon{color:#07377f!important}
.icon-btn:active,.unified-icon:active,.article-icon:active,.swipe-icon:active,.account-icon:active,.contrib-icon:active{background:var(--brand-soft)!important}
.has-badge>span,.bottom-item em,.unified-badge{background:var(--accent)!important;border-color:#fff!important}
.category-tabs,.unified-tabs{background:#fff!important;border-bottom-color:var(--line)!important}
.tab.active,.unified-tab.active{color:var(--brand)!important}
.tab.active:after,.unified-tab.active:after{background:var(--accent)!important}
.bottom-item.active{color:var(--brand)!important}
.rail-item.active,.global-left-nav a.active{background:var(--brand-soft)!important;color:var(--brand)!important}
.action.primary,.article-actions-inline button,.article-bottom-actions button{color:var(--brand)}
.compact-btn,.form-submit,.ads-primary,.install-primary,.auth-primary,.contrib-primary{background:var(--brand)!important}
.switch.on{background:var(--brand)!important}
.prompt-icon,.alert-symbol,.setting-icon{background:var(--brand-soft)!important;color:var(--brand)!important}
.profile-avatar{background:#fff!important;border:1px solid var(--line);overflow:hidden}
.profile-avatar img{width:100%;height:100%;object-fit:cover}
.story-ring{background:linear-gradient(135deg,var(--brand),#2f73c9,var(--accent))!important}
.new-posts{background:var(--brand)!important}
.feed-loader span{background:var(--brand)!important}
.post-label{background:var(--brand)!important}
.post-label.sponsored{background:#9b6a00!important}
.account-title,.contrib-title{color:#14213a!important}
.account-title small,.contrib-title small{color:#667085!important;opacity:1!important}
.onboard-logo{border-radius:22%;box-shadow:0 8px 26px rgba(7,55,127,.14)}
.branding-mark{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1px solid var(--line)}
@media(min-width:760px){
  .brand{justify-content:flex-start!important;max-width:300px!important}.brand-logo{width:250px;height:52px}
  .unified-brand,.article-logo,.swipe-brand{justify-content:flex-start!important}.unified-brand .brand-logo,.article-logo .brand-logo,.swipe-brand .brand-logo{width:230px;height:48px}
}
@media(max-width:430px){.brand-logo{width:190px;height:44px}.unified-brand .brand-logo,.article-logo .brand-logo,.swipe-brand .brand-logo{width:185px;height:42px}}


/* Phase 3 Screen 4: daily Swipe navigation, accessible pulse and four-item reflow. */
html:not(.np-swipe-ready) a.bottom-item[href*="swipe"],
html:not(.np-swipe-ready) a.rail-item[href*="swipe"],
html:not(.np-swipe-ready) .global-left-nav a[href*="swipe"]{display:none!important}
.np-swipe-nav-hidden{display:none!important}
.bottom-nav{grid-template-columns:repeat(var(--np-nav-count,5),minmax(0,1fr))!important}
.np-swipe-pulse{color:#e20e18!important;animation:npSwipePulse 1.15s ease-in-out infinite;will-change:transform,box-shadow,background-color}
@keyframes npSwipePulse{0%,100%{transform:scale(1);background:transparent;box-shadow:none}50%{transform:scale(1.055);background:rgba(226,14,24,.12);box-shadow:0 0 0 7px rgba(226,14,24,.08)}}
@media (prefers-reduced-motion:reduce){.np-swipe-pulse{animation:none!important;background:rgba(226,14,24,.12)!important;box-shadow:inset 0 0 0 2px rgba(226,14,24,.28)!important}}