:root{
  --gold:#d7a900;
  --gold-light:#ffd96a;
  --red:#8b0000;
  --panel:rgba(10,10,10,.88);
  --line:rgba(215,169,0,.58);
  --text:#fff;
  --muted:#b9b9b9;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Montserrat",Arial,sans-serif;color:var(--text);background:#050505}
body{overflow-x:hidden}
body{
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;

    -webkit-touch-callout:none;
}

img{
    pointer-events:none;
    -webkit-user-drag:none;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
.intro-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:#050505}
.intro-bg video{width:100%;height:100%;object-fit:cover;filter:saturate(.9) brightness(.55);transform:scale(1.03)}
.intro-bg-overlay{position:absolute;inset:0;background:radial-gradient(circle at 50% 35%,rgba(110,55,0,.08),rgba(0,0,0,.45) 50%,rgba(0,0,0,.88) 100%),linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.72))}
.intro-particles{position:absolute;inset:0;opacity:.45;background-image:radial-gradient(circle,#ffba3a 0 1px,transparent 1.5px);background-size:90px 90px;animation:particles 18s linear infinite}
@keyframes particles{to{background-position:0 -180px}}
.intro-shell{position:relative;z-index:1;width:min(1500px,calc(100% - 32px));margin:0 auto;padding:20px 0 28px}
.intro-header{display:flex;align-items:center;gap:15px;min-height:70px;padding:8px 16px;border:1px solid rgba(215,169,0,.32);border-radius:14px;background:linear-gradient(90deg,rgba(7,7,7,.94),rgba(20,13,5,.78));box-shadow:0 8px 30px rgba(0,0,0,.4)}
.intro-logo{width:74px;height:54px;display:grid;place-items:center}
.intro-logo img{max-width:100%;max-height:100%;object-fit:contain}
.intro-brand{display:flex;flex-direction:column;line-height:1.05}
.intro-brand span{font-size:20px;font-weight:800}
.intro-brand strong{margin-top:5px;color:var(--gold-light);font-size:12px;letter-spacing:2px}
.intro-top-links{margin-left:auto;display:flex;gap:10px}
.intro-top-links a{padding:10px 16px;border:1px solid rgba(215,169,0,.45);border-radius:25px;background:rgba(25,18,7,.75);font-size:13px;font-weight:700;transition:.2s}
.intro-top-links a:hover{border-color:var(--gold-light);transform:translateY(-2px)}
.intro-hero{text-align:center;padding:45px 10px 30px}
.intro-kicker{margin:0 0 8px;color:var(--gold-light);font-size:14px;font-weight:800;letter-spacing:4px}
.intro-hero h1{margin:0;font-size:clamp(38px,5vw,72px);line-height:1;color:#fff;text-shadow:0 0 18px rgba(255,200,70,.28)}
.intro-subtitle{margin:14px 0 0;color:#d0d0d0;font-size:16px}
.server-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.server-card{position:relative;display:flex;flex-direction:column;min-width:0;padding:16px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(150deg,rgba(28,20,8,.95),rgba(8,8,8,.94) 60%);box-shadow:0 20px 45px rgba(0,0,0,.45);overflow:hidden;cursor:pointer;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.server-card:hover,.server-card:focus-visible{transform:translateY(-7px);border-color:var(--gold-light);box-shadow:0 24px 55px rgba(0,0,0,.6),0 0 28px rgba(215,169,0,.22);outline:none}
.server-card.featured{border-color:rgba(255,215,90,.9)}
.server-card.disabled{filter:saturate(.55);cursor:not-allowed}
.server-card.disabled:hover{transform:none}
.server-glow{position:absolute;width:220px;height:220px;right:-90px;top:-100px;border-radius:50%;background:radial-gradient(circle,rgba(255,190,40,.22),transparent 70%);pointer-events:none}
.server-ribbon{position:absolute;right:-38px;top:22px;width:145px;padding:6px 0;text-align:center;background:linear-gradient(135deg,#8b0000,#d38d1f);font-size:11px;font-weight:800;transform:rotate(38deg);box-shadow:0 3px 12px rgba(0,0,0,.45)}
.server-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.server-order{color:#cda837;font-size:11px;font-weight:800;letter-spacing:1.7px}
.server-head h2{margin:5px 0 0;font-size:27px;line-height:1.1;color:#fff2b8}
.server-status{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:20px;font-size:10px;font-weight:800;white-space:nowrap}
.server-status i{width:8px;height:8px;border-radius:50%}
.server-status.online{color:#b7ffd2;background:rgba(0,110,52,.22);border:1px solid rgba(40,210,105,.35)}
.server-status.online i{background:#40d96f;box-shadow:0 0 10px #40d96f}
.server-status.coming{color:#ffe0a3;background:rgba(120,75,0,.22);border:1px solid rgba(230,170,60,.35)}
.server-status.coming i{background:#dba13c}
.server-image{height:185px;overflow:hidden;border:1px solid rgba(215,169,0,.38);border-radius:12px;background:#16100a}
.server-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.server-card:hover .server-image img{transform:scale(1.05)}
.server-info{display:grid;gap:8px;margin-top:14px}
.server-info div{display:flex;justify-content:space-between;gap:16px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.07)}
.server-info span{color:#a9a9a9;font-size:12px}
.server-info b{color:#eee;font-size:12px;text-align:right}
.server-load{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin:16px 0}
.server-load span{color:#aaa;font-size:11px}
.server-load b{color:var(--gold-light);font-size:11px}
.server-load-track{height:8px;overflow:hidden;border-radius:10px;background:#242424}
.server-load-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7b1700,#e5ae31);box-shadow:0 0 10px rgba(229,174,49,.55)}
.server-enter{margin-top:auto;height:48px;border:1px solid #d9b23c;border-radius:9px;background:linear-gradient(135deg,#721000,#bd7618);color:#fff8cf;font-weight:800;letter-spacing:.7px;cursor:pointer;transition:.2s}
.server-enter:hover{filter:brightness(1.15)}
.server-enter:disabled{cursor:not-allowed;filter:grayscale(.45);opacity:.7}
.intro-news{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:18px;margin-top:18px;padding:14px 18px;border:1px solid rgba(215,169,0,.35);border-radius:12px;background:rgba(7,7,7,.82);overflow:hidden}
.intro-news-title{color:var(--gold-light);font-size:13px;font-weight:800;letter-spacing:1.5px}
.intro-news-marquee{display:flex;gap:36px;overflow:hidden;white-space:nowrap;color:#ddd;font-size:12px}
.intro-news-marquee span{animation:newsMove 18s linear infinite}
@keyframes newsMove{from{transform:translateX(0)}to{transform:translateX(-180px)}}
.intro-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 6px 0;color:#8e8e8e;font-size:12px}
.intro-footer nav{display:flex;gap:18px}
.intro-footer a:hover{color:var(--gold-light)}
.intro-transition{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#050505;color:#ffe38b;font-weight:800;letter-spacing:2px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease,visibility .35s ease}
.intro-transition.active{opacity:1;visibility:visible;pointer-events:auto}
.intro-transition span{animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.45}}
@media(max-width:1100px){.server-grid{grid-template-columns:1fr 1fr}.server-card:last-child{grid-column:1/-1;max-width:520px;width:100%;justify-self:center}}
@media(max-width:760px){.intro-shell{width:min(100% - 18px,1500px)}.intro-header{flex-wrap:wrap}.intro-top-links{width:100%;margin-left:0}.intro-top-links a{flex:1;text-align:center}.intro-hero{padding:32px 10px 24px}.server-grid{grid-template-columns:1fr}.server-card:last-child{grid-column:auto;max-width:none}.intro-news{grid-template-columns:1fr}.intro-footer{flex-direction:column;text-align:center}.server-image{height:165px}}

