@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=Inter:wght@400;500;600;700;800&display=swap');
:root{--bg:#071016;--panel:#0d1920;--panel2:#101f27;--line:#20333b;--text:#eef5f2;--muted:#91a5aa;--green:#68d6a0;--green2:#2f9f75;--gold:#e4bf5f;--danger:#9d4040}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at 50% -15%,#18342f 0,transparent 31%),var(--bg);color:var(--text)}a{color:inherit}.container{width:min(1180px,calc(100% - 34px));margin:auto}.narrow{max-width:850px}
.hero{min-height:570px;background:linear-gradient(90deg,rgba(5,12,16,.96),rgba(5,12,16,.73) 55%,rgba(5,12,16,.88)),radial-gradient(circle at 82% 32%,rgba(55,137,102,.32),transparent 27%),linear-gradient(145deg,#132820,#071016 70%);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;inset:auto -10% -130px 35%;height:300px;background:radial-gradient(ellipse,rgba(101,214,160,.12),transparent 65%);pointer-events:none}
.nav{display:flex;align-items:center;justify-content:space-between;padding:24px 0;position:relative;z-index:2}.brand{display:flex;align-items:center;gap:11px;font-family:"Barlow Condensed",sans-serif;font-size:21px;letter-spacing:.5px}.brand b{color:var(--green)}.brand-mark{width:38px;height:38px;display:inline-grid;place-items:center;border:1px solid #477463;clip-path:polygon(50% 0,100% 100%,0 100%);padding-top:8px;color:var(--green);font-weight:900;font-family:"Barlow Condensed",sans-serif}.nav-actions{display:flex;gap:10px}
.hero-content{padding:74px 0 70px;position:relative;z-index:2}.hero-kicker,.eyebrow{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:2.4px;font-size:13px;font-weight:800;color:var(--green)}.hero h1,.form-card h1,.admin-head h1,.detail-hero h1{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:clamp(54px,7.2vw,92px);letter-spacing:-1.5px;line-height:.87;margin:14px 0 20px}.hero h1 span{color:transparent;-webkit-text-stroke:1px #93d5b8}.form-card h1,.admin-head h1,.detail-hero h1{font-size:46px;line-height:1}.subtitle,.muted{max-width:700px;color:#a5b5b8;line-height:1.65;font-size:16px}
.searchbar{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:9px;margin-top:32px;background:rgba(10,22,27,.78);padding:9px;border:1px solid #294039;border-radius:12px;box-shadow:0 20px 70px #0007;backdrop-filter:blur(8px)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border:1px solid transparent;border-radius:7px;padding:12px 17px;font-weight:800;cursor:pointer;transition:.2s ease}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(180deg,#70dda9,#4fbf8b);color:#062017;box-shadow:0 7px 25px rgba(79,191,139,.13)}.btn-secondary{background:#13232a;border-color:#2b3d43;color:#d9e5e2}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:-31px 0 64px;position:relative;z-index:3}.stats>div{background:linear-gradient(145deg,#102027,#0b171d);border:1px solid #263b42;padding:20px 22px;border-radius:10px;display:grid;grid-template-columns:auto 1fr;column-gap:13px;align-items:center;box-shadow:0 16px 40px #0004}.stats .stat-icon{grid-row:1/3;font-size:22px}.stats strong{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:27px}.stats span:last-child{color:#81969b;font-size:12px}
.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.section-head h2{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:39px;margin:2px 0}.section-copy{color:var(--muted);margin:0}.server-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card,.detail-card,.detail-hero{background:linear-gradient(150deg,#101e25,#0a151b);border:1px solid #22363d;border-radius:10px;padding:22px;box-shadow:0 12px 35px #0002}.card{display:flex;flex-direction:column;gap:15px;position:relative;overflow:hidden;transition:.22s ease}.card:before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:#2d5447}.card:hover{transform:translateY(-3px);border-color:#355047;box-shadow:0 20px 50px #0005}.premium-card{border-color:#6f6138!important;box-shadow:inset 0 1px rgba(228,191,95,.1),0 16px 45px #0004!important}.premium-card:before{background:var(--gold)}.sponsored{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:1.2px;font-size:11px;color:#e8c966;font-weight:900;margin-bottom:8px}.card-top{display:flex;justify-content:space-between;gap:10px}.card h3{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;margin:0;font-size:25px;line-height:1}.badge{font-size:10px;font-weight:900;background:#14362a;color:#77e4b4;border:1px solid #24533f;border-radius:4px;padding:6px 8px;height:max-content}.meta{display:flex;gap:6px;flex-wrap:wrap}.meta span{font-size:11px;background:#101f26;border:1px solid #263940;border-radius:5px;padding:6px 8px;color:#bccacc}.description{color:#9fb0b4;line-height:1.6;font-size:14px;min-height:44px}.rate-row{display:flex;gap:6px;flex-wrap:wrap}.rate-row span{font-size:11px;background:#0e2423;border:1px solid #25413b;border-radius:5px;padding:7px 8px;color:#cfe0db}.card-actions{margin-top:auto}.server-view{width:100%;justify-content:space-between}.server-view span{font-size:18px}
.empty,.notice{margin:20px 0;padding:18px;border-radius:8px}.empty{border:1px dashed #2a404c;color:#91a5ad}.notice.success{background:#11382c;border:1px solid #245f4a}.notice.error{background:#3b1717;border:1px solid #6b2929}
.form-card{margin:55px 0;background:linear-gradient(150deg,#101f27,#0a151b);border:1px solid #263b42;border-radius:10px;padding:30px}.back{margin:30px 0 18px;color:#8fa4a9;font-size:13px}.back a{text-decoration:none}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid label,label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700;color:#bdccd1}.full{grid-column:1/-1}input,select,textarea{width:100%;background:#081319;border:1px solid #294048;color:#edf7f2;border-radius:6px;padding:13px 14px;outline:none;font-family:inherit}input:focus,select:focus,textarea:focus{border-color:#4d9278;box-shadow:0 0 0 3px rgba(77,146,120,.1)}
.admin-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:40px 0 25px}.table-wrap{overflow:auto;border:1px solid #203440;border-radius:8px}.table-wrap table{width:100%;border-collapse:collapse;background:#0d1b26}.table-wrap th,.table-wrap td{padding:14px;border-bottom:1px solid #203440;text-align:left;vertical-align:top}.table-wrap th{background:#10222e;font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.5px}.actions{display:flex;flex-wrap:wrap;gap:6px}.actions form{margin:0}.actions button{border:1px solid #30464d;border-radius:5px;padding:8px 10px;cursor:pointer;background:#172b34;color:#eef7f3}.actions .danger{background:#4c2020;border-color:#693030}
.detail-brand{font-family:"Barlow Condensed",sans-serif;letter-spacing:1.5px;color:#a8bbb8;margin-bottom:18px;display:flex;align-items:center;gap:10px}.detail-brand .brand-mark{width:31px;height:31px}.detail-hero{margin-bottom:16px;padding:32px;background:radial-gradient(circle at 90% 20%,rgba(86,188,141,.13),transparent 30%),linear-gradient(145deg,#11232a,#0a151b)}.detail-hero h1{margin:8px 0 18px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.detail-card{margin-bottom:16px}.detail-card h2{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:29px;margin:4px 0 17px}.info-list{display:grid;gap:0}.info-list>div{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid #1f343b}.info-list span{color:#82989d;font-size:13px}.detail-text{color:#b5c4c7;line-height:1.75}.footer-inner{display:flex;justify-content:space-between;gap:15px;color:#71868b;font-size:12px;padding:55px 0 30px}
@media(max-width:850px){.server-grid{grid-template-columns:1fr 1fr}.searchbar{grid-template-columns:1fr}.stats{margin-top:-18px}.detail-grid{grid-template-columns:1fr}.hero{min-height:auto}}
@media(max-width:600px){.server-grid,.stats,.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.nav{align-items:flex-start;gap:15px}.nav-actions{flex-direction:column}.hero-content{padding-top:45px}.hero h1{font-size:52px}.admin-head{align-items:flex-start;flex-direction:column}.footer-inner{flex-direction:column}.section-head{align-items:flex-start;flex-direction:column}.stats>div{grid-template-columns:auto 1fr}}

/* V3.1 – wider cards + dedicated premium area */
.top-section{margin:0 0 62px}.gold{color:var(--gold)!important}.top-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.top-card{position:relative;overflow:hidden;background:radial-gradient(circle at 95% 0,rgba(228,191,95,.14),transparent 32%),linear-gradient(145deg,#17231f,#0b171b 70%);border:1px solid #756539;border-radius:12px;padding:27px;box-shadow:0 20px 55px #0005}.top-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(var(--gold),#8c7334)}.top-ribbon{font-family:"Barlow Condensed",sans-serif;color:var(--gold);letter-spacing:1.5px;font-size:12px;font-weight:900;margin-bottom:18px}.top-card-main{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end}.top-card h3{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:34px;line-height:1;margin:16px 0 10px}.top-card p{color:#aebcba;line-height:1.6;margin:0;max-width:620px}.top-rates{display:grid;grid-template-columns:repeat(3,82px);gap:7px}.top-rates span{background:#0a1618;border:1px solid #4d472c;border-radius:7px;padding:10px 7px;text-align:center;color:#f0d57e;font-family:"Barlow Condensed",sans-serif;font-size:18px}.top-rates b{display:block;color:#8fa09d;font-family:Inter,sans-serif;font-size:8px;letter-spacing:.7px;margin-bottom:3px}.btn-gold{margin-top:22px;background:linear-gradient(180deg,#ecd174,#c9a849);color:#251c06;width:max-content}.server-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.card{min-height:330px;padding:26px}.card h3{font-size:29px}.description{font-size:14px;min-height:68px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.rate-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.rate-row span{text-align:center}.server-view{padding:13px 16px}
@media(max-width:900px){.top-grid{grid-template-columns:1fr}.top-card-main{grid-template-columns:1fr}.server-grid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.server-grid{grid-template-columns:1fr}.top-rates{grid-template-columns:repeat(3,1fr)}.top-card{padding:22px}}

/* V4 cinematic ARK backgrounds */
body{background:#061017}
body:before{content:"";position:absolute;z-index:-3;inset:0;background:linear-gradient(rgba(4,12,16,.92),rgba(4,12,16,.96)),url("assets/ark-jungle-bg.png") center top/cover no-repeat;opacity:.42}
.hero-art{min-height:640px;background:
linear-gradient(90deg,rgba(3,10,14,.93),rgba(3,10,14,.55) 54%,rgba(3,10,14,.82)),
linear-gradient(180deg,rgba(3,10,14,.05),#071016 96%),
url("assets/ark-jungle-bg.png") center 28%/cover no-repeat;
border-bottom:1px solid #2c443e}
.hero-art:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 20%,transparent 0,rgba(2,9,12,.18) 55%,rgba(2,9,12,.55) 100%);pointer-events:none}
.hero-art .nav{background:rgba(4,14,18,.62);border:1px solid rgba(81,139,116,.23);border-radius:10px;margin-top:16px;padding:15px 18px;backdrop-filter:blur(9px)}
.hero-art .hero-content{padding-top:88px}
.hero-art h1{text-shadow:0 5px 35px #000,0 2px 4px #000}
.hero-art .subtitle{text-shadow:0 2px 8px #000;color:#c3d1ce}
.top-section{position:relative}
.top-section:before{content:"";position:absolute;z-index:-1;inset:-22px -28px;border-radius:18px;background:linear-gradient(90deg,rgba(10,25,25,.78),rgba(10,20,21,.45));border:1px solid rgba(211,177,75,.08)}
.top-card{background:
linear-gradient(90deg,rgba(10,20,20,.95),rgba(11,21,20,.74)),
url("assets/ark-jungle-bg.png") center 62%/cover no-repeat}
.card{background:linear-gradient(145deg,rgba(15,30,36,.96),rgba(7,18,23,.96))}
.ark-page-bg:before{opacity:.25}
.detail-hero{background:
linear-gradient(90deg,rgba(8,22,25,.94),rgba(8,20,22,.67)),
url("assets/ark-jungle-bg.png") center 55%/cover no-repeat}
footer{margin-top:55px;background:linear-gradient(rgba(5,15,18,.88),rgba(4,11,14,.96)),url("assets/ark-jungle-bg.png") center bottom/cover no-repeat;border-top:1px solid #1e3536}
@media(max-width:650px){.hero-art{min-height:auto;background-position:58% top}.hero-art .nav{margin-top:10px}.hero-art .hero-content{padding-top:52px}.top-section:before{inset:-12px -8px}}

/* V4.0.1 – Hintergrund deutlich sichtbarer */
body:before{
  background:
    linear-gradient(rgba(4,12,16,.60),rgba(4,12,16,.78)),
    url("assets/ark-jungle-bg.png") center top/cover no-repeat;
  opacity:.72;
}
.hero-art{
  min-height:640px;
  background:
    linear-gradient(90deg,rgba(3,10,14,.72),rgba(3,10,14,.25) 58%,rgba(3,10,14,.48)),
    linear-gradient(180deg,rgba(3,10,14,.02) 0%,rgba(7,16,22,.60) 90%,#071016 100%),
    url("assets/ark-jungle-bg.png") center 23%/cover no-repeat;
}
.hero-art:before{
  background:radial-gradient(circle at 52% 24%,transparent 0,rgba(2,9,12,.05) 55%,rgba(2,9,12,.28) 100%);
}
.hero-art .nav{background:rgba(4,14,18,.52)}
.hero-art .hero-content{
  background:linear-gradient(90deg,rgba(3,11,14,.42),transparent 72%);
  border-radius:14px;
}
.ark-page-bg:before{opacity:.55}
.top-card{
  background:
    linear-gradient(90deg,rgba(8,18,19,.86),rgba(8,18,19,.42)),
    url("assets/ark-jungle-bg.png") center 60%/cover no-repeat;
}
@media(max-width:650px){
  body:before{opacity:.58}
  .hero-art{background-position:58% top}
}

/* V4.0.2 – sauberer Hintergrund ohne doppelte UI/Texte */
body:before{
  background:
    linear-gradient(rgba(3,10,14,.45),rgba(3,10,14,.72)),
    url("assets/ark-clean-bg.jpg") center top/cover no-repeat scroll !important;
  opacity:1 !important;
}
.hero-art{
  background:
    linear-gradient(90deg,rgba(3,10,14,.70),rgba(3,10,14,.18) 60%,rgba(3,10,14,.38)),
    linear-gradient(180deg,rgba(3,10,14,.00) 0%,rgba(7,16,22,.48) 88%,#071016 100%),
    url("assets/ark-clean-bg.jpg") center 38%/cover no-repeat !important;
}
.hero-art:before{
  background:radial-gradient(circle at 52% 25%,transparent 0,rgba(2,9,12,.04) 58%,rgba(2,9,12,.25) 100%) !important;
}
.top-card{
  background:linear-gradient(90deg,rgba(8,18,19,.88),rgba(8,18,19,.62)) !important;
}
.detail-hero{
  background:linear-gradient(90deg,rgba(8,22,25,.90),rgba(8,20,22,.68)) !important;
}
footer{
  background:linear-gradient(rgba(5,15,18,.82),rgba(4,11,14,.94)) !important;
}

/* V4.0.3 – finaler reiner Landschaftshintergrund */
body:before{
  background:
    linear-gradient(rgba(3,10,14,.48),rgba(3,10,14,.70)),
    url("assets/ark-clean-bg.jpg") center top/cover no-repeat scroll !important;
  opacity:1 !important;
}
.hero-art{
  background:
    linear-gradient(90deg,rgba(3,10,14,.68),rgba(3,10,14,.15) 62%,rgba(3,10,14,.28)),
    linear-gradient(180deg,rgba(3,10,14,.02),rgba(7,16,22,.45) 90%,rgba(7,16,22,.65)) !important;
}

/* V4.1 Server-Selbstverwaltung */
.manage-buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.danger-zone{border-color:#6b3030;background:linear-gradient(145deg,rgba(53,20,20,.88),rgba(20,12,14,.94))}
.btn-danger{background:#8e3535;color:white;border-color:#a34a4a}
.btn-danger:hover{background:#a44040}

/* V4.3 Banner-Editor & Passwort-Verwaltung */
.owner-box,.banner-builder{padding:18px;border:1px solid rgba(75,190,164,.28);border-radius:12px;background:rgba(4,18,20,.58)}
.server-banner{width:100%;max-width:440px;aspect-ratio:44/13;min-height:130px;margin:14px 0;border-radius:9px;overflow:hidden;border:1px solid rgba(151,220,199,.35);display:flex;align-items:flex-end;box-shadow:0 10px 30px rgba(0,0,0,.32);background-size:cover!important;background-position:center!important}
.server-banner>div{width:100%;padding:13px 16px;background:linear-gradient(transparent,rgba(2,9,12,.94));display:flex;flex-direction:column;gap:3px}
.server-banner strong{font-size:18px;line-height:1.1;text-shadow:0 2px 5px #000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.server-banner span{font-size:12px;color:#d3e8e1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.banner-jungle{background:linear-gradient(90deg,rgba(3,18,16,.12),rgba(3,10,14,.25)),url('assets/ark-clean-bg.jpg') center 45%/cover no-repeat!important}
.banner-obelisk{background:linear-gradient(90deg,rgba(3,10,14,.30),rgba(11,51,62,.10)),url('assets/ark-clean-bg.jpg') 70% 36%/cover no-repeat!important}
.banner-dark{background:linear-gradient(rgba(1,7,9,.52),rgba(1,7,9,.62)),url('assets/ark-clean-bg.jpg') 25% 52%/cover no-repeat!important}
.card>.server-banner{max-width:none;margin:0 0 16px;min-height:auto}.top-card>.server-banner{margin:0 0 16px}

/* V4.3.1 eigener Banner-Upload */
.uploaded-server-banner{display:block;width:100%;max-width:440px;height:auto;max-height:130px;object-fit:contain;border-radius:10px;margin:0 0 14px}
.banner-upload-preview{min-height:70px;border:1px dashed rgba(255,255,255,.25);border-radius:10px;padding:10px;margin-top:10px;display:flex;align-items:center;justify-content:center}
.banner-upload-preview img{display:block;max-width:440px;width:100%;height:auto;max-height:130px;object-fit:contain}
.detail-banner{margin-bottom:20px}

/* V4.3.2 compact 468x60 server list */
.compact-server-list{display:flex;flex-direction:column;gap:12px;margin-bottom:54px}.compact-server{display:grid;grid-template-columns:468px minmax(0,1fr);gap:18px;align-items:center;background:linear-gradient(150deg,rgba(16,30,37,.96),rgba(8,20,25,.96));border:1px solid #294139;border-radius:9px;padding:10px 12px;box-shadow:0 10px 28px #0004;overflow:hidden}.compact-server:hover{border-color:#3f6758}.compact-banner-wrap{width:468px;height:60px;overflow:hidden;border-radius:5px;background:#071115}.compact-banner{display:block;width:468px;height:60px;object-fit:cover}.compact-banner-fallback{width:468px;height:60px;display:flex;align-items:center;padding:0 18px;background:linear-gradient(90deg,#122c28,#10212a);font-family:"Barlow Condensed",sans-serif;font-size:22px;font-weight:800;text-transform:uppercase}.compact-info{min-width:0;display:flex;flex-direction:column;gap:7px}.compact-title{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.compact-title h3{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:23px;line-height:1;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.compact-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px}.compact-rates{display:flex;gap:6px;flex-wrap:wrap}.compact-rates span{font-size:10px;padding:5px 7px;border-radius:4px;background:#0e2423;border:1px solid #25413b;color:#d5e5df}.compact-btn{margin:0!important;padding:9px 13px!important;white-space:nowrap;width:auto!important;font-size:12px}.premium-row{border-color:#76663a;background:radial-gradient(circle at 85% 0,rgba(228,191,95,.10),transparent 28%),linear-gradient(150deg,rgba(23,35,31,.97),rgba(9,22,26,.97))}.premium-label{display:block;color:var(--gold);font-family:"Barlow Condensed",sans-serif;font-size:10px;letter-spacing:1px;font-weight:900;margin-bottom:4px}.compact-section{margin-bottom:42px}.uploaded-server-banner{max-width:468px;max-height:60px}.banner-upload-preview img{max-width:468px;max-height:60px}.banner-upload-preview{min-height:82px}
@media(max-width:1050px){.compact-server{grid-template-columns:1fr}.compact-banner-wrap,.compact-banner,.compact-banner-fallback{width:468px;max-width:100%}.compact-banner-wrap{height:auto;aspect-ratio:468/60}.compact-banner,.compact-banner-fallback{height:100%}}
@media(max-width:600px){.compact-server{padding:9px}.compact-bottom{align-items:stretch;flex-direction:column}.compact-btn{width:100%!important;justify-content:space-between}.compact-title h3{font-size:20px}.compact-banner-wrap{width:100%}.compact-banner{width:100%}}




/* === EIN EINZIGER ARK-HINTERGRUND === */

html, body {
    min-height: 100%;
}

body {
    background:
        linear-gradient(rgba(3,10,14,.48), rgba(3,10,14,.70)),
        url("assets/ark-clean-bg.jpg") center top / cover no-repeat !important;
    background-attachment: scroll !important;
}

/* Alten zusätzlichen Seitenhintergrund abschalten */
body:before {
    content: none !important;
    display: none !important;
}

/* Kein zweites ARK-Bild in einzelnen Bereichen */
.hero-art {
    background:
        linear-gradient(90deg,rgba(3,10,14,.30),rgba(3,10,14,.05) 62%,rgba(3,10,14,.12)), linear-gradient(180deg,rgba(3,10,14,.00),rgba(7,16,22,.15)) !important;
}

.top-card {
    background: rgba(8,18,19,.88) !important;
}

.detail-hero {
    background: rgba(8,20,22,.82) !important;
}

footer {
    background: rgba(4,11,14,.88) !important;
}



/* ==========================================================
   SERVER VERWALTEN - ZWEI SPALTEN
   ========================================================== */

.manage-page .container.narrow {
    width: min(1240px, calc(100% - 32px));
    max-width: 1240px;
}

.manage-page .form-card {
    backdrop-filter: blur(8px);
}

.manage-edit-form {
    display: block;
}

.manage-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.manage-column {
    min-width: 0;
    padding: 22px;
    border: 1px solid rgba(72, 224, 194, .20);
    border-radius: 16px;
    background: rgba(5, 17, 20, .58);
}

.manage-column-left {
    border-color: rgba(79, 208, 226, .22);
}

.manage-column-right {
    border-color: rgba(88, 226, 154, .22);
}

.manage-section-title {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255,255,255,.10);
}

.manage-section-title > span {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 12px;
    background: rgba(67, 224, 189, .10);
    border: 1px solid rgba(67, 224, 189, .25);
    font-size: 21px;
}

.manage-section-title h2 {
    margin: 2px 0 0;
    font-size: 20px;
}

.manage-section-title .eyebrow {
    margin: 0;
}

.manage-column label {
    display: block;
    margin-bottom: 15px;
}

.manage-column input,
.manage-column select,
.manage-column textarea {
    width: 100%;
    box-sizing: border-box;
}

.manage-column textarea {
    resize: vertical;
}

.manage-small-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 14px;
}

.manage-three-grid {
    display: grid;
    grid-template-columns: 1.5fr .8fr .8fr;
    gap: 14px;
}

.manage-rate-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 14px;
}

.manage-subsection {
    margin-top: 18px;
    padding-top: 17px;
    border-top: 1px solid rgba(255,255,255,.08);
}

.manage-subsection h3 {
    margin: 0 0 14px;
    font-size: 15px;
    letter-spacing: .03em;
}

.manage-banner-box {
    margin-top: 18px;
    padding: 18px;
    border-radius: 14px;
    border: 1px solid rgba(76, 209, 226, .18);
    background: rgba(3, 13, 17, .42);
}

.current-banner-wrap {
    margin: 10px 0 16px;
    overflow-x: auto;
}

.manage-banner-box .uploaded-server-banner,
.manage-banner-box .banner-upload-preview img {
    display: block;
    width: 468px;
    max-width: 100%;
    height: auto;
    aspect-ratio: 468 / 60;
    object-fit: contain;
    border-radius: 6px;
}

.manage-save-area {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 24px;
    padding: 18px 22px;
    border-radius: 15px;
    border: 1px solid rgba(59, 225, 154, .25);
    background: rgba(5, 23, 19, .80);
}

.manage-save-area strong {
    color: #8fffc5;
}

.manage-save-area p {
    margin: 4px 0 0;
}

.manage-save-button {
    min-width: 210px;
}

.manage-page .danger-zone {
    margin-top: 24px;
}

@media (max-width: 950px) {
    .manage-layout {
        grid-template-columns: 1fr;
    }

    .manage-rate-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 650px) {
    .manage-page .container.narrow {
        width: min(100% - 18px, 1240px);
    }

    .manage-column {
        padding: 16px;
    }

    .manage-small-grid,
    .manage-three-grid,
    .manage-rate-grid {
        grid-template-columns: 1fr;
    }

    .manage-save-area {
        align-items: stretch;
        flex-direction: column;
    }

    .manage-save-button {
        width: 100%;
    }
}

/* ==================================================
   SERVER EINTRAGEN - 2 SPALTEN
   ================================================== */

body:has(.submit-two-column) .container.narrow {
    max-width: 1250px;
}

.submit-two-column {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.submit-side {
    min-width: 0;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 16px;
    background: rgba(8,18,19,.82);
}

.submit-heading {
    margin-bottom: 20px;
}

.submit-heading h2 {
    margin-top: 4px;
    margin-bottom: 0;
}

.submit-side > label,
.submit-group > label {
    display: block;
    margin-bottom: 15px;
}

.submit-side input,
.submit-side select,
.submit-side textarea {
    width: 100%;
    box-sizing: border-box;
}

.submit-mini-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 14px;
}

.submit-mini-grid label {
    min-width: 0;
    margin-bottom: 0;
}

.submit-group {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.09);
}

.submit-group > .eyebrow {
    margin-bottom: 12px;
}

.submit-group .submit-mini-grid + label,
.submit-group .submit-mini-grid + textarea {
    margin-top: 15px;
}

.submit-left .owner-box,
.submit-left .banner-builder {
    margin-top: 22px;
}

.submit-button-row {
    grid-column: 1 / -1;
    display: flex;
    justify-content: center;
    padding-top: 4px;
}

.submit-button-row .btn {
    min-width: 260px;
}

@media (max-width: 900px) {
    .submit-two-column {
        grid-template-columns: 1fr;
    }

    .submit-button-row {
        grid-column: 1;
    }
}

@media (max-width: 600px) {
    .submit-mini-grid {
        grid-template-columns: 1fr;
    }

    .submit-side {
        padding: 16px;
    }
}