@font-face{font-family:Inter;font-style:normal;font-weight:400 900;font-display:swap;src:url('/fonts/inter-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:Inter;font-style:normal;font-weight:400 900;font-display:swap;src:url('/fonts/inter-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

*{box-sizing:border-box}html{color-scheme:dark;overflow-x:hidden}html,body{width:100%;max-width:100%;min-height:100%}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#eef7f3;margin:0;padding:0 0 72px;display:flex;flex-direction:column;align-items:center;overflow-x:hidden;background:#08110f;position:relative}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-color:#08110f;background-image:linear-gradient(180deg,rgba(5,12,11,.16),rgba(5,11,10,.66) 48%,rgba(5,10,9,.88)),image-set(url('/img/background-v2-1280.91e5b6c13b.avif') type('image/avif'),url('/img/background-v2-1280.050da069c6.webp') type('image/webp'),url('/img/background-v2-1280.27d641635f.jpg') type('image/jpeg'));background-size:auto,cover;background-position:center,center;background-repeat:no-repeat,no-repeat}
.banner-hero{width:100%;height:clamp(220px,min(30vw,30vh),540px);overflow:visible;background:#111;box-shadow:0 18px 55px rgba(0,0,0,.62);position:relative;z-index:2}
.banner-hero::after{content:"";position:absolute;inset:auto 0 0;height:22%;background:linear-gradient(180deg,transparent,rgba(5,12,11,.34));pointer-events:none}
.server-banner{display:block;width:100%;height:100%;object-fit:cover;object-position:center 60%}
.banner-transition{position:absolute;left:0;right:0;bottom:clamp(-160px,-6vw,-65px);width:100%;max-width:100%;height:clamp(130px,12vw,320px);z-index:4;pointer-events:none;background:transparent}
.banner-transition::before{content:"";position:absolute;inset:0;background:image-set(url('/img/transition-grass-v2-1920.6611cf1eca.avif') type('image/avif'),url('/img/transition-grass-v2-1920.86c9429ec8.webp') type('image/webp'),url('/img/transition-grass-v2-1920.de75e22e7f.png') type('image/png')) center/100% 100% no-repeat;filter:drop-shadow(0 20px 24px rgba(0,0,0,.62))}
.banner-transition::after{display:none}
.site-nav-wrap{width:100%;margin-top:clamp(105px,7vw,190px);padding:0 24px;position:relative;z-index:8;display:flex;justify-content:center}
.site-nav{display:flex;align-items:center;justify-content:center;gap:18px;padding:5px;background:transparent;border:0;border-radius:0;box-shadow:none}
.nav-link{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:116px;min-height:50px;padding:14px 24px;border:1px solid rgba(179,218,205,.16);border-radius:15px;background:linear-gradient(145deg,rgba(18,36,31,.94),rgba(8,19,16,.96));box-shadow:0 14px 34px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.035);backdrop-filter:blur(16px);color:#b8c9c3;text-decoration:none;font-size:.9rem;font-weight:780;letter-spacing:.02em;transition:color .2s,background .2s,transform .2s,border-color .2s,box-shadow .2s}.nav-link:hover{color:#effff9;border-color:rgba(80,227,194,.42);background:linear-gradient(145deg,rgba(24,52,43,.96),rgba(10,28,22,.97));transform:translateY(-4px);box-shadow:0 20px 42px rgba(0,0,0,.42),0 0 0 1px rgba(80,227,194,.06)}.nav-link.active{color:#edfff8;border-color:rgba(91,232,187,.38);background:linear-gradient(135deg,rgba(31,195,143,.32),rgba(9,83,63,.4));box-shadow:0 17px 40px rgba(0,0,0,.38),inset 0 0 0 1px rgba(91,232,187,.16),0 8px 25px rgba(7,93,69,.24)}.nav-link.active::after{content:"";position:absolute;left:25%;right:25%;bottom:7px;height:2px;border-radius:2px;background:#66e7bd;box-shadow:0 0 12px rgba(94,232,189,.7)}
.container{width:min(1120px,100%);padding:38px 24px 46px;position:relative}
.intro{text-align:center;max-width:720px;margin:0 auto 30px}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:#5ee8bd;font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.16em}.eyebrow::before,.eyebrow::after{content:"";width:24px;height:1px;background:#2acb9a}
.page-title{font-size:clamp(2rem,4vw,3.35rem);line-height:1.05;margin:12px 0 12px;letter-spacing:-.04em}.page-copy{margin:0;color:#aabbb5;line-height:1.7;font-size:1rem}
.fancy-title{font-size:clamp(2.1rem,4vw,3.2rem);font-weight:850;text-align:center;margin:12px 0 30px;letter-spacing:-.04em;background:linear-gradient(135deg,#d8fff2,#5ee8bd 45%,#10b981);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 8px 28px rgba(16,185,129,.2))}
.back{display:inline-flex;align-items:center;gap:7px;color:#b3c3bd;text-decoration:none;font-size:.88rem;font-weight:700;padding:9px 13px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(9,19,17,.72);backdrop-filter:blur(10px);transition:.2s}.back:hover{color:#fff;border-color:rgba(80,227,194,.45);transform:translateX(-2px)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;width:100%}
.card{position:relative;display:grid;grid-template-columns:152px 1fr;min-height:184px;overflow:hidden;background:linear-gradient(145deg,rgba(20,34,30,.94),rgba(10,19,17,.96));border:1px solid rgba(179,218,205,.13);border-radius:18px;text-decoration:none;color:#fff;box-shadow:0 18px 45px rgba(0,0,0,.28);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.card::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 45%,rgba(80,227,194,.06));opacity:0;transition:.22s;pointer-events:none}.card:hover{transform:translateY(-5px);border-color:rgba(80,227,194,.48);box-shadow:0 24px 62px rgba(0,0,0,.42),0 0 0 1px rgba(80,227,194,.08)}.card:hover::after{opacity:1}
.card.no-image{grid-template-columns:1fr;min-height:184px;background:linear-gradient(145deg,rgba(22,39,34,.96),rgba(9,19,16,.97))}.card.no-image .card-content{padding:25px 26px}.card.no-image .card-kicker::before{content:"◆";margin-right:7px;color:#2ed3a0}
.card-media{position:relative;overflow:hidden;background:#07100e}.card-image{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease,filter .35s ease}.card:hover .card-image{transform:scale(1.055);filter:saturate(1.08)}.card-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,rgba(10,19,17,.86))}
.card-content{padding:22px 22px 19px 18px;display:flex;flex-direction:column;min-width:0}.card-kicker{color:#55deb3;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:7px}.card-title{display:block;margin-bottom:8px;font-size:1.27rem;font-weight:800;letter-spacing:-.02em}.card-description{flex:1;margin:0 0 15px;color:#9fb1ab;font-size:.86rem;line-height:1.55}.card-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#d9eee7;font-size:.78rem;font-weight:700}.version-pill{padding:6px 9px;border-radius:999px;background:rgba(16,185,129,.12);border:1px solid rgba(52,211,153,.2);color:#67e8b8}.card-arrow{font-size:1.1rem;color:#55deb3;transition:transform .2s}.card:hover .card-arrow{transform:translateX(4px)}
.toolbar{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin:4px 0 14px}.toolbar label{color:#91a59e;font-size:.82rem}.sort-select{background:rgba(10,21,18,.88);color:#e0ece8;border:1px solid rgba(179,218,205,.17);border-radius:10px;padding:9px 12px;cursor:pointer}.sort-select:focus,.sort-select:hover{border-color:#34d399;outline:none}
.box{width:100%;overflow-x:auto;background:rgba(8,17,15,.9);border:1px solid rgba(179,218,205,.13);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.36);backdrop-filter:blur(16px)}table{width:100%;border-collapse:collapse;min-width:720px}th,td{padding:16px 20px;text-align:left;font-size:.9rem;border-bottom:1px solid rgba(179,218,205,.09)}th{color:#89a099;font-weight:750;font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;background:rgba(255,255,255,.015)}tr:last-child td{border-bottom:0}tbody tr{transition:.15s}tbody tr:hover td{background:rgba(80,227,194,.035)}
.badge-container,.download-cell{display:flex;align-items:center;gap:10px}.badge{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:7px;color:#fff;font-size:.69rem;font-weight:850}.badge-R{background:#0fa875}.badge-B{background:#d98b0b}.badge-A{background:#d94747}.version-text{color:#f3faf7;font-weight:750}
.plat{display:inline-flex;background:rgba(255,255,255,.045);padding:5px 10px;border:1px solid rgba(255,255,255,.08);border-radius:999px;color:#aebdb8;font-size:.78rem;font-weight:650}.platform-Fabric{color:#d9ccb0}.platform-Forge{color:#f0a170}.platform-NeoForge{color:#ed8585}.platform-Quilt{color:#cbb0f1}
.download-cell{justify-content:flex-end}.download-count{min-width:28px;text-align:right;color:#8fa39c;font-size:.8rem}.arrow{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:7px;border-radius:10px;color:#58e3b7;background:rgba(16,185,129,.1);border:1px solid rgba(52,211,153,.18);transition:.18s}.arrow:hover{color:#eafff8;background:rgba(16,185,129,.25);transform:translateY(-2px)}
.footer-note{text-align:center;color:#71867f;font-size:.75rem;margin-top:26px}
.home-hero{max-width:850px;margin:0 auto 34px;text-align:center}.home-title{font-size:clamp(2.35rem,5vw,4.5rem);line-height:1;margin:12px 0 18px;letter-spacing:-.055em}.home-title span{background:linear-gradient(135deg,#f3fff9 15%,#66e7bd 60%,#19a978);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.home-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:25px}.primary-button,.secondary-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 18px;border-radius:12px;text-decoration:none;font-size:.86rem;font-weight:800;transition:.2s}.primary-button{color:#06110d;background:linear-gradient(135deg,#65ebbd,#25c58f);box-shadow:0 10px 28px rgba(16,185,129,.25)}.primary-button:hover{transform:translateY(-2px);box-shadow:0 15px 35px rgba(16,185,129,.35)}.secondary-button{color:#dcebe6;background:rgba(10,23,19,.76);border:1px solid rgba(179,218,205,.16)}.secondary-button:hover{border-color:rgba(80,227,194,.43);transform:translateY(-2px)}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card,.content-panel{background:linear-gradient(145deg,rgba(19,34,29,.92),rgba(8,18,15,.95));border:1px solid rgba(179,218,205,.13);border-radius:17px;box-shadow:0 18px 46px rgba(0,0,0,.28);backdrop-filter:blur(14px)}.feature-card{padding:24px;text-decoration:none;color:#eef8f4;transition:.2s}.feature-card:hover{transform:translateY(-4px);border-color:rgba(80,227,194,.42)}.feature-icon{display:flex;align-items:center;justify-content:center;width:42px;height:42px;margin-bottom:17px;border-radius:12px;background:rgba(16,185,129,.12);border:1px solid rgba(80,227,194,.16);color:#5ee8bd;font-size:1.15rem}.feature-card h2{font-size:1.06rem;margin:0 0 8px}.feature-card p{margin:0;color:#98aaa4;font-size:.84rem;line-height:1.58}
.home-story{position:relative;max-width:1050px;margin:0 auto 52px;padding:38px;overflow:hidden;border:1px solid rgba(104,232,191,.2);border-radius:22px;background:linear-gradient(145deg,rgba(18,35,29,.96),rgba(7,17,14,.97));box-shadow:0 24px 65px rgba(0,0,0,.38);backdrop-filter:blur(16px)}.home-story::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,transparent,#5be4b8,transparent)}.home-story-header{text-align:center;max-width:850px;margin:0 auto 30px}.home-story-header h2{margin:8px 0 10px;font-size:clamp(1.65rem,3vw,2.4rem)}.home-story-tagline{margin:0;color:#69e7bd;font-size:clamp(.9rem,2vw,1.08rem);font-weight:800;letter-spacing:.035em}.home-story-lead{max-width:900px;margin:0 auto 26px;color:#bdcbc6;font-size:.96rem;line-height:1.85;text-align:center}.home-story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.home-story-section{padding:25px;border:1px solid rgba(179,218,205,.11);border-radius:17px;background:rgba(5,16,12,.58)}.home-story-section h3{margin:0 0 12px;color:#ecf7f3;font-size:1.13rem;text-align:center}.home-story-section p{margin:0;color:#a8b9b3;font-size:.87rem;line-height:1.75;text-align:center}.home-story-section strong{color:#dffaf1}.home-story-closing{max-width:900px;margin:27px auto 0;padding:20px 22px;border-radius:15px;background:linear-gradient(135deg,rgba(16,185,129,.13),rgba(7,28,21,.45));border:1px solid rgba(80,227,194,.18);color:#c8d8d2;font-size:.93rem;line-height:1.75;text-align:center}.home-story-closing strong{color:#69e7bd}.home-story+.home-actions{margin:0 0 42px}.home-actions+.feature-grid{margin-top:0}
.home-story{max-width:960px;padding:0;overflow:visible;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none}.home-story::before{display:none}.home-story-header{margin-bottom:32px}.home-story-lead,.home-story-section,.home-story-closing{width:100%;max-width:none;margin:0;padding:29px 32px;border:1px solid rgba(80,227,194,.2);border-radius:17px;background:linear-gradient(135deg,rgba(16,185,129,.13),rgba(7,28,21,.48));box-shadow:0 17px 42px rgba(0,0,0,.28),inset 0 1px rgba(130,255,217,.035)}.home-story-lead{color:#c3d2cd;font-size:1.01rem;line-height:1.9}.home-story-grid{display:flex;flex-direction:column;gap:22px;margin-top:22px}.home-story-section{transition:transform .22s,border-color .22s,box-shadow .22s}.home-story-section:hover{transform:translateY(-3px);border-color:rgba(80,227,194,.38);box-shadow:0 22px 52px rgba(0,0,0,.36),0 0 30px rgba(16,185,129,.055)}.home-story-section h3{font-size:1.22rem}.home-story-section p{color:#b6c6c0;font-size:.94rem;line-height:1.82}.home-story-closing{margin-top:22px;padding:25px 30px;font-size:1rem;box-shadow:0 17px 42px rgba(0,0,0,.28),0 0 34px rgba(16,185,129,.07)}
.home-story-lead h3{margin:0 0 13px;color:#ecf7f3;font-size:1.22rem;line-height:1.35;text-align:center}.home-story-lead p{margin:0;color:#c3d2cd;font:inherit;line-height:inherit;text-align:center}
.content-panel{max-width:960px;margin:0 auto;padding:clamp(28px,4vw,48px);text-align:center}.content-panel h1{font-size:clamp(2rem,4vw,3.1rem);margin:10px 0 13px;letter-spacing:-.04em;text-align:center}.content-panel h2{font-size:1.12rem;margin:0 0 9px;text-align:center}.content-panel>p{max-width:760px;margin-left:auto;margin-right:auto;color:#a4b5af;line-height:1.72;text-align:center}
.section-heading{margin:38px 0 8px;text-align:center;font-size:clamp(1.35rem,2.4vw,1.85rem)!important}.section-copy{max-width:720px;margin:0 auto 20px;color:#94a8a1;font-size:.9rem;line-height:1.65;text-align:center}
.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:30px}.info-item{min-height:138px;padding:26px 22px;border-radius:16px;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018));border:1px solid rgba(179,218,205,.11);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:.2s}.info-item:hover{transform:translateY(-3px);border-color:rgba(80,227,194,.35);background:rgba(39,91,74,.13)}.info-symbol{display:flex;align-items:center;justify-content:center;width:38px;height:38px;margin-bottom:13px;border-radius:11px;color:#65e8bd;background:rgba(16,185,129,.12);border:1px solid rgba(80,227,194,.17);font-size:1.05rem}.info-label{display:block;color:#6ee9c0;font-size:.7rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase;margin-bottom:7px}.info-value{font-size:1.03rem;font-weight:780;color:#edf8f4}.info-detail{margin-top:7px;color:#91a59e;font-size:.78rem;line-height:1.45}
.server-status-card{width:100%;margin-top:30px;min-height:170px;padding:28px 32px;border-radius:18px;background:linear-gradient(145deg,rgba(20,34,30,.94),rgba(10,19,17,.96));border:1px solid rgba(179,218,205,.13);box-shadow:0 18px 45px rgba(0,0,0,.28);display:flex;align-items:center;justify-content:space-between;gap:28px;text-align:left;transition:.2s}.server-status-card:hover{transform:translateY(-3px);border-color:rgba(80,227,194,.35);box-shadow:0 24px 62px rgba(0,0,0,.42)}.server-status-main{display:flex;align-items:center;gap:17px}.server-status-dot{width:16px;height:16px;flex:0 0 auto;border-radius:50%;background:#8a9994;box-shadow:0 0 0 6px rgba(138,153,148,.1)}.server-status-card.online .server-status-dot{background:#34d399;box-shadow:0 0 0 6px rgba(52,211,153,.1),0 0 18px rgba(52,211,153,.55)}.server-status-card.offline .server-status-dot{background:#ef5350;box-shadow:0 0 0 6px rgba(239,83,80,.1),0 0 18px rgba(239,83,80,.4)}.server-status-title{display:block;color:#6ee9c0;font-size:.76rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase;margin-bottom:7px}.server-status-state{font-size:1.35rem;font-weight:850;color:#edf8f4}.server-status-card.online .server-status-state{color:#65e8bd}.server-status-card.offline .server-status-state{color:#ff817d}.server-status-data{text-align:right}.server-status-players{display:block;font-size:1.2rem;font-weight:800;color:#edf8f4}.server-status-version{display:block;margin-top:7px;color:#91a59e;font-size:.86rem}.server-status-version:empty{display:none}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}.step{padding:21px 17px;border-radius:14px;background:rgba(8,20,17,.62);border:1px solid rgba(179,218,205,.1);text-align:center}.step-number{display:flex;align-items:center;justify-content:center;width:32px;height:32px;margin:0 auto 12px;border-radius:50%;background:#19b77f;color:#06110d;font-weight:900}.step strong{display:block;margin-bottom:6px}.step span{color:#8fa39c;font-size:.78rem;line-height:1.45}
.rules-list{display:grid;grid-template-columns:1fr;gap:15px;max-width:820px;margin:30px auto 0;padding:0;list-style:none;counter-reset:rules}.rule{counter-increment:rules;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px 30px;border-radius:16px;background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.018));border:1px solid rgba(179,218,205,.1);text-align:center;transition:.2s}.rule:hover{transform:translateY(-2px);border-color:rgba(80,227,194,.3)}.rule::before{content:counter(rules);display:flex;align-items:center;justify-content:center;width:38px;height:38px;margin:0 auto 13px;border-radius:11px;background:rgba(16,185,129,.14);border:1px solid rgba(80,227,194,.16);color:#66e7bd;font-weight:850}.rule h2{text-align:center}.rule p{max-width:700px;margin:4px auto 0;color:#9fb0aa;font-size:.86rem;line-height:1.65;text-align:center}.rules-notice{max-width:820px;margin:24px auto 0;padding:18px 20px;border-radius:14px;background:rgba(245,158,11,.07);border:1px solid rgba(245,158,11,.16);color:#d7b477;font-size:.82rem;line-height:1.6;text-align:center}.placeholder-badge{display:inline-flex;padding:7px 10px;border-radius:999px;background:rgba(245,158,11,.11);border:1px solid rgba(245,158,11,.2);color:#f5bd61;font-size:.73rem;font-weight:800}
/* Freistehendes Kartenlayout fuer Server, Regeln und Discord */
.content-panel{max-width:none;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none}
.content-panel>p{max-width:760px;margin:0 auto}
.info-grid{gap:22px}.info-item{min-height:170px;padding:28px 25px;border-radius:18px;background:linear-gradient(145deg,rgba(20,34,30,.94),rgba(10,19,17,.96));border-color:rgba(179,218,205,.13);box-shadow:0 18px 45px rgba(0,0,0,.28)}.info-item:hover{transform:translateY(-5px);border-color:rgba(80,227,194,.48);box-shadow:0 24px 62px rgba(0,0,0,.42)}
.steps{gap:22px}.step{min-height:185px;padding:27px 22px;border-radius:18px;background:linear-gradient(145deg,rgba(20,34,30,.94),rgba(10,19,17,.96));border-color:rgba(179,218,205,.13);box-shadow:0 18px 45px rgba(0,0,0,.28);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:.22s}.step:hover{transform:translateY(-5px);border-color:rgba(80,227,194,.48)}
.rules-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:none}.rule{min-height:250px;padding:28px 30px;border-radius:18px;background:linear-gradient(145deg,rgba(20,34,30,.94),rgba(10,19,17,.96));border-color:rgba(179,218,205,.13);box-shadow:0 18px 45px rgba(0,0,0,.28)}.rule:hover{transform:translateY(-5px);border-color:rgba(80,227,194,.48);box-shadow:0 24px 62px rgba(0,0,0,.42)}.rules-notice{background:rgba(10,19,17,.94);box-shadow:0 18px 45px rgba(0,0,0,.28)}
.discord-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px}.discord-card{min-height:210px;padding:28px 24px;border-radius:18px;background:linear-gradient(145deg,rgba(20,34,30,.94),rgba(10,19,17,.96));border:1px solid rgba(179,218,205,.13);box-shadow:0 18px 45px rgba(0,0,0,.28);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:.22s}.discord-card:hover{transform:translateY(-5px);border-color:rgba(80,227,194,.48);box-shadow:0 24px 62px rgba(0,0,0,.42)}.discord-card h2{margin:13px 0 8px}.discord-card p{margin:0;color:#98aaa4;font-size:.84rem;line-height:1.6}.discord-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:rgba(16,185,129,.12);border:1px solid rgba(80,227,194,.17);color:#5ee8bd;font-size:1.15rem}
/* Bildkarten fuer die Serverinformationen */
.info-grid{align-items:stretch}.info-item{min-height:390px;padding:0 30px 30px;overflow:hidden;justify-content:flex-start}.info-item::before{content:"";display:block;flex:0 0 auto;width:calc(100% + 60px);height:190px;margin:0 -30px 24px;background-position:center;background-size:cover;border-bottom:1px solid rgba(179,218,205,.14);box-shadow:inset 0 -55px 50px -35px rgba(8,17,15,.95)}.info-item:nth-child(1)::before,.info-item:nth-child(2)::before{background-image:linear-gradient(180deg,transparent 60%,rgba(8,17,15,.9)),image-set(url('/img/server-world-1080.f96b1dcfd8.avif') type('image/avif'),url('/img/server-world-1080.db6ab848a2.webp') type('image/webp'),url('/img/server-world-1080.4fd69f8784.jpg') type('image/jpeg'))}.info-item:nth-child(3)::before,.info-item:nth-child(5)::before{background-image:linear-gradient(180deg,transparent 60%,rgba(8,17,15,.9)),image-set(url('/img/server-quests-1080.593937512d.avif') type('image/avif'),url('/img/server-quests-1080.8bff6857f0.webp') type('image/webp'),url('/img/server-quests-1080.d484a97c54.jpg') type('image/jpeg'))}.info-item:nth-child(4)::before,.info-item:nth-child(6)::before{background-image:linear-gradient(180deg,transparent 60%,rgba(8,17,15,.9)),image-set(url('/img/server-community-1080.9b9b9ff24d.avif') type('image/avif'),url('/img/server-community-1080.6be4bd65ce.webp') type('image/webp'),url('/img/server-community-1080.604975d76f.jpg') type('image/jpeg'))}.info-symbol{width:46px;height:46px;margin-top:-47px;position:relative;z-index:1;background:rgba(7,20,16,.94);box-shadow:0 8px 22px rgba(0,0,0,.35)}.info-label{font-size:.76rem;margin-top:4px}.info-value{font-size:1.28rem;line-height:1.3}.info-detail{font-size:.94rem;line-height:1.65;margin-top:10px;color:#adbbb6}
/* Server-Startbereich und Minecraft-Wissensseiten */
.content-panel .section-heading{margin-top:78px!important}.content-panel .section-copy{margin-bottom:34px}.content-panel .steps{margin-top:0}
.minecraft-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.minecraft-card{min-height:270px;padding:32px!important;text-align:center;align-items:center}.minecraft-card .guide-icon{display:flex;align-items:center;justify-content:center;width:76px;height:76px;margin:0 auto 20px;border-radius:20px;background:linear-gradient(145deg,rgba(45,210,157,.2),rgba(10,86,65,.3));border:1px solid rgba(95,232,190,.28);box-shadow:0 16px 35px rgba(0,0,0,.28);font-size:2rem}.minecraft-card .card-title{font-size:1.45rem}.minecraft-card .card-description{font-size:.94rem;line-height:1.7}.article-shell{width:min(1120px,100%);margin:0 auto}.article-section{margin:26px 0;padding:30px;border:1px solid rgba(179,218,205,.13);border-radius:19px;background:linear-gradient(145deg,rgba(20,34,30,.94),rgba(10,19,17,.96));box-shadow:0 18px 45px rgba(0,0,0,.28)}.article-section h2{margin:0 0 12px;text-align:center;font-size:1.45rem}.article-section>p{max-width:850px;margin:0 auto;color:#a9bbb5;text-align:center;line-height:1.75}.beginner-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}.beginner-step{padding:21px;border-radius:15px;background:rgba(7,21,17,.7);border:1px solid rgba(179,218,205,.11);text-align:center}.beginner-step strong{display:block;color:#6ee9c0;margin-bottom:8px}.beginner-step span{color:#a4b5af;font-size:.86rem;line-height:1.6}.recipe-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:28px}.recipe-card{display:grid;grid-template-columns:172px 1fr;gap:22px;align-items:center;padding:22px;border-radius:17px;background:rgba(7,20,16,.72);border:1px solid rgba(179,218,205,.12)}.recipe-grid{display:grid;grid-template-columns:repeat(3,48px);grid-template-rows:repeat(3,48px);gap:4px;padding:10px;border-radius:12px;background:#080e0c;border:2px solid #5c6e66;box-shadow:inset 0 0 18px rgba(0,0,0,.7)}.recipe-slot{display:flex;align-items:center;justify-content:center;border:1px solid #43534d;background:#18231f;color:#dcebe6;font-size:.62rem;font-weight:800;text-align:center;line-height:1.05;padding:2px}.recipe-slot.filled{background:linear-gradient(145deg,#315245,#17362c);border-color:#57957e;color:#effff9}.recipe-info h3{margin:0 0 8px;font-size:1.1rem}.recipe-info p{margin:0;color:#99aca5;font-size:.84rem;line-height:1.6}.recipe-output{display:inline-flex;margin-top:10px;padding:6px 9px;border-radius:999px;color:#66e7bd;background:rgba(16,185,129,.11);border:1px solid rgba(80,227,194,.17);font-size:.76rem;font-weight:750}.enchant-nav{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:22px 0}.enchant-nav a{padding:8px 12px;border-radius:999px;background:rgba(16,185,129,.1);border:1px solid rgba(80,227,194,.16);color:#bfe9dc;text-decoration:none;font-size:.78rem}.enchant-group{margin:25px 0}.enchant-group h2{text-align:center;margin:0 0 14px}.enchant-table-wrap{overflow-x:auto;border-radius:17px;border:1px solid rgba(179,218,205,.13);background:rgba(8,17,15,.91);box-shadow:0 18px 45px rgba(0,0,0,.28)}.enchant-table{min-width:850px}.enchant-table td{vertical-align:top;line-height:1.5}.enchant-name{color:#66e7bd;font-weight:800}.level-pill{display:inline-flex;min-width:42px;justify-content:center;padding:5px 8px;border-radius:999px;background:rgba(16,185,129,.12);border:1px solid rgba(80,227,194,.17);font-weight:800}.source-note{margin-top:30px;padding:18px;text-align:center;color:#8fa39c;font-size:.8rem;line-height:1.6}.source-note a{color:#66e7bd}
.minecraft-image-card{grid-template-columns:190px minmax(0,1fr);min-height:280px}.minecraft-image-card .card-media{height:100%;min-height:280px}.minecraft-image-card .card-media img{width:100%;height:100%;object-fit:cover}.minecraft-image-card .card-content{padding:29px}.minecraft-image-card .card-title{font-size:1.35rem}.minecraft-image-card .card-description{font-size:.9rem;line-height:1.65}.recipe-item-icon{display:block;width:34px;height:34px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 3px 2px rgba(0,0,0,.5))}
.fabric-tools{margin:0 0 34px}.fabric-tools-heading{margin:0 0 14px;text-align:center;color:#dce9e4;font-size:1.05rem}.fabric-tools-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.fabric-tool-card{appearance:none;width:100%;min-height:150px;padding:0;display:grid;grid-template-columns:170px minmax(0,1fr);overflow:hidden;border:1px solid rgba(179,218,205,.14);border-radius:17px;background:linear-gradient(145deg,rgba(20,34,30,.96),rgba(8,17,15,.98));color:inherit;text-align:left;cursor:pointer;box-shadow:0 16px 38px rgba(0,0,0,.26);transition:transform .22s,border-color .22s,box-shadow .22s}.fabric-tool-card:hover{transform:translateY(-4px);border-color:rgba(80,227,194,.48);box-shadow:0 23px 52px rgba(0,0,0,.4)}.fabric-tool-media{height:150px;overflow:hidden}.fabric-tool-media img{width:100%;height:100%;display:block;object-fit:cover}.fabric-tool-content{min-width:0;padding:20px 22px;display:flex;flex-direction:column;justify-content:center}.fabric-tool-kicker{color:#63e6bc;font-size:.67rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.fabric-tool-title{margin-top:5px;color:#f1f7f5;font-size:1.12rem;font-weight:850}.fabric-tool-description{margin:7px 0 10px;color:#9eafa9;font-size:.78rem;line-height:1.5}.fabric-tool-action{color:#68e8bf;font-size:.75rem;font-weight:800}.download-modal[hidden]{display:none}.download-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}.download-modal-backdrop{position:absolute;inset:0;background:rgba(2,8,6,.82);backdrop-filter:blur(7px)}.download-modal-panel{position:relative;width:min(440px,100%);padding:30px;border:1px solid rgba(102,231,189,.3);border-radius:20px;background:linear-gradient(145deg,#14251f,#08110f);box-shadow:0 28px 90px rgba(0,0,0,.65);text-align:center}.download-modal-panel h2{margin:0 0 10px}.download-modal-panel p{margin:0;color:#a9bbb5;line-height:1.65}.download-modal-actions{display:flex;justify-content:center;gap:12px;margin-top:24px}.download-modal-actions button,.download-modal-actions a{min-width:135px;padding:12px 16px;border-radius:12px;font:inherit;font-size:.82rem;font-weight:850;text-decoration:none;cursor:pointer}.download-modal-cancel{border:1px solid rgba(179,218,205,.2);background:#0a1713;color:#d8e5e0}.download-modal-confirm{border:1px solid #4fe0b5;background:linear-gradient(135deg,#65e8c1,#23c999);color:#06110e}
.mods-library-intro{padding-bottom:28px}.fabric-tools{margin:0 auto 72px}.fabric-tools-copy{max-width:780px;margin:0 auto 22px;color:#a9bbb5;text-align:center;line-height:1.7}.fabric-tools-heading{margin:0 0 9px;font-size:1.42rem}.fabric-tools-grid{width:min(700px,100%);margin:0 auto;gap:14px}.fabric-tool-card{min-height:90px;grid-template-columns:102px minmax(0,1fr);border-radius:14px}.fabric-tool-media{height:90px}.fabric-tool-content{padding:10px 14px}.fabric-tool-kicker{font-size:.57rem}.fabric-tool-title{margin-top:3px;font-size:.94rem}.fabric-tool-description{display:none}.fabric-tool-action{margin-top:6px;font-size:.66rem}.mods-catalog-intro{padding-top:0;padding-bottom:30px}.mods-catalog-intro .page-title{font-size:clamp(1.7rem,3vw,2.35rem)}
@media(max-width:850px){.fabric-tools-grid{width:min(420px,100%);grid-template-columns:1fr}.fabric-tool-card{grid-template-columns:102px minmax(0,1fr)}}
@media(max-width:480px){.fabric-tool-card{grid-template-columns:82px minmax(0,1fr)}.fabric-tool-media{height:90px}.fabric-tool-content{padding:9px 12px}.fabric-tool-action{font-size:.62rem}.download-modal-actions{flex-direction:column}.download-modal-actions button,.download-modal-actions a{width:100%}}
@media(max-width:850px){.home-story{padding:0}.home-story-lead,.home-story-section,.home-story-closing{padding:25px 24px}.home-story-lead{text-align:left}.home-story-section p{text-align:left}}
@media(max-width:520px){.home-story{padding:0;margin-bottom:38px}.home-story-lead,.home-story-section,.home-story-closing{padding:21px 18px}.home-story-header{margin-bottom:23px}.home-story-lead{font-size:.96rem}.home-story-section p{font-size:.91rem}}
@media(min-aspect-ratio:21/10){.banner-hero{height:clamp(300px,min(18vw,35vh),560px)}}
@media(min-aspect-ratio:3/1){.banner-hero{height:clamp(380px,min(14vw,45vh),680px)}}
@media(max-width:850px){.grid{grid-template-columns:1fr}.card{grid-template-columns:135px 1fr}.feature-grid{grid-template-columns:1fr}.feature-card{display:grid;grid-template-columns:48px 1fr;column-gap:14px}.feature-icon{grid-row:1/3;margin:0}.feature-card h2{align-self:end}.info-grid,.steps,.rules-list,.discord-grid,.minecraft-grid,.beginner-steps,.recipe-list{grid-template-columns:1fr}.info-item{min-height:380px}.rule{min-height:0}.content-panel .section-heading{margin-top:62px!important}}
@media(max-width:520px){.info-item{min-height:355px;padding:0 22px 25px}.info-item::before{width:calc(100% + 44px);height:165px;margin-left:-22px;margin-right:-22px}.info-value{font-size:1.16rem}.info-detail{font-size:.88rem}.article-section{padding:22px 15px}.recipe-card{grid-template-columns:1fr;text-align:center}.recipe-grid{margin:0 auto}.minecraft-card{min-height:240px;padding:25px!important}}
@media(max-width:520px){.server-status-card{padding:25px 22px;align-items:flex-start;flex-direction:column;gap:18px}.server-status-data{text-align:left;padding-left:33px}.server-status-state{font-size:1.2rem}.server-status-players{font-size:1.05rem}}
@media(max-width:700px){body{background-attachment:scroll}.banner-hero{height:clamp(120px,30vw,180px)}.server-banner{object-position:center 58%}.site-nav-wrap{margin-top:80px;padding:0 12px;overflow-x:auto;justify-content:flex-start;scrollbar-width:none}.site-nav-wrap::-webkit-scrollbar{display:none}.site-nav{margin:0 auto;gap:10px;padding:5px}.nav-link{min-width:88px;min-height:44px;padding:11px 15px;border-radius:13px;font-size:.77rem}.container{padding:30px 14px 34px}.card{grid-template-columns:112px 1fr;min-height:160px}.card-content{padding:17px 16px 15px 14px}.card-description{font-size:.8rem}.toolbar{justify-content:center}.page-copy{font-size:.92rem}}
@media(max-width:430px){.card{grid-template-columns:94px 1fr}.card-description{display:none}.card-title{font-size:1.05rem}.card-footer{margin-top:auto}.version-pill{padding:5px 7px}}
/* --- Rendering-Verbesserungen (neu) --- */
html{scroll-behavior:smooth}
img{max-width:100%}
.enchant-group{content-visibility:auto;contain-intrinsic-size:auto 640px}
.card,.info-item,.step{contain:layout paint}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* --- Verzauberungstabellen: gleiche Spaltenbreiten in allen Gruppen --- */
.enchant-table{table-layout:fixed}
.enchant-table th,.enchant-table td{vertical-align:top;overflow-wrap:anywhere;hyphens:auto}
.enchant-table th:nth-child(1),.enchant-table td:nth-child(1){width:23%}
.enchant-table th:nth-child(2),.enchant-table td:nth-child(2){width:86px}
.enchant-table th:nth-child(3),.enchant-table td:nth-child(3){width:auto}
.enchant-table th:nth-child(4),.enchant-table td:nth-child(4){width:23%}
.enchant-table .enchant-name{display:block}
.enchant-table .level-pill{margin-top:1px}
@media (max-width:760px){
.enchant-table th:nth-child(1),.enchant-table td:nth-child(1){width:26%}
.enchant-table th:nth-child(4),.enchant-table td:nth-child(4){width:24%}
}

/* --- Upload-Datum als Glaskachel (Versionsliste) --- */
.date-pill{
display:inline-flex;align-items:center;gap:7px;padding:6px 13px 6px 11px;border-radius:999px;
font-size:.78rem;font-weight:650;letter-spacing:.01em;color:#d5e8e1;white-space:nowrap;cursor:default;
background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.028) 58%,rgba(120,255,215,.05));
border:1px solid rgba(255,255,255,.13);
-webkit-backdrop-filter:blur(12px) saturate(150%);backdrop-filter:blur(12px) saturate(150%);
box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(0,0,0,.18),0 3px 10px rgba(0,0,0,.3);
transition:border-color .2s ease,box-shadow .2s ease,color .2s ease}
.date-pill::before{
content:"";width:6px;height:6px;border-radius:50%;flex:0 0 auto;background:#5ee8bd;
box-shadow:0 0 7px rgba(94,232,189,.75);opacity:.85}
tbody tr:hover .date-pill{
border-color:rgba(94,232,189,.4);color:#eafaf5;
box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 4px 14px rgba(0,0,0,.34)}
@media (max-width:760px){.date-pill{font-size:.72rem;padding:5px 10px 5px 9px}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
.date-pill{background:linear-gradient(145deg,rgba(30,54,47,.95),rgba(14,28,24,.95))}}

/* ============================================================
   Feinschliff Version 2 - wird hinter style.css geladen
   ============================================================ */

/* --- Inhaltsbereich (Ziel der Sprungmarke) ---
   Muss die Zentrierung des <body> weiterreichen, sonst klebt der ganze
   Seiteninhalt am linken Rand. */
#inhalt{display:flex;flex-direction:column;align-items:center;width:100%;max-width:100%}

/* --- Tastaturbedienung --- */
.skip-link{position:absolute;left:12px;top:-60px;z-index:99;padding:11px 18px;border-radius:0 0 12px 12px;
background:#0e2b23;color:#eafaf5;font-weight:800;text-decoration:none;border:1px solid rgba(94,232,189,.5);
transition:top .18s ease}
.skip-link:focus{top:0}
a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
outline:2px solid #5ee8bd;outline-offset:3px;border-radius:10px}
::selection{background:rgba(94,232,189,.28);color:#f2fffb}

/* (Bannerhoehe siehe Abschnitt "Hauptbanner" weiter unten) */

/* Etwas groessere, ruhigere Kleintexte (Ausrichtung bleibt wie gehabt: mittig) */
.info-detail,.step span,.feature-card p,.discord-card p,.card-description{
font-size:.85rem;line-height:1.6;color:#a2b5ae}
.fabric-tool-description{font-size:.82rem;color:#a2b5ae}

/* --- Info-Kacheln: gleiche Hoehe, jede mit eigenem Bild --- */
.info-grid{align-items:stretch}
.info-item{height:100%;min-height:172px}
.info-item:nth-child(1)::before{background-image:linear-gradient(180deg,transparent 58%,rgba(8,17,15,.92)),image-set(url('/img/tile-adresse-640.26eb55029e.avif') type('image/avif'),url('/img/tile-adresse-640.6a77a2d8f5.webp') type('image/webp'),url('/img/tile-adresse-640.5ef27e5af5.jpg') type('image/jpeg'))}
.info-item:nth-child(2)::before{background-image:linear-gradient(180deg,transparent 58%,rgba(8,17,15,.92)),image-set(url('/img/tile-verfuegbarkeit-640.1128976821.avif') type('image/avif'),url('/img/tile-verfuegbarkeit-640.d053b798e3.webp') type('image/webp'),url('/img/tile-verfuegbarkeit-640.b1d15136ef.jpg') type('image/jpeg'))}
.info-item:nth-child(3)::before{background-image:linear-gradient(180deg,transparent 58%,rgba(8,17,15,.92)),image-set(url('/img/tile-mods-640.3a0ea15f15.avif') type('image/avif'),url('/img/tile-mods-640.df6a219785.webp') type('image/webp'),url('/img/tile-mods-640.22eeda35c8.jpg') type('image/jpeg'))}
.info-item:nth-child(4)::before{background-image:linear-gradient(180deg,transparent 58%,rgba(8,17,15,.92)),image-set(url('/img/tile-spielerlebnis-640.502b2881bc.avif') type('image/avif'),url('/img/tile-spielerlebnis-640.af26fe3d0c.webp') type('image/webp'),url('/img/tile-spielerlebnis-640.4c4b4d9445.jpg') type('image/jpeg'))}
.info-item:nth-child(5)::before{background-image:linear-gradient(180deg,transparent 58%,rgba(8,17,15,.92)),image-set(url('/img/tile-quests-640.f03193db24.avif') type('image/avif'),url('/img/tile-quests-640.39b94c5695.webp') type('image/webp'),url('/img/tile-quests-640.814ddbca50.jpg') type('image/jpeg'))}
.info-item:nth-child(6)::before{background-image:linear-gradient(180deg,transparent 58%,rgba(8,17,15,.92)),image-set(url('/img/tile-community-640.4ba72c4b2a.avif') type('image/avif'),url('/img/tile-community-640.ca42dc6994.webp') type('image/webp'),url('/img/tile-community-640.e13be226a8.jpg') type('image/jpeg'))}

/* --- Serverstatus: die Zahl in den Mittelpunkt --- */
.server-status-card{flex-wrap:wrap;gap:22px 34px;align-items:center}
.server-status-card.online .server-status-dot{animation:puls 2.6s ease-in-out infinite}
@keyframes puls{
0%,100%{box-shadow:0 0 0 6px rgba(52,211,153,.1),0 0 18px rgba(52,211,153,.5)}
50%{box-shadow:0 0 0 11px rgba(52,211,153,.045),0 0 26px rgba(52,211,153,.75)}}
.server-status-data{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.server-status-players{display:flex;align-items:baseline;gap:8px;font-size:1rem;font-weight:700;color:#a9bdb6}
.server-status-players strong{font-size:clamp(2.2rem,4.6vw,3rem);font-weight:900;line-height:1;color:#eefaf6;
letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.server-status-card.online .server-status-players strong{color:#6df0c4;text-shadow:0 0 26px rgba(94,232,189,.32)}
.server-status-players-max{font-size:1.15rem;font-weight:800;color:#8fa8a1}
.server-status-players-text{font-size:.8rem;font-weight:700;letter-spacing:.02em;color:#93a8a1}

/* --- Banner als Live-Statuskarte --- */
.server-hero{margin-top:30px}
.server-hero-banner{position:relative;display:block;width:100%;padding:0;border:1px solid rgba(179,218,205,.16);
border-radius:20px;overflow:hidden;background:#0a1512;cursor:pointer;
box-shadow:0 26px 60px rgba(0,0,0,.45);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.server-hero-banner:hover{transform:translateY(-3px);border-color:rgba(94,232,189,.45);
box-shadow:0 32px 70px rgba(0,0,0,.55)}
.server-hero-banner:active{transform:translateY(-1px)}
.server-hero-image{display:block;width:100%;height:auto}
.server-hero-banner picture{display:block}

/* Dunkler Verlauf, damit die Werte auf dem Bild lesbar bleiben */
.server-hero-banner::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;pointer-events:none;
background:linear-gradient(180deg,transparent,rgba(4,10,9,.6) 42%,rgba(4,10,9,.93))}

/* Status auf dem Banner */
.server-hero-banner .server-status-card{position:absolute;left:0;right:0;bottom:0;z-index:2;
display:flex;align-items:flex-end;justify-content:space-between;gap:18px 30px;flex-wrap:wrap;
margin:0;min-height:0;padding:clamp(14px,2.2vw,26px) clamp(16px,2.6vw,32px);
background:none;border:0;border-radius:0;box-shadow:none;text-align:left;transform:none}
.server-hero-banner:hover .server-status-card{transform:none}
.server-status-main{display:flex;align-items:center;gap:14px}
.server-status-text{display:flex;flex-direction:column}
.server-status-title{text-shadow:0 2px 10px rgba(0,0,0,.85)}
.server-status-state{font-size:clamp(1.15rem,2.4vw,1.5rem);text-shadow:0 2px 12px rgba(0,0,0,.9)}
.server-status-card.online .server-status-state{color:#7bffd4}
.server-status-dot{width:15px;height:15px}
.server-status-card.online .server-status-dot{animation:puls 2.6s ease-in-out infinite}
@keyframes puls{
0%,100%{box-shadow:0 0 0 6px rgba(52,211,153,.14),0 0 18px rgba(52,211,153,.6)}
50%{box-shadow:0 0 0 11px rgba(52,211,153,.06),0 0 28px rgba(52,211,153,.85)}}

.server-status-data{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
.server-status-players{display:flex;align-items:baseline;gap:8px;font-size:1rem;font-weight:750;color:#e4f2ed;
text-shadow:0 2px 12px rgba(0,0,0,.9)}
.server-status-players strong{font-size:clamp(2.1rem,4.4vw,3.1rem);font-weight:900;line-height:1;color:#fff;
letter-spacing:-.03em;font-variant-numeric:tabular-nums;text-shadow:0 3px 18px rgba(0,0,0,.95)}
.server-status-card.online .server-status-players strong{color:#8dffdb;
text-shadow:0 0 26px rgba(94,232,189,.5),0 3px 18px rgba(0,0,0,.9)}
.server-status-players-max{font-size:1.1rem;font-weight:800;color:#d3e6e0}
.server-status-players-text{font-size:.8rem;font-weight:750;color:#c3d8d1}
.server-status-version{color:#bed3cc;text-shadow:0 2px 10px rgba(0,0,0,.9)}

/* Hinweis oben rechts auf dem Banner */
.server-hero-hint{position:absolute;top:14px;right:14px;z-index:3;display:inline-flex;align-items:center;gap:8px;
padding:8px 13px;border-radius:999px;color:#eafaf5;font-size:.76rem;font-weight:800;
background:rgba(6,16,13,.55);border:1px solid rgba(255,255,255,.22);
-webkit-backdrop-filter:blur(10px) saturate(150%);backdrop-filter:blur(10px) saturate(150%);
box-shadow:0 4px 16px rgba(0,0,0,.4);transition:.2s;opacity:.9}
.server-hero-banner:hover .server-hero-hint{opacity:1;border-color:rgba(94,232,189,.6);color:#a9ffe4}
.server-hero-hint svg{width:15px;height:15px}
.server-hero-banner.copied .server-hero-hint{background:rgba(16,185,129,.85);border-color:rgba(255,255,255,.5);color:#04120e}

/* Rueckmeldung nach dem Kopieren */
.copy-address-feedback{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.9);z-index:4;
padding:12px 22px;border-radius:14px;white-space:nowrap;pointer-events:none;
background:rgba(6,26,20,.92);border:1px solid rgba(94,232,189,.6);color:#8ff3cf;
font-size:1rem;font-weight:850;box-shadow:0 12px 34px rgba(0,0,0,.5);
opacity:0;transition:opacity .18s ease,transform .18s ease}
.server-hero-banner.copied .copy-address-feedback{opacity:1;transform:translate(-50%,-50%) scale(1)}

.server-hero-caption{margin:14px 0 0;text-align:center;color:#9fb5ae;font-size:.85rem;font-weight:650}

/* Auf schmalen Bildschirmen ist zu wenig Platz auf dem Bild:
   Status und Spielerzahl ruecken unter den Banner - der Klick bleibt gleich. */
@media (max-width:820px){
.server-hero-banner::after{display:none}
.server-hero-banner .server-status-card{position:static;flex-direction:column;align-items:center;
justify-content:center;gap:10px;padding:16px 18px 18px;text-align:center;
background:linear-gradient(180deg,rgba(10,22,18,.96),rgba(6,15,13,.98));
border-top:1px solid rgba(179,218,205,.12)}
.server-status-main{justify-content:center}
.server-status-text{align-items:center}
.server-status-data{align-items:center;text-align:center;padding-left:0}
.server-status-players strong{font-size:clamp(2rem,9vw,2.6rem)}
.server-hero-hint-text{display:none}
.server-hero-hint{padding:9px;top:10px;right:10px}
}

/* --- Discord --- */
.discord-icon svg{width:22px;height:22px}
.discord-button{display:inline-flex;align-items:center;gap:11px;padding:14px 24px;border-radius:14px;
text-decoration:none;font-size:.95rem;font-weight:850;color:#fff;
background:linear-gradient(135deg,#5865f2,#4149c9);border:1px solid rgba(255,255,255,.14);
box-shadow:0 14px 34px rgba(88,101,242,.32);transition:.2s}
.discord-button:hover{transform:translateY(-3px);box-shadow:0 20px 44px rgba(88,101,242,.45)}
.discord-button svg{width:23px;height:23px}

/* --- Versionstabelle --- */
.badge-legend{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
gap:9px 20px;padding:15px 20px;margin:0;
color:#8fa39c;font-size:.76rem;text-align:center;
border-bottom:1px solid rgba(179,218,205,.09);background:rgba(255,255,255,.012)}
.badge-legend-title{font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:#6ee9c0;font-size:.68rem}
.badge-legend-item{display:inline-flex;align-items:center;gap:7px}
.new-flag{display:inline-flex;align-items:center;padding:3px 9px;border-radius:999px;
background:linear-gradient(135deg,rgba(94,232,189,.28),rgba(16,185,129,.16));
border:1px solid rgba(94,232,189,.45);color:#8ff3cf;font-size:.62rem;font-weight:900;
letter-spacing:.09em;text-transform:uppercase}
.game-version{color:#c1c8d0}
.download-cell{display:flex;align-items:center;justify-content:flex-end;gap:12px}
.download-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 11px 5px 9px;border-radius:999px;
color:#b9cdc6;font-size:.76rem;font-weight:750;font-variant-numeric:tabular-nums;
background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.022));
border:1px solid rgba(255,255,255,.1);
-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.download-chip svg{width:13px;height:13px;color:#5ee8bd;opacity:.85}
tbody tr:hover .download-chip{border-color:rgba(94,232,189,.32);color:#e2f4ee}

/* --- Navigation auf dem Handy: zeigen, dass es weitergeht --- */
@media (max-width:760px){
.site-nav-wrap{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
-webkit-mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 26px),transparent);
mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 26px),transparent)}
.site-nav-wrap::-webkit-scrollbar{display:none}
.site-nav{justify-content:flex-start;padding-right:14px}
}

/* --- Sanftes Einblenden beim Scrollen --- */
.reveal{opacity:0;transform:translateY(14px);
transition:opacity .5s cubic-bezier(.22,.8,.3,1),transform .5s cubic-bezier(.22,.8,.3,1)}
.reveal-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* --- 404 --- */
.error-panel{text-align:center}
.error-panel .home-actions{justify-content:center;margin-top:24px}

/* --- Bildlaufleiste passend zur Seite --- */
@supports (scrollbar-color:auto){html{scrollbar-color:#1d453a #08110f;scrollbar-width:thin}}

/* --- Ersatz fuer fruehere Inline-Styles (die Sicherheitsregel verbietet sie) --- */
.th-right{text-align:right}
body.modal-open{overflow:hidden}
.offscreen-field{position:fixed;top:0;left:0;width:1px;height:1px;opacity:0;pointer-events:none}

/* --- Discord: Knopf ohne hinterlegten Einladungslink --- */
.discord-button-off{background:linear-gradient(135deg,rgba(88,101,242,.34),rgba(65,73,201,.28));
border-color:rgba(255,255,255,.12);color:#c8ccf5;box-shadow:none;cursor:default}
.discord-button-off:hover{transform:none;box-shadow:none}
.discord-card{position:relative;overflow:hidden}
.discord-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;
background:linear-gradient(180deg,#5865f2,rgba(88,101,242,0));opacity:.75}
.discord-icon{color:#8b95ff;background:rgba(88,101,242,.14);border-color:rgba(88,101,242,.28)}

/* ============================================================
   Hauptbanner (Motiv "Zeche Victoria") und sein Uebergang
   ============================================================ */

/* Der Schriftzug sitzt ganz oben im Bild. Die Bannerhoehe folgt deshalb dem
   Seitenverhaeltnis des Bildes (nichts wird abgeschnitten) und wird nur auf
   sehr breiten Bildschirmen begrenzt - dann faellt unten etwas weg, nie oben. */
.banner-hero{height:auto;aspect-ratio:1952/544;max-height:min(68vh,700px)}
/* Unterseiten: flacher, damit der Inhalt frueher beginnt. Beschnitten wird
   dabei unten - der Schriftzug oben bleibt immer vollstaendig. */
.banner-hero.banner-hero-compact{max-height:min(56vh,560px)}
.server-banner{object-position:center top}
@media (max-width:760px){
.banner-hero.banner-hero-compact{max-height:min(30vh,200px)}
}

/* Der Moosblock-Streifen haengt ueber die Unterkante hinaus - dafuer darf der
   Banner nicht beschnitten werden. */
.banner-hero{overflow:visible}

/* Darunter blendet das Bild in den Seitenhintergrund. Das ist wichtig, weil
   der Streifen oben eine gezackte Kante hat: durch die Luecken waere sonst
   die harte Bildkante zu sehen. */
.banner-hero::after{height:34%;
background:linear-gradient(180deg,rgba(8,17,15,0),rgba(8,17,15,.45) 48%,rgba(8,17,15,.88) 82%,#08110f 100%)}

/* Streifen mittig auf der Bildkante: obere Haelfte deckt den Banner ab,
   untere Haelfte haengt mit den Ranken in die Seite. */
.banner-transition{bottom:clamp(-140px,-7vw,-64px);height:clamp(84px,8.6vw,215px);z-index:5}
.banner-hero-compact .banner-transition{bottom:clamp(-140px,-7vw,-64px);height:clamp(84px,8.6vw,215px)}

/* Weiche Kanten links und rechts, damit das helle Bild nicht hart abbricht */
.banner-hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(90deg,rgba(8,17,15,.55),rgba(8,17,15,0) 12%,rgba(8,17,15,0) 88%,rgba(8,17,15,.55))}

/* Ohne den ueberhaengenden Grasstreifen darf die Navigation nach oben ruecken */
.site-nav-wrap{margin-top:clamp(112px,8.4vw,205px)}
.banner-hero-compact + .site-nav-wrap{margin-top:clamp(86px,6.4vw,150px)}

@media (max-width:760px){
.server-banner{object-position:center top}
.banner-hero::before{background:linear-gradient(90deg,rgba(8,17,15,.45),rgba(8,17,15,0) 16%,rgba(8,17,15,0) 84%,rgba(8,17,15,.45))}
/* Auf dem Handy ist der Banner niedrig - der Streifen muss entsprechend
   kleiner sein, sonst verdeckt er das halbe Motiv. */
.banner-transition,.banner-hero-compact .banner-transition{
height:clamp(46px,12.6vw,84px);bottom:clamp(-62px,-11vw,-28px)}
.site-nav-wrap,.banner-hero-compact + .site-nav-wrap{margin-top:clamp(56px,13.6vw,96px)}
}

/* --- Spielerzahl: kurzes Aufblitzen, wenn sich die Zahl aendert --- */
@keyframes zahlWechsel{
0%{transform:scale(1)}
28%{transform:scale(1.16)}
100%{transform:scale(1)}}
.server-status-players strong.zahl-wechsel{display:inline-block;animation:zahlWechsel .55s ease}
@media (prefers-reduced-motion:reduce){
.server-status-players strong.zahl-wechsel{animation:none}}

/* ============================================================
   Fussleiste, Mod-Seite, Aenderungsprotokoll, Nach-oben-Knopf
   ============================================================ */

/* --- Fussleiste auf allen Seiten --- */
.site-footer{width:100%;margin-top:56px;padding:0 24px 8px;
border-top:1px solid rgba(179,218,205,.1);
background:linear-gradient(180deg,rgba(6,14,12,0),rgba(6,14,12,.72))}
.site-footer-inner{width:min(1120px,100%);margin:0 auto;padding:26px 0 18px;
display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 34px;text-align:center}
.site-footer-brand{display:flex;flex-direction:column;gap:2px}
.site-footer-name{color:#6ee9c0;font-size:.78rem;font-weight:850;letter-spacing:.11em;text-transform:uppercase}
.site-footer-address{color:#c3d8d1;font-size:1rem;font-weight:800}
.site-footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 20px}
.site-footer-links a{color:#9fb5ae;text-decoration:none;font-size:.86rem;font-weight:650;transition:color .18s}
.site-footer-links a:hover{color:#7bffd4}
.site-footer-note{width:100%;margin:4px 0 0;color:#7d918b;font-size:.76rem}
.site-footer-year{color:#647872}

/* --- Mod-Seite: Bild und Eckdaten --- */
.mod-intro .mod-hero-media{width:clamp(104px,13vw,150px);margin:0 auto 18px}
.mod-hero-media picture,.mod-hero-media img{display:block;width:100%;height:auto;aspect-ratio:1/1;
object-fit:cover;border-radius:22px;border:1px solid rgba(179,218,205,.18);
box-shadow:0 18px 44px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.12)}
.mod-facts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px auto 0;max-width:820px}
.mod-fact{display:flex;flex-direction:column;gap:2px;padding:9px 15px;border-radius:13px;
background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
border:1px solid rgba(179,218,205,.13);
-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.mod-fact-label{color:#6ee9c0;font-size:.6rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}
.mod-fact-value{color:#edf8f4;font-size:.9rem;font-weight:800;font-variant-numeric:tabular-nums}

/* --- "Das brauchst du" --------------------------------------------------
   Die Angaben stammen aus der Mod-Datei selbst. Der Kasten sitzt zwischen
   Beschreibung und Versionstabelle und bleibt bewusst schmaler als die
   Tabelle, damit er als Hinweis gelesen wird und nicht als Inhalt. */
.mod-req{width:100%;max-width:640px;margin:26px auto 0;padding:18px 22px 16px;
border-radius:18px;text-align:left;
background:linear-gradient(145deg,rgba(22,38,33,.86),rgba(10,21,18,.92));
border:1px solid rgba(179,218,205,.14);
box-shadow:0 14px 34px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.05)}
.mod-req-title{margin:0 0 13px;color:#7bffd4;font-size:.72rem;font-weight:850;
letter-spacing:.12em;text-transform:uppercase;text-align:center}
.mod-req-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.mod-req-item{display:flex;align-items:center;gap:11px;padding:9px 13px;border-radius:12px;
background:rgba(255,255,255,.035);border:1px solid rgba(179,218,205,.09)}
.mod-req-icon{flex:none;width:19px;height:19px;color:#6ee9c0;opacity:.9}
.mod-req-name{flex:none;color:#cfe4dd;font-size:.84rem;font-weight:750}
.mod-req-value{flex:1;min-width:0;color:#edf8f4;font-size:.84rem;font-weight:800;
text-align:right;font-variant-numeric:tabular-nums}
.mod-req-link{flex:none;padding:5px 12px;border-radius:9px;text-decoration:none;
color:#08110f;background:#6ee9c0;font-size:.72rem;font-weight:850;letter-spacing:.02em;
transition:background .16s ease,transform .16s ease}
.mod-req-link:hover{background:#8ff5d4;transform:translateY(-1px)}
.mod-req-link:focus-visible{outline:2px solid #7bffd4;outline-offset:2px}
.mod-req-note{margin:12px 0 0;color:#8fa39c;font-size:.76rem;line-height:1.55;text-align:center}

@media (max-width:540px){
  /* Auf schmalen Bildschirmen umbrechen, statt den Wert zu quetschen. */
  .mod-req{padding:16px 15px 14px}
  .mod-req-item{flex-wrap:wrap;gap:8px 10px}
  .mod-req-value{flex:1 0 100%;text-align:left;order:3}
  .mod-req-link{order:2;margin-left:auto}
}

@media (prefers-reduced-motion:reduce){
  .mod-req-link{transition:none}
  .mod-req-link:hover{transform:none}
}

/* --- Aenderungsprotokoll --- */
.changelog{width:100%;margin-top:44px}
.changelog-list-wrap{display:flex;flex-direction:column;gap:14px;margin-top:22px}
.changelog-entry{padding:20px 24px;border-radius:16px;text-align:left;
background:linear-gradient(145deg,rgba(20,34,30,.9),rgba(9,19,16,.94));
border:1px solid rgba(179,218,205,.12);box-shadow:0 14px 36px rgba(0,0,0,.26)}
.changelog-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;margin-bottom:12px;
padding-bottom:11px;border-bottom:1px solid rgba(179,218,205,.1)}
.changelog-version{color:#7bffd4;font-size:1.05rem;font-weight:900;letter-spacing:-.01em}
.changelog-date{color:#8fa39c;font-size:.78rem;font-weight:650}
.changelog-text{margin:0 0 10px;color:#b6c8c2;font-size:.87rem;line-height:1.65}
.changelog-list{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:7px}
.changelog-list li{color:#a8bcb5;font-size:.87rem;line-height:1.6}
.changelog-list li::marker{color:#5ee8bd}

/* --- Nach-oben-Knopf --- */
.to-top{position:fixed;right:clamp(14px,2.4vw,28px);bottom:clamp(14px,2.4vw,28px);z-index:40;
width:46px;height:46px;display:grid;place-items:center;border-radius:50%;cursor:pointer;
color:#8ff3cf;background:rgba(9,24,20,.82);border:1px solid rgba(94,232,189,.34);
-webkit-backdrop-filter:blur(12px) saturate(150%);backdrop-filter:blur(12px) saturate(150%);
box-shadow:0 10px 28px rgba(0,0,0,.45);
opacity:0;visibility:hidden;transform:translateY(10px);
transition:opacity .22s ease,transform .22s ease,visibility .22s,border-color .2s,color .2s}
.to-top.sichtbar{opacity:1;visibility:visible;transform:none}
.to-top:hover{color:#eafaf5;border-color:rgba(94,232,189,.7);transform:translateY(-2px)}
.to-top svg{width:20px;height:20px}
@media (prefers-reduced-motion:reduce){.to-top{transition:opacity .2s ease,visibility .2s}}

/* --- Einheitliche Symbole (SVG statt Unicode-Zeichen) --- */
.info-symbol svg{width:21px;height:21px}
.info-symbol{font-size:0}
