/* ==========================================================================
   Site theme — Maroon & Gold
   --------------------------------------------------------------------------
   Re-skins the public pages (landing, charts, guessing forum, guesser login,
   info pages) without touching their markup, data or scripts. Every rule is
   prefixed with `html body` so it outranks the pages' own <style> blocks,
   including the ones that sit further down inside <body>.
   Remove the <link> to this file and the pages look exactly as before.
   ========================================================================== */

:root {
    --mg-bg: #fbf5ea;
    --mg-bg-2: #f4e7cf;
    --mg-card: #ffffff;
    --mg-line: #ecdcb8;
    --mg-line-2: #e2c98f;
    --mg-gold: #c9971c;
    --mg-gold-2: #e9bd45;
    --mg-gold-soft: #fdf4dc;
    --mg-maroon: #7a1f1f;
    --mg-maroon-2: #9b2226;
    --mg-maroon-dark: #4a0f10;
    --mg-text: #2d1414;
    --mg-muted: #6f5553;
    --mg-result: #b3261e;
    --mg-radius: 14px;
    --mg-shadow: 0 6px 18px rgba(74, 15, 16, .08);
    --mg-bar: linear-gradient(135deg, #7a1f1f 0%, #9b2226 100%);
    --mg-bar-gold: linear-gradient(135deg, #e9bd45 0%, #c9971c 100%);
}

/* ---------- Base ---------- */
html body {
    background: var(--mg-bg) linear-gradient(180deg, #f6e6c6 0, var(--mg-bg) 320px) no-repeat;
    color: var(--mg-text);
    font-family: 'Poppins', 'Hind', system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-weight: 500;
    padding: 6px 10px;
}

html body,
html body * {
    font-style: normal !important;
    text-shadow: none !important;
}

html body p,
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6 {
    color: var(--mg-text);
}

html body a {
    color: var(--mg-maroon);
}

/* Content saved from the old editor carries its own inline colours/fonts. */
html body [style*="font-family"] {
    font-family: inherit !important;
}

html body [style*="background-color: rgb(255, 204, 153)"] {
    background-color: transparent !important;
}

html body [style*="background-color: rgb(0, 139, 139)"] {
    background-color: transparent !important;
    color: var(--mg-maroon) !important;
}

html body font[color="blue"],
html body font[color="#0000ff"],
html body [style*="color: blue"],
html body [style*="color:blue"] {
    color: var(--mg-maroon) !important;
}

/* ---------- Cards (every bordered legacy box) ---------- */
html body :is(.logo, .para1, .para2, .para3, .dp-topbox, .satta-text, .cm-patti, .matka-result,
    .mrque-div, .paid-gm, .purpel-header, .red-list > div, .satta-result, .slash-text, .conta,
    .blue-div, .about-us, .disclamer, .faq, .ftr-sm, .let-rock, .bdr, .paa3) {
    background: var(--mg-card) !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: var(--mg-radius) !important;
    box-shadow: var(--mg-shadow) !important;
    outline: 0 !important;
    color: var(--mg-text);
    margin-bottom: 10px;
    overflow: hidden;
}

/* The first card is the brand header: give it a maroon crown. */
html body .logo {
    border-top: 4px solid var(--mg-maroon) !important;
    padding: 6px 10px 10px;
}

html body .logo p,
html body .logo h1,
html body .logo h2 {
    color: var(--mg-maroon-dark) !important;
}

html body .para1 .mrque-div,
html body .para1 {
    border-left: 4px solid var(--mg-gold) !important;
}

html body .mrque-div p,
html body .mrque-div marquee {
    color: var(--mg-maroon) !important;
}

html body .para1 .mrque-div {
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
}

html body .mrque-div img {
    border-radius: 10px;
}

html body .para2 h1,
html body .para2 h2,
html body .para2 p,
html body .satta-text h1 {
    color: var(--mg-maroon-dark) !important;
}

html body .para2 h2,
html body .satta-text p,
html body .para3 {
    color: var(--mg-muted) !important;
}

html body .para3 {
    background: var(--mg-gold-soft) !important;
}

html body .para3 a {
    color: var(--mg-maroon) !important;
    font-weight: 600;
}

/* ---------- Section title bars ---------- */
html body :is(.a-27-title, .banner, .cm-patti h3, .cm-patti h6, .fg-div h6, .matka-result h4, .matka-result h6,
    .my-table.mumraj-sl h4, .my-table.mumraj-sl h6, .blue-div h4, .red-list h4, .red-list-bg-change,
    .purpel-header h6, .disclamer h6, .pby-us, .paid-gm h4) {
    background: var(--mg-bar) !important;
    color: #fff !important;
    border: 0 !important;
    border-bottom: 3px solid var(--mg-gold) !important;
    border-radius: 12px !important;
    animation: none !important;
    clip-path: none !important;
    letter-spacing: .5px;
    font-weight: 600 !important;
    padding: 8px 12px !important;
    margin: 6px 6px 8px !important;
}

html body :is(.a-27-title, .banner, .red-list-bg-change, .pby-us) {
    margin: 0 0 10px !important;
}

html body :is(.a-27-title, .banner, .red-list-bg-change, .pby-us, .purpel-header h6) :is(a, span, h1, h2, h3) {
    color: #fff !important;
}

html body .pby-us {
    font-size: 20px;
}

/* Gold bars (starline headings) */
html body :is(.my-table.cm-sl h4, .my-table.mr-sl h4) {
    background: var(--mg-bar-gold) !important;
    color: var(--mg-maroon-dark) !important;
    border: 0 !important;
    border-radius: 12px 12px 0 0 !important;
    font-weight: 700 !important;
    padding: 8px 12px !important;
    margin: 12px 0 0 !important;
}

/* ---------- Today Lucky Number ---------- */
html body .cm-patti h4 {
    color: var(--mg-maroon) !important;
}

html body .cm-patti p {
    color: var(--mg-result) !important;
    font-weight: 700;
}

html body .cm-patti .aa55,
html body .cm-patti .bb55 {
    border-color: var(--mg-line) !important;
}

/* ---------- Live result box ---------- */
html body .matka-card .gn {
    color: var(--mg-maroon-dark) !important;
    font-weight: 700;
}

html body .matka-card .gn:not(:first-child) {
    border-top: 1px solid var(--mg-line) !important;
}

html body .matka-card .gr {
    color: var(--mg-result) !important;
    font-weight: 700;
}

html body .live-alert,
html body .live-box p {
    color: var(--mg-text) !important;
}

html body :is(.matka-card button, .refresh-btn, .btn_chart, .about-us span, .live-box a[style]) {
    background: var(--mg-bar) !important;
    color: #fff !important;
    border: 1px solid var(--mg-gold) !important;
    border-radius: 999px !important;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(74, 15, 16, .18);
}

html body .install-btn {
    background: var(--mg-bar) !important;
    border-radius: 999px;
}

/* ---------- Market results list ---------- */
html body .satta-result {
    padding: 0 !important;
}

html body .satta-result div {
    border-bottom: 1px solid var(--mg-line) !important;
    padding: 8px 4px 10px;
}

html body .satta-result h4 {
    color: var(--mg-maroon-dark) !important;
    font-weight: 700;
    letter-spacing: .3px;
}

html body .satta-result span {
    background: none !important;
    -webkit-text-fill-color: var(--mg-result) !important;
    color: var(--mg-result) !important;
    font-weight: 700;
    letter-spacing: 1px;
}

html body .satta-result p {
    color: var(--mg-muted) !important;
    font-weight: 500;
}

html body .satta-result .yellowbg,
html body .yellowbg {
    background: var(--mg-gold-soft) !important;
    border-left: 4px solid var(--mg-gold) !important;
    border-bottom: 1px solid var(--mg-line-2) !important;
}

html body .btn_chart {
    font-size: 12px;
    padding: 4px 12px !important;
}

/* ---------- Contact + login buttons ---------- */
html body .conta {
    background: var(--mg-gold-soft) !important;
}

html body .conta p {
    color: var(--mg-maroon-dark) !important;
}

html body .conta a {
    background: var(--mg-bar-gold) !important;
    color: var(--mg-maroon-dark) !important;
    border: 1px solid var(--mg-gold) !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 8px rgba(201, 151, 28, .35) !important;
    font-weight: 700;
}

html body .conta a:hover {
    background: var(--mg-bar) !important;
    color: #fff !important;
}

/* ---------- Starline tables & other data tables ---------- */
html body .my-table table,
html body table {
    box-shadow: var(--mg-shadow);
}

html body :is(.my-table td, .my-table th) {
    border: 1px solid var(--mg-line) !important;
    color: var(--mg-text);
    background: #fff;
}

html body .my-table thead th,
html body .my-table thead {
    background: var(--mg-gold-soft) !important;
    color: var(--mg-maroon-dark) !important;
}

html body .my-table tr td:nth-child(2),
html body .my-table tr td:nth-child(4) {
    color: var(--mg-result) !important;
}

/* ---------- Special game zone / weekly boxes ---------- */
html body .blue-div a {
    background: none !important;
    -webkit-text-fill-color: var(--mg-maroon) !important;
    color: var(--mg-maroon) !important;
    animation: none !important;
    border-bottom: 1px solid var(--mg-line) !important;
    font-weight: 600;
}

html body .red-list p {
    color: var(--mg-text) !important;
    font-weight: 600;
}

html body .red-list p:nth-child(even) {
    background: #fffaf0;
}

/* ---------- Free game zone ---------- */
html body .fg-div h4,
html body .fg-div h4 * {
    background-color: transparent;
}

html body .fg-div > h4 {
    background: var(--mg-bar) !important;
    border: 0 !important;
    border-bottom: 3px solid var(--mg-gold) !important;
    border-radius: var(--mg-radius) !important;
    color: #fff !important;
    padding: 8px !important;
}

html body .fg-div > h4 :is(h1, h2, h3, h4, h5, p, span, div) {
    color: #fff !important;
    background: transparent !important;
}

html body .fg-div > h4 hr {
    border-color: rgba(233, 189, 69, .6);
}

html body .card-1212 {
    border-radius: var(--mg-radius) !important;
    border: 1px solid var(--mg-line);
}

html body .fg-c1 {
    border-color: var(--mg-line) !important;
    background: #fff;
}

html body .fg-div .fg-c1 .fg-p2 {
    background: var(--mg-bar) !important;
    clip-path: none !important;
    border-radius: 999px !important;
    border-bottom: 2px solid var(--mg-gold);
    color: #fff !important;
}

html body .fg-div .fg-c1 .fg-p2 * {
    color: #fff !important;
}

html body .fg-div .fg-c1 :is(.fg-p3, .fg-p4, p:not(.fg-p2)) {
    color: var(--mg-maroon-dark) !important;
}

html body .fg-div .fg-c1 > div {
    border-color: var(--mg-line-2) !important;
}

/* ---------- Kalyan weekly patti tables ---------- */
html body .new-table-add {
    border: 1px solid var(--mg-maroon) !important;
    border-radius: 10px;
    overflow: hidden;
}

html body .new-table-add td {
    border: 1px solid var(--mg-line) !important;
    background: #fff;
}

html body .ntah {
    background: var(--mg-bar-gold) !important;
    color: var(--mg-maroon-dark) !important;
}

html body .ntah-blue-sec {
    color: var(--mg-maroon) !important;
}

html body .ntah-red-sec {
    color: var(--mg-result) !important;
}

/* ---------- Jodi / panel chart link lists ---------- */
html body :is(.ab1, .ab2) {
    border-color: var(--mg-line) !important;
}

html body :is(.ab1 a, .ab2 a, .purpel-header a) {
    color: var(--mg-maroon-dark) !important;
    border-bottom: 1px solid var(--mg-line) !important;
    font-weight: 600;
    transition: background .2s;
}

html body :is(.ab1 a, .ab2 a, .purpel-header a):hover {
    background: var(--mg-gold-soft);
    color: var(--mg-maroon) !important;
}

/* ---------- FAQ, articles, footer ---------- */
html body :is(.faq label, .faq h4, .let-rock .t-rock, .ftr-sm h4, .ftr-sm h2) {
    color: var(--mg-maroon) !important;
}

html body :is(.faq-card, .let-rock .t-rock) {
    border-color: var(--mg-line) !important;
}

html body :is(.faq p, .let-rock p, .let-rock i, .about-us p, .disclamer p) {
    color: var(--mg-text) !important;
    font-weight: 500;
}

html body :is(.faq a, .let-rock a, .about-us b) {
    color: var(--mg-maroon) !important;
}

html body .about-us a {
    background: var(--mg-maroon) !important;
    color: #fff !important;
    border-radius: 6px;
}

html body .let-rock ul {
    border-color: var(--mg-line-2) !important;
}

html body .ftr-sm p,
html body .ftr-sm a {
    color: var(--mg-muted) !important;
}

html body .ftr-sm a:hover {
    color: var(--mg-maroon) !important;
}

/* ---------- Floating buttons ---------- */
html body :is(.mp-btn, .mp-btn-2nd, .btm-btn-f) {
    background: var(--mg-bar) !important;
    color: #fff !important;
    border: 1px solid var(--mg-gold) !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 12px rgba(74, 15, 16, .3) !important;
}

html body .btm-btn-f:hover {
    background: var(--mg-bar-gold) !important;
    color: var(--mg-maroon-dark) !important;
}

/* ==========================================================================
   Jodi / Panel chart pages
   ========================================================================== */
html body .chart-h1,
html body .panel-heading h1 {
    background: var(--mg-bar) !important;
    color: #fff !important;
    border: 0 !important;
    border-bottom: 3px solid var(--mg-gold) !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
    padding: 8px 12px !important;
}

html body .panel.panel-info {
    border: 1px solid var(--mg-line) !important;
    border-radius: var(--mg-radius) !important;
    background: #fff;
    box-shadow: var(--mg-shadow);
    overflow: hidden;
}

html body :is(table, th, td) {
    border-color: var(--mg-line) !important;
}

html body thead {
    background: var(--mg-bar-gold) !important;
    color: var(--mg-maroon-dark) !important;
}

html body thead th {
    color: var(--mg-maroon-dark) !important;
    font-weight: 700;
}

html body tbody td {
    background: #fff;
    color: var(--mg-text);
}

html body tbody tr:nth-child(even) td {
    background: #fffaf0;
}

/* Jodi / panel highlights keep their meaning (red), in the theme's red —
   exactly the classes the chart pages colour red, nothing wider. */
html body :is(.r, .red, .chart-11, .chart-22, .chart-33, .chart-44, .chart-55, .chart-66, .chart-77, .chart-88, .chart-99, .chart-00, .chart-05, .chart-50, .chart-16, .chart-61, .chart-27, .chart-72, .chart-38, .chart-83, .chart-49, .chart-94, .chat-05, .chat-50, .chat-16, .chat-61, .chat-27, .chat-72, .chat-38, .chat-83, .chat-49, .chat-94, .css-11, .css-16, .css-22, .css-27, .css-33, .css-38, .css-44, .css-49, .css-50, .css-55, .css-61, .css-66, .css-72, .css-83, .css-88, .css-94, .css-99, .css-05, .css-00, .css-77, .css-star) {
    color: var(--mg-result) !important;
}

html body .chart-result {
    background: #fff !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: var(--mg-radius) !important;
    box-shadow: var(--mg-shadow) !important;
}

html body .chart-result div {
    color: var(--mg-maroon-dark) !important;
}

html body .chart-result span {
    color: var(--mg-result) !important;
}

html body .chart-result a,
html body .button2 {
    background: var(--mg-bar) !important;
    color: #fff !important;
    border: 1px solid var(--mg-gold) !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 8px rgba(74, 15, 16, .2) !important;
}

html body .chart-list {
    background: #fff;
    border: 1px solid var(--mg-line) !important;
    border-radius: var(--mg-radius) !important;
    box-shadow: var(--mg-shadow);
    overflow: hidden;
}

html body .chart-list h4 {
    background: var(--mg-bar) !important;
    color: #fff !important;
    border-radius: 0 !important;
}

html body .chart-list a {
    color: var(--mg-maroon-dark) !important;
    border-bottom: 1px solid var(--mg-line) !important;
}

html body .chart-list a:hover {
    background: var(--mg-gold-soft) !important;
}

html body footer {
    background: #fff !important;
    color: var(--mg-maroon) !important;
    border: 1px solid var(--mg-line) !important;
    border-top: 4px solid var(--mg-maroon) !important;
    border-radius: var(--mg-radius) !important;
    box-shadow: var(--mg-shadow);
}

html body footer > div {
    border-bottom-color: var(--mg-line) !important;
}

html body footer :is(.ftr-icon, p span, a) {
    color: var(--mg-maroon) !important;
}

/* ==========================================================================
   Guessing forum + guesser login / register
   ========================================================================== */
html body :is(.logo-div, .login-area, .forum-rules1, .forum-special-offer) {
    background: #fff !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: var(--mg-radius) !important;
    box-shadow: var(--mg-shadow);
}

html body [style*="border: 2px solid #eb008b"],
html body [style*="border:2px solid #eb008b"] {
    border: 1px solid var(--mg-line) !important;
    border-radius: var(--mg-radius) !important;
    background: #fff;
    box-shadow: var(--mg-shadow);
}

html body :is(.login-area h4, .forum-rules1 h4, .panel-info .panel-heading, .headingBck) {
    background: var(--mg-bar) !important;
    color: #fff !important;
    border-bottom: 3px solid var(--mg-gold) !important;
    box-shadow: none !important;
}

html body .extra-feature h5 {
    color: var(--mg-maroon) !important;
}

html body :is(.login-area input, .login-area select, .login-area textarea, .form-control) {
    border: 1px solid var(--mg-line-2) !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: var(--mg-text) !important;
    font-family: inherit !important;
}

html body :is(.login-area input, .login-area select, .login-area textarea, .form-control):focus {
    border-color: var(--mg-maroon) !important;
    box-shadow: 0 0 0 3px rgba(122, 31, 31, .12) !important;
    outline: 0 !important;
}

html body :is(.btn-mahi, .login-area button, .login-area .btn, .login-area a.btn-aa, .ex-feature, .extra-feature a,
    .btn-info, .btn-success, a[style*="#9c27b0"], a[style*="#2196f3"], a[style*="#e91e63"]) {
    background: var(--mg-bar) !important;
    color: #fff !important;
    border: 1px solid var(--mg-gold) !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 8px rgba(74, 15, 16, .2) !important;
}

html body :is(.btn-mahi, .login-area button, .login-area .btn, .ex-feature, .extra-feature a):hover {
    background: var(--mg-bar-gold) !important;
    color: var(--mg-maroon-dark) !important;
}

/* forum posts */
html body .my-card {
    background: #fff !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: var(--mg-radius) !important;
    box-shadow: var(--mg-shadow) !important;
}

html body .my-card .card-head {
    background: var(--mg-bar) !important;
    border-bottom: 3px solid var(--mg-gold) !important;
}

html body .my-card .card-head :is(a, h5) {
    color: #fff !important;
}

html body .my-card .card-body {
    background: linear-gradient(180deg, var(--mg-gold-soft), #fff 70%);
    color: var(--mg-text) !important;
}

html body .my-card .card-body p {
    color: var(--mg-text) !important;
}

html body .card-footer {
    border-top: 1px solid var(--mg-line) !important;
    background: #fff;
}

html body .card-footer .card-btn {
    background: #fff !important;
    color: var(--mg-maroon) !important;
    border-right: 1px solid var(--mg-line) !important;
    font-weight: 600;
}

html body .card-footer .card-btn:hover {
    background: var(--mg-gold-soft) !important;
}

html body .forum-post-footer1,
html body .forum-post-footer2,
html body .panel-success :is(.panel-footer, .panel-heading) {
    background: var(--mg-gold-soft) !important;
}

html body .panel,
html body .panel-info,
html body .navbar-default {
    border-color: var(--mg-line) !important;
}

/* bottom app-style nav */
html body .fixed-footer {
    box-shadow: 0 -4px 16px rgba(74, 15, 16, .25) !important;
}

html body .fixed-footer a {
    background: var(--mg-bar) !important;
    border-left: 1px solid rgba(233, 189, 69, .35) !important;
    color: #fff !important;
}

html body .fixed-footer a:hover {
    background: var(--mg-maroon-dark) !important;
    color: var(--mg-gold-2) !important;
}

/* ==========================================================================
   How-to-play / help-desk (template_u) nav and plain info pages
   ========================================================================== */
html body nav a {
    color: var(--mg-maroon) !important;
    font-weight: 600;
}

html body :is(h1, h2, h3) {
    font-weight: 700;
}

/* Forum: pink-bordered boxes that come from its own ".para1 p" / form styles
   (scoped away from the landing page's .para1 welcome text). */
html body :is(.para1 > div:not(.mrque-div) > p, .tab-pane > form.form) {
    background: #fff !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: var(--mg-radius) !important;
    box-shadow: var(--mg-shadow) !important;
}

/* ...except the text inside the "Duniya Ko Dikhao" pill link, which is part of the pill. */
html body .para1 > div > a > p {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #fff !important;
}

/* ==========================================================================
   Motion & polish layer
   --------------------------------------------------------------------------
   Sirf CSS — kisi page ka markup ya script nahi badla. Animation halki rakhi
   gayi hai (transform/opacity par hi), taaki mobile par page slow na ho.
   Jise motion pasand nahi (OS me "Reduce Motion" on hai) uske liye file ke
   aakhir me sab band kar diya gaya hai.
   Poora section hata dene par page pehle jaisa hi dikhega.
   ========================================================================== */

@keyframes bm-fade-up   { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes bm-fade-down { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@keyframes bm-pop       { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
@keyframes bm-sheen     { from { background-position: -220% 0; } to { background-position: 220% 0; } }
@keyframes bm-glow      { 0%, 100% { box-shadow: 0 0 0 0 rgba(201,151,28,.45); } 50% { box-shadow: 0 0 0 7px rgba(201,151,28,0); } }
@keyframes bm-blink     { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

/* --- Logo aur tagline ------------------------------------------------- */
html body .logo img {
    animation: bm-fade-down .5s ease-out both;
}

html body .bm-tagline {
    display: block;
    margin: 6px 0 2px;
    padding: 0 8px;
    text-align: center;
    animation: bm-fade-up .55s .1s ease-out both;
}

html body .bm-tagline .bm-tag-en,
html body .bm-tagline .bm-tag-hi {
    display: block;
    line-height: 1.45;
}

html body .bm-tagline .bm-tag-en {
    color: var(--mg-maroon-dark);
    font-size: 15px;
    font-weight: 600;
}

html body .bm-tagline .bm-tag-en b {
    background: linear-gradient(100deg, var(--mg-maroon) 20%, var(--mg-gold) 45%, var(--mg-maroon) 70%);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: bm-sheen 4.5s linear infinite;
}

html body .bm-tagline .bm-tag-hi {
    color: var(--mg-muted);
    font-size: 13px;
    font-weight: 500;
}

/* --- Market list: ek-ek karke upar aati cards -------------------------- */
html body .satta-result > div {
    animation: bm-fade-up .42s ease-out both;
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

html body .satta-result > div:nth-child(1)  { animation-delay: .02s; }
html body .satta-result > div:nth-child(2)  { animation-delay: .05s; }
html body .satta-result > div:nth-child(3)  { animation-delay: .08s; }
html body .satta-result > div:nth-child(4)  { animation-delay: .11s; }
html body .satta-result > div:nth-child(5)  { animation-delay: .14s; }
html body .satta-result > div:nth-child(6)  { animation-delay: .17s; }
html body .satta-result > div:nth-child(7)  { animation-delay: .20s; }
html body .satta-result > div:nth-child(8)  { animation-delay: .23s; }
html body .satta-result > div:nth-child(n+9) { animation-delay: .26s; }

html body .satta-result > div:hover {
    background-color: #fffaf0;
    box-shadow: inset 3px 0 0 var(--mg-gold);
}

/* Aaj highlight kiye gaye market par halki gold pulse */
html body .satta-result .yellowbg,
html body .yellowbg {
    animation: bm-glow 2.8s ease-in-out infinite;
}

/* Result number thoda bada aur saaf */
html body .satta-result span {
    /* sirf rang/size — display ya position nahi, warna card ka layout bigadta hai */
    transition: color .18s ease;
}

/* --- Chart buttons: hover par uthte hain aur gold chamak ---------------- */
html body :is(.btn_chart, .matka-card button, .refresh-btn) {
    /* position/overflow yahan set NAHI karna — ye buttons absolute positioned hain. */
    transition: box-shadow .16s ease, filter .16s ease;
}

html body :is(.btn_chart, .matka-card button, .refresh-btn):hover {
    box-shadow: 0 6px 16px -8px rgba(74, 15, 16, .7);
    filter: brightness(1.12);
}

html body :is(.btn_chart, .matka-card button, .refresh-btn):active {
    filter: brightness(.95);
}

/* --- Section headings: gold sheen ke saath aate hain -------------------- */
html body :is(.banner, .a-27-title, .purpel-header) {
    animation: bm-pop .45s ease-out both;
}



/* "LIVE RESULT" jaise heading par dhadakta dot */
html body .satta-result h4:has(+ span),
html body .matka-result h4 {
    transition: color .18s ease;
}

html body h4:is(.banner, .live-head)::after,
html body .live-box h4::after {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-left: 7px;
    border-radius: 50%;
    background: #35d07f;
    vertical-align: middle;
    animation: bm-blink 1.25s ease-in-out infinite;
}

/* --- Info cards / FAQ: halka sa upar aana ------------------------------ */
html body :is(.faq-card, .let-rock, .about-us, .weekly-line, .new-table-add) {
    animation: bm-fade-up .45s ease-out both;
    transition: box-shadow .18s ease, transform .18s ease;
}

html body :is(.faq-card, .new-table-add):hover {
    box-shadow: 0 8px 20px -14px rgba(74, 15, 16, .6);
    transform: translateY(-2px);
}

/* --- Chart tables: row hover ------------------------------------------- */
html body :is(.chart-table, .panel-chart) tbody tr {
    transition: background-color .15s ease;
}

html body :is(.chart-table, .panel-chart) tbody tr:hover {
    background-color: var(--mg-gold-soft) !important;
}

/* --- Links ------------------------------------------------------------- */
html body .para1 a,
html body .ftr-sm a {
    transition: color .15s ease, opacity .15s ease;
}

html body .para1 a:hover,
html body .ftr-sm a:hover {
    opacity: .82;
}

/* --- Jinhone "Reduce Motion" on kiya hai, unke liye sab band ------------ */
@media (prefers-reduced-motion: reduce) {
    html body *,
    html body *::before,
    html body *::after {
        animation: none !important;
        transition: none !important;
    }
}

/* ==========================================================================
   Maroon buttons aur title bars par chalti hui shimmer
   --------------------------------------------------------------------------
   background-position animate karna yahan kaam nahi karta, kyunki upar ke
   rules me `background: ... !important` hai aur !important animation se jeet
   jaata hai. Isliye ek ::before band (light streak) element ke andar chalaya
   gaya hai. Buttons pehle se absolute/fixed hain, is liye unka position nahi
   badla — sirf overflow clip kiya gaya hai.
   ========================================================================== */

@keyframes bm-sweep {
    from { transform: translateX(-130%) skewX(-18deg); }
    to   { transform: translateX(260%)  skewX(-18deg); }
}

/* Title bars static hain — inhe containing block banana padega */
html body :is(.a-27-title, .banner, .cm-patti h3, .cm-patti h6, .fg-div h6,
    .matka-result h4, .matka-result h6, .my-table.mumraj-sl h4, .my-table.mumraj-sl h6,
    .blue-div h4, .red-list h4, .red-list-bg-change, .purpel-header h6,
    .disclamer h6, .pby-us, .paid-gm h4) {
    position: relative;
    overflow: hidden;
}

/* Ye buttons pehle se absolute/fixed hain — inka position chhedna mana hai,
   warna Jodi/Panel result ke upar chadh jaate hain. Sirf clip karo. */
html body :is(.refresh-btn, .btn_chart) {
    overflow: hidden;
}

/* Ye static inline-block buttons hain — inhe positioned banana zaroori hai,
   warna inka ::before poore page par faila ek bada band ban jaata hai. */
html body :is(.matka-card button, .about-us span, .about-us a,
    .install-btn, .live-box a[style]) {
    position: relative;
    overflow: hidden;
}

html body :is(.a-27-title, .banner, .cm-patti h3, .cm-patti h6, .fg-div h6,
    .matka-result h4, .matka-result h6, .my-table.mumraj-sl h4, .my-table.mumraj-sl h6,
    .blue-div h4, .red-list h4, .red-list-bg-change, .purpel-header h6,
    .disclamer h6, .pby-us, .paid-gm h4,
    .matka-card button, .refresh-btn, .btn_chart, .about-us span,
    .about-us a, .install-btn, .live-box a[style])::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 45%;
    pointer-events: none;
    background: linear-gradient(
        100deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, .18) 40%,
        rgba(233, 189, 69, .40) 50%,
        rgba(255, 255, 255, .18) 60%,
        rgba(255, 255, 255, 0) 100%
    );
    animation: bm-sweep 3.8s linear infinite;
}

/* Chhote buttons par thodi tez */
html body :is(.matka-card button, .refresh-btn, .btn_chart, .about-us span,
    .about-us a, .install-btn)::before {
    animation-duration: 2.6s;
}

/* Hover par ruk jaati hai */
html body :is(.matka-card button, .refresh-btn, .btn_chart, .about-us span,
    .about-us a, .install-btn):hover::before {
    animation-play-state: paused;
}

@media (prefers-reduced-motion: reduce) {
    html body *::before { animation: none !important; }
}
