/* Maharashtra Rank — shared design system (v2)
   Light theme is default; [data-theme="dark"] on <html> overrides. */

*,*::before,*::after{box-sizing:border-box}
:root{
  /* ---- light theme (default) ---- */
  --bg:#f5f7fb;--bg2:#ffffff;--surface:#ffffff;--glass:rgba(255,255,255,.7);--glass-strong:rgba(255,255,255,.92);
  --ink:#101828;--ink-soft:#3f4a5f;--muted:#5b6478;--faint:#98a0b3;
  --line:#e4e8f0;--line-soft:#edf0f6;
  --saffron:#e07a1f;--navy:#0f3d73;--green:#158a56;
  --accent:linear-gradient(120deg,#0f3d73,#1f6fd6);
  --accent-2:linear-gradient(120deg,#e07a1f,#f2a93c);
  --violet:#5b57e0;--cyan:#0e8fb8;--pink:#d1467e;--amber:#c17a09;--red:#c73a4a;
  --green-soft:#e5f6ee;--red-soft:#fdeaec;--amber-soft:#fbf1dc;
  --r-sm:12px;--r-md:16px;--r-lg:22px;--r-xl:30px;
  --shadow-sm:0 4px 16px rgba(16,24,40,.06);
  --shadow-md:0 14px 38px rgba(16,24,40,.08);
  --shadow-lg:0 26px 60px rgba(16,24,40,.12);
  --container:1120px;
  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}
html[data-theme="dark"]{
  /* ---- dark theme: deep navy/indigo aurora, not just inverted light ---- */
  --bg:#070a16;--bg2:#0d1224;--surface:#0e1326;--glass:rgba(255,255,255,.045);--glass-strong:rgba(255,255,255,.09);
  --ink:#f2f4fc;--ink-soft:#c3cae2;--muted:#8790ae;--faint:#565f80;
  --line:rgba(255,255,255,.1);--line-soft:rgba(255,255,255,.055);
  --saffron:#ffb648;--navy:#8fb4ff;--green:#4fe3a8;
  --accent:linear-gradient(120deg,#6d7dff,#22d3ee);
  --accent-2:linear-gradient(120deg,#ff5fa8,#8f6dff);
  --violet:#8f6dff;--cyan:#3ce0ff;--pink:#ff5fa8;--amber:#ffc267;--red:#ff6b81;
  --green-soft:rgba(79,227,168,.14);--red-soft:rgba(255,107,129,.14);--amber-soft:rgba(255,194,103,.14);
  --shadow-sm:0 8px 24px rgba(0,0,0,.35);
  --shadow-md:0 20px 50px rgba(0,0,0,.45);
  --shadow-lg:0 34px 90px rgba(0,0,0,.6);
  color-scheme:dark;
}
html{scroll-behavior:smooth}
body{
  margin:0;font:400 14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Arial,sans-serif;
  color:var(--ink);background:var(--bg);transition:background .35s ease,color .35s ease;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative;
}
/* dark-theme ambient aurora wash, sitewide (not just homepage) */
html[data-theme="dark"] body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(52vw 38vh at 8% -8%,rgba(111,125,255,.16),transparent 60%),
    radial-gradient(46vw 36vh at 100% 0%,rgba(60,224,255,.11),transparent 60%),
    radial-gradient(40vw 32vh at 15% 100%,rgba(255,95,168,.08),transparent 60%),
    var(--bg);
  background-size:200% 200%;
  animation:auroraShift 26s ease-in-out infinite;
}
@keyframes auroraShift{0%,100%{background-position:0% 0%,100% 0%,0% 100%,0 0}50%{background-position:18% 26%,78% 18%,12% 82%,0 0}}
h1,h2,h3{margin:0;letter-spacing:-.02em;font-weight:800;color:var(--ink)}
p{margin:0}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
::selection{background:rgba(31,111,214,.2)}
html[data-theme="dark"] ::selection{background:rgba(111,125,255,.35)}

.eyebrow{font-size:10px;font-weight:800;letter-spacing:.16em;color:var(--navy);text-transform:uppercase}
html[data-theme="dark"] .eyebrow{color:var(--cyan)}
.muted{color:var(--muted)!important;font-size:11px}
.container{max-width:var(--container);margin:auto;padding:0 20px}
@media(max-width:600px){.container{padding:0 14px}}

/* ---------- reveal-on-scroll ---------- */
.reveal-ready [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal-ready [data-reveal].in-view{opacity:1;transform:translateY(0)}
.reveal-ready [data-reveal="scale"]{transform:translateY(0) scale(.96)}
.reveal-ready [data-reveal="scale"].in-view{transform:scale(1)}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  [data-reveal]{opacity:1!important;transform:none!important}
}

/* ---------- animated moving-border utility (security / "alive" motif) ---------- */
.mr-border-anim{position:relative}
.mr-border-anim::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;z-index:0;
  background:conic-gradient(from var(--ang,0deg),transparent 0 82%,var(--saffron) 88%,var(--navy) 94%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:borderSweep 5s linear infinite;
}
html[data-theme="dark"] .mr-border-anim::before{background:conic-gradient(from var(--ang,0deg),transparent 0 82%,var(--cyan) 88%,var(--violet) 94%,transparent 100%)}
@keyframes borderSweep{to{--ang:360deg}}
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}

/* thin marching light-line along top edge, used on hero/banners */
.mr-edge-line{position:absolute;left:0;right:0;top:0;height:2px;overflow:hidden;border-radius:inherit;z-index:1}
.mr-edge-line i{position:absolute;top:0;height:100%;width:26%;background:linear-gradient(90deg,transparent,#fff,transparent);opacity:.55;animation:edgeMove 3.4s linear infinite}
@keyframes edgeMove{0%{left:-30%}100%{left:104%}}

/* ---------- buttons ---------- */
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:var(--r-sm);padding:13px 20px;font-size:12.5px;font-weight:800;text-decoration:none;transition:transform .25s var(--ease),box-shadow .25s var(--ease);white-space:nowrap}
.btn::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.35),transparent 45%);opacity:0;transition:opacity .3s ease;pointer-events:none}
.btn:hover::after{opacity:1}
.btn-primary,.primary{background:var(--accent);color:#fff;box-shadow:0 10px 24px rgba(15,61,115,.28)}
html[data-theme="dark"] .btn-primary,html[data-theme="dark"] .primary{box-shadow:0 10px 26px rgba(111,125,255,.35)}
.btn-primary:hover,.primary:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(15,61,115,.34)}
html[data-theme="dark"] .btn-primary:hover,html[data-theme="dark"] .primary:hover{box-shadow:0 16px 34px rgba(111,125,255,.45)}
.btn-primary:active,.primary:active{transform:translateY(0) scale(.98)}
.btn-ghost{background:var(--glass);color:var(--ink);border:1px solid var(--line);backdrop-filter:blur(10px)}
.btn-ghost:hover{background:var(--glass-strong);transform:translateY(-2px)}
.primary{width:100%;height:52px;font-size:13px}
/* Button loading spinner: consistent visual language with the .loading card's scan-line/lock treatment. */
.btn[data-busy]{color:transparent!important;pointer-events:none;opacity:.9}
.btn[data-busy]::before{content:"";position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;animation:btnSpin .7s linear infinite}
.btn-ghost[data-busy]::before{border:2.5px solid var(--line);border-top-color:var(--navy)}
html[data-theme="dark"] .btn-ghost[data-busy]::before{border-top-color:var(--cyan)}
@keyframes btnSpin{to{transform:rotate(360deg)}}
.secondary-btn{background:var(--glass);border:1px solid var(--line);border-radius:12px;padding:12px 16px;font-weight:800;color:var(--ink-soft);transition:background .2s}
.secondary-btn:hover{background:var(--glass-strong)}

