/* /serwery only: keep shared pages and their behavior untouched. */
.servers-page { --gold:#d2a64c;--gold-hi:#f0c76c;--ink:#f5f5f5;--dim:#a5a5a5;--faint:#8c8c8c;background:#080705;isolation:isolate;min-height:100svh; }
.servers-page::before { display:none; }
.servers-page .site-head { background:#080808; border-bottom:1px solid #d2a64c40; box-shadow:none; }
.servers-page .site-nav a.on { color:#fff; }
.servers-page .site-nav a.on::after { background:#f5d793;box-shadow:0 0 9px #edc36c88; }
.servers-page .head-user { gap:12px; }
.servers-page .head-user>.btn { background:#111;color:#ccc;border:1px solid #ffffff20;box-shadow:none; }
.servers-online { display:flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid #ffffff16;border-radius:24px;background:#0c0c0c;color:#ccc;font-size:12px;white-space:nowrap; }
.servers-online__dot { width:7px;height:7px;border-radius:50%;background:#64ce70;box-shadow:0 0 9px #64ce7033; }
.servers-content { position:relative;max-width:1280px;padding-bottom:65px; }
.servers-page .servers-hero { text-align:center;padding:48px 0 42px; }
.servers-page .servers-hero .okruchy { color:#aaa;font-size:10px;letter-spacing:.6em;margin:0 0 12px; }
.servers-page .servers-hero h1 { font-size:clamp(44px,4.5vw,64px);letter-spacing:-.04em;line-height:1.1;margin:0 0 18px; }
.servers-hero h1 span { color:#f0c76c; }
.servers-page .servers-hero>p:last-child { font-size:16px;color:#aaa;max-width:760px;margin:0 auto;line-height:1.6; }
.servers-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;max-width:1100px;margin:0 auto; }
.server-tile { position:relative;min-width:0; }
.server-tile:has(.server-details[open]) { z-index:5; }
.server-tile__surface { position:relative;display:flex;flex-direction:column;align-items:center;height:100%;padding:24px 25px 18px;border:1px solid #ffffff20;border-radius:15px;background:linear-gradient(135deg,#111 0%,#090909 65%,#10100d);box-shadow:0 10px 35px #0003;transition:transform 420ms cubic-bezier(.2,.8,.2,1),border-color 350ms,box-shadow 350ms; }
.server-launch { display:inline-flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid #d2a64c9c;border-radius:22px;color:#edc76e;background:#070707;font-size:12px;white-space:nowrap; }
.server-art { width:100%;height:215px;margin-top:4px;display:grid;place-items:center;mask-image:linear-gradient(transparent,#000 10%,#000 83%,transparent); }
.server-art img { width:100%;height:100%;object-fit:contain;filter:saturate(.75);transition:transform 450ms cubic-bezier(.2,.8,.2,1),filter 450ms; }
.server-tile h2 { font-size:34px;letter-spacing:-.03em;font-weight:650;color:#f5f5f5;margin:3px 0 10px; }
.server-description { color:#aaa;font-size:14px;line-height:1.6;text-align:center;margin:0 0 18px;min-height:68px; }
.server-current { display:flex;justify-content:center;gap:8px;flex-wrap:wrap;width:100%;padding:11px 0;margin-top:auto;border-top:1px solid #ffffff0d;color:#777;font-size:11px; }
.server-current strong { font-weight:500;color:#aaa; }.server-current strong.is-online{color:#7bc585;}
.server-details { width:100%; }
.server-details summary { list-style:none;display:flex;justify-content:center;align-items:center;gap:14px;padding:12px 10px;border:1px solid #b99143;border-radius:7px;color:#ece6d8;background:linear-gradient(#17150f,#090909);font-size:14px;cursor:pointer;transition:box-shadow .35s,background .35s; }
.server-details summary::-webkit-details-marker { display:none; }
.server-details summary:focus-visible,.server-ranking:focus-visible { outline:2px solid #f0c76c;outline-offset:4px; }
.server-ranking { display:flex;align-items:center;justify-content:center;gap:7px;color:#a99b7d;font-size:11px;padding-top:14px; }
.server-flyout { position:absolute;left:calc(100% - 3px);top:22px;width:248px;min-height:calc(100% - 44px);padding:22px 22px 18px;border:1px solid #d2a64c;border-radius:0 14px 14px 0;background:linear-gradient(110deg,#12100cfb,#080808fc 65%,#1d180cfb);box-shadow:12px 0 35px #0009,0 0 19px #d2a64c20;z-index:-1; }
.server-tile:last-child .server-flyout { left:auto;right:calc(100% - 3px);border-radius:14px 0 0 14px; }
.server-flyout h3 { color:#eee;font-size:21px;letter-spacing:-.02em; }
.server-flyout__type { font-size:12px;color:#8c8c8c;margin:5px 0 12px; }
.server-feature { display:flex;gap:13px;padding:15px 0;border-top:1px solid #ffffff12; }
.server-feature>span { color:#e1b858;flex:none;padding-top:3px; }
.server-feature h4 { font-size:13px;font-weight:500;color:#eee; }.server-feature p{font-size:12px;line-height:1.6;color:#969696;margin:4px 0 0;}
.server-tile:has(.server-details[open]) .server-tile__surface { border-color:#d2a64c;box-shadow:0 0 0 4px #d2a64c0b,0 0 28px #d2a64c20; }
.server-tile:has(.server-details[open]) summary { background:linear-gradient(125deg,#b89140,#48351a 65%,#97783a);box-shadow:inset 0 0 0 1px #edcf8955,0 0 16px #d2a64c20; }
.servers-atmosphere { position:fixed;inset:65px 0 0;z-index:-1;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#d2a64c05,transparent 65%); }
.servers-atmosphere::before,.servers-atmosphere::after { content:'';position:absolute;width:40vw;height:75vh;left:-35vw;top:15%;border:1px solid #d2a64c1a;border-radius:50%; }
.servers-atmosphere::after { left:auto;right:-35vw;top:-30%; }
.servers-page .site-foot { background:transparent;border-color:#ffffff09; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) { .server-tile:hover .server-tile__surface{transform:translateY(-6px) scale(1.015);}.server-tile:hover .server-art img{transform:translate(2px,-5px) scale(1.025);filter:none;} }
@media(prefers-reduced-motion:no-preference) { .server-details[open] .server-flyout{animation:server-slide 420ms cubic-bezier(.2,.8,.2,1) both;}.server-details[open] .server-feature{animation:server-feature 400ms ease both;}.server-feature:nth-of-type(2){animation-delay:40ms!important;}.server-feature:nth-of-type(3){animation-delay:80ms!important;}.server-feature:nth-of-type(4){animation-delay:120ms!important;} }
@keyframes server-slide { from{opacity:0;transform:translateX(-16px) scale(.985);}to{opacity:1;transform:translateX(0) scale(1);} }
@keyframes server-feature { from{opacity:0;translate:0 5px;}to{opacity:1;translate:0 0;} }
@media(max-width:1150px){.servers-online{font-size:10px;padding:7px;}.servers-page .head-user{gap:8px;}.servers-grid{gap:22px;}.server-tile__surface{padding-left:18px;padding-right:18px;} }
@media(max-width:1000px){.servers-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:730px;}.server-tile:nth-child(2) .server-flyout{left:auto;right:calc(100% - 3px);border-radius:14px 0 0 14px;}.server-tile:last-child .server-flyout{left:calc(100% - 3px);right:auto;border-radius:0 14px 14px 0;}.servers-page .site-head>.wrap{flex-wrap:wrap;}.servers-online{display:none;} }
@media(max-width:620px),(hover:none){.server-flyout,.server-tile:last-child .server-flyout,.server-tile:nth-child(2) .server-flyout{position:relative;left:auto;right:auto;top:auto;width:auto;min-height:0;margin-top:12px;padding:18px;border-radius:9px;z-index:auto;box-shadow:none;}.server-tile__surface{transform:none!important;} }
@media(max-width:620px){.servers-grid{grid-template-columns:minmax(0,1fr);max-width:390px;gap:24px;}.servers-page .servers-hero{padding:34px 0 28px;}.servers-page .servers-hero>p:last-child{font-size:14px;}.server-art{height:230px;}.server-description{min-height:0;}.servers-content{padding-bottom:32px;} }
@media(prefers-reduced-motion:reduce){.server-tile *{animation:none!important;transition:none!important;} }

.servers-page .logo { gap:2px; }
.servers-brand-suffix { color:#eee;font-size:25px;letter-spacing:-.05em;line-height:1;font-weight:550; }
.server-flyout::before { content:"";position:absolute;left:-6px;top:45%;width:10px;height:10px;transform:rotate(45deg);background:#14110d;border-left:1px solid #d2a64c;border-bottom:1px solid #d2a64c; }
.server-tile:last-child .server-flyout::before { left:auto;right:-6px;border:0;border-top:1px solid #d2a64c;border-right:1px solid #d2a64c; }
@media(max-width:1000px) { .server-tile:nth-child(2) .server-flyout::before{left:auto;right:-6px;border:0;border-top:1px solid #d2a64c;border-right:1px solid #d2a64c;}.server-tile:last-child .server-flyout::before{right:auto;left:-6px;border:0;border-left:1px solid #d2a64c;border-bottom:1px solid #d2a64c;} }
@media(max-width:620px),(hover:none){.server-flyout::before{display:none;}.servers-brand-suffix{font-size:21px;} }
/* Reserve a fourth column's width. Cards move through that space without reflow. */
@media(min-width:1250px) and (hover:hover) {
 .servers-content { max-width:1420px; }
 .servers-grid { --detail-space:244px; width:calc(100% - var(--detail-space)); max-width:none; margin:0 auto; gap:24px; translate:0 0; transition:translate 420ms cubic-bezier(.2,.8,.2,1); }
 .servers-grid[data-active] { translate:calc(var(--detail-space) / -2) 0; }
 .servers-grid[data-active="3"] { translate:calc((var(--detail-space) - 18px) / -2) 0; }
 .server-tile { transition:translate 420ms cubic-bezier(.2,.8,.2,1); }
 .servers-grid[data-active="1"] .server-tile:nth-child(n+2),
 .servers-grid[data-active="2"] .server-tile:nth-child(3) { translate:var(--detail-space) 0; }
 .server-flyout,.server-tile:last-child .server-flyout { left:calc(100% - 2px);right:auto;width:228px;border-radius:0 14px 14px 0; }
 .server-tile:last-child .server-flyout::before { left:-6px;right:auto;border:0;border-left:1px solid #d2a64c;border-bottom:1px solid #d2a64c; }
 .server-tile:has(.server-details[open]) .server-tile__surface::after { content:"";position:absolute;inset:-6px 4px -6px -6px;border:1px solid #e0bc74;border-left-color:#fff0ba;border-radius:18px;box-shadow:-3px 3px 13px #f0c76830;pointer-events:none; }
}
@media(min-width:621px) and (max-width:1249px) {
 .server-flyout,.server-tile:last-child .server-flyout,.server-tile:nth-child(2) .server-flyout { position:relative;left:auto;right:auto;top:auto;width:auto;min-height:0;margin-top:12px;padding:18px;border-radius:9px;z-index:auto;box-shadow:none; }
 .server-flyout::before { display:none; }
}
@media(prefers-reduced-motion:reduce) { .server-tile,.servers-grid {transition:none!important;} }
/* Final art direction: rendered illustrations and reference-scale card typography. */
.servers-page .site-head>.wrap { max-width:1420px; }
.servers-page .logo { gap:15px; }
.servers-mark { width:42px;height:46px;filter:drop-shadow(0 0 8px #d6a33e24); }
.servers-brand { font-size:27px;font-weight:600;letter-spacing:-.025em;color:#f7f7f7;white-space:nowrap; }
.servers-page .servers-hero { padding:46px 0 26px; }
.servers-page .servers-hero .okruchy { letter-spacing:.65em; }
.servers-page .servers-hero h1 { font-weight:650; }
.servers-page .servers-hero>p:last-child { font-size:18px;max-width:940px; }
.servers-filters[hidden],.server-tile[hidden] { display:none!important; }
.servers-filters { display:flex;justify-content:center;gap:13px;margin:0 auto 38px; }
.servers-filters button { display:flex;align-items:center;justify-content:center;gap:12px;min-width:172px;min-height:46px;padding:10px 22px;border:1px solid #ffffff1c;border-radius:6px;color:#e3e3e3;background:linear-gradient(#161616,#0b0b0b);font:inherit;font-size:14px;cursor:pointer;transition:border-color .25s,box-shadow .25s; }
.servers-filters button[aria-pressed=true] { border-color:#f0c66a;background:linear-gradient(115deg,#71511c,#2b2214 65%,#705222);box-shadow:inset 0 0 13px #dba43b33,0 0 14px #dba43b30;color:#fff2d0; }
.servers-filters button:focus-visible { outline:2px solid #ffe3a0;outline-offset:4px; }
.server-tile__surface { padding-top:22px;padding-bottom:20px;background:linear-gradient(120deg,#141310 0%,#080808 48%,#10100e);border-color:#ffffff2c;border-radius:14px; }
.server-launch { color:#f2c956;border-color:#cfa440;font-size:13px;font-weight:500;box-shadow:inset 0 0 14px #c69d2e09; }
.server-art { position:relative;width:calc(100% + 40px);height:235px;margin:4px -20px -4px;mask-image:linear-gradient(transparent,#000 7%,#000 87%,transparent); }
.server-art { mix-blend-mode:screen; }
.server-art img { position:absolute;inset:0;min-height:0;object-fit:contain;filter:none; }
.server-tile h2 { font-size:34px;margin:0 0 9px;line-height:1.15; }
.server-tile h2 span { color:#f2ca72; }
.server-description { font-size:15px;line-height:1.52;min-height:70px;color:#bebebe;margin-bottom:14px; }
.server-current { padding:7px 0;font-size:10px;color:#777;border-top:0; }
.server-details summary { font-size:14px;padding:13px 10px;box-shadow:0 0 11px #ddad3910,inset 0 0 9px #ddad3909; }
.server-tile:has(.server-details[open]) .server-tile__surface { border-color:#f2d391;box-shadow:0 0 0 4px #d2a64c12,-4px 2px 22px #d2a64c5c,inset 0 0 18px #d2a64c1c; }
.server-tile:has(.server-details[open]) summary { background:linear-gradient(125deg,#dfb75e 0%,#72511e 60%,#b08a43);border-color:#ffe4a4;box-shadow:0 0 15px #e8bb574d,inset 0 0 9px #ffdf9770; }
.server-flyout { padding:22px;background:linear-gradient(100deg,#17130bee,#070707fa 70%,#211b0c);box-shadow:0 0 16px #d7a84040,inset -1px 0 10px #d7a84015; }
.server-feature { padding:17px 0;gap:14px; }
.server-feature h4 { font-size:14px; }.server-feature p{font-size:12px;color:#a9a9a9;}
.server-feature>span { color:#efc859;filter:drop-shadow(0 0 3px #efc85920); }
.servers-atmosphere { background:radial-gradient(ellipse at 35% 40%,#b9831808,transparent 52%); }
.servers-atmosphere::before { border-color:#c59b3b35;left:-34vw;top:28%; }
.servers-atmosphere::after { border-color:#c59b3b30;right:-34vw;top:-12%; }
.servers-atmosphere i { position:absolute;left:9%;top:11%;width:3px;height:3px;border-radius:50%;background:#ffd581;opacity:.19;box-shadow:0 0 7px 2px #eab454,0 0 23px 6px #ad742e60; }
.servers-atmosphere i:nth-child(2){left:18%;top:25%;}.servers-atmosphere i:nth-child(3){left:8%;top:63%;}.servers-atmosphere i:nth-child(4){left:80%;top:13%;}.servers-atmosphere i:nth-child(5){left:95%;top:56%;}.servers-atmosphere i:nth-child(6){left:76%;top:83%;}
@media(prefers-reduced-motion:no-preference){.servers-atmosphere i{animation:servers-spark 8s ease-in-out infinite alternate;}.servers-atmosphere i:nth-child(2n){animation-delay:-4s;}}
@keyframes servers-spark{from{opacity:.09;translate:0 3px;}to{opacity:.19;translate:0 -4px;}}
.servers-grid[data-filter]:not([data-filter=all]) { display:flex;justify-content:center;width:100%;translate:0 0; }
.servers-grid[data-filter]:not([data-filter=all]) .server-tile { width:min(355px,100%);translate:0 0; }
.servers-grid[data-filter]:not([data-filter=all]) .server-flyout { position:relative;left:auto;right:auto;top:auto;width:100%;min-height:0;margin-top:12px;border-radius:9px;z-index:auto; }
.servers-grid[data-filter]:not([data-filter=all]) .server-flyout::before {display:none;}
@media(max-width:760px){.servers-page .servers-hero>p:last-child{font-size:14px;}.servers-filters{gap:7px;margin-bottom:28px;}.servers-filters button{min-width:0;flex:1;padding:10px 8px;font-size:12px;gap:6px;}.servers-page .logo{gap:7px;}.servers-mark{width:28px;height:34px;}.servers-brand{font-size:22px;}.servers-grid[data-filter]:not([data-filter=all]){flex-wrap:wrap;}.server-description{font-size:14px;}.server-art{height:240px;}}
@media(prefers-reduced-motion:reduce){.servers-atmosphere i{animation:none!important;}}
/* Keep the reference's compact first screen while retaining real state and links. */
@media(min-width:1001px){
 .servers-page .site-head>.wrap{min-height:58px;padding-top:5px;padding-bottom:5px;}
 .servers-mark{height:40px;width:38px;}
 .servers-page .servers-hero{padding-top:38px;padding-bottom:25px;}
 .servers-page .servers-hero h1{margin-bottom:12px;}
 .servers-filters{margin-bottom:32px;}
 .server-tile__surface{padding-top:20px;padding-bottom:17px;}
 .server-art{height:215px;margin-top:0;margin-bottom:-3px;mask-image:linear-gradient(transparent,#000 5%,#000 94%,transparent);}
 .server-description{min-height:64px;margin-bottom:6px;}
 .server-current{padding:5px 0;}
 .server-ranking{padding-top:8px;}
 .server-tile:not(:has(.server-ranking)) .server-details{margin-bottom:23px;}
 .server-feature{padding:14px 0;}
 .servers-content{padding-bottom:46px;}
}

/* Cards are the homepage content; no introductory block. */
.servers-content{padding-top:70px;min-height:calc(100svh - 130px);display:flex;align-items:center;}
@media(max-width:1000px){.servers-content{display:block;min-height:0;padding-top:38px;}}
@media(max-width:620px){.servers-content{padding-top:24px;}}
.servers-content{display:block;padding-top:40px;min-height:calc(100svh - 130px);}
.server-profile{position:relative;display:grid;grid-template-columns:minmax(300px,1.15fr) 2fr;max-width:1100px;margin:0 auto 38px;border:1px solid #caa04d80;border-radius:15px;background:radial-gradient(ellipse at 6% 0%,#c99a3020,transparent 55%),linear-gradient(115deg,#14120e,#090909 60%);box-shadow:0 0 24px #bd8f2512,inset 0 1px #ffe5a329;overflow:hidden;}
.server-profile__identity{padding:24px;border-right:1px solid #d2a64c26;min-width:0;}
.server-profile__person{display:flex;align-items:center;gap:22px;min-height:145px;}
.server-profile__skin{object-fit:contain;filter:drop-shadow(0 7px 14px #dbac3225);flex:none;}
.server-profile__eyebrow{display:block;font-size:9px;letter-spacing:.18em;color:#aa9873;}
.server-profile h1{font-size:28px;line-height:1.2;letter-spacing:-.03em;margin:8px 0 10px;overflow-wrap:anywhere;}
.server-profile h1 a{color:#f2eee5;}
.server-profile__presence,.server-profile__rank{display:inline-block;font-size:11px;color:#b5b1a8;margin-right:8px;}
.server-profile__presence::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:#777;margin-right:6px;}
.server-profile__presence.is-online::before{background:#6adb75;box-shadow:0 0 7px #6adb75;}
.server-profile__rank{color:#e6bf6b;}
.server-profile__seen,.server-profile__person p{font-size:11px;color:#888;margin-top:10px;line-height:1.6;}
.server-profile__account{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;border-top:1px solid #ffffff0e;border-bottom:1px solid #ffffff0e;padding:13px 0;margin:12px 0 16px;}
.server-profile dt{font-size:10px;color:#92908a;}.server-profile dd{margin:5px 0 0;color:#eed39a;font-size:15px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;}
.server-profile__ranks>div{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px;}.server-profile__ranks a{display:flex;align-items:center;gap:7px;padding:6px 8px;border:1px solid #c89a322b;border-radius:5px;background:#c89a3208;font-size:10px;color:#b8b3a9;}.server-profile__ranks strong{color:#f1ca70;font-size:14px;}.server-profile__ranks p{font-size:11px;color:#888;}
.server-profile__search{display:flex;margin-top:17px;border:1px solid #cfa44055;border-radius:6px;overflow:hidden;}.server-profile__search input{min-width:0;width:100%;border:0;background:#080808;color:#ddd;padding:11px;font:inherit;font-size:12px;}.server-profile__search button{display:flex;align-items:center;gap:8px;border:0;border-left:1px solid #cfa44044;color:#f1d28e;background:linear-gradient(120deg,#4e391b,#241c10);padding:0 13px;cursor:pointer;}.server-profile__search :focus-visible{outline:2px solid #edc46b;outline-offset:-3px;}.server-profile__error{font-size:12px;color:#ffbc8c;margin-top:8px;}
.server-profile__modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));min-width:0;}.server-profile__mode{position:relative;padding:30px 18px 22px;min-width:0;}.server-profile__mode+.server-profile__mode{border-left:1px solid #ffffff0b;}.server-profile__mode>img{display:block;object-fit:contain;width:100%;height:90px;margin:0 auto 16px;mix-blend-mode:screen;}.server-profile__mode h2{font-size:19px;color:#eed19a;letter-spacing:-.025em;margin:0 0 23px;}.server-profile__mode dl>div{padding:12px 0;border-top:1px solid #ffffff0d;}.server-profile__mode dd{color:#d0cbc1;font-size:13px;}.server-profile__unavailable{font-size:10px;color:#89857c;line-height:1.6;margin-top:18px;}.server-profile__link{display:flex;align-items:center;gap:8px;color:#d6b565;font-size:11px;margin-top:20px;}.server-profile__silhouette{display:grid;place-items:center;width:80px;height:125px;color:#c6a65e;background:radial-gradient(ellipse,#bd8f2520,transparent 70%);flex:none;}
@media(min-width:1250px) and (hover:hover){.server-profile{width:calc(100% - 244px);max-width:none;}}
@media(max-width:1000px){.server-profile{max-width:730px;grid-template-columns:1fr;}.server-profile__identity{border-right:0;border-bottom:1px solid #d2a64c26;}.server-profile__person{min-height:120px;}.server-profile__skin{height:125px;}.server-profile__mode{padding-top:20px;}}
@media(max-width:620px){.servers-content{padding-top:24px;}.server-profile{max-width:390px;margin-bottom:24px;}.server-profile__identity{padding:18px;}.server-profile__mode{padding:18px 10px;}.server-profile__mode h2{font-size:14px;}.server-profile__mode>img{height:65px;}.server-profile__mode dd{font-size:11px;}.server-profile__link{font-size:10px;}.server-profile h1{font-size:25px;}}
@media(prefers-reduced-motion:no-preference){.server-profile{animation:server-feature .5s ease both;}.server-profile__skin{animation:profile-skin-float 5s ease-in-out infinite;}@keyframes profile-skin-float{50%{transform:translateY(-4px);}}}
.server-profile__mode h2{text-align:center;margin:8px 0 28px;}
.server-profile__account{grid-template-columns:1fr;}
.server-profile__edit{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;margin-left:9px;width:30px;height:30px;padding:0;border:1px solid #c9a45744;border-radius:6px;background:#c9a4570b;color:#d5b367;cursor:pointer;transition:background .2s,border-color .2s;}
.server-profile__edit:hover{background:#c9a45722;border-color:#e1bb68;}
.server-profile__edit:focus-visible{outline:2px solid #edc46b;outline-offset:3px;}
.server-profile__search[hidden]{display:none;}
.server-profile__account dd{font-size:13px;color:#c4beb2;line-height:1.6;}.server-profile__account dd strong{color:#f1ca70;font-size:17px;}
.server-current strong.is-offline{color:#ed6a67;font-weight:600;letter-spacing:.08em;}.server-current strong.is-online{color:#85ce8e;font-size:12px;}
.server-profile__ranks>div{position:relative;padding-right:37px;}
.server-profile__rank-menu>summary{position:absolute;right:0;top:0;display:grid;place-items:center;width:30px;height:36px;list-style:none;border:1px solid #c89a3244;border-radius:5px;color:#edc46b;background:#211b10;cursor:pointer;font-size:13px;letter-spacing:1px;}
.server-profile__rank-menu>summary::-webkit-details-marker{display:none;}
.server-profile__rank-menu>summary:focus-visible{outline:2px solid #edc46b;outline-offset:2px;}
.server-profile__rank-menu[open]{flex-basis:100%;}
.server-profile__rank-list{max-height:260px;overflow:auto;padding:14px;margin-top:5px;background:linear-gradient(120deg,#211b10,#0a0a09);border:1px solid #c89a3244;border-radius:7px;scrollbar-color:#8e6f30 #10100c;}
.server-profile__rank-list>a{margin-top:7px;padding:9px 10px;}.server-profile__rank-list>a:hover{border-color:#e0b65b;background:#c89a321c;}
@media(prefers-reduced-motion:no-preference){.server-profile__rank-menu[open] .server-profile__rank-list{animation:server-feature .22s ease both;}}
/* Layered generated light textures replace the ornamental frame. */
.server-profile{isolation:isolate;border:1px solid #bd954a50;background:linear-gradient(115deg,#141109,#080808 55%,#100e09);box-shadow:0 0 34px #bc85220d;}
.server-profile::after{display:none;}
.profile-motion{position:absolute;inset:0;overflow:hidden;border-radius:inherit;z-index:-1;pointer-events:none;}
.profile-motion i{position:absolute;inset:-10%;background-size:100% 100%;background-repeat:no-repeat;mix-blend-mode:screen;pointer-events:none;}
.profile-motion__haze{background-image:url('/assets/art/servers-v2/profile-haze-v2.webp');opacity:.45;}
.profile-motion__echo{background-image:url('/assets/art/servers-v2/profile-haze-v2.webp');opacity:.2;transform:rotate(180deg) scale(1.06);}
.profile-motion__sparks{background-image:url('/assets/art/servers-v2/profile-sparks-v2.webp');opacity:.6;}
@media(prefers-reduced-motion:no-preference){
.profile-motion__haze{animation:profile-haze 14s ease-in-out infinite alternate;}
.profile-motion__echo{animation:profile-echo 19s ease-in-out infinite alternate;}
.profile-motion__sparks{animation:profile-motes 10s ease-in-out infinite alternate;}
@keyframes profile-haze{from{transform:translate(-2%,1%) scale(1);opacity:.3;}to{transform:translate(2%,-2%) scale(1.08);opacity:.55;}}
@keyframes profile-echo{from{transform:rotate(180deg) translate(-2%,2%) scale(1.06);opacity:.12;}to{transform:rotate(180deg) translate(3%,-1%) scale(1.12);opacity:.28;}}
@keyframes profile-motes{from{transform:translate(1%,3%) scale(1);opacity:.35;}to{transform:translate(-2%,-3%) scale(1.04);opacity:.7;}}
}
@media(max-width:620px){.profile-motion i{background-size:auto 100%;background-position:center;}.profile-motion__haze{opacity:.3;}.profile-motion__echo{display:none;}}
@media(prefers-reduced-motion:reduce){.profile-motion i{animation:none!important;}}
/* A soft moving glow fills the profile center; card and detail art share its palette. */
.profile-motion::after{content:'';position:absolute;inset:-15%;background:radial-gradient(ellipse at 52% 48%,#c9993933,transparent 62%);mix-blend-mode:screen;pointer-events:none;}
.mode-motion{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 50% 30%,#d4a34416,transparent 70%);}
.mode-motion i{position:absolute;inset:-12%;background-repeat:no-repeat;background-size:auto 100%;mix-blend-mode:screen;pointer-events:none;}
.mode-motion i:first-child{background-image:url('/assets/art/servers-v2/profile-haze-v2.webp');background-position:left center;opacity:.38;}
.mode-motion i:last-child{background-image:url('/assets/art/servers-v2/profile-sparks-v2.webp');background-position:right center;opacity:.4;}
.server-tile__surface>.server-art,.server-tile__surface>h2,.server-tile__surface>.server-description,.server-tile__surface>.server-current,.server-tile__surface>.server-ranking,.server-details>summary{position:relative;z-index:1;}
.server-flyout>h3,.server-flyout>.server-flyout__type,.server-flyout>.server-feature{position:relative;z-index:1;}
.server-flyout .mode-motion{background:linear-gradient(120deg,#b8862312,#08080880);}
.server-flyout .mode-motion i:first-child{background-position:right center;opacity:.23;}
.server-flyout .mode-motion i:last-child{opacity:.22;}
@media(prefers-reduced-motion:no-preference){
.profile-motion::after{animation:profile-center-light 13s ease-in-out infinite alternate;}
.mode-motion i:first-child{animation:mode-haze 16s ease-in-out infinite alternate;}
.mode-motion i:last-child{animation:mode-dust 11s ease-in-out infinite alternate;}
.server-tile:nth-child(2) .mode-motion i{animation-delay:-6s;}.server-tile:nth-child(3) .mode-motion i{animation-delay:-11s;}
.server-flyout .mode-motion i{animation-direction:alternate-reverse;}
@keyframes profile-center-light{from{transform:translateX(-6%);opacity:.55;}to{transform:translateX(6%);opacity:1;}}

@keyframes mode-dust{from{transform:translate(2%,3%);opacity:.22;}to{transform:translate(-3%,-3%);opacity:.46;}}
}
@media(prefers-reduced-motion:reduce){.mode-motion i,.profile-motion::after{animation:none!important;}}
/* Restore the approved flame artwork; vary its placement, not its style. */
.profile-motion__echo{display:none;}
#skyblock .mode-motion i{background-position:left center;}
#minigames .mode-motion i{background-position:right center;}
#prison .mode-motion i{inset:-35%;rotate:-90deg;background-position:left center;}
.server-flyout .mode-motion{opacity:.8;}
@media(prefers-reduced-motion:no-preference){
.mode-motion i:first-child{animation:mode-flame 16s ease-in-out infinite alternate;}
.mode-motion i:last-child{animation:mode-dust 11s ease-in-out infinite alternate;}
#minigames .mode-motion i{animation-delay:-6s;animation-direction:alternate-reverse;}
#prison .mode-motion i{animation-delay:-11s;}
@keyframes mode-flame{from{transform:translate(-2%,2%) scale(1);opacity:.3;}to{transform:translate(3%,-3%) scale(1.05);opacity:.48;}}
}
.motion-paused .mode-motion i,.motion-paused .profile-motion i,.motion-paused .profile-motion::after,.motion-paused .server-profile__skin,.page-motion-paused .mode-motion i,.page-motion-paused .profile-motion i,.page-motion-paused .profile-motion::after,.page-motion-paused .server-profile__skin{animation-play-state:paused!important;}
@media(prefers-reduced-motion:reduce){.mode-motion i{animation:none!important;}}

/* Keep the image edges blended when its hover transform is composited. */
.server-art img{mask-image:radial-gradient(ellipse 70% 68% at 50% 50%,#000 60%,transparent 100%);}
@media(prefers-reduced-motion:reduce){:is(#skyblock,#prison,#minigames) .mode-motion i:nth-child(n){animation:none!important;}}

/* Homepage shell: the content is the interface. Navigation stays in a compact dock. */
.servers-page main{min-height:100svh;display:grid;align-items:center;}
.servers-page .servers-content{width:100%;padding-top:28px;padding-bottom:28px;}
.server-dock{position:fixed;top:18px;right:18px;z-index:80;color:#ddd;}
.server-dock>summary{display:flex;align-items:center;gap:12px;height:42px;padding:0 12px;list-style:none;border:1px solid #d1ab5b55;border-radius:10px;background:#0b0b0bd9;box-shadow:0 8px 30px #0009,inset 0 1px #fff1b518;backdrop-filter:blur(12px);cursor:pointer;color:#d9b968;transition:border-color .2s,background .2s,transform .2s;}
.server-dock>summary::-webkit-details-marker{display:none;}
.server-dock>summary:hover{border-color:#e3bd68;background:#151109;transform:translateY(-1px);}
.server-dock>summary:focus-visible{outline:2px solid #f0c76c;outline-offset:4px;}
.server-dock__online{display:flex;align-items:center;gap:6px;padding-left:11px;border-left:1px solid #ffffff15;color:#aaa;font-size:11px;font-variant-numeric:tabular-nums;}
.server-dock__online i{width:6px;height:6px;border-radius:50%;background:#61d16d;box-shadow:0 0 8px #61d16d80;}
.server-dock__panel{position:absolute;top:50px;right:0;width:258px;padding:14px;border:1px solid #d1ab5b55;border-radius:13px;background:linear-gradient(145deg,#18140df2,#080808fa 56%);box-shadow:0 24px 70px #000c,0 0 32px #c18e2515;backdrop-filter:blur(18px);transform-origin:top right;}
.server-dock__head{display:flex;justify-content:space-between;align-items:center;padding:5px 5px 12px;border-bottom:1px solid #ffffff10;text-transform:uppercase;letter-spacing:.15em;font-size:10px;color:#e4c57f;}
.server-dock__head small{font-size:9px;color:#777;letter-spacing:.05em;}
.server-dock nav{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:10px 0;}
.server-dock nav a{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;padding:10px;border:1px solid transparent;border-radius:7px;color:#a9a9a9;font-size:12px;transition:color .18s,background .18s,border-color .18s;}
.server-dock nav a:hover,.server-dock nav a:focus-visible{color:#f4d48e;background:#d2a64c0d;border-color:#d2a64c2e;outline:0;}
.server-dock nav a.on{color:#f4d48e;}
.server-dock nav svg{flex:none;opacity:.55;}
.server-dock__join{display:flex;width:100%;align-items:center;justify-content:space-between;gap:8px;padding:11px 12px;border:1px solid #d2a64c70;border-radius:7px;background:linear-gradient(120deg,#4f3918,#1c160c);color:#f3d28b;font:inherit;font-size:12px;cursor:pointer;}
.server-dock__warning{display:flex;align-items:center;gap:8px;margin-top:9px;padding:9px 10px;border-radius:7px;background:#c78e1e0d;color:#c9a557;font-size:10px;}
@media(prefers-reduced-motion:no-preference){.server-dock[open] .server-dock__panel{animation:dock-open .24s cubic-bezier(.2,.8,.2,1) both;}@keyframes dock-open{from{opacity:0;transform:translateY(-8px) scale(.96);}to{opacity:1;transform:none;}}}
@media(max-width:620px){.servers-page main{display:block;}.servers-page .servers-content{padding-top:72px;padding-bottom:22px;}.server-dock{top:12px;right:12px;}.server-dock__panel{width:min(280px,calc(100vw - 24px));}.server-dock>summary{height:40px;}}
@media(prefers-reduced-motion:reduce){.server-dock__panel{animation:none!important;}}

/* Compact header: visible orientation without rebuilding the old full-width bar. */
.server-minihead{position:fixed;top:14px;left:50%;z-index:80;display:flex;align-items:center;gap:5px;width:max-content;max-width:calc(100vw - 28px);padding:5px;border:1px solid #d1ab5b42;border-radius:12px;background:#090909df;box-shadow:0 12px 45px #000b,inset 0 1px #fff0bd12;backdrop-filter:blur(14px);transform:translateX(-50%);}
.server-minihead>nav{display:flex;align-items:center;gap:2px;}
.server-minihead>nav a{position:relative;padding:9px 12px;border-radius:7px;color:#8f8f8f;font-size:12px;transition:color .18s,background .18s;}
.server-minihead>nav a:hover,.server-minihead>nav a:focus-visible{color:#eee;background:#ffffff08;outline:0;}
.server-minihead>nav a.on{color:#efd084;background:#d2a64c0d;}
.server-minihead>nav a.on::after{content:'';position:absolute;left:12px;right:12px;bottom:3px;height:1px;background:#e6bd62;box-shadow:0 0 7px #e6bd6288;}
.server-minihead__status,.server-minihead__join{display:flex;align-items:center;gap:7px;height:34px;padding:0 10px;border-left:1px solid #ffffff12;color:#aaa;font-size:11px;font-variant-numeric:tabular-nums;}
.server-minihead__status i{width:6px;height:6px;border-radius:50%;background:#61d16d;box-shadow:0 0 8px #61d16d80;}
.server-minihead__status:hover{color:#ddd;}
.server-minihead__join{border:1px solid #d2a64c38;border-radius:7px;background:#d2a64c0a;color:#cfb477;font:inherit;font-size:11px;cursor:pointer;}
.server-minihead__join:hover{border-color:#d2a64c80;color:#efd18d;}
.server-minihead .server-dock{position:relative;top:auto;right:auto;z-index:auto;}
.server-minihead .server-dock>summary{width:34px;height:34px;justify-content:center;padding:0;border:0;border-radius:7px;background:transparent;box-shadow:none;backdrop-filter:none;color:#a8905f;}
.server-minihead .server-dock>summary:hover{background:#d2a64c12;transform:none;}
.server-minihead .server-dock__panel{top:43px;right:-5px;}
.server-minihead .server-dock nav{display:grid;}
.servers-page .servers-content{padding-top:82px;}
@media(max-width:700px){.server-minihead{top:10px;}.server-minihead>nav{display:none;}.server-minihead__players{display:none;}.server-minihead__status,.server-minihead__join{height:32px;}.server-minihead .server-dock>summary{height:32px;width:32px;}.server-minihead .server-dock__panel{top:41px;right:-5px;}.servers-page .servers-content{padding-top:70px;}}

/* One pre-darkened image keeps the page warm without competing with the panels. */
.servers-page::before{content:'';display:block;position:fixed;inset:-4%;z-index:0;pointer-events:none;background:url('/assets/art/servers-v2/page-ambient-v3.webp') center/cover no-repeat;opacity:.94;transform:scale(1.04);will-change:transform,opacity;}
.servers-page::after{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,#02020214 0%,transparent 22% 74%,#0202023d 100%);}
.servers-page .servers-atmosphere{opacity:.55;}
@media(prefers-reduced-motion:no-preference){.servers-page::before{animation:page-ambient-drift 32s ease-in-out infinite alternate;}@keyframes page-ambient-drift{from{transform:translate3d(-.7%,.4%,0) scale(1.04);opacity:.86;}to{transform:translate3d(.7%,-.5%,0) scale(1.065);opacity:.98;}}}
.page-motion-paused.servers-page::before{animation-play-state:paused!important;}
@media(max-width:620px){.servers-page::before{inset:-8%;opacity:.8;background-position:center top;}.servers-page::after{background:linear-gradient(#03030329,transparent 38%,#03030357);}}
@media(prefers-reduced-motion:reduce){.servers-page::before{animation:none!important;will-change:auto;}}
