*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    background: #1f1f1f;
    color: #f1f1f1;
    font-family: Rubik, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Noto Sans Thai",
                 "Noto Sans Bengali", "Noto Sans Devanagari", sans-serif;
    font-size: 15px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; border: 0; }
a { color: #ef4444; text-decoration: none; }
a:hover { color: #14b8a6; text-decoration: underline; }

h1, h2, h3, h4 { color: #f1f1f1; font-weight: 700; line-height: 1.25; margin: 0 0 12px; }

.mi-sr {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}


.mi-wrap { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.mi-main { display: block; }


.mi-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 12px 22px; border: 0; border-radius: 10px;
    font: inherit; font-weight: 600; font-size: 14px;
    cursor: pointer; text-decoration: none; transition: background .2s, color .2s, box-shadow .2s;
}
.mi-btn-primary { background: #b91c1c; color: #ffffff; }
.mi-btn-primary:hover { background: #14b8a6; color: #1c1917; text-decoration: none; }
.mi-btn-cta { background: #14b8a6; color: #1c1917; box-shadow: 0 6px 18px rgba(20,184,166,.25); }
.mi-btn-cta:hover { background: rgba(20,184,166,.85); color: #1c1917; text-decoration: none; }
.mi-btn-gray { background: #6c757d; color: #ffffff; }
.mi-btn-gray:hover { background: #5a626a; text-decoration: none; }


.mi-header { position: relative; z-index: 60; }

.mi-topbar { background: #1c1917; border-bottom: 1px solid rgba(239,68,68,.14); }
.mi-topbar-ins { display: flex; align-items: center; gap: 18px; min-height: 66px; }

.mi-logo { font-size: 22px; font-weight: 700; letter-spacing: .5px; color: #f1f1f1; }
.mi-logo-mark { color: #f1f1f1; }
.mi-logo-accent { color: #ef4444; }
.mi-logo:hover { text-decoration: none; }

.mi-topmenu { display: flex; gap: 2px; list-style: none; margin: 0 0 0 auto; padding: 0; }
.mi-topmenu-item a {
    display: inline-flex; align-items: center; gap: 6px;
    color: #b5b5b5; font-size: 13px; padding: 8px 10px; border-radius: 8px;
}
.mi-topmenu-item a:hover { color: #ef4444; background: rgba(239,68,68,.08); text-decoration: none; }
.mi-top-icon { color: #b91c1c; font-size: 11px; }
.mi-toptext { white-space: nowrap; }

.mi-top-tools { display: flex; align-items: center; gap: 8px; }

.mi-lang { position: relative; }
.mi-lang-cur {
    list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 12px; border: 1px solid #3a3a3a; border-radius: 8px;
    color: #f1f1f1; font-size: 13px; background: #141414;
}
.mi-lang-cur::-webkit-details-marker { display: none; }
.mi-globe { color: #ef4444; }
.mi-caret { font-size: 10px; opacity: .7; }
.mi-lang-list {
    position: absolute; top: 112%; right: 0; min-width: 158px; list-style: none; margin: 0; padding: 6px;
    background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 10px; display: none;
    box-shadow: 0 18px 40px rgba(28,25,23,.6); z-index: 80;
}
.mi-lang[open] .mi-lang-list { display: block; }
.mi-lang-list li a { display: block; padding: 8px 10px; color: #f1f1f1; font-size: 13px; border-radius: 6px; }
.mi-lang-list li a:hover { background: rgba(185,28,28,.28); color: #ef4444; text-decoration: none; }
.mi-lang-on span { display: block; padding: 8px 10px; color: #ef4444; background: rgba(239,68,68,.08); border-radius: 6px; font-size: 13px; }

.mi-icon-btn, .mi-burger {
    width: 40px; height: 40px; border-radius: 10px; cursor: pointer;
    background: #141414; border: 1px solid #3a3a3a; color: #f1f1f1;
    display: inline-flex; align-items: center; justify-content: center;
}
.mi-icon-btn:hover { color: #ef4444; border-color: rgba(239,68,68,.5); }
.mi-burger { display: none; flex-direction: column; gap: 4px; }
.mi-burger span { display: block; width: 18px; height: 2px; background: #f1f1f1; }


.mi-navbar {
    background: #1c1917;
    border-top: 1px solid rgba(185,28,28,.25);
    border-bottom: 2px solid rgba(239,68,68,.35);
}
.mi-menu { display: flex; gap: 2px; list-style: none; margin: 0; padding: 0; }
.mi-navitem { position: relative; }
.mi-navlink {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 15px 16px; color: #e6e6e6; font-weight: 600; font-size: 14px;
}
.mi-navlink:hover { color: #ef4444; text-decoration: none; }
.mi-navitem.mi-current .mi-navlink { color: #ef4444; box-shadow: inset 0 -3px 0 #ef4444; }
.mi-dropdown {
    position: absolute; top: 100%; left: 0; min-width: 212px; display: none; z-index: 70;
    background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 0 0 12px 12px;
    box-shadow: 0 20px 44px rgba(28,25,23,.6);
}
.mi-navitem:hover .mi-dropdown { display: block; }
.mi-navitem.mi-has-sub .mi-caret { margin-left: 5px; transition: transform .18s; }
.mi-navitem.mi-has-sub:hover .mi-caret { transform: rotate(180deg); color: #ef4444; }
.mi-dropdown-inner { list-style: none; margin: 0; padding: 8px; }
.mi-dropdown-inner a { display: block; padding: 9px 12px; color: #e6e6e6; font-size: 13px; border-radius: 8px; }
.mi-dropdown-inner a:hover { background: rgba(185,28,28,.28); color: #ef4444; text-decoration: none; }


.mi-searchbar { display: none; background: #141414; border-bottom: 1px solid #3a3a3a; padding: 14px 0; }
.mi-searchbar.mi-open { display: block; }
.mi-searchbar form { display: flex; gap: 10px; }
.mi-searchbar input {
    flex: 1; background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 10px;
    padding: 12px 16px; color: #f1f1f1; font: inherit;
}
.mi-searchbar input:focus { outline: 0; border-color: #ef4444; box-shadow: 0 0 0 3px rgba(239,68,68,.18); }


.mi-hero {
    padding: 46px 0 42px;
    background: linear-gradient(150deg, #1c1917 0%, #141414 55%, rgba(185,28,28,.35) 100%);
    border-bottom: 1px solid #2b2b2b;
}
.mi-hero-ins { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 34px; align-items: start; }
.mi-hero-lead { min-width: 0; }
.mi-tag {
    display: inline-flex; align-items: center; gap: 6px;
    background: rgba(239,68,68,.12); color: #ef4444; border: 1px solid rgba(239,68,68,.4);
    border-radius: 999px; padding: 6px 14px; font-size: 12px; font-weight: 600;
    letter-spacing: .6px; text-transform: uppercase;
}
.mi-hero h1 { font-size: 34px; margin: 16px 0 12px; }
.mi-lead { color: #b5b5b5; font-size: 15.5px; max-width: 640px; }
.mi-hero-cta { margin-top: 22px; }

.mi-hero-aside { background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px; padding: 16px; }
.mi-hero-list { list-style: none; margin: 0; padding: 0; }
.mi-hero-li { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px dashed #3a3a3a; }
.mi-hero-li:last-child { border-bottom: 0; }
.mi-hero-rank {
    width: 24px; height: 24px; border-radius: 7px; background: #ef4444; color: #1c1917;
    font-weight: 700; font-size: 12px; display: inline-flex; align-items: center; justify-content: center;
}
.mi-hero-logo { width: 74px; flex: 0 0 74px; }
.mi-hero-name { color: #f1f1f1; font-size: 13.5px; font-weight: 600; }
.mi-hero-name:hover { color: #ef4444; text-decoration: none; }


.mi-sec { margin: 34px 0; }
.mi-sec-head { margin-bottom: 18px; }
.mi-sec-title { position: relative; font-size: 22px; margin: 0; padding-left: 16px; }
.mi-sec-title::before {
    content: ''; position: absolute; left: 0; top: 3px; bottom: 3px; width: 5px;
    border-radius: 3px; background: #ef4444;
}
.mi-sec-sub { color: #b5b5b5; font-size: 14px; margin: 8px 0 0; }


.mi-featured { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
.mi-featured-item {
    display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 16px; align-items: center;
    background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px; padding: 16px;
    transition: border-color .2s, box-shadow .2s;
}
.mi-featured-item:hover { border-color: rgba(239,68,68,.55); box-shadow: 0 14px 34px rgba(239,68,68,.12); }
.mi-featured-logo { position: relative; width: 110px; flex: 0 0 110px; }
.mi-featured-logo-link { display: block; }
.mi-featured-rank {
    position: absolute; top: -8px; left: -8px; z-index: 1;
    width: 26px; height: 26px; border-radius: 8px; background: #ef4444; color: #1c1917;
    font-weight: 700; font-size: 13px; display: inline-flex; align-items: center; justify-content: center;
}
.mi-featured-body { min-width: 0; }
.mi-featured-name { display: block; color: #f1f1f1; font-size: 17px; font-weight: 700; margin-bottom: 6px; }
.mi-featured-name:hover { color: #ef4444; text-decoration: none; }
.mi-featured-rating { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.mi-featured-score { color: #14b8a6; font-weight: 700; font-size: 14px; }
.mi-featured-bonus { color: #ef4444; font-weight: 600; font-size: 14px; margin-bottom: 4px; }
.mi-featured-blurb { color: #b5b5b5; font-size: 13px; }
.mi-featured-cta { display: flex; flex-direction: column; gap: 8px; }
.mi-featured-cta .mi-btn { width: 100%; }
.mi-featured-more { color: #b91c1c; font-size: 12.5px; text-align: center; }
.mi-featured-more:hover { color: #ef4444; text-decoration: none; }

.mi-stars { color: #ef4444; font-size: 13px; letter-spacing: 1px; }
.mi-stars .mi-off { color: #4a4a4a; }
.mi-terms { color: #8a8a8a; font-size: 11.5px; line-height: 1.5; margin-top: 2px; }


.mi-features { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.mi-feature {
    background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px;
    padding: 22px 18px; text-align: center;
}
.mi-feature-icon {
    width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; font-size: 24px;
    color: #ef4444; background: rgba(185,28,28,.25); border: 1px solid rgba(185,28,28,.5);
}
.mi-feature-title { font-size: 16px; margin: 0 0 8px; }
.mi-feature-text { color: #b5b5b5; font-size: 13.5px; margin: 0; }


.mi-accordion { background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px; overflow: hidden; }
.mi-acc-item { border-bottom: 1px solid #3a3a3a; }
.mi-acc-item:last-child { border-bottom: 0; }
.mi-acc-title {
    display: flex; align-items: center; justify-content: space-between; gap: 14px;
    cursor: pointer; list-style: none; padding: 16px 18px; font-weight: 600; font-size: 15px; color: #f1f1f1;
}
.mi-acc-title::-webkit-details-marker { display: none; }
.mi-acc-item[open] .mi-acc-title { color: #ef4444; background: rgba(239,68,68,.06); }
.mi-acc-arrow { color: #b91c1c; font-size: 12px; transition: transform .25s; }
.mi-acc-item[open] .mi-acc-arrow { transform: rotate(180deg); color: #ef4444; }
.mi-acc-content { padding: 0 18px 18px; color: #b5b5b5; font-size: 14px; }
.mi-acc-content p { margin: 0; }


.mi-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.mi-chip {
    display: inline-block; padding: 9px 16px; border: 1px solid #3a3a3a; border-radius: 999px;
    background: #2b2b2b; color: #e6e6e6; font-size: 13.5px;
}
.mi-chip:hover { border-color: #ef4444; color: #ef4444; background: rgba(239,68,68,.08); text-decoration: none; }


.mi-news { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
.mi-post { background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px; padding: 18px; transition: border-color .2s; }
.mi-post:hover { border-color: rgba(185,28,28,.6); }
.mi-post-cat a {
    display: inline-block; font-size: 11px; text-transform: uppercase; letter-spacing: .6px;
    color: #ef4444; background: rgba(239,68,68,.1); border-radius: 6px; padding: 3px 9px; margin-bottom: 8px;
}
.mi-post-title { font-size: 16.5px; margin: 0 0 8px; line-height: 1.4; }
.mi-post-title a { color: #f1f1f1; }
.mi-post-title a:hover { color: #ef4444; text-decoration: none; }
.mi-post-excerpt { color: #b5b5b5; font-size: 13.5px; margin: 0 0 10px; }
.mi-post-meta { display: flex; gap: 14px; color: #8a8a8a; font-size: 12px; }


.mi-card { background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px; padding: 16px; text-align: center; }
.mi-card-logo { width: 120px; margin: 0 auto 12px; }
.mi-card-name { display: block; color: #f1f1f1; font-weight: 700; font-size: 15px; margin-bottom: 6px; }
.mi-card-name:hover { color: #ef4444; text-decoration: none; }
.mi-card-rating { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 8px; }
.mi-score { color: #14b8a6; font-weight: 700; font-size: 13px; }
.mi-card-bonus { color: #ef4444; font-weight: 600; font-size: 13.5px; }
.mi-card-meta { color: #b5b5b5; font-size: 12px; margin-top: 3px; }
.mi-card-cta { width: 100%; margin-top: 12px; }
.mi-card-review { display: block; margin-top: 8px; color: #b91c1c; font-size: 12.5px; }
.mi-card-review:hover { color: #ef4444; text-decoration: none; }
.mi-card-note { color: #8a8a8a; font-size: 11px; margin-top: 6px; }


.mi-home-cols, .mi-cols, .mi-cats-layout, .mi-post-layout {
    display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 26px; align-items: start;
}
.mi-home-cols { margin-top: 30px; padding-bottom: 34px; }
.mi-cats-layout, .mi-post-layout { padding-bottom: 34px; }
.mi-side { display: block; }
.mi-main-col, .mi-post-main, .mi-home-main { min-width: 0; }

.mi-widget { background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px; padding: 16px; margin-bottom: 18px; }
.mi-widget-title { font-size: 15px; margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px solid #3a3a3a; }


.mi-toc { border-left: 3px solid #b91c1c; }
.mi-toc-list { list-style: none; margin: 0; padding: 0; max-height: 400px; overflow-y: auto; }
.mi-toc-item { border-bottom: 1px dashed #383838; }
.mi-toc-item:last-child { border-bottom: 0; }
.mi-toc-link { display: flex; align-items: center; gap: 8px; padding: 9px 4px; color: #d9d9d9; font-size: 13.5px; transition: padding-left .15s, color .15s; }
.mi-toc-link::before { content: '\203A'; color: #b91c1c; font-size: 14px; line-height: 1; }
.mi-toc-link:hover { background: rgba(239,68,68,.08); color: #ef4444; padding-left: 10px; text-decoration: none; }

.mi-widget-list { list-style: none; margin: 0; padding: 0; }
.mi-widget-list li { border-bottom: 1px solid #333333; }
.mi-widget-list li:last-child { border-bottom: 0; }
.mi-widget-list a { display: block; padding: 9px 0; color: #d9d9d9; font-size: 13.5px; }
.mi-widget-list a:hover { color: #ef4444; text-decoration: none; }
.mi-widget-promo { text-align: center; }
.mi-widget-ad img { border-radius: 10px; }
.mi-widget-ad p { color: #b5b5b5; font-size: 12.5px; }


.mi-crumbs { padding: 18px 0 0; color: #8a8a8a; font-size: 13px; }
.mi-crumbs a { color: #b5b5b5; }
.mi-crumbs a:hover { color: #ef4444; text-decoration: none; }
.mi-crumb-sep { margin: 0 6px; color: #b91c1c; }
.mi-crumb-cur { color: #ef4444; }

.mi-cat-head { margin: 14px 0 22px; }
.mi-cat-head h1 { font-size: 28px; margin: 0 0 6px; }
.mi-cat-count { color: #8a8a8a; font-size: 13px; margin: 0; }

.mi-feature-article {
    background: #2b2b2b; border: 1px solid #3a3a3a; border-left: 4px solid #ef4444;
    border-radius: 14px; padding: 22px; margin-bottom: 18px;
}
.mi-feature-article h2 { font-size: 22px; margin: 10px 0; }
.mi-feature-article h2 a { color: #f1f1f1; }
.mi-feature-article h2 a:hover { color: #ef4444; text-decoration: none; }
.mi-badge {
    display: inline-block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px;
    color: #1c1917; background: #ef4444; border-radius: 6px; padding: 3px 10px;
}
.mi-excerpt { color: #b5b5b5; font-size: 14px; }
.mi-meta { display: flex; flex-wrap: wrap; gap: 16px; color: #8a8a8a; font-size: 12.5px; }
.mi-meta a { color: #b5b5b5; }
.mi-meta a:hover { color: #ef4444; text-decoration: none; }
.mi-meta-lg { font-size: 13.5px; }

.mi-empty { background: #2b2b2b; border: 1px dashed #3a3a3a; border-radius: 14px; padding: 34px; text-align: center; color: #8a8a8a; }
.mi-pager { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 22px 0; }
.mi-page-nav, .mi-page-cur {
    padding: 8px 13px; border: 1px solid #3a3a3a; border-radius: 8px; background: #2b2b2b;
    color: #e6e6e6; font-size: 13px;
}
.mi-page-nav:hover { border-color: #ef4444; color: #ef4444; text-decoration: none; }
.mi-page-cur { background: rgba(239,68,68,.12); border-color: #ef4444; color: #ef4444; }
.mi-on { font-weight: 700; }


.mi-article { background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px; padding: 26px; }
.mi-post-head { margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid #3a3a3a; }
.mi-post-head h1 { font-size: 28px; margin: 12px 0; }
.mi-content { color: #e2e2e2; font-size: 15.5px; line-height: 1.75; }
.mi-content h2, .mi-content h3 { margin-top: 1.4em; }
.mi-content a { color: #ef4444; }
.mi-content img { border-radius: 10px; }
.mi-content blockquote {
    margin: 1em 0; padding: 8px 16px; border-left: 3px solid #b91c1c;
    background: rgba(185,28,28,.08); color: #b5b5b5; border-radius: 0 10px 10px 0;
}


.mi-search-head { padding: 24px 0 0; }
.mi-search-head h1 { font-size: 26px; margin: 0 0 16px; }
.mi-search-head h1 em { color: #ef4444; font-style: normal; }
.mi-searchbox { display: flex; gap: 10px; margin-bottom: 22px; }
.mi-searchbox input {
    flex: 1; background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 10px;
    padding: 12px 16px; color: #f1f1f1; font: inherit;
}
.mi-searchbox input:focus { outline: 0; border-color: #ef4444; box-shadow: 0 0 0 3px rgba(239,68,68,.18); }


.mi-home .mi-main, .mi-cat .mi-main, .mi-search .mi-main,
.mi-post-page .mi-main, .mi-profile-page .mi-main { min-height: 60vh; }


.mi-footer { background: #1c1917; border-top: 1px solid #2b2b2b; margin-top: 20px; padding-top: 32px; }
.mi-footer-top { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr; gap: 24px; padding-bottom: 26px; }
.mi-footer-col h4 { font-size: 14px; color: #ef4444; margin: 0 0 12px; text-transform: uppercase; letter-spacing: .6px; }
.mi-footer-col ul { list-style: none; margin: 0; padding: 0; }
.mi-footer-col ul li { margin-bottom: 8px; }
.mi-footer-col a { color: #b5b5b5; font-size: 13px; }
.mi-footer-col a:hover { color: #ef4444; text-decoration: none; }
.mi-footer-about h4 { font-size: 18px; color: #f1f1f1; text-transform: none; letter-spacing: 0; }
.mi-footer-about p { color: #b5b5b5; font-size: 13px; }
.mi-footer-more { color: #b91c1c; font-size: 13px; }
.mi-footer-more:hover { color: #ef4444; text-decoration: none; }
.mi-footer-follow .mi-socials { justify-content: flex-start; }

.mi-socials { display: flex; flex-wrap: wrap; gap: 10px; }
.mi-socials a {
    width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center;
    background: #2b2b2b; border: 1px solid #3a3a3a; color: #ef4444;
}
.mi-socials a:hover { background: var(--mi-brand, #ef4444); color: #1c1917; text-decoration: none; }

.mi-footer-copy {
    display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px;
    padding: 16px 0; border-top: 1px solid #2b2b2b; color: #8a8a8a; font-size: 12.5px;
}
.mi-18 {
    display: inline-block; margin-right: 8px; padding: 1px 6px; border-radius: 5px;
    background: rgba(28,25,23,.85); border: 1px solid rgba(20,184,166,.5);
    color: #14b8a6; font-weight: 700; font-size: 11px;
}


@media (max-width: 1080px) {
    .mi-home-cols, .mi-cols, .mi-cats-layout, .mi-post-layout { grid-template-columns: 1fr; }
    .mi-hero-ins { grid-template-columns: 1fr; }
    .mi-features { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .mi-footer-top { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 860px) {
    .mi-featured { grid-template-columns: 1fr; }
    .mi-news { grid-template-columns: 1fr; }
    .mi-topmenu { display: none; }
    .mi-burger { display: inline-flex; }
    .mi-navbar { position: relative; }
    .mi-menu {
        position: absolute; left: 0; right: 0; top: 100%; display: none; z-index: 65;
        flex-direction: column; background: #1c1917; border-bottom: 2px solid #ef4444; padding: 8px 16px 16px;
    }
    .mi-menu.mi-open { display: flex; }
    .mi-navlink { padding: 12px 8px; }
    .mi-navitem.mi-current .mi-navlink { box-shadow: none; }
    .mi-dropdown { position: static; border: 0; border-radius: 0; background: transparent; box-shadow: none; display: block; }
    .mi-dropdown-inner { padding: 0 0 0 12px; }
    .mi-footer-top { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
    .mi-hero h1 { font-size: 26px; }
    .mi-features { grid-template-columns: 1fr; }
    .mi-featured-item { grid-template-columns: 1fr; text-align: center; }
    .mi-featured-logo { margin: 0 auto; }
    .mi-footer-top { grid-template-columns: 1fr; }
    .mi-footer-copy { flex-direction: column; }
}




.mi-author {
    display: flex; gap: 16px; align-items: flex-start;
    background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px;
    padding: 18px; margin: 22px 0;
}
.mi-author-avatar img { border-radius: 50%; border: 2px solid #ef4444; display: block; }
.mi-author-body { min-width: 0; }
.mi-author-label {
    font-size: 11px; text-transform: uppercase; letter-spacing: .7px;
    color: #ef4444; margin-bottom: 4px;
}
.mi-author-name { display: block; color: #f1f1f1; font-size: 17px; font-weight: 700; }
.mi-author-name:hover { color: #ef4444; text-decoration: none; }
.mi-author-title { color: #b91c1c; font-size: 13px; margin: 2px 0 8px; }
.mi-author-bio { color: #b5b5b5; font-size: 13.5px; margin: 0 0 10px; }


.mi-profile {
    display: flex; gap: 22px; align-items: flex-start;
    background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px;
    padding: 24px; margin: 14px 0 26px;
    box-shadow: 0 18px 44px rgba(28,25,23,.5);
}
.mi-profile-avatar img { border-radius: 50%; border: 3px solid #ef4444; display: block; }
.mi-profile-body { min-width: 0; }
.mi-profile-name { font-size: 26px; margin: 0 0 4px; }
.mi-profile-title { color: #b91c1c; font-size: 14px; margin-bottom: 12px; }
.mi-profile-stats { display: flex; gap: 26px; margin-bottom: 12px; }
.mi-profile-stat { color: #8a8a8a; font-size: 12.5px; }
.mi-profile-stat b { display: block; color: #ef4444; font-size: 20px; line-height: 1.2; }
.mi-profile-bio { color: #b5b5b5; font-size: 14px; }
.mi-profile-sec { margin-bottom: 26px; }
.mi-profile-sec h2 {
    font-size: 18px; margin: 0 0 14px; padding-bottom: 10px;
    border-bottom: 1px solid #3a3a3a;
}


.mi-citem {
    background: #2b2b2b; border: 1px solid #3a3a3a; border-left: 3px solid #b91c1c;
    border-radius: 12px; padding: 14px 16px; margin-bottom: 12px;
}
.mi-citem-text { color: #e2e2e2; font-size: 14px; margin-bottom: 8px; }
.mi-citem-meta { color: #8a8a8a; font-size: 12.5px; }
.mi-citem-meta a { color: #ef4444; }
.mi-citem-meta a:hover { color: #14b8a6; text-decoration: none; }


.mi-comments { margin: 30px 0; }
.mi-comments-title {
    display: flex; align-items: center; gap: 10px; font-size: 20px;
    margin: 0 0 18px; padding-bottom: 10px; border-bottom: 1px solid #3a3a3a;
}
.mi-count {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 26px; height: 22px; padding: 0 8px; border-radius: 999px;
    background: #ef4444; color: #1c1917; font-size: 12px; font-weight: 700;
}
.mi-comment {
    display: flex; gap: 14px; align-items: flex-start;
    background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 12px;
    padding: 16px; margin-bottom: 14px;
}
.mi-comment-avatar img { border-radius: 50%; display: block; }
.mi-comment-body { min-width: 0; }
.mi-comment-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 6px; }
.mi-comment-name { color: #f1f1f1; font-weight: 700; font-size: 14.5px; }
.mi-comment-name a { color: #f1f1f1; }
.mi-comment-name a:hover { color: #ef4444; text-decoration: none; }
.mi-comment-role {
    font-size: 11px; color: #ef4444; background: rgba(239,68,68,.1);
    border-radius: 6px; padding: 2px 8px;
}
.mi-comment-time { color: #8a8a8a; font-size: 12px; }
.mi-comment-text { color: #d9d9d9; font-size: 14px; margin: 0 0 8px; }
.mi-comment-actions { display: flex; gap: 18px; }
.mi-comment-actions a { color: #8a8a8a; font-size: 12.5px; }
.mi-comment-actions a:hover { color: #ef4444; text-decoration: none; }


.mi-comment-form {
    background: #2b2b2b; border: 1px solid #3a3a3a; border-radius: 14px;
    padding: 18px; margin-top: 20px;
}
.mi-comment-form h3 { font-size: 16px; margin: 0 0 14px; }
.mi-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.mi-comment-form input,
.mi-comment-form textarea {
    width: 100%; background: #1f1f1f; border: 1px solid #3a3a3a; border-radius: 10px;
    padding: 11px 14px; color: #f1f1f1; font: inherit;
}
.mi-comment-form textarea { min-height: 110px; resize: vertical; margin-bottom: 12px; }
.mi-comment-form input:focus,
.mi-comment-form textarea:focus { outline: 0; border-color: #ef4444; box-shadow: 0 0 0 3px rgba(239,68,68,.18); }


@media (max-width: 620px) {
    .mi-profile { flex-direction: column; text-align: center; align-items: center; }
    .mi-comment-form .mi-row2 { grid-template-columns: 1fr; }
    .mi-comment-time { width: 100%; }
}




html[lang="th"] body { line-height: 1.85; }
html[lang="bn"] body { line-height: 1.9; font-size: 15.5px; }
html[lang="hi"] body { line-height: 1.85; }


html[lang="th"] .mi-featured-bonus,
html[lang="th"] .mi-post-title,
html[lang="th"] .mi-card-name,
html[lang="th"] .mi-acc-q { line-height: 1.6; }


html[lang="bn"] .mi-btn,
html[lang="hi"] .mi-btn { font-size: 13px; padding: 11px 16px; }


html[lang="bn"] body { font-family: Rubik, "Noto Sans Bengali", "Vrinda", "Shonar Bangla", sans-serif; }
html[lang="hi"] body { font-family: Rubik, "Noto Sans Devanagari", "Nirmala UI", "Mangal", sans-serif; }
html[lang="th"] body { font-family: Rubik, "Noto Sans Thai", "Leelawadee UI", "Tahoma", sans-serif; }




.mi-card-name,
.mi-post-title,
.mi-featured-name,
.mi-featured-bonus,
.mi-toc-link { overflow-wrap: break-word; }


html[lang="bn"] .mi-navlink,
html[lang="hi"] .mi-navlink,
html[lang="th"] .mi-navlink { padding-left: 11px; padding-right: 11px; font-size: 13px; }


html[lang="th"] .mi-featured-bonus,
html[lang="bn"] .mi-featured-bonus { font-size: 16px; }


html[lang="bn"] .mi-lang > summary,
html[lang="hi"] .mi-lang > summary { border-color: rgba(20,184,166,.55); }
html[lang="th"] .mi-lang-cur { background: rgba(28,25,23,.9); }
html[lang="th"] .mi-searchbox input:focus,
html[lang="bn"] .mi-searchbox input:focus,
html[lang="hi"] .mi-searchbox input:focus { border-color: #ef4444; box-shadow: 0 0 0 3px rgba(239,68,68,.18); }
html[lang="th"] .mi-btn-cta { box-shadow: 0 6px 18px rgba(20,184,166,.28); }
html[lang="bn"] .mi-footer-copy .mi-18 { background: rgba(28,25,23,.9); }