/* ---------- generic card ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;margin-bottom:16px;box-shadow:var(--shadow-sm);transition:border-color .3s ease,transform .3s ease,box-shadow .3s ease}
.card:hover{box-shadow:var(--shadow-md)}
.card h2{font-size:18px;margin-bottom:6px}
.card p{color:var(--ink-soft);line-height:1.6}
label{display:block;font-weight:800;font-size:12px;margin-bottom:8px;color:var(--ink-soft)}
.section-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.err{margin-top:12px;padding:12px 14px;background:var(--red-soft);color:var(--red);border-radius:var(--r-sm);font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.retry-btn{background:var(--red);color:#fff;border:0;padding:6px 12px;border-radius:8px;font-size:11px;font-weight:800;cursor:pointer;flex:0 0 auto}
.retry-btn:hover{opacity:.88}

/* ============ HEADER (shared across all pages) ============ */
.site-header{position:sticky;top:0;z-index:40;background:var(--glass-strong);backdrop-filter:blur(18px);border-bottom:1px solid var(--line-soft);transition:background .3s ease,border-color .3s ease,box-shadow .3s ease}
.site-header.scrolled{border-bottom-color:var(--line);box-shadow:var(--shadow-sm)}
.header-inner{max-width:var(--container);margin:auto;height:66px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand-mark{width:38px;height:38px;flex:0 0 38px;filter:drop-shadow(0 4px 10px rgba(15,61,115,.3));transition:transform .4s var(--ease)}
html[data-theme="dark"] .brand-mark{filter:drop-shadow(0 4px 14px rgba(111,125,255,.45))}
.brand-text{line-height:1.15}
.brand-text strong{display:block;font-size:14px;letter-spacing:.01em}
.brand-text small{display:block;font-size:8.5px;letter-spacing:.14em;color:var(--muted);margin-top:1px;text-transform:uppercase}
.site-nav{display:flex;align-items:center;gap:4px;flex:0 1 auto;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.site-nav::-webkit-scrollbar{display:none}
.nav-link{flex:0 0 auto;font-size:11.5px;font-weight:800;color:var(--ink-soft);text-decoration:none;padding:9px 12px;border-radius:9px;white-space:nowrap;transition:color .2s,background .2s}
.nav-link:hover,.nav-link.is-active{background:var(--glass);color:var(--navy)}
html[data-theme="dark"] .nav-link:hover,html[data-theme="dark"] .nav-link.is-active{color:#fff}
.nav-join{color:#fff!important;background:var(--accent-2)}
.nav-join:hover{color:#fff!important;transform:translateY(-1px)}
.header-tools{display:flex;align-items:center;gap:6px}
.tool-btn{height:36px;border:1px solid var(--line);border-radius:10px;background:var(--glass);display:inline-flex;align-items:center;justify-content:center;gap:5px;font-size:14px;padding:0 10px;transition:background .2s,transform .2s}
.tool-btn:hover{background:var(--glass-strong);transform:translateY(-1px)}
.theme-btn{width:36px;padding:0}
.lang-btn{font-size:12px;font-weight:800;gap:4px}
.lang-btn .lang-glyph{font-family:"Noto Sans Devanagari",system-ui,sans-serif;font-size:13px}

/* ---------- announcement ticker ---------- */
.announce-bar{max-width:var(--container);margin:12px auto 0;height:36px;display:flex;align-items:center;border-radius:11px;overflow:hidden;background:var(--glass);border:1px solid var(--line);box-shadow:var(--shadow-sm);backdrop-filter:blur(10px)}
.announce-tag{height:100%;display:flex;align-items:center;padding:0 12px;color:#fff;font-size:9px;font-weight:800;letter-spacing:.1em;background:var(--accent)}
.announce-track{overflow:hidden;white-space:nowrap;flex:1}
.announce-track span{display:inline-block;padding-left:100%;font-size:11px;font-weight:700;color:var(--ink-soft);animation:marquee 26s linear infinite}
@keyframes marquee{to{transform:translateX(-100%)}}

main.page{max-width:var(--container);margin:auto;padding:18px 20px 40px}
@media(max-width:600px){main.page{padding:14px 12px 32px}.card{padding:16px}}

/* ============ FOOTER (shared) ============ */
.site-footer{margin-top:40px;border-top:1px solid var(--line);background:var(--surface)}
.footer-grid{max-width:var(--container);margin:auto;padding:36px 20px 20px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:24px}
.footer-brand{display:flex;flex-direction:column;gap:10px}
.footer-brand .brand{margin-bottom:2px}
.footer-brand p{color:var(--muted);font-size:11.5px;line-height:1.6;max-width:280px}
.footer-col h4{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:10px}
.footer-col a{display:block;color:var(--ink-soft);text-decoration:none;font-size:12.5px;padding:5px 0;transition:color .2s}
.footer-col a:hover{color:var(--navy)}
html[data-theme="dark"] .footer-col a:hover{color:#fff}
.footer-bottom{border-top:1px solid var(--line);padding:16px 20px;max-width:var(--container);margin:auto;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:10.5px}
.footer-badges{display:flex;gap:8px;flex-wrap:wrap}
.footer-badges span{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:999px;background:var(--glass);border:1px solid var(--line);font-size:9.5px;font-weight:700;color:var(--ink-soft)}
@media(max-width:820px){.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.footer-grid{grid-template-columns:1fr}}

/* ============ legal / static content pages ============ */
.legal-hero{padding:34px 0 10px}
.legal-hero .eyebrow{display:block;margin-bottom:8px}
.legal-hero h1{font-size:clamp(26px,4vw,36px)}
.legal-hero p{color:var(--muted);margin-top:8px;font-size:12.5px}
.legal-body{max-width:760px}
.legal-body h2{font-size:16px;margin:26px 0 8px}
.legal-body h2:first-child{margin-top:0}
.legal-body p{color:var(--ink-soft);line-height:1.75;font-size:13px;margin-bottom:10px}
.legal-body ul{margin:0 0 12px;padding-left:20px;color:var(--ink-soft);font-size:13px;line-height:1.75}
.legal-body li{margin-bottom:4px}
.legal-note{margin-top:20px;padding:14px 16px;border-radius:var(--r-md);background:var(--amber-soft);border:1px solid var(--amber);font-size:12px;color:var(--ink-soft);line-height:1.6}
.legal-updated{color:var(--faint);font-size:10.5px;margin-top:24px}
.contact-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.contact-cards .card{margin:0}
.contact-cards .card b{display:block;font-size:12.5px;margin-bottom:4px}
.contact-cards .card a{color:var(--navy);text-decoration:none;font-weight:700;font-size:12.5px}
html[data-theme="dark"] .contact-cards .card a{color:var(--cyan)}
@media(max-width:600px){.contact-cards{grid-template-columns:1fr}}

/* ---------- language block toggling (legal-page long prose, EN/MR) ---------- */
html:not([lang="mr"]) [data-lang-block="mr"]{display:none}
html[lang="mr"] [data-lang-block="en"]{display:none}

@media(max-width:600px){
  .header-inner{padding:0 10px;gap:4px;height:60px}
  .brand-text strong{font-size:11.5px}
  .brand-text small{font-size:7px;letter-spacing:.08em}
  .brand-mark{width:30px;height:30px;flex:0 0 30px}
  .nav-link{padding:6px 8px;font-size:9.5px}
  .header-tools{gap:4px}
  .tool-btn{height:30px;font-size:12px}
  .theme-btn{width:30px}
  .lang-btn{padding:0 8px;font-size:11px}
}

/* Maha Rank map-only brand mark */
.site-header .brand-mark{width:72px;height:72px;flex:0 0 72px;object-fit:contain;filter:drop-shadow(0 5px 13px rgba(15,61,115,.25));transform:none!important;transition:none!important}
.site-header .brand{gap:0;position:relative;isolation:isolate}
@media(max-width:700px){.site-header .brand-mark{width:60px;height:60px;flex-basis:60px}}
.footer-brand .brand-mark{width:60px;height:60px;flex:0 0 60px;object-fit:contain;filter:drop-shadow(0 4px 11px rgba(15,61,115,.2));}


/* v5 mobile navigation + prominent Maha Rank identity */
.site-header .brand-mark{width:104px;height:88px;flex:0 0 104px;object-fit:contain}
.header-inner{height:82px}
@media(max-width:700px){
  .header-inner{height:76px;padding:0 8px;gap:4px}
  .site-header .brand-mark{width:92px;height:72px;flex-basis:92px}
  .site-header .brand{min-width:92px}
  .site-nav{gap:2px}
  .nav-link{padding:6px 6px;font-size:9px}
  .header-tools{gap:3px}
  .tool-btn{height:30px}
}

/* Exam tools: show every tab cleanly on narrow screens instead of clipping/scrolling. */
@media(max-width:700px){
  .exam-subnav{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:5px;
    padding:5px;
    overflow:visible;
    align-items:stretch;
  }
  .exam-subnav a{
    min-width:0;
    width:100%;
    min-height:42px;
    padding:8px 7px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    line-height:1.2;
    white-space:normal;
    font-size:10px;
  }
  .exam-subnav a.active{color:#fff;background:var(--accent)}
  .exam-subnav .subnav-indicator{display:none}
}
@media(max-width:380px){
  .exam-subnav a{font-size:9px;min-height:40px;padding:7px 5px}
}

/* Keep dashboard/stat cards comfortably readable on phones. */
@media(max-width:700px){
  .pulse-grid{grid-template-columns:1fr}
  .pulse-head{gap:10px}
  .dashboard-distribution .section-title-row{align-items:flex-start}
  .dashboard-distribution .section-title-row h2{font-size:18px;line-height:1.2}
  .dashboard-range-row{gap:7px}
  .dashboard-range-meta{font-size:11px}
  .dashboard-range-track{height:10px}
}

/* v6: compact header + readable Maha Rank identity */
.site-header .header-inner{height:58px;padding:0 14px;gap:8px}
.site-header .brand{width:88px;height:52px;display:flex;align-items:center;justify-content:flex-start}
.site-header .brand-mark{width:88px!important;height:52px!important;flex:0 0 88px!important;object-fit:contain}
@media(max-width:700px){
  .site-header .header-inner{height:56px;padding:0 8px;gap:5px}
  .site-header .brand{width:82px;height:48px;min-width:82px}
  .site-header .brand-mark{width:82px!important;height:48px!important;flex-basis:82px!important}
  .site-nav{gap:1px}
  .site-nav .nav-link{padding:6px 6px;font-size:9px}
  .header-tools{gap:3px}
  .tool-btn{height:29px}
}
@media(max-width:380px){
  .site-header .brand{width:76px;min-width:76px}
  .site-header .brand-mark{width:76px!important;height:46px!important;flex-basis:76px!important}
  .site-nav .nav-link{padding:5px 5px;font-size:8.5px}
}


/* v7: compact Maha Rank identity + user-selectable desktop/mobile layout */
.site-header .brand-mark{width:148px;height:58px;flex:0 0 148px;object-fit:contain;filter:drop-shadow(0 5px 13px rgba(15,61,115,.22));animation:none!important;transform:none!important;transition:none!important}
.site-header .brand{gap:0;min-width:148px;position:relative;isolation:isolate}
.footer-brand .brand-mark{width:118px;height:58px;flex:0 0 118px;object-fit:contain}

/* When desktop layout is selected, the viewport meta is widened to 1120px.
   These rules only provide a safe fallback before the browser applies it. */

@media(max-width:600px){
  
  
}

/* v10: static Maha Rank logo — no animation or hover transform */
.site-header .brand-mark,.footer-brand .brand-mark{animation:none!important;transform:none!important;transition:none!important}

.back-to-top{position:fixed;right:18px;bottom:18px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--accent);color:#fff;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(15,61,115,.28);cursor:pointer;z-index:40;opacity:0;pointer-events:none;transform:translateY(10px);transition:opacity .25s ease,transform .25s ease}
.back-to-top.visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.back-to-top:hover{transform:translateY(-2px)}
@media print{.back-to-top{display:none!important}}
.thane-marking-note{margin:0 0 14px;padding:12px 14px;border:1px solid #dce6f3;background:linear-gradient(135deg,#f8fbff,#fff);color:#52627a;font-size:11px;line-height:1.5;border-radius:14px}.thane-marking-note strong{color:#244f86}.thane-marking-note b{color:#173f78}