@font-face{font-family:Inter;src:url('/fonts/inter/inter-latin-wght-normal.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:Montserrat;src:url('/fonts/montserrat/montserrat-latin-wght-normal.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{color-scheme:dark;--primary:#805cff;--secondary:#a855f7;--accent:#c084fc;--bg:#08060f;--bg-2:#110b1d;--surface:#1a1424;--border:#302044;--white:#fff;--muted:#aaa2bc;--wide:1180px;--gutter:clamp(1.25rem,4.3vw,4rem)}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{min-width:280px}
body{margin:0;background:var(--bg);color:var(--white);font-family:Inter,system-ui,sans-serif;font-size:15px;line-height:1.6}
h1,h2,h3,p,dl,dd{margin:0}
h1,h2,h3{font-family:Montserrat,Inter,system-ui,sans-serif;line-height:1.13;letter-spacing:-.045em;text-wrap:balance}
h2{font-size:clamp(1.8rem,3.3vw,3rem);font-weight:800}
h3{font-size:1.25rem;font-weight:750}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,select{font:inherit}
button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid #e0bfff;outline-offset:4px}
main:focus{outline:none}
main{min-height:60vh}
.skip{position:fixed;z-index:20;top:.75rem;left:.75rem;transform:translateY(-200%);background:var(--bg-2);padding:.7rem 1rem;border:1px solid var(--accent);border-radius:.5rem}
.skip:focus{transform:none}
.wrap{width:min(var(--wide),calc(100% - var(--gutter)*2));margin-inline:auto}
.icon,.discord-icon{display:inline-flex;width:1.22em;height:1.22em;flex:none;align-items:center;justify-content:center;vertical-align:middle}
.icon svg{width:100%;height:100%;display:block}
.gradient{background:linear-gradient(145deg,#e0a5ff 2%,#ae58ff 43%,#805cff 100%);background-clip:text;color:transparent}
.topbar{position:relative;z-index:3;border-bottom:1px solid #251737;background:#0a0712}
.nav-shell{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:75px;gap:1rem}
.brand{display:inline-flex;width:max-content;align-items:center}
.brand img{width:147px;height:auto}
.nav{align-self:stretch;display:flex;align-items:stretch;gap:clamp(1rem,2.7vw,2.65rem)}
.nav>a{position:relative;display:flex;align-items:center;padding-inline:.12rem;color:#d1c9de;white-space:nowrap;font-size:.85rem;font-weight:560;transition:color .18s}
.nav>a:hover,.nav>a[aria-current]{color:white}
.nav>a[aria-current]:after{content:"";position:absolute;inset:auto 0 0;height:2px;background:#ac61ff;box-shadow:0 -2px 15px #9a50fa99}
.nav-login{justify-self:end;white-space:nowrap}
.nav-label-compact{display:none}
.button{display:inline-flex;min-height:45px;gap:.65rem;align-items:center;justify-content:center;padding:.72rem 1.12rem;border:1px solid transparent;border-radius:.65rem;font-size:.83rem;font-weight:700;line-height:1.3;cursor:pointer;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s;text-align:center}
.button:hover:not(:disabled){transform:translateY(-2px)}
.button:disabled{cursor:not-allowed;opacity:.54}
.primary{color:white;background:linear-gradient(110deg,#8625ea,#6321e3);border-color:#a468ff75;box-shadow:inset 0 1px 0 #ffffff24,0 7px 22px #5b13bf36}
.primary:hover:not(:disabled){background:linear-gradient(110deg,#9437f1,#7632ef);box-shadow:0 8px 28px #6e22f269}
.outline{color:#f3e9ff;background:#0d0919b5;border-color:#8c48d8}
.outline:hover:not(:disabled){border-color:#cc94ff;background:#261140}
.icon-button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--border);border-radius:.65rem;background:#150d24;color:white;font-size:1.1rem;cursor:pointer}
.hero{isolation:isolate;overflow:hidden;position:relative;background:#0a0716;min-height:clamp(510px,43.5vw,645px);display:flex}
.hero::before,.hero::after{content:"";position:absolute;inset:0;z-index:-1}
.hero::before{background:url('/images/fivetop-night.jpg') 50% 61%/cover no-repeat}
.hero::after{background:linear-gradient(90deg,#08060ff2 0%,#080611c4 32%,#110b1d19 70%),linear-gradient(0deg,#08060f 0%,transparent 33%,#08060f26 100%)}
.hero-inner{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:1.35rem;padding-block:4.15rem 4.55rem}
.hero-copy{z-index:1}
.pill,.badge{display:inline-flex;align-items:center;gap:.58rem;border:1px solid #63349f87;border-radius:100px;background:#25113dbd;color:#e3c9ff;font-size:.76rem;font-weight:650;padding:.35rem .75rem}
.signal,.eyebrow>span{width:.49rem;height:.49rem;border-radius:50%;background:#bb64ff;box-shadow:0 0 11px 3px #963cff73;flex:none}
.hero h1{font-size:clamp(4.1rem,8vw,7.5rem);letter-spacing:-.075em;font-weight:900;line-height:1.06;margin:.65rem 0 .06rem;text-wrap:nowrap}
.hero-tagline{font-family:Montserrat,Inter,sans-serif;font-size:clamp(1.85rem,3.45vw,3.25rem);line-height:1.08;letter-spacing:-.055em;font-weight:820}
.hero-description{max-width:32rem;color:#ddd2eb;margin:1.24rem 0 1.65rem;font-size:clamp(.94rem,1.3vw,1.1rem)}
.actions{display:flex;flex-wrap:wrap;gap:.78rem}
.hero-emblem{position:relative;isolation:isolate;display:grid;place-items:center;justify-self:center;width:min(100%,438px);aspect-ratio:1;transform:translateY(-.5rem)}
.hero-emblem::before{content:"";position:absolute;inset:-10%;background:radial-gradient(ellipse at 50% 48%,#9d31fc5e,transparent 64%);z-index:-1}
.hero-emblem img{width:83%;height:auto;filter:drop-shadow(0 0 22px #a747ffb0) drop-shadow(0 0 60px #8f35f59e);transform:rotate(-5deg)}
.orbit{position:absolute;border-radius:50%;pointer-events:none}
.orbit-outer{inset:5%;border:1px dashed #d299ff48}
.orbit-inner{inset:12%;border:1px solid #c589ff4d;box-shadow:0 0 3rem #9829ff36,inset 0 0 2.5rem #a04eff23}
.spark{position:absolute;font-size:1.15rem;color:#d9a5ff;text-shadow:0 0 13px #c666ff;z-index:1}
.spark-a{top:23%;right:11%}.spark-b{bottom:21%;left:12%;font-size:.85rem}
.emblem-index{position:absolute;bottom:1%;display:flex;align-items:center;gap:.6rem;color:#f2d7ff;font-size:.58rem;font-weight:750;letter-spacing:.22em;text-shadow:0 1px 6px #09060f}
.emblem-index span{color:#d296ff}
.stats-strip{position:relative;border-top:1px solid #624199a1;border-bottom:1px solid #2c1a42;background:radial-gradient(ellipse at 50% 0%,#2c1452 0%,#100a1b 61%,#0c0814 100%)}
.stats-strip::before{content:"";position:absolute;top:-1px;left:25%;right:25%;height:1px;background:linear-gradient(90deg,transparent,#ae69ff,#f0d9ff,#ae69ff,transparent);box-shadow:0 0 12px #a351ff}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding-block:1.15rem}
.stats>div{display:flex;align-items:center;justify-content:center;gap:.85rem;padding:.5rem .75rem}
.stats>div+div{border-left:1px solid #34234c}
.stats>div>.icon{color:#bd79ff;font-size:1.35rem}
.stats strong,.stats div div>span{display:block}
.stats strong{font-size:.96rem}.stats div div>span{font-size:.78rem;color:#bdb0d4}
.section{padding-block:clamp(2.6rem,6.3vw,5.8rem)}
.discover{padding-bottom:2rem}
.eyebrow{display:flex;align-items:center;gap:.56rem;text-transform:uppercase;letter-spacing:.15em;color:#d7a7ff;font-size:.68rem;font-weight:780;margin-bottom:.8rem}
.eyebrow>span{width:.32rem;height:.32rem}
.section-intro{margin-top:.85rem;max-width:40rem;color:var(--muted)}
.panel{border:1px solid var(--border);border-radius:1rem;background:linear-gradient(145deg,#191026,#0f0a19 85%)}
.feature-grid,.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;margin-top:1.85rem}
.feature{padding:clamp(1.3rem,3vw,2rem);min-width:0}
.feature-grid .feature{transition:border-color .2s,transform .2s}
.feature-grid .feature:hover{transform:translateY(-3px);border-color:#8850bb}
.tile{display:grid;place-items:center;width:49px;height:49px;background:linear-gradient(145deg,#3d2063,#201033);border:1px solid #6c359c;border-radius:.8rem;color:#d5a1ff;font-size:1.27rem;box-shadow:0 5px 20px #510aa22c;margin-bottom:1.1rem}
.feature p,.join-panel p:not(.eyebrow){color:var(--muted);margin-top:.6rem}
.feature .eyebrow{color:#d7a7ff;margin-top:0}
.feature .text-link,.feature .button{margin-top:1rem}
.text-link{display:inline-flex;align-items:center;gap:.42rem;color:#d4a4ff;font-weight:700;font-size:.86rem;text-underline-offset:.2rem}
.text-link:hover{text-decoration:underline}
.join-section{padding-top:1.8rem}
.join-panel{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:clamp(1.5rem,4vw,3.4rem);background:radial-gradient(ellipse at 89% 3%,#492383 0%,#1b102e 53%,#100a1c 100%);border-color:#623695}
.join-panel h2{font-size:clamp(1.55rem,2.85vw,2.55rem)}
.join-panel .button{flex:none}
.footer{background:#0c0813;border-top:1px solid #241936;color:#aaa2bc;font-size:.84rem;padding:2.15rem 0}
.footer-grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.3rem}
.footer-grid>span{justify-self:end}.footer-grid p{margin-top:.35rem}
.footer nav{display:flex;flex-wrap:wrap;gap:1rem}
.footer a:hover{color:#e4c8ff}
.page-banner{position:relative;isolation:isolate;border-bottom:1px solid var(--border);background:#11091f}
.page-banner::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0f0818 18%,#190c2bc7 66%,#12091d58),url('/images/fivetop-night.jpg') center 59%/cover}
.banner-inner{display:flex;align-items:center;gap:clamp(1rem,3.5vw,2.6rem);padding-block:clamp(2.4rem,6vw,5rem)}
.banner-icon,.discord-orb{width:clamp(65px,10vw,110px);aspect-ratio:1;flex:none;display:grid;place-items:center;border:1px solid #ab65f5;border-radius:1.2rem;background:radial-gradient(circle at 40% 24%,#542a87,#1d0c35 72%);box-shadow:0 0 2.2rem #9c43fb50,inset 0 0 1.35rem #a246f74d;color:#d39bff;font-size:clamp(1.5rem,4.1vw,3rem)}
.banner-inner h1,.product-copy h1{font-size:clamp(2rem,5.6vw,4.4rem);font-weight:850;overflow-wrap:anywhere}
.banner-inner p:last-child{color:#d7cae8;margin-top:.5rem}
.shop-content{padding-top:2rem}
.filters{display:flex;flex-wrap:wrap;align-items:end;gap:1rem;padding:1.05rem}
.filters label{display:grid;gap:.3rem;flex:1;min-width:min(100%,200px);font-size:.8rem;color:#d9cce8;font-weight:650}
select{color:#f4ecff;background:#110a1c;border:1px solid #5c3b77;border-radius:.55rem;padding:.58rem .7rem;min-height:45px}
.results,.pager{margin-top:1rem;color:var(--muted);font-size:.86rem}
.pager{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.7rem;margin-top:1.6rem}
.empty{margin-top:.75rem;padding:clamp(1.6rem,5vw,4.1rem) 1.2rem;text-align:center;background:radial-gradient(ellipse at 50% 2%,#24113d,#110b1d 68%)}
.empty .tile{margin-inline:auto}.empty h2{font-size:clamp(1.45rem,3.5vw,2.3rem)}
.empty p{max-width:29rem;margin:.6rem auto 1.1rem;color:var(--muted)}
.product-grid{margin-top:.8rem}
.product-card,.product-detail{overflow:hidden}
.product-art{position:relative;display:grid;place-items:center;aspect-ratio:1.58;background:radial-gradient(ellipse,#452070,#170f25 72%)}
.product-fallback{width:38%;height:auto}
.product-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.product-copy{padding:clamp(1rem,3vw,2rem);overflow-wrap:anywhere}
.product-copy h2{font-size:1.24rem;margin:.65rem 0 .4rem}
.product-copy h2 a:hover{color:var(--accent)}
.product-copy p{color:var(--muted);margin:.65rem 0}
.product-copy strong{color:#ecd2ff}
.product-detail{display:grid;grid-template-columns:1fr 1fr;align-items:center}
.product-detail .product-art{height:100%;min-height:240px}
.product-copy h1{font-size:clamp(1.8rem,3.6vw,3rem);margin-top:.65rem}
.product-price{font-size:1.5rem}
.product-description{white-space:pre-wrap}
.back{margin-bottom:1.1rem}
.about-grid,.member-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.about-grid h2,.member-main h2,.profile h2{font-size:clamp(1.45rem,3vw,2.2rem)}
#communaute{scroll-margin-top:1rem}
#communaute:target{border-color:#9359d0}
.login-page{display:grid;place-items:center;padding:clamp(2.8rem,8vw,7rem) var(--gutter);background:linear-gradient(90deg,#080610c9,#0b0712d9),url('/images/fivetop-night.jpg') center 57%/cover}
.auth-panel{width:min(100%,500px);padding:clamp(1.5rem,5vw,3rem);text-align:center;background:radial-gradient(ellipse at 50% 4%,#321752,#130b23 68%);box-shadow:0 18px 75px #0008}
.discord-orb{width:74px;border-radius:50%;margin:0 auto 1.45rem;font-size:2rem}
.discord-orb .discord-icon{width:1.15em;height:1.15em}
.auth-panel .eyebrow{justify-content:center}
.auth-panel h1{font-size:clamp(1.65rem,4vw,2.55rem)}
.auth-panel>p:not(.eyebrow,.error-code){color:#c6b9d8;margin:.8rem 0}
.auth-panel>.button{margin-top:.55rem}
.auth-panel .text-link{display:flex;justify-content:center;margin-top:1.1rem}
.fine{font-size:.8rem}
.quiet-button{border:0;background:none;cursor:pointer;padding:.45rem 0}
.auth-panel .quiet-button{display:inline-flex}
.dialog{max-width:min(440px,calc(100% - 2rem));padding:1.5rem;color:var(--white);text-align:left}
.dialog::backdrop{background:#06030bd9}
.dialog h2{font-size:1.4rem}
.dialog p{color:#d0c1e1;margin:.75rem 0 1rem}
.notice{border:1px solid #64427e;border-radius:.55rem;background:#291538;padding:.65rem .8rem;color:#e5d2f0!important;font-size:.86rem;margin-top:.8rem}
.error-code{font-family:Montserrat,sans-serif;font-size:clamp(3rem,10vw,6rem);font-weight:900;line-height:1.1;margin-bottom:.45rem}
.member-grid{grid-template-columns:minmax(220px,280px) minmax(0,1fr);align-items:start}
.member-nav{padding:1rem;display:grid;gap:.95rem}
.member-nav nav,.member-main{display:grid;gap:.65rem}
.member-nav nav a{padding:.55rem .65rem;display:flex;align-items:center;gap:.58rem;border-radius:.55rem;color:#d0bfdc;font-size:.9rem}
.member-nav nav a:hover,.member-nav nav a[aria-current]{background:#312046;color:#fff}
.member-id{display:flex;align-items:center;gap:.6rem;min-width:0;overflow-wrap:anywhere}
.member-id img,.profile-avatar{border-radius:50%;background:#241139;border:1px solid #9257c4;flex:none}
.online{display:flex;align-items:center;gap:.35rem;font-size:.78rem;color:#a5efc1}
.online span{width:.4rem;height:.4rem;background:#75ed9f;border-radius:50%}
.member-main,.profile{overflow-wrap:anywhere}
.profile h2{margin:.75rem 0 .32rem}
.profile dl{margin-top:1rem}
.profile dl>div{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;border-top:1px solid var(--border);padding:.65rem 0}
.profile dt{color:var(--muted)}
[data-busy=true]{cursor:wait}
[data-busy=true]>.icon{animation:busy .75s ease-in-out infinite alternate}
@keyframes busy{to{opacity:.4}}
@media(max-width:860px){
  .nav-shell{grid-template-columns:auto 1fr auto;min-height:66px;gap:.65rem}
  .nav{grid-column:1/-1;grid-row:2;justify-content:center;min-height:44px;border-top:1px solid var(--border);flex-wrap:wrap}
  .nav-login{grid-column:2;grid-row:1}
  .menu-toggle{grid-column:3;grid-row:1}
  .nav-shell.menu-enabled .nav:not(.open){display:none}
  .nav>a{padding-block:.3rem}
  .footer-grid{grid-template-columns:1fr auto}
  .footer-grid>span{grid-column:1/-1;justify-self:start}
  .hero-inner{padding-block:3.5rem}
  .hero-emblem{width:100%}
}
@media(max-width:640px){
  .hero{min-height:0}
  .hero::before{background-position:62% 58%}
  .hero::after{background:linear-gradient(0deg,#08060f 0%,#08060fac 38%,#09061229 82%,#08060f50),linear-gradient(90deg,#08060f80,transparent)}
  .hero-inner{grid-template-columns:1fr;gap:.25rem;text-align:center;padding-block:.8rem 2.3rem}
  .hero-emblem{grid-row:1;width:min(58vw,220px);transform:none}
  .emblem-index{display:none}
  .hero h1{font-size:clamp(3.35rem,13vw,5.35rem);margin:.45rem 0 .1rem}
  .hero-tagline{font-size:clamp(1.65rem,6.5vw,2.3rem)}
  .hero-description{margin:.85rem auto 1.15rem}
  .actions{justify-content:center}
  .stats>div{flex-direction:column;text-align:center;gap:.33rem;padding:.2rem .3rem}
  .stats{padding-block:.85rem}
  .stats strong{font-size:.8rem}.stats div div>span{font-size:.68rem}
  .feature-grid,.product-grid,.about-grid,.member-grid,.product-detail{grid-template-columns:1fr}
  .product-detail .product-art{min-height:0}
  .join-panel{align-items:flex-start;flex-direction:column;gap:1rem}
  .footer-grid{grid-template-columns:1fr}
  .banner-inner .eyebrow{font-size:.61rem}
  .banner-inner p:last-child{font-size:.86rem}
  .brand img{width:112px}
  .nav-login{font-size:.73rem;min-height:40px;padding:.5rem .6rem;gap:.35rem}
  .nav-label{display:none}
  .nav-label-compact{display:inline}
  .icon-button{width:40px;height:40px}
}
@media(max-width:365px){
  .nav-shell{width:calc(100% - 1rem);gap:.4rem}
  .brand img{width:92px}
  .nav{gap:.7rem}.nav>a{font-size:.76rem}
  .nav-login{font-size:.67rem}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.leader-heading{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap;margin-bottom:1.35rem}
.leaderboard,.owned-servers{list-style:none;margin:1rem 0 0;padding:0}
.leaderboard{display:grid;gap:.6rem}
.leader-row{display:grid;grid-template-columns:3.25rem minmax(0,1fr) auto auto;align-items:center;gap:1rem;padding:.85rem 1.1rem}
.leader-rank{font-family:Montserrat,sans-serif;font-weight:850;color:#d7a7ff;font-size:1.22rem}
.leader-server{display:flex;align-items:center;gap:.75rem;overflow-wrap:anywhere}
.leader-server>div{min-width:0}
.leader-server .server-logo{width:clamp(34px,5vw,52px)}
.leader-server .badge{font-size:.62rem;padding:.1rem .45rem;margin-bottom:.28rem}
.leader-server a:hover{color:var(--accent)}
.leader-points{color:var(--muted);white-space:nowrap}
.leader-points strong{color:#f1d7ff}
.server-form{max-width:720px;margin-inline:auto;display:grid;gap:1rem}
.server-form label{display:grid;gap:.3rem;font-weight:650;color:#d9cce8}
.filters input,.server-form input,.server-form textarea{width:100%;color:#f4ecff;background:#110a1c;border:1px solid #5c3b77;border-radius:.55rem;padding:.58rem .7rem;min-height:45px;font:inherit}
.server-form textarea{resize:vertical}
.filters input:focus-visible,.server-form :is(input,textarea):focus-visible{outline:2px solid #e0bfff;outline-offset:3px}
.server-form .button{margin-top:0}
.owned-servers li{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:.6rem 0;border-bottom:1px solid var(--border)}
.owned-servers .text-link{margin:0}

.server-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #120b20 url('/images/fivetop-night.jpg') center 53% / cover no-repeat;
  border-bottom: 1px solid #37234d;
}
.server-cover, .server-hero::after {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.server-cover {
  object-fit: cover;
  z-index: -2;
}
.server-hero::after {
  content: '';
  z-index: -1;
  background: linear-gradient(90deg, #08060fe8 0%, #08060f94 58%, #180b2b63 100%),
              linear-gradient(0deg, #08060f 0%, transparent 58%, #08060f8c 100%);
}
.server-hero-inner { padding-block: 1.5rem clamp(2rem, 6vw, 5.5rem); }
.server-back { min-height: 44px; margin-bottom: clamp(.75rem, 3vw, 2.1rem); }
.server-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.25rem, 4vw, 3.5rem);
}
.server-identity { min-width: 0; }
.server-identity h1 {
  max-width: 16ch;
  margin: .5rem 0 1.25rem;
  font-size: clamp(2.2rem, 6vw, 5.25rem);
  letter-spacing: -.065em;
  line-height: .99;
  text-wrap: balance;
  overflow-wrap: anywhere;
  text-shadow: 0 4px 30px #0009;
}
.server-tags { display: flex; flex-wrap: wrap; gap: .38rem; }
.server-tag { background: #160f24dc; border-color: #705488; }
.platform-badge { color: #fff4ff; background: #492474; border-color: #9161c1; }
.server-logo {
  position: relative;
  display: grid;
  flex: none;
  place-items: center;
  width: 62px;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: .8rem;
  border: 1px solid #714897;
  background: linear-gradient(155deg, #392456, #1b1029);
  color: #daacff;
}
.server-logo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #271737;
}
.server-vote-card {
  padding: clamp(.95rem, 2.4vw, 1.55rem);
  background: linear-gradient(145deg, #2a1a41f5, #141020f7 75%);
  border-color: #79529c;
  box-shadow: 0 16px 52px #09050ca6;
  overflow-wrap: anywhere;
}
.server-card-identity { display: flex; align-items: center; gap: .75rem; }
.server-card-identity .eyebrow { margin-bottom: .15rem; }
.server-score { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; margin: .95rem 0; }
.server-score div { min-width: 0; padding: .65rem .75rem; border-radius: .7rem; background: #a372db16; }
.server-score dt { font-size: .7rem; color: #e2c6fa; }
.server-score dd { font: 850 clamp(1.2rem, 3vw, 2.15rem) / 1.1 Montserrat, sans-serif; margin-top: .35rem; }
.server-score .server-unranked { display: block; font: 700 .84rem / 1.3 Inter, sans-serif; }
.server-vote-card .button { width: 100%; }
.server-vote-card .notice { margin-bottom: .65rem; }
.server-sections { display: grid; gap: 1rem; margin-block: clamp(1.5rem, 4vw, 3rem); }
.server-about h2, .server-gallery h2 { font-size: clamp(1.45rem, 3vw, 2.2rem); }
.server-about .product-description { max-width: 78ch; overflow-wrap: anywhere; }
.gallery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; margin-top: 1.15rem; }
.gallery-item {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid #573879;
  border-radius: .75rem;
  background: #221533;
}
.gallery-item:hover { border-color: #b882ff; }
.gallery-item img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gallery-placeholder { color: #b789e2; font-size: 1.4rem; }
.gallery-dialog { width: min(940px, 95vw); max-height: 92dvh; padding: .85rem; color: var(--white); }
.gallery-dialog::backdrop { background: #09060ee8; }
.gallery-dialog-bar, .gallery-controls { display: flex; align-items: center; justify-content: space-between; gap: .65rem; }
.gallery-dialog img { width: 100%; max-height: 65dvh; min-height: 5rem; object-fit: contain; margin-block: .65rem; background: #0a070f; }
.server-form-visuals { display: grid; min-width: 0; gap: .85rem; padding: 1rem; margin: 0; border: 1px solid #4d3366; border-radius: .75rem; }
.server-form-visuals legend { padding-inline: .45rem; font-weight: 750; color: #f4eaff; }
.server-form-visuals p, .server-form-visuals small { font-size: .82rem; color: #c6b3d7; font-weight: 450; }
.server-form-columns { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.server-form-columns label { min-width: 0; }
.server-image-fields { display: grid; min-width: 0; align-content: start; gap: .7rem; }
.server-form input[type=file] { font-size: .82rem; }
.server-form input::file-selector-button { margin-right: .5rem; border: 0; border-radius: .3rem; padding: .3rem .5rem; background: #41235d; color: #fff; cursor: pointer; }

@media(max-width:640px){
  .leader-row{grid-template-columns:2.1rem minmax(0,1fr) auto;gap:.6rem;padding:.75rem}
  .leader-button{grid-column:2/-1;justify-self:start}
  .leader-points{font-size:.78rem}
  .server-hero-grid, .server-form-columns { grid-template-columns: minmax(0, 1fr); }
  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .server-hero::after { background: linear-gradient(0deg, #08060f 5%, #08060f8c 72%, #08060fb3); }
}