:root{
  --bg:#eef1f4;--surface:#fff;--surface2:#f7f8fa;--line:#d8dde3;--line2:#c7ced6;
  --text:#222831;--muted:#6f7b87;--brand:#668896;--brand-dark:#557786;--link:#2f7eb7;
  --gold:#efbd4c;--gold-dark:#d49e2d;--green:#48b95a;--green2:#82c849;--yellow:#f3df43;
  --red:#ef4b42;--deepred:#95170c;--shadow:0 2px 8px rgba(28,43,56,.08);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,"Segoe UI",sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.wrap{width:min(1180px,calc(100% - 28px));margin-inline:auto}
.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50;box-shadow:0 1px 5px rgba(0,0,0,.04)}.header-inner{min-height:72px;display:flex;align-items:center;gap:22px}.brand{display:flex;align-items:center;gap:10px;min-width:250px;font-size:19px;font-weight:800;color:#2b3440}.brand-mark{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(145deg,#ffd76f,#dda62f);color:#272011;font-weight:900;box-shadow:0 3px 10px rgba(203,150,35,.22)}.brand b{color:#bd861f}.brand small{display:block;color:#89939e;font-size:9px;letter-spacing:.08em;text-transform:uppercase;margin-top:1px}.main-nav{display:flex;align-items:center;gap:3px;flex:1}.main-nav a,.auth-nav a{padding:10px 11px;border-radius:7px;color:#4b5662;font-size:15px;font-weight:700}.main-nav a:hover,.auth-nav a:hover{background:#f0f3f6;color:#1f2a34}.main-nav .nav-cta{background:var(--gold);color:#241c0b;border:1px solid #dfa936;margin-left:3px}.main-nav .nav-cta:hover{background:#e6ad35}.auth-nav{display:flex;align-items:center;gap:2px}.category-bar{background:#fff;border-bottom:1px solid var(--line)}.category-scroll{display:flex;overflow:auto;scrollbar-width:none}.category-scroll::-webkit-scrollbar{display:none}.category-scroll a{white-space:nowrap;padding:11px 15px;border-right:1px solid #e5e8eb;color:#56616c;font-size:14px}.category-scroll a:first-child{border-left:1px solid #e5e8eb}.category-scroll a:hover{background:#edf4f7;color:#315c6c}
.flash{max-width:760px;margin:14px auto;padding:12px 16px;border-radius:7px;border:1px solid}.flash.ok{background:#edf9f0;border-color:#a6d8b1;color:#286b36}.flash.err{background:#fff0f0;border-color:#e5aaaa;color:#a62b2b}
.homepage-layout{width:min(1740px,calc(100% - 24px));margin:22px auto 48px;display:grid;grid-template-columns:230px minmax(0,1180px) 230px;gap:20px;align-items:start;justify-content:center}.home-center{min-width:0}.side-ad{position:sticky;top:115px;width:230px;height:900px;border:1px solid #cfd5db;border-radius:7px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}.side-ad img{display:block;width:230px;height:900px;object-fit:cover}.ad-placeholder{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:linear-gradient(#fafbfc,#f0f3f5);color:#8a96a1;font-size:12px}.ad-placeholder b{color:#bd861f;font-size:18px}.ad-placeholder small{color:#a4adb5}
.hero{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:24px 28px;margin-bottom:16px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);border-top:5px solid var(--brand)}.eyebrow{display:inline-block;color:#b57d13;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.hero h1{font-size:36px;line-height:1.08;margin:5px 0 8px;color:#2a3138}.hero p{max-width:760px;margin:0;color:#697581;font-size:14px}.hero-actions,.detail-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:17px}.btn,.like-btn{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 15px;border-radius:6px;border:1px solid #c9d0d6;background:#f8f9fa;color:#303943;font-weight:750;cursor:pointer}.btn:hover,.like-btn:hover{background:#edf1f4}.btn.primary{background: #880900;border-color: #880900;color:#fff}.btn.wide{width:100%}.hero-badge{width:104px;height:104px;flex:0 0 104px;border-radius:50%;display:grid;place-items:center;align-content:center;background:linear-gradient(145deg,#ffd76a,#d99e26);color:#2c210c;border:5px solid #fff;box-shadow:0 0 0 1px #d7c18d,0 6px 18px rgba(125,91,18,.15)}.hero-badge b{font-size:36px;line-height:1}.hero-badge span{font-weight:900;font-size:8px;letter-spacing:.16em}
.content-card{background:#fff;border:1px solid var(--line);border-radius:7px;box-shadow:var(--shadow);margin-bottom:18px;overflow:hidden}.content-card>.section-title{margin:0;padding:14px 16px;background:var(--brand);color:#fff;align-items:center}.content-card>.section-title .eyebrow{color:#dce8ed}.content-card>.section-title h1,.content-card>.section-title h2{color:#fff}.content-card>.section-title>a{color:#fff;text-decoration:underline}.section-title{display:flex;justify-content:space-between;gap:14px;align-items:end;margin-bottom:15px}.section-title h1,.section-title h2{margin:2px 0 0}.section-title h2{font-size:16px}
.vip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:14px}.vip-card{position:relative;padding:14px;border:1px solid #dce1e5;border-radius:7px;background:#fafbfc;transition:.16s}.vip-card:hover{border-color:#c6a55f;box-shadow:0 3px 10px rgba(0,0,0,.06);transform:translateY(-1px)}.vip-logo{width:52px;height:52px;border-radius:8px;background:#eef1f4;border:1px solid #d9dee3;display:grid;place-items:center;overflow:hidden;color:#bd861f;font-weight:900}.vip-logo img{width:100%;height:100%;object-fit:cover}.vip-card h3{margin:9px 0 3px;font-size:16px}.vip-card p{height:38px;overflow:hidden;margin:0 0 7px;color:#000;font-size:12px}.vip-card small{color:#8c7547}.vip-badge{position:absolute;right:8px;top:8px;padding:4px 7px;border-radius:4px;background:#880900;color:#fff;font-size:9px;font-weight:900}.vip-badge.big{position:static;font-size:11px;padding:7px 10px}
.category-section{padding-bottom:14px}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:14px}.category-tile{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:9px;align-items:center;padding:11px;border:1px solid #dfe4e8;border-radius:6px;background:#f8fafb}.category-tile:hover{background:#eef5f7;border-color:#b9ccd3}.category-icon{width:38px;height:38px;border-radius:6px;display:grid;place-items:center;background:#fff3ce;color:#a27012;font-size:10px;font-weight:900;border:1px solid #eedca3}.category-tile b{display:block;font-size:12px}.category-tile small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#8a949e;font-size:9px;margin-top:2px}.arrow{color:#7e8d98}
.filter-chips{display:flex;gap:8px;overflow:auto;padding:12px 14px;border-bottom:1px solid #e1e5e8;background:#f7f8f9;scrollbar-width:none}.filter-chips::-webkit-scrollbar{display:none}.filter-chips a{white-space:nowrap;padding:8px 12px;border-radius:5px;background:#fff;border:1px solid #d9dee2;color:#4c5b66;font-size:11px;font-weight:700}.filter-chips a:nth-child(1){background:#45b657;color:#fff;border-color:#45b657}.filter-chips a:nth-child(2){background:#83c94b;color:#fff;border-color:#83c94b}.filter-chips a:nth-child(3){background:#f2df43;color:#2b2b21;border-color:#e5cf2b}.filter-chips a:nth-child(4){background:#ef4a42;color:#fff;border-color:#ef4a42}.filter-chips a:nth-child(5){background:#94170e;color:#fff;border-color:#94170e}
.server-table-head{display:grid;grid-template-columns:48px 135px minmax(0,1fr) 105px 105px;align-items:center;min-height:42px;background:#f0f1f2;border-bottom:1px solid #d6dadd;color:#1f252b;font-weight:800;font-size:12px}.server-table-head span{padding:0 12px}.server-list{display:block;counter-reset:serverrow}.server-row{counter-increment:serverrow;display:grid;grid-template-columns:48px 135px minmax(0,1fr) 105px 105px;align-items:center;min-height:58px;background:#fff;border-bottom:1px solid #dde1e4;transition:.12s;position:relative}.server-row:last-child{border-bottom:0}.server-row:hover{background:#f5f9fb}.server-row:before{content:counter(serverrow);grid-column:1;grid-row:1;padding-left:14px;font-weight:800;color:#20262c;font-size:12px}.server-logo{display:none}.server-main{grid-column:3;grid-row:1;min-width:0;padding:8px 12px}.server-main strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--link);font-size:16px;font-weight:600}.server-main small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#929aa2;font-size:10px;margin-top:2px}.server-type{grid-column:2;grid-row:1;justify-self:stretch;text-align:center;margin:0 8px;padding:8px 5px;border-radius:3px;background:#48b85a;color:#fff;font-size:11px;font-weight:700}.server-stats{display:contents}.server-stats span{display:block;text-align:center;font-size:15px;color:#5f6c76;padding:7px 6px}.server-stats span:first-child{grid-column:4}.server-stats span:last-child{grid-column:5}.server-row .vip-badge{right:4px;top:3px}.ranked .server-row:nth-child(1) .server-type{background:#2fa94b}.ranked .server-row:nth-child(2) .server-type{background:#5abb52}.ranked .server-row:nth-child(3) .server-type{background:#86c64a}
.page-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;padding:24px 0 46px}.page-grid>.content-card{padding-bottom:16px}.page-grid>.content-card:not(:has(>.section-title)){padding:18px}.sidebar-box{background:#fff;border:1px solid var(--line);border-radius:7px;padding:13px;margin-bottom:13px;box-shadow:var(--shadow)}.sidebar-box h3{margin:0 0 8px;padding-bottom:8px;border-bottom:3px solid var(--brand);font-size:15px;color:#34424c}.sidebar-box>a{display:grid;padding:9px 2px;border-top:1px solid #eceff1}.sidebar-box>a:first-of-type{border-top:0}.sidebar-box>a b{font-size:12px;color:#377aa5}.sidebar-box>a small{color:#88939d;font-size:10px}.tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.tags a{padding:6px 8px;border:1px solid #dfe3e6;background:#f7f8f9;border-radius:5px;color:#5f6d78;font-size:10px}
.detail-head{display:grid;grid-template-columns:82px 1fr auto;gap:17px;align-items:center}.detail-head h1{font-size:31px;margin:3px 0}.detail-head p{margin:0;color:#717d88}.detail-logo{width:80px;height:80px;border-radius:10px;background:#eef1f3;border:1px solid #d7dce0;display:grid;place-items:center;font-size:27px;font-weight:900;overflow:hidden}.detail-logo img{width:100%;height:100%;object-fit:cover}.stat-strip{display:flex;gap:0;margin:18px 0;border:1px solid #dce1e4;border-radius:6px;overflow:hidden}.stat-strip span{flex:1;padding:10px;background:#f7f9fa;color:#7f8992;text-align:center;font-size:12px;border-right:1px solid #dce1e4}.stat-strip span:last-child{border-right:0}.stat-strip b{color:#2b333a;font-size:14px}.server-banner{width:100%;max-height:380px;object-fit:cover;border-radius:6px;border:1px solid #d8dde1}.richtext{color:#515c66;line-height:1.8}.richtext h2{color:#2d3740}.comments h2{margin-top:0}.form-row,.server-form,.auth-card form{display:grid;gap:11px}.form-row input,.form-row textarea,.server-form input,.server-form textarea,.server-form select,.auth-card input{width:100%;background:#fff;border:1px solid #ccd3d8;color:#27313a;border-radius:6px;padding:11px 12px;outline:none}.form-row input:focus,.form-row textarea:focus,.server-form input:focus,.server-form textarea:focus,.server-form select:focus,.auth-card input:focus{border-color:#7ba4b5;box-shadow:0 0 0 3px rgba(102,136,150,.12)}
.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:14px}.blog-card{border:1px solid #dde2e6;border-radius:7px;overflow:hidden;background:#fff;padding-bottom:12px}.blog-card img{width:100%;height:190px;object-fit:cover}.blog-card small,.blog-card h2,.blog-card p{display:block;margin-left:13px;margin-right:13px}.blog-card small{margin-top:11px;color:#b47e17}.blog-card h2{font-size:17px;margin-top:5px;margin-bottom:5px}.blog-card p{font-size:12px;color:#7b858f}.article{padding:22px!important}.article h1{font-size:34px}.article-meta{font-size:12px;color:#8a949d;margin:5px 0 18px}.article-cover{width:100%;max-height:420px;object-fit:cover;border-radius:7px}.auth-shell{padding:38px 14px}.auth-card{max-width:480px;margin:auto;background:#fff;border:1px solid var(--line);border-radius:8px;padding:22px;box-shadow:var(--shadow)}
.footer{margin-top:30px;background:#fff;border-top:1px solid #d5dbe0;color:#69737d}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:35px;padding:28px 0}.footer-grid b,.footer-grid strong{color:#33414b}.footer-grid p{font-size:12px}.footer-grid a{display:block;font-size:12px;padding:4px 0;color:#587182}.copyright{text-align:center;border-top:1px solid #e1e5e8;padding:13px;font-size:11px;color:#8e979f}
@media(max-width:1540px){.homepage-layout{grid-template-columns:minmax(0,1180px);width:min(1180px,calc(100% - 28px))}.side-ad{display:none}}
@media(max-width:980px){.header-inner{flex-wrap:wrap;padding:10px 0;gap:8px}.brand{min-width:auto;flex:1}.main-nav{order:3;width:100%;overflow:auto}.auth-nav{margin-left:auto}.page-grid{grid-template-columns:1fr}.category-grid{grid-template-columns:repeat(2,1fr)}.vip-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){body{background:#f2f4f6}.wrap,.homepage-layout{width:calc(100% - 16px)}.site-header{position:static}.header-inner{min-height:62px}.brand{font-size:16px}.brand-mark{width:36px;height:36px}.brand small{display:none}.auth-nav a{padding:8px 7px;font-size:11px}.main-nav{gap:5px}.main-nav a{white-space:nowrap;padding:8px 9px;border:1px solid #e1e5e8;background:#f7f8f9;font-size:11px}.category-scroll a{padding:9px 12px;font-size:11px}.homepage-layout{margin-top:12px}.hero{padding:18px;display:block}.hero h1{font-size:29px}.hero-badge{display:none}.content-card>.section-title{padding:12px 13px}.section-title h2{font-size:18px}.vip-grid{grid-template-columns:1fr;padding:10px}.category-grid{grid-template-columns:1fr 1fr;padding:10px;gap:7px}.category-tile{grid-template-columns:34px minmax(0,1fr);padding:9px}.category-icon{width:32px;height:32px}.category-tile .arrow,.category-tile small{display:none}.filter-chips{padding:9px 10px}.server-table-head{grid-template-columns:36px 92px minmax(0,1fr);min-height:38px}.server-table-head span:nth-child(4),.server-table-head span:nth-child(5){display:none}.server-table-head span{padding:0 8px}.server-row{grid-template-columns:36px 92px minmax(0,1fr);min-height:56px}.server-row:before{padding-left:10px}.server-type{grid-column:2;margin:0 5px;font-size:10px;padding:7px 3px}.server-main{grid-column:3;padding:7px 8px}.server-main strong{font-size:12px}.server-main small{font-size:9px}.server-stats{display:none}.server-row .vip-badge{font-size:7px;padding:2px 4px}.page-grid{padding-top:12px}.detail-head{grid-template-columns:60px 1fr}.detail-head .vip-badge{display:none}.detail-logo{width:58px;height:58px}.detail-head h1{font-size:24px}.stat-strip{flex-wrap:wrap}.stat-strip span{min-width:50%}.blog-grid{grid-template-columns:1fr;padding:10px}.footer-grid{grid-template-columns:1fr;gap:12px}.article{padding:15px!important}.article h1{font-size:27px}}
@media(max-width:420px){.category-grid{grid-template-columns:1fr}.auth-nav a:first-child{display:none}.hero-actions .btn{flex:1}.server-table-head{grid-template-columns:32px 82px minmax(0,1fr)}.server-row{grid-template-columns:32px 82px minmax(0,1fr)}}

/* ===== V4 LIGHT THEME OVERRIDES ===== */
html,body{background:#f2f2f2!important;color:#222!important}
body{min-width:0}
.site-header{background:#ffffff!important;border-bottom:1px solid #d9d9d9!important;box-shadow:0 1px 4px rgba(0,0,0,.06)!important}
.header-inner{max-width:1180px}
.brand{color:#28333c!important}.brand b{color:#bd861f!important}.brand small{color:#89929a!important}
.main-nav a,.auth-nav a{color:#3e4a54!important}.main-nav a:hover,.auth-nav a:hover{background:#eef2f4!important;color:#1d252b!important}
.main-nav .nav-cta{background:#880900 !important;border-color:#dca42f!important;color:#fff!important}
.category-bar{background:#fff!important;border-bottom:1px solid #d7dde1!important}
.category-scroll a{color:#475963!important;background:#fff!important}.category-scroll a:hover{background:#edf4f7!important;color:#244f62!important}

/* 230 + 20 + 1040 + 20 + 230 = 1540px. Entire desktop layout stays centered. */
.homepage-layout{width:1540px!important;max-width:calc(100% - 28px)!important;margin:20px auto 48px!important;grid-template-columns:230px minmax(0,1040px) 230px!important;gap:20px!important;justify-content:center!important}
.home-center{width:100%;min-width:0}
.side-ad{width:230px!important;height:900px!important;background:#fff!important;border:1px solid #cfd5da!important;border-radius:5px!important;box-shadow:0 2px 7px rgba(0,0,0,.06)!important}
.side-ad img{width:230px!important;height:900px!important;object-fit:contain!important;background:#fff!important}
.ad-placeholder{background:#fafafa!important;color:#8c979f!important}.ad-placeholder b{color:#bf8618!important}

.hero{background:#fff!important;border:1px solid #d7dde1!important;border-top:4px solid #688795!important;border-radius:5px!important;box-shadow:0 1px 5px rgba(0,0,0,.05)!important}
.hero h1{color:#27323a!important}.hero p{color:#677580!important}.hero-badge{background:linear-gradient(145deg,#ffd86c,#dda329)!important;color:#281e0b!important}
.content-card{background:#fff!important;border:1px solid #d4d9dd!important;border-radius:5px!important;box-shadow:0 1px 5px rgba(0,0,0,.05)!important}
.content-card>.section-title{background:#880900 !important;color:#fff!important;padding:12px 16px!important}
.content-card>.section-title h1,.content-card>.section-title h2{color:#fff!important;font-weight:700!important}.content-card>.section-title .eyebrow{color:#eaf0f2!important}
.category-section{background:#fff!important}.category-grid{background:#fff!important}.category-tile{background:#fafafa!important;border-color:#d9dee1!important}.category-tile:hover{background:#eef5f7!important}
.vip-card{background:#fffdf7!important;border-color:#e1d7ba!important}.vip-card:hover{background:#fff9e9!important}
.filter-chips{background:#f1f1f1!important;border-bottom-color:#d7d7d7!important}
.server-table-head{background:#f0f0f0!important;color:#111!important;border-bottom:1px solid #d4d4d4!important}
.server-row{background:#fff!important;border-bottom:1px solid #ddd!important}.server-row:hover{background:#f4f8fa!important}
.server-main strong{color:#f00!important}.server-main small{color:#858f97!important}.server-stats span{color:#5f6a72!important}
.page-grid>.content-card,.sidebar-box,.auth-card,.blog-card{background:#fff!important;color:#222!important}
.sidebar-box{border-color:#d7dce0!important}.sidebar-box h3{color:#2d3941!important}.richtext{color:#4e5962!important}.detail-head h1{color:#202930!important}
.footer{background:#fff!important;color:#68747d!important;border-top-color:#d5dadd!important}

/* VIP rows remain visually obvious while pinned above normal servers. */
.server-row:has(.vip-badge){background:#fffdf4!important}
.server-row:has(.vip-badge):hover{background:#fff8df!important}
.server-row .vip-badge{background:#880900 !important;color:#fff!important;border:1px solid #dca52f!important}

@media(max-width:1579px){
  .homepage-layout{width:min(1120px,calc(100% - 28px))!important;grid-template-columns:minmax(0,1120px)!important}
  .side-ad{display:none!important}
}
@media(max-width:980px){
  .homepage-layout{width:calc(100% - 20px)!important;max-width:none!important;margin-top:12px!important;grid-template-columns:1fr!important}
}
@media(max-width:700px){
  html,body{background:#f3f3f3!important}
  .site-header{position:static!important}
  .homepage-layout{width:calc(100% - 12px)!important}
  .hero,.content-card{border-radius:4px!important}
  .content-card>.section-title{padding:11px 12px!important}
}

/* ===== V5 RESPONSIVE / PANEL / SERVER DETAIL ===== */
.mobile-actions{display:none}

/* Header */
.brand{gap:10px}.brand-copy{display:block;line-height:1.05}.brand-copy small{line-height:1.2}
@media(max-width:760px){
  .header-inner{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:10px 12px!important;padding:10px 0!important;min-height:auto!important}
  .desktop-nav,.desktop-auth{display:none!important}
  .brand{min-width:0!important;font-size:17px!important}.brand-mark{width:38px!important;height:38px!important;border-radius:9px!important;flex:0 0 38px}.brand-copy{white-space:nowrap}.brand small{display:block!important;font-size:7px!important;letter-spacing:.06em!important}
  .mobile-actions{display:flex!important;align-items:center;justify-content:flex-end;gap:6px;min-width:0}
  .mobile-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 10px;border:1px solid #d9dee2;border-radius:6px;background:#fff;color:#34434d;font-size:11px;font-weight:600;white-space:nowrap}
  .mobile-actions .mobile-server-add{background:#880900;border-color:#0000;color:#fff}
  .category-bar{position:relative;z-index:10}.category-scroll{padding-left:0}.category-scroll a{padding:9px 12px!important;font-size:10px!important}
}
@media(max-width:520px){
  .header-inner{grid-template-columns:1fr!important}
  .brand{justify-content:center!important}.mobile-actions{justify-content:center!important;width:100%}.mobile-actions a{flex:1;max-width:130px}
}

/* Footer */
.footer{margin-top:0px!important;background:#fff!important;border-top:1px solid #d7dde1!important}
.footer-grid{grid-template-columns:1.7fr 1fr 1fr!important;gap:44px!important;padding:34px 0 30px!important}
.footer-logo{display:flex;align-items:center;gap:9px;color:#2f3941;font-size:17px}.footer-logo span{width:36px;height:36px;display:grid;place-items:center;border-radius:8px;background:#efbd4c;color:#2b210d;font-size:12px;font-weight:900}.footer-brand-col p{max-width:460px;line-height:1.7;color:#7a858e}.footer-col strong{display:block;margin-bottom:8px;color:#2f3941}.footer-col a{display:block;padding:5px 0;color:#607888;font-size:12px}.footer-col a:hover{color:#b47d16}.copyright{background:#fafafa!important}
@media(max-width:700px){
  .footer{margin-top:22px!important}.footer-grid{grid-template-columns:1fr!important;gap:20px!important;text-align:center!important;padding:26px 16px 22px!important}.footer-logo{justify-content:center!important}.footer-brand-col p{margin:10px auto 0!important;max-width:420px}.footer-col{display:flex;flex-direction:column;align-items:center}.footer-col strong{font-size:13px}.footer-col a{min-width:190px;padding:7px 10px;border-bottom:1px solid #eef0f2}.copyright{font-size:10px!important;line-height:1.6;padding:12px 14px!important}
}

/* Member panel */
.panel-page{padding-top:22px;padding-bottom:12px}.panel-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 26px;background: linear-gradient(135deg,#000,#4f6873);border:1px solid #587b89;border-radius:8px;color:#fff;box-shadow:0 3px 10px rgba(53,75,86,.12)}.panel-hero .eyebrow{color:#eef6f8}.panel-hero h1{margin:3px 0 4px;font-size:30px;color:#fff}.panel-hero p{margin:0;color:#edf3f5;font-size:13px}.panel-add-btn{flex:0 0 auto;box-shadow:0 2px 5px rgba(0,0,0,.08)}
.dashboard-cards-v5{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:14px!important;margin:14px 0 18px!important}.dashboard-cards-v5 article{display:flex!important;align-items:center!important;gap:13px!important;padding:16px!important;background:#fff!important;border:1px solid #d8dde1!important;border-radius:7px!important;box-shadow:0 1px 5px rgba(0,0,0,.04)!important}.dash-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:9px;background:#fff4d4;color:#a77316;font-weight:900}.dashboard-cards-v5 b{display:block;font-size:22px;color:#29343d;line-height:1.1}.dashboard-cards-v5 small{display:block;margin-top:3px;color:#83909a;font-size:11px}
.panel-server-card{overflow:hidden}.panel-card-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:15px 18px;background:#fff;border-bottom:1px solid #dde2e5}.panel-card-head h2{margin:2px 0 0;font-size:20px}.panel-count{padding:6px 9px;border:1px solid #dce1e4;background:#f7f9fa;border-radius:20px;color:#73808a;font-size:10px;font-weight:700}.panel-table-wrap{overflow:auto}.panel-table{width:100%;border-collapse:collapse;min-width:720px}.panel-table th{padding:11px 14px;text-align:left;background:#f4f5f6;border-bottom:1px solid #d9dde0;color:#3d4850;font-size:11px}.panel-table td{padding:12px 14px;border-bottom:1px solid #eceff1;color:#59656e;font-size:12px}.panel-table tbody tr:hover{background:#fafcfd}.panel-server-link{color:#880900;font-size:14px;font-weight:800}.mini-vip{display:inline-flex;padding:3px 6px;border-radius:4px;background:#880900;color:#fff;font-size:9px;font-weight:900}.status{display:inline-flex;padding:4px 7px;border-radius:20px;background:#eef2f4;color:#5b6872;font-size:9px;font-weight:800;text-transform:uppercase}.status.active{background:#eaf7ed;color:#2d7d3d}.status.pending{background:#fff7dd;color:#9b6b0f}.status.rejected{background:#fff0f0;color:#ad3030}.panel-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:42px 20px;color:#77838d}.panel-empty b{font-size:18px;color:#35414a}.panel-empty span{margin:4px 0 14px;font-size:12px}
@media(max-width:700px){
  .panel-page{padding-top:12px}.panel-hero{display:block;padding:18px 16px;border-radius:6px}.panel-hero h1{font-size:25px}.panel-hero p{font-size:11px;line-height:1.6}.panel-add-btn{width:100%;margin-top:14px}.dashboard-cards-v5{grid-template-columns:1fr!important;gap:8px!important;margin:10px 0 12px!important}.dashboard-cards-v5 article{padding:12px!important}.dash-icon{width:38px;height:38px}.dashboard-cards-v5 b{font-size:19px}.panel-card-head{padding:12px}.panel-card-head h2{font-size:17px}.panel-table{min-width:0!important}.panel-table thead{display:none}.panel-table,.panel-table tbody,.panel-table tr,.panel-table td{display:block;width:100%}.panel-table tr{padding:10px 12px;border-bottom:1px solid #e3e7ea}.panel-table td{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border:0;font-size:11px}.panel-table td:before{content:attr(data-label);font-weight:800;color:#36434c}.panel-table td:first-child{padding-bottom:9px}.panel-server-link{font-size:13px}
}

/* Server add SEO */
.seo-details{border:1px solid #d9dee2;border-radius:7px;background:#fafbfc;overflow:hidden}.seo-details summary{cursor:pointer;padding:11px 13px;background:#f1f4f5;color:#3a4851;font-weight:800}.seo-details[open] summary{border-bottom:1px solid #d9dee2}.seo-details .grid-2{padding:13px}.server-form details input{background:#fff}

/* Server detail page */
.server-page-grid{grid-template-columns:minmax(0,1fr) 300px!important;gap:18px!important;padding-top:22px!important}.server-page-main{min-width:0}.server-detail-v5{overflow:hidden}.server-detail-top{display:grid;grid-template-columns:92px minmax(0,1fr);gap:18px;align-items:center;padding:20px 22px;background:linear-gradient(180deg,#fff,#fbfcfc);border-bottom:1px solid #e0e4e7}.server-detail-v5 .detail-logo{width:92px;height:92px;border-radius:12px;background:#f3f5f6;border:1px solid #d8dde0}.server-detail-title{min-width:0}.detail-kickers{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.category-pill{display:inline-flex;padding:5px 8px;border-radius:4px;background:#edf4f7;color:#557786;border:1px solid #cfdee4;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.server-detail-title h1{margin:6px 0 4px;font-size:33px;line-height:1.1;color:#242d34}.server-detail-title p{margin:0;color:#737f88;font-size:13px;line-height:1.6}.stat-strip-v5{margin:0!important;border:0!important;border-bottom:1px solid #e0e4e7!important;border-radius:0!important}.stat-strip-v5 span{padding:13px 8px!important;background:#f8fafb!important}.stat-strip-v5 b{display:block;font-size:17px!important}.stat-strip-v5 small{display:block;margin-top:1px;font-size:9px;color:#8a959e}.detail-actions-v5{margin:0!important;padding:14px 20px;border-bottom:1px solid #e3e7e9;background:#fff}.detail-actions-v5 .btn,.detail-actions-v5 .like-btn{min-width:118px}.server-banner-wrap{padding:16px 20px 0;background:#fff}.server-banner{display:block;width:100%!important;max-height:none!important;height:auto!important;object-fit:contain!important;border-radius:7px!important;background:#f7f8f9}.server-description-block{padding:22px}.server-description-head{padding-bottom:10px;margin-bottom:13px;border-bottom:1px solid #e5e8ea}.server-description-head h2{margin:3px 0 0;font-size:22px;color:#2d3840}.server-description-block .richtext{font-size:15px;line-height:1.85}.comments-v5{padding:0 20px 20px!important}.comments-head{padding:17px 0 12px;border-bottom:1px solid #e2e6e8;margin-bottom:14px}.comments-head h2{margin:2px 0 0;font-size:21px}.comments-v5 .form-row{gap:9px}.comments-v5 textarea{min-height:100px;resize:vertical}.comment-list{margin-top:18px;border-top:1px solid #e5e8ea}.comment{padding:14px 0;border-bottom:1px solid #edf0f2}.comment-meta{display:flex;justify-content:space-between;gap:12px}.comment-meta b{color:#33414a}.comment-meta small{color:#9aa2a9}.comment p{margin:6px 0 0;color:#606b73;font-size:12px}.server-page-aside .sidebar-box{border-radius:7px!important}
@media(max-width:980px){.server-page-grid{grid-template-columns:1fr!important}.server-page-aside{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.server-page-aside .sidebar-box{margin:0!important}}
@media(max-width:700px){
  .server-page-grid{padding-top:10px!important;width:calc(100% - 12px)!important}.server-detail-top{grid-template-columns:64px minmax(0,1fr);gap:12px;padding:14px}.server-detail-v5 .detail-logo{width:64px;height:64px}.server-detail-title h1{font-size:24px;margin-top:5px}.server-detail-title p{font-size:11px}.detail-kickers{gap:5px}.vip-badge.big{display:inline-flex!important;font-size:8px!important;padding:5px 7px!important}.stat-strip-v5{display:grid!important;grid-template-columns:repeat(3,1fr)!important;flex-wrap:nowrap!important}.stat-strip-v5 span{min-width:0!important;padding:9px 4px!important}.stat-strip-v5 b{font-size:14px!important}.detail-actions-v5{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:7px!important;padding:10px!important}.detail-actions-v5 .btn,.detail-actions-v5 .like-btn{min-width:0!important;padding:8px 6px!important;font-size:11px!important}.server-banner-wrap{padding:10px 10px 0}.server-description-block{padding:15px 14px}.server-description-head h2{font-size:18px}.server-description-block .richtext{font-size:14px}.comments-v5{padding:0 12px 12px!important}.comments-head h2{font-size:18px}.server-page-aside{grid-template-columns:1fr!important}.server-page-aside .sidebar-box{margin-bottom:0!important}
}

/* ===== V6 FINAL UI / MOBILE HEADER / GLOBAL ADS / SEARCH / EDITOR ===== */
.nav-search-btn{margin-left:2px;min-height:36px;padding:8px 11px;border:1px solid #d8dde1;border-radius:6px;background:#fff;color:#47545e;font-size:12px;font-weight:800;cursor:pointer}.nav-search-btn:hover{background:#f1f5f7;color:#244f62}.desktop-search-panel{position:absolute;left:0;right:0;top:100%;z-index:80;background:#fff;border-bottom:1px solid #d6dce0;box-shadow:0 8px 18px rgba(28,43,56,.11)}.site-header{position:sticky}.search-panel-inner{padding:12px 0}.live-search-form{position:relative;display:flex;gap:8px;max-width:720px;margin:auto}.live-search-form>input{flex:1;min-width:0;padding:11px 13px;border:1px solid #aeb8c0;border-radius:6px;background:#fff}.live-search-form>button{padding:10px 20px;border:1px solid #d39d2c;border-radius:6px;background:#efbd4c;font-weight:800;cursor:pointer}.live-search-results{position:absolute;left:0;right:76px;top:48px;background:#fff;border:1px solid #cfd6db;border-radius:7px;box-shadow:0 10px 28px rgba(0,0,0,.14);overflow:hidden;z-index:100}.live-search-results a{display:grid;grid-template-columns:190px minmax(0,1fr);gap:12px;padding:10px 12px;border-bottom:1px solid #edf0f2}.live-search-results a:last-child{border:0}.live-search-results a:hover{background:#f5f9fb}.live-search-results b{display:block;color:#2f78ad;font-size:12px}.live-search-results small{display:block;margin-top:2px;color:#8a949d;font-size:9px}.live-search-results em{font-style:normal;color:#68747d;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search-empty{padding:15px;color:#7b8790;font-size:12px}.search-page-form{display:flex;gap:8px;padding:15px}.search-page-form input{flex:1;padding:10px 12px;border:1px solid #cbd2d7;border-radius:6px}

/* Global left/right 230x900 banners on inner pages */
.global-side-ads .side-ad{display:block!important;position:fixed!important;top:205px!important;z-index:9!important;width:230px!important;height:900px!important}.global-side-ads .left-ad{left:calc(50% - 770px)!important}.global-side-ads .right-ad{right:calc(50% - 770px)!important}.global-side-ads .side-ad img{width:230px!important;height:900px!important;object-fit:contain!important;background:#fff!important}.global-side-ads .ad-placeholder{background:#fafafa!important}
@media(min-width:1580px){body.has-global-ads .wrap:not(.header-inner):not(.category-scroll):not(.footer-grid):not(.search-panel-inner){width:min(1040px,calc(100% - 28px))}}
@media(max-width:1579px){.global-side-ads{display:none!important}}

/* Server add / rich editor */
.form-page{padding:24px 0 48px}.server-add-card{padding:0!important;overflow:visible}.form-title{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:20px 22px;border-bottom:1px solid #e0e4e7;background:#fff}.form-title h1{margin:3px 0 5px;font-size:27px}.form-title .lead{margin:0;color:#75818a;font-size:12px}.form-step{padding:6px 9px;border-radius:20px;background:#eef5f7;color:#557786;font-size:10px;font-weight:800}.server-add-card .server-form{padding:20px 22px;gap:15px}.server-form label{display:grid;gap:6px;color:#3b4851;font-size:12px;font-weight:700}.server-form label>small,.field-label small{color:#8a959d;font-weight:500}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.rich-editor-field{display:grid}.field-label{display:flex;justify-content:space-between;gap:15px;margin-bottom:6px;color:#3b4851;font-size:12px}.rich-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:4px;padding:7px;background:#f3f5f6;border:1px solid #cbd2d7;border-bottom:0;border-radius:6px 6px 0 0}.rich-toolbar button{min-height:30px;padding:5px 8px;border:1px solid #cbd2d7;border-radius:4px;background:#fff;color:#36434c;font-size:11px;cursor:pointer}.rich-toolbar button:hover{background:#eaf1f4;border-color:#aebdc4}.rich-toolbar>span{width:1px;height:22px;background:#d5dadd;margin:0 2px}.rich-editor{min-height:330px;max-height:680px;overflow:auto;padding:15px;border:1px solid #cbd2d7;border-radius:0 0 6px 6px;background:#fff;color:#323c44;line-height:1.75;outline:none}.rich-editor:focus{border-color:#7297a7;box-shadow:0 0 0 3px rgba(102,136,150,.12)}.rich-editor:empty:before{content:attr(data-placeholder);color:#9aa3aa}.rich-editor img{display:inline-block;max-width:100%;height:auto;border-radius:5px;margin:8px 0}.rich-editor a{color:#2f78ad;text-decoration:underline}.editor-help{margin-top:6px;color:#8a949d;font-size:10px}.seo-details{margin-top:2px}.seo-details summary{display:flex;justify-content:space-between;gap:12px}.seo-details summary small{font-weight:500;color:#7b8790}.seo-preview{margin:0 13px 13px;padding:13px 14px;border:1px solid #dce1e4;border-radius:6px;background:#fff;display:grid;gap:3px}.seo-preview small{color:#7e8992}.seo-preview b{color:#1a0dab;font-size:17px;font-weight:500}.seo-preview span{color:#188038;font-size:11px}.seo-preview p{margin:4px 0 0;color:#4d5156;font-size:12px;line-height:1.5}.submit-server{min-height:44px;font-size:13px}.server-rich-content{overflow-wrap:anywhere}.server-rich-content img{display:block;max-width:100%;height:auto;margin:12px auto;border-radius:7px}.server-rich-content a{color:#2f78ad;text-decoration:underline}.server-rich-content p,.server-rich-content div{margin:0 0 12px}.server-rich-content h2,.server-rich-content h3{color:#2d3840;margin:20px 0 8px}

/* Extra polish for member panel */
.panel-page{max-width:1040px}.panel-hero{box-shadow:0 4px 16px rgba(70,98,111,.14)!important}.dashboard-cards-v5 article{transition:transform .15s,box-shadow .15s}.dashboard-cards-v5 article:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.07)!important}.panel-server-card{border-top:4px solid #688795!important}

@media(max-width:760px){
  .site-header{position:sticky!important;top:0!important}.header-inner{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;padding:7px 8px!important;width:100%!important;min-height:54px!important}.brand{flex:0 1 auto!important;min-width:0!important;justify-content:flex-start!important;gap:5px!important;font-size:14px!important}.brand-mark{display:none!important}.brand-copy{display:flex!important;align-items:center!important;white-space:nowrap!important;line-height:1!important}.brand-copy b{font-size:14px!important}.brand-server-word{font-size:14px!important}.brand small{display:none!important}.desktop-nav,.desktop-auth{display:none!important}.mobile-actions{display:flex!important;flex:0 0 auto!important;align-items:center!important;justify-content:flex-end!important;gap:4px!important;width:auto!important}.mobile-actions a{flex:0 0 auto!important;max-width:none!important;min-height:32px!important;padding:6px 7px!important;border-radius:5px!important;font-size:12.5px!important}.mobile-actions .mobile-server-add{padding-left:8px!important;padding-right:8px!important}.category-bar{position:relative!important}.homepage-layout{margin-top:9px!important}.hero{display:none!important}.grid-2{grid-template-columns:1fr}.form-page{padding-top:10px}.form-title{padding:15px 13px}.form-title h1{font-size:22px}.form-step{display:none}.server-add-card .server-form{padding:13px}.rich-toolbar{gap:3px}.rich-toolbar button{font-size:10px;padding:5px 6px}.rich-toolbar>span{display:none}.rich-editor{min-height:260px;padding:12px}.seo-details summary{display:block}.seo-details summary small{display:block;margin-top:3px}.seo-preview{margin:0 9px 9px}.live-search-results{right:0}.global-side-ads{display:none!important}.server-description-block{overflow:hidden}
}
@media(max-width:390px){.brand-copy b,.brand-server-word{font-size:12px!important}.mobile-actions a{font-size:8.5px!important;padding:5px 6px!important}.header-inner{gap:4px!important;padding-left:5px!important;padding-right:5px!important}}


/* ===== V6.1 GLOBAL 230x900 BANNER LAYOUT FIX =====
   Desktop geometry is identical on every frontend page:
   230px LEFT AD + 20px GAP + 1040px CONTENT + 20px GAP + 230px RIGHT AD = 1540px.
   Fixed ads are outside normal flow, therefore inner pages reserve at least the
   banner height so short pages can still scroll naturally to the footer.
*/
@media (min-width:1580px){
  :root{
    --m2-ad-width:230px;
    --m2-ad-height:900px;
    --m2-content-width:1040px;
    --m2-ad-gap:20px;
    --m2-layout-width:1540px;
    --m2-ad-top:120px;
  }

  /* Same center column width and horizontal anchor as index.php */
  body.has-global-ads main.wrap,
  body.has-global-ads .wrap.panel-page,
  body.has-global-ads .wrap.form-page,
  body.has-global-ads .wrap.auth-wrap{
    width:var(--m2-content-width)!important;
    max-width:var(--m2-content-width)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  /* The two banners use one immutable viewport coordinate system on all inner pages. */
  .global-side-ads{
    display:block!important;
    pointer-events:none;
  }
  .global-side-ads .side-ad{
    display:block!important;
    position:fixed!important;
    top:var(--m2-ad-top)!important;
    width:var(--m2-ad-width)!important;
    height:var(--m2-ad-height)!important;
    margin:0!important;
    z-index:9!important;
    pointer-events:auto;
  }
  .global-side-ads .left-ad{
    left:calc(50% - (var(--m2-layout-width) / 2))!important;
    right:auto!important;
  }
  .global-side-ads .right-ad{
    right:calc(50% - (var(--m2-layout-width) / 2))!important;
    left:auto!important;
  }
  .global-side-ads .side-ad img{
    display:block!important;
    width:var(--m2-ad-width)!important;
    height:var(--m2-ad-height)!important;
    object-fit:contain!important;
    background:#fff!important;
  }

  /* Critical fix:
     position:fixed does not reserve document height. Reserve the same 900px
     banner lane on every short inner page so the footer always remains reachable. */
  body.has-global-ads > main,
  body.has-global-ads main.wrap{
    min-height:920px!important;
  }

  /* Keep the footer below the complete 230x900 ad lane on short pages. */
  body.has-global-ads .footer{
    position:relative;
    z-index:10;
    clear:both;
  }

  /* Index uses banners in normal grid flow, but shares the exact same geometry. */
  .homepage-layout{
    width:var(--m2-layout-width)!important;
    max-width:calc(100% - 28px)!important;
    grid-template-columns:var(--m2-ad-width) minmax(0,var(--m2-content-width)) var(--m2-ad-width)!important;
    gap:var(--m2-ad-gap)!important;
    justify-content:center!important;
    align-items:start!important;
  }
  .homepage-layout > .side-ad{
    position:sticky!important;
    top:var(--m2-ad-top)!important;
    width:var(--m2-ad-width)!important;
    height:var(--m2-ad-height)!important;
    margin:0!important;
  }
}

/* Below banner-layout breakpoint: ads disappear and pages return to fluid centered layout. */
@media (max-width:1579px){
  .global-side-ads{display:none!important}
  body.has-global-ads > main,
  body.has-global-ads main.wrap{
    min-height:0!important;
  }
}

/* Prevent horizontal drift caused by viewport overflow/scrollbar calculations. */
html{overflow-y:scroll}
body{overflow-x:hidden}


/* ==========================================================================
   V6.2 FINAL GLOBAL BANNER LAYOUT
   IMPORTANT:
   - Inner pages now use the SAME 230 / 1040 / 230 desktop geometry as index.php.
   - Banners are NOT viewport-fixed anymore. They are normal grid items + sticky.
   - Because they remain in document flow, their 900px height always reserves space.
   - Footer can never pass under/over a banner.
   - On short pages the content lane is at least 900px, so footer starts below ads.
   - On long pages sticky ads stay in their lane and stop automatically before footer.
   ========================================================================== */

@media (min-width:1580px){

  :root{
    --m2-final-ad-w:230px;
    --m2-final-ad-h:900px;
    --m2-final-content-w:1040px;
    --m2-final-gap:20px;
    --m2-final-layout-w:1540px;
    --m2-final-top-gap:20px;
    --m2-final-sticky-top:120px;
  }

  /* Build one immutable desktop coordinate system for ALL inner frontend pages. */
  body.has-global-ads{
    display:grid!important;
    grid-template-columns:
      minmax(0,1fr)
      var(--m2-final-ad-w)
      var(--m2-final-gap)
      var(--m2-final-content-w)
      var(--m2-final-gap)
      var(--m2-final-ad-w)
      minmax(0,1fr)!important;
    grid-template-rows:auto auto auto auto!important;
    align-items:start!important;
    min-width:0!important;
  }

  body.has-global-ads > .site-header{
    grid-column:1 / -1!important;
    grid-row:1!important;
    width:100%!important;
  }

  body.has-global-ads > .category-bar{
    grid-column:1 / -1!important;
    grid-row:2!important;
    width:100%!important;
  }

  /*
   * display:contents makes the left/right .side-ad elements participate directly
   * in the body grid. This removes every old fixed-position coordinate mismatch.
   */
  body.has-global-ads > .global-side-ads{
    display:contents!important;
    position:static!important;
  }

  body.has-global-ads > .global-side-ads > .side-ad{
    display:block!important;
    position:sticky!important;
    top:var(--m2-final-sticky-top)!important;
    width:var(--m2-final-ad-w)!important;
    height:var(--m2-final-ad-h)!important;
    min-width:var(--m2-final-ad-w)!important;
    min-height:var(--m2-final-ad-h)!important;
    max-width:var(--m2-final-ad-w)!important;
    max-height:var(--m2-final-ad-h)!important;
    margin-top:var(--m2-final-top-gap)!important;
    margin-bottom:0!important;
    left:auto!important;
    right:auto!important;
    z-index:4!important;
    align-self:start!important;
    overflow:hidden!important;
    pointer-events:auto!important;
  }

  body.has-global-ads > .global-side-ads > .left-ad{
    grid-column:2!important;
    grid-row:3!important;
    justify-self:start!important;
  }

  body.has-global-ads > .global-side-ads > .right-ad{
    grid-column:6!important;
    grid-row:3!important;
    justify-self:end!important;
  }

  body.has-global-ads > .global-side-ads > .side-ad img{
    display:block!important;
    width:var(--m2-final-ad-w)!important;
    height:var(--m2-final-ad-h)!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    background:#fff!important;
  }

  /*
   * Every normal frontend <main> occupies exactly the same 1040px center lane
   * as index.php. A 900px minimum lane keeps short pages taller than the banners.
   */
  body.has-global-ads > main{
    grid-column:4!important;
    grid-row:3!important;
    width:var(--m2-final-content-w)!important;
    max-width:var(--m2-final-content-w)!important;
    min-width:0!important;
    min-height:var(--m2-final-ad-h)!important;
    margin:var(--m2-final-top-gap) 0 48px!important;
    padding-top:0!important;
    justify-self:stretch!important;
    align-self:start!important;
  }

  /* Remove old wrapper width rules inside the now-fixed 1040px center lane. */
  body.has-global-ads > main.wrap,
  body.has-global-ads > main.wrap.page-grid,
  body.has-global-ads > main.wrap.panel-page,
  body.has-global-ads > main.wrap.form-page,
  body.has-global-ads > main.wrap.auth-wrap{
    width:var(--m2-final-content-w)!important;
    max-width:var(--m2-final-content-w)!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  /* Footer is a new grid row: it physically cannot overlap the 900px ad row. */
  body.has-global-ads > .footer{
    grid-column:1 / -1!important;
    grid-row:4!important;
    width:100%!important;
    margin-top:0!important;
    position:relative!important;
    z-index:5!important;
    clear:both!important;
  }

  /* Flash messages must not change banner coordinates from page to page. */
  body.has-global-ads > .flash{
    position:fixed!important;
    top:112px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:min(760px,calc(100% - 32px))!important;
    margin:0!important;
    z-index:1000!important;
  }

  /*
   * Keep index.php untouched visually but force the exact same dimensions
   * used by every inner page.
   */
  .homepage-layout{
    width:var(--m2-final-layout-w)!important;
    max-width:calc(100% - 28px)!important;
    grid-template-columns:
      var(--m2-final-ad-w)
      minmax(0,var(--m2-final-content-w))
      var(--m2-final-ad-w)!important;
    gap:var(--m2-final-gap)!important;
    margin:var(--m2-final-top-gap) auto 48px!important;
    align-items:stretch!important;
    justify-content:center!important;
  }

  .homepage-layout > .side-ad{
    position:sticky!important;
    top:var(--m2-final-sticky-top)!important;
    width:var(--m2-final-ad-w)!important;
    height:var(--m2-final-ad-h)!important;
    min-height:var(--m2-final-ad-h)!important;
    margin:0!important;
    align-self:start!important;
  }

  .homepage-layout > .home-center{
    min-height:var(--m2-final-ad-h)!important;
  }
}

/*
 * Below the desktop-ad breakpoint all global ads disappear.
 * Previous fixed/sticky desktop properties are fully neutralized.
 */
@media (max-width:1579px){
  body.has-global-ads{
    display:block!important;
  }
  body.has-global-ads > .global-side-ads{
    display:none!important;
  }
  body.has-global-ads > main,
  body.has-global-ads > main.wrap{
    width:min(1180px,calc(100% - 28px))!important;
    max-width:min(1180px,calc(100% - 28px))!important;
    min-height:0!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* Stable scrollbar width prevents 1px horizontal jump between short/long pages. */
html{
  overflow-y:scroll!important;
  scrollbar-gutter:stable;
}
.server-type {
  grid-column: 2!important;
  grid-row: 1!important;
  justify-self: stretch!important;
  text-align: center!important;
  margin: 0 21px!important;
  padding: 6px 10px!important;
  border-radius: 3px!important;
  background: #48b85a!important;
  color: #fff!important;
  font-size: 12px!important;
  font-weight: 700!important;
}

/* ===== V7 REVISION: Raleway / full-width server detail / aligned home lists / uploadable header logo ===== */
html,body,body *,button,input,select,textarea{font-family:"Raleway",sans-serif!important}

/* Header logo can now be changed from Admin > Site Ayarları. */
.brand{min-width:250px!important}
.site-logo-img{display:block;width:auto;max-width:258px;height:auto;max-height:54px;object-fit:contain;object-position:left center}

/* server.php route (index.php /server/slug): use the complete 1040px center lane so it reaches the right banner gap. */
.server-page-grid{grid-template-columns:minmax(0,1fr)!important}
.server-page-main{width:100%!important;min-width:0!important}
.server-page-aside{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;width:100%}
.server-page-aside .sidebar-box{margin-bottom:0!important}
.server-detail-v5,.comments-v5{width:100%!important}

/* Homepage list/table alignment. */
.filter-chips{align-items:center!important}
.filter-chips a{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:36px!important;line-height:1.1!important}
@media(min-width:701px){
  .server-table-head,.server-row{grid-template-columns:52px 132px minmax(0,1fr) 112px 128px!important}
  .server-table-head span{display:flex!important;align-items:center!important;min-height:42px!important;padding:0 12px!important}
  .server-table-head span:nth-child(1),.server-table-head span:nth-child(3){justify-content:flex-start!important;text-align:left!important}
  .server-table-head span:nth-child(2),.server-table-head span:nth-child(4),.server-table-head span:nth-child(5){justify-content:center!important;text-align:center!important}
  .server-row:before{display:flex!important;align-items:center!important;justify-content:flex-start!important;height:100%!important;padding-left:14px!important}
  .server-type{display:flex!important;align-items:center!important;justify-content:center!important;min-height:30px!important;margin:0 10px!important;padding:6px 8px!important;line-height:1.15!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .server-main{padding:9px 14px!important}
  .server-stats span{display:flex!important;align-items:center!important;justify-content:center!important;height:100%!important;padding:8px!important;text-align:center!important;white-space:nowrap!important}
  .server-stats span:last-child{padding-right:44px!important}
  .server-row .vip-badge{top:50%!important;right:8px!important;transform:translateY(-50%)!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:31px!important;height:24px!important;padding:0 6px!important;line-height:1!important}
}

@media(max-width:980px){
  .server-page-aside{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:760px){
  .brand{min-width:0!important;max-width:48vw!important}
  .site-logo-img{max-width:100%!important;max-height:42px!important;object-position:left center!important}
}
@media(max-width:700px){
  .server-page-aside{grid-template-columns:1fr!important}
  .server-type{margin:0 5px!important;padding:7px 3px!important;font-size:10px!important}
}
@media(max-width:520px){
  .brand{max-width:100%!important;justify-content:center!important}
  .site-logo-img{max-width:220px!important;max-height:44px!important;object-position:center!important}
}
\n\n/* ===== V8 REVISION: compact VIP cards ===== */
.vip-card{
  min-height:108px!important;
  padding:12px 128px 10px 12px!important;
}
.vip-logo{width:48px!important;height:48px!important}
.vip-card h3{margin:7px 0 2px!important;font-size:16px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; color: #f00 !important;}
.vip-card p{height:auto!important;max-height:30px!important;margin:0!important;font-size:11.5px!important;line-height:1.4!important;overflow:hidden!important}
.vip-card-meta{position:absolute;right:12px;top:39px;width:108px;display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:right;color:#3f0000;font-size:13px;line-height:1.2}
.vip-card-meta span{display:block;max-width:108px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vip-card-meta b{color:#56636d;font-size:12px;font-weight:700}
.vip-card>.vip-badge{right:9px!important;top:8px!important}
@media(max-width:700px){
  .vip-card{min-height:104px!important;padding-right:122px!important}
  .vip-card-meta{right:10px;width:104px}
}


/* ===== V10: server center, footer logo, category pagination + SEO ===== */
.footer-logo img{display:block;max-width:280px;max-height:64px;width:auto;height:auto;object-fit:contain;object-position:left center}
.like-form{display:inline-flex;margin:0}
.detail-actions-v5{justify-content:center!important;align-items:center!important}
@media(min-width:701px){
  .server-detail-top{grid-template-columns:92px minmax(0,460px)!important;justify-content:center!important;text-align:left!important}
}
.category-count{display:block;margin-top:4px;color:#e6eef1;font-size:10px;font-weight:600}
.category-seo-intro{padding:15px 18px;background:#fbfcfd;border-bottom:1px solid #e1e5e8;color:#5d6871;font-size:12px;line-height:1.75}
.category-seo-intro p{margin:0}
.category-page-card{padding-bottom:0!important}
.category-seo-bottom{padding:19px 20px 21px;border-top:1px solid #e2e6e8;background:#fbfcfd}
.category-seo-bottom h2{margin:0 0 7px;color:#303b43;font-size:18px}
.category-seo-bottom p{margin:0;color:#68747d;font-size:12px;line-height:1.75}
.pagination{display:flex;align-items:center;justify-content:center;gap:6px;padding:18px 14px;border-top:1px solid #e2e6e8;background:#fff;flex-wrap:wrap}
.pagination a,.pagination .page-gap{min-width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;border:1px solid #d7dde1;border-radius:5px;background:#fff;color:#465762;font-size:11px;font-weight:800}
.pagination a:hover{background:#eef4f6;border-color:#b9cbd2;color:#315d6d}
.pagination a.active{background:#880900;color:#fff;border-color:#880900;pointer-events:none}
.pagination .page-arrow{min-width:88px}
.pagination .page-gap{border-color:transparent;background:transparent;min-width:24px;padding:0}
@media(max-width:700px){
  .detail-actions-v5{display:flex!important;justify-content:center!important;flex-wrap:wrap!important}
  .detail-actions-v5 .like-form{flex:1 1 30%!important}
  .detail-actions-v5 .like-form .like-btn{width:100%!important}
  .footer-logo img{margin:auto;max-width:240px;max-height:58px}
  .category-seo-intro,.category-seo-bottom{padding:13px 12px}
  .pagination{padding:13px 8px;gap:4px}.pagination a{min-width:32px;height:33px;padding:0 8px}.pagination .page-arrow{min-width:76px}
}

/* V12 footer logo-only behavior */
.footer-logo img{display:block;max-width:260px;max-height:64px;width:auto;height:auto;object-fit:contain}

/* ===== V14: içerik arka planı + yorum sayfalama ===== */
.site-content-shell{
  display:flow-root;
  min-height:1px;
  background-color:var(--bg);
  background-attachment:scroll;
  overflow:visible;
}
.site-content-shell > main:first-child{margin-top:0}
.comment-page{display:none}
.comment-page.active{display:block}
.comment-pagination{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:15px;padding-top:14px;border-top:1px solid #e4e8ea;flex-wrap:wrap}
.comment-pagination a{min-width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;border:1px solid #d7dde1;border-radius:5px;background:#fff;color:#465762;font-size:11px;font-weight:800}
.comment-pagination a:hover{background:#eef4f6;border-color:#b9cbd2;color:#315d6d}
.comment-pagination a.active{background:#880900;color:#fff;border-color:#880900;pointer-events:none}
[id^="yorumlar-"]{scroll-margin-top:130px}
#yorumlar{scroll-margin-top:130px}

@media(max-width:760px){
  .comment-pagination{gap:4px;margin-top:12px;padding-top:12px}
  .comment-pagination a{min-width:32px;height:32px;padding:0 8px}
}


/* ===== V15: tiled content background + desktop server lane alignment ===== */
/*
 * V14 introduced .site-content-shell so the configurable background can stop
 * before the footer. On wide desktop pages that wrapper became the direct body
 * grid item, while the 1040px <main> was no longer a direct child of body.
 * The old desktop-ad grid rules therefore placed the page at the far-left edge.
 * These rules make the shell occupy the complete content row and re-center its
 * child <main> in the exact 1040px lane between the two 230px banners.
 */
@media (min-width:1580px){
  body.has-global-ads > .site-content-shell{
    grid-column:1 / -1!important;
    grid-row:3!important;
    width:100%!important;
    min-width:0!important;
    min-height:var(--m2-final-ad-h)!important;
    margin:0!important;
    padding:0!important;
    align-self:stretch!important;
  }
  body.has-global-ads > .site-content-shell > main,
  body.has-global-ads > .site-content-shell > main.wrap{
    width:var(--m2-final-content-w)!important;
    max-width:var(--m2-final-content-w)!important;
    min-width:0!important;
    min-height:var(--m2-final-ad-h)!important;
    margin:var(--m2-final-top-gap) auto 48px!important;
    padding-top:0!important;
  }
  body.has-global-ads > .site-content-shell > .server-page-grid{
    width:var(--m2-final-content-w)!important;
    max-width:var(--m2-final-content-w)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* Make the new background tiling switch obvious in Admin > Site Ayarları. */
.content-bg-tile-toggle{
  margin:14px 0 4px!important;
  padding:12px 14px!important;
  border:1px solid #cfd8dd!important;
  border-radius:7px!important;
  background:#f6fafb!important;
  align-items:flex-start!important;
}
.content-bg-tile-toggle strong{display:block;color:#31434d}
.content-bg-tile-toggle small{display:block;margin-top:2px;color:#73818a;font-weight:500;line-height:1.45}

/* ===== V17: rich editor formatting must render exactly on server detail ===== */
.server-rich-content [style*="text-align: center"],
.server-rich-content [style*="text-align:center"]{text-align:center!important}
.server-rich-content [style*="text-align: right"],
.server-rich-content [style*="text-align:right"]{text-align:right!important}
.server-rich-content [style*="text-align: left"],
.server-rich-content [style*="text-align:left"]{text-align:left!important}
.server-rich-content [style*="text-align: justify"],
.server-rich-content [style*="text-align:justify"]{text-align:justify!important}
.server-rich-content strong,.server-rich-content b{font-weight:800}
.server-rich-content em,.server-rich-content i{font-style:italic}
.server-rich-content u{text-decoration:underline}
.server-rich-content ul,.server-rich-content ol{padding-left:24px;margin:10px 0 14px}
.server-rich-content blockquote{margin:14px 0;padding:10px 14px;border-left:3px solid #c68a09;background:rgba(198,138,9,.06)}
.rich-editor [style*="text-align: center"],.rich-editor [style*="text-align:center"]{text-align:center!important}
.rich-editor [style*="text-align: right"],.rich-editor [style*="text-align:right"]{text-align:right!important}
.rich-editor [style*="text-align: left"],.rich-editor [style*="text-align:left"]{text-align:left!important}
.rich-editor [style*="text-align: justify"],.rich-editor [style*="text-align:justify"]{text-align:justify!important}


/* ===== V18 VIP orbit glow / true dark theme / cookie center / mobile sticky header ===== */
@keyframes vipOrbitGlow{to{transform:rotate(360deg)}}
.home-center .vip-grid{position:relative}
.home-center .vip-card{isolation:isolate;overflow:hidden;background:transparent!important;border:1px solid rgba(222,177,61,.7)!important;box-shadow:0 3px 13px rgba(121,77,0,.08)!important}
.home-center .vip-card::before{content:"";position:absolute;z-index:0;left:50%;top:50%;width:190%;aspect-ratio:1;transform:translate(-50%,-50%);background:conic-gradient(from 0deg,transparent 0 26%,rgba(255,200,67,.08) 31%,rgba(255,188,35,.9) 38%,rgba(136,9,0,.78) 45%,transparent 53% 100%);animation:vipOrbitGlow 5.4s linear infinite;pointer-events:none}
.home-center .vip-card::after{content:"";position:absolute;z-index:1;inset:2px;border-radius:5px;background:linear-gradient(145deg,#fffdf7 0%,#fff 58%,#fff8e8 100%);pointer-events:none}
.home-center .vip-card .vip-logo,.home-center .vip-card h3,.home-center .vip-card p{position:relative;z-index:2}
.home-center .vip-card .vip-card-meta,.home-center .vip-card .vip-badge{z-index:3}
.home-center .vip-card:hover{box-shadow:0 6px 22px rgba(165,102,0,.18),0 0 0 1px rgba(239,189,76,.2)!important;transform:translateY(-2px)!important}
@media(prefers-reduced-motion:reduce){.home-center .vip-card::before{animation:none}}

/* Theme switch buttons */
.theme-toggle{display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid #d7dde1;border-radius:7px;background:#fff;color:#394650;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.theme-toggle:hover{background:#f2f5f7;color:#151c22}.theme-toggle-icon{font-size:20px;line-height:1.67}.mobile-theme-toggle{display:none}

/* Dark palette comes last on purpose: legacy light-theme !important rules cannot override it. */
html[data-theme="dark"] .panel-server-link{color:#fff!important;font-size:14px;font-weight:800}
html[data-theme="dark"]{color-scheme:dark;--bg:#0d1117;--surface:#151b22;--surface2:#11171d;--line:#2b333d;--line2:#39434e;--text:#e8edf2;--muted:#96a1ad;--brand:#7d0d08;--brand-dark:#620b07;--link:#68b6ea;--shadow:0 2px 12px rgba(0,0,0,.35)}
html[data-theme="dark"],html[data-theme="dark"] body{background:#0d1117!important;color:#e8edf2!important}
html[data-theme="dark"] body{color:#e8edf2!important}
html[data-theme="dark"] .site-content-shell{background-color:#0d1117!important}
html[data-theme="dark"] .site-header,html[data-theme="dark"] .category-bar,html[data-theme="dark"] .desktop-search-panel{background:#11171d!important;border-color:#2b333d!important;box-shadow:0 3px 12px rgba(0,0,0,.28)!important}
html[data-theme="dark"] .brand,html[data-theme="dark"] .main-nav a,html[data-theme="dark"] .auth-nav a,html[data-theme="dark"] .category-scroll a{color:#dfe6ec!important;background:transparent!important}
html[data-theme="dark"] .main-nav a:hover,html[data-theme="dark"] .auth-nav a:hover,html[data-theme="dark"] .category-scroll a:hover{background:#1b232c!important;color:#fff!important}
html[data-theme="dark"] .category-scroll a{border-color:#2a333d!important}
html[data-theme="dark"] .main-nav .nav-cta{background:#95140d!important;border-color:#bd6b22!important;color:#fff!important}
html[data-theme="dark"] .nav-search-btn,html[data-theme="dark"] .theme-toggle{background:#171e26!important;border-color:#34404b!important;color:#e8edf2!important}
html[data-theme="dark"] .nav-search-btn:hover,html[data-theme="dark"] .theme-toggle:hover{background:#202a34!important}
html[data-theme="dark"] .live-search-form>input,html[data-theme="dark"] .live-search-results{background:#151c23!important;border-color:#38434e!important;color:#ecf1f5!important}
html[data-theme="dark"] .live-search-results a{border-color:#28313a!important}html[data-theme="dark"] .live-search-results a:hover{background:#1c252e!important}
html[data-theme="dark"] .content-card,html[data-theme="dark"] .hero,html[data-theme="dark"] .sidebar-box,html[data-theme="dark"] .auth-card,html[data-theme="dark"] .blog-card,html[data-theme="dark"] .form-title,html[data-theme="dark"] .server-row,html[data-theme="dark"] .category-section,html[data-theme="dark"] .category-grid{background:#151b22!important;color:#e8edf2!important;border-color:#2c3540!important;box-shadow:0 2px 12px rgba(0,0,0,.26)!important}
html[data-theme="dark"] .content-card>.section-title{background:#7f0c07!important;color:#fff!important;border-color:#932017!important}
html[data-theme="dark"] .hero h1,html[data-theme="dark"] .section-title h1,html[data-theme="dark"] .section-title h2,html[data-theme="dark"] .sidebar-box h3,html[data-theme="dark"] .detail-head h1,html[data-theme="dark"] .server-detail-title h1,html[data-theme="dark"] .server-description-head h2,html[data-theme="dark"] .comments-head h2,html[data-theme="dark"] .richtext h2,html[data-theme="dark"] .server-rich-content h2,html[data-theme="dark"] .server-rich-content h3,html[data-theme="dark"] .blog-card h2,html[data-theme="dark"] .article h1,html[data-theme="dark"] .form-title h1{color:#f1f4f7!important}
html[data-theme="dark"] .hero p,html[data-theme="dark"] .form-title .lead,html[data-theme="dark"] .richtext,html[data-theme="dark"] .server-rich-content,html[data-theme="dark"] .comment p,html[data-theme="dark"] .blog-card p,html[data-theme="dark"] .article-meta{color:#aeb8c2!important}
html[data-theme="dark"] .sidebar-box>a{border-color:#28313a!important}html[data-theme="dark"] .sidebar-box>a b,html[data-theme="dark"] .server-main strong{color:#69b8ec!important}
html[data-theme="dark"] .server-main small,html[data-theme="dark"] .sidebar-box>a small{color:#8996a2!important}
html[data-theme="dark"] .server-table-head{background:#10161c!important;color:#e9eef3!important;border-color:#303944!important}
html[data-theme="dark"] .server-row{border-color:#29323b!important}html[data-theme="dark"] .server-row:hover{background:#1a232c!important}html[data-theme="dark"] .server-row:before,html[data-theme="dark"] .server-stats span{color:#c3ccd4!important}
html[data-theme="dark"] .server-row:has(.vip-badge){background:#1a1811!important}html[data-theme="dark"] .server-row:has(.vip-badge):hover{background:#242014!important}
html[data-theme="dark"] .category-tile,html[data-theme="dark"] .filter-chips,html[data-theme="dark"] .category-seo-intro,html[data-theme="dark"] .category-seo-bottom,html[data-theme="dark"] .pagination,html[data-theme="dark"] .comment-pagination{background:#11171d!important;border-color:#2c3540!important;color:#aeb8c2!important}
html[data-theme="dark"] .category-tile{border-color:#303a45!important}html[data-theme="dark"] .category-tile:hover{background:#1b252e!important}
html[data-theme="dark"] .filter-chips a:not(:nth-child(-n+5)),html[data-theme="dark"] .pagination a,html[data-theme="dark"] .comment-pagination a,html[data-theme="dark"] .tags a{background:#182029!important;border-color:#34404b!important;color:#cbd4dc!important}
html[data-theme="dark"] .pagination a.active,html[data-theme="dark"] .comment-pagination a.active{background:#94120c!important;border-color:#b23b21!important;color:#fff!important}
html[data-theme="dark"] .stat-strip,html[data-theme="dark"] .stat-strip span{background:#11171d!important;border-color:#303944!important;color:#8996a2!important}html[data-theme="dark"] .stat-strip b{color:#edf2f6!important}
html[data-theme="dark"] .detail-logo,html[data-theme="dark"] .vip-logo{background:#1b232c!important;border-color:#34404b!important}
html[data-theme="dark"] .btn,html[data-theme="dark"] .like-btn{background:#182029!important;border-color:#3a4652!important;color:#eef2f5!important}html[data-theme="dark"] .btn:hover,html[data-theme="dark"] .like-btn:hover{background:#222d37!important}
html[data-theme="dark"] .btn.primary{background:#e2a934!important;border-color:#efbd4c!important;color:#211908!important}
html[data-theme="dark"] .form-row input,html[data-theme="dark"] .form-row textarea,html[data-theme="dark"] .server-form input,html[data-theme="dark"] .server-form textarea,html[data-theme="dark"] .server-form select,html[data-theme="dark"] .auth-card input,html[data-theme="dark"] .rich-editor,html[data-theme="dark"] .seo-preview{background:#10161c!important;border-color:#38434e!important;color:#edf2f6!important}
html[data-theme="dark"] .rich-toolbar{background:#11171d!important;border-color:#38434e!important}html[data-theme="dark"] .rich-toolbar button{background:#1a222b!important;border-color:#3a4652!important;color:#e8edf2!important}
html[data-theme="dark"] .comment,html[data-theme="dark"] blockquote{border-color:#34404b!important}
html[data-theme="dark"] .footer{background:#10161c!important;color:#96a3ae!important;border-color:#2b333d!important}html[data-theme="dark"] .footer-grid b,html[data-theme="dark"] .footer-grid strong{color:#eef2f5!important}html[data-theme="dark"] .footer-grid a{color:#8fb9d0!important}html[data-theme="dark"] .copyright{border-color:#28313a!important;color:#7f8b96!important}
html[data-theme="dark"] .side-ad{background:#11171d!important;border-color:#2d3741!important}
html[data-theme="dark"] .home-center .vip-card{border-color:#795b22!important;box-shadow:0 4px 18px rgba(0,0,0,.34)!important}
html[data-theme="dark"] .home-center .vip-card::after{background:linear-gradient(145deg,#1c1b16 0%,#151b22 55%,#191812 100%)!important}
html[data-theme="dark"] .home-center .vip-card h3{color:#f3f0e7!important}html[data-theme="dark"] .home-center .vip-card p{color:#a9a69e!important}html[data-theme="dark"] .vip-card-meta b{color:#d7dce1!important}

/* Cookie floating button + preferences modal */
.cookie-fab{position:fixed;left:max(14px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom));z-index:360;width:48px;height:48px;padding:0;border:3px solid #fff;border-radius:50%;background:#880900;color:#ffffff;display:grid;place-items:center;cursor:pointer;box-shadow:0 5px 16px rgba(28,55,0,.28);transition:transform .18s,box-shadow .18s}
.cookie-fab:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 8px 22px rgba(28,55,0,.34)}.cookie-fab svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.cookie-modal[hidden]{display:none!important}.cookie-modal{position:fixed;inset:0;z-index:500;display:grid;place-items:center;padding:22px;background:rgba(7,11,15,.62);backdrop-filter:blur(3px)}body.cookie-modal-open{overflow:hidden}
.cookie-dialog{width:min(900px,100%);max-height:min(760px,calc(100vh - 34px));overflow:auto;background:#fff;border:1px solid #cbd2d8;border-radius:11px;box-shadow:0 24px 80px rgba(0,0,0,.32);color:#26313a}
.cookie-dialog-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding:20px 22px 16px;background:#fff;border-bottom:1px solid #dde2e6}.cookie-dialog-head span{display:block;color:#880900;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.cookie-dialog-head h2{margin:3px 0 0;font-size:23px;line-height:1.2}.cookie-close{width:34px;height:34px;padding:0;border:0;border-radius:50%;background:#880900;color:#fff;font-size:24px;line-height:1;cursor:pointer}
.cookie-intro{padding:16px 22px 8px;color:#596671;font-size:12px;line-height:1.7}.cookie-intro p{margin:0 0 7px}.cookie-intro strong{color:#2b3740}
.cookie-groups{padding:0 22px}.cookie-group{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 8px;border-top:1px solid #e1e5e8;cursor:pointer}.cookie-group>span{display:grid;gap:5px}.cookie-group b{font-size:13px}.cookie-group small{color:#6f7b85;font-size:11px;line-height:1.5}
.cookie-switch{position:relative;flex:0 0 48px;width:48px;height:26px}.cookie-switch input{position:absolute;opacity:0;pointer-events:none}.cookie-switch em{position:absolute;inset:0;border-radius:99px;background:#aeb7bf;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);transition:.18s}.cookie-switch em:after{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.2);transition:.18s}.cookie-switch input:checked+em{background:#27353f}.cookie-switch input:checked+em:after{transform:translateX(22px)}.cookie-switch input:disabled+em{background:#880900;opacity:.9}
.cookie-actions{position:sticky;bottom:0;display:flex;justify-content:flex-start;gap:10px;padding:15px 18px;background:#f8f9fa;border-top:1px solid #dce1e5}.cookie-actions button{min-height:38px;padding:9px 15px;border-radius:5px;font-weight:800;font-size:11px;cursor:pointer}.cookie-secondary{border:1px solid #66a919;background:#880900;color:#fff}.cookie-primary{border:1px solid #66a919;background:#880900;color:#fff}
html[data-theme="dark"] .cookie-fab{border-color:#151b22!important}html[data-theme="dark"] .cookie-dialog,html[data-theme="dark"] .cookie-dialog-head{background:#151b22!important;border-color:#303944!important;color:#edf2f6!important}html[data-theme="dark"] .cookie-intro,html[data-theme="dark"] .cookie-group small{color:#a5b0ba!important}html[data-theme="dark"] .cookie-intro strong{color:#eef3f6!important}html[data-theme="dark"] .cookie-group{border-color:#2d3640!important}html[data-theme="dark"] .cookie-actions{background:#10161c!important;border-color:#303944!important}

@media(max-width:700px){
  .site-header{position:sticky!important;top:0!important;z-index:180!important}
  .mobile-theme-toggle{display:inline-grid!important;flex:0 0 32px!important;width:32px!important;height:32px!important;min-height:32px!important;border-radius:6px!important}
  .desktop-theme-toggle{display:none!important}
  .cookie-fab{width:44px;height:44px;left:10px;bottom:10px}.cookie-fab svg{width:26px;height:26px}
  .cookie-modal{padding:8px;align-items:end}.cookie-dialog{max-height:88vh;border-radius:12px 12px 7px 7px}.cookie-dialog-head{padding:15px 14px 12px}.cookie-dialog-head h2{font-size:19px}.cookie-intro{padding:12px 14px 5px}.cookie-groups{padding:0 10px}.cookie-group{padding:13px 5px;gap:10px}.cookie-group small{font-size:10px}.cookie-actions{display:grid;grid-template-columns:1fr 1fr;padding:10px}.cookie-primary{grid-column:1/-1}
}

/* ===== V19 VIP CARD: premium outer orbit + inner moving light ===== */
@keyframes vipOuterOrbitV19{
  0%{transform:translate(-50%,-50%) rotate(0deg)}
  100%{transform:translate(-50%,-50%) rotate(360deg)}
}
@keyframes vipInnerFlowV19{
  0%,100%{background-position:-35% 15%, 125% 50%, 0 0}
  50%{background-position:135% 80%, -30% 50%, 0 0}
}
@keyframes vipPulseV19{
  0%,100%{box-shadow:0 4px 15px rgba(117,78,0,.10),0 0 0 1px rgba(238,189,76,.10),inset 0 0 22px rgba(255,214,98,.08)}
  50%{box-shadow:0 7px 22px rgba(151,96,0,.16),0 0 0 1px rgba(238,189,76,.24),inset 0 0 30px rgba(255,214,98,.15)}
}

/* Main VIP card shell */
.home-center .vip-card{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:transparent!important;
  border:0!important;
  border-radius:9px!important;
  box-shadow:0 4px 15px rgba(117,78,0,.10),0 0 0 1px rgba(238,189,76,.10)!important;
  animation:vipPulseV19 4.8s ease-in-out infinite;
}

/* OUTSIDE: light travels continuously around the frame */
.home-center .vip-card::before{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  left:50%!important;
  top:50%!important;
  width:190%!important;
  aspect-ratio:1!important;
  transform:translate(-50%,-50%) rotate(0deg);
  background:
    conic-gradient(
      from 0deg,
      rgba(255,255,255,0) 0deg 62deg,
      rgba(255,220,112,.08) 76deg,
      rgba(255,205,70,.96) 93deg,
      rgba(255,247,201,1) 103deg,
      rgba(189,121,0,.92) 115deg,
      rgba(136,9,0,.82) 127deg,
      rgba(255,255,255,0) 151deg 360deg
    )!important;
  animation:vipOuterOrbitV19 4.2s linear infinite!important;
  pointer-events:none!important;
  will-change:transform;
}

/* INSIDE V20: white/ivory surface + moving deep-red shimmer */
.home-center .vip-card::after{
  content:""!important;
  position:absolute!important;
  z-index:1!important;
  inset:2px!important;
  border-radius:7px!important;
  pointer-events:none!important;
  background:
    radial-gradient(circle at center,rgba(136,9,0,.22) 0,rgba(117,10,5,.12) 18%,rgba(255,255,255,0) 44%),
    linear-gradient(110deg,rgba(255,255,255,0) 24%,rgba(136,9,0,.04) 36%,rgba(151,18,10,.30) 48%,rgba(255,244,241,.72) 52%,rgba(109,8,3,.13) 61%,rgba(255,255,255,0) 73%),
    linear-gradient(145deg,#fffaf8 0%,#ffffff 47%,#fff5f2 100%)!important;
  background-size:150% 150%,220% 100%,100% 100%!important;
  background-repeat:no-repeat!important;
  animation:vipInnerFlowV19 6.8s ease-in-out infinite!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.82),
    inset 0 0 30px rgba(136,9,0,.13)!important;
}

/* Keep all real card content above both effects */
.home-center .vip-card .vip-logo,
.home-center .vip-card h3,
.home-center .vip-card p,
.home-center .vip-card .vip-card-meta,
.home-center .vip-card .vip-badge{
  position:relative;
  z-index:3!important;
}

.home-center .vip-card .vip-logo{
  box-shadow:0 3px 10px rgba(91,8,3,.10),0 0 0 1px rgba(136,9,0,.14);
}

.home-center .vip-card:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 9px 28px rgba(151,96,0,.21),0 0 0 1px rgba(255,201,62,.30)!important;
}
.home-center .vip-card:hover::before{animation-duration:3.25s!important}
.home-center .vip-card:hover::after{
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.9),
    inset 0 0 38px rgba(136,9,0,.20)!important;
}

/* Dark theme keeps the premium VIP identity without becoming a bright white block. */
html[data-theme="dark"] .home-center .vip-card{
  box-shadow:0 6px 22px rgba(0,0,0,.38),0 0 0 1px rgba(196,146,40,.20)!important;
}
html[data-theme="dark"] .home-center .vip-card::after{
  background:
    radial-gradient(circle at center,rgba(136,9,0,.20) 0,rgba(96,7,3,.10) 20%,rgba(0,0,0,0) 45%),
    linear-gradient(110deg,rgba(255,255,255,0) 24%,rgba(136,9,0,.03) 37%,rgba(168,20,12,.15) 49%,rgba(255,225,221,.08) 52%,rgba(104,7,3,.05) 62%,rgba(255,255,255,0) 74%),
    linear-gradient(145deg,#211716 0%,#151b22 50%,#1c1312 100%)!important;
  background-size:150% 150%,220% 100%,100% 100%!important;
  animation:vipInnerFlowV19 6.8s ease-in-out infinite!important;
  box-shadow:inset 0 0 0 1px rgba(178,45,34,.06),inset 0 0 32px rgba(136,9,0,.13)!important;
}
html[data-theme="dark"] .home-center .vip-card h3{color:#fff2c7!important}
html[data-theme="dark"] .home-center .vip-card p{color:#bbb7ac!important}

@media(prefers-reduced-motion:reduce){
  .home-center .vip-card,
  .home-center .vip-card::before,
  .home-center .vip-card::after{
    animation:none!important;
  }
}

.vip-card{
    padding: 1px 12px !important;
}

.vip-card h3{
    margin: 5px 0 2px !important;
}

.vip-card p{
    height: 22px !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}

.vip-logo{
    width: 46px !important;
    height: 46px !important;
}


/* ==========================================================================
   V22 VIP SPOTLIGHT CARD
   Exact target: homepage "VIP Metin2 Serverler" cards only.
   Different layout: premium plaque + deep-red edge + moving internal spotlight.
   ========================================================================== */

@keyframes vipSpotlightSweepV22{
  0%{transform:translateX(-165%) skewX(-18deg);opacity:0}
  15%{opacity:.18}
  48%{opacity:.38}
  75%{opacity:.12}
  100%{transform:translateX(360%) skewX(-18deg);opacity:0}
}

@keyframes vipLogoBreathV22{
  0%,100%{box-shadow:0 5px 14px rgba(61,12,8,.12),0 0 0 3px rgba(136,9,0,.055)}
  50%{box-shadow:0 7px 18px rgba(90,10,5,.18),0 0 0 4px rgba(136,9,0,.095)}
}

.home-center .vip-grid{
  gap:14px!important;
}

/* Card geometry */
.home-center .vip-card{
  display:grid!important;
  grid-template-columns:64px minmax(0,1fr) auto!important;
  grid-template-rows:30px 28px minmax(22px,auto)!important;
  column-gap:13px!important;
  align-items:center!important;

  min-height:126px!important;
  padding:14px 14px 13px 16px!important;
  overflow:hidden!important;
  position:relative!important;
  isolation:isolate!important;

  border:1px solid rgba(136,9,0,.28)!important;
  border-radius:10px!important;
  background:
    radial-gradient(circle at 88% 115%,rgba(136,9,0,.11) 0,rgba(136,9,0,.045) 28%,transparent 54%),
    linear-gradient(125deg,#ffffff 0%,#fffdfa 48%,#fff6f3 100%)!important;

  box-shadow:
    inset 5px 0 0 #880900,
    inset 0 1px 0 rgba(255,255,255,.95),
    0 6px 18px rgba(55,34,29,.08)!important;

  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important;
  animation:none!important;
}

/* Moving interior highlight - not a big red fill */
.home-center .vip-card::before{
  content:""!important;
  position:absolute!important;
  z-index:1!important;
  top:-45%!important;
  bottom:-45%!important;
  left:-34%!important;
  width:30%!important;
  height:auto!important;
  aspect-ratio:auto!important;
  border-radius:0!important;
  pointer-events:none!important;

  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(136,9,0,.035) 22%,
    rgba(136,9,0,.13) 48%,
    rgba(255,255,255,.65) 52%,
    rgba(136,9,0,.055) 65%,
    transparent 100%
  )!important;

  transform:translateX(-165%) skewX(-18deg);
  animation:vipSpotlightSweepV22 5.7s ease-in-out infinite!important;
}

/* Decorative red aura in lower-right corner */
.home-center .vip-card::after{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  width:145px!important;
  height:145px!important;
  inset:auto -78px -88px auto!important;
  border-radius:50%!important;
  pointer-events:none!important;
  background:radial-gradient(circle,rgba(136,9,0,.17) 0%,rgba(136,9,0,.07) 38%,transparent 71%)!important;
  box-shadow:none!important;
  animation:none!important;
}

/* All actual card content stays above effects */
.home-center .vip-card > *{
  position:relative!important;
  z-index:3!important;
}

/* Logo becomes a focal point */
.home-center .vip-card .vip-logo{
  grid-column:1!important;
  grid-row:1 / 4!important;
  width:58px!important;
  height:58px!important;
  align-self:center!important;
  border-radius:13px!important;
  border:1px solid rgba(136,9,0,.25)!important;
  background:#fff!important;
  box-shadow:0 5px 14px rgba(61,12,8,.12),0 0 0 3px rgba(136,9,0,.055)!important;
  animation:vipLogoBreathV22 4.2s ease-in-out infinite!important;
}
.home-center .vip-card .vip-logo img{
  border-radius:12px!important;
}

/* Category + likes are now compact "data chips" */
.home-center .vip-card .vip-card-meta{
  grid-column:2!important;
  grid-row:1!important;
  position:static!important;
  width:auto!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:6px!important;
  text-align:left!important;
  font-size:10px!important;
  line-height:1!important;
  color:#5b6268!important;
}

.home-center .vip-card .vip-card-meta span,
.home-center .vip-card .vip-card-meta b{
  display:inline-flex!important;
  align-items:center!important;
  min-height:23px!important;
  max-width:none!important;
  padding:0 8px!important;
  border-radius:999px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.home-center .vip-card .vip-card-meta span{
  max-width:115px!important;
  border:1px solid #ead9d5!important;
  background:rgba(255,255,255,.83)!important;
  color:#5d4742!important;
  font-weight:700!important;
}

.home-center .vip-card .vip-card-meta b{
  border:1px solid #ece8e5!important;
  background:#f7f5f3!important;
  color:#5d666d!important;
  font-size:10px!important;
  font-weight:800!important;
}

/* VIP ribbon */
.home-center .vip-card > .vip-badge{
  grid-column:3!important;
  grid-row:1!important;
  position:static!important;
  justify-self:end!important;
  align-self:center!important;
  min-width:37px!important;
  height:23px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 8px!important;
  border:1px solid rgba(94,4,0,.28)!important;
  border-radius:5px!important;
  background:linear-gradient(180deg,#a4150d 0%,#780700 100%)!important;
  color:#fff!important;
  box-shadow:0 3px 8px rgba(93,7,2,.18)!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.04em!important;
}

/* Server identity */
.home-center .vip-card h3{
  grid-column:2 / 4!important;
  grid-row:2!important;
  margin:0!important;
  min-width:0!important;
  color:#880900!important;
  font-size:18px!important;
  line-height:1.05!important;
  font-weight:850!important;
  letter-spacing:-.015em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.home-center .vip-card p{
  grid-column:2 / 4!important;
  grid-row:3!important;
  align-self:start!important;
  height:auto!important;
  max-height:31px!important;
  margin:1px 0 0!important;
  color:#3e4449!important;
  font-size:10.5px!important;
  line-height:1.45!important;
  overflow:hidden!important;
}

/* Small bottom accent line gives the card a "premium plaque" finish */
.home-center .vip-card{
  background-color:#fff!important;
}
.home-center .vip-card:hover{
  transform:translateY(-3px)!important;
  border-color:rgba(136,9,0,.48)!important;
  box-shadow:
    inset 5px 0 0 #880900,
    inset 0 1px 0 rgba(255,255,255,1),
    0 12px 27px rgba(90,13,8,.15),
    0 0 0 2px rgba(136,9,0,.045)!important;
}
.home-center .vip-card:hover .vip-logo{
  transform:scale(1.025);
}

/* Dark mode counterpart */
html[data-theme="dark"] .home-center .vip-card{
  border-color:rgba(186,53,43,.30)!important;
  background:
    radial-gradient(circle at 88% 115%,rgba(136,9,0,.25) 0,rgba(136,9,0,.08) 31%,transparent 56%),
    linear-gradient(125deg,#171c22 0%,#151a20 48%,#211616 100%)!important;
  box-shadow:
    inset 5px 0 0 #9b160e,
    inset 0 1px 0 rgba(255,255,255,.025),
    0 8px 22px rgba(0,0,0,.30)!important;
}
html[data-theme="dark"] .home-center .vip-card::after{
  background:radial-gradient(circle,rgba(174,22,13,.25) 0%,rgba(136,9,0,.10) 38%,transparent 71%)!important;
}
html[data-theme="dark"] .home-center .vip-card .vip-logo{
  background:#20262d!important;
  border-color:rgba(190,63,50,.36)!important;
}
html[data-theme="dark"] .home-center .vip-card .vip-card-meta span{
  border-color:#3a3030!important;
  background:#1d2228!important;
  color:#d6c7c3!important;
}
html[data-theme="dark"] .home-center .vip-card .vip-card-meta b{
  border-color:#303840!important;
  background:#1c2229!important;
  color:#cbd3da!important;
}
html[data-theme="dark"] .home-center .vip-card h3{color:#ffddd8!important}
html[data-theme="dark"] .home-center .vip-card p{color:#b9c0c6!important}

/* Mobile: keep the same identity, just slightly tighter */
@media(max-width:700px){
  .home-center .vip-card{
    grid-template-columns:58px minmax(0,1fr) auto!important;
    grid-template-rows:28px 25px minmax(20px,auto)!important;
    min-height:112px!important;
    padding:11px 11px 10px 14px!important;
    column-gap:10px!important;
  }
  .home-center .vip-card .vip-logo{
    width:52px!important;
    height:52px!important;
  }
  .home-center .vip-card h3{font-size:16px!important}
  .home-center .vip-card p{font-size:10px!important;max-height:29px!important}
  .home-center .vip-card .vip-card-meta span{max-width:94px!important}
}

@media(prefers-reduced-motion:reduce){
  .home-center .vip-card::before,
  .home-center .vip-card .vip-logo{
    animation:none!important;
  }
}

/* ===== V24 ADMIN-CONTROLLED CATEGORY COLORS ===== */
/* Every category uses --cat-color / --cat-text / --cat-border supplied by PHP. */
.filter-chips a,
.filter-chips a:nth-child(1),.filter-chips a:nth-child(2),.filter-chips a:nth-child(3),.filter-chips a:nth-child(4),
.filter-chips a:nth-child(5),.filter-chips a:nth-child(6),.filter-chips a:nth-child(7),.filter-chips a:nth-child(8),
.filter-chips a:nth-child(9),.filter-chips a:nth-child(10){
  background:var(--cat-color,#880900)!important;
  color:var(--cat-text,#fff)!important;
  border-color:var(--cat-border,#680700)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 6px rgba(28,25,24,.10)!important;
  transition:transform .15s ease,filter .15s ease,box-shadow .15s ease!important;
}
.filter-chips a:hover{
  background:var(--cat-color,#880900)!important;
  color:var(--cat-text,#fff)!important;
  border-color:var(--cat-border,#680700)!important;
  filter:brightness(.93) saturate(1.08)!important;
  transform:translateY(-1px)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 4px 10px rgba(28,25,24,.16)!important;
}
.server-type{
  background:var(--cat-color,#48b85a)!important;
  color:var(--cat-text,#fff)!important;
  border:1px solid var(--cat-border,#399348)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 1px 3px rgba(0,0,0,.08)!important;
}
.category-colored-chip{
  background:var(--cat-color,#880900)!important;
  color:var(--cat-text,#fff)!important;
  border-color:var(--cat-border,#680700)!important;
}
html[data-theme="dark"] .filter-chips a,
html[data-theme="dark"] .server-type,
html[data-theme="dark"] .category-colored-chip{
  background:var(--cat-color,#880900)!important;
  color:var(--cat-text,#fff)!important;
  border-color:var(--cat-border,#680700)!important;
}


/* ==========================================================================
   V25 DARK THEME FINAL FIX
   Desktop + mobile. Fixes the remaining light surfaces shown in screenshots.
   ========================================================================== */

html[data-theme="dark"] body{
  background:#0b1117!important;
  color:#e8edf2!important;
}
html[data-theme="dark"] .site-content-shell{
  background-color:#0b1117!important;
}

/* Inputs / placeholders / labels */
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select{color-scheme:dark}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{color:#77838f!important}
html[data-theme="dark"] .server-form label,
html[data-theme="dark"] .field-label,
html[data-theme="dark"] .auth-card label{color:#d8e0e7!important}
html[data-theme="dark"] .server-form label>small,
html[data-theme="dark"] .field-label small,
html[data-theme="dark"] .editor-help{color:#85929e!important}

/* Header mobile actions */
html[data-theme="dark"] .mobile-actions a{
  background:#171e26!important;
  border-color:#34404b!important;
  color:#e7edf2!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .mobile-actions a:hover{
  background:#202a34!important;
  color:#fff!important;
}
html[data-theme="dark"] .mobile-actions .mobile-server-add{
  background:#920d07!important;
  border-color:#a31b13!important;
  color:#fff!important;
}
html[data-theme="dark"] .mobile-actions .mobile-server-add:hover{background:#a9140c!important}

/* Flash messages */
html[data-theme="dark"] .flash.ok{
  background:#13251a!important;
  border-color:#285b38!important;
  color:#9edbb0!important;
}
html[data-theme="dark"] .flash.err{
  background:#2b1516!important;
  border-color:#6d2c2e!important;
  color:#f1a3a6!important;
}

/* Member panel */
html[data-theme="dark"] .panel-hero{
  background:
    radial-gradient(circle at 92% 15%,rgba(149,23,12,.28),transparent 32%),
    linear-gradient(135deg,#222a32 0%,#161d24 56%,#251715 100%)!important;
  border-color:#35404a!important;
  box-shadow:0 8px 26px rgba(0,0,0,.27)!important;
}
html[data-theme="dark"] .panel-hero .eyebrow{color:#d9a15e!important}
html[data-theme="dark"] .panel-hero h1{color:#f5f7f9!important}
html[data-theme="dark"] .panel-hero p{color:#aeb9c3!important}

html[data-theme="dark"] .dashboard-cards-v5 article{
  background:#151c23!important;
  border-color:#2f3944!important;
  box-shadow:0 4px 14px rgba(0,0,0,.20)!important;
}
html[data-theme="dark"] .dashboard-cards-v5 article:hover{
  background:#18212a!important;
  border-color:#3a4652!important;
}
html[data-theme="dark"] .dash-icon{
  background:#271c15!important;
  color:#efbd4c!important;
  border:1px solid #49351e!important;
}
html[data-theme="dark"] .dashboard-cards-v5 b{color:#eef3f7!important}
html[data-theme="dark"] .dashboard-cards-v5 small{color:#8f9ba6!important}

html[data-theme="dark"] .panel-card-head{
  background:#151c23!important;
  border-color:#303a45!important;
}
html[data-theme="dark"] .panel-card-head h2{color:#edf2f6!important}
html[data-theme="dark"] .panel-count{
  background:#10161c!important;
  border-color:#34404b!important;
  color:#9ba7b2!important;
}
html[data-theme="dark"] .panel-table th{
  background:#10161c!important;
  color:#dfe6ec!important;
  border-color:#303944!important;
}
html[data-theme="dark"] .panel-table td{
  color:#aeb9c3!important;
  border-color:#28323b!important;
}
html[data-theme="dark"] .panel-table tbody tr:hover{background:#19222b!important}
html[data-theme="dark"] .panel-table td:before{color:#dce4ea!important}
html[data-theme="dark"] .panel-empty{color:#87949f!important}
html[data-theme="dark"] .panel-empty b{color:#dbe3e9!important}
html[data-theme="dark"] .panel-empty span{color:#84919c!important}

/* Server add / SEO */
html[data-theme="dark"] .server-add-card{
  background:#151b22!important;
  border-color:#303944!important;
}
html[data-theme="dark"] .seo-details{
  background:#141b22!important;
  border-color:#35404b!important;
}
html[data-theme="dark"] .seo-details summary{
  background:#182129!important;
  color:#e2e9ee!important;
  border-color:#35404b!important;
}
html[data-theme="dark"] .seo-details summary small{color:#8d99a4!important}
html[data-theme="dark"] .seo-details .grid-2{background:#141b22!important}
html[data-theme="dark"] .seo-preview{
  background:#0f151b!important;
  border-color:#33404b!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02)!important;
}
html[data-theme="dark"] .seo-preview small{color:#7f8c97!important}
html[data-theme="dark"] .seo-preview b{color:#7eb9ef!important}
html[data-theme="dark"] .seo-preview span{color:#4eb77a!important}
html[data-theme="dark"] .seo-preview p{color:#89959f!important}

/* Server detail */
html[data-theme="dark"] .server-detail-v5,
html[data-theme="dark"] .comments-v5{
  background:#151b22!important;
  border-color:#303944!important;
}
html[data-theme="dark"] .server-detail-top{
  background:
    radial-gradient(circle at 85% 15%,rgba(136,9,0,.08),transparent 38%),
    linear-gradient(180deg,#171e25 0%,#151b22 100%)!important;
  border-color:#303944!important;
}
html[data-theme="dark"] .server-detail-title h1{color:#f2f5f7!important}
html[data-theme="dark"] .server-detail-title p{color:#9ca8b3!important}
html[data-theme="dark"] .category-pill{
  background:#1b2730!important;
  border-color:#38505f!important;
  color:#9fc3d5!important;
}
html[data-theme="dark"] .detail-actions-v5{
  background:#11171d!important;
  border-color:#303944!important;
}
html[data-theme="dark"] .detail-actions-v5 .like-form{background:transparent!important}
html[data-theme="dark"] .server-banner-wrap{background:#151b22!important}
html[data-theme="dark"] .server-banner{
  background:#10161c!important;
  border-color:#303944!important;
}
html[data-theme="dark"] .server-description-block{background:#151b22!important}
html[data-theme="dark"] .server-description-head{border-color:#303944!important}
html[data-theme="dark"] .comments-head,
html[data-theme="dark"] .comment-list{border-color:#303944!important}

/* Footer */
html[data-theme="dark"] .footer{
  background:#0f161c!important;
  border-top-color:#2b3540!important;
  color:#919eaa!important;
}
html[data-theme="dark"] .footer-brand-col p{color:#87949f!important}
html[data-theme="dark"] .footer-col strong{color:#eef2f5!important}
html[data-theme="dark"] .footer-col a{
  color:#8fb9d0!important;
  background:transparent!important;
  border:0!important;
}
html[data-theme="dark"] .footer-col a:hover{
  color:#d1e8f4!important;
  background:transparent!important;
}
html[data-theme="dark"] .copyright{
  background:#0b1117!important;
  border-top:1px solid #26313a!important;
  color:#798691!important;
}

/* Mobile cleanup */
@media(max-width:700px){
  html[data-theme="dark"] .panel-page{background:transparent!important}
  html[data-theme="dark"] .panel-hero{border-radius:7px!important}
  html[data-theme="dark"] .dashboard-cards-v5 article{border-radius:7px!important}

  /* remove long footer separator lines */
  html[data-theme="dark"] .footer-col a{
    min-width:0!important;
    width:auto!important;
    padding:6px 4px!important;
    border-bottom:0!important;
  }
  html[data-theme="dark"] .footer-col{gap:1px!important}
  html[data-theme="dark"] .footer-grid{gap:18px!important}

  html[data-theme="dark"] .server-detail-top,
  html[data-theme="dark"] .detail-actions-v5,
  html[data-theme="dark"] .server-banner-wrap,
  html[data-theme="dark"] .server-description-block{
    background-color:#151b22!important;
  }

  html[data-theme="dark"] .seo-details,
  html[data-theme="dark"] .seo-details .grid-2{
    background:#141b22!important;
  }
}

/* Desktop polish */
@media(min-width:701px){
  html[data-theme="dark"] .footer-grid{border:0!important}
  html[data-theme="dark"] .panel-server-card{border-color:#303944!important}
  html[data-theme="dark"] .server-detail-v5{
    box-shadow:0 5px 20px rgba(0,0,0,.20)!important;
  }
}

/* ===== V26: separate header/footer logos for dark theme ===== */
.theme-logo-dark{display:none!important}
html[data-theme="dark"] .theme-logo-light.has-theme-alternate{display:none!important}
html[data-theme="dark"] .theme-logo-dark{display:block!important}
.site-logo-img.theme-logo-dark{
  width:auto!important;
  max-width:258px!important;
  height:auto!important;
  max-height:54px!important;
  object-fit:contain!important;
  object-position:left center!important;
}
.footer-logo .theme-logo-dark{
  width:auto!important;
  height:auto!important;
  object-fit:contain!important;
}
@media(max-width:760px){
  .site-logo-img.theme-logo-dark,
  .site-logo-img.theme-logo-light{
    max-width:190px!important;
    max-height:52px!important;
  }
}


/* ==========================================================================
   V27 TOP BANNER + DARK SIDE-BANNER CLEANUP
   ========================================================================== */

/* Active Admin > Banner > "Üst" ads are rendered directly below the category bar. */
.top-ad-wrap{
  width:min(1040px,calc(100% - 28px));
  margin:20px auto 0;
  position:relative;
  z-index:6;
}
.top-ad{
  width:100%;
  height:clamp(76px,14.285vw,200px);
  overflow:hidden;
  border:1px solid #d3d9de;
  border-radius:7px;
  background:#fff;
  box-shadow:0 2px 9px rgba(20,32,43,.08);
}
.top-ad-link{
  display:block;
  width:100%;
  height:100%;
}
.top-ad img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  background:transparent!important;
}

/* If a top ad exists, keep the following main content spacing consistent. */
.site-content-shell > .top-ad-wrap + main{
  margin-top:18px!important;
}

/* On the homepage the 1040px top ad aligns with the center lane between vertical ads. */
.site-content-shell > .top-ad-wrap + .homepage-layout{
  margin-top:18px!important;
}

/* Dark theme: no white frame/gutters around 230x900 side banners. */
html[data-theme="dark"] .side-ad,
html[data-theme="dark"] .homepage-layout > .side-ad,
html[data-theme="dark"] .global-side-ads .side-ad,
html[data-theme="dark"] body.has-global-ads > .global-side-ads > .side-ad{
  background:#0b1117!important;
  border-color:#2a333c!important;
  box-shadow:0 2px 10px rgba(0,0,0,.34)!important;
}

html[data-theme="dark"] .side-ad img,
html[data-theme="dark"] .homepage-layout > .side-ad img,
html[data-theme="dark"] .global-side-ads .side-ad img,
html[data-theme="dark"] body.has-global-ads > .global-side-ads > .side-ad img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  background:transparent!important;
  object-fit:cover!important;
}

/* Top banner follows dark theme without creating a white outer frame. */
html[data-theme="dark"] .top-ad{
  background:#0b1117!important;
  border-color:#2d3741!important;
  box-shadow:0 3px 14px rgba(0,0,0,.30)!important;
}
html[data-theme="dark"] .top-ad img{
  background:transparent!important;
}

@media(max-width:1579px){
  .top-ad-wrap{
    width:min(1120px,calc(100% - 20px));
    margin-top:12px;
  }
  .top-ad{
    height:clamp(76px,14.285vw,160px);
  }
}

@media(max-width:700px){
  .top-ad-wrap{
    width:calc(100% - 12px);
    margin-top:10px;
  }
  .top-ad{
    height:80px;
    border-radius:5px;
  }
  .site-content-shell > .top-ad-wrap + main,
  .site-content-shell > .top-ad-wrap + .homepage-layout{
    margin-top:10px!important;
  }
}


/* ==========================================================================
   V28 1400x200 TOP BANNER / SIDE BANNERS STAY UP
   ========================================================================== */

/*
 * Top-banner source standard: 1400 × 200 (7:1).
 * It is never stretched vertically. On the homepage it scales into the
 * 1040px center lane, which renders at ~1040 × 149 while preserving 1400:200.
 */
.top-ad{
  height:auto!important;
  aspect-ratio:7 / 1!important;
  max-height:200px!important;
}
.top-ad img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}

/*
 * Homepage: the top banner now belongs to .home-center.
 * This means the 230x900 left/right banners start at the normal top edge
 * whether the top banner is active or not.
 */
.homepage-layout > .home-center > .top-ad-wrap{
  width:100%!important;
  max-width:none!important;
  margin:0 0 18px!important;
  padding:0!important;
}

.homepage-layout > .home-center > .top-ad-wrap .top-ad{
  width:100%!important;
  margin:0!important;
}

/* Keep the side banners exactly at the top of the homepage grid. */
.homepage-layout > .side-ad{
  margin-top:0!important;
  align-self:start!important;
}

/* Inner pages keep their centered top-banner behavior. */
.site-content-shell > .top-ad-wrap{
  width:min(1040px,calc(100% - 28px))!important;
}

/* The old sibling margin rules are no longer needed on homepage. */
.site-content-shell > .top-ad-wrap + .homepage-layout{
  margin-top:20px!important;
}

@media(max-width:1579px){
  .top-ad{
    aspect-ratio:7 / 1!important;
    height:auto!important;
    max-height:200px!important;
  }
}

@media(max-width:700px){
  /*
   * Mobile also preserves the 1400:200 ratio instead of forcing 80px.
   * Example: ~375px usable width => ~54px banner height.
   */
  .top-ad{
    height:auto!important;
    aspect-ratio:7 / 1!important;
    max-height:none!important;
  }
  .homepage-layout > .home-center > .top-ad-wrap{
    margin-bottom:10px!important;
  }
}


/* ==========================================================================
   V32 LIGHT THEME SIDE BANNER EDGE FIX
   Remove the thin white frame/background around 230x900 left/right banners.
   ========================================================================== */
html:not([data-theme="dark"]) .side-ad,
html:not([data-theme="dark"]) .homepage-layout > .side-ad,
html:not([data-theme="dark"]) .global-side-ads .side-ad,
html:not([data-theme="dark"]) body.has-global-ads > .global-side-ads > .side-ad{
  border:0!important;
  background:transparent!important;
  box-shadow:0 2px 8px rgba(0,0,0,.10)!important;
}

html:not([data-theme="dark"]) .side-ad img,
html:not([data-theme="dark"]) .homepage-layout > .side-ad img,
html:not([data-theme="dark"]) .global-side-ads .side-ad img,
html:not([data-theme="dark"]) body.has-global-ads > .global-side-ads > .side-ad img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:cover!important;
  background:transparent!important;
  border:0!important;
}



/* ===== V26 SERVER OPENING DATE COLUMN ===== */
.server-opening-date{
  color:#4e5962;
  font-size:12px;
  font-weight:700;
  text-align:center;
  white-space:nowrap;
}
@media(min-width:701px){
  .server-table-head,.server-row{
    grid-template-columns:52px 132px minmax(0,1fr) 126px 112px 128px!important;
  }
  .server-table-head span:nth-child(4),
  .server-table-head span:nth-child(5),
  .server-table-head span:nth-child(6){
    justify-content:center!important;
    text-align:center!important;
  }
  .server-opening-date{
    grid-column:4;
    grid-row:1;
    display:flex;
    align-items:center;
    justify-content:center;
    height:100%;
    padding:8px 10px;
  }
  .server-stats span:first-child{grid-column:5!important}
  .server-stats span:last-child{grid-column:6!important;padding-right:44px!important}
}
@media(max-width:700px){
  .server-table-head span:nth-child(4),
  .server-table-head span:nth-child(5),
  .server-table-head span:nth-child(6){display:none!important}
  .server-opening-date{
    grid-column:3;
    grid-row:2;
    text-align:left;
    padding:0 8px 7px;
    font-size:9px;
    color:#7f8992;
  }
  .server-opening-date:before{content:"Açılış: ";font-weight:800}
}
html[data-theme="dark"] .server-opening-date{color:#c3ccd4!important}


/* ===== V28: server detail logo/photo area 500x150 + full-image squeeze ===== */
@media (min-width:701px){
  .server-detail-v5 .server-detail-top{
    grid-template-columns:500px minmax(0,1fr)!important;
    align-items:center!important;
  }
  .server-detail-v5 .detail-logo{
    width:500px!important;
    height:150px!important;
    max-width:100%!important;
    border-radius:10px!important;
    overflow:hidden!important;
  }
}
.server-detail-v5 .detail-logo img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:fill!important;
  object-position:center center!important;
}
@media (max-width:700px){
  .server-detail-v5 .server-detail-top{
    grid-template-columns:1fr!important;
  }
  .server-detail-v5 .detail-logo{
    width:100%!important;
    height:150px!important;
    max-width:500px!important;
    margin:0 auto!important;
    overflow:hidden!important;
  }
}


/* ===== V29: server photo must ALWAYS squeeze into the complete 500x150 frame =====
   No crop: oversized/tall images are compressed vertically so the bottom edge stays visible. */
.server-detail-v5 .server-photo-fit{
  position:relative!important;
  display:block!important;
  width:500px!important;
  height:150px!important;
  min-width:500px!important;
  min-height:150px!important;
  max-width:500px!important;
  max-height:150px!important;
  padding:0!important;
  margin:0!important;
  line-height:0!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
.server-detail-v5 .server-photo-fit > img.server-photo-fit-img{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  object-fit:fill!important;
  object-position:center center!important;
  transform:none!important;
}
@media (max-width:700px){
  .server-detail-v5 .server-photo-fit{
    width:100%!important;
    min-width:0!important;
    max-width:500px!important;
    height:150px!important;
    min-height:150px!important;
    max-height:150px!important;
    margin:0 auto!important;
  }
}

/* ===== V31 VIP homepage showcase: admin-only banner ===== */
.home-center .vip-showcase-section{padding:0!important;overflow:hidden;border:1px solid #75442e!important;border-radius:9px!important;background:linear-gradient(180deg,#845b48 0%,#4f2c20 100%)!important;box-shadow:0 8px 24px rgba(55,25,13,.18)!important}
.home-center .vip-showcase-title{min-height:42px;margin:0!important;padding:8px 16px!important;border-bottom:1px solid rgba(255,255,255,.09)!important;background:rgba(68,36,25,.18)!important}
.home-center .vip-showcase-title h2{color:#fff8ee!important;font-size:18px!important;text-shadow:0 1px 1px rgba(0,0,0,.35)!important}
.home-center .vip-showcase-title a{color:#f9e8d4!important;font-size:11px!important}
.home-center .vip-showcase-grid{display:grid!important;grid-template-columns:1fr!important;gap:0!important}
.home-center .vip-showcase-card{position:relative!important;display:grid!important;grid-template-columns:170px minmax(0,1fr) 145px!important;grid-template-rows:32px minmax(154px,auto)!important;gap:0 20px!important;min-height:208px!important;padding:0 18px 14px!important;border:0!important;border-radius:0!important;background:linear-gradient(180deg,rgba(111,71,51,.2),rgba(53,27,19,.22))!important;color:#f5eee8!important;box-shadow:none!important;overflow:hidden!important;isolation:auto!important;animation:none!important;transform:none!important}
.home-center .vip-showcase-card+.vip-showcase-card{border-top:1px solid rgba(255,255,255,.12)!important}
.home-center .vip-showcase-card::before,.home-center .vip-showcase-card::after{display:none!important;content:none!important;animation:none!important}
.home-center .vip-showcase-card:hover{background:linear-gradient(180deg,rgba(124,81,58,.34),rgba(62,31,21,.28))!important;transform:none!important;box-shadow:inset 0 0 0 1px rgba(230,166,104,.13)!important}
.home-center .vip-showcase-name{grid-column:1/-1;grid-row:1;margin:0!important;padding-top:8px!important;color:#fff7ed!important;font-size:17px!important;font-weight:800!important;text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;text-shadow:0 1px 1px rgba(0,0,0,.45)!important}
.home-center .vip-showcase-left{grid-column:1;grid-row:2;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;min-width:0;padding:7px 0 4px}
.home-center .vip-showcase-badges{display:flex;flex-direction:column;align-items:flex-start;gap:7px;margin-bottom:14px}
.home-center .vip-mini-badge,.home-center .vip-approved-badge,.home-center .vip-category-badge{display:inline-flex;align-items:center;justify-content:center;min-height:25px;padding:4px 11px;border-radius:15px;font-size:11px!important;font-weight:900!important;line-height:1!important;letter-spacing:.01em;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 1px 3px rgba(0,0,0,.2)}
.home-center .vip-mini-badge{background:#2d6b2a!important;color:#6cff5d!important;border:1px solid #7a8c2e!important}
.home-center .vip-approved-badge{background:#5c8c46!important;color:#f2fff0!important;border:1px solid #7fb75f!important}
.home-center .vip-category-badge{border-width:1px!important;border-style:solid!important}
.home-center .vip-showcase-info{display:grid;gap:5px;color:#e7d8cd;font-size:12px;line-height:1.15}
.home-center .vip-showcase-info span{display:block;white-space:nowrap}.home-center .vip-showcase-info b{margin-left:4px;color:#fff;font-weight:800}
.home-center .vip-showcase-media{grid-column:2;grid-row:2;align-self:center;justify-self:center;display:flex;align-items:center;justify-content:center;width:100%;max-width:500px;height:190px;min-width:0;overflow:hidden;border:1px solid rgba(15,10,8,.55);border-radius:4px;background:#1b1715;box-shadow:0 2px 8px rgba(0,0,0,.22)}
.home-center .vip-showcase-media>img{display:block;width:100%;height:100%;object-fit:contain!important;object-position:center!important}
.home-center .vip-banner-fallback{display:flex;width:100%;height:100%;align-items:center;justify-content:center;gap:15px;padding:18px;background:radial-gradient(circle at 50% 30%,#3a2b23,#171211 70%);text-align:center}
.home-center .vip-banner-fallback img{max-width:130px;max-height:95px;object-fit:contain}.home-center .vip-banner-fallback span{max-width:260px;color:#ddd0c5;font-size:12px;font-weight:700}.home-center .vip-banner-fallback.text-only{flex-direction:column}.home-center .vip-banner-fallback.text-only strong{color:#fff;font-size:24px}
.home-center .vip-showcase-stats{grid-column:3;grid-row:2;display:flex;flex-direction:column;justify-content:center;gap:9px;padding:8px 0}
.home-center .vip-showcase-stats span{display:grid;grid-template-columns:36px 1fr;align-items:center;min-height:50px;border:1px solid rgba(255,255,255,.18);border-radius:5px;background:rgba(255,255,255,.07);color:#f3ece5;overflow:hidden}
.home-center .vip-showcase-stats i{display:grid;place-items:center;height:100%;border-right:1px solid rgba(255,255,255,.16);font-style:normal;font-size:19px}.home-center .vip-showcase-stats b{padding:0 12px;font-size:19px;font-weight:700;letter-spacing:.02em}
html[data-theme="dark"] .home-center .vip-showcase-section{background:linear-gradient(180deg,#674636 0%,#39251d 100%)!important;border-color:#72503e!important}.home-center .vip-showcase-card .vip-logo,.home-center .vip-showcase-card .vip-card-meta,.home-center .vip-showcase-card>.vip-badge{display:none!important}
@media(max-width:900px){.home-center .vip-showcase-card{grid-template-columns:132px minmax(0,1fr) 112px!important;gap:0 12px!important;padding-left:12px!important;padding-right:12px!important}.home-center .vip-showcase-info{font-size:11px}.home-center .vip-showcase-stats span{grid-template-columns:31px 1fr}.home-center .vip-showcase-stats b{padding:0 8px;font-size:16px}}
@media(max-width:680px){.home-center .vip-showcase-card{grid-template-columns:1fr 96px!important;grid-template-rows:34px auto auto!important;gap:10px!important;padding:0 10px 12px!important}.home-center .vip-showcase-name{grid-column:1/-1!important;grid-row:1!important}.home-center .vip-showcase-left{grid-column:1/-1!important;grid-row:3!important;display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:12px!important;align-items:center!important;padding:0!important}.home-center .vip-showcase-badges{flex-direction:row!important;flex-wrap:wrap!important;gap:5px!important;margin:0!important}.home-center .vip-mini-badge,.home-center .vip-approved-badge,.home-center .vip-category-badge{min-height:22px;padding:3px 8px;font-size:9px!important}.home-center .vip-showcase-info{justify-self:end;gap:3px;text-align:right;font-size:10px}.home-center .vip-showcase-media{grid-column:1!important;grid-row:2!important}.home-center .vip-showcase-media{height:132px!important}.home-center .vip-showcase-media>img,.home-center .vip-banner-fallback{min-height:0!important;max-height:none!important}.home-center .vip-showcase-stats{grid-column:2!important;grid-row:2!important;gap:7px!important;padding:0!important}.home-center .vip-showcase-stats span{grid-template-columns:1fr!important;grid-template-rows:25px 1fr!important;min-height:54px;text-align:center}.home-center .vip-showcase-stats i{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.16)!important;font-size:15px}.home-center .vip-showcase-stats b{padding:4px!important;font-size:14px}.home-center .vip-showcase-title{padding:7px 10px!important}.home-center .vip-showcase-title h2{font-size:15px!important}}

/* ==========================================================================\n   V33 VIP SHOWCASE — subtle site-theme background + mobile card layout\n   ========================================================================== */
.home-center .vip-showcase-section{
  border:1px solid #d9d2cd!important;
  border-top:3px solid #8b2d20!important;
  border-radius:7px!important;
  background:linear-gradient(180deg,#fbfaf9 0%,#f6f4f2 100%)!important;
  box-shadow:0 2px 9px rgba(54,38,31,.07)!important;
}
.home-center .vip-showcase-title{
  min-height:42px!important;
  padding:9px 15px!important;
  border-bottom:1px solid #e0dad5!important;
  background:rgba(116,78,62,.045)!important;
}
.home-center .vip-showcase-title h2{
  color:#4d403a!important;
  font-size:16px!important;
  text-shadow:none!important;
}
.home-center .vip-showcase-title a{
  color:#8b2d20!important;
  font-size:11px!important;
  font-weight:700!important;
}
.home-center .vip-showcase-card{
  grid-template-columns:170px minmax(0,1fr) 145px!important;
  grid-template-rows:34px auto!important;
  gap:0 20px!important;
  min-height:0!important;
  padding:0 18px 16px!important;
  background:linear-gradient(180deg,rgba(127,86,67,.035),rgba(127,86,67,.018))!important;
  color:#4d4642!important;
}
.home-center .vip-showcase-card+.vip-showcase-card{
  border-top:1px solid #e2ddd9!important;
}
.home-center .vip-showcase-card:hover{
  background:linear-gradient(180deg,rgba(127,86,67,.065),rgba(127,86,67,.035))!important;
  box-shadow:none!important;
}
.home-center .vip-showcase-name{
  padding-top:8px!important;
  color:#4b3b34!important;
  font-size:17px!important;
  text-shadow:none!important;
}
.home-center .vip-showcase-left{
  padding:8px 0 4px!important;
}
.home-center .vip-showcase-info{
  color:#746862!important;
}
.home-center .vip-showcase-info b{
  color:#302a27!important;
}
.home-center .vip-showcase-media{
  width:100%!important;
  max-width:500px!important;
  height:auto!important;
  aspect-ratio:5 / 2!important;
  border:1px solid #c9bbb3!important;
  border-radius:5px!important;
  background:#171412!important;
  box-shadow:0 2px 7px rgba(31,22,18,.14)!important;
}
.home-center .vip-showcase-media>img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
.home-center .vip-showcase-stats span{
  min-height:50px!important;
  border:1px solid #d7ccc6!important;
  background:rgba(255,255,255,.74)!important;
  color:#4f4742!important;
  box-shadow:0 1px 3px rgba(44,30,24,.04)!important;
}
.home-center .vip-showcase-stats i{
  border-right:1px solid #ddd3ce!important;
  color:#8b5a3f!important;
}
.home-center .vip-showcase-stats b{
  color:#4b433f!important;
}

/* Dark mode keeps the same structure but stays appropriately dark. */
html[data-theme="dark"] .home-center .vip-showcase-section{
  border-color:#493b34!important;
  border-top-color:#9d4a36!important;
  background:linear-gradient(180deg,#17191b 0%,#131517 100%)!important;
}
html[data-theme="dark"] .home-center .vip-showcase-title{
  background:rgba(255,255,255,.025)!important;
  border-bottom-color:#33383d!important;
}
html[data-theme="dark"] .home-center .vip-showcase-title h2,
html[data-theme="dark"] .home-center .vip-showcase-name{
  color:#f2ece8!important;
}
html[data-theme="dark"] .home-center .vip-showcase-title a{color:#d9967f!important}
html[data-theme="dark"] .home-center .vip-showcase-card{
  background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.008))!important;
  color:#ddd5d0!important;
}
html[data-theme="dark"] .home-center .vip-showcase-card+.vip-showcase-card{border-top-color:#33383d!important}
html[data-theme="dark"] .home-center .vip-showcase-info{color:#bdb4ae!important}
html[data-theme="dark"] .home-center .vip-showcase-info b{color:#f4efec!important}
html[data-theme="dark"] .home-center .vip-showcase-stats span{
  border-color:#41484e!important;
  background:#1d2226!important;
  color:#e6dfda!important;
}
html[data-theme="dark"] .home-center .vip-showcase-stats i{border-right-color:#41484e!important;color:#d79a79!important}
html[data-theme="dark"] .home-center .vip-showcase-stats b{color:#f0ebe7!important}

@media(max-width:900px) and (min-width:681px){
  .home-center .vip-showcase-card{
    grid-template-columns:132px minmax(0,1fr) 112px!important;
    gap:0 12px!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
}

/* Mobile follows the supplied reference: badges -> name -> wide banner. */
@media(max-width:680px){
  .home-center .vip-showcase-section{
    border-radius:7px!important;
    margin-bottom:12px!important;
  }
  .home-center .vip-showcase-title{
    min-height:38px!important;
    padding:8px 10px!important;
  }
  .home-center .vip-showcase-title h2{font-size:14px!important}
  .home-center .vip-showcase-title a{font-size:10px!important}
  .home-center .vip-showcase-grid{
    padding:0!important;
    gap:0!important;
  }
  .home-center .vip-showcase-card{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto!important;
    gap:6px!important;
    min-height:0!important;
    margin:8px!important;
    padding:10px 8px 12px!important;
    border:1px solid #cdbdb4!important;
    border-radius:8px!important;
    background:linear-gradient(180deg,#f8f4f1 0%,#f3efec 100%)!important;
    box-shadow:0 1px 5px rgba(54,37,29,.08)!important;
  }
  .home-center .vip-showcase-card+.vip-showcase-card{
    border-top:1px solid #cdbdb4!important;
  }
  .home-center .vip-showcase-left{
    grid-column:1!important;
    grid-row:1!important;
    display:block!important;
    padding:0!important;
  }
  .home-center .vip-showcase-badges{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    margin:0!important;
  }
  .home-center .vip-mini-badge,
  .home-center .vip-approved-badge,
  .home-center .vip-category-badge{
    min-height:22px!important;
    padding:3px 9px!important;
    font-size:9px!important;
    white-space:nowrap!important;
  }
  .home-center .vip-showcase-info{display:none!important}
  .home-center .vip-showcase-name{
    grid-column:1!important;
    grid-row:2!important;
    margin:0!important;
    padding:0!important;
    color:#4b3b34!important;
    font-size:17px!important;
    line-height:1.25!important;
    text-align:center!important;
  }
  .home-center .vip-showcase-media{
    grid-column:1!important;
    grid-row:3!important;
    justify-self:center!important;
    width:min(350px,calc(100% - 20px))!important;
    max-width:350px!important;
    height:auto!important;
    aspect-ratio:5 / 2!important;
    margin:1px auto 0!important;
    border-radius:4px!important;
  }
  .home-center .vip-showcase-media>img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
  .home-center .vip-banner-fallback{
    min-height:0!important;
    padding:10px!important;
  }
  .home-center .vip-showcase-stats{display:none!important}

  html[data-theme="dark"] .home-center .vip-showcase-card{
    border-color:#54453e!important;
    background:linear-gradient(180deg,#201c1a 0%,#181716 100%)!important;
  }
  html[data-theme="dark"] .home-center .vip-showcase-name{color:#f3ece8!important}
}

@media(max-width:390px){
  .home-center .vip-showcase-card{margin:6px!important;padding-left:6px!important;padding-right:6px!important}
  .home-center .vip-showcase-badges{gap:4px!important}
  .home-center .vip-mini-badge,
  .home-center .vip-approved-badge,
  .home-center .vip-category-badge{padding:3px 7px!important;font-size:8px!important}
  .home-center .vip-showcase-media{width:calc(100% - 12px)!important}
}

/* ==========================================================================\n   V34 VIP SHOWCASE — centered mobile title + soft flowing background accent\n   ========================================================================== */
.home-center .vip-showcase-section{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
  background:
    radial-gradient(ellipse at 50% 58%,rgba(151,93,65,.055) 0%,rgba(151,93,65,.018) 34%,transparent 66%),
    linear-gradient(180deg,#fbfaf9 0%,#f6f4f2 100%)!important;
}
.home-center .vip-showcase-title,
.home-center .vip-showcase-grid{
  position:relative!important;
  z-index:2!important;
}
.home-center .vip-showcase-card{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:
    radial-gradient(ellipse at 50% 55%,rgba(164,110,82,.055) 0%,rgba(164,110,82,.015) 42%,transparent 72%),
    linear-gradient(180deg,rgba(255,255,255,.64),rgba(247,244,242,.78))!important;
}
.home-center .vip-showcase-card::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:0!important;
  top:-48%!important;
  bottom:-48%!important;
  left:-58%!important;
  width:72%!important;
  height:auto!important;
  border:0!important;
  border-radius:50%!important;
  background:linear-gradient(108deg,
    transparent 7%,
    rgba(139,45,32,.015) 26%,
    rgba(188,135,98,.09) 48%,
    rgba(139,45,32,.035) 62%,
    transparent 88%)!important;
  filter:blur(17px)!important;
  opacity:.78!important;
  transform:translate3d(0,0,0) rotate(-4deg)!important;
  animation:vipSoftFlowV34 10s ease-in-out infinite alternate!important;
  pointer-events:none!important;
}
.home-center .vip-showcase-card::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:0!important;
  inset:0!important;
  border:0!important;
  border-radius:0!important;
  background:
    radial-gradient(circle at 48% 42%,rgba(255,255,255,.58) 0 1px,transparent 2px),
    radial-gradient(circle at 56% 63%,rgba(133,83,59,.06) 0 1px,transparent 2px)!important;
  background-size:36px 36px,46px 46px!important;
  opacity:.18!important;
  animation:none!important;
  pointer-events:none!important;
}
.home-center .vip-showcase-card > *{
  position:relative!important;
  z-index:1!important;
}
@keyframes vipSoftFlowV34{
  0%{left:-58%;opacity:.46}
  50%{opacity:.82}
  100%{left:86%;opacity:.42}
}

html[data-theme="dark"] .home-center .vip-showcase-section{
  background:
    radial-gradient(ellipse at 50% 58%,rgba(177,103,72,.055) 0%,transparent 60%),
    linear-gradient(180deg,#17191b 0%,#131517 100%)!important;
}
html[data-theme="dark"] .home-center .vip-showcase-card{
  background:
    radial-gradient(ellipse at 50% 55%,rgba(184,105,73,.05) 0%,transparent 68%),
    linear-gradient(180deg,#191b1d 0%,#151719 100%)!important;
}
html[data-theme="dark"] .home-center .vip-showcase-card::before{
  background:linear-gradient(108deg,transparent 7%,rgba(207,116,76,.02) 26%,rgba(207,116,76,.10) 48%,rgba(207,116,76,.035) 62%,transparent 88%)!important;
  opacity:.46!important;
}
html[data-theme="dark"] .home-center .vip-showcase-card::after{opacity:.08!important}

@media(max-width:680px){
  .home-center .vip-showcase-card{
    background:
      radial-gradient(ellipse at 50% 50%,rgba(164,110,82,.045) 0%,transparent 68%),
      linear-gradient(180deg,#f8f5f2 0%,#f4f0ed 100%)!important;
  }
  .home-center .vip-showcase-name{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    justify-self:stretch!important;
    align-self:center!important;
    margin:0 auto!important;
    padding:0 6px!important;
    text-align:center!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .home-center .vip-showcase-card::before{
    top:-75%!important;
    bottom:-75%!important;
    width:88%!important;
    filter:blur(21px)!important;
    opacity:.34!important;
    animation-duration:12s!important;
  }
  .home-center .vip-showcase-card::after{opacity:.09!important}
  html[data-theme="dark"] .home-center .vip-showcase-card{
    background:linear-gradient(180deg,#201c1a 0%,#181716 100%)!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .home-center .vip-showcase-card::before{animation:none!important;left:14%!important;opacity:.35!important}
}

/* ==========================================================================\n   VIP V35 — force-refresh layout, centered mobile name, soft flowing accent\n   ========================================================================== */
.home-center .vip-showcase-v35{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:#fff!important;
  border-color:#ddd3ce!important;
  border-top:3px solid #8d160d!important;
  box-shadow:0 3px 12px rgba(47,27,20,.06)!important;
}
.home-center .vip-showcase-v35 .vip-showcase-title{
  position:relative!important;
  z-index:4!important;
  background:rgba(250,249,248,.96)!important;
  border-bottom:1px solid #e5dfdb!important;
}
.home-center .vip-showcase-v35 .vip-showcase-title h2{
  color:#2f3133!important;
  text-shadow:none!important;
}
.home-center .vip-showcase-v35 .vip-showcase-title a{
  color:#8d160d!important;
  font-weight:700!important;
}
.home-center .vip-showcase-v35 .vip-showcase-grid{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:
    radial-gradient(ellipse at 50% 52%,rgba(137,49,31,.042) 0%,rgba(137,49,31,.014) 37%,transparent 68%),
    #fff!important;
}
.home-center .vip-showcase-v35 .vip-showcase-grid::before{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  top:-80%!important;
  bottom:-80%!important;
  left:-58%!important;
  width:64%!important;
  transform:skewX(-15deg)!important;
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(130,22,13,.008) 18%,
    rgba(130,22,13,.055) 43%,
    rgba(180,119,78,.095) 51%,
    rgba(130,22,13,.042) 60%,
    transparent 88%)!important;
  filter:blur(24px)!important;
  opacity:.78!important;
  pointer-events:none!important;
  animation:vipV35Flow 9.5s ease-in-out infinite!important;
}
.home-center .vip-showcase-v35 .vip-showcase-grid::after{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  left:24%!important;
  right:24%!important;
  top:18%!important;
  bottom:10%!important;
  background:radial-gradient(ellipse at center,rgba(181,123,83,.055),transparent 68%)!important;
  filter:blur(16px)!important;
  opacity:.7!important;
  pointer-events:none!important;
  animation:vipV35Pulse 5.8s ease-in-out infinite alternate!important;
}
@keyframes vipV35Flow{
  0%{left:-58%;opacity:.34}
  46%{opacity:.82}
  100%{left:112%;opacity:.36}
}
@keyframes vipV35Pulse{
  from{transform:scale(.94);opacity:.38}
  to{transform:scale(1.08);opacity:.74}
}
.home-center .vip-showcase-v35 .vip-showcase-card{
  position:relative!important;
  z-index:2!important;
  display:grid!important;
  grid-template-columns:190px minmax(0,1fr) 145px!important;
  grid-template-rows:minmax(214px,auto)!important;
  gap:0 24px!important;
  min-height:246px!important;
  margin:0!important;
  padding:16px 18px!important;
  background:rgba(255,255,255,.60)!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.home-center .vip-showcase-v35 .vip-showcase-card::before,
.home-center .vip-showcase-v35 .vip-showcase-card::after{
  content:none!important;
  display:none!important;
  animation:none!important;
}
.home-center .vip-showcase-v35 .vip-showcase-card > *{
  position:relative!important;
  z-index:2!important;
}
.home-center .vip-showcase-v35 .vip-showcase-name{
  display:none!important;
}
.home-center .vip-showcase-v35 .vip-mobile-head{
  display:none!important;
}
.home-center .vip-showcase-v35 .vip-showcase-left{
  grid-column:1!important;
  grid-row:1!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  padding:0!important;
}
.home-center .vip-showcase-v35 .vip-showcase-badges{
  margin:0 0 14px!important;
}
.home-center .vip-showcase-v35 .vip-showcase-info{
  color:#765f54!important;
}
.home-center .vip-showcase-v35 .vip-showcase-info b{
  color:#2d2825!important;
}
.home-center .vip-showcase-v35 .vip-showcase-media{
  grid-column:2!important;
  grid-row:1!important;
  align-self:center!important;
  justify-self:center!important;
  width:100%!important;
  max-width:500px!important;
  height:auto!important;
  aspect-ratio:5 / 2!important;
  margin:0!important;
  border:1px solid #c9c0bb!important;
  border-radius:4px!important;
  background:#171412!important;
  box-shadow:0 3px 10px rgba(34,23,18,.12)!important;
}
.home-center .vip-showcase-v35 .vip-showcase-media > img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
.home-center .vip-showcase-v35 .vip-showcase-stats{
  grid-column:3!important;
  grid-row:1!important;
  align-self:center!important;
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  padding:0!important;
}
.home-center .vip-showcase-v35 .vip-showcase-stats span{
  min-height:50px!important;
  background:rgba(255,255,255,.82)!important;
  border:1px solid #d8cfca!important;
  color:#4b423e!important;
  box-shadow:0 2px 7px rgba(52,34,26,.035)!important;
}
.home-center .vip-showcase-v35 .vip-showcase-stats i{
  border-right-color:#e0d7d2!important;
  color:#9b4a2e!important;
}
.home-center .vip-showcase-v35 .vip-showcase-stats b{
  color:#403a37!important;
}

@media(max-width:900px) and (min-width:681px){
  .home-center .vip-showcase-v35 .vip-showcase-card{
    grid-template-columns:145px minmax(0,1fr) 112px!important;
    gap:0 12px!important;
    min-height:210px!important;
    padding:12px!important;
  }
}

@media(max-width:680px){
  .home-center .vip-showcase-v35{
    border-top-width:2px!important;
    border-radius:7px!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-title{
    min-height:42px!important;
    padding:8px 10px!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-title h2{
    font-size:14px!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-title a{
    font-size:10px!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-grid{
    padding:0!important;
    background:
      radial-gradient(ellipse at 50% 54%,rgba(137,49,31,.036) 0%,transparent 67%),
      #fff!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-grid::before{
    top:-105%!important;
    bottom:-105%!important;
    width:94%!important;
    filter:blur(28px)!important;
    opacity:.42!important;
    animation-duration:12s!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-grid::after{
    left:8%!important;
    right:8%!important;
    opacity:.34!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-card{
    display:block!important;
    min-height:0!important;
    margin:8px!important;
    padding:10px 8px 12px!important;
    border:1px solid #d7cbc5!important;
    border-radius:8px!important;
    background:rgba(250,248,247,.76)!important;
    box-shadow:0 2px 7px rgba(58,37,28,.07)!important;
    overflow:hidden!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-card + .vip-showcase-card{
    border-top:1px solid #d7cbc5!important;
  }
  .home-center .vip-showcase-v35 .vip-mobile-head{
    display:flex!important;
    width:100%!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    margin:0 0 7px!important;
    padding:0!important;
    text-align:center!important;
  }
  .home-center .vip-showcase-v35 .vip-mobile-badges{
    display:flex!important;
    width:100%!important;
    flex-direction:row!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    margin:0!important;
  }
  .home-center .vip-showcase-v35 .vip-mobile-name{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    color:#8d160d!important;
    font-size:16px!important;
    font-weight:800!important;
    line-height:1.2!important;
    text-align:center!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-name,
  .home-center .vip-showcase-v35 .vip-showcase-left,
  .home-center .vip-showcase-v35 .vip-showcase-stats{
    display:none!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-media{
    display:flex!important;
    width:min(350px,calc(100% - 20px))!important;
    max-width:350px!important;
    height:auto!important;
    aspect-ratio:5 / 2!important;
    margin:0 auto!important;
    border-radius:4px!important;
  }
  .home-center .vip-showcase-v35 .vip-showcase-media > img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
}

@media(max-width:390px){
  .home-center .vip-showcase-v35 .vip-showcase-card{
    margin:6px!important;
    padding-left:6px!important;
    padding-right:6px!important;
  }
  .home-center .vip-showcase-v35 .vip-mobile-badges{gap:4px!important}
  .home-center .vip-showcase-v35 .vip-mobile-badges .vip-mini-badge,
  .home-center .vip-showcase-v35 .vip-mobile-badges .vip-approved-badge,
  .home-center .vip-showcase-v35 .vip-mobile-badges .vip-category-badge{
    padding:3px 7px!important;
    font-size:8px!important;
  }
  .home-center .vip-showcase-v35 .vip-mobile-name{font-size:15px!important}
  .home-center .vip-showcase-v35 .vip-showcase-media{width:calc(100% - 12px)!important}
}

html[data-theme="dark"] .home-center .vip-showcase-v35{
  background:#17191b!important;
  border-color:#3b4146!important;
  border-top-color:#9b4936!important;
}
html[data-theme="dark"] .home-center .vip-showcase-v35 .vip-showcase-grid{
  background:radial-gradient(ellipse at 50% 52%,rgba(193,111,77,.05),transparent 67%),#17191b!important;
}
html[data-theme="dark"] .home-center .vip-showcase-v35 .vip-showcase-card{
  background:rgba(23,25,27,.74)!important;
}
html[data-theme="dark"] .home-center .vip-showcase-v35 .vip-mobile-name{color:#f1ddd5!important}

@media(prefers-reduced-motion:reduce){
  .home-center .vip-showcase-v35 .vip-showcase-grid::before,
  .home-center .vip-showcase-v35 .vip-showcase-grid::after{
    animation:none!important;
  }
}