:root{--bg:#020b14;--panel:#061726;--panel2:#081d31;--line:#0f416a;--blue:#08a8ff;--blue2:#146dff;--orange:#ff8a00;--orange2:#ff4d00;--green:#43e36f;--text:#f7fbff;--muted:#86a4bf;--shadow:0 18px 60px rgba(0,0,0,.42)}
*{box-sizing:border-box}body{background:radial-gradient(circle at 20% 0,#0a2b4b 0,transparent 35%),radial-gradient(circle at 88% 6%,#3a1600 0,transparent 28%),#020914;color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}.app{background:linear-gradient(180deg,rgba(2,9,20,.2),#020914 420px)}
.sidebar{width:270px;background:linear-gradient(180deg,rgba(2,16,30,.98),rgba(2,10,20,.98));border-right:1px solid #0a4775;box-shadow:18px 0 60px rgba(0,0,0,.25);padding:14px 14px 20px;position:fixed;inset:0 auto 0 0;z-index:30}.main{margin-left:270px;min-height:100vh;padding:0 18px 40px;max-width:none}.brand{height:190px;padding:4px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:transparent!important;border:0!important}.brand>div,.brand .logo-mark{display:none}.brand:before{content:"";width:238px;height:178px;background:url('assets/rl-mate-logo.jpg') center/contain no-repeat;filter:drop-shadow(0 0 20px rgba(0,166,255,.36))}.brand.compact{height:auto}.brand.compact:before{width:108px;height:42px;background-size:cover;background-position:left center}.side-nav{gap:4px}.nav-item{min-height:51px;border:1px solid transparent;border-radius:4px;color:#b9d3e8;font-weight:800;letter-spacing:.03em;text-transform:uppercase;background:transparent}.nav-item:hover{background:rgba(8,168,255,.08);border-color:#0b4f7e}.nav-item.active{color:white;background:linear-gradient(90deg,rgba(12,104,226,.94),rgba(8,89,176,.75));border-color:#23c7ff;box-shadow:inset 3px 0 0 #63e8ff,0 0 24px rgba(0,150,255,.17)}.nav-item i{background:#e72925;color:#fff;box-shadow:0 0 12px rgba(255,54,46,.5)}.sidebar-foot{border-top:1px solid #12344e;padding-top:16px}.availability-mini{background:#051624;border:1px solid #164968;border-radius:5px;padding:12px}
.page-top{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 8px;position:relative;z-index:5;background:linear-gradient(180deg,rgba(2,8,17,.82),rgba(2,8,17,.35));border-bottom:1px solid rgba(43,145,207,.25);backdrop-filter:blur(7px)}.page-top h1{font-size:25px;margin:2px 0 0}.page-top .kicker{color:#4fcfff}.profile-chip,.icon-btn{border:1px solid #244962;background:#061624;color:#fff;box-shadow:none}.profile-chip:hover,.icon-btn:hover{border-color:#15bfff;background:#08233a}
#view-dashboard{position:relative;margin-top:0}.hero-panel{min-height:330px;margin:0 -18px 18px;border:0;border-bottom:1px solid #15557f;border-radius:0!important;position:relative;overflow:hidden;background-image:linear-gradient(90deg,rgba(1,8,17,.95) 0%,rgba(1,8,17,.45) 40%,rgba(1,8,17,.28) 65%,rgba(1,8,17,.9) 100%),linear-gradient(180deg,rgba(1,8,17,.12),rgba(1,8,17,.88)),url('assets/arena-hero.jpg')!important;background-size:cover!important;background-position:center!important;box-shadow:0 20px 45px rgba(0,0,0,.42)}.hero-panel:after{content:"";position:absolute;inset:auto 0 0;height:5px;background:linear-gradient(90deg,var(--blue),transparent 46%,transparent 54%,var(--orange));box-shadow:0 0 20px currentColor}.hero-copy{position:relative;z-index:2;max-width:560px;padding:56px 0 42px 38px;text-shadow:0 3px 20px #000}.hero-copy .live-label{background:rgba(0,17,30,.72);border:1px solid #1ac9ff;color:#70e8ff}.hero-copy h2{font-size:43px;line-height:1.03;max-width:570px;text-transform:uppercase;letter-spacing:-.02em;margin:12px 0}.hero-copy p{max-width:520px;color:#d3e6f5;font-size:15px}.hero-actions .btn{min-width:175px}.match-preview{position:relative;z-index:2;margin-right:26px;background:rgba(2,13,25,.86)!important;border:1px solid #1678b2!important;box-shadow:0 0 30px rgba(0,136,255,.18);backdrop-filter:blur(12px)}
.glass,.panel,.metric-card,.player-card,.request-card,.session-card,.filter-panel{background:linear-gradient(180deg,rgba(5,24,40,.96),rgba(3,16,28,.96))!important;border:1px solid #0e4169!important;border-radius:7px!important;box-shadow:var(--shadow)}.glass:hover,.metric-card:hover{border-color:#1675ad!important}.metric-grid{grid-template-columns:repeat(4,1fr);gap:14px}.metric-card{min-height:118px;padding:18px}.metric-card:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--blue)}.metric-card:nth-child(2):before,.metric-card:nth-child(4):before{background:var(--orange)}.metric-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#092a44;border:1px solid #17618f;color:#64d8ff}.metric-card strong{font-size:28px}.metric-card small{color:#9bb5ca;text-transform:uppercase;letter-spacing:.04em}
.two-col{gap:14px}.panel-head{border-bottom:1px solid #103d5f;padding-bottom:12px}.panel h2,.results-head h2{font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;letter-spacing:.035em;text-transform:uppercase;font-weight:500}.mini-match,.timeline-item,.live-lfg-item{background:#041523!important;border:1px solid #0c3556!important;border-radius:5px!important}.mini-match:hover,.timeline-item:hover{border-color:#168bc6!important}.score-tag{color:#62ea7c}.btn{border-radius:4px!important;text-transform:uppercase;font-weight:900;letter-spacing:.045em}.btn.primary{background:linear-gradient(180deg,#1478ff,#0756c7)!important;border:1px solid #39c6ff!important;color:#fff!important;box-shadow:inset 0 0 16px rgba(95,216,255,.15),0 0 16px rgba(18,116,255,.17)}.btn.primary:hover{filter:brightness(1.14)}.btn.secondary{background:linear-gradient(180deg,#ff9d00,#d96b00)!important;border:1px solid #ffc44d!important;color:#fff!important}.btn.ghost{background:#071b2e!important;border:1px solid #1a557b!important;color:#d8ecfa!important}.text-btn{color:#38c5ff!important}.kicker{color:#48cfff!important;letter-spacing:.12em;font-weight:900}
.connection-success{background:linear-gradient(90deg,rgba(3,50,29,.95),rgba(4,35,29,.92))!important;border-color:#2cae62!important;box-shadow:0 0 24px rgba(54,222,108,.12)!important}
.player-grid{gap:14px}.player-card{overflow:hidden;position:relative}.player-card:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--blue),transparent 54%,var(--orange))}.rank-row{background:#03111d!important;border:1px solid #123c5a!important}.chips span{background:#071d30!important;border:1px solid #164667!important;color:#a8cbe4!important}.match-percent{color:#59e675!important}.online-pill,.looking-pill{border-radius:3px!important}.avatar{border:2px solid #1ebeff!important;background:radial-gradient(circle at 50% 30%,#1a75a4,#051426)!important;box-shadow:0 0 18px rgba(20,178,255,.25)}
.filter-panel{position:sticky;top:76px;z-index:10;box-shadow:0 14px 30px rgba(0,0,0,.34)}select,input,textarea{background:#041321!important;border:1px solid #174767!important;color:#fff!important;border-radius:4px!important}select:focus,input:focus,textarea:focus{border-color:#17bfff!important;box-shadow:0 0 0 2px rgba(20,184,255,.1)!important}
.tabs .tab{border-radius:4px!important}.tab.active{background:#0c62cb!important;border-color:#30c9ff!important}.request-card.accepted,.session-card{border-left:3px solid #166eff!important}.session-status.active{color:#65ed78!important}.session-status.closed{color:#53c8ff!important}
.rl-playlist-strip{margin-top:14px;padding:14px 14px 18px;background:linear-gradient(180deg,#051927,#03101b);border:1px solid #0f4066;border-radius:7px;box-shadow:var(--shadow)}.rl-playlist-strip h3{margin:0 0 12px;text-transform:uppercase;letter-spacing:.07em;font-size:16px}.rl-playlists{display:grid;grid-template-columns:repeat(9,1fr);gap:8px}.rl-mode{min-height:92px;background:#061828;border:1px solid #15466a;border-radius:5px;color:#d5e8f6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;font-weight:800;text-transform:uppercase;font-size:11px}.rl-mode:hover{border-color:#24c7ff;box-shadow:0 0 18px rgba(0,174,255,.15);transform:translateY(-1px)}.rl-mode .mode-icon{font-size:28px;color:#4acbff}.rl-mode:nth-child(4n+2) .mode-icon,.rl-mode:nth-child(4n+4) .mode-icon{color:#ffb224}.rl-mode.active{outline:2px solid #37d2ff;background:linear-gradient(180deg,#0a3858,#071d31)}
.v15-footer{display:flex;justify-content:space-between;align-items:center;color:#68859b;font-size:12px;text-transform:uppercase;letter-spacing:.05em;margin:18px 6px 0;padding:16px 0;border-top:1px solid #0b2d47}.v15-footer b{color:#8eb2ca}.arena-badge{position:absolute;right:24px;top:18px;z-index:3;background:rgba(2,14,26,.8);border:1px solid #ff8b16;color:#ffc067;padding:7px 12px;border-radius:3px;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.auth-gate,.onboarding-gate{background:linear-gradient(180deg,rgba(0,6,13,.46),rgba(0,6,13,.91)),url('assets/arena-hero.jpg') center/cover fixed!important}.auth-card,.onboarding-card{background:linear-gradient(180deg,rgba(4,23,39,.97),rgba(2,13,24,.98))!important;border:1px solid #156592!important;box-shadow:0 25px 80px rgba(0,0,0,.6),0 0 45px rgba(0,163,255,.1)!important}.auth-brand .logo-mark{display:none}.auth-brand:before{content:"";display:block;width:230px;height:160px;margin:0 auto 8px;background:url('assets/rl-mate-logo.jpg') center/contain no-repeat}
@media(max-width:1180px){.rl-playlists{grid-template-columns:repeat(5,1fr)}.metric-grid{grid-template-columns:repeat(2,1fr)}.hero-copy h2{font-size:36px}.match-preview{max-width:360px}}@media(max-width:900px){.sidebar{width:260px;transform:translateX(-100%)}.sidebar.open{transform:translateX(0)}.main{margin-left:0;padding-top:56px}.mobile-topbar{display:flex!important;background:#031220!important;border-bottom:1px solid #15557d!important}.page-top{top:0}.hero-panel{min-height:520px;display:block!important;background-image:linear-gradient(180deg,rgba(1,8,17,.22),rgba(1,8,17,.97)),url('assets/arena-mobile.jpg')!important}.hero-copy{padding:185px 20px 20px}.match-preview{margin:0 20px 20px;max-width:none}.rl-playlists{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.metric-grid{grid-template-columns:1fr}.rl-playlists{grid-template-columns:repeat(2,1fr)}.hero-copy h2{font-size:30px}.page-top h1{font-size:19px}.top-actions .profile-chip span:last-child{display:none}.connection-success{flex-direction:column;align-items:flex-start}}