.servers-page{--page-art:none;--server-green:#5ee38a;--server-blue:#43c9ff;--server-amber:#ffb648}
.servers-main{padding-bottom:2rem}
.servers-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(18rem,.85fr);gap:clamp(2rem,5vw,5rem);align-items:center;margin:1.5rem 0 2.4rem;padding:clamp(2rem,5vw,4.6rem);overflow:hidden;border:1px solid #2b3540;border-radius:28px;background:radial-gradient(circle at 82% 42%,rgba(67,201,255,.15),transparent 27rem),radial-gradient(circle at 10% 90%,rgba(94,227,138,.1),transparent 24rem),linear-gradient(145deg,#11151c,#090c11 72%);box-shadow:0 34px 90px -54px #000}
.servers-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(90deg,#000,transparent 72%)}
.servers-hero-copy,.server-radar{position:relative;z-index:1}
.servers-hero h1{max-width:13ch;font-size:clamp(2.45rem,5vw,4.6rem);line-height:.94;margin:.25rem 0 1.2rem}
.servers-hero h1 em{font-style:normal;background:linear-gradient(94deg,var(--server-green),var(--server-blue));-webkit-background-clip:text;background-clip:text;color:transparent}
.servers-hero p{max-width:58ch;color:#bac2cd;font-size:1.06rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.6rem}
.server-primary,.server-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:.76rem 1.05rem;border-radius:10px;font-weight:800;border:1px solid var(--line2);transition:.17s}
.server-primary{background:var(--server-green);border-color:var(--server-green);color:#06180d}
.server-secondary{background:#131821;color:#d7dce4}
.server-primary:hover,.server-secondary:hover{transform:translateY(-2px);box-shadow:0 14px 32px -20px var(--server-green)}
.server-radar{display:grid;place-items:center;min-height:22rem;isolation:isolate}
.radar-disc{position:absolute;width:min(100%,21rem);aspect-ratio:1;border:1px solid rgba(67,201,255,.42);border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 19%,rgba(67,201,255,.16) 19.4% 20%),conic-gradient(from 20deg,transparent 0 74%,rgba(94,227,138,.2) 82%,transparent 90%);box-shadow:inset 0 0 50px rgba(67,201,255,.07),0 0 80px rgba(67,201,255,.08);animation:radar-sweep 7s linear infinite}
.radar-disc::before,.radar-disc::after{content:"";position:absolute;background:rgba(67,201,255,.22)}
.radar-disc::before{left:50%;top:0;bottom:0;width:1px}.radar-disc::after{top:50%;left:0;right:0;height:1px}
.radar-core{position:relative;display:grid;place-items:center;width:9.5rem;aspect-ratio:1;border:1px solid rgba(94,227,138,.48);border-radius:50%;background:rgba(9,15,15,.9);box-shadow:0 0 0 12px rgba(94,227,138,.025),0 0 42px rgba(94,227,138,.15);text-align:center}
.radar-core strong{font:900 2.8rem/.9 system-ui;color:#fff;font-variant-numeric:tabular-nums}
.radar-core span{max-width:8rem;font:750 .58rem/1.15 system-ui;letter-spacing:.12em;text-transform:uppercase;color:var(--server-green)}
.radar-ping{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--server-green);box-shadow:0 0 0 7px rgba(94,227,138,.08),0 0 18px var(--server-green)}
.radar-ping.a{top:22%;right:18%}.radar-ping.b{bottom:23%;left:13%;animation-delay:-1s}.radar-ping.c{top:43%;left:8%;animation-delay:-2s}
@keyframes radar-sweep{to{transform:rotate(360deg)}}

.server-trust{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:0 0 3.8rem;border:1px solid var(--line2);border-radius:16px;overflow:hidden;background:var(--line2)}
.server-trust>div{padding:1.05rem 1.15rem;background:#11141a}.server-trust b{display:block;font-size:.95rem}.server-trust span{display:block;margin-top:.2rem;color:var(--dim);font-size:.8rem}
.featured-section,.category-section,.directory-section{scroll-margin-top:7rem;margin:0 0 4.5rem}
.section-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(16rem,.55fr);gap:2rem;align-items:end;padding-bottom:1.05rem;border-bottom:1px solid var(--line2)}
.section-heading h2,.directory-head h2{margin:0;font-size:clamp(1.65rem,3vw,2.35rem)}
.section-heading p,.directory-head p{margin:0;color:var(--dim)}
.collection-kicker{display:block;margin-bottom:.5rem;color:var(--server-green);font:800 .68rem/1 system-ui;letter-spacing:.14em;text-transform:uppercase}

.server-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1rem}
.server-card{--card-accent:var(--server-green);position:relative;display:flex;flex-direction:column;min-width:0;padding:1.15rem;border:1px solid var(--line);border-radius:17px;background:linear-gradient(160deg,rgba(21,25,33,.98),rgba(12,14,19,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.025);transition:transform .18s,border-color .18s,box-shadow .18s}
.server-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--card-accent) 52%,var(--line));box-shadow:0 20px 46px -32px var(--card-accent)}
.featured-badge{align-self:flex-start;margin:-.15rem 0 .85rem;padding:.35rem .52rem;border:1px solid color-mix(in srgb,var(--card-accent) 45%,#30343c);border-radius:999px;background:color-mix(in srgb,var(--card-accent) 10%,#0c1015);color:color-mix(in srgb,var(--card-accent) 78%,#fff);font:850 .61rem/1 system-ui;letter-spacing:.07em;text-transform:uppercase}
.server-card-top{display:grid;grid-template-columns:4rem 1fr auto;gap:.78rem;align-items:center}
.server-avatar,.server-row-icon{position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 35% 25%,color-mix(in srgb,var(--card-accent,#5ee38a) 28%,transparent),transparent 60%),#0c1015;color:#fff;font:900 .82rem/1 ui-monospace,monospace}
.server-avatar{width:4rem;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--card-accent) 50%,#30343c);border-radius:13px;box-shadow:inset 0 0 18px color-mix(in srgb,var(--card-accent) 11%,transparent)}
.server-avatar img,.server-row-icon img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;image-rendering:auto}
.server-avatar img:not([src]),.server-row-icon img:not([src]){display:none}
.server-title b{display:block;font-size:1.08rem;line-height:1.15}.server-address{display:block;max-width:15rem;margin-top:.25rem;overflow:hidden;color:var(--dim2);font:.72rem/1.2 ui-monospace,monospace;text-overflow:ellipsis;white-space:nowrap}
.live-pill{display:inline-flex;align-items:center;gap:.4rem;padding:.42rem .55rem;border:1px solid var(--line2);border-radius:99px;color:var(--dim);font:800 .62rem/1 system-ui;letter-spacing:.08em;text-transform:uppercase}
.live-pill i,.server-row-online i{width:7px;height:7px;border-radius:50%;background:#657080}
.server-card[data-state="online"] .live-pill{color:var(--server-green);border-color:rgba(94,227,138,.3);background:rgba(94,227,138,.055)}
.server-card[data-state="online"] .live-pill i,.server-row[data-state="online"] .server-row-online i{background:var(--server-green);box-shadow:0 0 10px var(--server-green)}
.server-card[data-state="offline"] .live-pill{color:#ff7d7d;border-color:rgba(255,125,125,.3)}
.server-card[data-state="offline"] .live-pill i,.server-row[data-state="offline"] .server-row-online i{background:#ff7d7d}
.server-summary{min-height:4.5rem;margin:1rem 0 .7rem;color:#c7ccd4;font-size:.89rem}
.editor-note{margin:0 0 .85rem;padding:.7rem .8rem;border-left:2px solid var(--card-accent);background:rgba(255,255,255,.025);color:var(--dim);font-size:.79rem}
.server-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin:0 0 .9rem}.server-tags span{padding:.32rem .48rem;border:1px solid #252a34;border-radius:6px;background:#10141a;color:#9ca7b5;font:700 .68rem/1 system-ui}
.live-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;margin-top:auto}.live-metrics div{min-width:0;padding:.55rem .6rem;border:1px solid #20252e;border-radius:8px;background:#0d1015}.live-metrics span{display:block;color:var(--dim2);font:700 .57rem/1 system-ui;letter-spacing:.09em;text-transform:uppercase}.live-metrics b{display:block;margin-top:.35rem;overflow:hidden;font:.8rem/1.15 ui-monospace,monospace;text-overflow:ellipsis;white-space:nowrap}
.server-actions{display:flex;gap:.5rem;margin-top:1rem}.copy-address,.official-link{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:.58rem .75rem;border:1px solid var(--line2);border-radius:8px;background:#151a21;color:#dbe0e8;font:750 .75rem/1 system-ui;cursor:pointer}.server-actions .copy-address{flex:1;background:var(--card-accent);border-color:var(--card-accent);color:#07120a}.official-link:hover,.copy-address:hover{filter:brightness(1.08)}

.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;margin-top:1rem}
.category-tile{--category-color:#5ee38a;position:relative;min-height:9.2rem;padding:1rem;overflow:hidden;border:1px solid color-mix(in srgb,var(--category-color) 45%,#303742);border-radius:16px;background:radial-gradient(circle at 88% 18%,color-mix(in srgb,var(--category-color) 55%,transparent),transparent 42%),linear-gradient(145deg,color-mix(in srgb,var(--category-color) 16%,#151922),#101319);color:#fff;text-align:left;cursor:pointer;transition:.17s}
.category-tile::after{content:"";position:absolute;right:-1.2rem;bottom:-2.2rem;width:7rem;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--category-color) 45%,transparent);transform:rotate(45deg);box-shadow:0 0 0 13px color-mix(in srgb,var(--category-color) 7%,transparent),0 0 0 26px color-mix(in srgb,var(--category-color) 4%,transparent)}
.category-tile:hover,.category-tile.is-active{transform:translateY(-3px);border-color:var(--category-color);box-shadow:0 18px 44px -28px var(--category-color)}
.category-tile.is-active{outline:2px solid color-mix(in srgb,var(--category-color) 55%,transparent);outline-offset:2px}
.category-tile span{position:relative;z-index:1;display:block;max-width:9rem;font:900 1.08rem/1.05 system-ui}.category-tile b{position:absolute;z-index:1;right:.85rem;top:.78rem;color:color-mix(in srgb,var(--category-color) 80%,#fff);font:900 1.45rem/1 ui-monospace,monospace}.category-tile small{position:absolute;z-index:1;left:1rem;right:3.5rem;bottom:1rem;color:#c3cad3;font:.72rem/1.35 system-ui}

.directory-section{padding:clamp(1rem,2.5vw,1.6rem);border:1px solid #28313b;border-radius:20px;background:linear-gradient(155deg,#11151b,#0b0e13)}
.directory-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,.55fr);gap:2rem;align-items:end;margin-bottom:1.2rem}
.directory-head p{margin-top:.45rem}.directory-search{display:flex;flex-direction:column;gap:.4rem;color:var(--dim);font:750 .68rem/1 system-ui;letter-spacing:.08em;text-transform:uppercase}.server-search{width:100%;min-height:44px;padding:.7rem .85rem;color:#fff;border:1px solid var(--line2);border-radius:9px;background:#0c1016;font:500 .88rem/1.2 system-ui;letter-spacing:normal;text-transform:none}.server-search:focus{outline:2px solid rgba(67,201,255,.5);outline-offset:2px}
.server-list-head,.server-row{display:grid;grid-template-columns:3rem 3rem minmax(12rem,1.7fr) minmax(8rem,.9fr) minmax(6rem,.65fr) minmax(6.5rem,.6fr) minmax(8.5rem,.7fr);gap:.7rem;align-items:center}
.server-list-head{padding:.65rem .8rem;color:#657080;font:800 .57rem/1 system-ui;letter-spacing:.1em;text-transform:uppercase}.server-list-head span:nth-child(2){grid-column:2/4}
.server-list{border-top:1px solid #252c35}
.server-row{position:relative;min-height:96px;padding:.68rem .8rem;border-bottom:1px solid #20262e;transition:background .15s,border-color .15s,box-shadow .15s}.server-row:hover{background:#141920;border-color:#303943}.server-row[data-language="ru"]{box-shadow:inset 3px 0 #ffd04f}.server-row[data-language="ru"]:hover{box-shadow:inset 4px 0 #ffe27d}.server-row[hidden]{display:none}
.server-row-rank{color:#5c6672;font:.7rem/1 ui-monospace,monospace}.server-row[data-language="ru"] .server-row-rank{color:#e3bd4e}.server-row-icon{width:3rem;aspect-ratio:1;border:1px solid #303844;border-radius:10px;font-size:.66rem}.server-row-main,.server-row-version,.server-row-online{min-width:0}.server-row-main b{display:block;overflow:hidden;font-size:.92rem;line-height:1.15;text-overflow:ellipsis;white-space:nowrap}.server-row-address{display:block;margin-top:.25rem;overflow:hidden;color:#8793a1;font:.66rem/1 ui-monospace,monospace;text-overflow:ellipsis;white-space:nowrap}.server-row-description{display:-webkit-box;margin-top:.38rem;overflow:hidden;color:#8f9aaa;font-size:.7rem;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.server-row-tags{display:flex;flex-wrap:wrap;gap:.3rem;min-width:0}.server-row-tags span{max-width:7rem;padding:.3rem .42rem;overflow:hidden;border:1px solid #2a313b;border-radius:6px;color:#9aa5b3;font:700 .62rem/1 system-ui;text-overflow:ellipsis;white-space:nowrap}.server-row-tags .is-language{border-color:rgba(255,208,79,.42);background:rgba(255,208,79,.08);color:#ffd968}.server-row-version small{display:block;color:#697582;font:650 .55rem/1 system-ui;text-transform:uppercase}.server-row-version b{display:block;margin-top:.25rem;overflow:hidden;color:#b7c0cb;font:.68rem/1.2 ui-monospace,monospace;text-overflow:ellipsis;white-space:nowrap}.server-row-online{display:grid;grid-template-columns:1fr;align-content:center;justify-items:end}.server-online-count{display:flex;align-items:center;gap:.42rem}.server-row-online b{font:.82rem/1 ui-monospace,monospace}.server-row-online small{display:block;margin-top:.25rem;color:#6f7a87;font:.58rem/1 ui-monospace,monospace}.server-capacity{display:block;width:100%;max-width:6.2rem;height:3px;margin-top:.38rem;overflow:hidden;border-radius:99px;background:#26303a}.server-capacity>span{display:block;width:var(--capacity);height:100%;border-radius:inherit;background:linear-gradient(90deg,#49c97b,#78e8a0);box-shadow:0 0 8px rgba(94,227,138,.35)}.server-row-online.is-unknown .server-capacity{background:repeating-linear-gradient(90deg,#2b333d 0 5px,transparent 5px 9px)}.server-row-online.is-unknown .server-capacity>span{display:none}.server-row-actions{display:flex;justify-content:flex-end;gap:.35rem}.server-row-actions .row-copy{min-height:34px;padding:.45rem .55rem;border-color:#30413a;background:#142019;color:#8ee5aa;font-size:.66rem}.server-row-actions a{display:grid;place-items:center;width:34px;aspect-ratio:1;border:1px solid #2d3540;border-radius:7px;background:#12171d;color:#a5afbb}
.server-empty{display:none;padding:2rem;border:1px dashed var(--line2);border-radius:14px;color:var(--dim);text-align:center}.server-empty.is-visible{display:block}.directory-footer{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1rem}.directory-footer p{margin:0;color:#7f8a97;font-size:.76rem}.directory-footer button{min-height:40px;padding:.6rem .85rem;border:1px solid #345241;border-radius:9px;background:#14241b;color:#84e2a2;font:800 .74rem/1 system-ui;cursor:pointer}.directory-footer button:hover{border-color:var(--server-green)}.directory-footer button[hidden]{display:none}.directory-source{margin:1rem 0 0;color:#697582;font-size:.7rem}.directory-source a{color:#96a8bc}

.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1rem 0 3.5rem}.method-card{padding:1.15rem;border:1px solid var(--line);border-radius:15px;background:#101319}.method-card span{display:block;color:var(--server-blue);font:800 .65rem/1 ui-monospace,monospace;letter-spacing:.12em}.method-card b{display:block;margin:.55rem 0 .35rem}.method-card p{margin:0;color:var(--dim);font-size:.84rem}
.submit-panel{display:grid;grid-template-columns:minmax(0,.78fr) minmax(20rem,1.22fr);gap:2rem;margin:4rem 0 1rem;padding:clamp(1.2rem,4vw,2.3rem);border:1px solid #2b3540;border-radius:20px;background:linear-gradient(145deg,rgba(17,29,24,.75),rgba(13,16,22,.98))}.submit-panel h2{margin:.2rem 0 .7rem}.submit-panel>div>p{color:var(--dim)}
.server-form{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.server-form label{display:flex;flex-direction:column;gap:.35rem;color:#aeb6c1;font-size:.78rem}.server-form label.wide{grid-column:1/-1}.server-form input,.server-form select{width:100%;min-height:44px;padding:.65rem .75rem;border:1px solid var(--line2);border-radius:8px;background:#0c1015;color:#fff;font:inherit}.server-form input:focus,.server-form select:focus{outline:2px solid rgba(94,227,138,.45);outline-offset:2px}.server-form button{grid-column:1/-1;min-height:46px;border:0;border-radius:9px;background:var(--server-green);color:#06180d;font:850 .86rem/1 system-ui;cursor:pointer}.form-status{grid-column:1/-1;min-height:1.2rem;margin:0;color:var(--dim);font-size:.8rem}.form-status.is-ok{color:var(--server-green)}.form-status.is-error{color:#ff9191}

@media(max-width:1080px){.server-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.server-list-head,.server-row{grid-template-columns:2.6rem 3rem minmax(11rem,1.6fr) minmax(7rem,.8fr) minmax(6.5rem,.6fr) minmax(8.5rem,.7fr)}.server-list-head span:nth-child(2){grid-column:2/4}.server-list-head span:nth-child(4),.server-row-version{display:none}}
@media(max-width:820px){.servers-hero{grid-template-columns:1fr}.server-radar{min-height:18rem}.radar-disc{width:18rem}.section-heading,.directory-head{grid-template-columns:1fr}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.server-list-head,.server-row{grid-template-columns:2.7rem minmax(10rem,1fr) minmax(6rem,.45fr) minmax(8.5rem,.65fr)}.server-row-rank,.server-row-tags,.server-list-head span:first-child,.server-list-head span:nth-child(3){display:none}.server-list-head span:nth-child(2){grid-column:1/3}.server-row-icon{grid-column:1}.server-row-main{grid-column:2}.server-row-online{grid-column:3}.server-row-actions{grid-column:4}.method-grid{grid-template-columns:1fr}.submit-panel{grid-template-columns:1fr}}
@media(max-width:650px){.servers-hero{margin-inline:-.5rem;padding:2rem 1.1rem;border-radius:20px}.server-radar{min-height:15rem}.radar-disc{width:15rem}.radar-core{width:7.5rem}.radar-core strong{font-size:2.25rem}.server-trust{grid-template-columns:1fr}.server-grid{grid-template-columns:1fr}.category-grid{grid-template-columns:1fr 1fr}.category-tile{min-height:8.3rem}.category-tile small{right:1rem}.server-card-top{grid-template-columns:3.5rem 1fr}.server-avatar{width:3.5rem}.live-pill{grid-column:1/-1;justify-self:start}.directory-section{margin-inline:-.45rem;padding:.9rem;border-radius:16px}.server-list-head{display:none}.server-row{grid-template-columns:2.7rem minmax(0,1fr) auto;gap:.55rem;padding:.58rem .35rem}.server-row-icon{grid-column:1}.server-row-main{grid-column:2}.server-row-online{grid-column:3}.server-row-actions{grid-column:2/4;justify-content:stretch}.server-row-actions .row-copy{flex:1}.server-row-actions a{width:34px}.directory-footer{align-items:stretch;flex-direction:column}.directory-footer button{width:100%}.server-form{grid-template-columns:1fr}.server-form label.wide,.server-form button,.form-status{grid-column:1}.live-metrics{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:410px){.category-grid{grid-template-columns:1fr}.category-tile{min-height:7.6rem}}
@media(prefers-reduced-motion:reduce){.radar-disc{animation:none}.server-card,.category-tile{transition:none}}
