
:root{
  --bg:#f8f5fb;
  --bg-2:#ffffff;
  --surface:#ffffff;
  --surface-2:#f3ecf8;
  --surface-3:#eadcf3;
  --text:#211329;
  --muted:#766a7e;
  --purple:#9c34ff;
  --purple-2:#d44cff;
  --purple-3:#6b1cc7;
  --purple-soft:#b66af1;
  --lavender:#c9a8ff;
  --line:rgba(94,43,124,.14);
  --header:#6f1f9d;
  --header-2:#8c2bc0;
  --shadow:0 26px 80px rgba(70,26,96,.16);
  --radius:26px;
  --max:1280px;
}

body.dark{
  --bg:#130719;
  --bg-2:#1a0b22;
  --surface:#22102f;
  --surface-2:#2c143d;
  --surface-3:#36194a;
  --text:#f7efff;
  --muted:#bba9c9;
  --line:rgba(255,255,255,.10);
  --header:#4b1269;
  --header-2:#69208e;
  --shadow:0 30px 90px rgba(0,0,0,.42);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at 15% 0%,rgba(156,52,255,.12),transparent 24rem),
    radial-gradient(circle at 85% 8%,rgba(212,76,255,.09),transparent 24rem),
    linear-gradient(180deg,var(--bg),var(--bg-2));
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  overflow-x:hidden;
  cursor:none;
  transition:background .28s,color .28s;
}
a{text-decoration:none;color:inherit}
button,a{font:inherit;cursor:none}
img{display:block;max-width:100%}
.wrap{width:min(var(--max),calc(100% - 34px));margin-inline:auto}
.panel{
  background:linear-gradient(180deg,var(--surface),var(--surface-2));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.reveal{
  opacity:0;
  transform:translateY(34px) scale(.985);
  transition:opacity .65s ease,transform .65s cubic-bezier(.2,.8,.2,1);
}
.reveal.visible{opacity:1;transform:none}
@keyframes float{50%{transform:translateY(-13px) rotate(1deg)}}
@keyframes sweep{0%{transform:translateX(-150%) skewX(-18deg)}100%{transform:translateX(300%) skewX(-18deg)}}
@keyframes crystalFall{0%{transform:translate3d(0,-15vh,0) rotate(0deg);opacity:0}12%{opacity:.8}100%{transform:translate3d(var(--drift),115vh,0) rotate(520deg);opacity:0}}
@keyframes pulse{50%{box-shadow:0 0 0 10px rgba(164,68,255,0)}}
@keyframes modalIn{from{opacity:0;transform:translate(-50%,-44%) scale(.82)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes successBurst{0%{transform:scale(.2);opacity:0}55%{opacity:1}100%{transform:scale(1.8);opacity:0}}
@keyframes borderRun{to{transform:rotate(360deg)}}
@keyframes loaderPulse{50%{transform:scale(1.08);filter:drop-shadow(0 0 30px rgba(213,77,255,.95))}}
@keyframes pageFadeOut{to{opacity:0;filter:blur(5px)}}
@keyframes pageFadeIn{from{opacity:0;filter:blur(5px)}to{opacity:1;filter:none}}
@keyframes copiedFlash{0%,100%{opacity:0}35%,70%{opacity:1}}
@keyframes lightning{0%,100%{transform:translateX(-50%) scaleY(.7);opacity:.2}50%{transform:translateX(-50%) scaleY(1.25);opacity:1}}

/* Page transition: short only */
body.page-enter main,body.page-enter footer{animation:pageFadeIn .28s ease both}
body.page-exit main,body.page-exit footer{animation:pageFadeOut .22s ease both}

.page-loader{
  position:fixed;inset:0;z-index:2000;
  background:rgba(18,5,27,.90);
  backdrop-filter:blur(8px);
  display:grid;place-items:center;
  opacity:0;pointer-events:none;transition:opacity .16s ease;
}
.page-loader.show{opacity:1;pointer-events:auto}
.loader-content{text-align:center;color:#fff}
.loader-crystal{
  width:86px;margin:auto;
  filter:drop-shadow(0 0 24px rgba(197,66,255,.9));
  animation:loaderPulse .72s ease-in-out infinite;
}
.loader-content strong{font-size:20px;display:block;margin-top:12px}
.loader-content span{display:block;color:#d3c0dd;margin-top:4px}

/* Custom cursor */
.cursor{
  position:fixed;left:0;top:0;z-index:3000;pointer-events:none;
  width:29px;height:53px;transform:translate(-48%,-27%) rotate(-34deg);
  filter:
    drop-shadow(0 9px 9px rgba(0,0,0,.58))
    drop-shadow(0 0 9px rgba(255,255,255,.35))
    drop-shadow(0 0 17px rgba(197,63,255,.95));
}
.cursor img{width:100%;height:100%;object-fit:contain}
.cursor-ring{
  position:fixed;left:0;top:0;width:45px;height:45px;border-radius:50%;
  border:1px solid rgba(218,109,255,.55);z-index:2999;pointer-events:none;
  transform:translate(-50%,-50%);
  transition:width .15s,height .15s,border-color .15s,box-shadow .15s;
  box-shadow:0 0 24px rgba(151,43,255,.22),inset 0 0 14px rgba(194,77,255,.10);
}
.cursor-ring.active{
  width:61px;height:61px;border-color:#e26cff;
  box-shadow:0 0 34px rgba(190,68,255,.45),inset 0 0 18px rgba(219,97,255,.22);
}
.cursor-particle{
  position:fixed;z-index:2998;pointer-events:none;
  width:7px;height:12px;background:linear-gradient(#f2b2ff,#9b33ff);
  clip-path:polygon(50% 0,100% 33%,75% 100%,25% 100%,0 33%);
  filter:drop-shadow(0 0 9px #b449ff);
  animation:particleFade .72s linear forwards;
}
@keyframes particleFade{to{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(200deg) scale(.15)}}

/* Falling crystal background - only fragment + kristall */
.crystal-rain{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.crystal-rain img{
  position:absolute;top:-12vh;width:var(--size);opacity:0;
  animation:crystalFall var(--duration) linear infinite;
  animation-delay:var(--delay);
  filter:drop-shadow(0 0 8px rgba(172,52,255,.42));
}
main,footer,.topbar{position:relative;z-index:2}

/* Header */
.topbar{
  position:sticky;top:0;z-index:100;
  background:linear-gradient(90deg,var(--header),var(--header-2));
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow:0 12px 35px rgba(55,14,74,.22);
}
.nav{min-height:82px;display:flex;align-items:center;gap:19px}
.brand img{
  width:55px;height:64px;object-fit:contain;
  filter:drop-shadow(0 0 13px rgba(229,125,255,.82));
  transition:.25s;
}
.brand:hover img{transform:rotate(-5deg) scale(1.08)}
.links{display:flex;gap:7px;margin-left:12px}
.links a{
  color:#fff;font-weight:850;font-size:13px;text-transform:uppercase;
  padding:11px 15px;border-radius:12px;letter-spacing:.045em;transition:.2s;
}
.links a:hover,.links a.active{
  background:rgba(36,8,48,.27);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  transform:translateY(-2px);
}
.nav-actions{margin-left:auto;display:flex;align-items:center;gap:11px}

.animated-border{
  position:relative;isolation:isolate;overflow:hidden;
}
.animated-border:before{
  content:"";position:absolute;inset:-120%;
  background:conic-gradient(from 0deg,transparent 0 25%,rgba(255,255,255,.9),#e36cff,#8726db,transparent 65%);
  animation:borderRun 3.6s linear infinite;
  z-index:-2;
}
.animated-border:after{
  content:"";position:absolute;inset:2px;border-radius:inherit;
  background:linear-gradient(135deg,#52206b,#32113f);
  z-index:-1;
}

.discord-btn{
  min-height:50px;padding:0 17px;border-radius:15px;
  color:#fff;font-weight:900;display:flex;align-items:center;gap:10px;
  border:0;transition:.22s;
}
.discord-btn:before{
  background:conic-gradient(from 90deg,transparent,#ff8be7,#9d52ff,#fff,#ff8be7,transparent);
  animation-duration:2.7s;
}
.discord-btn:after{background:linear-gradient(135deg,#6f2a9a,#8d31c0)}
.discord-btn:hover{transform:translateY(-3px);box-shadow:0 15px 35px rgba(116,45,209,.42)}
.discord-mark{
  width:27px;height:21px;border-radius:9px;
  background:#fff;position:relative;
  box-shadow:0 0 10px rgba(255,255,255,.4);
}
.discord-mark:before,.discord-mark:after{
  content:"";position:absolute;top:8px;width:4px;height:4px;background:#8132b7;border-radius:50%;
}
.discord-mark:before{left:6px}.discord-mark:after{right:6px}
.discord-mark span{
  position:absolute;left:7px;right:7px;bottom:4px;height:4px;border-bottom:2px solid #8132b7;border-radius:50%;
}

.server-status{
  min-height:52px;display:flex;align-items:center;gap:0;
  border-radius:16px;padding:4px;color:#fff;
}
.server-status:after{background:linear-gradient(135deg,#4c1765,#33103f)}
.status-segment{
  display:flex;align-items:center;gap:9px;padding:5px 12px;
}
.status-segment + .status-segment{border-left:1px solid rgba(255,255,255,.12)}
.status-segment img{width:22px;height:22px;image-rendering:pixelated}
.status-segment small{
  display:block;color:#d9c7e2;font-size:9px;text-transform:uppercase;letter-spacing:.10em;line-height:1;
}
.status-segment strong{display:block;font-size:13px;margin-top:4px}
.status-led{width:11px;height:11px;border-radius:50%;background:#6b6370}
.status-led.online{
  background:#65ffae;box-shadow:0 0 13px rgba(101,255,174,.8);
  animation:pulse 1.8s infinite;
}
.status-led.offline{background:#ff597a;box-shadow:0 0 13px rgba(255,89,122,.65)}

.theme-toggle,.login-btn{
  height:46px;border-radius:14px;border:1px solid rgba(255,255,255,.14);
  background:rgba(37,8,48,.25);color:#fff;font-weight:900;padding:0 14px;
}
.theme-toggle{width:46px;padding:0}
.login-btn{display:flex;align-items:center;gap:8px}
.login-btn img{width:18px;image-rendering:pixelated}
.mobile-toggle{display:none;background:none;border:0;color:#fff;font-size:26px}

/* Game stage */
.game-stage-shell{
  padding:34px 0 62px;position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 14% 18%,rgba(174,60,255,.25),transparent 25rem),
    radial-gradient(circle at 87% 14%,rgba(218,76,255,.18),transparent 22rem),
    linear-gradient(135deg,#21042f,#591080 56%,#291046);
}
.game-stage{
  min-height:710px;border-radius:31px;overflow:hidden;position:relative;
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 42px 105px rgba(0,0,0,.48);
}
.slide{
  position:absolute;inset:0;opacity:0;pointer-events:none;
  transition:opacity .7s ease,transform .7s ease;
  transform:scale(1.025);display:grid;grid-template-columns:1fr 1fr;
}
.slide.active{opacity:1;pointer-events:auto;transform:scale(1)}
.slide-1{background:radial-gradient(circle at 76% 30%,#f077ff66,transparent 20rem),linear-gradient(135deg,#21092d,#7122a4 55%,#ef50c4)}
.slide-2{background:radial-gradient(circle at 73% 28%,#bd75ff66,transparent 20rem),linear-gradient(135deg,#160b29,#4d2394 55%,#8f3ee2)}
.slide-3{background:radial-gradient(circle at 75% 30%,#ff5aa766,transparent 20rem),linear-gradient(135deg,#24111d,#76204f 55%,#d94d9e)}
.slide-4{background:radial-gradient(circle at 76% 30%,#bd69ff66,transparent 20rem),linear-gradient(135deg,#21132e,#592b81 55%,#9c49d2)}
.slide-5{background:radial-gradient(circle at 74% 30%,#e5a6ff66,transparent 20rem),linear-gradient(135deg,#29112f,#6e247c 55%,#bc55d6)}
.slide-copy{
  padding:68px 58px;position:relative;z-index:3;align-self:center;
  background:rgba(24,10,34,.86);backdrop-filter:blur(13px);
  border-radius:23px;margin:48px 0 48px 48px;max-width:690px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 50px rgba(0,0,0,.25);
  color:#fff;
}
.slide h1{font-size:clamp(46px,6vw,80px);line-height:.93;margin:0 0 18px;letter-spacing:-.055em}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.tag{
  background:linear-gradient(135deg,#8b27d8,#c348ef);
  color:#fff;font-size:11px;font-weight:950;text-transform:uppercase;
  padding:7px 10px;border-radius:8px;
}
.slide-copy p{font-size:17px;color:#c9b9d2}.slide-copy strong{display:block;margin-bottom:14px}
.slide-art{position:relative;display:grid;place-items:center;z-index:2}
.slide-art img{
  width:min(440px,84%);object-fit:contain;
  filter:drop-shadow(0 30px 35px rgba(0,0,0,.38));
  animation:float 5s ease-in-out infinite;
}
.slide-crystal{position:absolute;width:650px!important;opacity:.18;right:-210px;bottom:-290px}
.stage-shimmer{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:8}
.stage-shimmer:after{
  content:"";position:absolute;top:-10%;left:0;width:20%;height:120%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.23),transparent);
  animation:sweep 5.6s infinite;
}
.slide-controls{
  position:absolute;left:50%;bottom:24px;transform:translateX(-50%);
  display:flex;gap:11px;z-index:10;
}
.dot{
  width:62px;height:62px;border:1px solid rgba(255,255,255,.17);
  border-radius:15px;padding:9px;background:rgba(18,5,28,.76);
  overflow:hidden;position:relative;
  transition:transform .24s ease,box-shadow .24s ease,background .24s ease;
}
.dot:hover{
  transform:translateY(-8px) scale(1.08);
  background:linear-gradient(135deg,#7926bf,#b444e5);
  box-shadow:0 18px 38px rgba(0,0,0,.42),0 0 24px rgba(179,58,255,.38);
}
.dot.active{
  background:linear-gradient(135deg,#8e2bdc,#bd43f0);
  transform:translateY(-6px);
  box-shadow:0 13px 27px rgba(132,35,203,.4);
}
.dot img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;transition:.25s}
.dot:hover img{transform:scale(1.14)}

/* Buttons */
.btn{
  border:0;border-radius:14px;padding:14px 20px;font-weight:900;
  transition:.2s;display:inline-flex;align-items:center;justify-content:center;gap:9px;
}
.btn:hover{transform:translateY(-3px) scale(1.02)}
.btn-primary{
  color:#fff;background:linear-gradient(135deg,#8425e5,#c143f2);
  box-shadow:0 14px 34px rgba(130,40,210,.31);
}
.btn img{width:18px;image-rendering:pixelated}

/* Main content becomes white/light, dark purple in dark mode */
.content-zone{
  background:var(--bg-2);
  transition:background .28s;
}
section.content{padding:80px 0}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:29px}
.section-head h2{font-size:clamp(33px,4vw,53px);line-height:1;margin:0;letter-spacing:-.045em}
.section-head p{color:var(--muted);max-width:610px;margin:0}
.kicker{color:#a932db;font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.14em;margin-bottom:10px}

.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.info-card{overflow:hidden;transition:.28s cubic-bezier(.2,.8,.2,1);position:relative}
.info-card:hover{
  transform:translateY(-10px) rotate(-.7deg);
  box-shadow:0 30px 75px rgba(71,21,94,.22),0 0 28px rgba(142,42,224,.14);
}
.info-art{height:250px;display:grid;place-items:center;position:relative;overflow:hidden}
.info-art:after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.18),transparent 70%);
  transform:translateX(-130%);transition:.55s ease;
}
.info-card:hover .info-art:after{transform:translateX(130%)}
.info-art img{
  width:120px;object-fit:contain;image-rendering:pixelated;
  filter:drop-shadow(0 20px 25px rgba(0,0,0,.26));transition:.3s;
}
.info-card:hover .info-art img{transform:scale(1.14) rotate(3deg)}
.ia1{background:linear-gradient(135deg,#8c29f0,#c54ef0)}
.ia2{background:linear-gradient(135deg,#321144,#7e30b8)}
.ia3{background:linear-gradient(135deg,#281139,#9c3edf)}
.info-body{padding:24px}.info-body h3{font-size:25px;margin:0 0 8px}.info-body p{color:var(--muted)}

.creator{
  margin-top:72px;padding:56px;border-radius:31px;color:#fff;
  display:grid;grid-template-columns:1fr .9fr;gap:34px;align-items:center;
  background:
    radial-gradient(circle at 83% 5%,rgba(207,81,255,.22),transparent 19rem),
    linear-gradient(135deg,#170721,#431060 45%,#60208d);
  box-shadow:0 30px 80px rgba(0,0,0,.3);
}
.creator-badge{
  display:inline-flex;align-items:center;gap:10px;
  padding:9px 13px;border-radius:999px;
  background:linear-gradient(135deg,#f196ff,#ba51ef);
  color:#24102f;font-weight:950;text-transform:uppercase;font-size:11px;
  box-shadow:0 10px 24px rgba(188,66,231,.24);
  margin-bottom:16px;
}
.creator-badge img{width:20px;image-rendering:pixelated}
.creator h3{font-size:46px;line-height:1.02;margin:0 0 13px;text-shadow:0 0 24px rgba(229,110,255,.28)}
.creator p{color:#d9c9e2;font-size:17px}
.creator-list{display:grid;gap:14px}
.creator-item{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);
  border-radius:16px;padding:15px 17px;display:flex;gap:13px;align-items:center;transition:.2s;
}
.creator-item:hover{transform:translateX(8px);background:rgba(255,255,255,.13)}
.creator-item img{width:29px;image-rendering:pixelated}
.creator-item strong{display:block;font-size:18px}.creator-item span{color:#d6c6df;font-size:13px}

.join{
  margin-top:74px;border-radius:31px;padding:56px;color:#fff;
  display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;
  background:
    radial-gradient(circle at 82% 5%,rgba(207,81,255,.18),transparent 17rem),
    linear-gradient(135deg,#170721,#400b5d 45%,#692096);
  box-shadow:0 30px 80px rgba(0,0,0,.3);
}
.join h3{font-size:42px;margin:0 0 10px}.join p{color:#d9cae2;margin:0}
.address{
  min-width:310px;background:#0b0710;border:1px solid rgba(255,255,255,.13);
  border-radius:16px;padding:18px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:18px;
}
.copy{
  border:0;background:linear-gradient(135deg,#8b2ce3,#c344ef);
  color:#fff;font-weight:900;border-radius:10px;padding:10px 14px;
}

/* Copy overlay enhanced */
.copy-overlay{
  position:fixed;inset:0;z-index:2500;
  background:rgba(8,2,14,.79);backdrop-filter:blur(12px);
  opacity:0;pointer-events:none;transition:.3s;
}
.copy-overlay.show{opacity:1;pointer-events:auto}
.copy-success{
  position:fixed;left:50%;top:50%;z-index:2501;
  width:min(580px,calc(100% - 30px));
  transform:translate(-50%,-50%);padding:48px;border-radius:30px;
  text-align:center;color:#fff;
  background:
    radial-gradient(circle at 50% 17%,rgba(214,95,255,.28),transparent 15rem),
    linear-gradient(145deg,#1a0825,#4e126a 53%,#7d2ca2);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 40px 120px rgba(0,0,0,.62),0 0 50px rgba(174,55,255,.22);
  display:none;overflow:hidden;
}
.copy-overlay.show .copy-success{display:block;animation:modalIn .45s cubic-bezier(.2,.9,.2,1)}
.copy-crystal{
  width:118px;margin:0 auto 18px;
  filter:drop-shadow(0 0 26px rgba(213,75,255,.95));
  animation:float 2s ease-in-out infinite;
}
.copy-success h2{font-size:38px;margin:0 0 8px}
.copy-success p{color:#e6d3ef;font-size:17px}
.copied-ip{
  font-size:23px;font-weight:950;color:#f3bcff;
  background:rgba(0,0,0,.24);padding:14px 18px;border-radius:14px;margin:20px 0;
  border:1px solid rgba(255,255,255,.11);
}
.burst{
  position:absolute;left:50%;top:31%;width:150px;height:150px;border-radius:50%;
  border:2px solid rgba(217,100,255,.72);transform:translate(-50%,-50%);
  animation:successBurst 1.15s ease-out infinite;
}
.copy-lightning{
  position:absolute;left:50%;top:0;width:4px;height:100%;
  background:linear-gradient(transparent,#f7c7ff,#a13cf0,transparent);
  box-shadow:0 0 18px #cf65ff;
  animation:lightning .7s ease-in-out infinite;
}
.copy-flash{
  position:absolute;inset:0;
  background:radial-gradient(circle,#e7a5ff55,transparent 60%);
  animation:copiedFlash 1.2s ease-in-out infinite;
}

/* Forms/Forum/Login/Legal */
.form-hero,.legal-hero{
  padding:72px 0 52px;color:#fff;
  background:
    radial-gradient(circle at 80% 10%,rgba(195,71,255,.24),transparent 22rem),
    linear-gradient(135deg,#170720,#4a0b68 50%,#70239e);
}
.form-hero h1,.legal-hero h1{font-size:clamp(48px,6vw,82px);line-height:.95;margin:0 0 18px}
.form-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px}
.requirements,.creator-form,.legal,.auth-card,.maintenance{padding:34px}
.creator-form{display:grid;gap:15px}
.creator-form label,.auth-card label{display:grid;gap:7px;font-weight:800}
.creator-form input,.creator-form textarea,.creator-form select,.auth-card input{
  width:100%;border:1px solid var(--line);border-radius:12px;
  padding:13px;background:var(--surface);color:var(--text);font:inherit;
}
.creator-form textarea{min-height:140px}
.legal h2{margin-top:34px}
.legal-warning{
  background:rgba(185,81,255,.1);border:1px solid rgba(196,86,255,.34);
  padding:15px;border-radius:13px;color:var(--text);
}
.auth-wrap{max-width:620px;margin:auto}
.auth-card{display:grid;gap:15px}
.auth-switch{display:flex;gap:10px;margin-bottom:10px}
.auth-switch button{flex:1}
.auth-message{min-height:24px;font-weight:800}
.auth-message.error{color:#d13d63}.auth-message.success{color:#32a86a}
.maintenance{text-align:center;max-width:760px;margin:auto}
.maintenance img{width:110px;margin:0 auto 20px;image-rendering:pixelated}
.maintenance h2{font-size:40px;margin:0 0 12px}

/* Footer */
footer{background:#0b050f;color:#fff;padding:49px 0 22px;margin-top:80px}
.footer-top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:38px;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.08)}
.footer-logo{width:88px;margin-bottom:14px;filter:drop-shadow(0 0 12px rgba(188,54,255,.45))}
footer p,footer a{color:#aa9eaf;font-size:14px}
footer h4{margin:0 0 14px}.footer-links{display:grid;gap:9px}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:22px;color:#817687;font-size:12px}

@media(max-width:1150px){
  .links{display:none}.mobile-toggle{display:block}
  .login-btn span{display:none}.theme-toggle{display:none}
  .slide{grid-template-columns:1fr}.slide-copy{margin:35px}
  .slide-art{position:absolute;right:0;bottom:0;width:45%;opacity:.55}
  .info-grid{grid-template-columns:1fr 1fr}
  .creator,.form-grid{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr 1fr}
}
@media(max-width:800px){
  .server-status{display:none}
  .discord-btn span{display:none}
  .brand img{width:48px}
  .game-stage{min-height:750px}
  .slide-copy{margin:22px;padding:38px 24px}.slide h1{font-size:48px}
  .slide-art{width:70%;opacity:.32}.dot{width:47px;height:47px}
  .section-head{align-items:start;flex-direction:column}
  .info-grid,.footer-top{grid-template-columns:1fr}
  .creator{padding:35px 24px}.creator h3{font-size:35px}
  .join{grid-template-columns:1fr;padding:35px 24px}.address{min-width:0}
  .footer-bottom{flex-direction:column}
}


/* =========================
   V7
   ========================= */

.discord-btn:after{background:linear-gradient(135deg,#4d1d67,#632284)}

.server-status.animated-border:before{
  inset:-80%;
  background:conic-gradient(from 0deg,transparent 0 40%,rgba(238,198,255,.38) 48%,rgba(177,90,226,.18) 53%,transparent 63%);
  animation-duration:7s;
}
.server-status.animated-border:after{
  inset:1px;
  background:linear-gradient(135deg,#511d69,#3a124b)
}

.theme-toggle,.login-btn,.user-menu-link{
  position:relative;overflow:hidden;
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease
}
.theme-toggle:before,.login-btn:before,.user-menu-link:before{
  content:"";position:absolute;inset:-2px;
  background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.23),transparent 70%);
  transform:translateX(-130%);transition:transform .5s ease
}
.theme-toggle:hover,.login-btn:hover,.user-menu-link:hover{
  transform:translateY(-3px) scale(1.04);
  background:rgba(45,11,61,.42);
  box-shadow:0 12px 28px rgba(55,12,82,.28),0 0 18px rgba(212,92,255,.22)
}
.theme-toggle:hover:before,.login-btn:hover:before,.user-menu-link:hover:before{transform:translateX(130%)}
.theme-toggle.theme-burst{animation:themeClick .42s ease}
@keyframes themeClick{45%{transform:scale(.82) rotate(-12deg)}75%{transform:scale(1.14) rotate(7deg)}}

.user-menu-link{
  height:46px;border-radius:14px;border:1px solid rgba(255,255,255,.14);
  background:rgba(37,8,48,.28);color:#fff;font-weight:900;
  padding:0 13px;display:flex;align-items:center;gap:9px
}
.user-menu-link img{width:21px;image-rendering:pixelated}

.crystal-rain{z-index:1}
.content-zone,footer{position:relative;z-index:2}
.crystal-rain img{mix-blend-mode:multiply}
body.dark .crystal-rain img{
  mix-blend-mode:screen;
  filter:drop-shadow(0 0 9px rgba(190,61,255,.62))
}

.feature-actions{padding:0 24px 24px}
.feature-more{width:100%}
.feature-extra{
  max-height:0;overflow:hidden;opacity:0;color:var(--muted);
  transition:max-height .42s ease,opacity .32s ease,margin .32s ease;margin-top:0
}
.info-card.expanded .feature-extra{max-height:340px;opacity:1;margin-top:16px}
.feature-extra ul{margin:0;padding-left:20px}.feature-extra li{margin:7px 0}

.game-particles{position:absolute;inset:0;z-index:7;pointer-events:none;overflow:hidden}
.game-particle{
  position:absolute;width:8px;height:13px;
  clip-path:polygon(50% 0,100% 34%,75% 100%,25% 100%,0 34%);
  background:linear-gradient(#f7c4ff,#a33aef);
  filter:drop-shadow(0 0 8px rgba(218,95,255,.8));
  opacity:.5;animation:gameSpark var(--time) ease-in-out infinite;
  animation-delay:var(--delay)
}
@keyframes gameSpark{
  0%,100%{transform:translateY(12px) rotate(0deg) scale(.65);opacity:.1}
  50%{transform:translateY(-32px) rotate(180deg) scale(1.15);opacity:.85}
}

.simple-modal{
  position:fixed;inset:0;z-index:2600;background:rgba(7,2,11,.72);
  backdrop-filter:blur(9px);display:grid;place-items:center;
  opacity:0;pointer-events:none;transition:.22s ease
}
.simple-modal.show{opacity:1;pointer-events:auto}
.simple-modal-card{
  width:min(520px,calc(100% - 28px));padding:34px;border-radius:25px;
  text-align:center;color:#fff;
  background:linear-gradient(145deg,#1b0827,#581374 60%,#762397);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 32px 100px rgba(0,0,0,.58);
  transform:scale(.9) translateY(18px);transition:.25s ease
}
.simple-modal.show .simple-modal-card{transform:none}
.simple-modal-card img{
  width:86px;margin:0 auto 16px;image-rendering:pixelated;
  filter:drop-shadow(0 0 18px rgba(211,82,255,.7))
}
.simple-modal-card h2{margin:0 0 10px;font-size:31px}
.simple-modal-card p{color:#e2d1ea}
.modal-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:22px}

.profile-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:25px}
.profile-card,.settings-card,.link-card{padding:32px}
.profile-avatar{
  width:110px;height:110px;border-radius:28px;display:grid;place-items:center;
  background:linear-gradient(135deg,#8726db,#d04ff0);margin-bottom:18px;
  box-shadow:0 18px 38px rgba(117,31,182,.25)
}
.profile-avatar img{width:58px;image-rendering:pixelated}
.profile-name{font-size:32px;margin:0 0 4px}.profile-email{color:var(--muted)}
.settings-card,.link-card{display:grid;gap:15px}
.settings-card label,.link-card label{display:grid;gap:7px;font-weight:850}
.settings-card input,.settings-card select,.link-card input{
  width:100%;padding:13px;border-radius:12px;border:1px solid var(--line);
  background:var(--surface);color:var(--text);font:inherit
}
.link-note{
  border-radius:14px;padding:14px;background:rgba(171,69,225,.1);
  border:1px solid rgba(171,69,225,.24);color:var(--muted)
}
.document-card{padding:36px}.document-card h2{margin-top:34px}.document-card h2:first-child{margin-top:0}
.document-card li{margin:9px 0}
@media(max-width:980px){.profile-grid{grid-template-columns:1fr}}


/* =========================
   V8
   ========================= */

/* Cursor ring removed */
.cursor-ring{display:none!important}

/* Crystal particles now render over content, never behind it */
.crystal-rain{
  position:fixed;
  inset:0;
  z-index:4;
  pointer-events:none;
  overflow:hidden;
}
.topbar{z-index:100}
main,footer{position:relative;z-index:5}
.crystal-rain img{
  opacity:0;
  mix-blend-mode:normal;
  filter:drop-shadow(0 0 7px rgba(153,44,214,.28));
}
body.dark .crystal-rain img{
  filter:drop-shadow(0 0 9px rgba(199,76,255,.48));
}

/* Main news/topic block */
.main-topic{
  display:grid;
  grid-template-columns:.88fr 1.12fr;
  gap:34px;
  align-items:center;
  padding:34px;
  overflow:hidden;
  position:relative;
}
.main-topic:before{
  content:"";
  position:absolute;
  width:240px;
  height:240px;
  border-radius:50%;
  right:-80px;
  top:-100px;
  background:radial-gradient(circle,rgba(190,63,255,.16),transparent 65%);
  animation:topicGlow 4.8s ease-in-out infinite;
}
@keyframes topicGlow{
  50%{transform:scale(1.18);opacity:.72}
}
.main-topic-art{
  min-height:330px;
  border-radius:22px;
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 42%,rgba(238,165,255,.28),transparent 13rem),
    linear-gradient(135deg,#5d1780,#a23dd0);
}
.main-topic-art:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.14),transparent 67%);
  animation:sweep 5s infinite;
}
.main-topic-art img{
  width:190px;
  image-rendering:pixelated;
  filter:drop-shadow(0 24px 30px rgba(0,0,0,.28));
  animation:float 4.8s ease-in-out infinite;
}
.main-topic-copy{
  position:relative;
  z-index:2;
}
.main-topic-copy h2{
  font-size:43px;
  line-height:1.04;
  margin:0 0 16px;
}
.main-topic-copy p{
  color:var(--muted);
  font-size:17px;
}

/* Partner badge on all pages */
.partner-badge{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:120;
  min-width:170px;
  padding:12px 15px;
  border-radius:15px;
  color:#fff;
  background:linear-gradient(135deg,#4f1769,#7b279d);
  border:1px solid rgba(255,255,255,.13);
  box-shadow:0 15px 40px rgba(31,6,46,.34);
  transition:.22s ease;
}
.partner-badge:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 48px rgba(70,16,99,.44),0 0 18px rgba(202,81,255,.24);
}
.partner-badge small{
  display:block;
  color:#d9c4e2;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.13em;
}
.partner-badge strong{
  display:block;
  margin-top:3px;
  font-size:15px;
}

/* Shop */
.shop-toolbar{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:30px;
}
.shop-category{
  border:1px solid var(--line);
  border-radius:999px;
  padding:11px 18px;
  background:var(--surface);
  color:var(--text);
  font-weight:900;
  transition:.2s ease;
}
.shop-category:hover,.shop-category.active{
  color:#fff;
  background:linear-gradient(135deg,#8425e5,#c143f2);
  transform:translateY(-3px);
  box-shadow:0 12px 27px rgba(120,35,185,.23);
}
.shop-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.shop-product{
  overflow:hidden;
  transition:.25s ease;
  position:relative;
}
.shop-product:hover{
  transform:translateY(-8px);
  box-shadow:0 30px 72px rgba(70,22,95,.22);
}
.shop-product-art{
  min-height:235px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#351248,#8b2bc2);
}
.shop-product-art img{
  width:115px;
  image-rendering:pixelated;
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.3));
}
.shop-product-body{padding:24px}
.shop-product-body h3{font-size:25px;margin:0 0 6px}
.product-price{
  font-size:24px;
  font-weight:950;
  color:#ad36dc;
  margin:12px 0;
}
.product-tag{
  position:absolute;
  right:14px;
  top:14px;
  z-index:2;
  border-radius:999px;
  padding:6px 9px;
  color:#fff;
  background:#a42ee0;
  font-size:10px;
  font-weight:950;
  text-transform:uppercase;
}
.shop-product[hidden]{display:none!important}

/* Cart */
.cart-button{
  position:fixed;
  right:20px;
  top:104px;
  z-index:130;
  min-width:170px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:15px;
  padding:12px 15px;
  color:#fff;
  background:linear-gradient(135deg,#45135f,#772295);
  box-shadow:0 14px 38px rgba(40,8,57,.34);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:13px;
}
.cart-count{
  width:27px;
  height:27px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:#c448eb;
  font-size:12px;
}
.cart-panel{
  position:fixed;
  right:20px;
  top:165px;
  z-index:140;
  width:min(390px,calc(100% - 30px));
  max-height:calc(100vh - 190px);
  overflow:auto;
  padding:22px;
  border-radius:23px;
  background:var(--surface);
  border:1px solid var(--line);
  box-shadow:0 28px 90px rgba(0,0,0,.35);
  opacity:0;
  pointer-events:none;
  transform:translateX(35px) scale(.96);
  transition:.24s ease;
}
.cart-panel.show{
  opacity:1;
  pointer-events:auto;
  transform:none;
}
.cart-panel h2{margin:0 0 17px}
.cart-item{
  padding:13px 0;
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
}
.cart-item-controls{
  display:flex;
  gap:7px;
  align-items:center;
  margin-top:7px;
}
.cart-small{
  border:1px solid var(--line);
  border-radius:8px;
  width:29px;
  height:29px;
  background:var(--surface-2);
  color:var(--text);
}
.cart-summary{
  margin-top:18px;
  font-weight:950;
  font-size:20px;
  display:flex;
  justify-content:space-between;
}

/* Product and checkout modal */
.shop-modal{
  position:fixed;
  inset:0;
  z-index:2700;
  display:grid;
  place-items:center;
  padding:15px;
  background:rgba(8,2,13,.76);
  backdrop-filter:blur(10px);
  opacity:0;
  pointer-events:none;
  transition:.22s ease;
}
.shop-modal.show{
  opacity:1;
  pointer-events:auto;
}
.shop-modal-card{
  width:min(720px,100%);
  max-height:92vh;
  overflow:auto;
  padding:34px;
  border-radius:27px;
  background:var(--surface);
  color:var(--text);
  border:1px solid var(--line);
  box-shadow:0 35px 110px rgba(0,0,0,.48);
  transform:translateY(20px) scale(.94);
  transition:.25s ease;
}
.shop-modal.show .shop-modal-card{transform:none}
.product-overview{
  display:grid;
  grid-template-columns:155px 1fr;
  gap:25px;
  align-items:center;
}
.product-overview img{
  width:135px;
  image-rendering:pixelated;
  filter:drop-shadow(0 17px 22px rgba(79,15,105,.22));
}
.product-benefits{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  padding:0;
  list-style:none;
}
.product-benefits li{
  padding:11px;
  border-radius:11px;
  background:var(--surface-2);
}
.modal-field{
  display:grid;
  gap:7px;
  margin:20px 0;
  font-weight:850;
}
.modal-field input{
  width:100%;
  padding:13px;
  border-radius:12px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  font:inherit;
}
.payment-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:11px;
  margin:22px 0;
}
.payment-option{
  padding:14px;
  border-radius:13px;
  text-align:center;
  font-weight:900;
  border:1px solid var(--line);
  background:var(--surface-2);
}
.shop-disclaimer{
  margin-top:42px;
  padding:20px;
  border-radius:17px;
  background:var(--surface-2);
  color:var(--muted);
  border:1px solid var(--line);
}

/* Remember me */
.remember-row{
  display:flex!important;
  align-items:center;
  gap:10px!important;
  font-weight:750!important;
}
.remember-row input{
  width:auto!important;
}

@media(max-width:980px){
  .main-topic{grid-template-columns:1fr}
  .shop-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .shop-grid{grid-template-columns:1fr}
  .product-overview{grid-template-columns:1fr}
  .product-benefits,.payment-grid{grid-template-columns:1fr}
  .cart-button{top:auto;bottom:90px}
  .cart-panel{top:auto;bottom:145px;max-height:65vh}
  .partner-badge{right:12px;bottom:12px}
}


/* =========================
   V1.3 MUSIC PLAYER
   ========================= */

.music-player{
  position:fixed;
  top:104px;
  right:205px;
  z-index:150;
  width:210px;
  padding:12px;
  border-radius:18px;
  color:#fff;
  background:linear-gradient(145deg,rgba(49,12,68,.96),rgba(98,25,127,.96));
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 52px rgba(24,4,35,.38);
  backdrop-filter:blur(12px);
  transition:.24s ease;
}

.music-player:hover{
  transform:translateY(-3px);
  box-shadow:0 24px 65px rgba(44,8,62,.48),0 0 20px rgba(204,76,255,.18);
}

.music-player.compact{
  width:64px;
  height:64px;
  padding:8px;
  overflow:hidden;
}

.music-player.compact .music-info,
.music-player.compact .music-controls,
.music-player.compact .music-volume{
  display:none;
}

.music-player-top{
  display:flex;
  align-items:center;
  gap:11px;
}

.turntable{
  position:relative;
  width:50px;
  height:50px;
  flex:0 0 50px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#210b2b,#4c145f);
  border:1px solid rgba(255,255,255,.12);
  cursor:pointer;
}

.record{
  width:38px;
  height:38px;
  border-radius:50%;
  position:relative;
  background:
    radial-gradient(circle at center,#ce56ff 0 9%,#1a111e 10% 19%,transparent 20%),
    repeating-radial-gradient(circle,#181018 0 2px,#2a1a2e 3px 4px);
  box-shadow:0 4px 10px rgba(0,0,0,.34);
}

.music-player.playing .record{
  animation:recordSpin 1.65s linear infinite;
}

@keyframes recordSpin{
  to{transform:rotate(360deg)}
}

.tonearm{
  position:absolute;
  width:24px;
  height:4px;
  right:1px;
  top:10px;
  border-radius:999px;
  background:#e0c7eb;
  transform-origin:right center;
  transform:rotate(-37deg);
  transition:.3s ease;
  box-shadow:0 1px 3px rgba(0,0,0,.35);
}

.music-player.playing .tonearm{
  transform:rotate(-18deg);
}

.music-info{
  min-width:0;
  flex:1;
}

.music-info small{
  display:block;
  color:#d7b8e3;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.12em;
}

.music-info strong{
  display:block;
  margin-top:3px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:13px;
}

.music-controls{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
}

.music-btn{
  border:0;
  border-radius:10px;
  min-width:37px;
  height:34px;
  padding:0 10px;
  display:grid;
  place-items:center;
  color:#fff;
  background:rgba(255,255,255,.11);
  font-weight:950;
  transition:.18s ease;
}

.music-btn:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.2);
}

.music-btn.primary{
  flex:1;
  background:linear-gradient(135deg,#9e2be0,#cc52f2);
}

.music-volume{
  width:100%;
  margin-top:10px;
  accent-color:#ce55f4;
}

.music-error{
  margin-top:8px;
  color:#ffd3ff;
  font-size:10px;
  line-height:1.35;
}

@media(max-width:1100px){
  .music-player{
    right:18px;
    top:170px;
  }
}

@media(max-width:680px){
  .music-player{
    top:auto;
    right:12px;
    bottom:165px;
    width:190px;
  }
}


/* RELEASE 1.5 */
.brand img{
  animation:brandFloat 4s ease-in-out infinite;
  transform-origin:50% 70%;
}
@keyframes brandFloat{
  0%,100%{transform:translateY(0) rotate(-2deg)}
  25%{transform:translateY(-5px) rotate(3deg)}
  50%{transform:translateY(-8px) rotate(-1deg)}
  75%{transform:translateY(-3px) rotate(-4deg)}
}

.slide:after,.main-topic-art:after,.shop-product-art:after{
  background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.18) 45%,transparent 70%);
  width:180%;
  left:-190%;
  animation:fullSweep 5.8s ease-in-out infinite;
}
@keyframes fullSweep{
  0%,18%{transform:translateX(0)}
  70%,100%{transform:translateX(175%)}
}

.team-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.team-card{
  text-align:center;
  padding:30px 22px;
  position:relative;
  overflow:hidden;
  transition:.25s ease;
}
.team-card:hover{transform:translateY(-8px)}
.team-card.admin{
  border:1px solid rgba(207,75,255,.55);
  box-shadow:0 22px 60px rgba(151,40,194,.22),inset 0 0 35px rgba(195,63,255,.07);
}
.team-card.admin:before{
  content:"ADMIN";
  position:absolute;
  right:-35px;
  top:18px;
  width:130px;
  padding:7px;
  transform:rotate(38deg);
  background:linear-gradient(135deg,#8b25d7,#da51f7);
  color:#fff;
  font-size:10px;
  font-weight:950;
  letter-spacing:.12em;
}
.team-avatar{
  width:92px;
  height:92px;
  margin:0 auto 16px;
  border-radius:24px;
  display:grid;
  place-items:center;
  background:var(--surface-2);
}
.team-avatar img{width:62px;image-rendering:pixelated}
.team-rank{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin:8px 0 14px;
  padding:7px 11px;
  border-radius:999px;
  background:var(--surface-2);
  font-size:11px;
  font-weight:900;
}
.team-rank img{width:20px;height:20px;object-fit:contain}

.creator-benefit-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.creator-benefit{
  padding:23px;
  border-radius:20px;
  background:linear-gradient(145deg,var(--surface),var(--surface-2));
  border:1px solid var(--line);
  transition:.22s ease;
}
.creator-benefit:hover{transform:translateY(-6px);box-shadow:0 20px 50px rgba(102,27,137,.17)}
.creator-benefit img{width:48px;height:48px;object-fit:contain;image-rendering:pixelated}
.creator-benefit h3{margin:13px 0 7px}

.profile-tabs{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:22px;
}
.profile-tab{
  border:1px solid var(--line);
  border-radius:999px;
  padding:10px 17px;
  background:var(--surface);
  color:var(--text);
  font-weight:900;
}
.profile-tab.active{background:linear-gradient(135deg,#8425e5,#c143f2);color:#fff}
.profile-image-editor{
  display:flex;
  align-items:center;
  gap:18px;
  padding:20px;
  margin-bottom:22px;
}
.profile-image-editor img{
  width:92px;height:92px;border-radius:24px;object-fit:cover;
  border:2px solid rgba(190,61,239,.35);
}
.admin-header{
  display:flex;align-items:center;gap:10px;margin-bottom:20px;
}
.admin-gear{font-size:25px;animation:gearTurn 8s linear infinite}
@keyframes gearTurn{to{transform:rotate(360deg)}}
.admin-request,.account-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:16px;
  align-items:center;
  padding:15px 0;
  border-bottom:1px solid var(--line);
}
.admin-request small,.account-row small{display:block;color:var(--muted);margin-top:4px}
.admin-actions{display:flex;gap:8px}
.account-row{grid-template-columns:52px 1fr auto}
.account-row img{width:44px;height:44px;border-radius:13px;object-fit:cover}
.account-state{display:flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:11px;color:var(--muted)}
.admin-mini{font-size:8px;padding:4px 6px;border-radius:6px;color:#fff;background:#a52de1}
.empty-state{padding:24px;text-align:center;color:var(--muted)}
.lock-note{font-size:12px;color:#b13ade;margin-top:-8px}
.creator-notice{padding:17px;border-radius:15px;background:rgba(174,49,221,.1);border:1px solid rgba(174,49,221,.25)}

@media(max-width:900px){
  .team-grid,.creator-benefit-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .team-grid,.creator-benefit-grid{grid-template-columns:1fr}
  .admin-request,.account-row{grid-template-columns:1fr}
  .account-state{align-items:flex-start}
}


/* RELEASE 1.6 */
.team-sections{
  display:grid;
  gap:60px;
}
.team-category{
  display:grid;
  gap:22px;
}
.team-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}
.team-grid-admin{
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:920px;
  margin:0 auto;
  width:100%;
}
.team-card{
  min-height:330px;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.team-card p{
  flex:1;
}
.team-vacancy{
  border:1px dashed rgba(180,61,224,.45);
  background:
    radial-gradient(circle at 50% 20%,rgba(193,65,239,.12),transparent 45%),
    var(--surface);
}
.vacancy-mark{
  font-size:48px;
  font-weight:950;
  color:#b53ce2;
}
.creator-wide-notice{
  margin-bottom:28px;
  border-radius:999px;
  text-align:center;
  box-shadow:0 14px 34px rgba(113,28,149,.12);
}
.creator-layout{
  display:grid;
  grid-template-columns:.92fr 1.08fr;
  gap:30px;
  align-items:start;
}
.creator-benefit-column{
  grid-template-columns:1fr;
}
.creator-benefit-column .creator-benefit{
  display:grid;
  grid-template-columns:56px 1fr;
  gap:15px;
  align-items:center;
}
.creator-benefit-column .creator-benefit h3{
  margin:0 0 5px;
}
.creator-benefit-column .creator-benefit p{
  margin:0;
}
.info-card{
  transition:max-height .36s ease,transform .25s ease,box-shadow .25s ease;
}
.info-card.expanded{
  transform:translateY(-3px);
}
#profileLoading{
  min-height:180px;
  display:grid;
  place-items:center;
  text-align:center;
}

@media(max-width:900px){
  .team-grid,.team-grid-admin{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .creator-layout{
    grid-template-columns:1fr;
  }
}
@media(max-width:620px){
  .team-grid,.team-grid-admin{
    grid-template-columns:1fr;
  }
}


/* RELEASE 1.7 */


.creator-layout-final{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:34px;
  align-items:start;
}
.creator-wide-notice{
  margin-bottom:30px;
  padding:16px 24px;
  border-radius:999px;
  text-align:center;
  background:linear-gradient(135deg,rgba(133,33,180,.15),rgba(209,71,244,.12));
  border:1px solid rgba(180,62,226,.28);
}
.creator-form{
  padding:26px;
}
.creator-form textarea{
  width:100%;
  resize:vertical;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  border-radius:12px;
  padding:13px;
  font:inherit;
}
.creator-showcase{
  margin-top:58px;
}
.creator-showcase-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  max-width:880px;
  margin:0 auto;
}
.creator-showcase-card{
  padding:25px;
  text-align:center;
}
.creator-showcase-card img{
  width:105px;
  height:105px;
  border-radius:24px;
  object-fit:cover;
  margin-bottom:13px;
  border:2px solid rgba(181,63,227,.25);
}

.team-sections-final{
  display:grid;
  gap:58px;
}
.team-category-final{
  display:grid;
  gap:20px;
}
.team-members-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}
.team-admin-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.team-member-card{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:22px;
  align-items:center;
  min-height:250px;
  padding:24px;
}
.team-member-left{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}
.team-player-image,.team-question-image{
  width:120px;
  height:120px;
  border-radius:24px;
  object-fit:cover;
  background:var(--surface-2);
  border:2px solid rgba(182,61,227,.22);
}
.team-question-image{
  display:grid;
  place-items:center;
  font-size:58px;
  font-weight:950;
  color:#bb42e5;
}
.team-player-name{
  font-size:18px;
  text-align:center;
}
.team-member-right{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
}
.team-rank-image{
  max-width:135px;
  max-height:44px;
  object-fit:contain;
  align-self:center;
}
.team-member-right p{
  margin:0;
  color:var(--muted);
}
.admin-highlight{
  border:1px solid rgba(210,74,255,.5);
  box-shadow:0 22px 60px rgba(150,42,193,.18);
}
.team-open-card{
  border-style:dashed;
}

@media(max-width:1050px){
  .team-members-grid,.team-admin-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:850px){
  .creator-layout-final{
    grid-template-columns:1fr;
  }
}
@media(max-width:700px){
  .creator-showcase-grid,
  .team-members-grid,
  .team-admin-grid{
    grid-template-columns:1fr;
  }
  .team-member-card{
    grid-template-columns:1fr;
    text-align:center;
  }
  .team-member-right{
    align-items:center;
  }
}


/* RELEASE 1.7.1 — verbindliches Team-Raster */
.team-members-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:24px !important;
  width:100% !important;
}

.team-admin-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:28px !important;
  width:100% !important;
}

.team-member-card{
  width:auto !important;
  min-width:0 !important;
  margin:0 !important;
}

@media (min-width:1051px){
  .team-admin-grid > .team-member-card{
    grid-column:auto !important;
  }

  .team-members-grid:not(.team-admin-grid) > .team-member-card{
    grid-column:auto !important;
  }
}

@media (min-width:701px) and (max-width:1050px){
  .team-members-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .team-admin-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:700px){
  .team-members-grid,
  .team-admin-grid{
    grid-template-columns:1fr !important;
  }
}


/* RELEASE 1.8 */
.music-player{
  position:fixed !important;
  top:92px !important;
  right:18px !important;
  bottom:auto !important;
  width:210px !important;
  height:auto !important;
  z-index:9999 !important;
  overflow:visible !important;
}
.music-player.compact{
  width:210px !important;
  height:auto !important;
  padding:12px !important;
  overflow:visible !important;
}
.music-player.compact .music-info,
.music-player.compact .music-controls,
.music-player.compact .music-volume{
  display:flex !important;
}
.music-player.compact .music-info{display:block !important;}

.info-grid .info-card{
  background:var(--surface) !important;
  color:var(--text) !important;
}
.info-grid .info-card .info-body p,
.info-grid .info-card .feature-more{
  color:var(--muted) !important;
}
.info-grid .info-card:nth-child(1) .info-art,
.info-grid .info-card .ia1{
  background:
    radial-gradient(circle at 50% 32%,rgba(255,255,255,.26),transparent 31%),
    linear-gradient(135deg,#7b22e8,#d24fe9) !important;
}
.info-grid .info-card:nth-child(2) .info-art,
.info-grid .info-card .ia2{
  background:
    radial-gradient(circle at 50% 32%,rgba(255,255,255,.22),transparent 31%),
    linear-gradient(135deg,#0e659c,#39b6cc) !important;
}
.info-grid .info-card:nth-child(3) .info-art,
.info-grid .info-card .ia3{
  background:
    radial-gradient(circle at 50% 32%,rgba(255,255,255,.22),transparent 31%),
    linear-gradient(135deg,#d04b37,#f2a63f) !important;
}

.creator-layout-final{align-items:stretch !important;}
.creator-left{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-top:58px;
  padding-bottom:28px;
}
.creator-right{
  display:flex;
  flex-direction:column;
}
.creator-right .creator-form{flex:1;}
.creator-showcase-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.creator-showcase-card img{
  display:block;
  margin-left:auto !important;
  margin-right:auto !important;
}
.creator-link-button{
  margin-top:auto;
  min-width:150px;
}

[data-account-link] img{
  width:22px;
  height:22px;
  border-radius:7px;
  object-fit:cover;
}

@media(max-width:1100px){
  .music-player{
    top:92px !important;
    right:12px !important;
    bottom:auto !important;
  }
}
@media(max-width:680px){
  .music-player{
    top:82px !important;
    right:8px !important;
    bottom:auto !important;
    width:190px !important;
  }
  .creator-left{padding-top:0;}
}


/* RELEASE 1.9 */

/* Cursor muss über der Jukebox und allen Modals bleiben */
.cursor{
  z-index:2147483647 !important;
  pointer-events:none !important;
}
.cursor-particle{
  z-index:2147483646 !important;
  pointer-events:none !important;
}

/* Team-Rangbilder etwa 2,5-fach größer */
.team-rank-image{
  width:auto !important;
  max-width:337px !important;
  max-height:110px !important;
  min-height:72px;
  object-fit:contain !important;
}
.team-member-right{
  min-width:0;
}

/* Profilrang */
.profile-rank-display{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:12px;
  padding:9px 15px;
  border-radius:999px;
  background:rgba(154,45,210,.12);
  border:1px solid rgba(181,61,227,.25);
}
.profile-rank-display img{
  width:auto;
  max-width:125px;
  max-height:38px;
  object-fit:contain;
}

/* Admin-Accountverwaltung */
#accountOverview{
  display:grid;
  gap:18px;
}
.account-admin-card{
  padding:20px;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--surface-2);
}
.account-admin-head{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:18px;
}
.account-admin-head img{
  width:52px;
  height:52px;
  border-radius:15px;
  object-fit:cover;
}
.account-admin-head small{
  display:block;
  margin-top:4px;
  color:var(--muted);
}
.account-admin-fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:13px;
}
.account-admin-fields label{
  display:grid;
  gap:7px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}
.account-admin-fields input,
.account-admin-fields select{
  width:100%;
  border:1px solid var(--line);
  border-radius:12px;
  padding:11px 12px;
  color:var(--text);
  background:var(--surface);
  font:inherit;
}
.account-lock-field{
  display:flex !important;
  flex-direction:row;
  align-items:center;
}
.account-lock-field input{
  width:auto;
}
.account-admin-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:17px;
}
.btn-danger{
  background:#bd2f4e;
  color:#fff;
}
.protected-account{
  padding:8px 12px;
  border-radius:999px;
  color:#d34ee9;
  background:rgba(181,61,227,.1);
  font-size:11px;
  font-weight:900;
}

@media(max-width:720px){
  .account-admin-fields{
    grid-template-columns:1fr;
  }
  .team-rank-image{
    max-width:260px !important;
    max-height:95px !important;
  }
}


/* RELEASE 1.9.1 — Rang-Tags ohne Bilder */
.profile-rank-display{
  display:flex;
  justify-content:center;
  margin-top:14px;
  padding:0;
  border:0;
  background:none;
}

.rank-tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:6px 12px;
  border-radius:9px;
  border:1px solid transparent;
  font-size:11px;
  font-weight:950;
  line-height:1;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}

/* Standardspieler */
.rank-user{
  color:#d8dbe2;
  background:linear-gradient(135deg,rgba(100,108,122,.28),rgba(63,68,80,.42));
  border-color:rgba(164,171,184,.28);
}

/* Kaufbare Ränge */
.rank-premium{
  color:#ffe07a;
  background:linear-gradient(135deg,rgba(190,132,15,.28),rgba(115,73,4,.45));
  border-color:rgba(255,202,63,.42);
}
.rank-premiumplus{
  color:#fff0a3;
  background:linear-gradient(135deg,rgba(222,163,18,.34),rgba(148,84,3,.48));
  border-color:rgba(255,219,95,.52);
}

/* Creator */
.rank-creator{
  color:#ff9dea;
  background:linear-gradient(135deg,rgba(205,46,180,.3),rgba(115,22,112,.48));
  border-color:rgba(245,91,217,.46);
}

/* Teamränge */
.rank-supporter{
  color:#7fe5ff;
  background:linear-gradient(135deg,rgba(22,145,185,.28),rgba(8,76,110,.48));
  border-color:rgba(69,201,239,.45);
}
.rank-supporterplus{
  color:#8cfff0;
  background:linear-gradient(135deg,rgba(17,174,157,.3),rgba(5,92,87,.48));
  border-color:rgba(69,235,216,.48);
}
.rank-builder{
  color:#ffb26f;
  background:linear-gradient(135deg,rgba(200,92,28,.3),rgba(111,50,10,.5));
  border-color:rgba(244,143,69,.46);
}
.rank-moderator{
  color:#87ff9c;
  background:linear-gradient(135deg,rgba(36,166,78,.3),rgba(12,91,47,.5));
  border-color:rgba(83,230,126,.46);
}
.rank-developer{
  color:#7fb3ff;
  background:linear-gradient(135deg,rgba(51,102,211,.32),rgba(26,55,132,.5));
  border-color:rgba(100,150,255,.48);
}
.rank-admin{
  color:#f4a2ff;
  background:linear-gradient(135deg,rgba(166,43,210,.38),rgba(92,22,139,.55));
  border-color:rgba(218,93,255,.58);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 0 18px rgba(180,54,228,.18);
}

.account-rank-line{
  display:flex;
  align-items:center;
  gap:9px;
  flex-wrap:wrap;
  margin-top:6px;
}
.account-rank-line small{
  margin:0 !important;
}

/* Alte Bilddarstellung vollständig deaktivieren */
.profile-rank-display img,
.profile-rank-display #profileRankImage{
  display:none !important;
}


/* RELEASE 2.0 */

/* Der Hauptrang oben im Profil ist doppelt so groß */
.profile-main-rank{
  min-height:56px !important;
  padding:12px 24px !important;
  border-radius:14px !important;
  font-size:22px !important;
  letter-spacing:.07em !important;
}
.profile-rank-display{
  justify-content:center !important;
}

/* Profil-Ladebereich zuverlässig sichtbar/ausblendbar */
#profileLoading[hidden],
#profileContent[hidden]{
  display:none !important;
}

/* Lokale Creatorbilder mit 512×512 sauber als Icons */
.creator-showcase-card img{
  width:128px !important;
  height:128px !important;
  aspect-ratio:1/1;
  object-fit:cover !important;
  object-position:center !important;
  border-radius:24px !important;
}

/* Team-Ränge als Tags, links über dem Beschreibungstext */
.team-member-right{
  align-items:flex-start !important;
}
.team-rank-tag{
  align-self:flex-start !important;
  justify-self:start !important;
  margin:0 0 4px 0 !important;
  min-height:34px;
  padding:8px 15px;
  font-size:13px;
}
.team-rank-image{
  display:none !important;
}

@media(max-width:700px){
  .team-member-right{
    align-items:center !important;
  }
  .team-rank-tag{
    align-self:center !important;
  }
}


/* RELEASE 2.1 — exakte Rangfarben */
.rank-user{
  color:#ffffff !important;
  background:#a4a4a4 !important;
  border-color:#c7c7c7 !important;
}

.rank-premium,
.rank-premiumplus{
  color:#ffffff !important;
  background:#b0954a !important;
  border-color:#d2bb77 !important;
}

.rank-creator{
  color:#ffffff !important;
  background:#970ae5 !important;
  border-color:#bd54f5 !important;
}

.rank-developer{
  color:#ffffff !important;
  background:#0491ff !important;
  border-color:#59b7ff !important;
}

.rank-moderator,
.rank-moderatorplus{
  color:#ffffff !important;
  background:#db7b0b !important;
  border-color:#f4a447 !important;
}

.rank-admin{
  color:#ffffff !important;
  background:#674b79 !important;
  border-color:#9272a7 !important;
}

.rank-builder,
.rank-builderplus{
  color:#242000 !important;
  background:#decd12 !important;
  border-color:#f5e95f !important;
}

.rank-supporter,
.rank-supporterplus{
  color:#ffffff !important;
  background:#31bd20 !important;
  border-color:#67db59 !important;
}


/* RELEASE 2.3 */

/* Account-Onlinezustand */
.account-presence{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 9px;
  border-radius:999px;
  font-size:10px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.account-presence:before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
}
.account-presence.online{
  color:#8dff81;
  background:rgba(49,189,32,.14);
  border:1px solid rgba(49,189,32,.34);
}
.account-presence.online:before{
  background:#31bd20;
  box-shadow:0 0 10px rgba(49,189,32,.85);
}
.account-presence.offline{
  color:#c6c6c6;
  background:rgba(164,164,164,.12);
  border:1px solid rgba(164,164,164,.25);
}
.account-presence.offline:before{background:#858585}
.account-name-status{
  display:flex;
  align-items:center;
  gap:9px;
  flex-wrap:wrap;
}
.profile-meta-row{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin-top:13px;
  color:var(--muted);
  font-size:12px;
}

/* Echte 1920x1080-Spielmodus-Hintergründe */
.slide.game-background{
  background:
    linear-gradient(90deg,rgba(17,5,25,.78) 0%,rgba(27,8,39,.55) 45%,rgba(27,8,39,.18) 100%),
    var(--game-bg),
    linear-gradient(135deg,#21092d,#7122a4 55%,#ef50c4) !important;
  background-size:cover !important;
  background-position:center !important;
}
.slide.game-background:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at 78% 34%,rgba(201,89,255,.24),transparent 28rem),
    linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.35));
  pointer-events:none;
}
.slide-copy,.slide-art{position:relative;z-index:3}

/* Weißer Schein über die gesamte Spielebox mit Fade-out */
.stage-shimmer{
  inset:0 !important;
  z-index:9 !important;
}
.stage-shimmer:after{
  top:-25% !important;
  left:-55% !important;
  width:34% !important;
  height:150% !important;
  transform:skewX(-18deg);
  background:linear-gradient(
    90deg,
    rgba(255,255,255,0),
    rgba(255,255,255,.08) 20%,
    rgba(255,255,255,.34) 50%,
    rgba(255,255,255,.08) 80%,
    rgba(255,255,255,0)
  ) !important;
  filter:blur(3px);
  opacity:0;
  animation:gameFullShine 6.2s ease-in-out infinite !important;
}
@keyframes gameFullShine{
  0%,12%{transform:translateX(0) skewX(-18deg);opacity:0}
  20%{opacity:1}
  72%{opacity:.9}
  88%,100%{transform:translateX(460%) skewX(-18deg);opacity:0}
}

/* Forum */
.modal-open{overflow:hidden}
.forum-actions-bar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:25px;
}
.forum-actions-bar #forumSessionHint{
  margin-left:auto;
  color:var(--muted);
  font-size:12px;
}
.forum-layout{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:26px;
  align-items:start;
}
.forum-column{
  min-width:0;
}
.forum-column-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin-bottom:17px;
}
.forum-column-head h2{margin:3px 0 0}
.forum-post-list{
  display:grid;
  gap:18px;
}
.forum-post-card{
  overflow:hidden;
  cursor:pointer;
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}
.forum-post-card:hover{
  transform:translateY(-6px);
  border-color:rgba(175,58,229,.4);
  box-shadow:0 23px 58px rgba(83,19,113,.18);
}
.forum-card-image{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  display:block;
}
.forum-card-placeholder{
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#34104b,#8531a9);
}
.forum-card-placeholder img{
  width:74px;
  height:74px;
  object-fit:contain;
}
.forum-card-content{
  padding:20px;
}
.forum-card-content h3{
  margin:15px 0 8px;
  font-size:22px;
}
.forum-card-content>p{
  margin:0 0 14px;
  color:var(--muted);
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.forum-card-content>small{color:var(--muted)}
.forum-card-author{
  display:flex;
  align-items:center;
  gap:11px;
}
.forum-card-author>img{
  width:42px;
  height:42px;
  border-radius:12px;
  object-fit:cover;
}
.forum-card-author>div{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.forum-card-admin{
  display:flex;
  gap:8px;
  margin-top:13px;
}
.forum-card-admin button{
  border:1px solid var(--line);
  background:var(--surface-2);
  color:var(--text);
  border-radius:9px;
  padding:7px 10px;
  font-weight:850;
}
.forum-empty{
  padding:30px;
  text-align:center;
  color:var(--muted);
}
.forum-overlay,.forum-composer-overlay{
  position:fixed;
  inset:0;
  z-index:12000;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(12,4,18,.74);
  backdrop-filter:blur(10px);
  opacity:0;
  visibility:hidden;
  transition:opacity .24s ease,visibility .24s ease;
}
.forum-overlay.show,.forum-composer-overlay.show{
  opacity:1;
  visibility:visible;
}
.forum-detail-card{
  width:min(940px,94vw);
  max-height:88vh;
  overflow:auto;
  border-radius:27px;
  background:var(--surface);
  border:1px solid var(--line);
  box-shadow:0 40px 120px rgba(0,0,0,.5);
  transform:scale(.9) translateY(25px);
  transition:transform .3s cubic-bezier(.2,.8,.2,1);
}
.forum-overlay.show .forum-detail-card{
  transform:scale(1) translateY(0);
}
.forum-detail-image{
  width:100%;
  max-height:520px;
  object-fit:cover;
}
.forum-detail-content{
  padding:30px;
}
.forum-detail-content h2{
  font-size:clamp(30px,5vw,52px);
  margin:22px 0 14px;
}
.forum-detail-content>p{
  line-height:1.75;
  color:var(--muted);
}
.forum-composer{
  width:min(700px,95vw);
  max-height:90vh;
  overflow:auto;
  padding:28px;
  transform:scale(.92) translateY(20px);
  transition:transform .27s ease;
}
.forum-composer-overlay.show .forum-composer{
  transform:scale(1) translateY(0);
}
.forum-composer-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  margin-bottom:20px;
}
.forum-close{
  border:0;
  background:var(--surface-2);
  color:var(--text);
  width:40px;
  height:40px;
  border-radius:12px;
  font-size:25px;
}
.forum-composer label{
  display:grid;
  gap:8px;
  margin-bottom:15px;
  color:var(--muted);
  font-size:12px;
  font-weight:850;
}
.forum-composer input,.forum-composer textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:12px;
  padding:13px;
  color:var(--text);
  background:var(--surface-2);
  font:inherit;
}
.forum-moderation{
  margin-top:32px;
  padding:25px;
}
.forum-moderation-item{
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  padding:17px 0;
  border-bottom:1px solid var(--line);
}
.forum-moderation-item small{
  display:block;
  color:var(--muted);
  margin-top:4px;
}
.forum-moderation-item p{
  color:var(--muted);
  margin-bottom:0;
}

@media(max-width:850px){
  .forum-layout{grid-template-columns:1fr}
  .forum-actions-bar #forumSessionHint{width:100%;margin-left:0}
}
@media(max-width:620px){
  .forum-moderation-item{grid-template-columns:1fr}
}


/* RELEASE 2.4 */

/* Hauptposts etwas größer und dezent hervorgehoben */
.forum-main-column .forum-post-card{
  transform:scale(1.018);
  transform-origin:center top;
  border-color:rgba(151,10,229,.28);
  animation:mainPostPulse 4.8s ease-in-out infinite;
}
.forum-main-column .forum-post-card:hover{
  transform:scale(1.018) translateY(-6px);
}
.forum-main-column .forum-card-content{
  padding:23px;
}
.forum-main-column .forum-card-content h3{
  font-size:24px;
}
@keyframes mainPostPulse{
  0%,100%{
    box-shadow:0 14px 38px rgba(103,75,121,.08);
    border-color:rgba(151,10,229,.22);
  }
  50%{
    box-shadow:0 18px 48px rgba(151,10,229,.16);
    border-color:rgba(151,10,229,.42);
  }
}

/* Forum-Seiten */
.forum-pagination{
  display:flex;
  justify-content:center;
  gap:8px;
  padding:9px 0 2px;
}
.forum-pagination button{
  width:36px;
  height:36px;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--surface-2);
  color:var(--text);
  font-weight:900;
  cursor:pointer;
  transition:.2s ease;
}
.forum-pagination button:hover,
.forum-pagination button.active{
  border-color:#970ae5;
  background:rgba(151,10,229,.16);
  color:#d98aff;
  transform:translateY(-2px);
}

/* Benachrichtigungs-Dropdown */
.notification-wrap{
  position:relative;
  display:none;
}
body:has([data-account-link] span:last-child:not(:empty)) .notification-wrap{
  display:block;
}
.notification-button{
  position:relative;
  width:42px;
  height:42px;
  border-radius:13px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  cursor:pointer;
  font-size:21px;
  font-weight:900;
}
.notification-button:hover{
  border-color:rgba(151,10,229,.48);
  transform:translateY(-2px);
}
.notification-bell{
  display:block;
  transform:rotate(45deg);
}
.notification-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#970ae5;
  color:#fff;
  border:2px solid var(--surface);
  font-size:10px;
  font-weight:950;
}
.notification-menu{
  position:absolute;
  top:52px;
  right:0;
  z-index:11000;
  width:min(390px,88vw);
  max-height:520px;
  overflow:hidden;
  padding:0;
  box-shadow:0 28px 85px rgba(0,0,0,.36);
}
.notification-head{
  padding:17px 18px;
  border-bottom:1px solid var(--line);
}
.notification-head small{
  display:block;
  margin-top:3px;
  color:var(--muted);
}
.notification-list{
  max-height:430px;
  overflow:auto;
}
.notification-item{
  display:grid;
  grid-template-columns:10px 1fr;
  gap:11px;
  padding:15px 17px;
  border-bottom:1px solid var(--line);
  color:var(--text);
  text-decoration:none;
  transition:.18s ease;
}
.notification-item:hover{
  background:rgba(151,10,229,.08);
}
.notification-item>span:last-child{
  display:grid;
  gap:4px;
}
.notification-item small,
.notification-item time{
  color:var(--muted);
  font-size:11px;
}
.notification-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  margin-top:5px;
  background:#6f6676;
}
.notification-item.unread .notification-dot{
  background:#970ae5;
  box-shadow:0 0 12px rgba(151,10,229,.75);
}
.notification-item.unread strong{
  color:#d88cff;
}
.notification-empty{
  padding:28px 18px;
  text-align:center;
  color:var(--muted);
}

@media(max-width:900px){
  .notification-menu{
    position:fixed;
    top:80px;
    right:12px;
  }
}

.notification-wrap.visible{display:block !important}
