/*!
 * GameServer-Install – Layout für Ilch 2.2
 * Magenta/Violett-Neon auf Nachtblau, Chakra Petch + Inter + JetBrains Mono
 * © 2026 gameserver-install.de · by Rumpel
 */

/* ============================================================ Grundlagen */
:root {
    --gsi-a: #ff2bd6;
    --gsi-b: #8b5cf6;
    --gsi-c: #22d3ee;
    --gsi-ar: 255, 43, 214;
    --gsi-br: 139, 92, 246;
    --gsi-cr: 34, 211, 238;
    --gsi-bg: #0c0818;
    --gsi-text: #ece8f5;
    --gsi-soft: #d4cbe6;
    --gsi-muted: #b3aac9;
    --gsi-line: rgba(196, 155, 255, .2);
    --gsi-surface: rgba(255, 255, 255, .045);
    --gsi-surface2: rgba(255, 255, 255, .08);
    --gsi-ok: #3ee68a;
    --gsi-font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
    --gsi-font-head: "Chakra Petch", "Inter", system-ui, sans-serif;
    --gsi-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --bs-body-bg: #0c0818;
    --bs-body-color: #ece8f5;
    --bs-border-color: rgba(196, 155, 255, .2);
    --bs-secondary-color: #b3aac9;
    --bs-tertiary-bg: rgba(255, 255, 255, .05);
    --bs-link-color: #ff9cf0;
    --bs-link-hover-color: #fff;
    --bs-link-color-rgb: 255, 156, 240;
    --bs-link-hover-color-rgb: 255, 255, 255;
    --bs-primary: var(--gsi-a);
    --bs-primary-rgb: var(--gsi-ar);
    --bs-emphasis-color: #fff;
    --bs-heading-color: #fff;
}
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body.gsi-body {
    margin: 0;
    min-height: 100vh;
    font-family: var(--gsi-font);
    font-size: 16px;
    line-height: 1.6;
    color: var(--gsi-text);
    background: var(--gsi-bg);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}
