:root{
  --bg:#050506;
  --panel:#0d0d10;
  --panel2:#121216;
  --panel3:#17171c;
  --line:#2a151a;
  --line2:#3d1d24;
  --text:#f6f3f4;
  --muted:#96929a;
  --red:#ff233d;
  --red2:#a40017;
  --red3:#63000d;
  --gold:#f3c56c;
  --green:#49e083;
  --shadow:0 24px 70px rgba(0,0,0,.5);
  --radius:18px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  background:
    radial-gradient(circle at 50% -10%,rgba(150,0,20,.16),transparent 34%),
    radial-gradient(circle at 8% 42%,rgba(100,0,15,.08),transparent 28%),
    #050506;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
img{max-width:100%}
.hidden{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.grain{
  position:fixed;inset:0;pointer-events:none;z-index:999;opacity:.028;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}
.ambient{position:fixed;pointer-events:none;filter:blur(80px);opacity:.12;z-index:-1;border-radius:50%}
.ambient-one{width:420px;height:420px;background:#e50024;left:-180px;top:35vh;animation:ambientMove 14s ease-in-out infinite alternate}
.ambient-two{width:340px;height:340px;background:#8f0016;right:-150px;top:58vh;animation:ambientMove 18s ease-in-out infinite alternate-reverse}
@keyframes ambientMove{to{transform:translate3d(50px,-35px,0) scale(1.18)}}

/* TOP BAR */
.topbar{
  position:fixed;top:0;left:0;right:0;height:72px;z-index:100;
  display:flex;align-items:center;gap:28px;padding:0 clamp(18px,3.2vw,58px);
  background:rgba(5,5,7,.82);border-bottom:1px solid rgba(255,255,255,.055);
  backdrop-filter:blur(20px) saturate(125%);
}
.brand{display:flex;align-items:center;gap:10px;font-weight:950;letter-spacing:.08em;font-size:16px;white-space:nowrap}
.brand img{width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 0 16px rgba(255,35,61,.28))}
.brand>span>span,footer strong span{color:var(--red)}
nav{display:flex;align-items:center;gap:24px;margin:auto}
.nav-link{font-size:12px;color:#b8b5bb;font-weight:700;transition:.22s ease;position:relative}
.nav-link:after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:2px;border-radius:2px;background:var(--red);transform:scaleX(0);transition:.25s ease}
.nav-link:hover,.nav-link.active{color:#fff}
.nav-link:hover:after,.nav-link.active:after{transform:scaleX(1)}
.top-actions{display:flex;align-items:center;gap:10px;min-width:max-content}
.join-link,.login-link{border-radius:10px;padding:10px 14px;font-size:11px;font-weight:850;transition:.25s ease}
.join-link{background:linear-gradient(135deg,var(--red),var(--red2));box-shadow:0 0 0 1px rgba(255,70,90,.15),0 10px 28px rgba(185,0,28,.18)}
.join-link:hover{transform:translateY(-2px);box-shadow:0 0 24px rgba(255,35,61,.28)}
.login-link{border:1px solid #3a252a;color:#ded9dc;background:#121013}
.login-link:hover{border-color:#7f2635;color:#fff}
.nav-user{display:flex;align-items:center;gap:9px;padding:6px 10px 6px 6px;border:1px solid #342026;background:#0d0b0e;border-radius:12px;transition:.25s ease}
.nav-user:hover{transform:translateY(-2px);border-color:#792132;box-shadow:0 0 18px rgba(255,35,61,.1)}
.nav-user img{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1px solid #6b2030}
.nav-user-text{display:grid;gap:1px;line-height:1.1}
.nav-user-text strong{font-size:11px;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-user-text small{font-size:9px;color:#ff6375;max-width:130px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hamburger{display:none;background:transparent;border:0;color:#fff;font-size:25px;cursor:pointer;margin-left:auto}

/* HERO */
.hero{position:relative;min-height:610px;padding:125px 5vw 55px;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.hero-image{position:absolute;inset:0;z-index:-4;background-image:url('/assets/deadlysins_banner.webp');background-size:cover;background-position:center 38%;transform:scale(1.03);animation:heroBreath 13s ease-in-out infinite alternate}
@keyframes heroBreath{to{transform:scale(1.085)}}
.hero-overlay{position:absolute;inset:0;z-index:-3;background:linear-gradient(180deg,rgba(5,5,6,.14) 0%,rgba(5,5,6,.17) 38%,rgba(5,5,6,.7) 82%,#050506 100%),linear-gradient(90deg,rgba(0,0,0,.38),transparent 35%,transparent 65%,rgba(0,0,0,.38))}
.hero:before{content:"";position:absolute;inset:-24%;z-index:-2;pointer-events:none;background:radial-gradient(circle at 20% 55%,rgba(255,20,45,.18),transparent 23%),radial-gradient(circle at 78% 28%,rgba(120,0,18,.25),transparent 26%),radial-gradient(circle at 55% 92%,rgba(255,35,60,.12),transparent 22%);filter:blur(48px);opacity:.72;animation:dsSmoke 13s ease-in-out infinite alternate}
@keyframes dsSmoke{0%{transform:translate3d(-3%,2%,0) scale(1)}50%{transform:translate3d(4%,-2%,0) scale(1.08)}100%{transform:translate3d(-1%,4%,0) scale(1.14)}}
.hero-sparks{position:absolute;inset:0;pointer-events:none;z-index:-1;opacity:.32;background-image:radial-gradient(circle,rgba(255,90,105,.95) 0 1px,transparent 2px),radial-gradient(circle,rgba(255,35,55,.75) 0 1px,transparent 2px),radial-gradient(circle,rgba(255,185,185,.65) 0 1px,transparent 2px);background-size:180px 230px,270px 310px,360px 390px;background-position:20px 400px,120px 520px,60px 610px;animation:dsSparks 18s linear infinite}
@keyframes dsSparks{to{background-position:20px -300px,120px -240px,60px -180px}}
.hero-content{width:min(1120px,92vw);margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center}
.hero-kicker{font-size:11px;letter-spacing:.28em;font-weight:850;color:#e8dfe2;text-shadow:0 0 18px rgba(255,35,61,.25);margin-bottom:13px}
.hero-copy{max-width:760px;margin:0 auto;color:#e0d9dc;font-size:15px;line-height:1.65;text-shadow:0 2px 18px rgba(0,0,0,.9)}
.hero-actions{display:flex;gap:14px;justify-content:center;margin-top:23px}
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 20px;border-radius:10px;border:1px solid #3a3034;font-weight:850;font-size:12px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;background:#121114;color:#fff}
.btn:after{content:"";position:absolute;top:-50%;left:-70%;width:40%;height:200%;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.24),transparent);transform:rotate(20deg);transition:left .65s ease}
.btn:hover:after{left:130%}.btn:hover{transform:translateY(-2px)}
.btn.primary{background:linear-gradient(135deg,#ff2943,#a20017);border-color:#ff4960;box-shadow:0 0 24px rgba(255,35,61,.18)}
.btn.primary:hover{box-shadow:0 10px 34px rgba(255,35,61,.3),0 0 22px rgba(255,35,61,.22)}
.btn.ghost{background:rgba(10,9,11,.68);border-color:#4b383e;backdrop-filter:blur(8px)}

.live-strip{margin-top:20px;width:min(900px,100%);display:grid;grid-template-columns:repeat(5,1fr);background:rgba(9,7,9,.8);border:1px solid rgba(255,52,76,.22);border-radius:14px;overflow:hidden;backdrop-filter:blur(12px);box-shadow:0 16px 45px rgba(0,0,0,.35)}
.live-stat{display:flex;align-items:center;justify-content:center;gap:10px;min-height:70px;padding:12px;border-right:1px solid rgba(255,255,255,.055);transition:.28s ease}
.live-stat:last-child{border-right:0}.live-stat:hover{background:rgba(255,35,61,.06)}
.live-stat .stat-icon{font-size:20px;filter:drop-shadow(0 0 8px rgba(255,35,61,.35))}
.live-stat div{display:grid;text-align:left}.live-stat strong{font-size:17px}.live-stat div span{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:#8c878f;margin-top:2px}
.live-badge{margin-top:12px;display:flex;align-items:center;gap:8px;font-size:9px;color:#99949b;text-transform:uppercase;letter-spacing:.12em}.live-badge i{width:7px;height:7px;border-radius:50%;background:#59555b}.live-badge.live i{background:var(--green);box-shadow:0 0 12px rgba(73,224,131,.7)}.live-badge.live{color:#b8d7c3}

/* LAYOUT */
.section-shell{width:min(1480px,calc(100% - 44px));margin:0 auto}
.dashboard{padding:30px 0 8px}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:14px}
.section-heading .eyebrow{font-size:9px;font-weight:900;color:#ff5d70;letter-spacing:.2em}.section-heading h2{font-size:25px;margin:4px 0 0;letter-spacing:-.02em}.section-heading>p{font-size:11px;color:#85808a;margin:0}
.upper-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:12px}
.dashboard-main{display:grid;grid-template-columns:320px minmax(0,1fr) 380px;gap:12px;padding-top:12px;align-items:stretch}
.panel{background:linear-gradient(180deg,rgba(19,12,14,.98),rgba(9,8,10,.98));border:1px solid #32171d;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;position:relative}
.panel:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(255,35,61,.045),transparent 30%);opacity:.8}
.games-panel{padding:10px}
.games-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.game-card{min-height:145px;display:flex;align-items:flex-end;position:relative;border:1px solid #362126;border-radius:13px;padding:0;background:linear-gradient(160deg,#181217,#09090b 72%);overflow:hidden;transition:.3s cubic-bezier(.2,.8,.2,1)}
.game-card:before{content:"";position:absolute;inset:0;z-index:3;background:linear-gradient(125deg,transparent 40%,rgba(255,255,255,.08),transparent 65%);transform:translateX(-110%);transition:.6s ease;pointer-events:none}.game-card:hover:before{transform:translateX(110%)}
.game-card:hover{transform:translateY(-4px);border-color:#7b2535;box-shadow:0 15px 34px rgba(0,0,0,.35),0 0 18px rgba(255,35,61,.11)}
.game-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .45s ease,filter .45s ease;filter:saturate(.9) brightness(.72)}
.game-card:hover .game-art{transform:scale(1.06);filter:saturate(1.05) brightness(.82)}
.game-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(8,7,9,.06) 8%,rgba(8,7,9,.28) 48%,rgba(8,7,9,.97) 100%)}
.game-copy{position:relative;z-index:2;width:100%;padding:44px 13px 13px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.18))}
.game-card strong{display:block;font-size:12px;text-shadow:0 2px 8px #000}.game-card span{display:block;color:#bbb4ba;font-size:9px;margin-top:4px;text-shadow:0 2px 8px #000}
.loading-card{padding:40px;text-align:center;color:#77717a}

.event-panel{padding:18px}.panel-title,.panel-heading{display:flex;align-items:center;gap:12px}.panel-title>span,.panel-heading>span{display:grid;place-items:center;width:36px;height:36px;border-radius:9px;background:#220c11;border:1px solid #5c1b28;box-shadow:0 0 20px rgba(255,35,61,.09)}
.panel-title small,.panel-heading small{display:block;color:#ff6577;font-size:8px;letter-spacing:.18em;font-weight:850}.panel-title strong{display:block;font-size:14px;margin-top:2px}.panel-heading h2{font-size:22px;margin:2px 0 0}.panel-heading.compact h2{font-size:20px}
.event-panel>p{color:#87828a;font-size:10px;line-height:1.5;min-height:45px}
.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:13px 0}.countdown div{text-align:center;padding:10px 4px;background:#120b0d;border:1px solid #4d1a24;border-radius:9px}.countdown strong{font-size:18px;color:#fff}.countdown span{display:block;font-size:7px;text-transform:uppercase;color:#8d7880;margin-top:2px}
.event-mini-meta{display:grid;gap:6px;margin:10px 0 13px}.event-mini-meta span{font-size:9px;color:#aaa2a8;background:#100d0f;border:1px solid #2f1b20;border-radius:8px;padding:8px 9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.panel-btn{display:flex;align-items:center;justify-content:center;height:34px;border-radius:8px;border:1px solid #8a2335;background:linear-gradient(135deg,#861124,#3e070e);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.08em;transition:.25s ease}.panel-btn:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(255,35,61,.16)}.panel-btn.subtle{background:#100d0f;border-color:#392128;margin:12px 14px 14px}

/* PROFILE */
.profile-panel{min-height:100%}.profile-guest{padding:38px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}.profile-guest img{width:86px;height:86px;object-fit:contain;filter:drop-shadow(0 0 22px rgba(255,35,61,.2))}.profile-guest h3{margin:10px 0 6px}.profile-guest p{font-size:10px;line-height:1.6;color:#8f8991;margin:0 0 18px}.profile-card{padding-bottom:16px}.profile-banner{height:92px;position:relative;overflow:hidden;border-bottom:1px solid #3d1b23}.profile-banner img{width:100%;height:100%;object-fit:cover;filter:saturate(1.05) contrast(1.05);opacity:.8}.profile-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(9,7,9,.8))}.banner-label{position:absolute;right:12px;bottom:8px;z-index:2;font-size:7px;letter-spacing:.18em;font-weight:900;color:#e7dadd}
.profile-head{display:flex;align-items:flex-end;gap:12px;padding:0 16px;margin-top:-29px;position:relative;z-index:3}.profile-avatar{width:72px;height:72px;border-radius:50%;object-fit:cover;border:3px solid #ff334c;background:#111;box-shadow:0 0 0 5px #0b090b,0 0 24px rgba(255,35,61,.22)}.profile-id{min-width:0;padding-bottom:2px}.profile-id h3{font-size:20px;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:145px}.role-badge{display:inline-flex;align-items:center;max-width:155px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9px;font-weight:850;padding:4px 7px;border-radius:7px;background:#211217;color:#ff697a;border:1px solid #50202b}.role-sinlord{color:#ffd276;border-color:#826128;background:#251d0f}.role-admin{color:#ff7180;border-color:#7f2433;background:#251116}.role-mod{color:#d899ff;border-color:#63307d;background:#1b1021}.role-helper{color:#76d9ff;border-color:#275b72;background:#0d1a21}.role-queen{color:#ff8ec8;border-color:#713050;background:#21101a}.role-member{color:#c7c0c5;border-color:#40373c;background:#161316}
.logout{margin-left:auto;margin-bottom:6px;font-size:8px;color:#8d868d;border:1px solid #332127;border-radius:8px;padding:6px 8px;background:#100d0f}.logout:hover{color:#fff;border-color:#702434}
.profile-level-line{display:flex;justify-content:space-between;gap:10px;padding:15px 16px 7px;font-size:9px;color:#b6afb5}.profile-level-line b{color:#fff}.xp-track{height:7px;margin:0 16px;background:#242127;border-radius:100px;overflow:hidden}.xp-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#bb001d,#ff3b52);box-shadow:0 0 14px rgba(255,40,65,.55);transition:width .8s cubic-bezier(.2,.75,.25,1)}
.profile-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:14px 12px 0;border:1px solid #2f1d22;border-radius:11px;overflow:hidden}.profile-stats div{padding:12px 8px;text-align:center;border-right:1px solid #2b1b20}.profile-stats div:last-child{border:0}.profile-stats strong{display:block;font-size:14px}.profile-stats span{display:block;margin-top:3px;font-size:7px;color:#817b82;text-transform:uppercase;letter-spacing:.09em}
.profile-meta{display:grid;grid-template-columns:1fr;gap:7px;margin:10px 12px 0}.profile-meta div{border:1px solid #291a1f;background:#0d0b0d;border-radius:9px;padding:9px}.profile-meta span{display:block;font-size:7px;color:#756f76;text-transform:uppercase;letter-spacing:.09em}.profile-meta strong{display:block;font-size:9px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* REWARDS */
.rewards-panel{padding:18px}.reward-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:15px}.reward-card{position:relative;min-height:218px;padding:18px 12px;border:1px solid #342027;border-radius:13px;background:linear-gradient(180deg,#120d10,#0b0a0c);text-align:center;overflow:hidden;transition:.3s cubic-bezier(.2,.8,.2,1)}.reward-card:hover{transform:translateY(-5px);border-color:#812538;box-shadow:0 16px 35px rgba(0,0,0,.32),0 0 18px rgba(255,35,61,.08)}.reward-icon{font-size:28px;margin-bottom:8px;filter:drop-shadow(0 0 12px rgba(255,35,61,.25))}.reward-card h3{font-size:12px;margin:6px 0}.reward-card p{font-size:9px;line-height:1.5;color:#8d878f;min-height:40px;margin:0}.tag-preview{margin-top:12px;padding:11px 6px;border-radius:8px;border:1px solid #5b1d29;background:#170b0f;color:#ff5368;font-size:9px;font-weight:900}.banner-preview{height:48px;border-radius:8px;overflow:hidden;margin-top:12px;border:1px solid #4c1d26}.banner-preview img{width:100%;height:100%;object-fit:cover}.coin-stack{font-size:22px;letter-spacing:-4px;color:#ffcd63;margin-top:19px;text-shadow:0 0 14px rgba(255,185,60,.25)}.role-preview{display:grid;gap:4px;margin-top:8px}.role-preview span{font-size:8px;padding:4px;border-radius:6px;border:1px solid #58202a;color:#ff6375;background:#1b0e12}.role-preview span:nth-child(2){color:#d887ff;border-color:#5e2c76;background:#170d1b}.role-preview span:nth-child(3){color:#6db7ff;border-color:#285074;background:#0c151e}

/* LEADERBOARDS */
.leader-panel{padding:17px 0 0}.leader-panel .panel-heading{padding:0 14px}.leader-tabs,.wide-tabs{display:flex;gap:6px;padding:12px 14px 8px}.leader-tab,.tab{flex:1;border:1px solid #3a2329;background:#100d0f;color:#8e878e;border-radius:7px;padding:8px 7px;font-size:8px;font-weight:850;text-transform:uppercase;cursor:pointer;transition:.22s ease}.leader-tab:hover,.leader-tab.active,.tab:hover,.tab.active{color:#fff;border-color:#8a2335;background:linear-gradient(135deg,#841224,#3e070f)}
.leaderboard-rows{padding:2px 10px}.mini-leader{display:grid;grid-template-columns:26px 34px minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px 5px;border-bottom:1px solid #21171a}.mini-leader:last-child{border-bottom:0}.mini-rank{font-size:11px;font-weight:950;color:#7e777e;text-align:center}.mini-rank.top{color:#ffc35c;text-shadow:0 0 10px rgba(255,190,80,.2)}.mini-leader img{width:30px;height:30px;border-radius:50%;object-fit:cover;border:1px solid #4e232b}.mini-player{min-width:0}.mini-player strong{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-player span{display:block;font-size:7px;color:#746e75;margin-top:2px}.mini-score{font-size:9px;color:#c8c2c7;white-space:nowrap}
.empty{padding:35px 16px;text-align:center;color:#756f76;font-size:10px}

.server-pulse{margin-top:12px;display:flex;align-items:center;gap:18px;padding:14px 18px;border:1px solid #351a20;border-radius:14px;background:linear-gradient(90deg,rgba(255,35,61,.055),transparent 34%),#0c0b0d;box-shadow:0 18px 45px rgba(0,0,0,.25)}.pulse-title{display:flex;align-items:center;gap:10px;min-width:220px}.pulse-title>span{font-size:20px;color:#ff5267}.pulse-title small{display:block;color:#ff6072;font-size:7px;font-weight:850;letter-spacing:.15em}.pulse-title strong{display:block;font-size:10px;margin-top:2px}.pulse-items{display:flex;gap:10px;min-width:0;overflow:auto;scrollbar-width:none}.pulse-items::-webkit-scrollbar{display:none}.pulse-items span{white-space:nowrap;font-size:9px;padding:8px 11px;border:1px solid #2d1c21;border-radius:8px;background:#0e0c0e;color:#928c93}.pulse-items b{color:#fff}.pulse-sync{margin-left:auto;font-size:8px;color:#706a71;white-space:nowrap}

.lower-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:12px;margin-top:12px}.event-detail,.core-panel{padding:18px}.event-card{display:flex;gap:14px;align-items:flex-start;margin-top:15px;border:1px solid #2e1c21;background:#0e0c0f;border-radius:12px;padding:15px}.event-icon{font-size:28px}.event-card strong{font-size:13px}.event-card p{font-size:9px;color:#817b82;line-height:1.5;margin:4px 0 0}.event-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.event-meta span{font-size:8px;padding:5px 7px;border-radius:6px;border:1px solid #382027;background:#161013;color:#aaa2a8}
.system-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:15px}.system-grid div{display:grid;grid-template-columns:28px 1fr;gap:2px 9px;align-items:center;border:1px solid #2d1c21;border-radius:10px;padding:11px;background:#0e0c0e}.system-grid span{grid-row:1/3;font-size:18px}.system-grid strong{font-size:10px}.system-grid small{font-size:7px;color:#777178}

.wide-leaderboard{margin-top:12px;padding:20px}.section-heading.inside{margin-bottom:8px}.leaderboard-head,.leader-row{display:grid;grid-template-columns:50px minmax(180px,1fr) 90px 110px 110px;align-items:center;gap:8px}.leaderboard-head{padding:9px 12px;color:#6f6970;font-size:8px;text-transform:uppercase;letter-spacing:.09em;border-bottom:1px solid #2a1b20}.leader-row{padding:10px 12px;border-bottom:1px solid #201519;transition:.22s ease}.leader-row:hover{background:#130d10}.rank{font-weight:950;color:#7f777e}.rank.top{color:#ffc35c}.player{display:flex;align-items:center;gap:10px;min-width:0}.player img{width:34px;height:34px;border-radius:50%;object-fit:cover;background:#1b171a;border:1px solid #4b232b}.player strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metric{font-size:9px;color:#c8c2c7}

.final-cta{margin-top:12px;margin-bottom:55px}.final-card{display:flex;align-items:center;gap:20px;padding:20px;border:1px solid #3c1a22;border-radius:16px;background:linear-gradient(90deg,rgba(255,35,61,.075),transparent 42%),#0e0c0e;box-shadow:var(--shadow)}.final-card img{width:72px;height:72px;object-fit:contain}.final-card>div{flex:1}.final-card>div>span{font-size:8px;color:#ff6072;font-weight:900;letter-spacing:.16em}.final-card h2{font-size:21px;margin:3px 0}.final-card p{font-size:9px;color:#888289;margin:0}
footer{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:23px 4vw;border-top:1px solid #1f1518;color:#6d676e;font-size:9px;background:#070708}footer strong{color:#cfc9ce;letter-spacing:.08em}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.25,1)}.reveal.visible{opacity:1;transform:none}

@media(hover:hover){
  .panel,.final-card{transition:transform .32s cubic-bezier(.2,.8,.2,1),border-color .32s ease,box-shadow .32s ease}
  .profile-panel:hover,.rewards-panel:hover,.leader-panel:hover,.event-detail:hover,.core-panel:hover,.wide-leaderboard:hover{transform:translateY(-3px);border-color:#54202b;box-shadow:0 24px 65px rgba(0,0,0,.45),0 0 24px rgba(255,35,61,.055)}
}

@media(max-width:1180px){
  nav{gap:16px}.nav-link{font-size:11px}.join-link{display:none}
  .dashboard-main{grid-template-columns:300px minmax(0,1fr)}.leader-panel{grid-column:1/-1}.leaderboard-rows{display:grid;grid-template-columns:repeat(2,1fr);gap:0 15px}.mini-leader:nth-child(5){display:none}
  .games-grid{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:900px){
  .hamburger{display:block}.top-actions{margin-left:0}.brand{margin-right:auto}
  nav{display:none;position:absolute;left:0;right:0;top:72px;flex-direction:column;align-items:stretch;gap:0;background:rgba(7,7,9,.98);padding:12px 22px 20px;border-bottom:1px solid #2b1a20}
  nav.open{display:flex}.nav-link{padding:12px 0}.nav-link:after{display:none}
  .login-link{display:none}.nav-user-text{display:none}.nav-user{padding:5px}.nav-user img{width:32px;height:32px}
  .hero{min-height:590px;padding-top:105px}.hero-copy{font-size:14px}.live-strip{grid-template-columns:repeat(5,1fr)}.live-stat{padding:10px 5px}.live-stat .stat-icon{font-size:17px}.live-stat strong{font-size:14px}.live-stat div span{font-size:7px}
  .upper-grid{grid-template-columns:1fr}.event-panel{display:grid;grid-template-columns:1fr 1fr;column-gap:18px}.event-panel .panel-title,.event-panel>p{grid-column:1}.countdown,.event-mini-meta,.event-panel>.panel-btn{grid-column:2}.countdown{grid-row:1/3;align-self:center}.event-mini-meta{grid-row:3}.event-panel>.panel-btn{grid-row:4}
  .dashboard-main{grid-template-columns:1fr}.leader-panel{grid-column:auto}.leaderboard-rows{grid-template-columns:1fr}.mini-leader:nth-child(5){display:grid}
  .profile-panel{min-height:420px}.reward-grid{grid-template-columns:repeat(2,1fr)}.lower-grid{grid-template-columns:1fr}
  .server-pulse{align-items:flex-start;flex-wrap:wrap}.pulse-items{order:3;width:100%}.pulse-sync{margin-left:auto}
}

@media(max-width:650px){
  .topbar{height:66px;padding:0 15px}.brand img{width:39px;height:39px}.brand{font-size:14px}nav{top:66px}
  .top-actions{gap:6px}.nav-user{display:none!important}.login-link{display:inline-flex;padding:9px 10px}
  .hero{min-height:650px;padding:95px 14px 35px;background:#050506}.hero-image{background-position:center top;background-size:auto 430px;background-repeat:no-repeat}.hero-overlay{background:linear-gradient(180deg,rgba(5,5,6,.05),rgba(5,5,6,.18) 35%,rgba(5,5,6,.96) 68%,#050506 100%)}.hero-content{justify-content:flex-end;min-height:510px}.hero-kicker{font-size:8px;letter-spacing:.16em}.hero-copy{font-size:12px;line-height:1.55}.hero-actions{width:100%;flex-direction:column;gap:8px}.hero-actions .btn{width:100%}
  .live-strip{grid-template-columns:repeat(2,1fr);border-radius:12px}.live-stat{border-bottom:1px solid rgba(255,255,255,.055)}.live-stat:nth-child(2n){border-right:0}.live-stat:last-child{grid-column:1/-1;border-bottom:0}.live-stat:nth-child(3),.live-stat:nth-child(4){border-bottom:1px solid rgba(255,255,255,.055)}
  .section-shell{width:calc(100% - 24px)}.dashboard{padding-top:20px}.section-heading{align-items:flex-start;flex-direction:column;gap:5px}.section-heading>p{font-size:9px}.section-heading h2{font-size:21px}
  .games-grid{grid-template-columns:repeat(2,1fr)}.game-card{min-height:125px}.game-card:nth-child(n+7){display:none}
  .event-panel{display:block}.event-panel>p{min-height:0}.countdown{grid-template-columns:repeat(4,1fr)}
  .dashboard-main{gap:10px}.profile-panel{min-height:auto}.profile-guest{padding:30px 18px}.profile-id h3{max-width:120px}.role-badge{max-width:125px}
  .rewards-panel{padding:14px}.reward-grid{grid-template-columns:1fr 1fr;gap:7px}.reward-card{min-height:190px;padding:14px 9px}.reward-card p{min-height:37px}
  .leaderboard-head,.leader-row{grid-template-columns:36px minmax(110px,1fr) 60px}.leaderboard-head span:nth-child(4),.leaderboard-head span:nth-child(5),.leader-row>.metric:nth-child(4),.leader-row>.metric:nth-child(5){display:none}.wide-leaderboard{padding:14px}
  .server-pulse{padding:13px}.pulse-title{min-width:0}.pulse-sync{font-size:7px}
  .system-grid{grid-template-columns:1fr}.final-card{align-items:flex-start;flex-direction:column}.final-card img{width:60px;height:60px}.final-card .btn{width:100%}
  footer{flex-direction:column;align-items:flex-start;padding:22px 15px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}.hero-image,.hero:before,.hero-sparks,.ambient{animation:none!important}.reveal{transition:none}.btn,.panel,.game-card,.reward-card{transition:none!important}
}


/* =========================================================
   DEADLYSINS — CORRECT SECTION NAVIGATION
   ========================================================= */
#home,
#games,
#events-detail,
#leaderboard-full,
#rewards,
#profile{
  scroll-margin-top:96px;
}

.nav-focus{
  animation:dsNavFocus 1.15s ease;
}

@keyframes dsNavFocus{
  0%{
    box-shadow:0 0 0 rgba(255,38,62,0);
  }
  35%{
    box-shadow:
      0 0 0 2px rgba(255,38,62,.50),
      0 0 38px rgba(255,38,62,.20);
  }
  100%{
    box-shadow:0 0 0 rgba(255,38,62,0);
  }
}


/* =========================================================
   V6 — COLORED GAME TITLES + TOP 5 MAIN ROLE
   ========================================================= */
.game-card{min-height:168px}
.game-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.45s ease;filter:saturate(.98) brightness(.73)}
.game-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(4,4,5,.08) 0%,rgba(4,4,5,.08) 38%,rgba(4,4,5,.38) 70%,rgba(4,4,5,.90) 100%)}
.game-center-title{position:absolute;z-index:2;left:12px;right:12px;top:50%;transform:translateY(-58%);text-align:center;font-size:clamp(20px,1.65vw,32px);line-height:.94;font-weight:1000;letter-spacing:-.035em;text-transform:uppercase;text-shadow:0 3px 7px #000,0 0 20px rgba(0,0,0,.9);pointer-events:none}
.game-count-only{padding:0 13px 12px;background:none;display:flex;align-items:flex-end;min-height:100%}
.game-count-only span{font-size:9px;color:#ddd8dc;font-weight:650}
.game-title-valorant{color:#fff;text-shadow:0 3px 7px #000,0 0 8px #ff314b,0 0 20px #c80025}
.game-title-cs2{color:#fff2df;text-shadow:0 3px 7px #000,0 0 8px #ff9c2f,0 0 22px #e75b00}
.game-title-league{background:linear-gradient(180deg,#fff3a8 0%,#e7b84f 45%,#8c5b15 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:.5px rgba(255,237,163,.65);text-shadow:none;filter:drop-shadow(0 3px 3px #000) drop-shadow(0 0 8px rgba(231,184,79,.55))}
.game-title-metin2{background:linear-gradient(180deg,#fff0a8,#ff9e2e 52%,#b82b0b);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:.5px rgba(255,213,111,.4);text-shadow:none;filter:drop-shadow(0 3px 3px #000) drop-shadow(0 0 9px rgba(255,91,30,.5))}
.game-title-apex{color:#fff;text-shadow:0 3px 7px #000,0 0 7px #ff5656,0 0 18px #b70000}
.game-title-warframe{color:#dcfbff;text-shadow:0 3px 7px #000,0 0 8px #36dff4,0 0 22px #127fa7}
.game-title-pubg{color:#ffd948;text-shadow:0 3px 7px #000,0 0 7px #ff9c1a,0 0 20px #b85c00}
.game-title-dbd{color:#fff;text-shadow:0 3px 7px #000,0 0 7px #ff4c4c,0 0 20px #870000}

.mini-leader{grid-template-columns:26px 34px minmax(0,1fr) auto}
.mini-player strong{margin-bottom:4px}
.mini-player .mini-role{display:inline-flex;width:max-content;max-width:100%;align-items:center;margin-top:0;padding:3px 8px;border-radius:999px;font-size:7px;font-weight:850;line-height:1;border:1px solid #3d3238;background:#171317;color:#bcb4ba;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-player .mini-role.role-sinlord{color:#ffd36b;border-color:#8a5b1a;background:linear-gradient(135deg,#2b1905,#15100a);box-shadow:inset 0 0 14px rgba(255,185,55,.08)}
.mini-player .mini-role.role-admin{color:#ff6375;border-color:#762333;background:#260d13}
.mini-player .mini-role.role-mod{color:#d48cff;border-color:#66317e;background:#1d1023}
.mini-player .mini-role.role-helper{color:#63b7ff;border-color:#26577d;background:#0c1720}
.mini-player .mini-role.role-queen{color:#ff86c8;border-color:#7b2b59;background:#210f1b}
.mini-player .mini-role.role-member{color:#bdb6bc;border-color:#40363b;background:#151215}
.mini-side{display:flex;align-items:center;justify-content:flex-end}

.role-preview span:nth-child(1){color:#ff6375;border-color:#6c2331;background:#1f0e13}
.role-preview span:nth-child(2){color:#ffd46a;border-color:#75551d;background:#20180d}
.role-preview span:nth-child(3){color:#ae83ff;border-color:#52397a;background:#140f20}

@media(max-width:650px){
  .game-center-title{font-size:19px;left:7px;right:7px}
  .game-card{min-height:132px}
  .game-count-only span{font-size:7px}
}


/* ===== Monthly Invite Challenge ===== */
.invite-challenge-card{margin-top:18px;border:1px solid rgba(255,60,60,.22);background:linear-gradient(145deg,rgba(21,7,9,.96),rgba(8,8,10,.97));border-radius:18px;padding:20px;box-shadow:inset 0 0 34px rgba(130,0,0,.08)}
.invite-challenge-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:12px}.invite-challenge-head h3{margin:3px 0 0;font-size:1.35rem}.invite-prize{min-width:150px;text-align:right;font-size:2rem;font-weight:900;color:#ffdb8a;text-shadow:0 0 18px rgba(255,180,55,.28)}.invite-prize small{display:block;color:#b9a98c;font-size:.72rem;font-weight:700;letter-spacing:.02em;margin-top:2px}.invite-slotline{padding:10px 12px;border-radius:12px;background:rgba(198,40,40,.09);border:1px solid rgba(198,40,40,.2);color:#d9c8c8;font-size:.9rem}.invite-slotline strong{color:#fff}.invite-rules{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.invite-rules span{padding:7px 9px;border-radius:999px;background:#101014;border:1px solid rgba(255,255,255,.07);color:#c9c9cf;font-size:.78rem}.invite-columns{display:grid;grid-template-columns:1.3fr .7fr;gap:16px}.invite-columns h4{margin:4px 0 10px;font-size:.9rem;text-transform:uppercase;letter-spacing:.08em;color:#d7d7dc}.invite-leaders,.invite-winners{display:grid;gap:8px}.invite-leader-row{display:grid;grid-template-columns:28px 36px 1fr auto;gap:9px;align-items:center;padding:9px 10px;border-radius:12px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.055)}.invite-rank{font-weight:900;color:#ef4444;text-align:center}.invite-leader-row img{width:36px;height:36px;border-radius:50%;object-fit:cover}.invite-player{min-width:0}.invite-player strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.invite-player small{display:block;color:#898991;font-size:.72rem;margin-top:2px}.invite-progress{text-align:right}.invite-progress b{display:block;color:#fff}.invite-progress span{display:block;color:#888891;font-size:.68rem;text-transform:uppercase;letter-spacing:.07em}.invite-winner{display:block;padding:10px 11px;border-radius:11px;background:rgba(214,39,39,.08);border:1px solid rgba(214,39,39,.18);font-weight:750}.invite-winner.muted{color:#8f8f98;font-weight:600}.invite-note{margin:10px 0 0;color:#8d8d96;font-size:.78rem;line-height:1.5}.invite-empty{padding:12px;color:#8f8f98;text-align:center;border:1px dashed rgba(255,255,255,.09);border-radius:12px}
@media(max-width:760px){.invite-challenge-head{align-items:flex-start}.invite-prize{font-size:1.6rem;min-width:auto}.invite-columns{grid-template-columns:1fr}.invite-leader-row{grid-template-columns:24px 34px 1fr auto}.invite-progress b{font-size:.85rem}.invite-rules span{font-size:.72rem}}


/* ===== V8 — Exclusive Reward Prices ===== */
.reward-price{display:inline-flex;align-items:center;justify-content:center;gap:5px;margin-top:12px;padding:8px 10px;border-radius:999px;border:1px solid #6c2b35;background:linear-gradient(135deg,#211014,#100b0d);color:#ffd0d6;font-size:9px;font-weight:950;letter-spacing:.03em;box-shadow:inset 0 0 16px rgba(255,45,70,.06)}
.reward-price strong{color:#fff;font-size:10px}
.reward-price.cash{border-color:#8b651d;background:linear-gradient(135deg,#291e0b,#110d08);color:#ffe19b;box-shadow:inset 0 0 18px rgba(255,190,65,.08)}
.reward-card.reward-cash{border-color:#5c4320;background:linear-gradient(180deg,#17110a,#0b0a0c)}
.reward-card.reward-cash .reward-icon{filter:drop-shadow(0 0 14px rgba(255,193,70,.24))}
.reward-subnote{display:block;margin-top:7px;color:#736d73;font-size:7px;line-height:1.4}


/* ===== V9 Hall of Sins: stronger Top 5 identities ===== */
.leaderboard-rows{gap:8px}
.mini-leader{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.055);
  border-radius:13px;
  padding:9px 9px;
  background:linear-gradient(100deg,rgba(255,255,255,.018),rgba(255,255,255,.005));
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease;
}
.mini-leader::before{
  content:"";
  position:absolute;
  inset:-1px;
  pointer-events:none;
  opacity:.7;
  background:linear-gradient(115deg,transparent 12%,rgba(255,255,255,.05) 48%,transparent 78%);
  transform:translateX(-125%);
}
.mini-leader:hover{transform:translateY(-3px) scale(1.012)}
.mini-leader:hover::before{animation:dsLeaderShine .75s ease}
@keyframes dsLeaderShine{to{transform:translateX(125%)}}

.mini-rank{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:12px;line-height:1}
.mini-rank b{font-size:12px;filter:drop-shadow(0 0 6px currentColor)}
.mini-avatar-wrap{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;position:relative}
.mini-avatar-wrap::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:1px solid currentColor;opacity:.75;box-shadow:0 0 12px currentColor}
.mini-avatar-wrap img{width:30px;height:30px;border-radius:50%;object-fit:cover;border:0!important;position:relative;z-index:1}
.mini-player strong{font-size:11px;letter-spacing:.01em;text-shadow:0 0 10px rgba(255,255,255,.04)}
.mini-player .mini-role{margin-top:3px!important;font-size:7.5px!important;padding:4px 9px!important;box-shadow:0 0 11px rgba(255,255,255,.035)}
.mini-player .mini-role.role-syncing{color:#8d858b;border-color:#3a3035;background:#121012;font-style:italic;box-shadow:none}
.mini-score{font-weight:800}

.mini-leader.place-1{color:#ffd36b;border-color:rgba(255,191,61,.48);background:linear-gradient(100deg,rgba(104,65,5,.34),rgba(33,19,5,.18) 47%,rgba(12,10,10,.72));box-shadow:0 0 24px rgba(255,181,45,.13),inset 3px 0 0 #e8ad36;animation:topOnePulse 3.2s ease-in-out infinite}
.mini-leader.place-1 .mini-rank,.mini-leader.place-1 .mini-score{color:#ffd36b;text-shadow:0 0 12px rgba(255,194,69,.4)}
.mini-leader.place-1 .mini-player strong{color:#fff1bf}
@keyframes topOnePulse{0%,100%{box-shadow:0 0 20px rgba(255,181,45,.10),inset 3px 0 0 #e8ad36}50%{box-shadow:0 0 31px rgba(255,181,45,.22),inset 3px 0 0 #ffd56a}}

.mini-leader.place-2{color:#d8e0ea;border-color:rgba(202,214,228,.30);background:linear-gradient(100deg,rgba(77,88,103,.25),rgba(25,29,34,.16) 47%,rgba(11,10,12,.72));box-shadow:0 0 18px rgba(190,207,227,.08),inset 3px 0 0 #aebac9}
.mini-leader.place-2 .mini-rank,.mini-leader.place-2 .mini-score{color:#d8e0ea}.mini-leader.place-2 .mini-player strong{color:#eff4fa}

.mini-leader.place-3{color:#e6a06d;border-color:rgba(218,126,68,.32);background:linear-gradient(100deg,rgba(89,44,18,.27),rgba(31,18,12,.16) 47%,rgba(11,10,12,.72));box-shadow:0 0 18px rgba(214,105,44,.08),inset 3px 0 0 #b86a3d}
.mini-leader.place-3 .mini-rank,.mini-leader.place-3 .mini-score{color:#e6a06d}.mini-leader.place-3 .mini-player strong{color:#ffd7ba}

.mini-leader.place-4{color:#ff5369;border-color:rgba(229,43,67,.28);background:linear-gradient(100deg,rgba(91,12,24,.22),rgba(29,10,14,.12) 47%,rgba(11,10,12,.72));box-shadow:0 0 17px rgba(220,35,58,.07),inset 3px 0 0 #9f2335}
.mini-leader.place-4 .mini-rank,.mini-leader.place-4 .mini-score{color:#ff5369}

.mini-leader.place-5{color:#bd7bff;border-color:rgba(159,76,227,.27);background:linear-gradient(100deg,rgba(57,17,87,.22),rgba(24,10,32,.12) 47%,rgba(11,10,12,.72));box-shadow:0 0 17px rgba(152,72,220,.07),inset 3px 0 0 #7435a4}
.mini-leader.place-5 .mini-rank,.mini-leader.place-5 .mini-score{color:#bd7bff}

@media (prefers-reduced-motion:reduce){.mini-leader.place-1{animation:none}.mini-leader:hover::before{animation:none}}