/* VENUS ONLINE - new look for rankings / fortress_war / map / downloads */
body { padding-top: 0 !important; background: radial-gradient(ellipse 70% 40% at 15% 0%, rgba(212,175,55,.08), transparent 70%), radial-gradient(ellipse 60% 40% at 95% 10%, rgba(196,30,58,.1), transparent 70%), #07050a !important; }
.rankings-container, .map-container, .downloads-container, .shell, .page { padding-left: 1.2rem !important; padding-right: 1.2rem !important; padding-top: 1.4rem !important; }

/* page headers = same hero as the rest of the site */
.page-header, .hero { position: relative; overflow: hidden; border-radius: 18px !important; border: 1px solid rgba(212,175,55,.4) !important;
    background: radial-gradient(ellipse 60% 120% at 12% 100%, rgba(212,175,55,.2), transparent 70%), radial-gradient(ellipse 50% 100% at 95% 0%, rgba(196,30,58,.2), transparent 70%), linear-gradient(135deg, #1a0f1f, #0b0810 60%, #14090c) !important; }
.page-title, .hero .title { font-family: 'Cinzel', serif; font-weight: 900 !important; letter-spacing: .06em; background: linear-gradient(100deg, #b8941f, #fff5d0 40%, #d4af37 70%, #b8941f); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; text-shadow: none !important; }
.page-title i { -webkit-text-fill-color: #d4af37; margin-right: .4rem; }

/* cards */
.card, .download-card, .tool-card, .source-card, .info-box, .requirements-table, .map-wrapper, .characters-list, .cta-section, .start-playing-section { position: relative; border-radius: 16px !important; border: 1px solid rgba(212,175,55,.32) !important; background: linear-gradient(145deg, rgba(24,18,30,.95), rgba(10,8,14,.95)) !important; }
.download-card::before, .tool-card::before, .source-card::before, .card::before { content: ''; position: absolute; top: 6px; left: 6px; width: 12px; height: 12px; border: 2px solid #d4af37; border-right: 0; border-bottom: 0; border-radius: 4px 0 0 0; opacity: .5; pointer-events: none; }
.download-card::after, .tool-card::after, .source-card::after, .card::after { content: ''; position: absolute; bottom: 6px; right: 6px; width: 12px; height: 12px; border: 2px solid #d4af37; border-left: 0; border-top: 0; border-radius: 0 0 4px 0; opacity: .5; pointer-events: none; }
.download-card:hover, .tool-card:hover, .source-card:hover { transform: translateY(-4px); border-color: #d4af37 !important; box-shadow: 0 14px 34px rgba(0,0,0,.6), 0 0 26px rgba(212,175,55,.18) !important; }
.section-title, .card-title, .download-title, .info-title { font-family: 'Cinzel', serif; letter-spacing: .04em; }

/* tabs and pills = capsules */
.tabs { gap: .5rem !important; border-bottom: 0 !important; overflow-x: auto; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tab-btn, .tab { flex: none; border-radius: 24px !important; border: 1px solid rgba(212,175,55,.3) !important; background: rgba(0,0,0,.4) !important; white-space: nowrap; transition: all .15s; }
.tab-btn.active, .tab.active { background: linear-gradient(135deg, #fff1b8, #d4af37) !important; color: #1a1205 !important; font-weight: 700 !important; border-color: transparent !important; }
.pill { border-radius: 24px !important; }

/* buttons */
.btn, .download-button, .tool-button, .source-button, .cta-button, .support-button { border-radius: 26px !important; font-weight: 700 !important; letter-spacing: .04em; }
.download-button, .cta-button, .btn:not(.btn-secondary) { background: linear-gradient(135deg, #fff1b8, #d4af37 55%, #b8941f) !important; color: #1a1205 !important; border: 0 !important; box-shadow: 0 8px 22px rgba(212,175,55,.22); }

/* rankings table */
.ranking-table { border-radius: 16px !important; border: 1px solid rgba(212,175,55,.32) !important; overflow: hidden; background: linear-gradient(145deg, rgba(24,18,30,.95), rgba(10,8,14,.95)) !important; }
.ranking-header { background: rgba(212,175,55,.1) !important; }
.ranking-row { transition: background .15s; }
.ranking-row:hover { background: rgba(212,175,55,.07) !important; }
.ranking-row:nth-child(2) .rank-number, .ranking-row:nth-child(3) .rank-number, .ranking-row:nth-child(4) .rank-number { color: #fff1b8; text-shadow: 0 0 12px rgba(212,175,55,.6); }

@media (max-width: 900px) {
    .rankings-container, .map-container, .downloads-container, .shell, .page { padding-left: .7rem !important; padding-right: .7rem !important; padding-top: .8rem !important; }
    .page-title, .hero .title { font-size: 1.7rem !important; }
    .page-header, .hero { padding: 1.1rem !important; }
    .downloads-grid, .grid { grid-template-columns: 1fr !important; }
    .ranking-table { overflow-x: auto; }
    .map-wrapper { overflow-x: auto; }
}
