:root{--site-accent:#ff4057;--site-glow:#f21d3e;--site-bg:#070102}
body{background:var(--site-bg)!important;transition:background .35s ease,color .35s ease}
body:before{background:radial-gradient(circle at 50% 18%,color-mix(in srgb,var(--site-accent) 72%,#000),color-mix(in srgb,var(--site-glow) 45%,#000) 28%,color-mix(in srgb,var(--site-bg) 88%,#000) 68%,var(--site-bg) 100%)!important}
body:after{background:linear-gradient(180deg,transparent 30%,color-mix(in srgb,var(--site-bg) 92%,#000) 100%),repeating-linear-gradient(120deg,transparent 0 130px,#ffffff08 131px 132px)!important}
.logo b,.hero h1 span{color:var(--site-accent)!important}.logo{ text-shadow:3px 3px 0 color-mix(in srgb,var(--site-accent) 42%,#000),0 0 18px var(--site-glow)!important}
nav a:hover{color:var(--site-accent)!important}.nav-discord{border-color:var(--site-accent)!important;background:color-mix(in srgb,var(--site-accent) 18%,transparent)!important}
.kicker,.section-kicker{color:var(--site-accent)!important}.btn,.admin-btn,.settings-btn{border-color:var(--site-accent)!important;box-shadow:0 0 18px color-mix(in srgb,var(--site-glow) 32%,transparent)}
.btn:hover,.admin-btn:hover,.settings-btn:hover{background:var(--site-accent)!important;color:#080808!important;box-shadow:0 0 30px color-mix(in srgb,var(--site-glow) 60%,transparent)!important}
.tag,.card,.member-card,.rank-row,.feature,.war-card,.settings-card{border-color:color-mix(in srgb,var(--site-accent) 45%,#000)!important;box-shadow:0 10px 35px #0008,0 0 24px color-mix(in srgb,var(--site-glow) 10%,transparent)!important}
.rank-row.top{border-color:var(--site-accent)!important;background:color-mix(in srgb,var(--site-accent) 12%,transparent)!important}.rank-value,.rank-name b{color:#fff}.founder-badge{background:var(--site-accent)!important;color:#080808!important}
body[data-theme=midnight]{--site-accent:#73a8ff;--site-glow:#3977ff;--site-bg:#050812}body[data-theme=ember]{--site-accent:#ff8a3d;--site-glow:#ff5a1f;--site-bg:#0d0501}body[data-theme=gold]{--site-accent:#ffd45a;--site-glow:#ffb300;--site-bg:#0b0801}
body[data-theme=midnight] .hero h1{text-shadow:7px 8px 0 #1b428d,11px 12px 0 #071124,0 0 35px #3977ff88!important}
body[data-theme=ember] .hero h1{text-shadow:7px 8px 0 #a73e12,11px 12px 0 #2a0901,0 0 35px #ff5a1f88!important}
body[data-theme=gold] .hero h1{text-shadow:7px 8px 0 #9b6c00,11px 12px 0 #211700,0 0 35px #ffb30088!important}
body.no-animations *{animation:none!important;transition:none!important}.compact-nav nav{padding-top:10px;padding-bottom:10px}.compact-nav nav .links{gap:13px}

/* Full-site theme treatment: replace legacy red accents with the selected theme. */
:root{--site-accent-2:#ff9aaa;--site-deep:#650817;--site-surface:#180207}
body{color:#fff!important}
body:before{background:
 radial-gradient(ellipse at 18% 15%,color-mix(in srgb,var(--site-accent) 45%,transparent),transparent 34%),
 radial-gradient(ellipse at 82% 22%,color-mix(in srgb,var(--site-glow) 38%,transparent),transparent 35%),
 linear-gradient(135deg,color-mix(in srgb,var(--site-bg) 88%,#000),color-mix(in srgb,var(--site-glow) 18%,#000) 48%,color-mix(in srgb,var(--site-accent) 12%,var(--site-bg)) 100%)!important;
 animation:bg 16s ease-in-out infinite alternate!important}
body:after{background:
 linear-gradient(180deg,transparent 20%,color-mix(in srgb,var(--site-bg) 94%,#000) 100%),
 repeating-linear-gradient(120deg,transparent 0 130px,color-mix(in srgb,var(--site-accent) 4%,transparent) 131px 132px)!important}
/* Theme every legacy red/pink text accent. */
.feature h3,.rule h3,.msg-name,.online,.war-label,.live-note b,.role,.section-title span,
.footer-links a:hover,.rank-name b,.kicker,.section-kicker,.stat .value{color:var(--site-accent)!important}
/* Theme borders, shadows and fills that were previously hard-coded red. */
nav a:hover{color:var(--site-accent)!important}
.nav-admin,.nav-discord,.admin-badge,.founder-badge,.send,.admin-actions button,.admin-tab,.command-grid button,
.chat-input input,.admin-form input,.admin-form select,.admin-form textarea,.settings-grid input,.settings-grid select{border-color:color-mix(in srgb,var(--site-accent) 72%,#000)!important}
.nav-admin,.nav-discord,.admin-badge{background:linear-gradient(135deg,color-mix(in srgb,var(--site-accent) 24%,transparent),color-mix(in srgb,var(--site-glow) 10%,transparent))!important}
.btn{background:linear-gradient(135deg,var(--site-accent),var(--site-glow),color-mix(in srgb,var(--site-bg) 45%,var(--site-glow)))!important;border-color:color-mix(in srgb,var(--site-accent) 90%,#fff)!important;box-shadow:0 7px 0 color-mix(in srgb,var(--site-deep) 75%,#000),0 12px 38px color-mix(in srgb,var(--site-glow) 35%,transparent)!important}
.btn.secondary{background:linear-gradient(135deg,color-mix(in srgb,var(--site-accent) 18%,transparent),color-mix(in srgb,var(--site-glow) 8%,transparent))!important}
.feature,.rule,.card,.stat,.member-card,.rank-row,.chat-head,.chat-messages,.msg-body,.chat-input,.profile-card,.war-card,.challenge-box,.dashboard-card,.settings-card,.cta{border-color:color-mix(in srgb,var(--site-accent) 45%,#000)!important}
.rule{border-left-color:var(--site-accent)!important}
.progress i{background:linear-gradient(90deg,var(--site-glow),var(--site-accent),var(--site-accent-2))!important;box-shadow:0 0 22px color-mix(in srgb,var(--site-glow) 60%,transparent)!important}
.avatar,.profile-avatar,.member-avatar{background:linear-gradient(145deg,var(--site-accent),var(--site-glow),var(--site-deep))!important;border-color:var(--site-accent)!important}
.send,.admin-actions button:hover,.admin-tab.active,.admin-tab:hover,.command-grid button:hover{background:linear-gradient(135deg,var(--site-accent),var(--site-glow))!important;color:#080808!important}
.chat-input input:focus,.admin-form input:focus,.admin-form select:focus,.admin-form textarea:focus,.settings-grid input:focus,.settings-grid select:focus{border-color:var(--site-accent)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--site-accent) 13%,transparent)!important}
.cta{background:radial-gradient(circle at 20% 0,color-mix(in srgb,var(--site-accent) 25%,transparent),transparent 45%),radial-gradient(circle at 80% 100%,color-mix(in srgb,var(--site-glow) 20%,transparent),transparent 45%),color-mix(in srgb,var(--site-bg) 82%,#000)!important}
.logo{color:#fff!important}
body[data-theme=crimson]{--site-accent:#ff4f6a;--site-glow:#c9183c;--site-bg:#090104;--site-deep:#650817;--site-accent-2:#ff9aaa}
body[data-theme=midnight]{--site-accent:#75b7ff;--site-glow:#4b5cff;--site-bg:#040712;--site-deep:#172a70;--site-accent-2:#a7ddff}
body[data-theme=ember]{--site-accent:#ff9a4d;--site-glow:#ff4f1f;--site-bg:#0c0401;--site-deep:#7a2509;--site-accent-2:#ffd08a}
body[data-theme=gold]{--site-accent:#ffd866;--site-glow:#e5a800;--site-bg:#080701;--site-deep:#745300;--site-accent-2:#fff0a8}

/* Cinematic theme worlds */
@keyframes bacon-gradient-drift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes bacon-stars-drift{0%{transform:translate3d(0,0,0)}50%{transform:translate3d(-18px,12px,0)}100%{transform:translate3d(8px,-8px,0)}}
@keyframes bacon-twinkle{0%,100%{opacity:.25}50%{opacity:.9}}
@keyframes bacon-ember-float{0%{transform:translateY(20px);opacity:0}15%{opacity:.75}85%{opacity:.55}100%{transform:translateY(-45px);opacity:0}}
@keyframes bacon-gold-shine{0%{transform:translateX(-130%) rotate(12deg);opacity:0}15%{opacity:.45}45%{opacity:.08}100%{transform:translateX(130%) rotate(12deg);opacity:0}}

body[data-theme=crimson]:before{background:linear-gradient(120deg,#260008,#b70f2e 28%,#ff3d19 52%,#ffb51b 74%,#4d020c 100%)!important;background-size:300% 300%!important;animation:bacon-gradient-drift 18s ease-in-out infinite!important}
body[data-theme=crimson]:after{background:linear-gradient(180deg,transparent 15%,#070102e8 100%),radial-gradient(circle at 25% 35%,#ff7a1733 0 2px,transparent 3px),radial-gradient(circle at 70% 20%,#ffd34a22 0 2px,transparent 3px)!important;background-size:auto,190px 170px,260px 220px!important}

/* Midnight = deep moving night sky with stars and nebulae. */
body[data-theme=midnight]:before{background:radial-gradient(circle at 25% 18%,#765cff55 0,transparent 28%),radial-gradient(circle at 78% 28%,#1b9dff44 0,transparent 30%),linear-gradient(145deg,#02030b,#081536 45%,#11104a 70%,#02030b)!important}
body[data-theme=midnight]:after{background:radial-gradient(circle,#fff 0 1px,transparent 1.7px),radial-gradient(circle,#9ed8ff 0 1px,transparent 1.8px),radial-gradient(circle,#d9c7ff 0 1px,transparent 1.7px),linear-gradient(180deg,transparent 45%,#02030bea 100%)!important;background-size:97px 83px,173px 139px,241px 191px,100% 100%!important;animation:bacon-stars-drift 24s ease-in-out infinite alternate,bacon-twinkle 5s ease-in-out infinite!important;opacity:.8}
body[data-theme=midnight] .hero h1,body[data-theme=midnight] .section-title{ text-shadow:0 0 28px #3977ff99!important}

/* Ember = molten/fire atmosphere. */
body[data-theme=ember]:before{background:radial-gradient(circle at 50% 92%,#ff5a1f88 0,transparent 34%),radial-gradient(circle at 18% 15%,#ffb52e44 0,transparent 27%),linear-gradient(145deg,#120301,#591506 42%,#bd3b0b 62%,#180402 100%)!important;background-size:100% 100%,100% 100%,260% 260%!important;animation:bacon-gradient-drift 20s ease-in-out infinite!important}
body[data-theme=ember]:after{background:radial-gradient(circle,#ffd08a 0 1px,transparent 2px),radial-gradient(circle,#ff6a1a 0 1.5px,transparent 2.5px),linear-gradient(180deg,transparent 20%,#090201ee 100%)!important;background-size:137px 173px,211px 229px,100% 100%!important;animation:bacon-ember-float 7s linear infinite!important}

/* Gold = luxury metallic gradient with periodic sweeping shine. */
body[data-theme=gold]:before{background:linear-gradient(125deg,#120b00,#76520a 25%,#f3c94d 45%,#fff0a0 51%,#b57908 64%,#160e01 100%)!important;background-size:280% 280%!important;animation:bacon-gradient-drift 20s ease-in-out infinite!important}
body[data-theme=gold]:after{background:linear-gradient(105deg,transparent 0%,transparent 42%,#fff7c955 48%,#fff 50%,#fff7c500 55%,transparent 62%),radial-gradient(circle at 15% 20%,#fff2a533 0 2px,transparent 3px),linear-gradient(180deg,transparent 35%,#080501ed 100%)!important;background-size:220% 100%,210px 180px,100% 100%!important;animation:bacon-gold-shine 9s ease-in-out infinite!important}

/* Make theme gradients visible on major surfaces too. */
body[data-theme=crimson] .card,body[data-theme=crimson] .feature,body[data-theme=crimson] .rank-row{background:linear-gradient(145deg,#21040b99,#5f0b1b55,#120104cc)!important}
body[data-theme=midnight] .card,body[data-theme=midnight] .feature,body[data-theme=midnight] .rank-row{background:linear-gradient(145deg,#08132ccc,#1b255e66,#030611dd)!important}
body[data-theme=ember] .card,body[data-theme=ember] .feature,body[data-theme=ember] .rank-row{background:linear-gradient(145deg,#2b0903cc,#7a250933,#100201dd)!important}
body[data-theme=gold] .card,body[data-theme=gold] .feature,body[data-theme=gold] .rank-row{background:linear-gradient(145deg,#2a1c04cc,#80600b55,#0d0901dd)!important}

body.no-animations:before,body.no-animations:after{animation:none!important}