.gsi-body ::selection { background: rgba(var(--gsi-ar), .4); color: #fff; }
.gsi-body a { color: #ff9cf0; text-decoration: none; transition: color .2s; }
.gsi-body a:hover { color: #fff; }
.gsi-body :focus-visible { outline: 2px solid var(--gsi-a); outline-offset: 3px; border-radius: 4px; }
.gsi-body h1, .gsi-body h2, .gsi-body h3, .gsi-body h4, .gsi-body h5 { font-family: var(--gsi-font-head); color: #fff; letter-spacing: .01em; }
.gsi-mono { font-family: var(--gsi-mono); }
.gsi-muted { color: var(--gsi-muted); }
.gsi-skip { position: absolute; left: 12px; top: -60px; z-index: 2000; padding: 10px 16px; border-radius: 10px; background: var(--gsi-a); color: #fff !important; font-weight: 700; }
.gsi-skip:focus { top: 12px; }
.gsi-body .container-xl { max-width: 1280px; padding-left: 24px; padding-right: 24px; }
@media (max-width: 575.98px) { .gsi-body .container-xl { padding-left: 16px; padding-right: 16px; } }

/* Text-Effekte */
.gsi-chrome { background: linear-gradient(100deg, #9a9fb5 0%, #f2f3f9 30%, #fff 44%, #ff9cf0 50%, #fff 56%, #e1e3ee 70%, #9a9fb5 100%); background-size: 250% 100%; background-position: 100% 0; -webkit-background-clip: text; background-clip: text; color: transparent; }
.gsi-anim .gsi-chrome { animation: gsiShine 6s ease-in-out infinite; }
@keyframes gsiShine { 0% { background-position: 100% 0; } 60%, 100% { background-position: -60% 0; } }
.gsi-neon { background: linear-gradient(90deg, #ff5fe4, #c084fc, var(--gsi-c), #ff5fe4); background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 14px rgba(var(--gsi-ar), .55)); }
.gsi-anim .gsi-neon { animation: gsiHue 6s linear infinite; }
@keyframes gsiHue { to { background-position: 300% 0; } }
.gsi-outline { color: transparent; -webkit-text-stroke: 1.5px rgba(233, 200, 255, .85); }

/* ============================================================ Hintergrund */
.gsi-bg { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; background:
    radial-gradient(900px 600px at 85% 6%, rgba(var(--gsi-ar), .2), transparent 70%),
    radial-gradient(800px 700px at 5% 30%, rgba(var(--gsi-br), .22), transparent 70%),
    radial-gradient(900px 700px at 92% 70%, rgba(120, 60, 255, .14), transparent 70%),
    radial-gradient(800px 600px at 10% 95%, rgba(var(--gsi-ar), .12), transparent 70%),
    var(--gsi-page-image, none) center / cover no-repeat,
    linear-gradient(180deg, #0c0818 0%, #100a22 45%, #0d0819 75%, #0a0614 100%); }
.gsi-bg__dots { position: absolute; inset: 0; background-image: radial-gradient(rgba(214, 180, 255, .14) 1px, transparent 1.3px); background-size: 26px 26px; mask-image: radial-gradient(ellipse at 50% 40%, #000, rgba(0, 0, 0, .25) 75%); -webkit-mask-image: radial-gradient(ellipse at 50% 40%, #000, rgba(0, 0, 0, .25) 75%); }
.gsi-bg__aurora { position: absolute; inset: -30%; background: conic-gradient(from 0deg at 50% 50%, transparent 0 20%, rgba(var(--gsi-ar), .07) 30%, transparent 40% 70%, rgba(var(--gsi-br), .08) 80%, transparent 90%); mix-blend-mode: screen; }
.gsi-anim .gsi-bg__aurora { animation: gsiSpin 50s linear infinite; }
.gsi-fl { position: absolute; display: block; opacity: .9; filter: drop-shadow(0 0 10px currentColor); }
.gsi-fl svg { width: 100%; height: auto; stroke-width: 1.4; }
.gsi-fl--0 { color: rgba(var(--gsi-ar), .28); }
.gsi-fl--1 { color: rgba(var(--gsi-br), .36); }
.gsi-fl--2 { color: rgba(var(--gsi-cr), .24); }
.gsi-anim .gsi-fl { animation: gsiDrift 26s ease-in-out infinite; }
@keyframes gsiDrift { 0%, 100% { transform: translate(0, 0) rotate(0); } 33% { transform: translate(36px, -46px) rotate(14deg); } 66% { transform: translate(-26px, 30px) rotate(-12deg); } }
@keyframes gsiSpin { to { transform: rotate(360deg); } }
.gsi-cursor { position: fixed; left: 0; top: 0; z-index: 1; width: 400px; height: 400px; border-radius: 50%; pointer-events: none; background: radial-gradient(closest-side, rgba(var(--gsi-ar), .13), rgba(var(--gsi-br), .06) 55%, transparent); opacity: 0; transition: opacity .4s; mix-blend-mode: screen; }
.gsi-cursor.is-on { opacity: 1; }

/* ============================================================ Preloader */
.gsi-pre { position: fixed; inset: 0; z-index: 3000; display: grid; place-items: center; background: radial-gradient(60% 60% at 50% 40%, rgba(var(--gsi-br), .25), transparent 70%), #0a0614; transition: opacity .6s ease, visibility .6s; }
.gsi-pre.is-hidden { opacity: 0; visibility: hidden; }
.gsi-pre__inner { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 24px; text-align: center; }
.gsi-pre__logo { position: relative; width: 150px; height: 150px; display: grid; place-items: center; }
.gsi-pre__logo img { width: 92px; height: auto; filter: drop-shadow(0 0 18px rgba(var(--gsi-ar), .8)); animation: gsiGlow 2s ease-in-out infinite; }
.gsi-pre__ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.gsi-pre__ring circle { fill: none; stroke: rgba(196, 155, 255, .15); stroke-width: 3; }
.gsi-pre__ring .gsi-pre__arc { stroke: var(--gsi-a); stroke-linecap: round; filter: drop-shadow(0 0 6px var(--gsi-a)); transition: stroke-dashoffset .1s linear; }
.gsi-pre__name { font: 700 22px var(--gsi-font-head); letter-spacing: .14em; background: linear-gradient(180deg, #fff, #9a9fb5); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gsi-pre__term { font: 500 13px var(--gsi-mono); color: #cfc6e3; min-height: 20px; }
.gsi-pre__prompt { color: #ff9cf0; }
.gsi-pre__bar { width: min(320px, 80vw); height: 4px; border-radius: 4px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.gsi-pre__bar span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--gsi-a), var(--gsi-b), var(--gsi-c)); box-shadow: 0 0 12px var(--gsi-a); }
.gsi-pre__pct { font: 700 13px var(--gsi-mono); color: var(--gsi-muted); }
.gsi-pre__skip { margin-top: 6px; background: none; border: 0; color: var(--gsi-muted); font-size: 13px; text-decoration: underline; cursor: pointer; }
.gsi-caret { display: inline-block; width: 7px; height: 13px; margin-left: 3px; background: var(--gsi-a); vertical-align: -2px; animation: gsiBlink 1s steps(1) infinite; }
@keyframes gsiBlink { 50% { opacity: 0; } }
@keyframes gsiGlow { 50% { filter: drop-shadow(0 0 22px rgba(var(--gsi-ar), .95)) drop-shadow(0 0 34px rgba(var(--gsi-br), .5)); } }

/* ============================================================ Lämpchen, Punkte, Knöpfe */
.gsi-lamp { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; background: var(--gsi-ok); box-shadow: 0 0 8px var(--gsi-ok), 0 0 18px rgba(62, 230, 138, .8); animation: gsiLamp 1.2s ease-in-out infinite; }
.gsi-lamp--sm { width: 8px; height: 8px; }
.gsi-lamp--xs { width: 7px; height: 7px; }
.gsi-lamp--off { background: #f43f5e; box-shadow: 0 0 8px #f43f5e; animation: none; }
@keyframes gsiLamp { 50% { opacity: .3; box-shadow: 0 0 2px var(--gsi-ok); } }
.gsi-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gsi-ok); box-shadow: 0 0 0 0 rgba(62, 230, 138, .6); animation: gsiPing 1.8s infinite; flex-shrink: 0; }
@keyframes gsiPing { 70% { box-shadow: 0 0 0 8px rgba(62, 230, 138, 0); } }
.gsi-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px; padding: 0 22px; border-radius: 12px; border: 1px solid transparent; font: 700 15px var(--gsi-font); letter-spacing: .02em; cursor: pointer; white-space: nowrap; transition: transform .2s, box-shadow .2s, border-color .2s, background-color .2s; text-decoration: none; }
.gsi-btn:hover { transform: translateY(-2px); }
.gsi-btn--sm { min-height: 36px; padding: 0 14px; font-size: 13px; border-radius: 10px; }
.gsi-btn--lg { min-height: 52px; padding: 0 26px; font-size: 16px; }
.gsi-btn--primary { color: #fff !important; background: linear-gradient(90deg, var(--gsi-a), var(--gsi-b)); box-shadow: 0 10px 30px -10px rgba(var(--gsi-ar), .8); position: relative; overflow: hidden; }
.gsi-btn--primary::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .35), transparent); transform: skewX(-18deg); transition: left .6s; }
.gsi-btn--primary:hover::after { left: 130%; }
.gsi-btn--primary:hover { box-shadow: 0 14px 36px -8px rgba(var(--gsi-ar), 1); }
.gsi-btn--ghost { color: #f1e6ff !important; background: rgba(255, 255, 255, .04); border-color: rgba(196, 155, 255, .45); }
.gsi-btn--ghost:hover { border-color: var(--gsi-a); background: rgba(var(--gsi-ar), .1); }
.gsi-btn--discord { color: #fff !important; background: #5865f2; box-shadow: 0 10px 30px -10px rgba(88, 101, 242, .9); }
.gsi-tag { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; padding: 5px 12px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #ffb3f2; background: rgba(var(--gsi-ar), .14); border: 1px solid rgba(var(--gsi-ar), .38); white-space: nowrap; }
.gsi-tag--sm { padding: 3px 9px; font-size: 11px; }
.gsi-ico { flex: 0 0 auto; width: 50px; height: 50px; display: grid; place-items: center; border-radius: 15px; color: #fff; background: linear-gradient(135deg, rgba(var(--gsi-ar), .3), rgba(var(--gsi-br), .3)); border: 1px solid rgba(var(--gsi-ar), .4); }
.gsi-ico--sm { width: 40px; height: 40px; border-radius: 12px; }
.gsi-ico--xs { width: 34px; height: 34px; border-radius: 10px; }

/* Hilfe-Center-Knopf mit umlaufendem Neon-Rand */
@property --gsi-ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.gsi-help { position: relative; display: inline-flex; align-items: center; gap: 12px; padding: 8px 18px 8px 9px; border-radius: 15px; color: #fff !important; isolation: isolate; transition: transform .2s; flex-shrink: 0; }
.gsi-help::before { content: ""; position: absolute; inset: -2px; z-index: -2; border-radius: 17px; background: conic-gradient(from var(--gsi-ang), var(--gsi-a), var(--gsi-b), var(--gsi-c), var(--gsi-a)); }
.gsi-anim .gsi-help::before { animation: gsiBorder 4s linear infinite; }
.gsi-help::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 15px; background: #140b26; }
.gsi-help:hover { transform: translateY(-2px); }
.gsi-help:hover::before { filter: blur(2px) brightness(1.3); }
.gsi-help__ico { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: linear-gradient(135deg, var(--gsi-a), var(--gsi-b)); box-shadow: 0 0 18px -4px var(--gsi-a); }
.gsi-help:hover .gsi-help__ico svg { animation: gsiShake .6s both; }
.gsi-help__text { display: flex; flex-direction: column; line-height: 1.2; }
.gsi-help__text b { font-size: 15px; }
.gsi-help__text small { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #c9bde3; }
@keyframes gsiBorder { to { --gsi-ang: 360deg; } }

/* ============================================================ Kopfzeile & Login */
.gsi-topbar { position: relative; z-index: 1030; border-bottom: 1px solid rgba(196, 155, 255, .14); background: rgba(9, 6, 18, .78); backdrop-filter: blur(8px); font-size: 13px; color: #c3bad8; }
.gsi-topbar__inner { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 6px 18px; min-height: 48px; padding-top: 6px; padding-bottom: 6px; }
.gsi-topbar__info { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; }
.gsi-topbar__item { display: inline-flex; align-items: center; gap: 7px; color: #c3bad8 !important; }
a.gsi-topbar__item:hover { color: #fff !important; }
.gsi-topbar__item.gsi-mono { color: #ff9cf0 !important; font-size: 12px; }
.gsi-topbar__user { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.gsi-me { display: inline-flex; align-items: center; gap: 9px; padding: 4px 12px 4px 4px; border-radius: 999px; border: 1px solid rgba(196, 155, 255, .35); background: rgba(255, 255, 255, .04); color: #fff; font: 600 13px var(--gsi-font); cursor: pointer; }
.gsi-me:hover { border-color: var(--gsi-a); }
.gsi-me__av { width: 28px; height: 28px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: linear-gradient(135deg, var(--gsi-a), var(--gsi-b)); }
.gsi-me__av img { width: 100%; height: 100%; object-fit: cover; }
.gsi-body .dropdown-menu { --bs-dropdown-bg: rgba(16, 10, 30, .98); --bs-dropdown-border-color: rgba(var(--gsi-ar), .35); --bs-dropdown-link-color: #ece8f5; --bs-dropdown-link-hover-color: #fff; --bs-dropdown-link-hover-bg: rgba(var(--gsi-ar), .14); --bs-dropdown-link-active-bg: rgba(var(--gsi-ar), .3); --bs-dropdown-divider-bg: rgba(196, 155, 255, .2); border-radius: 14px; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .9); padding: 6px; }
.gsi-menu-pop .dropdown-item { display: flex; align-items: center; gap: 10px; border-radius: 9px; padding: 9px 12px; }
.gsi-login { width: 340px; max-width: calc(100vw - 24px); padding: 20px !important; }
.gsi-login__head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--gsi-line); }
.gsi-login__head img { width: 42px; height: auto; filter: drop-shadow(0 0 8px rgba(var(--gsi-ar), .6)); }
.gsi-login__head span { display: flex; flex-direction: column; line-height: 1.3; }
.gsi-login__head b { font: 700 17px var(--gsi-font-head); color: #fff; }
.gsi-login__head small { color: var(--gsi-muted); font-size: 12.5px; }
.gsi-login .form-control, .gsi-login input[type="text"], .gsi-login input[type="password"], .gsi-login input[type="email"] { min-height: 44px; border-radius: 10px; }
.gsi-login .btn, .gsi-login button[type="submit"] { width: 100%; }
.gsi-login a { font-size: 13px; }
.gsi-login .mb-3, .gsi-login .form-group { margin-bottom: 12px !important; }

/* ============================================================ Header */
.gsi-header { position: relative; z-index: 1020; border-bottom: 1px solid rgba(196, 155, 255, .12); background: rgba(11, 8, 22, .6); backdrop-filter: blur(12px); transition: background-color .3s, box-shadow .3s; }
.gsi-header--sticky { position: sticky; top: 0; }
.gsi-header.is-scrolled { background: rgba(11, 8, 22, .9); box-shadow: 0 14px 40px -24px rgba(var(--gsi-ar), .8); }
.gsi-header__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding-top: 12px; padding-bottom: 12px; }
.gsi-brand { display: inline-flex; align-items: center; gap: 12px; color: #fff !important; margin-right: auto; }
.gsi-brand__logo { width: 62px; height: auto; transform-origin: 50% 60%; filter: drop-shadow(0 0 10px rgba(var(--gsi-ar), .45)); }
.gsi-anim .gsi-brand__logo { animation: gsiGlow 3.2s ease-in-out infinite; }
.gsi-brand:hover .gsi-brand__logo { animation: gsiShakeX .7s cubic-bezier(.36, .07, .19, .97) both, gsiGlow 3.2s ease-in-out infinite; }
@keyframes gsiShakeX { 10%, 90% { transform: translateX(-2px) rotate(-3deg); } 20%, 80% { transform: translateX(4px) rotate(4deg); } 30%, 50%, 70% { transform: translateX(-7px) rotate(-7deg) scale(1.06); } 40%, 60% { transform: translateX(7px) rotate(7deg) scale(1.06); } }
@keyframes gsiShake { 20%, 80% { transform: rotate(-8deg); } 40%, 60% { transform: rotate(8deg) scale(1.08); } }
.gsi-brand__text { display: flex; flex-direction: column; line-height: 1.05; }
.gsi-brand__name { position: relative; font: 700 23px var(--gsi-font-head); letter-spacing: .04em; }
.gsi-brand:hover .gsi-brand__name::before, .gsi-brand:hover .gsi-brand__name::after { content: attr(data-text); position: absolute; inset: 0; -webkit-text-fill-color: currentColor; }
.gsi-brand:hover .gsi-brand__name::before { color: rgba(var(--gsi-cr), .8); animation: gsiGlitch1 .4s steps(2) 2; }
.gsi-brand:hover .gsi-brand__name::after { color: rgba(var(--gsi-ar), .8); animation: gsiGlitch2 .4s steps(2) 2; }
@keyframes gsiGlitch1 { 0% { clip-path: inset(0 0 60% 0); transform: translate(-3px, -1px); } 50% { clip-path: inset(40% 0 20% 0); transform: translate(3px, 1px); } 100% { clip-path: inset(0 0 100% 0); } }
@keyframes gsiGlitch2 { 0% { clip-path: inset(60% 0 0 0); transform: translate(3px, 1px); } 50% { clip-path: inset(10% 0 50% 0); transform: translate(-3px, -1px); } 100% { clip-path: inset(100% 0 0 0); } }
.gsi-brand__sub { font-size: 11.5px; font-weight: 700; letter-spacing: .28em; color: #ff8ff0; margin-top: 3px; }
.gsi-header__collapse { flex-basis: auto; align-items: center; gap: 20px; }
.gsi-nav__list { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; list-style: none; margin: 0; padding: 0; }
.gsi-nav__item { position: relative; }
.gsi-nav__link { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 10px 10px; color: #d9d1ea !important; font-weight: 600; font-size: 15px; }
.gsi-nav__link::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 3px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--gsi-a), var(--gsi-b)); box-shadow: 0 0 10px var(--gsi-a); transform: scaleX(0); transition: transform .25s; }
.gsi-nav__link:hover { color: #fff !important; }
.gsi-nav__link:hover::after, .gsi-nav__item.is-active > .gsi-nav__link::after { transform: scaleX(1); }
.gsi-nav__item.is-active > .gsi-nav__link { color: #fff !important; }
.gsi-nav__item--has-sub > .gsi-nav__link::before { content: ""; order: 2; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); opacity: .7; }
.gsi-nav__sub { position: absolute; left: 0; top: 100%; min-width: 230px; list-style: none; margin: 6px 0 0; padding: 6px; border-radius: 14px; background: rgba(16, 10, 30, .98); border: 1px solid rgba(var(--gsi-ar), .35); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .9); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s, transform .2s, visibility .2s; z-index: 50; }
.gsi-nav__item--has-sub:hover > .gsi-nav__sub, .gsi-nav__item--has-sub:focus-within > .gsi-nav__sub, .gsi-nav__item.is-open > .gsi-nav__sub { opacity: 1; visibility: visible; transform: none; }
.gsi-nav__sub a, .gsi-nav__subitem > a { display: block; padding: 9px 12px; border-radius: 9px; color: #ece8f5 !important; font-size: 14.5px; font-weight: 500; }
.gsi-nav__sub a::after { display: none; }
.gsi-nav__sub a:hover { background: rgba(var(--gsi-ar), .14); }
.gsi-burger { margin-left: auto; width: 46px; height: 46px; display: grid; place-content: center; gap: 5px; border-radius: 12px; border: 1px solid rgba(196, 155, 255, .35); background: rgba(255, 255, 255, .04); cursor: pointer; }
.gsi-burger span { display: block; width: 20px; height: 2px; border-radius: 2px; background: #fff; transition: transform .25s, opacity .25s; }
.gsi-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.gsi-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.gsi-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
@media (max-width: 1199.98px) {
    .gsi-brand { margin-right: 0; }
    .gsi-header__collapse { width: 100%; }
    .gsi-header__collapse.show, .gsi-header__collapse.collapsing { display: flex; flex-direction: column; align-items: stretch; padding: 8px 0 14px; }
    .gsi-nav__list { flex-direction: column; align-items: stretch; }
    .gsi-nav__link { width: 100%; padding: 12px 8px; justify-content: space-between; border-bottom: 1px solid rgba(196, 155, 255, .1); }
    .gsi-nav__link::after { display: none; }
    .gsi-nav__sub { position: static; opacity: 1; visibility: visible; transform: none; display: none; margin: 4px 0 8px; box-shadow: none; }
    .gsi-nav__item.is-open > .gsi-nav__sub { display: block; }
    .gsi-help { align-self: flex-start; margin-top: 8px; }
}

/* ============================================================ Hero */
.gsi-hero { position: relative; z-index: 3; isolation: isolate; padding: 64px 0 48px; }
.gsi-main--home { overflow-x: clip; }
.gsi-hero__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.gsi-hero__img, .gsi-hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background-size: cover; background-position: center; opacity: .35; }
.gsi-hero__bg.has-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12, 8, 24, .92) 0%, rgba(12, 8, 24, .55) 60%, rgba(12, 8, 24, .3)), linear-gradient(0deg, var(--gsi-bg), transparent 40%); }
.gsi-hero__glow { position: absolute; inset: 0; background: radial-gradient(55% 65% at 75% 35%, rgba(var(--gsi-ar), .3), transparent 70%), radial-gradient(50% 60% at 15% 85%, rgba(var(--gsi-br), .34), transparent 70%); }
.gsi-hero__grid { position: absolute; left: -20%; right: -20%; bottom: 0; height: 58%; background-image: linear-gradient(rgba(var(--gsi-ar), .32) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--gsi-ar), .32) 1px, transparent 1px); background-size: 64px 64px; transform: perspective(520px) rotateX(62deg); transform-origin: 50% 0; mask-image: linear-gradient(180deg, transparent, #000 35%, #000 70%, transparent); -webkit-mask-image: linear-gradient(180deg, transparent, #000 35%, #000 70%, transparent); }
.gsi-anim .gsi-hero__grid { animation: gsiGrid 2.8s linear infinite; }
@keyframes gsiGrid { to { background-position: 0 64px, 0 0; } }
.gsi-hero__sweep { position: absolute; inset: 0; background: linear-gradient(115deg, transparent 42%, rgba(var(--gsi-ar), .1) 50%, transparent 58%); background-size: 300% 100%; }
.gsi-anim .gsi-hero__sweep { animation: gsiSweep 8s linear infinite; }
@keyframes gsiSweep { from { background-position: 150% 0; } to { background-position: -150% 0; } }
.gsi-particle { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: #ff8ff0; box-shadow: 0 0 10px var(--gsi-a); opacity: 0; }
.gsi-anim .gsi-particle { animation: gsiRise linear infinite; }
@keyframes gsiRise { 0% { transform: translateY(0); opacity: 0; } 15% { opacity: .9; } 100% { transform: translateY(-420px); opacity: 0; } }
.gsi-hero__inner { display: flex; flex-wrap: wrap; align-items: center; gap: 40px; }
.gsi-hero__text { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.gsi-slides { display: grid; }
.gsi-slide { grid-area: 1 / 1; display: flex; flex-direction: column; gap: 18px; opacity: 0; visibility: hidden; transform: translateY(18px); filter: blur(6px); transition: opacity .7s cubic-bezier(.2, .8, .2, 1), transform .7s cubic-bezier(.2, .8, .2, 1), filter .7s, visibility .7s; }
.gsi-slide.is-on { opacity: 1; visibility: visible; transform: none; filter: none; }
.gsi-hero__title { margin: 0; font: 700 clamp(40px, 5.6vw, 78px) / 1.02 var(--gsi-font-head); text-transform: uppercase; color: #fff; }
.gsi-hero__l1, .gsi-hero__l2 { display: block; }
.gsi-anim .gsi-slide.is-on .gsi-hero__l2 { animation: gsiNeonOn 1.3s linear .3s both, gsiHue 6s linear infinite; }
@keyframes gsiNeonOn { 0% { opacity: 0; } 8% { opacity: .9; } 11% { opacity: .1; } 18% { opacity: 1; } 21% { opacity: .25; } 30%, 100% { opacity: 1; } }
.gsi-hero__lead { margin: 0; font-size: 19px; line-height: 1.6; color: var(--gsi-soft); max-width: 48ch; }
.gsi-hero__search { max-width: 640px; }
.gsi-hero__btns { display: flex; flex-wrap: wrap; gap: 12px; }
.gsi-dots { display: flex; align-items: center; gap: 10px; }
.gsi-dots__dot { position: relative; width: 38px; height: 6px; padding: 0; border: 0; border-radius: 6px; background: rgba(255, 255, 255, .2); cursor: pointer; overflow: hidden; transition: width .3s; }
.gsi-dots__dot.is-on { width: 64px; }
.gsi-dots__dot span { position: absolute; inset: 0; transform: scaleX(0); transform-origin: left; background: linear-gradient(90deg, var(--gsi-a), var(--gsi-b)); }
.gsi-dots__dot.is-on span { transform: scaleX(1); }
.gsi-anim .gsi-dots__dot.is-on span { animation: gsiFillBar var(--gsi-slide-time, 7s) linear both; }
.gsi-hero:hover .gsi-dots__dot.is-on span { animation-play-state: paused; }
@keyframes gsiFillBar { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Rumpel-Bühne */
.gsi-stage-wrap { flex: 1 1 360px; min-width: 0; display: flex; justify-content: center; perspective: 900px; }
.gsi-stage { --rx: 0deg; --ry: 0deg; position: relative; width: 460px; max-width: 100%; aspect-ratio: 1 / 1; display: grid; place-items: center; transform: rotateX(var(--rx)) rotateY(var(--ry)); transform-style: preserve-3d; transition: transform .3s ease-out; }
.gsi-stage__ring { position: absolute; inset: 0; width: 100%; height: 100%; }
.gsi-stage__ring--2 { inset: 9%; width: 82%; height: 82%; }
.gsi-anim .gsi-stage__ring { animation: gsiSpin 22s linear infinite; }
.gsi-anim .gsi-stage__ring--2 { animation: gsiSpin 30s linear infinite reverse; }
.gsi-stage__holo { position: absolute; width: 60%; opacity: .16; filter: drop-shadow(0 0 30px rgba(var(--gsi-ar), .6)); }
.gsi-anim .gsi-stage__holo { animation: gsiBreathe 5s ease-in-out infinite; }
@keyframes gsiBreathe { 50% { opacity: .28; transform: scale(1.05); } }
.gsi-stage__pedestal { position: absolute; bottom: 13%; width: 58%; height: 12%; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 95, 228, .85), rgba(var(--gsi-br), .35) 60%, transparent); filter: blur(2px); }
.gsi-stage__pring { position: absolute; bottom: 12%; width: 66%; height: 14%; border-radius: 50%; border: 2px solid rgba(255, 95, 228, .7); box-shadow: 0 0 24px rgba(var(--gsi-ar), .6), inset 0 0 18px rgba(var(--gsi-ar), .4); }
.gsi-stage__beam { position: absolute; bottom: 19%; width: 42%; height: 64%; background: linear-gradient(0deg, rgba(255, 95, 228, .3), transparent); clip-path: polygon(18% 100%, 82% 100%, 100% 0, 0 0); opacity: .7; }
.gsi-anim .gsi-stage__pedestal, .gsi-anim .gsi-stage__beam { animation: gsiPulse 2.6s ease-in-out infinite; }
@keyframes gsiPulse { 50% { opacity: .45; } }
.gsi-stage__rumpel { position: relative; z-index: 2; height: 62%; width: auto; margin-bottom: 13%; filter: drop-shadow(0 0 18px rgba(var(--gsi-ar), .55)) drop-shadow(0 18px 24px rgba(0, 0, 0, .6)); image-rendering: auto; cursor: pointer; transform: translateZ(40px); }
.gsi-anim .gsi-stage__rumpel { animation: gsiFloat 4s ease-in-out infinite; }
.gsi-stage__rumpel:hover { animation: gsiWave .8s ease-in-out, gsiFloat 4s ease-in-out infinite !important; }
@keyframes gsiFloat { 50% { transform: translateZ(40px) translateY(-12px); } }
@keyframes gsiWave { 25% { transform: translateZ(40px) rotate(-8deg); } 75% { transform: translateZ(40px) rotate(8deg); } }
.gsi-bubble { position: absolute; z-index: 3; top: 2%; right: -2%; max-width: 210px; padding: 12px 14px; border-radius: 16px 16px 16px 4px; font-size: 14px; line-height: 1.45; color: #f1e8ff; background: rgba(18, 10, 34, .92); border: 1px solid rgba(255, 95, 228, .5); box-shadow: 0 14px 36px -16px rgba(var(--gsi-ar), .9); transform: translateZ(60px); }
.gsi-bubble b { color: #ff9cf0; }
.gsi-anim .gsi-bubble { animation: gsiPop .6s cubic-bezier(.2, 1.4, .4, 1) .8s both; }
@keyframes gsiPop { from { opacity: 0; transform: translateZ(60px) scale(.6); } }
.gsi-chip { position: absolute; z-index: 3; padding: 7px 12px; border-radius: 10px; font: 700 12px var(--gsi-font-head); letter-spacing: .1em; text-transform: uppercase; color: #fff; background: rgba(18, 10, 34, .85); border: 1px solid rgba(255, 95, 228, .55); box-shadow: 0 0 18px -4px rgba(var(--gsi-ar), .8); transform: translateZ(50px); }
.gsi-anim .gsi-chip { animation: gsiFloatChip 5s ease-in-out infinite; }
@keyframes gsiFloatChip { 50% { transform: translateZ(50px) translateY(-8px); } }
.gsi-chip--0 { top: 30%; left: -4%; animation-delay: -1s !important; }
.gsi-chip--1 { top: 48%; right: -6%; animation-delay: -2.5s !important; }
.gsi-chip--2 { top: 66%; right: 0; animation-delay: -3.5s !important; }
.gsi-chip--3 { top: 18%; left: 6%; animation-delay: -4s !important; }
.gsi-term { position: absolute; z-index: 3; left: -6%; bottom: 0; width: 260px; padding: 12px 14px; border-radius: 12px; background: rgba(8, 5, 16, .93); border: 1px solid rgba(var(--gsi-br), .6); box-shadow: 0 18px 40px -16px rgba(var(--gsi-br), .9); font-size: 12px; line-height: 1.75; color: #cfc6e3; transform: translateZ(70px); }
.gsi-term b { color: var(--gsi-ok); }
.gsi-term__prompt { color: #ff9cf0; }
.gsi-anim .gsi-term__line { animation: gsiLine .4s ease both; }
@keyframes gsiLine { from { opacity: 0; transform: translateX(-6px); } }
@media (max-width: 767.98px) {
    .gsi-hero { padding: 40px 0 32px; }
    .gsi-stage { width: 330px; }
    .gsi-term { left: 0; width: 220px; font-size: 11px; }
    .gsi-bubble { max-width: 170px; font-size: 13px; right: 0; }
    .gsi-chip--0 { left: 0; }
    .gsi-chip--1 { right: 0; }
}

/* ============================================================ Laufband */
.gsi-ticker { display: flex; flex-direction: column; gap: 14px; padding: 18px 0 12px; border-block: 1px solid rgba(var(--gsi-ar), .22); background: linear-gradient(90deg, rgba(var(--gsi-ar), .07), rgba(var(--gsi-br), .09), rgba(var(--gsi-ar), .07)); }
.gsi-marquee { overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.gsi-track { display: flex; width: max-content; }
.gsi-anim .gsi-track { animation: gsiTicker 32s linear infinite; }
.gsi-anim .gsi-track--rev { animation: gsiTickerRev 40s linear infinite; }
.gsi-marquee:hover .gsi-track, .is-paused .gsi-track { animation-play-state: paused; }
@keyframes gsiTicker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes gsiTickerRev { from { transform: translateX(-50%); } to { transform: translateX(0); } }
.gsi-big { display: inline-flex; align-items: center; gap: 28px; padding: 0 14px; font: 700 clamp(28px, 3.4vw, 46px) / 1.1 var(--gsi-font-head); text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.gsi-star { flex-shrink: 0; color: var(--gsi-a); filter: drop-shadow(0 0 8px var(--gsi-a)); }
.gsi-small { display: inline-flex; align-items: center; gap: 12px; padding: 0 22px; font: italic 500 17px var(--gsi-font); color: #e3d9f5; white-space: nowrap; }
.gsi-small .gsi-mono { font-style: normal; color: #ff9cf0; font-size: 14px; margin-left: 10px; }

/* ============================================================ Bereiche */
.gsi-section { position: relative; padding-top: 72px; padding-bottom: 24px; }
.gsi-section--last { padding-bottom: 96px; }
.gsi-sep { height: 1px; max-width: 1232px; margin: 56px auto 0; background: linear-gradient(90deg, transparent, rgba(255, 79, 224, .7), rgba(var(--gsi-br), .7), transparent); box-shadow: 0 0 14px rgba(var(--gsi-ar), .5); }
.gsi-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 28px; }
.gsi-head__main { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.gsi-head__text { margin: 0; color: var(--gsi-soft); max-width: 62ch; }
.gsi-h2 { margin: 0; font: 700 clamp(32px, 3.6vw, 46px) / 1.08 var(--gsi-font-head) !important; text-transform: uppercase; }
.gsi-h2 .gsi-neon { display: inline-block; }
.gsi-h2::after { content: ""; display: block; width: 96px; height: 3px; margin-top: 14px; border-radius: 3px; background: linear-gradient(90deg, var(--gsi-a), var(--gsi-b), var(--gsi-c), var(--gsi-a)); background-size: 200% 100%; box-shadow: 0 0 12px rgba(var(--gsi-ar), .8); }
.gsi-anim .gsi-h2::after { animation: gsiLineMove 3s linear infinite; }
@keyframes gsiLineMove { to { background-position: 200% 0; } }
.gsi-h2:hover .gsi-neon { animation: gsiHue 1.5s linear infinite, gsiGlitchMove .35s steps(2) 3; }
@keyframes gsiGlitchMove { 25% { transform: translate(-3px, 1px); } 50% { transform: translate(3px, -1px); } 75% { transform: translate(-1px, -2px); } }
.gsi-h3 { display: flex; align-items: center; gap: 9px; margin: 0 0 12px; font: 700 21px var(--gsi-font-head); color: #fff; }
.gsi-h3 svg { color: var(--gsi-a); }
.gsi-h3--big { font-size: 28px; line-height: 1.2; }
.gsi-more { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.gsi-more span { transition: transform .2s; }
.gsi-more:hover span { transform: translateX(4px); }
.gsi-empty { margin: 0; padding: 24px; text-align: center; border: 1px dashed var(--gsi-line); border-radius: 16px; color: var(--gsi-muted); }
.gsi-adminhint { display: flex; align-items: center; gap: 10px; margin: 12px 0 0; padding: 12px 14px; border-radius: 12px; background: rgba(245, 184, 61, .1); border: 1px solid rgba(245, 184, 61, .4); color: #fcd34d; font-size: 14px; }
.gsi-adminhint svg { flex-shrink: 0; }
/* Einblenden */
.gsi-reveal [data-gsi-reveal] { opacity: 0; transform: translateY(26px); transition: opacity .8s cubic-bezier(.2, .8, .2, 1) var(--d, 0s), transform .8s cubic-bezier(.2, .8, .2, 1) var(--d, 0s); }
.gsi-reveal [data-gsi-reveal].is-visible { opacity: 1; transform: none; transition: opacity .8s cubic-bezier(.2, .8, .2, 1) var(--d, 0s), transform .6s cubic-bezier(.2, .8, .2, 1), border-color .25s, box-shadow .25s; }
.gsi-reveal .gsi-news[data-gsi-reveal].is-visible:hover, .gsi-reveal a.gsi-card[data-gsi-reveal].is-visible:hover, .gsi-reveal .gsi-srv[data-gsi-reveal].is-visible:hover { transition-delay: 0s; }
.gsi-reveal .gsi-h2[data-gsi-reveal] { filter: blur(6px); transition: opacity .9s, transform .9s, filter .9s; }
.gsi-reveal .gsi-h2[data-gsi-reveal].is-visible { filter: none; }

/* Karten */
.gsi-card { position: relative; background: linear-gradient(180deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .025)); border: 1px solid var(--gsi-line); border-radius: 18px; backdrop-filter: blur(4px); transition: transform .25s, border-color .25s, box-shadow .25s, opacity .8s var(--d, 0s); }
a.gsi-card { color: var(--gsi-text) !important; }
a.gsi-card:hover, .gsi-card.gsi-srv:hover { transform: translateY(-4px); border-color: rgba(255, 79, 224, .6); box-shadow: 0 20px 50px -24px rgba(var(--gsi-ar), .7); }
.gsi-card__head { display: flex; align-items: center; gap: 12px; }
.gsi-card__head b { font: 700 20px var(--gsi-font-head); color: #fff; }
.gsi-card__head span { display: flex; flex-direction: column; }

/* Ankündigungen */
.gsi-news-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 22px; perspective: 1000px; }
.gsi-news { display: flex; flex-direction: column; gap: 12px; padding: 14px 14px 22px; overflow: hidden; }
.gsi-news::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .14), transparent); transform: skewX(-18deg); transition: left .8s ease; pointer-events: none; }
.gsi-news:hover::after { left: 130%; }
.gsi-news:hover { transform: translateY(-8px) rotateX(2deg); border-color: rgba(255, 95, 228, .6); box-shadow: 0 30px 60px -24px rgba(var(--gsi-ar), .9), 0 0 0 1px rgba(255, 95, 228, .4); }
.gsi-news__shot { display: block; aspect-ratio: 16 / 9; border-radius: 13px; overflow: hidden; background: radial-gradient(70% 90% at 70% 20%, rgba(var(--gsi-ar), .38), transparent 70%), linear-gradient(135deg, #21123d, #0e0a1c); }
.gsi-news__shot img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .8, .2, 1), filter .6s; }
.gsi-news:hover .gsi-news__shot img { transform: scale(1.07); filter: saturate(1.3) brightness(1.1); }
.gsi-news__art { display: grid; place-items: center; width: 100%; height: 100%; }
.gsi-news__art img { width: 34% !important; height: auto !important; opacity: .55; filter: drop-shadow(0 0 20px rgba(var(--gsi-ar), .7)); }
.gsi-news__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; color: var(--gsi-muted); padding: 0 6px; }
.gsi-news__title { margin: 0; padding: 0 6px; font: 700 22px / 1.25 var(--gsi-font-head); }
.gsi-news__title a { color: #fff !important; transition: color .25s; }
.gsi-news:hover .gsi-news__title a { color: #ff9cf0 !important; }
.gsi-news__text { margin: 0; padding: 0 6px; color: var(--gsi-soft); line-height: 1.55; }
.gsi-news__more { margin-top: auto; padding: 0 6px; font-weight: 700; }

/* FAQ-Center */
.gsi-faq-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(265px, 1fr)); gap: 16px; }
.gsi-faqcat { --c: var(--gsi-a); display: flex; gap: 14px; align-items: flex-start; padding: 20px; overflow: hidden; isolation: isolate; }
.gsi-faqcat::before { content: ""; position: absolute; width: 170px; height: 170px; right: -70px; top: -70px; z-index: -1; border-radius: 50%; background: conic-gradient(from 0deg, transparent, color-mix(in srgb, var(--c) 32%, transparent), transparent 45%, rgba(var(--gsi-br), .26), transparent 85%); }
.gsi-anim .gsi-faqcat::before { animation: gsiSpin 14s linear infinite; }
.gsi-faqcat:hover::before { animation-duration: 3s; }
.gsi-faqcat .gsi-ico { background: linear-gradient(135deg, color-mix(in srgb, var(--c) 70%, #120a22), color-mix(in srgb, var(--c) 28%, #120a22)); border-color: color-mix(in srgb, var(--c) 55%, transparent); box-shadow: 0 10px 26px -12px var(--c); }
.gsi-faqcat:hover { border-color: var(--c) !important; box-shadow: 0 20px 50px -26px var(--c) !important; }
.gsi-faqcat:hover .gsi-ico svg { animation: gsiShake .6s both; }
.gsi-faqcat__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.gsi-faqcat__body b { font-size: 17px; }
.gsi-faqcat__body small { color: var(--gsi-muted); font-size: 14px; line-height: 1.45; }
.gsi-faqcat__count { align-self: center; min-width: 30px; height: 30px; padding: 0 8px; display: grid; place-items: center; border-radius: 999px; font: 700 13px var(--gsi-mono); color: var(--c); background: color-mix(in srgb, var(--c) 14%, transparent); }
.gsi-faq-cols { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 22px; margin-top: 30px; align-items: start; }
.gsi-faq-top { display: flex; flex-direction: column; gap: 10px; }
.gsi-faq-q { display: flex; align-items: center; gap: 14px; padding: 15px 18px; border-radius: 14px; border: 1px solid rgba(196, 155, 255, .16); background: rgba(255, 255, 255, .035); color: var(--gsi-text) !important; transition: border-color .2s, background-color .2s, transform .2s; }
.gsi-faq-q:hover { border-color: var(--gsi-a); background: rgba(var(--gsi-ar), .08); transform: translateX(4px); }
.gsi-faq-q__t { flex: 1; min-width: 0; font-weight: 600; }
.gsi-faq-q__k { font-size: 12px; color: #ff9cf0; }
.gsi-faq-q__go { color: var(--gsi-muted); transition: transform .2s, color .2s; }
.gsi-faq-q:hover .gsi-faq-q__go { transform: translateX(3px); color: var(--gsi-a); }
.gsi-faq-video { display: flex; flex-direction: column; gap: 14px; padding: 20px; }
.gsi-faq-video .hc-video { margin: 0; }
.gsi-faq-video__shot { position: relative; display: grid; place-items: center; aspect-ratio: 16 / 9; border-radius: 14px; background: radial-gradient(70% 90% at 70% 20%, rgba(var(--gsi-ar), .38), transparent 70%), linear-gradient(135deg, #21123d, #0e0a1c); }
.gsi-faq-video__shot .hc-video__play { width: 70px; height: 70px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: linear-gradient(135deg, var(--gsi-a), var(--gsi-b)); box-shadow: 0 0 34px rgba(var(--gsi-ar), .7); padding-left: 4px; }
.gsi-faq-video__title { font: 700 18px var(--gsi-font-head); color: #fff !important; }
.gsi-codeshow { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr); gap: 32px; margin-top: 48px; align-items: start; }
.gsi-codeshow__text { display: flex; flex-direction: column; gap: 14px; }
.gsi-codeshow__text p { margin: 0; color: var(--gsi-soft); line-height: 1.65; }
.gsi-codeshow__text .hc-note { margin: 0; }
.gsi-codeshow__code .hc-code { margin: 0; }
@media (max-width: 991.98px) { .gsi-faq-cols, .gsi-codeshow { grid-template-columns: minmax(0, 1fr); } }

/* Server */
.gsi-srv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 18px; }
.gsi-srv { --c: var(--gsi-b); display: flex; flex-direction: column; gap: 12px; padding: 14px 14px 18px; overflow: hidden; }
.gsi-srv__banner { position: relative; height: 104px; display: flex; align-items: flex-end; padding: 12px 14px; border-radius: 12px; overflow: hidden; background: radial-gradient(80% 130% at 85% 0%, color-mix(in srgb, var(--c) 70%, transparent), transparent 70%), linear-gradient(135deg, color-mix(in srgb, var(--c) 30%, #1a0f30), #0e0a1c); color: #fff !important; }
.gsi-srv__game { position: relative; z-index: 1; font: 700 19px var(--gsi-font-head); text-transform: uppercase; letter-spacing: .05em; text-shadow: 0 2px 12px rgba(0, 0, 0, .7); }
.gsi-srv__ico { position: absolute; right: 12px; top: 10px; color: rgba(255, 255, 255, .22); transition: transform .4s; }
.gsi-srv:hover .gsi-srv__ico { transform: rotate(-12deg) scale(1.15); }
.gsi-srv__row { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.gsi-srv__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; }
.gsi-srv__state { display: inline-flex; align-items: center; gap: 7px; font: 700 12px var(--gsi-mono); color: var(--gsi-ok); letter-spacing: .06em; }
.gsi-srv__state.is-off { color: #fb7185; }
.gsi-bar { height: 7px; border-radius: 6px; background: rgba(255, 255, 255, .1); overflow: hidden; }
.gsi-bar i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--gsi-ok), var(--gsi-c)); box-shadow: 0 0 10px rgba(62, 230, 138, .6); }
.gsi-srv__facts { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--gsi-muted); }
.gsi-srv__facts b { color: var(--gsi-text); }
.gsi-copy { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 9px 12px; border-radius: 10px; border: 1px solid rgba(196, 155, 255, .3); background: rgba(255, 255, 255, .04); color: #e9dcff; font-size: 13px; cursor: pointer; transition: border-color .2s; }
.gsi-copy:hover { border-color: var(--gsi-a); color: #fff; }
.gsi-copy.is-done { border-color: var(--gsi-ok); }
.gsi-copy[data-tip]::after { content: attr(data-tip); position: absolute; right: 8px; top: -30px; padding: 3px 9px; border-radius: 7px; background: var(--gsi-ok); color: #06210f; font-weight: 700; font-size: 12px; }

/* Programme */
.gsi-prog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; }
.gsi-prog { display: flex; flex-direction: column; gap: 10px; padding: 22px; overflow: hidden; isolation: isolate; }
.gsi-prog::before { content: ""; position: absolute; width: 240px; height: 240px; right: -90px; top: -90px; z-index: -1; border-radius: 50%; background: conic-gradient(from 0deg, transparent, rgba(var(--gsi-ar), .28), transparent 40%, rgba(var(--gsi-br), .28), transparent 80%); }
.gsi-anim .gsi-prog::before { animation: gsiSpin 12s linear infinite; }
.gsi-prog:hover::before { animation-duration: 3s; }
.gsi-prog__ico { position: relative; width: 62px; height: 62px; margin-bottom: 4px; display: grid; place-items: center; border-radius: 18px; color: #fff; isolation: isolate; }
.gsi-prog__ico::before { content: ""; position: absolute; inset: -3px; z-index: -2; border-radius: 21px; background: conic-gradient(from var(--gsi-ang), var(--gsi-a), transparent 35%, var(--gsi-b) 55%, transparent 80%, var(--gsi-a)); }
.gsi-anim .gsi-prog__ico::before { animation: gsiBorder 3s linear infinite; }
.gsi-prog__ico::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 18px; background: linear-gradient(135deg, #2a1450, #120a22); }
.gsi-prog:hover .gsi-prog__ico svg { animation: gsiShake .6s both; }
.gsi-prog__name { font-size: 18px; color: #fff; }
.gsi-prog__text { color: var(--gsi-muted); font-size: 14px; }
.gsi-prog__meta { font-size: 12px; color: #a79fbd; }
.gsi-prog__dl { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 6px; font-weight: 700; color: #ff9cf0; }
.gsi-prog__dl i { font-style: normal; transition: transform .2s; }
.gsi-prog:hover .gsi-prog__dl i { transform: translateX(5px); }

/* Server-Service */
.gsi-service { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 28px 40px; padding: clamp(24px, 4vw, 44px); border-radius: 24px; overflow: hidden; isolation: isolate; border: 1px solid rgba(var(--gsi-ar), .35); background: radial-gradient(70% 120% at 100% 0%, rgba(var(--gsi-ar), .3), transparent 60%), linear-gradient(135deg, rgba(var(--gsi-br), .24), rgba(255, 255, 255, .03)); box-shadow: 0 30px 80px -40px rgba(var(--gsi-ar), .8); }
.gsi-service__glow { position: absolute; inset: -40%; z-index: -1; background: conic-gradient(from 0deg, transparent, rgba(var(--gsi-ar), .12), transparent 30%, rgba(var(--gsi-cr), .1), transparent 60%); }
.gsi-anim .gsi-service__glow { animation: gsiSpin 24s linear infinite; }
.gsi-service__text { flex: 999 1 460px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.gsi-service__text p { margin: 0; font-size: 18px; color: #e3d9f5; }
.gsi-service__text b { color: #fff; }
.gsi-service__btns { flex: 1 1 280px; display: flex; flex-direction: column; gap: 12px; }

/* Community */
.gsi-comm { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 22px; }
.gsi-dc { display: flex; flex-direction: column; gap: 12px; padding: 22px; background: linear-gradient(160deg, rgba(88, 101, 242, .3), rgba(255, 255, 255, .03)); }
.gsi-dc__head { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.gsi-dc__logo { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: #5865f2; box-shadow: 0 0 22px -6px #5865f2; }
.gsi-dc__title { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.gsi-dc__title b { font: 700 20px var(--gsi-font-head); color: #fff; }
.gsi-dc__title small { color: #c9bde3; font-size: 13px; }
.gsi-dc__online { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--gsi-ok); }
.gsi-dc__channels { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 4px 18px; }
.gsi-dc__cname { display: flex; align-items: center; gap: 8px; margin-top: 8px; padding: 4px 0; font-weight: 700; font-size: 14px; color: #cfc6e3; }
.gsi-dc__cname b { margin-left: auto; font: 700 12px var(--gsi-mono); color: var(--gsi-muted); }
.gsi-dc__user { display: flex; align-items: center; gap: 10px; padding: 6px 10px 6px 24px; border-radius: 10px; font-size: 14px; color: var(--gsi-text); transition: background-color .2s; }
.gsi-dc__user:hover { background: rgba(88, 101, 242, .2); }
.gsi-dc__uname { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; overflow: hidden; }
.gsi-dc__uname small { color: var(--gsi-muted); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gsi-dc__mute { font-size: 12px; opacity: .7; }
.gsi-dc__faces { display: flex; flex-wrap: wrap; gap: 8px; }
.gsi-dc__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 14px; border-top: 1px solid rgba(196, 155, 255, .16); }
.gsi-ava { position: relative; width: 32px; height: 32px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; font: 700 12px var(--gsi-font); color: #fff; background: #2a1450; }
.gsi-ava img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.gsi-ava::after { content: ""; position: absolute; right: -2px; bottom: -2px; width: 11px; height: 11px; border-radius: 50%; background: var(--gsi-ok); border: 2px solid #17112c; }
.gsi-ava.is-idle::after { background: #f5b83d; }
.gsi-ava.is-dnd::after { background: #f43f5e; }
.gsi-ava.is-live { box-shadow: 0 0 0 2px var(--gsi-ok); }
.gsi-anim .gsi-ava.is-live { animation: gsiSpeak 1.4s ease-in-out infinite; }
@keyframes gsiSpeak { 50% { box-shadow: 0 0 0 5px rgba(62, 230, 138, .25); } }
.gsi-partners { display: flex; flex-direction: column; gap: 12px; padding: 22px; }
.gsi-partner { display: grid; place-items: center; min-height: 64px; padding: 10px; border-radius: 12px; border: 1px solid var(--gsi-line); background: rgba(255, 255, 255, .03); color: var(--gsi-text) !important; font-weight: 700; transition: border-color .2s, transform .2s; }
.gsi-partner:hover { border-color: var(--gsi-a); transform: translateY(-2px); }
.gsi-partner img { max-width: 100%; max-height: 70px; object-fit: contain; }
.gsi-forum { margin-top: 22px; padding: 22px; display: flex; flex-direction: column; gap: 10px; }
.gsi-forum__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.gsi-thread { display: flex; align-items: center; gap: 14px; padding: 13px 16px; border-radius: 14px; border: 1px solid rgba(196, 155, 255, .16); background: rgba(255, 255, 255, .035); color: var(--gsi-text) !important; transition: border-color .2s, background-color .2s, transform .2s; }
.gsi-thread:hover { border-color: var(--gsi-a); background: rgba(var(--gsi-ar), .08); transform: translateX(4px); }
.gsi-thread__main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.gsi-thread__main b { font-weight: 600; }
.gsi-thread__main small { color: var(--gsi-muted); font-size: 13px; }
.gsi-thread__time { color: var(--gsi-muted); font-size: 13px; white-space: nowrap; }
@media (max-width: 991.98px) { .gsi-comm { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575.98px) { .gsi-thread { flex-wrap: wrap; } .gsi-thread__time { width: 100%; padding-left: 48px; } }

/* ============================================================ Unterseiten */
.gsi-pagehead { padding: 18px 0; border-bottom: 1px solid rgba(196, 155, 255, .12); background: linear-gradient(90deg, rgba(var(--gsi-ar), .08), rgba(var(--gsi-br), .06), transparent); }
.gsi-breadcrumb { font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--gsi-muted); }
.gsi-breadcrumb .breadcrumb { margin: 0; --bs-breadcrumb-divider-color: rgba(196, 155, 255, .5); --bs-breadcrumb-item-active-color: #fff; }
.gsi-breadcrumb a { color: var(--gsi-muted); }
.gsi-breadcrumb a:hover { color: #fff; }
.gsi-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 30px; padding-top: 34px; padding-bottom: 80px; align-items: start; }
.gsi-layout--full { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 991.98px) { .gsi-layout { grid-template-columns: minmax(0, 1fr); } }
.gsi-sidebar { display: flex; flex-direction: column; gap: 18px; }
.gsi-box { padding: 18px; border-radius: 18px; background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02)); border: 1px solid var(--gsi-line); }
.gsi-box__title { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font: 700 15px var(--gsi-font-head) !important; letter-spacing: .12em; text-transform: uppercase; color: #fff; }
.gsi-box__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gsi-a); box-shadow: 0 0 10px var(--gsi-a); }
.gsi-box__body { font-size: 15px; color: var(--gsi-soft); }
.gsi-menu { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.gsi-menu a { display: block; padding: 8px 10px; border-radius: 9px; color: var(--gsi-text) !important; }
.gsi-menu a:hover, .gsi-menu .is-active > a { background: rgba(var(--gsi-ar), .12); color: #fff !important; }
.gsi-menu--child { padding-left: 12px; }
.gsi-content { min-width: 0; color: var(--gsi-soft); }
.gsi-content h1 { font-size: clamp(28px, 3vw, 40px); margin-bottom: .6em; }
.gsi-content h2 { font-size: 26px; }
.gsi-content img { max-width: 100%; height: auto; border-radius: 10px; }
.gsi-content .card, .gsi-content .list-group-item { --bs-card-bg: rgba(255, 255, 255, .04); --bs-card-border-color: var(--gsi-line); --bs-list-group-bg: rgba(255, 255, 255, .03); --bs-list-group-border-color: var(--gsi-line); --bs-list-group-color: var(--gsi-text); border-radius: 14px; }
.gsi-content .table { --bs-table-bg: transparent; --bs-table-color: var(--gsi-text); --bs-table-border-color: var(--gsi-line); --bs-table-hover-bg: rgba(var(--gsi-ar), .06); --bs-table-striped-bg: rgba(255, 255, 255, .02); }
.gsi-body .form-control, .gsi-body .form-select { --bs-body-bg: rgba(255, 255, 255, .04); background-color: rgba(255, 255, 255, .04); border-color: rgba(196, 155, 255, .3); color: #fff; border-radius: 10px; }
.gsi-body .form-control:focus, .gsi-body .form-select:focus { border-color: var(--gsi-a); box-shadow: 0 0 0 3px rgba(var(--gsi-ar), .2); background-color: rgba(255, 255, 255, .06); color: #fff; }
.gsi-body .form-control::placeholder { color: #8f86a8; }
.gsi-body .btn-primary { --bs-btn-bg: var(--gsi-a); --bs-btn-border-color: var(--gsi-a); --bs-btn-hover-bg: var(--gsi-b); --bs-btn-hover-border-color: var(--gsi-b); --bs-btn-active-bg: var(--gsi-b); background-image: linear-gradient(90deg, var(--gsi-a), var(--gsi-b)); border: 0; font-weight: 700; border-radius: 10px; }
.gsi-body .btn-outline-secondary, .gsi-body .btn-secondary { --bs-btn-color: #e9dcff; --bs-btn-border-color: rgba(196, 155, 255, .45); --bs-btn-hover-bg: rgba(var(--gsi-ar), .15); --bs-btn-hover-border-color: var(--gsi-a); --bs-btn-hover-color: #fff; border-radius: 10px; }
.gsi-body .pagination { --bs-pagination-bg: rgba(255, 255, 255, .04); --bs-pagination-border-color: var(--gsi-line); --bs-pagination-color: var(--gsi-text); --bs-pagination-hover-bg: rgba(var(--gsi-ar), .14); --bs-pagination-hover-color: #fff; --bs-pagination-active-bg: var(--gsi-a); --bs-pagination-active-border-color: var(--gsi-a); }
.gsi-body .alert { border-radius: 14px; }
.gsi-content blockquote { margin: 1.2em 0; padding: 12px 18px; border-left: 4px solid var(--gsi-b); background: rgba(255, 255, 255, .04); border-radius: 0 12px 12px 0; }
.gsi-content :not(pre) > code { font-family: var(--gsi-mono); font-size: .88em; padding: 2px 7px; border-radius: 6px; background: rgba(var(--gsi-br), .2); border: 1px solid rgba(var(--gsi-br), .35); color: #f0e6ff; }
/* Code-Blöcke in Artikeln, Forum, Seiten */
.gsi-code { margin: 1.4em 0; border-radius: 14px; overflow: hidden; background: #0b0816; border: 1px solid rgba(196, 155, 255, .28); box-shadow: 0 22px 50px -32px rgba(var(--gsi-ar), .6); }
.gsi-code__bar { display: flex; align-items: center; gap: 12px; padding: 8px 10px 8px 14px; background: linear-gradient(90deg, rgba(var(--gsi-ar), .14), rgba(var(--gsi-br), .14)); border-bottom: 1px solid rgba(196, 155, 255, .18); }
.gsi-code__dots { display: flex; gap: 6px; }
.gsi-code__dots i { width: 11px; height: 11px; border-radius: 50%; background: #ff5f57; }
.gsi-code__dots i:nth-child(2) { background: #febc2e; }
.gsi-code__dots i:nth-child(3) { background: #28c840; }
.gsi-code__lang { font: 700 11px var(--gsi-mono); letter-spacing: .08em; color: #d8c4ff; padding: 2px 8px; border-radius: 6px; background: rgba(var(--gsi-br), .24); }
.gsi-code__copy { margin-left: auto; min-height: 34px; padding: 0 14px; border-radius: 9px; border: 1px solid rgba(255, 95, 228, .5); background: rgba(var(--gsi-ar), .14); color: #fff; font: 700 13px var(--gsi-font); cursor: pointer; }
.gsi-code__copy:hover { background: rgba(var(--gsi-ar), .28); }
.gsi-code__copy.is-done { border-color: var(--gsi-ok); background: rgba(62, 230, 138, .18); }
.gsi-code pre { margin: 0; padding: 14px 18px; background: transparent !important; color: #e6e1f2; font: 500 14px / 1.75 var(--gsi-mono); overflow: auto; border: 0; border-radius: 0; }
.gsi-code pre code { font: inherit; background: none !important; padding: 0 !important; color: inherit; }

/* ============================================================ Footer */
.gsi-footer { position: relative; background: radial-gradient(60% 140% at 50% 0%, rgba(var(--gsi-ar), .16), transparent 70%), #08050f; }
.gsi-footer__line { height: 2px; background: linear-gradient(90deg, transparent, var(--gsi-a), var(--gsi-b), var(--gsi-c), var(--gsi-a), transparent); background-size: 200% 100%; box-shadow: 0 0 18px rgba(var(--gsi-ar), .8); }
.gsi-anim .gsi-footer__line { animation: gsiLineMove 6s linear infinite; }
.gsi-footer__grid { display: flex; flex-wrap: wrap; gap: 36px 48px; padding-top: 52px; padding-bottom: 30px; }
.gsi-footer__about { flex: 999 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.gsi-footer__about p { margin: 0; color: var(--gsi-soft); line-height: 1.65; max-width: 46ch; }
.gsi-brand--foot { margin: 0; }
.gsi-brand--foot .gsi-brand__logo { width: 70px; }
.gsi-brand--foot b { font: 700 21px var(--gsi-font-head); }
.gsi-footer__col { display: flex; flex-direction: column; gap: 10px; min-width: 160px; }
.gsi-footer__col h2 { margin: 0 0 4px; font: 700 14px var(--gsi-font-head) !important; letter-spacing: .14em; text-transform: uppercase; color: #ff9cf0 !important; }
.gsi-footer__col a { color: #cfc6e3 !important; font-size: 15px; transition: color .2s, transform .2s; display: inline-block; }
.gsi-footer__col a:hover { color: #fff !important; transform: translateX(3px); }
.gsi-social { display: flex; flex-wrap: wrap; gap: 10px; }
.gsi-social__link { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; border: 1px solid rgba(196, 155, 255, .3); background: rgba(255, 255, 255, .04); color: #e9dcff !important; transition: transform .2s, border-color .2s, box-shadow .2s; }
.gsi-social__link:hover { transform: translateY(-3px); border-color: var(--gsi-a); box-shadow: 0 0 18px -2px rgba(var(--gsi-ar), .8); color: #fff !important; }
.gsi-footer__sep { height: 1px; background: linear-gradient(90deg, transparent, rgba(196, 155, 255, .35), transparent); }
.gsi-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding-top: 18px; padding-bottom: 30px; font-size: 13px; color: var(--gsi-muted); }
.gsi-footer__credit { font-size: 11.5px; opacity: .8; }
.gsi-footer__credit a { color: var(--gsi-muted) !important; }
.gsi-footer__credit a:hover { color: #fff !important; }

/* Back-to-Top */
.gsi-totop { position: fixed; right: 22px; bottom: 22px; z-index: 1040; width: 56px; height: 56px; display: grid; place-items: center; border-radius: 50%; color: #fff !important; background: linear-gradient(135deg, var(--gsi-a), var(--gsi-b)); box-shadow: 0 12px 30px -8px rgba(var(--gsi-ar), .9); opacity: 0; visibility: hidden; transform: translateY(20px) scale(.8); transition: opacity .3s, transform .3s, visibility .3s; }
.gsi-totop.is-visible { opacity: 1; visibility: visible; transform: none; }
.gsi-totop:hover { transform: translateY(-4px) scale(1.06); }
.gsi-anim .gsi-totop.is-visible { animation: gsiTop 2.4s ease-in-out infinite; }
@keyframes gsiTop { 50% { box-shadow: 0 0 0 10px rgba(var(--gsi-ar), 0), 0 12px 30px -8px rgba(var(--gsi-ar), .9); } }
.gsi-totop__ring { position: absolute; inset: -5px; width: calc(100% + 10px); height: calc(100% + 10px); transform: rotate(-90deg); }
.gsi-totop__track { fill: none; stroke: rgba(255, 255, 255, .15); stroke-width: 2.5; }
.gsi-totop__progress { fill: none; stroke: #fff; stroke-width: 2.5; stroke-linecap: round; }
.gsi-totop__arrow { position: relative; }

/* Hilfe-Center im Layout: Farben übernehmen */
.gsi-body .hc { --hc-a: var(--gsi-a); --hc-b: var(--gsi-b); --hc-cy: var(--gsi-c); }
.gsi-hero .hc-search { background: rgba(10, 7, 18, .88); }

/* ============================================================ Ruhe & Druck */
.is-paused, .is-paused * { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) {
    .gsi-body *, .gsi-body *::before, .gsi-body *::after { animation: none !important; transition: none !important; }
    .gsi-slide { filter: none; }
}
@media print {
    .gsi-bg, .gsi-topbar, .gsi-header, .gsi-totop, .gsi-cursor, .gsi-pre, .gsi-sidebar, .gsi-footer { display: none !important; }
    body.gsi-body { background: #fff; color: #000; }
}

/* Inhalt aus dem Editor (Artikel, Seiten): helle, gut lesbare Schrift auf dunklem Grund */
.gsi-content .ck-content { color: var(--gsi-soft); font-size: 17px; line-height: 1.75; }
.gsi-content .ck-content p, .gsi-content .ck-content li { color: inherit; }
.gsi-content .ck-content h1, .gsi-content .ck-content h2, .gsi-content .ck-content h3 { color: #fff; }

/* Header in einer Zeile wie in der Vorschau (Logo | Menü | Hilfe-Center) */
@media (min-width: 1200px) {
    .gsi-header__bar { flex-wrap: nowrap; gap: 18px; }
    .gsi-brand { flex-shrink: 0; }
    .gsi-brand__logo { width: 56px; }
    .gsi-brand__name { font-size: 20px; }
    .gsi-brand__sub { font-size: 10.5px; letter-spacing: .26em; }
    .gsi-header__collapse { flex: 1 1 auto; justify-content: flex-end; gap: 16px; min-width: 0; }
    .gsi-nav__list { flex-wrap: nowrap; gap: 0 2px; }
    .gsi-nav__link { padding: 10px 8px; font-size: 14.5px; white-space: nowrap; }
    .gsi-nav__link::after { left: 8px; right: 8px; }
    .gsi-help { padding: 7px 14px 7px 8px; }
}
@media (min-width: 1200px) and (max-width: 1279.98px) {
    .gsi-help__text small { display: none; }
    .gsi-nav__link { padding: 10px 6px; font-size: 14px; }
}

/* Folien unten bündig: kurzer Text steht direkt über Suche und Knöpfen (keine Lücke) */
.gsi-slides { align-items: end; }
.gsi-slide { align-self: end; }

/* Rumpel in den Maßen der Vorschau: Bühne 440 px, Figur 58 % der Bühnenhöhe
   (Breite statt Höhe, damit die Größe nicht von der Bildauflösung abhängt) */
.gsi-stage { width: 440px; }
.gsi-stage__rumpel { height: auto; width: 34%; max-height: 58%; object-fit: contain; margin-bottom: 12%; }
@media (max-width: 767.98px) { .gsi-stage { width: 330px; } }
.gsi-stage-wrap { flex-basis: 440px; }

/* ============================================================ Seitenleiste & Ilch-Boxen in den Farben des Layouts */
.gsi-box { position: relative; overflow: hidden; background: linear-gradient(180deg, rgba(var(--gsi-br), .12), rgba(255, 255, 255, .02) 60%), rgba(14, 9, 28, .6); border-color: rgba(var(--gsi-ar), .22); box-shadow: 0 18px 40px -30px rgba(var(--gsi-ar), .7); }
.gsi-box::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--gsi-a), var(--gsi-b), transparent); opacity: .8; }
.gsi-box__title { padding-bottom: 10px; border-bottom: 1px solid rgba(196, 155, 255, .14); }
.gsi-box__title { background: linear-gradient(90deg, #fff, #ff9cf0); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gsi-box__dot { -webkit-text-fill-color: initial; }
.gsi-sidebar a { color: #ff9cf0; }
.gsi-sidebar a:hover { color: #fff; }
.gsi-menu a { color: var(--gsi-text) !important; position: relative; padding-left: 14px; }
.gsi-menu a::before { content: ""; position: absolute; left: 2px; top: 50%; width: 5px; height: 5px; border-radius: 50%; background: rgba(var(--gsi-ar), .5); transform: translateY(-50%); transition: background-color .2s, box-shadow .2s; }
.gsi-menu a:hover::before, .gsi-menu .is-active > a::before { background: var(--gsi-a); box-shadow: 0 0 8px var(--gsi-a); }
/* Bootstrap-Bausteine in Boxen und Inhalt */
.gsi-sidebar, .gsi-content {
    --bs-card-bg: rgba(255, 255, 255, .03);
    --bs-card-border-color: rgba(196, 155, 255, .2);
    --bs-card-cap-bg: rgba(var(--gsi-ar), .12);
    --bs-list-group-bg: rgba(255, 255, 255, .03);
    --bs-list-group-color: var(--gsi-text);
    --bs-list-group-border-color: rgba(196, 155, 255, .16);
    --bs-list-group-action-hover-bg: rgba(var(--gsi-ar), .1);
    --bs-progress-bg: rgba(255, 255, 255, .08);
    --bs-progress-bar-bg: var(--gsi-a);
}
.gsi-sidebar .table, .gsi-content .table { --bs-table-bg: transparent; --bs-table-color: var(--gsi-text); --bs-table-border-color: rgba(196, 155, 255, .16); --bs-table-striped-bg: rgba(255, 255, 255, .03); --bs-table-striped-color: var(--gsi-text); --bs-table-hover-bg: rgba(var(--gsi-ar), .08); margin-bottom: 0; }
.gsi-sidebar .card, .gsi-content .card { border-radius: 12px; overflow: hidden; }
.gsi-sidebar .bg-primary, .gsi-content .bg-primary, .gsi-sidebar .card-header.bg-primary { background: linear-gradient(90deg, rgba(var(--gsi-ar), .85), rgba(var(--gsi-br), .85)) !important; color: #fff !important; }
.gsi-sidebar .border-primary { border-color: rgba(var(--gsi-ar), .45) !important; }
.gsi-sidebar .progress-bar, .gsi-content .progress-bar { background: linear-gradient(90deg, var(--gsi-a), var(--gsi-b)); }
.gsi-sidebar .badge, .gsi-content .badge.bg-secondary, .gsi-sidebar .badge.bg-secondary { background: rgba(var(--gsi-ar), .2) !important; color: #ffb3f2 !important; border: 1px solid rgba(var(--gsi-ar), .4); font-weight: 700; }
.gsi-body .input-group-text { background: rgba(var(--gsi-br), .18); border-color: rgba(196, 155, 255, .3); color: #e9dcff; }
.gsi-sidebar .btn, .gsi-content .btn:not(.btn-link):not(.btn-close):not(.gsi-btn) { border-radius: 10px; font-weight: 700; transition: transform .2s, box-shadow .2s, background-color .2s, border-color .2s; }
.gsi-sidebar .btn:hover { transform: translateY(-1px); }
.gsi-sidebar .btn-secondary, .gsi-sidebar .btn-outline-secondary, .gsi-sidebar .btn-default, .gsi-sidebar .btn-light, .gsi-sidebar .btn-outline-primary, .gsi-sidebar button[type="submit"]:not([class*="btn-"]):not(.gsi-btn):not(.hc-btn), .gsi-sidebar input[type="submit"],
.gsi-content .btn-default, .gsi-content .btn-light, .gsi-content .btn-outline-primary {
    --bs-btn-color: #fff; --bs-btn-bg: transparent; --bs-btn-border-color: rgba(var(--gsi-ar), .55); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: rgba(var(--gsi-ar), .18); --bs-btn-hover-border-color: var(--gsi-a); --bs-btn-active-bg: rgba(var(--gsi-ar), .28); --bs-btn-active-border-color: var(--gsi-a);
    color: #fff; background-color: rgba(var(--gsi-ar), .1); border: 1px solid rgba(var(--gsi-ar), .55);
}
.gsi-sidebar form .btn-secondary, .gsi-sidebar form .btn-primary, .gsi-sidebar form button[type="submit"]:not(.hc-btn) { background: linear-gradient(90deg, var(--gsi-a), var(--gsi-b)); border: 0; color: #fff; box-shadow: 0 8px 22px -10px rgba(var(--gsi-ar), .9); }
.gsi-sidebar hr { border-color: rgba(196, 155, 255, .2); opacity: 1; }
.gsi-sidebar .text-muted, .gsi-sidebar small { color: var(--gsi-muted) !important; }
.gsi-sidebar ul:not([class]) { padding-left: 18px; }
.gsi-sidebar li::marker { color: var(--gsi-a); }
.gsi-sidebar .form-check-input, .gsi-content .form-check-input, .gsi-sidebar input[type="checkbox"], .gsi-sidebar input[type="radio"] { accent-color: var(--gsi-a); }
.gsi-body .form-check-input { background-color: rgba(255, 255, 255, .06); border-color: rgba(196, 155, 255, .4); }
.gsi-body .form-check-input:checked { background-color: var(--gsi-a); border-color: var(--gsi-a); }
/* Shoutbox: Nachrichten als Blasen */
.gsi-sidebar .shoutbox-messages .table, .gsi-sidebar .shoutbox .table { border: 0; }
.gsi-sidebar .shoutbox .table > :not(caption) > * > * { border: 0; padding: 0; background: transparent !important; box-shadow: none; }
.gsi-sidebar .shoutbox .table tr { display: block; margin-bottom: 8px; padding: 8px 10px; border-radius: 12px 12px 12px 4px; background: rgba(var(--gsi-br), .14); border: 1px solid rgba(196, 155, 255, .16); }
.gsi-sidebar .shoutbox .table td { display: block; }
.gsi-sidebar .shoutbox .avatar, .gsi-sidebar .shoutbox img { border-radius: 50%; }
/* Forum-Box: neueste Beiträge */
.gsi-sidebar .list-unstyled li { padding: 6px 0; border-bottom: 1px solid rgba(196, 155, 255, .1); line-height: 1.35; }
.gsi-sidebar .list-unstyled li:last-child { border-bottom: 0; }
/* Kalender (FullCalendar) dunkel und in den Layout-Farben */
.gsi-body {
    --fc-classic-background: transparent;
    --fc-classic-foreground: #ece8f5;
    --fc-classic-faint: rgba(255, 255, 255, .03);
    --fc-classic-muted: rgba(255, 255, 255, .06);
    --fc-classic-strong: rgba(255, 255, 255, .12);
    --fc-classic-faint-foreground: #6f6688;
    --fc-classic-muted-foreground: #b3aac9;
    --fc-classic-border: rgba(196, 155, 255, .16);
    --fc-classic-strong-border: rgba(196, 155, 255, .3);
    --fc-classic-primary: var(--gsi-a);
    --fc-classic-primary-foreground: #fff;
    --fc-classic-today: rgba(var(--gsi-ar), .16);
    --fc-classic-highlight: rgba(var(--gsi-br), .2);
    --fc-classic-now: var(--gsi-c);
    --fc-classic-button: rgba(var(--gsi-ar), .2);
    --fc-classic-button-border: rgba(var(--gsi-ar), .45);
    --fc-classic-button-strong: var(--gsi-a);
    --fc-classic-button-strong-border: var(--gsi-a);
    --fc-classic-button-outline: rgba(var(--gsi-ar), .4);
    --fc-classic-button-foreground: #fff;
}
.gsi-sidebar .calendar .calendarbox-title { font-family: var(--gsi-font-head); font-weight: 700; color: #fff; padding-top: 0; }
.gsi-sidebar .calendar .calendarbox-event-count, .gsi-sidebar .calendar [class*="event-count"] { background: linear-gradient(90deg, var(--gsi-a), var(--gsi-b)) !important; color: #fff !important; border: 0 !important; border-radius: 6px; }