:root{
  --bg:#060915;
  --bg-2:#0b1022;
  --bg-3:#131a32;
  --panel-1:rgba(44,57,94,.88);
  --panel-2:rgba(20,28,49,.92);
  --panel-3:rgba(12,18,32,.94);
  --panel-4:rgba(8,12,23,.96);
  --line:#02040a;
  --line-soft:#243559;
  --glass:#c8edff14;
  --text:#f4f9ff;
  --muted:#a6b8d6;
  --accent:#6fe8ff;
  --accent-2:#a0ffd8;
  --violet:#9f92ff;
  --gold:#ffd978;
  --warn:#ffc96d;
  --danger:#ff929f;
  --shadow:0 24px 46px rgba(0,0,0,.36);
  --glow:0 0 22px rgba(111,232,255,.22);
  --h:38px;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{
  margin:0;
  color:var(--text);
  font:14px/1.4 "Segoe UI",Inter,Roboto,"Trebuchet MS",Verdana,sans-serif;
  text-shadow:0 1px 0 rgba(0,0,0,.55);
  background:
    radial-gradient(circle at 14% 18%, rgba(123,224,255,.18) 0, transparent 20%),
    radial-gradient(circle at 84% 14%, rgba(144,119,255,.16) 0, transparent 18%),
    radial-gradient(circle at 60% 72%, rgba(84,255,196,.12) 0, transparent 18%),
    linear-gradient(180deg,#162547 0%, #0c1530 28%, #091123 60%, #060915 100%);
  overflow-x:hidden;
  position:relative;
}
body::before,body::after{content:"";position:fixed;inset:0;pointer-events:none}
body::before{
  opacity:.75;
  background:
    radial-gradient(circle at 15% 18%, #8fe8ff99 0 1.6px, transparent 2px),
    radial-gradient(circle at 28% 62%, #ffffffbb 0 1px, transparent 1.6px),
    radial-gradient(circle at 42% 26%, #c7e8ff99 0 1.2px, transparent 2px),
    radial-gradient(circle at 58% 74%, #ffffffcc 0 1px, transparent 1.8px),
    radial-gradient(circle at 68% 18%, #9ab3ff88 0 1.4px, transparent 2.2px),
    radial-gradient(circle at 79% 38%, #ffffffaa 0 1px, transparent 1.7px),
    radial-gradient(circle at 88% 14%, #a8d2ffaa 0 1.1px, transparent 2px),
    radial-gradient(circle at 12% 86%, #ffffff99 0 1px, transparent 1.7px),
    radial-gradient(circle at 76% 88%, #ffffff88 0 1px, transparent 1.7px);
  background-size:340px 220px,380px 240px,420px 260px,450px 280px,390px 230px,360px 250px,480px 290px,420px 230px,500px 300px;
  animation:starDrift 130s linear infinite;
}
body::after{
  opacity:.44;
  background:
    linear-gradient(180deg,rgba(255,255,255,.08) 0,transparent 25%),
    repeating-linear-gradient(180deg, transparent 0 3px, rgba(255,255,255,.015) 3px 4px),
    radial-gradient(circle at 50% 0%, rgba(112,236,255,.12), transparent 40%);
}
button,input{font:inherit}
.shell{width:min(calc(100% - 28px),1260px);margin:auto}
.app{min-height:100vh;display:grid;grid-template-rows:56px 28px 1fr 28px;gap:10px;position:relative;z-index:2}
.topbar,.statusbar,.panel-head,.plan-headline,.plan-actions{display:flex;align-items:center}
.topbar{
  border:1px solid rgba(136,181,255,.24);
  border-top:0;
  padding:0 12px;
  background:
    linear-gradient(180deg,rgba(115,234,255,.55) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(71,94,145,.72), rgba(29,39,67,.82) 52%, rgba(17,24,42,.9) 100%);
  box-shadow:inset 0 1px 0 rgba(220,244,255,.22), inset 0 -1px 0 rgba(0,0,0,.6), var(--shadow);
  backdrop-filter:blur(8px);
}
.brand{font:900 26px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.1em;text-decoration:none;color:#fff;margin-right:18px;filter:drop-shadow(0 0 8px rgba(111,232,255,.2))}
.brand span{color:var(--accent)}
.server-copy{
  height:36px;min-width:350px;display:flex;align-items:center;gap:10px;padding:0 12px;
  border:1px solid rgba(123,173,255,.32);
  background:
    linear-gradient(180deg,rgba(111,232,255,.42) 0 1px, transparent 1px 100%),
    linear-gradient(180deg,rgba(26,39,66,.96),rgba(12,19,35,.96));
  color:var(--text);cursor:pointer;text-align:left;box-shadow:inset 0 1px 0 rgba(204,244,255,.12), inset 0 -1px 0 rgba(0,0,0,.55), 0 0 0 1px rgba(9,15,26,.7), var(--glow);
  border-radius:10px;
}
.server-copy:hover{transform:translateY(-1px);filter:brightness(1.04)}
.server-copy .label,.copy-note,.tag,.metrics span,.access-form label>span,.subhead,.statusbar,.ticker-track{font:700 10px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em}
.copy-note,.server-copy .label{color:var(--muted)}
.server-copy strong{font:700 13px ui-monospace,SFMono-Regular,Consolas,monospace;flex:1;color:#fff}
.server-state{margin-left:auto;display:flex;align-items:center;gap:8px;color:var(--muted);font:700 11px ui-monospace,SFMono-Regular,Consolas,monospace}
.state-dot{width:10px;height:10px;border-radius:50%;background:var(--warn);box-shadow:0 0 0 2px rgba(0,0,0,.45),0 0 14px rgba(255,201,109,.56)}
.state-dot.ok{background:var(--accent);box-shadow:0 0 0 2px rgba(0,0,0,.45),0 0 14px rgba(111,232,255,.65)}
.state-dot.bad{background:var(--danger);box-shadow:0 0 0 2px rgba(0,0,0,.45),0 0 14px rgba(255,146,159,.66)}
.ticker-bar{
  border:1px solid rgba(123,173,255,.28);
  border-radius:10px;
  background:
    linear-gradient(180deg,rgba(111,232,255,.28) 0 1px,transparent 1px 100%),
    linear-gradient(180deg,rgba(26,38,61,.88),rgba(15,22,38,.92));
  overflow:hidden;position:relative;box-shadow:inset 0 1px 0 rgba(209,237,255,.1), var(--shadow);
  backdrop-filter:blur(8px);
}
.ticker-track{white-space:nowrap;display:inline-block;padding-left:100%;line-height:26px;color:#d7e8ff;animation:ticker 48s linear infinite}
.ticker-item{display:inline-block;margin-right:34px}.ticker-item b{color:var(--accent)}
.workspace{display:grid;grid-template-columns:1.08fr .98fr .92fr;grid-template-areas:"server access rules" "donate donate donate";gap:10px;align-self:start}
.server-panel{grid-area:server}.access-panel{grid-area:access}.rules-panel{grid-area:rules}.donate-panel{grid-area:donate}
.panel{
  min-width:0;overflow:hidden;border-radius:18px;
  border:1px solid rgba(130,164,244,.22);
  background:
    linear-gradient(180deg,rgba(111,232,255,.2) 0 1px,transparent 1px 100%),
    linear-gradient(180deg,var(--panel-1),var(--panel-2) 54%,var(--panel-3) 54%,var(--panel-4) 100%);
  box-shadow:inset 0 1px 0 rgba(227,243,255,.16), inset 0 -1px 0 rgba(0,0,0,.45), var(--shadow);
  backdrop-filter:blur(10px);
}
.panel-head{
  height:38px;justify-content:space-between;padding:0 12px;
  border-bottom:1px solid rgba(127,158,233,.18);
  background:
    linear-gradient(90deg, rgba(111,232,255,.55) 0 80px, transparent 80px 100%),
    linear-gradient(180deg, rgba(68,90,139,.9), rgba(29,41,67,.94));
  box-shadow:inset 0 1px 0 rgba(212,242,255,.18);
}
.panel-head h1,.panel-head h2{font:900 13px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.14em;margin:0;color:#fff}
.tag{padding:4px 8px;border:1px solid rgba(135,164,245,.22);border-radius:999px;background:linear-gradient(180deg,rgba(33,46,77,.9),rgba(17,24,40,.95));color:var(--muted);box-shadow:inset 0 1px 0 rgba(201,233,255,.08)}
.tag-warn{color:var(--gold)}
.metrics{display:grid;grid-template-columns:1.5fr .7fr .8fr}
.metrics>div{padding:13px 12px;border-right:1px solid rgba(123,170,255,.13);background:linear-gradient(180deg,rgba(111,232,255,.08),transparent 28%),linear-gradient(180deg,rgba(20,30,49,.7),rgba(11,17,29,.55))}
.metrics>div:last-child{border-right:0}
.metrics strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 14px ui-monospace,SFMono-Regular,Consolas,monospace;color:#fff}
.terminal-line{min-height:38px;display:flex;align-items:center;gap:8px;padding:7px 12px;border-top:1px solid rgba(123,170,255,.12);color:var(--muted);font:12px ui-monospace,SFMono-Regular,Consolas,monospace;background:linear-gradient(180deg,rgba(21,30,47,.86),rgba(11,15,27,.94))}.terminal-line>span:first-child{color:var(--accent)}
.access-form{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;padding:12px;background:linear-gradient(180deg,rgba(20,30,49,.66),rgba(10,16,27,.9))}
.access-form label{min-width:0}
.access-form input{width:100%;height:var(--h);border:1px solid rgba(117,163,245,.28);border-radius:12px;background:linear-gradient(180deg,rgba(12,18,31,.96),rgba(18,26,42,.94));color:var(--text);padding:0 12px;outline:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 0 0 1px rgba(0,0,0,.18)}
.access-form input:focus{border-color:rgba(111,232,255,.75);box-shadow:0 0 0 3px rgba(111,232,255,.12), inset 0 1px 0 rgba(255,255,255,.06)}
.button{height:var(--h);align-self:end;padding:0 16px;border:1px solid rgba(120,190,255,.38);border-radius:12px;background:linear-gradient(180deg,rgba(211,157,255,.55) 0 1px,transparent 1px 100%),linear-gradient(180deg,#3fd0ff,#2f8ff0 52%,#245ec2 100%);color:#f9fcff;font:900 11px ui-monospace,SFMono-Regular,Consolas,monospace;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.26), inset 0 -1px 0 rgba(11,35,73,.7), 0 8px 18px rgba(28,95,194,.22)}
.button:hover{transform:translateY(-1px);filter:brightness(1.05)}
.button:active{transform:translateY(1px)}
.button-muted{background:linear-gradient(180deg,rgba(168,184,224,.45) 0 1px,transparent 1px 100%),linear-gradient(180deg,#606d88,#4a556c 52%,#31394c 100%);box-shadow:inset 0 1px 0 rgba(238,243,255,.2), inset 0 -1px 0 rgba(21,26,34,.75), 0 8px 18px rgba(0,0,0,.16);color:#edf1f7}
.form-message{grid-column:1/-1;min-height:18px;margin:1px 0 0;color:var(--muted);font-size:11px}.form-message.error{color:var(--danger)}
.rules{list-style:none;margin:0;padding:0;background:linear-gradient(180deg,rgba(20,30,49,.54),rgba(10,16,27,.82))}
.rules li{display:grid;grid-template-columns:30px 1fr;gap:8px;padding:10px 12px;border-bottom:1px solid rgba(123,170,255,.12);background:linear-gradient(180deg,rgba(111,232,255,.04),transparent 55%)}
.rules li:last-child{border-bottom:0}.rules b{color:var(--accent);font:800 10px ui-monospace,SFMono-Regular,Consolas,monospace}.rules strong{display:block;font-size:12px;color:#fff}.rules small{display:block;color:var(--muted);font-size:10.5px;margin-top:2px}
.donate-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:10px;padding:12px;min-height:316px;background:linear-gradient(180deg,rgba(20,30,49,.56),rgba(10,16,27,.86))}
.donate-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-content:start}
.donate-card{display:grid;gap:5px;min-height:82px;padding:10px 11px;border:1px solid rgba(125,165,248,.18);border-radius:16px;background:linear-gradient(135deg,rgba(111,232,255,.12) 0 12%, transparent 12% 100%),linear-gradient(180deg,rgba(37,53,84,.95),rgba(19,28,47,.94) 54%,rgba(10,15,28,.96));text-align:left;cursor:pointer;box-shadow:inset 0 1px 0 rgba(237,248,255,.1),inset 0 -1px 0 rgba(0,0,0,.42),0 10px 18px rgba(0,0,0,.18)}
.donate-card:hover{transform:translateY(-1px);filter:brightness(1.05)}
.donate-card.active{border-color:rgba(111,232,255,.48);background:linear-gradient(135deg,rgba(255,217,120,.18) 0 12%, transparent 12% 100%),linear-gradient(180deg,rgba(54,82,116,.96),rgba(29,47,70,.95) 54%,rgba(14,25,39,.97));box-shadow:inset 0 1px 0 rgba(255,245,186,.18),inset 0 -1px 0 rgba(0,0,0,.45),0 0 0 1px rgba(111,232,255,.16),0 14px 28px rgba(50,104,174,.22)}
.donate-card .name{font:900 13px ui-monospace,SFMono-Regular,Consolas,monospace;color:#fff}.donate-card .tier{display:flex;justify-content:space-between;gap:8px;color:#d7e5fa;font:700 10px ui-monospace,SFMono-Regular,Consolas,monospace}.donate-card .line{font-size:11px;color:#dbe7f6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plan-view{display:grid;grid-template-rows:auto auto 1fr auto;gap:10px;padding:12px;border:1px solid rgba(123,171,255,.18);border-radius:18px;background:linear-gradient(180deg,rgba(111,232,255,.12) 0 1px,transparent 1px 100%),linear-gradient(180deg,rgba(24,37,63,.96),rgba(11,18,31,.96));box-shadow:inset 0 1px 0 rgba(204,236,255,.12),inset 0 -1px 0 rgba(0,0,0,.44)}
.plan-name{font:900 18px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.05em;color:var(--accent-2)}.plan-meta{color:var(--muted);font:700 11px ui-monospace,SFMono-Regular,Consolas,monospace}.plan-headline{justify-content:space-between;gap:10px}.plan-badges{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.plan-badge{padding:4px 8px;border:1px solid rgba(125,165,248,.18);border-radius:999px;background:linear-gradient(180deg,rgba(40,54,84,.96),rgba(18,25,40,.96));color:#dfeafb;font:700 10px ui-monospace,SFMono-Regular,Consolas,monospace;box-shadow:inset 0 1px 0 rgba(206,232,255,.06)}
.plan-note{margin:0;color:var(--muted);font-size:11px}
.plan-columns{display:grid;grid-template-columns:1fr 1fr;gap:10px}.plan-column{min-width:0}.subhead{color:var(--gold);margin-bottom:6px}
.plan-list{margin:0;padding:0;list-style:none;border:1px solid rgba(123,170,255,.16);border-radius:14px;background:linear-gradient(180deg,rgba(9,14,25,.84),rgba(16,24,39,.92));overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}.plan-list li{padding:7px 10px;border-bottom:1px solid rgba(124,170,255,.1);font-size:12px}.plan-list li:last-child{border-bottom:0}.plan-list li.empty{color:var(--muted)}
.plan-actions{gap:8px;flex-wrap:wrap}.inline-message{color:var(--muted);font-size:11px}
.statusbar{gap:16px;border:1px solid rgba(123,173,255,.22);border-radius:10px 10px 0 0;background:linear-gradient(180deg,rgba(111,232,255,.18) 0 1px,transparent 1px 100%),linear-gradient(180deg,rgba(31,41,65,.94),rgba(21,29,48,.98));color:var(--muted);padding:0 12px;box-shadow:inset 0 1px 0 rgba(151,214,255,.16)}.statusbar span+span{padding-left:16px;border-left:1px solid rgba(90,109,151,.4)}
.fx-layer{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:1}.fx-comet,.fx-meteor{position:absolute;width:180px;height:2px;background:linear-gradient(90deg,#fff,#86f0ff 35%, transparent 100%);transform:rotate(-28deg);opacity:.9;box-shadow:0 0 14px #8de7ff}.fx-comet::before,.fx-meteor::before{content:"";position:absolute;right:0;top:-3px;width:10px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 16px #fff}.fx-planet{position:absolute;border-radius:50%;box-shadow:inset -26px -20px 42px rgba(0,0,0,.38),0 0 50px rgba(114,223,255,.18)}.fx-ring{position:absolute;border:3px solid rgba(133,204,255,.6);border-radius:50%;transform:rotate(-18deg);box-shadow:0 0 20px rgba(133,204,255,.16)}.fx-explosion{position:absolute;border-radius:50%;background:radial-gradient(circle,#fff9b0 0 15%, #ffa25a 22%, #ff5a73 40%, transparent 68%);filter:blur(1px);animation:explPulse 3.2s ease-in-out infinite}.fx-station{position:absolute;width:220px;height:38px;border-radius:20px;background:linear-gradient(180deg,#97b9ff,#4b6194);box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 0 28px rgba(127,170,255,.26)}.fx-station::before,.fx-station::after{content:"";position:absolute;border-radius:10px;background:linear-gradient(180deg,#a9ddff,#5475aa)}.fx-station::before{left:-54px;top:10px;width:54px;height:18px}.fx-station::after{right:-54px;top:10px;width:54px;height:18px}.fx-solar{position:absolute;width:86px;height:18px;border-radius:6px;background:linear-gradient(180deg,#3e77aa,#16335c);border:1px solid rgba(0,0,0,.55)}.fx-satellite{position:absolute;width:20px;height:20px;border-radius:6px;background:linear-gradient(180deg,#bce2ff,#4e6fa3)}.fx-debris{position:absolute;width:8px;height:8px;border-radius:50%;background:#9fd4ff;box-shadow:0 0 10px #8fd7ff;animation:debrisDrift linear infinite}.fx-planet-a{width:160px;height:160px;left:10%;top:16%;background:radial-gradient(circle at 32% 30%,#c7f5ff 0 8%,#5ac0ff 15%,#2f63d0 52%,#18204f 100%);animation:floatA 26s ease-in-out infinite}.fx-planet-b{width:120px;height:120px;right:16%;top:13%;background:radial-gradient(circle at 35% 35%,#fff0c2 0 8%,#ffb85f 20%,#c95275 60%,#45184a 100%);animation:floatB 21s ease-in-out infinite}.fx-collision-a{width:128px;height:128px;left:16%;top:18%;background:radial-gradient(circle at 35% 35%,#9feeff 0 10%,#47c6ff 20%,#3854c9 60%,#181b4e 100%);animation:planetCrashA 18s ease-in-out infinite}.fx-collision-b{width:100px;height:100px;right:21%;top:26%;background:radial-gradient(circle at 38% 35%,#ffe6a7 0 10%,#ff924f 22%,#ca4462 65%,#45153d 100%);animation:planetCrashB 18s ease-in-out infinite}.fx-label{position:absolute;left:18px;bottom:62px;padding:6px 10px;border:1px solid rgba(123,171,255,.22);border-radius:999px;background:linear-gradient(180deg,rgba(31,44,71,.92),rgba(18,25,42,.95));color:#cbe4ff;font:700 10px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em;box-shadow:inset 0 1px 0 rgba(133,196,255,.12)}
@keyframes starDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-120px,40px,0)}}@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes cometFly{from{transform:translate3d(110vw,-18vh,0) rotate(-28deg);opacity:0}8%{opacity:1}84%{opacity:1}to{transform:translate3d(-35vw,55vh,0) rotate(-28deg);opacity:0}}
@keyframes meteorFly{from{transform:translate3d(110vw,-12vh,0) rotate(-32deg);opacity:0}10%{opacity:1}82%{opacity:1}to{transform:translate3d(-40vw,58vh,0) rotate(-32deg);opacity:0}}
@keyframes floatA{50%{transform:translateY(12px) translateX(8px)}}@keyframes floatB{50%{transform:translateY(-10px) translateX(-12px)}}@keyframes planetCrashA{0%,18%{transform:translate(0,0)}50%,60%{transform:translate(18vw,10vh)}100%{transform:translate(0,0)}}@keyframes planetCrashB{0%,18%{transform:translate(0,0)}50%,60%{transform:translate(-20vw,2vh)}100%{transform:translate(0,0)}}@keyframes explPulse{0%,18%,100%{transform:scale(.6);opacity:0}38%,60%{transform:scale(1.15);opacity:.95}80%{transform:scale(.8);opacity:.35}}@keyframes stationFly{from{transform:translateX(115vw)}to{transform:translateX(-160vw)}}@keyframes debrisDrift{from{transform:translate(0,0) scale(1);opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(.6);opacity:0}}
@media (prefers-reduced-motion: reduce){body::before,.ticker-track,.fx-comet,.fx-meteor,.fx-explosion,.fx-station,.fx-debris,.fx-planet-a,.fx-planet-b,.fx-collision-a,.fx-collision-b{animation:none!important}}
@media(max-width:1120px){.workspace{grid-template-columns:1fr 1fr;grid-template-areas:"server access" "rules rules" "donate donate"}.donate-layout{grid-template-columns:1fr}.plan-columns{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.shell{width:min(calc(100% - 14px),1260px)}.app{grid-template-rows:auto 28px 1fr 28px}.topbar{min-height:56px;gap:7px;flex-wrap:wrap;padding:8px 10px}.brand{margin-right:auto;font-size:24px}.server-copy{order:3;width:100%;min-width:0}.server-state{margin-left:0}.workspace{grid-template-columns:1fr;grid-template-areas:"server" "access" "rules" "donate"}.access-form{grid-template-columns:1fr}.form-message{grid-column:auto}.donate-grid{grid-template-columns:1fr 1fr}.plan-columns{grid-template-columns:1fr}.statusbar span:nth-child(2){display:none}.ticker-track{animation-duration:58s}.panel,.plan-view,.donate-card,.ticker-bar,.statusbar,.server-copy{border-radius:14px}}
