/* FarmManager25: gleiche Gestaltung wie das FarmSimBot-Panel */
:root{
    --bg:#131418;
    --surface:#1a1c21;
    --surface-2:#20232a;
    --line:#2a2d35;
    --line-soft:#23262d;
    --text:#eceef2;
    --muted:#a9afba;
    --muted-2:#7f8592;
    --brand:#5865f2;
    --brand-hover:#6670f4;
    --green:#3ba55d;
    --danger:#e5484d;
    --warn:#e0a030;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0}
body{
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
    font-size:14px;line-height:1.5;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit}
button,input,textarea,select{font:inherit}
.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.muted{color:var(--muted)}

/* ---------- Buttons ---------- */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    border:1px solid transparent;border-radius:8px;padding:9px 14px;font-size:14px;font-weight:600;cursor:pointer;
    transition:background .12s ease,border-color .12s ease;
}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-hover)}
.btn-secondary,.btn-ghost{background:transparent;color:var(--text);border-color:var(--line)}
.btn-secondary:hover,.btn-ghost:hover{background:var(--surface-2)}
.btn-ok{background:var(--green);color:#fff}
.btn-ok:hover{filter:brightness(1.08)}
.btn-danger{background:transparent;color:#ff9a9d;border-color:rgba(229,72,77,.4)}
.btn-danger:hover{background:rgba(229,72,77,.1)}
.btn-sm{padding:5px 10px;font-size:13px}
.btn-lg{padding:13px 22px;font-size:15px}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}

/* ---------- Dashboard: Aufbau ---------- */
.layout{display:grid;grid-template-columns:264px 1fr;min-height:100vh}

.sidebar{
    background:var(--surface);border-right:1px solid var(--line);padding:18px 14px;
    position:sticky;top:0;height:100vh;overflow:auto;
}
.side-brand{display:flex;align-items:center;gap:11px;padding:2px 6px 18px}
.side-logo{width:34px;height:34px;border-radius:9px;overflow:hidden;flex:0 0 34px}
.side-logo img{width:100%;height:100%;object-fit:contain;display:block}
.side-brand-title{font-size:16px;font-weight:650;letter-spacing:-.01em}
.side-brand-sub{font-size:12px;color:var(--muted-2);margin-top:1px}
.side-box{padding:0 6px;margin-bottom:20px}
.guild-select-label,.nav-title{
    font-size:11px;color:var(--muted-2);margin-bottom:7px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;
}
.guild-select{
    width:100%;background:var(--surface-2);border:1px solid var(--line);color:var(--text);
    border-radius:8px;padding:9px 11px;outline:none;
}
.guild-select:focus{border-color:var(--brand)}

.user-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.user-left{display:flex;gap:10px;align-items:center;min-width:0}
.avatar{
    width:34px;height:34px;border-radius:50%;overflow:hidden;background:var(--surface-2);
    display:flex;align-items:center;justify-content:center;font-weight:600;flex:0 0 auto;
}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.user-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-tag{font-size:12px;color:var(--muted-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.nav{display:grid;gap:2px}
.nav-item{
    display:flex;align-items:center;padding:8px 10px;border-radius:7px;color:var(--muted);
    font-size:14px;font-weight:500;border-left:2px solid transparent;
}
.nav-item:hover{background:var(--surface-2);color:var(--text)}
.nav-item.active{background:var(--surface-2);color:var(--text);border-left-color:var(--brand)}
.nav-tag{
    margin-left:auto;padding:1px 7px;border-radius:999px;background:var(--brand);color:#fff;
    font-size:10px;font-weight:700;letter-spacing:.04em;
}

/* ---------- Hauptbereich ---------- */
.main{padding:28px clamp(16px,2.2vw,44px) 48px;max-width:none}
.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:14px}
.page-title{margin:0;font-size:26px;font-weight:650;letter-spacing:-.02em;line-height:1.2}
.page-sub{color:var(--muted-2);font-size:13px;margin-top:3px}

.alert{border-radius:8px;padding:11px 14px;margin-bottom:14px;border:1px solid;font-size:14px}
.alert-ok{background:rgba(59,165,93,.1);border-color:rgba(59,165,93,.35);color:#b9ebc9}
.alert-err{background:rgba(229,72,77,.1);border-color:rgba(229,72,77,.35);color:#ffc9cb}

.status-strip{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.chip{
    display:inline-flex;align-items:center;gap:7px;padding:4px 11px;border:1px solid var(--line);
    border-radius:999px;font-size:12px;color:var(--muted);
}
.chip b{font-weight:600;color:var(--text)}
.dot{width:7px;height:7px;border-radius:50%;background:#5b606c;display:inline-block}
.dot.on{background:var(--green)}

/* ---------- Karten und Formulare ---------- */
.section{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:22px 24px}
.section + .section{margin-top:16px}
.section-title{margin:0 0 16px;font-size:17px;font-weight:650;letter-spacing:-.01em}
.builder-title{font-size:13px;font-weight:600;margin:0 0 12px;color:var(--text)}

.field{margin-bottom:16px}
label{display:block;margin-bottom:6px;font-size:13px;color:var(--muted);font-weight:500}
input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="url"],input[type="datetime-local"],textarea,select{
    width:100%;padding:9px 12px;background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--text);outline:none;
}
input:focus,textarea:focus,select:focus{border-color:var(--brand)}
input:disabled,select:disabled,textarea:disabled{opacity:.55;cursor:not-allowed}
textarea{min-height:100px;resize:vertical}
.hint{margin-top:6px;color:var(--muted-2);font-size:12px;line-height:1.55}

.checks{display:grid;gap:0;margin-bottom:14px}
.check{display:flex;align-items:flex-start;gap:11px;padding:10px 2px;border-bottom:1px solid var(--line-soft);cursor:pointer}
.check:last-child{border-bottom:0}
.check input{margin-top:3px;accent-color:var(--brand)}
.check span{font-size:14px;font-weight:500;color:var(--text)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.three-col{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.actions{display:flex;justify-content:flex-end;gap:10px;padding-top:18px;margin-top:20px;border-top:1px solid var(--line)}
.empty{padding:28px 4px;color:var(--muted);line-height:1.7}
.empty h1{margin:0 0 8px;font-size:24px;font-weight:650;letter-spacing:-.02em;color:var(--text)}

.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.section-head .section-title{margin:0}

.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.farm-card{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:16px}
.farm-card table td{padding:6px 4px}
button:disabled{opacity:.55;cursor:not-allowed}

/* Popup (Auftrag anlegen) */
dialog.modal{
    width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:0;border:1px solid var(--line);
    border-radius:12px;background:var(--surface);color:var(--text);box-shadow:0 20px 60px rgba(0,0,0,.5);
}
dialog.modal::backdrop{background:rgba(8,9,12,.72)}
dialog.modal form{display:flex;flex-direction:column;max-height:calc(100vh - 32px)}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line)}
.modal-head h2{margin:0;font-size:18px;font-weight:650}
.modal-x{background:transparent;border:0;color:var(--muted);font-size:24px;line-height:1;cursor:pointer;padding:0 4px}
.modal-x:hover{color:var(--text)}
.modal-body{padding:18px 20px;overflow:auto}
.modal-foot{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid var(--line)}

details.section>summary{cursor:pointer;font-size:15px;font-weight:650;list-style:none}
details.section>summary::-webkit-details-marker{display:none}
details.section>summary::before{content:"+";display:inline-block;width:18px;color:var(--muted-2)}
details.section[open]>summary::before{content:"–"}

/* ---------- Tabellen und Markierungen ---------- */
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:10px 10px;border-bottom:1px solid var(--line-soft);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
th{color:var(--muted-2);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.badge{
    display:inline-block;padding:1px 9px;border-radius:999px;font-size:12px;font-weight:600;
    background:var(--surface-2);border:1px solid var(--line);color:var(--muted);
}
.badge-open{color:#aab2ff;border-color:rgba(88,101,242,.4);background:rgba(88,101,242,.1)}
.badge-claimed{color:var(--warn);border-color:rgba(224,160,48,.4);background:rgba(224,160,48,.08)}
.badge-submitted{color:#7fd6ff;border-color:rgba(127,214,255,.4);background:rgba(127,214,255,.08)}
.badge-approved{color:#9be0b2;border-color:rgba(59,165,93,.45);background:rgba(59,165,93,.1)}
.badge-cancelled{color:var(--muted-2)}
.credits{font-weight:700;font-variant-numeric:tabular-nums}

/* ---------- Startseite ---------- */
.wrap{width:100%;max-width:1080px;margin:0 auto;padding:0 24px}
.top{border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;font-weight:650;font-size:16px}
.brand img{width:34px;height:34px;object-fit:contain;border-radius:9px}
.top nav{display:flex;align-items:center;gap:22px;color:var(--muted);font-size:14px}
.top nav a:hover{color:var(--text)}

.hero{padding:76px 0 64px}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);margin-bottom:14px}
.hero h1{margin:0 0 16px;font-size:40px;line-height:1.15;font-weight:700;letter-spacing:-.025em}
.lead{margin:0 0 28px;color:var(--muted);font-size:17px;max-width:520px}
.cta{display:flex;flex-wrap:wrap;gap:10px}
.note{margin-top:14px;font-size:13px;color:var(--muted-2)}

.discord{background:#313338;border:1px solid var(--line);border-radius:12px;padding:18px}
.discord-meta{display:flex;gap:12px}
.discord-avatar{width:38px;height:38px;border-radius:50%;background:var(--brand);flex:0 0 38px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
.discord-name{font-weight:600}
.discord-name small{color:#a3a6ad;font-weight:400;margin-left:8px;font-size:12px}
.embed{margin-top:8px;background:#2b2d31;border-left:4px solid #e0a030;border-radius:4px 8px 8px 4px;padding:14px 16px}
.embed-title{font-weight:700;margin-bottom:10px}
.embed-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;font-size:13px}
.embed-grid span{display:block;color:#a3a6ad;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.embed-buttons{display:flex;gap:8px;margin-top:14px}
.embed-buttons i{font-style:normal;font-size:13px;font-weight:600;padding:5px 12px;border-radius:4px;background:#4e5058}
.embed-buttons i.p{background:var(--brand)}
.embed-buttons i.g{background:#248046}
.sample{margin-top:10px;font-size:12px;color:var(--muted-2);text-align:center}

section.block{padding:64px 0;border-top:1px solid var(--line)}
section.block h2{margin:0 0 10px;font-size:26px;font-weight:650;letter-spacing:-.02em}
.sub{margin:0 0 34px;color:var(--muted);max-width:620px}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.feature{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:20px}
.feature h3{margin:0 0 6px;font-size:16px;font-weight:600;display:flex;align-items:center;gap:8px}
.feature p{margin:0;color:var(--muted);font-size:14px}
.tag{font-size:10px;font-weight:700;letter-spacing:.05em;padding:2px 8px;border-radius:999px;background:rgba(88,101,242,.16);color:#aab2ff}

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{border-top:2px solid var(--line);padding-top:16px}
.step b{display:block;font-size:12px;color:var(--muted-2);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.step h3{margin:0 0 6px;font-size:16px;font-weight:600}
.step p{margin:0;color:var(--muted);font-size:14px}

.plans{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:760px}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:24px;display:flex;flex-direction:column}
.plan.pro{border-color:rgba(88,101,242,.5)}
.plan h3{margin:0;font-size:18px;font-weight:650}
.price{margin:4px 0 16px;color:var(--muted);font-size:14px}
.plan ul{margin:0 0 24px;padding:0;list-style:none;display:grid;gap:9px;font-size:14px;color:var(--muted)}
.plan li{display:flex;gap:10px}
.plan li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green);margin-top:8px;flex:0 0 6px}
.plan.pro li::before{background:var(--brand)}

.final{text-align:center}
.final .sub{margin-left:auto;margin-right:auto}
.final .cta{justify-content:center}
footer{border-top:1px solid var(--line);padding:26px 0;color:var(--muted-2);font-size:13px}
footer a:hover{color:var(--text);text-decoration:underline}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}

@media(max-width:1100px){
    .layout{grid-template-columns:1fr}
    .sidebar{position:static;height:auto;border-right:0;border-bottom:1px solid var(--line)}
}
@media(max-width:900px){
    .hero{padding:44px 0 40px}
    .hero .wrap{grid-template-columns:1fr;gap:34px}
    .hero h1{font-size:32px}
    .features,.steps{grid-template-columns:1fr 1fr}
    .plans{grid-template-columns:1fr}
}
@media(max-width:860px){
    .main{padding:20px 16px 40px}
    .topbar{flex-direction:column}
    .two-col,.three-col{grid-template-columns:1fr}
    table{display:block;overflow-x:auto}
}
@media(max-width:620px){
    .features,.steps{grid-template-columns:1fr}
    .top nav a.hide-sm{display:none}
    .wrap{padding:0 16px}
}

/* ======================================================================
   Feinschliff: Bedienung und Aussehen
   ====================================================================== */
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none}
.btn:active{transform:translateY(1px)}
.btn.is-loading{opacity:.7;pointer-events:none}
.section{box-shadow:0 1px 2px rgba(0,0,0,.18)}
tbody tr{transition:background .12s ease}
tbody tr:hover{background:rgba(255,255,255,.025)}
.farm-card{transition:border-color .15s ease}
.farm-card:hover{border-color:#3a3e49}

/* Menü mit Symbolen */
.nav-icon{width:16px;height:16px;flex:0 0 16px;margin-right:10px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.nav-item.active .nav-icon{color:var(--brand);opacity:1}
.nav-item span:not(.nav-tag){flex:1}

/* Suche und Filter über den Listen */
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 14px}
.search{position:relative;flex:1;min-width:190px;max-width:340px}
.search input{padding-left:34px}
.search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:15px;height:15px;fill:none;stroke:var(--muted-2);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.filters{display:flex;gap:6px;flex-wrap:wrap}
.filter{
    background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:999px;
    padding:4px 12px;font-size:13px;font-weight:500;cursor:pointer;transition:background .12s ease,color .12s ease,border-color .12s ease;
}
.filter:hover{background:var(--surface-2);color:var(--text)}
.filter.active{background:rgba(88,101,242,.16);border-color:rgba(88,101,242,.5);color:#dfe2ff}
.no-results{display:none;padding:22px 6px;color:var(--muted);text-align:center}

/* Hinweise als kurze Einblendung */
.toast-wrap{position:fixed;right:18px;bottom:18px;z-index:3000;display:grid;gap:8px;max-width:min(420px,calc(100vw - 36px))}
.toast{
    display:flex;align-items:flex-start;gap:10px;padding:11px 14px;border-radius:10px;border:1px solid;font-size:14px;
    background:var(--surface);box-shadow:0 10px 30px rgba(0,0,0,.45);cursor:pointer;animation:toast-in .2s ease-out;
}
.toast-ok{border-color:rgba(59,165,93,.45);color:#c9f0d6}
.toast-err{border-color:rgba(229,72,77,.5);color:#ffd0d2}
.toast.hide{opacity:0;transform:translateY(6px);transition:opacity .25s ease,transform .25s ease}
@keyframes toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Popups */
dialog.modal[open]{animation:modal-in .15s ease-out}
@keyframes modal-in{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
dialog.confirm{width:min(420px,calc(100vw - 32px))}
.confirm-text{margin:0;color:var(--text);line-height:1.6}

/* Leere Ansichten */
.empty-state{text-align:center;padding:34px 12px;color:var(--muted)}
.empty-state svg{width:34px;height:34px;fill:none;stroke:var(--muted-2);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:8px}
.empty-state p{margin:0 0 12px}

/* Handy: kompakte Kopfleiste mit Menü */
.mobilebar{display:none}
@media(max-width:1100px){
    .mobilebar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
    .mobilebar .brand{font-size:15px}
    .menu-btn{background:transparent;border:1px solid var(--line);color:var(--text);border-radius:8px;padding:6px 10px;cursor:pointer;font-weight:600}
    .sidebar{display:none}
    body.menu-open .sidebar{display:block}
}
@media(max-width:700px){
    .page-title{font-size:22px}
    .section{padding:18px 16px}
    .section-head{flex-wrap:wrap}
    .modal-foot .btn{flex:1}
    .toast-wrap{left:14px;right:14px;max-width:none}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- Live-Karte ---------- */
.lm-status{font-size:12px;color:var(--muted-2)}
.lm-status.bad{color:var(--danger)}
.lm-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:12px}
.lm-bar[hidden]{display:none}
.lm-bar select{width:auto;background:var(--surface-2);border:1px solid var(--line);color:var(--text);border-radius:8px;padding:8px 10px}
.lm-bar .search{flex:1 1 240px;min-width:200px}
.lm-check{display:inline-flex;align-items:center;gap:6px;margin:0;color:var(--muted);font-size:13px;cursor:pointer}
.lm-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:start}
.lm-map{position:relative;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#101216;aspect-ratio:1/1;max-height:78vh;width:100%}
.lm-map svg{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none;cursor:grab;user-select:none}
.lm-map svg:active{cursor:grabbing}
.lm-zoom{position:absolute;right:10px;top:10px;display:flex;flex-direction:column;gap:6px}
.lm-zoom button{width:34px;height:34px;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--text);font-size:18px;line-height:1;cursor:pointer}
.lm-zoom button:hover{background:var(--surface-2)}
.lm-side{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px;min-height:200px}
.lm-side h3{margin:0 0 10px;font-size:16px}
.lm-line{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px solid var(--line-soft);font-size:13px}
.lm-sub{margin:14px 0 6px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-2)}
.lm-job{padding:6px 8px;margin-bottom:4px;border-radius:7px;background:var(--surface-2);font-size:13px}
.lm-legend{margin-top:18px;font-size:12px;color:var(--muted)}
.lm-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:8px}
@media (max-width:900px){.lm-body{grid-template-columns:1fr}.lm-map{max-height:70vh}}

/* ---------- Startseite ---------- */
.lm-bar[hidden]{display:none}
.home-hero{
    display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;
    padding:22px 26px;margin-bottom:16px;border:1px solid var(--line);border-radius:16px;
    background:radial-gradient(120% 140% at 0% 0%,rgba(88,101,242,.24),transparent 55%),radial-gradient(90% 120% at 100% 100%,rgba(59,165,93,.12),transparent 60%),var(--surface);
}
.home-hello{font-size:24px;font-weight:700;letter-spacing:-.02em}
.home-sub{margin-top:4px;color:var(--muted)}
.home-sub b{color:var(--text)}
.home-status{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:12px;font-size:12px;color:var(--muted-2)}
.home-status span{display:inline-flex;align-items:center;gap:6px}

/* Kennzahlen */
.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.stat{
    --tone:var(--brand);display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:14px;
    background:linear-gradient(180deg,rgba(255,255,255,.025),transparent),var(--surface);transition:border-color .15s,transform .15s;
}
.stat:hover{border-color:var(--tone);transform:translateY(-1px)}
.stat.is-blue{--tone:#5865f2}.stat.is-violet{--tone:#a86ae0}.stat.is-amber{--tone:#e0a030}.stat.is-green{--tone:#3ba55d}
.stat-icon{
    flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:12px;
    color:var(--tone);background:color-mix(in srgb,var(--tone) 16%,transparent);
}
.stat-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.stat-body{display:flex;flex-direction:column;min-width:0}
.stat-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-2)}
.stat-value{font-size:26px;font-weight:700;line-height:1.15;letter-spacing:-.02em}
.stat-note{font-size:12px;color:var(--muted-2)}
.stat-off .stat-value{color:var(--muted-2)}

/* Karte links, Aufträge rechts */
.home-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(320px,1fr);gap:16px;align-items:stretch}
@media (min-width:1700px){.home-grid{grid-template-columns:minmax(0,2fr) minmax(360px,1fr)}.group-grid{gap:28px}}
.panel{border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden}
.panel-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line-soft)}
.panel-head h2{margin:0;font-size:15px;font-weight:650}
.panel-ic{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--surface-2);color:var(--muted)}
.panel-ic svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.panel-sub{font-size:12px;color:var(--muted-2)}
.panel-link{margin-left:auto;font-size:12px;color:var(--brand)}
.panel-link:hover{color:var(--brand-hover)}
.panel-pad{padding:16px 18px}

.home-map{display:flex;flex-direction:column}
.home-map-body{flex:1;padding:12px}
.home-map .lm{display:block}
.home-map .lm-body{display:block}
.home-map .lm-map{aspect-ratio:auto;max-height:none;height:clamp(360px,52vh,760px);border-radius:12px}
.home-lock{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;height:clamp(360px,52vh,760px);color:var(--muted)}
.home-lock svg{width:42px;height:42px;fill:none;stroke:var(--muted-2);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.home-lock p{margin:0;line-height:1.6}

/* Das Aufträge-Panel ist genauso hoch wie die Karte und scrollt bei Bedarf */
.home-side{position:relative;min-height:440px}
.home-side .panel{position:absolute;inset:0;display:flex;flex-direction:column}
.panel-scroll{flex:1;overflow:auto;padding:14px 18px}

.group{margin-bottom:16px}
.group:last-child{margin-bottom:0}
.group-title{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-2)}
.group-title .count{margin-left:auto;padding:1px 8px;border-radius:999px;background:var(--surface-2);color:var(--text);letter-spacing:0}
.group-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.row-item{
    display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;margin-bottom:6px;
    border-radius:10px;background:var(--surface-2);border:1px solid transparent;
}
a.row-item:hover{border-color:var(--line)}
.row-main{min-width:0}
.row-main b{font-weight:600}
.row-side{flex:none;font-size:12px}
.row-empty{padding:8px 2px;color:var(--muted-2);font-size:13px}
.row-more{padding:2px 4px;font-size:12px;color:var(--muted-2)}
.tone{display:inline-block;width:9px;height:9px;border-radius:50%}
.tone-green{background:var(--green)}.tone-red{background:var(--danger)}.tone-amber{background:var(--warn)}

.lm-dialog{width:min(400px,calc(100vw - 32px))}
.lm-dialog .modal-body{display:block}
.lm-dialog .btn{display:inline-flex}

@media (max-width:1000px){
    .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .home-grid{grid-template-columns:1fr}
    .home-side{min-height:0}
    .home-side .panel{position:static}
    .panel-scroll{max-height:none}
    .group-grid{grid-template-columns:1fr}
    .home-map .lm-map,.home-lock{height:300px}
}
@media (max-width:520px){
    .home-hero{padding:18px}
    .stat{padding:14px}
    .stat-value{font-size:22px}
}

/* ---------- Felderliste ---------- */
.field-no{font-size:15px}
.field-table td{vertical-align:middle}
.pills{display:flex;flex-wrap:wrap;gap:6px}
.pill{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;font-size:12px;line-height:1.6;border:1px solid transparent;white-space:nowrap}
.pill b{font-weight:700}
.pill-green{background:rgba(59,165,93,.12);border-color:rgba(59,165,93,.30);color:#9be0b3}
.pill-amber{background:rgba(224,160,48,.12);border-color:rgba(224,160,48,.30);color:#f0cd8a}
.pill-red{background:rgba(229,72,77,.12);border-color:rgba(229,72,77,.32);color:#ffadb0}
.field-table td:nth-child(5){white-space:nowrap}
.field-table td .row{flex-wrap:nowrap}

/* ---------- Feld-Kacheln ---------- */
.view-bar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:12px}
.seg{display:inline-flex;padding:3px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.seg-btn{padding:5px 14px;border-radius:7px;font-size:13px;color:var(--muted)}
.seg-btn:hover{color:var(--text)}
.seg-btn.active{background:var(--surface-2);color:var(--text)}
.seg-sel{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:13px;color:var(--muted)}
.seg-sel select{width:auto;padding:5px 10px;background:var(--surface-2);border:1px solid var(--line);border-radius:8px;color:var(--text)}

.fgroup{margin-bottom:22px}
.fg-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 2px 10px}
.fg-name{font-size:15px;font-weight:650}
.fg-sub{font-size:12px;color:var(--muted-2)}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.fcard{
    --c:#5b606c;display:flex;flex-direction:column;gap:9px;padding:14px;border:1px solid var(--line);border-radius:14px;
    background:linear-gradient(180deg,rgba(255,255,255,.025),transparent),var(--surface);transition:border-color .15s,transform .15s;
}
.fcard:hover{border-color:var(--c);transform:translateY(-1px)}
.fcard.s-ready{--c:#3ba55d}.fcard.s-growing{--c:#e0a030}.fcard.s-cut{--c:#8a8f99}.fcard.s-other{--c:#5865f2}.fcard.s-none{--c:#5b606c}
.fc-top{display:flex;align-items:center;gap:12px}
.fthumb{flex:none;width:64px;height:56px}
.fthumb circle,.fthumb path{fill:var(--c);fill-opacity:.5;stroke:var(--c);stroke-width:1.6;stroke-linejoin:round}
.fc-id{min-width:0}
.fc-no{font-size:22px;font-weight:700;line-height:1.1;letter-spacing:-.02em}
.fc-sub{font-size:12px;color:var(--muted)}
.fc-state{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
.fc-state .dot{background:var(--c)}
.fc-farm{margin-left:auto;color:var(--muted-2)}
.fc-tags{display:flex;flex-wrap:wrap;gap:6px}
.job-chip,.plan-chip{font-size:11px;padding:1px 8px;border-radius:999px;line-height:1.6}
.job-chip{background:rgba(88,101,242,.16);border:1px solid rgba(88,101,242,.4);color:#b5bbff}
.plan-chip{background:var(--surface-2);border:1px solid var(--line);color:var(--muted)}
.fc-actions{display:flex;gap:6px;margin-top:auto;padding-top:10px;border-top:1px solid var(--line-soft)}
.fc-actions .btn{flex:1}
.fc-actions form{display:contents}
.fc-actions .fc-del{flex:none;padding-left:10px;padding-right:10px}

/* ---------- Gemeinsame Bausteine ---------- */
.av{
    --h:220;flex:none;display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;
    font-size:12px;font-weight:700;letter-spacing:.02em;color:hsl(var(--h) 80% 86%);
    background:hsl(var(--h) 45% 26%);border:1px solid hsl(var(--h) 45% 38%);
}
.av-sm{width:24px;height:24px;font-size:10px}
.chip-sm{display:inline-flex;gap:5px;padding:1px 8px;border-radius:999px;font-size:11px;background:var(--surface-2);border:1px solid var(--line);color:var(--muted)}
.chip-sm b{font-weight:600;color:var(--muted-2)}
.meter-row{display:flex;align-items:center;gap:8px;font-size:12px}
.meter-label{width:52px;color:var(--muted-2)}
.meter{flex:1;height:6px;border-radius:999px;background:var(--surface-2);overflow:hidden}
.meter-fill{display:block;height:100%;border-radius:999px}
.meter-green{background:var(--green)}.meter-amber{background:var(--warn)}.meter-red{background:var(--danger)}
.meter-val{width:42px;text-align:right;color:var(--muted)}

/* ---------- Aufträge ---------- */
.st-open{--sc:#5865f2}.st-claimed{--sc:#e0a030}.st-submitted{--sc:#a86ae0}.st-approved{--sc:#3ba55d}.st-cancelled{--sc:#6b7280}
.jboard{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:14px;align-items:start}
.jcol{border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:10px}
.jcol-head{display:flex;align-items:center;gap:8px;padding:2px 4px 10px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-2)}
.tone-dot{width:9px;height:9px;border-radius:50%;background:var(--sc)}
.jcol-head .count{margin-left:auto;padding:1px 8px;border-radius:999px;background:var(--surface-2);color:var(--text);letter-spacing:0}
.jcol-body{display:flex;flex-direction:column;gap:10px}
.jcol-empty{padding:14px 6px;text-align:center;font-size:13px;color:var(--muted-2)}
.jlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:12px}
.jcard{
    display:flex;flex-direction:column;gap:9px;padding:13px 14px;border:1px solid var(--line);border-radius:12px;
    background:linear-gradient(180deg,rgba(255,255,255,.025),transparent),var(--surface-2);transition:border-color .15s;
}
.jcard:hover{border-color:var(--sc)}
.jc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.jc-title{font-size:15px;font-weight:650;line-height:1.3}
.reward{flex:none;display:inline-flex;align-items:baseline;gap:4px;padding:2px 9px;border-radius:999px;background:rgba(224,160,48,.14);border:1px solid rgba(224,160,48,.34);color:#f0cd8a;font-size:13px;font-weight:700}
.reward small{font-size:10px;font-weight:500;opacity:.85}
.jc-sub{font-size:12px;color:var(--muted)}
.due.late{color:#ff9fa2;font-weight:600}
.jc-params{display:flex;flex-wrap:wrap;gap:6px}
.jc-desc{font-size:12px;color:var(--muted-2);line-height:1.5}
.jc-team{display:flex;align-items:center;gap:8px;font-size:12px}
.avs{display:inline-flex}
.avs .av{margin-left:-6px;border:2px solid var(--surface-2)}
.avs .av:first-child{margin-left:0}
.jc-actions{display:flex;flex-wrap:wrap;gap:6px;padding-top:9px;border-top:1px solid var(--line-soft)}

/* ---------- Maschinen ---------- */
.mgrid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.mcard{display:flex;flex-direction:column;gap:11px;padding:14px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.025),transparent),var(--surface);transition:border-color .15s,transform .15s}
.mcard:hover{border-color:var(--brand);transform:translateY(-1px)}
.mc-top{display:flex;align-items:center;gap:12px}
.mc-ic{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--surface-2);color:var(--muted)}
.mc-ic svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mc-id{min-width:0;flex:1}
.mc-name{font-size:15px;font-weight:650;line-height:1.25}
.mc-sub{font-size:12px;color:var(--muted)}
.mc-farm{align-self:flex-start;padding:1px 9px;border-radius:999px;font-size:11px;background:var(--surface-2);border:1px solid var(--line);color:var(--muted)}
.meters{display:flex;flex-direction:column;gap:7px}
.mc-notes{font-size:12px;color:var(--muted-2);line-height:1.5}

/* ---------- Höfe ---------- */
.hgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.hcard{--h:220;display:flex;flex-direction:column;gap:14px;padding:16px;border:1px solid var(--line);border-radius:16px;background:radial-gradient(120% 90% at 0% 0%,hsl(var(--h) 60% 40% / .16),transparent 60%),var(--surface)}
.hc-top{display:flex;align-items:center;gap:12px}
.hc-ic{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:13px;color:hsl(var(--h) 80% 82%);background:hsl(var(--h) 45% 26%);border:1px solid hsl(var(--h) 45% 38%)}
.hc-ic svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.hc-name{font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.2}
.hc-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.hc-stats div{display:flex;flex-direction:column;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid var(--line-soft)}
.hc-stats b{font-size:17px;font-weight:700;line-height:1.2}
.hc-stats span{font-size:11px;color:var(--muted-2)}
.hc-title{margin-bottom:6px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-2)}
.hc-member{display:flex;align-items:center;gap:9px;padding:5px 0}
.hc-mname{flex:1;min-width:0;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.role-chip{padding:1px 9px;border-radius:999px;font-size:11px;background:var(--surface-2);border:1px solid var(--line);color:var(--muted)}
.hc-member form{display:contents}
.hc-member .fc-del{flex:none;padding:2px 8px}

/* ---------- Lohnbuch ---------- */
.ledger-top{display:grid;grid-template-columns:minmax(240px,1fr) minmax(0,2fr);gap:16px;align-items:stretch}
.account{display:flex;flex-direction:column;justify-content:center;gap:4px;padding:22px 24px;border:1px solid var(--line);border-radius:16px;background:radial-gradient(120% 120% at 0% 0%,rgba(224,160,48,.20),transparent 60%),var(--surface)}
.acc-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-2)}
.acc-value{display:flex;align-items:baseline;gap:8px;font-size:40px;font-weight:700;letter-spacing:-.03em;line-height:1.1}
.acc-value small{font-size:14px;font-weight:500;color:var(--muted)}
.acc-note{font-size:13px;color:var(--muted)}
.acc-note b{color:var(--text)}
.led-row{display:flex;align-items:center;gap:12px;padding:8px 2px;border-bottom:1px solid var(--line-soft);font-size:13px}
.led-row:last-child{border-bottom:0}
.led-date{flex:none;width:84px;color:var(--muted-2)}
.led-reason{flex:1;min-width:0}
.led-amt{flex:none;font-weight:700}
.led-amt.plus{color:#7fd69a}.led-amt.minus{color:#ff9fa2}
.ranking{display:flex;flex-direction:column;gap:8px}
.rank-row{display:flex;align-items:center;gap:12px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.rank-row.me{border-color:rgba(88,101,242,.55);background:linear-gradient(90deg,rgba(88,101,242,.10),var(--surface))}
.rank-no{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-size:13px;font-weight:700;background:var(--surface-2);color:var(--muted)}
.rank-1{background:#e0a030;color:#2a1c00}.rank-2{background:#aeb4bf;color:#1d2026}.rank-3{background:#b5784a;color:#2a1608}
.rank-main{flex:1;min-width:0}
.rank-name{font-size:14px;font-weight:600;line-height:1.3}
.rank-bar{margin-top:6px;height:5px;border-radius:999px;background:var(--surface-2);overflow:hidden}
.rank-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#5865f2,#a86ae0)}
.rank-credits{flex:none;min-width:70px;text-align:right;font-size:16px;font-weight:700}

/* ---------- Fruchtfolge ---------- */
.matrix-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.matrix{width:100%;min-width:980px;border-collapse:separate;border-spacing:0}
.matrix th,.matrix td{border-bottom:1px solid var(--line-soft);border-right:1px solid var(--line-soft);padding:6px;vertical-align:top}
.matrix tr:last-child th,.matrix tr:last-child td{border-bottom:0}
.matrix td:last-child,.matrix th:last-child{border-right:0}
.matrix thead th{position:sticky;top:0;z-index:2;background:var(--surface);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-2);text-align:center;padding:10px 6px}
.matrix .mx-field{position:sticky;left:0;z-index:1;width:70px;min-width:70px;background:var(--surface);text-align:left;font-size:14px;font-weight:700;color:var(--text);vertical-align:middle}
.matrix thead .mx-field{z-index:3}
.mx-m.now{color:#b5bbff}
.mx-cell{min-width:92px;height:46px;position:relative}
.mx-cell.past{background:rgba(0,0,0,.14)}
.mx-cell.now{background:rgba(88,101,242,.08);box-shadow:inset 0 0 0 1px rgba(88,101,242,.35)}
.plan-chip2{--h:220;position:relative;display:flex;margin-bottom:4px;border-radius:9px;background:hsl(var(--h) 45% 24%);border:1px solid hsl(var(--h) 45% 38%);color:hsl(var(--h) 80% 88%)}
.pc-main{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:0;padding:4px 22px 4px 8px;border:0;background:transparent;color:inherit;text-align:left;cursor:default;font:inherit}
button.pc-main{cursor:pointer}
.pc-main b{font-size:12px;font-weight:650;line-height:1.3}
.pc-main small{font-size:10px;opacity:.8;line-height:1.2}
.pc-job{position:absolute;right:6px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--sc,#6b7280)}
.pc-job.st-auto{background:#6b7280}
.plan-chip2 form{display:contents}
.pc-x{position:absolute;right:2px;bottom:2px;padding:0 5px;border:0;background:transparent;color:inherit;opacity:0;cursor:pointer;font-size:14px;line-height:1.2}
.plan-chip2:hover .pc-x{opacity:.8}
.pc-x:hover{opacity:1;color:#ffadb0}
.cell-add{display:none;width:100%;height:26px;border:1px dashed var(--line);border-radius:8px;background:transparent;color:var(--muted-2);cursor:pointer;font-size:15px}
.mx-cell:hover .cell-add{display:block}
.mx-cell:hover .cell-add:hover{border-color:var(--brand);color:var(--text)}

@media (max-width:1100px){.jboard{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.ledger-top{grid-template-columns:1fr}}
@media (max-width:700px){.jboard{grid-template-columns:1fr}.jlist{grid-template-columns:1fr}.hc-stats{grid-template-columns:repeat(2,1fr)}}

/* Lange Namen/E-Mail-Adressen in der Seitenleiste kürzen, Logout bleibt sichtbar */
.user-left>div:last-child{min-width:0}
.user-row .btn{flex-shrink:0}


/* Serververzeichnis, Bewerbung, Bewerbungs-Ansicht */
.dir-filter{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 20px}
.dir-filter input[type="text"]{min-width:200px;flex:1;max-width:320px}
.dir-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.dir-card{display:flex;flex-direction:column;gap:12px;padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.dir-card.is-featured{border-color:rgba(224,160,48,.55);background:linear-gradient(180deg,rgba(224,160,48,.07),transparent),var(--surface)}
.dir-card header{display:flex;align-items:center;gap:12px}
.dir-card header h3{margin:0;font-size:16px}
.dir-card header .tag{margin-left:auto}
.dir-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.5;flex:1}
.dir-tags{display:flex;flex-wrap:wrap;gap:6px}
.dir-card footer{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dir-report{margin-left:auto;font-size:12px;color:var(--muted-2)}
.dir-report summary{cursor:pointer}
.dir-report form{display:flex;gap:6px;margin-top:8px}
.app-card{border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:12px;background:var(--surface-2,rgba(255,255,255,.02));display:grid;gap:10px}
.app-card header{display:flex;align-items:center;gap:12px}
.app-text{margin:0;line-height:1.5}
.app-qa{font-size:14px}
.app-qa .muted{display:block;font-size:12px;margin-bottom:2px}
.app-votes{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.app-card footer{display:flex;flex-wrap:wrap;gap:8px;align-items:center}

/* Reiter im Admin */
.tabs{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 18px;border-bottom:1px solid var(--line)}
.tab{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;margin-bottom:-1px;border:1px solid transparent;border-radius:10px 10px 0 0;color:var(--muted);font-weight:600;font-size:14px}
.tab:hover{color:var(--text)}
.tab.active{color:var(--text);background:var(--surface);border-color:var(--line);border-bottom-color:var(--surface)}

/* Admin-Formulare: Einstellungen als Kacheln in einem Raster */
.set-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:16px;align-items:stretch;margin-bottom:16px}
.set-form .section{margin:0;padding:20px 22px;display:flex;flex-direction:column}
.set-form .section-wide{grid-column:1/-1}
.set-form .section-title{font-size:15px;margin-bottom:6px}
.set-form .section-title+.hint,.set-form .section-title+.field{margin-top:10px}
.set-form .field:last-child{margin-bottom:0}
.set-form .hint{margin-top:8px}
.set-form .checks{margin-bottom:0}
.set-form .actions{grid-column:1/-1;margin:0;padding:0;border-top:0}
.set-form .check{padding:8px 2px}

.tabs-actions{margin-left:auto;display:flex;gap:10px;align-items:center;padding-bottom:6px}

/* Rollen */
.role-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:16px;align-items:start}
.role-card{padding:20px 22px;display:flex;flex-direction:column;gap:6px}
.role-head{display:flex;align-items:center;gap:10px}
.role-head input[type="text"]{font-weight:650;font-size:15px}
.role-new{border-style:dashed}
.role-locked{border-style:dashed;opacity:.85}
.perm-group{margin-top:8px}
.perm-group-title{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);margin-bottom:2px}
.check.perm span{display:flex;flex-direction:column}
.check.perm small{font-weight:400;color:var(--muted-2);font-size:12px;margin-top:1px}
.role-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}

/* Rollen: gleich hohe Kacheln, kompakte Rechte-Listen */
.role-grid{align-items:stretch}
.role-card{height:100%}
.role-card .perm-group{margin-top:12px}
.perm-items{display:grid;grid-template-columns:1fr 1fr;gap:2px 14px}
.role-card .check.perm{padding:6px 2px;border-bottom:0;align-items:flex-start}
.role-card .check.perm span{font-size:13px}
.role-card .check.perm small{display:block}
.role-actions{margin-top:auto;padding-top:14px}
@media (max-width:560px){.perm-items{grid-template-columns:1fr}}

/* Rollen, Feinschliff: gleiche Höhe, nur eine Zeile je Recht (Erklärung beim Daraufzeigen) */
.role-grid>.section{margin:0}
.role-card .check.perm small{display:none}
.role-card .check.perm{padding:5px 8px;border-radius:8px;gap:9px;align-items:center}
.role-card .check.perm:hover{background:rgba(255,255,255,.04)}
.role-card .check.perm input{margin-top:0}
.role-card .perm-group{margin-top:10px}
.perm-items{gap:0 10px}

/* Seitenkopf: Bereich links, Kennzahlen rechts */
.page-head{display:flex;align-items:center;justify-content:space-between;gap:20px 28px;flex-wrap:wrap;margin:0 0 22px;padding-bottom:18px;border-bottom:1px solid var(--line-soft)}
.page-head-main{display:flex;align-items:center;gap:14px;min-width:0}
.page-head-ic{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;color:#aab2ff;background:rgba(88,101,242,.14);border:1px solid rgba(88,101,242,.28)}
.page-head-ic svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.page-head .page-sub{margin-top:2px}
.head-stats{display:flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:14px;background:var(--surface);overflow:hidden}
.hs{display:flex;flex-direction:column;gap:3px;padding:10px 18px;border-left:1px solid var(--line-soft);min-width:96px}
.hs:first-child{border-left:0}
.hs-label{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2)}
.hs-val{display:inline-flex;align-items:center;gap:7px;font-size:15px;font-weight:650}
.tag-free{background:rgba(255,255,255,.07);color:var(--muted)}
@media (max-width:700px){.head-stats{width:100%}.hs{flex:1 1 40%;border-top:1px solid var(--line-soft)}}

.pill-plain{background:rgba(88,101,242,.12);border-color:rgba(88,101,242,.30);color:#c3c8ff}

.pill-dim{opacity:.6;border-style:dashed}

/* Gesperrte Pro-Funktionen */
.lock-badge{display:inline-block;margin-left:6px;padding:1px 9px;border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.05em;background:rgba(224,160,48,.14);color:#f0cd8a;border:1px solid rgba(224,160,48,.32)}
.lock-note{padding:8px 12px;border:1px dashed rgba(224,160,48,.4);border-radius:10px;background:rgba(224,160,48,.06);color:#f0cd8a}
.lock-note a{color:#ffe1a6;text-decoration:underline}
.set-form input:disabled,.set-form select:disabled,.set-form textarea:disabled{opacity:.45}

.plan-list{margin:0;padding-left:18px;display:grid;gap:6px;line-height:1.5}
.plan-pro li::marker{color:#e0a030}

/* Sprachumschalter */
.lang-select{width:auto;padding:5px 26px 5px 10px;font-size:12px;border-radius:8px;background-color:var(--bg);color:var(--muted);border:1px solid var(--line);cursor:pointer}
.top nav .lang-select{margin-right:6px}

/* Drei Pläne */
.plans{grid-template-columns:repeat(3,1fr)!important;max-width:1060px!important}
.plan.community{border-color:rgba(224,160,48,.5)}
.plan.community li::before{background:#e0a030}
@media (max-width:900px){.plans{grid-template-columns:1fr!important}}
.tag-community{background:rgba(224,160,48,.16);color:#f0cd8a}
.plan-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;align-items:stretch}
.plan-card.is-current{border-color:rgba(88,101,242,.6)}
.plan-card.plan-community.is-current{border-color:rgba(224,160,48,.6)}
.plan-lead{font-size:13px;font-weight:600;color:var(--muted);margin-bottom:8px}

.set-grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:14px}

/* ---------- Seitenleiste: moderner ---------- */
.sidebar{display:flex;flex-direction:column;padding:18px 12px 12px;background:linear-gradient(180deg,var(--surface) 0%,var(--bg) 140%)}
.side-brand{padding:2px 8px 16px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.side-brand-title{font-size:16px}
.side-context{margin-bottom:10px;padding:0 4px}
.side-context .guild-select{background:var(--surface-2);border-radius:10px;padding:10px 12px;font-size:14px;font-weight:600;cursor:pointer}
.side-context .guild-select:hover{border-color:rgba(255,255,255,.18)}
.sidebar .nav-title{padding:0 10px;margin:8px 0 8px}
.sidebar .nav{gap:3px}
.sidebar .nav-item{padding:10px 12px;border-radius:10px;border-left:0;font-size:14px;transition:background .15s,color .15s,transform .15s}
.sidebar .nav-item:hover{background:rgba(255,255,255,.05);color:var(--text)}
.sidebar .nav-item.active{
    background:linear-gradient(135deg,var(--brand),color-mix(in srgb,var(--brand) 70%,#000));color:#fff;
    box-shadow:0 6px 18px -8px var(--brand);
}
.sidebar .nav-item.active .nav-icon{color:#fff;opacity:1}
.sidebar .nav-item.active .nav-tag{background:rgba(255,255,255,.22)}
.sidebar .nav-icon{width:18px;height:18px;flex:0 0 18px;margin-right:12px}
.sidebar .nav-tag{margin-left:auto}
.side-foot{
    margin-top:auto;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);
}
.side-foot .user-row{align-items:center}
.side-foot .user-text{min-width:0}
.side-foot .avatar{width:36px;height:36px}
.side-logout{
    display:flex;align-items:center;justify-content:center;width:34px;height:34px;flex:0 0 34px;border-radius:9px;
    color:var(--muted);border:1px solid var(--line);transition:background .15s,color .15s,border-color .15s;
}
.side-logout svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.side-logout:hover{background:rgba(224,80,80,.14);color:#ff8a8a;border-color:rgba(224,80,80,.4)}
.side-lang{margin-top:10px}
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-thumb{background:var(--line);border-radius:6px}

.sidebar .nav-group{
    padding:14px 12px 5px;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);
}
.sidebar .nav > .nav-group:first-child{padding-top:4px}

.side-foot .side-logout{width:auto;height:auto;flex:none;display:flex;gap:8px;justify-content:center;margin-top:10px;padding:9px 12px;font-size:13px;font-weight:600;color:#ff9a9a;background:rgba(224,80,80,.10);border:1px solid rgba(224,80,80,.35)}
.side-foot .side-logout svg{width:16px;height:16px;flex:0 0 16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.side-foot .side-logout:hover{background:rgba(224,80,80,.2);color:#fff}

/* ---------- Lager und Tiere ---------- */
.meter-blue{background:var(--brand)}
.stk-row{display:flex;align-items:center;gap:8px;font-size:12px}
.stk-label{width:96px;flex:none;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stk-row .meter{flex:1}
.stk-val{min-width:70px;text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.stk-chips{display:flex;flex-wrap:wrap;gap:8px}
.stk-chip{padding:6px 11px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);font-size:13px;color:var(--muted)}
.stk-chip b{color:var(--text);font-weight:600;margin-right:4px}
.mcard .meter-label{width:84px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Balken in Karten einheitlich: Name | Balken | Wert */
.mcard .meter-row,.mcard .stk-row{display:grid;grid-template-columns:92px minmax(0,1fr) 84px;align-items:center;gap:10px;font-size:12px}
.mcard .meter-row .meter,.mcard .stk-row .meter{width:100%;min-width:0}
.mcard .meter-label,.mcard .stk-label{width:auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted-2)}
.mcard .meter-val,.mcard .stk-val{width:auto;min-width:0;text-align:right;white-space:nowrap}
.mcard .meter-row > .muted{grid-column:2 / 4;text-align:right}

.trend{display:inline-block;width:22px;font-size:15px;font-weight:700}
.trend-up{color:var(--green)}
.trend-down{color:var(--danger)}
.trend-flat{color:var(--muted-2)}
.trend{width:auto;font-size:18px;cursor:help}

.price-row{cursor:pointer}
.price-stations summary{cursor:pointer;list-style:none}
.price-stations summary::-webkit-details-marker{display:none}
.price-stations summary::after{content:" ▾";color:var(--muted-2)}
.price-stations[open] summary::after{content:" ▴"}
.price-sub{margin-top:8px;width:auto;min-width:280px;font-size:13px}
.price-sub td{padding:3px 14px 3px 0;border:0;color:var(--muted)}
.price-sub tr:first-child td{color:var(--text);font-weight:600}

/* ---------- Obere Leiste ---------- */
.topnav{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    margin:-8px 0 20px;padding:0 0 14px;border-bottom:1px solid var(--line);
}
.topnav-left{display:flex;align-items:center;gap:8px;min-width:0;font-size:14px;color:var(--muted-2)}
.topnav-guild{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topnav-sep{opacity:.5}
.topnav-page{color:var(--text);font-weight:600}
.topnav-right{display:flex;align-items:center;gap:6px}
.topnav-link{
    position:relative;display:flex;align-items:center;gap:7px;padding:8px 12px;border-radius:9px;
    color:var(--muted);font-size:13.5px;font-weight:500;transition:background .15s,color .15s;
}
.topnav-link:hover{background:rgba(255,255,255,.06);color:var(--text)}
.topnav-link svg,.topnav-caret{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.topnav-badge{min-width:18px;padding:1px 6px;border-radius:999px;background:var(--brand);color:#fff;font-size:11px;font-weight:700;text-align:center}
.topnav-user{position:relative;margin-left:6px}
.topnav-user summary{
    list-style:none;display:flex;align-items:center;gap:9px;padding:5px 10px 5px 6px;border-radius:999px;
    border:1px solid var(--line);background:var(--surface);cursor:pointer;transition:border-color .15s;
}
.topnav-user summary::-webkit-details-marker{display:none}
.topnav-user summary:hover,.topnav-user[open] summary{border-color:rgba(255,255,255,.2)}
.topnav-user .avatar{width:28px;height:28px;font-size:12px}
.topnav-name{font-size:13.5px;font-weight:600;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topnav-menu{
    position:absolute;right:0;top:calc(100% + 8px);z-index:50;min-width:220px;padding:6px;border-radius:12px;
    background:var(--surface);border:1px solid var(--line);box-shadow:0 18px 40px -12px rgba(0,0,0,.6);display:grid;gap:2px;
}
.topnav-menu-head{display:grid;gap:1px;padding:8px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:4px}
.topnav-menu-head span{font-size:12px;color:var(--muted-2);overflow:hidden;text-overflow:ellipsis}
.topnav-menu a{padding:9px 10px;border-radius:8px;color:var(--muted);font-size:14px}
.topnav-menu a:hover{background:rgba(255,255,255,.06);color:var(--text)}
.topnav-menu a.topnav-out{color:#ff9a9a}
@media (max-width:900px){.topnav-link span,.topnav-name,.topnav-left{display:none}.topnav{justify-content:flex-end}}

.topnav-lang{display:flex;align-items:center}
.topnav-lang select{background:var(--surface);border:1px solid var(--line);color:var(--text);border-radius:9px;padding:7px 10px;font-size:13px}
.topnav-user{margin-left:2px}
/* Preise: feste Spaltenbreiten, damit aufgeklappte Verkaufsstellen nichts verschieben */
#priceTable{table-layout:fixed;width:100%}
#priceTable th:nth-child(1){width:22%}
#priceTable th:nth-child(2){width:12%}
#priceTable th:nth-child(3){width:32%}
#priceTable th:nth-child(4){width:9%}
#priceTable th:nth-child(5){width:12%}
#priceTable th:nth-child(6){width:13%}
#priceTable td{overflow:hidden;text-overflow:ellipsis;vertical-align:top}
#priceTable .price-row > td{padding-top:14px}
.price-sub{min-width:0;width:100%;table-layout:auto}
.price-sub td{white-space:nowrap;overflow:visible}

/* ---------- Startseite ---------- */
.start-hero{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:22px;padding:24px 26px;border-radius:16px;
    background:linear-gradient(135deg,rgba(88,101,242,.22),rgba(58,68,214,.06));border:1px solid var(--line)}
.start-hero h1{margin:0 0 4px;font-size:26px;letter-spacing:-.02em}
.start-hero p{margin:0;color:var(--muted)}
.start-empty{padding:22px;border:1px dashed var(--line);border-radius:14px;text-align:center;color:var(--muted)}
.start-empty h3{margin:0 0 6px;color:var(--text)}
.srv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}
.srv-card{display:flex;flex-direction:column;gap:14px;padding:18px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line);transition:border-color .15s,transform .15s}
.srv-card:hover{border-color:rgba(255,255,255,.2);transform:translateY(-1px)}
.srv-top{display:flex;gap:12px;align-items:center}
.srv-card .av{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:700;background:hsl(var(--h) 45% 32%);color:#fff}
.srv-id{min-width:0}
.srv-name{font-weight:650;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srv-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.chip-pro{background:rgba(88,101,242,.22);color:#aab2ff}
.chip-community{background:rgba(59,165,93,.2);color:#8fe0ad}
.srv-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.srv-stats div{display:grid;gap:2px;padding:9px 10px;border-radius:10px;background:rgba(255,255,255,.03)}
.srv-stats b{font-size:17px}
.srv-stats span{font-size:11.5px;color:var(--muted-2)}
.srv-text{margin:0;font-size:13.5px;color:var(--muted);min-height:36px}
.srv-foot{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}

.onboard-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.onboard-list li{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line)}
.onboard-list li > div{flex:1;font-size:14px}
.onboard-list li.is-done{opacity:.6}
.onboard-mark{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:2px solid var(--line);font-size:13px;color:#fff}
.onboard-list li.is-done .onboard-mark{background:var(--green);border-color:var(--green)}

/* ---------- Startseite: Kacheln (überschreibt die einfache Version) ---------- */
.start-hero{position:relative;overflow:hidden;padding:30px 32px;border-radius:20px;margin-bottom:26px;gap:22px;
    background:radial-gradient(900px 260px at 0% 0%,rgba(124,135,255,.35),transparent 60%),linear-gradient(135deg,#232744,#171a2b);border:1px solid rgba(124,135,255,.25)}
.start-hero h1{font-size:30px}
.start-hero p{max-width:520px}
.start-stats{display:flex;gap:12px;margin-left:auto}
.start-stats div{display:grid;gap:2px;min-width:92px;padding:12px 16px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.start-stats b{font-size:22px}
.start-stats span{font-size:12px;color:var(--muted)}
.srv-grid{grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:18px}
.srv-card{padding:0;overflow:hidden;gap:0;border-radius:18px;background:var(--surface);position:relative}
.srv-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -18px rgba(0,0,0,.7);border-color:rgba(255,255,255,.22)}
.srv-banner{height:84px;position:relative;background:
    radial-gradient(160px 80px at 85% 20%,hsl(var(--h) 70% 60% / .55),transparent 70%),
    linear-gradient(135deg,hsl(var(--h) 50% 30%),hsl(calc(var(--h) + 40) 55% 20%))}
.srv-role{position:absolute;top:10px;right:12px;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.04em;background:rgba(0,0,0,.35);color:#fff;backdrop-filter:blur(4px)}
.srv-top{padding:0 18px;margin-top:-26px;align-items:flex-end}
.srv-card .av{width:54px;height:54px;border-radius:15px;font-size:20px;border:3px solid var(--surface);box-shadow:0 6px 16px -6px rgba(0,0,0,.6)}
.srv-id{padding-bottom:2px}
.srv-name{font-size:17px}
.srv-stats{margin:16px 18px 0}
.srv-text{padding:12px 18px 0}
.srv-foot{padding:16px 18px 18px}
.srv-card > .srv-foot .btn{flex:1;justify-content:center}
.srv-new{align-items:center;justify-content:center;text-align:center;gap:8px;min-height:230px;padding:24px;border:2px dashed var(--line);background:transparent;color:var(--text)}
.srv-new:hover{border-color:var(--brand);background:rgba(88,101,242,.07)}
.srv-new-plus{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--brand);color:#fff;font-size:28px;line-height:1}
@media (max-width:760px){.start-stats{margin-left:0;width:100%}.start-stats div{flex:1}}

/* Startseite: Feinschliff */
.srv-top{position:relative;z-index:1;margin-top:-30px;padding:0 20px;align-items:flex-end;gap:14px}
.srv-card .av{width:58px;height:58px;border-radius:16px;font-size:22px}
.srv-id{padding-bottom:4px;min-width:0}
.srv-name{margin-top:34px;color:var(--text);position:relative}
.srv-top .srv-id{align-self:flex-end}
.srv-stats{margin:18px 20px 0}
.srv-foot{padding:18px 20px 20px}
.srv-text{padding:12px 20px 0}
.start-hero{display:grid;grid-template-columns:1fr auto;align-items:center}
.start-side{display:grid;gap:12px;justify-items:end}
.start-side .start-stats{margin-left:0}
.start-code{display:flex;gap:8px;align-items:center}
.start-code input{width:190px;text-transform:uppercase;letter-spacing:.08em;background:rgba(0,0,0,.25)}
@media (max-width:900px){.start-hero{grid-template-columns:1fr}.start-side{justify-items:stretch}.start-code input{flex:1;width:auto}}

/* Aussehen: eigene Farbe und Bild */
.srv-card.has-color .srv-banner{background-image:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 45%,#000))}
.srv-card.has-color .av{background:var(--c)}
.srv-banner[style*="url("]{background-size:cover;background-position:center}
.look-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,1fr);gap:24px;align-items:start}
.look-fields{display:grid;gap:14px}
.look-preview .srv-card{max-width:340px}
.branding-row{display:flex;gap:14px;align-items:center}
.branding-avatar{width:72px;height:72px;border-radius:50%;background:var(--bg);border:1px solid var(--line);overflow:hidden;flex:0 0 72px;display:grid;place-items:center;color:var(--muted-2);font-size:12px}
.branding-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.embed-prev{max-width:360px;padding:12px 14px;border-radius:6px;background:var(--surface-2);border-left:4px solid var(--ec,#5865f2);display:grid;gap:6px;font-size:14px}
.embed-title{font-weight:700}
.embed-foot{font-size:12px;color:var(--muted-2);margin-top:4px}
@media (max-width:900px){.look-grid{grid-template-columns:1fr}}

/* Serverübersicht ohne Seitenleiste */
.layout.no-side{grid-template-columns:1fr}
.layout.no-side .sidebar,.layout.no-side .mobilebar{display:none}
.layout.no-side .main{max-width:1280px;margin:0 auto;width:100%}
.topnav-brand{display:flex;align-items:center;gap:10px;color:var(--text);font-weight:650;font-size:16px}
.topnav-brand img{width:30px;height:30px;border-radius:8px}
.layout.no-side .topnav-left{display:flex}
@media (max-width:900px){.layout.no-side .topnav-left{display:flex}.layout.no-side .topnav{justify-content:space-between}}
.onboard{margin-bottom:22px}

.stk-row.has-act{grid-template-columns:92px minmax(0,1fr) 84px 24px !important}
.stk-edit{border:0;background:transparent;color:var(--muted-2);cursor:pointer;font-size:14px;padding:0;line-height:1}
.stk-edit:hover{color:var(--text)}

/* Startseite: mehr Inhalt, zwei Spalten */
.layout.no-side .main{max-width:1380px}
.start-cols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start}
.start-main{min-width:0}
.start-aside{display:grid;gap:16px;position:sticky;top:20px}
.aside-card{margin-bottom:0}
.aside-card .section-title{font-size:15px}
.aside-list,.aside-news{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.aside-list a{display:grid;gap:2px;padding:10px 12px;border-radius:10px;background:var(--surface-2);border:1px solid var(--line);color:var(--text)}
.aside-list a:hover{border-color:rgba(255,255,255,.2)}
.aside-list b{font-size:14px}
.aside-list span,.aside-news span{font-size:12.5px;color:var(--muted-2)}
.aside-news li{display:grid;gap:2px;padding:10px 12px;border-left:3px solid var(--brand);background:rgba(88,101,242,.07);border-radius:0 10px 10px 0}
.aside-news b{font-size:14px}
.aside-links{display:flex;gap:8px;flex-wrap:wrap}
.start-hero{background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='200' viewBox='0 0 520 200'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.07' stroke-width='2'%3E%3Cpath d='M0 150c80-30 160-30 240 0s160 30 280 0M0 175c80-30 160-30 240 0s160 30 280 0M0 125c80-30 160-30 240 0s160 30 280 0'/%3E%3Cpath d='M380 120V70l40-30 40 30v50zM420 120V90h20v30'/%3E%3C/g%3E%3C/svg%3E") right bottom/auto 100% no-repeat,
    radial-gradient(900px 260px at 0% 0%,rgba(124,135,255,.35),transparent 60%),linear-gradient(135deg,#232744,#171a2b)}
@media (max-width:1100px){.start-cols{grid-template-columns:1fr}.start-aside{position:static}}

.support-actions{display:grid;gap:8px}
.support-btn{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);color:var(--text);transition:border-color .15s,transform .15s}
.support-btn:hover{border-color:var(--brand);transform:translateY(-1px)}
.support-btn b{display:block;font-size:14px}
.support-btn small{display:block;font-size:12px;color:var(--muted-2)}
.support-ic{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.06);font-size:19px;flex:none}
.support-discord{background:linear-gradient(135deg,#5865f2,#3f4ad0);border-color:transparent;color:#fff}
.support-discord small{color:rgba(255,255,255,.8)}
.support-discord .support-ic{background:rgba(255,255,255,.2)}

/* ---------- Seiten Verzeichnis und Feedback ---------- */
.page-hero{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
    padding:30px 32px;border-radius:20px;margin-bottom:22px;border:1px solid rgba(124,135,255,.25);
    background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='200' viewBox='0 0 520 200'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.07' stroke-width='2'%3E%3Cpath d='M0 150c80-30 160-30 240 0s160 30 280 0M0 175c80-30 160-30 240 0s160 30 280 0M0 125c80-30 160-30 240 0s160 30 280 0'/%3E%3Cpath d='M380 120V70l40-30 40 30v50zM420 120V90h20v30'/%3E%3C/g%3E%3C/svg%3E") right bottom/auto 100% no-repeat,
    radial-gradient(900px 260px at 0% 0%,rgba(124,135,255,.35),transparent 60%),linear-gradient(135deg,#232744,#171a2b)}
.page-hero h1{margin:0 0 6px;font-size:30px;letter-spacing:-.02em}
.page-hero p{margin:0;color:var(--muted);max-width:560px}
.page-hero .hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.filter-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 22px;padding:12px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.filter-bar input[type="text"]{flex:1;min-width:220px;max-width:none}
.filter-bar select{width:auto;min-width:150px}
.filter-bar .check{margin:0}
.dir-filter select{width:auto;min-width:150px}
.dir-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:18px}
.srv-card .srv-extra{display:flex;gap:8px;align-items:center;padding:0 20px 18px;flex-wrap:wrap}
.srv-card details.dir-report{margin-left:auto}
.srv-card details.dir-report summary{cursor:pointer;color:var(--muted-2);font-size:13px;list-style:none}
.srv-card details.dir-report form{display:flex;gap:6px;margin-top:8px}
.empty-art{display:grid;place-items:center;gap:10px;padding:46px 20px;border:1px dashed var(--line);border-radius:18px;text-align:center;color:var(--muted)}
.empty-art .ea-ic{font-size:44px}
.empty-art h3{margin:0;color:var(--text)}
.fb-row{transition:border-color .15s,transform .15s}
.fb-row:hover{transform:translateY(-1px)}
.fb-cols{grid-template-columns:minmax(0,1fr) 340px}
@media (max-width:900px){.fb-cols{grid-template-columns:1fr}}

/* Kompakte Darstellung (Einstellung pro Person) */
body.compact .main{padding-top:18px;padding-bottom:30px}
body.compact .section{padding:16px 18px;margin-bottom:12px}
body.compact .fcard,body.compact .mcard{padding:12px}
body.compact .stat{padding:10px 12px}
body.compact table td,body.compact table th{padding-top:7px;padding-bottom:7px}
/* Seitenspalte (Feedback, Einstellungen) */
.fb-side{display:grid;gap:14px;position:sticky;top:16px}
.fb-card{padding:16px}
.fb-card h4{margin:0 0 10px;font-size:14px;color:var(--muted)}
.fb-mini{display:grid;gap:6px}
.fb-mini a{display:flex;gap:10px;align-items:baseline;padding:8px 10px;border-radius:9px;background:var(--surface-2);color:var(--text);font-size:13.5px}
.fb-mini a:hover{background:rgba(88,101,242,.14)}
.fb-mini-v{color:var(--muted-2);font-size:12px;white-space:nowrap}
@media (max-width:900px){.fb-side{position:static}}

/* ---------- Gemeinsamer Seitenrahmen und Handy ---------- */
section.block.page-block{padding:34px 0 64px;border-top:0}
.top nav{display:flex;gap:10px;align-items:center}
.page-user{margin-left:2px}
.page-user .avatar{width:28px;height:28px;font-size:12px}
.page-foot{border-top:1px solid var(--line);padding:22px 0;color:var(--muted-2);font-size:13px}
.page-foot .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.page-foot a{color:var(--muted)}
.page-foot a:hover{color:var(--text)}
@media (max-width:760px){
    section.block.page-block{padding:20px 0 40px}
    .top .wrap{height:auto;min-height:58px;padding-top:8px;padding-bottom:8px}
    .top nav{gap:6px}
    .page-hero,.start-hero{padding:22px 18px;border-radius:16px;gap:14px}
    .page-hero h1,.start-hero h1{font-size:24px}
    input,select,textarea{font-size:16px}
    .btn{min-height:42px}
    .filter-bar select,.filter-bar input[type="text"]{width:100%;flex:1 1 100%;min-width:0}
    .srv-grid,.dir-grid{grid-template-columns:1fr}
    .fb-row{flex-wrap:wrap}
    .fb-row .pill{margin-left:68px}
    .fb-detail-hero{flex-direction:row}
    .acc-id{flex-direction:column;align-items:flex-start;gap:12px}
    .acc-av{width:68px;height:68px;font-size:28px}
    .tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
    .tabs a,.tabs button{white-space:nowrap}
    dialog.modal{width:calc(100vw - 16px);max-width:none;margin:8px auto}
    .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .section{overflow-x:auto}
    .topnav{padding-bottom:10px;margin-bottom:14px}
    .topnav-lang select{max-width:118px}
    .plan-pick{grid-template-columns:1fr}
    .steps{flex-direction:column}
    .look-preview .srv-card{max-width:none}
}
@media (max-width:480px){
    .top .brand span{display:none}
    .page-user .topnav-name{display:none}
    .start-stats{flex-wrap:wrap}
    .start-code{flex-wrap:wrap}
    .start-code input{width:100%}
    .srv-stats{grid-template-columns:repeat(2,1fr)}
    .head-stats .hs{flex:1 1 45%}
}

.layout.no-side .main{max-width:1400px}
.layout.no-side .page-foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* ---------- Startseite (Werbeseite) ---------- */
.lp .wrap{padding:0 24px}
.lp-hero{position:relative;overflow:hidden;padding:72px 0 64px;
    background:radial-gradient(900px 420px at 15% -10%,rgba(124,135,255,.28),transparent 60%),radial-gradient(700px 380px at 95% 10%,rgba(58,68,214,.22),transparent 60%)}
.lp-hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}
.lp-copy h1{margin:0 0 18px;font-size:48px;line-height:1.1;font-weight:750;letter-spacing:-.03em}
.lp-grad{background:linear-gradient(90deg,#aab2ff,#7c87ff 50%,#59d0a2);-webkit-background-clip:text;background-clip:text;color:transparent}
.lp-copy .lead{font-size:18px;color:var(--muted);max-width:560px;margin:0 0 24px}
.lp-checks{display:flex;flex-wrap:wrap;gap:8px 20px;list-style:none;margin:22px 0 0;padding:0;color:var(--muted);font-size:14px}
.lp-checks li::before{content:"✓";color:var(--green);margin-right:7px;font-weight:700}
.lp-visual{position:relative}
.lp-window{border-radius:16px;overflow:hidden;background:var(--surface);border:1px solid var(--line);box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.lp-bar{display:flex;align-items:center;gap:6px;padding:11px 14px;background:var(--surface-2);border-bottom:1px solid var(--line)}
.lp-bar i{width:10px;height:10px;border-radius:50%;background:#444952}
.lp-bar span{margin-left:10px;font-size:12px;color:var(--muted-2)}
.lp-body{padding:18px;display:grid;gap:14px}
.lp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.lp-stats div{padding:12px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line)}
.lp-stats b{display:block;font-size:20px}
.lp-stats span{font-size:12px;color:var(--muted-2)}
.lp-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lp-f{padding:10px 12px;border-radius:10px;background:var(--surface-2);border:1px solid var(--line);border-left:3px solid #3d9dd8}
.lp-f.ready{border-left-color:var(--green)}
.lp-f.warn{border-left-color:var(--warn)}
.lp-f b{display:block;font-size:14px}
.lp-f span{font-size:12px;color:var(--muted-2)}
.lp-row{display:grid;grid-template-columns:70px 1fr 24px;gap:12px;align-items:center;font-size:13px;color:var(--muted)}
.lp-meter{height:7px;border-radius:999px;background:var(--surface-2);overflow:hidden}
.lp-meter i{display:block;height:100%;border-radius:999px;background:var(--brand)}
.up{color:var(--green)}.down{color:var(--danger)}.flat{color:var(--muted-2)}
.lp-discord{position:absolute;right:-18px;bottom:-34px;width:78%;max-width:380px;box-shadow:0 24px 50px -20px rgba(0,0,0,.8)}
.lp-section{padding:72px 0}
.lp-alt{background:linear-gradient(180deg,transparent,rgba(255,255,255,.025),transparent);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.lp-section h2{margin:0 0 10px;font-size:32px;font-weight:700;letter-spacing:-.02em;text-align:center}
.lp-section .sub{max-width:640px;margin:0 auto 38px;text-align:center;color:var(--muted)}
.lp-features{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.lp-feature{padding:22px;border-radius:16px;background:var(--surface);border:1px solid var(--line);transition:border-color .15s,transform .15s}
.lp-feature:hover{border-color:rgba(124,135,255,.5);transform:translateY(-3px)}
.lp-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;font-size:23px;margin-bottom:14px;background:linear-gradient(135deg,rgba(124,135,255,.25),rgba(58,68,214,.1));border:1px solid rgba(124,135,255,.25)}
.lp-feature h3{margin:0 0 6px;font-size:16px}
.lp-feature p{margin:0;color:var(--muted);font-size:14px}
.lp-showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.lp-card{padding:20px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.lp-card h3{margin:0 0 14px;font-size:15px;color:var(--muted)}
.lp-bars{display:grid;gap:12px}
.lp-bars div{display:grid;grid-template-columns:56px 1fr 60px;gap:10px;align-items:center;font-size:13px;color:var(--muted)}
.lp-bars i{height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden;display:block}
.lp-bars b{display:block;height:100%;background:var(--brand);border-radius:999px}
.lp-bars b.amber{background:var(--warn)}
.lp-bars em{font-style:normal;text-align:right;color:var(--text)}
.lp-prices,.lp-plan{display:grid;gap:10px}
.lp-prices div,.lp-plan div{display:grid;grid-template-columns:1fr auto 24px;gap:10px;align-items:center;padding:10px 12px;border-radius:10px;background:var(--surface-2);font-size:14px}
.lp-prices em{font-style:normal;font-size:16px}
.lp-plan div{grid-template-columns:62px 1fr auto}
.lp-plan em{font-style:normal;font-weight:700;color:#aab2ff}
.lp-plan span{color:var(--muted)}
.lp-accept{display:block !important;text-align:center;background:var(--brand) !important;color:#fff;font-weight:600}
.lp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.lp-step{padding:24px;border-radius:16px;background:var(--surface);border:1px solid var(--line);position:relative}
.lp-step b{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--brand);color:#fff;font-size:17px;margin-bottom:12px}
.lp-step h3{margin:0 0 6px}
.lp-step p{margin:0;color:var(--muted)}
.lp-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.lp-plan-card{position:relative;display:flex;flex-direction:column;gap:12px;padding:26px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.lp-plan-card.featured{border-color:var(--brand);background:linear-gradient(180deg,rgba(88,101,242,.14),var(--surface))}
.lp-plan-card h3{margin:0;font-size:22px}
.lp-plan-card .price{font-size:26px;font-weight:700}
.lp-plan-card ul{margin:0;padding:0;list-style:none;display:grid;gap:9px;color:var(--muted);font-size:14px;flex:1}
.lp-plan-card li::before{content:"✓";color:var(--green);margin-right:8px;font-weight:700}
.lp-badge{position:absolute;top:-12px;right:20px;padding:4px 12px;border-radius:999px;background:var(--brand);color:#fff;font-size:12px;font-weight:700}
.lp-faq{display:grid;gap:10px}
.lp-faq details{padding:16px 18px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.lp-faq summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:12px}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary::after{content:"+";color:var(--muted-2);font-size:20px;line-height:1}
.lp-faq details[open] summary::after{content:"–"}
.lp-faq p{margin:10px 0 0;color:var(--muted)}
.lp-cta{padding:56px 0}
.lp-cta .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:38px 40px;border-radius:22px;
    background:radial-gradient(700px 240px at 0% 0%,rgba(124,135,255,.35),transparent 60%),linear-gradient(135deg,#232744,#171a2b);border:1px solid rgba(124,135,255,.3)}
.lp-cta h2{margin:0 0 6px;font-size:28px}
.lp-cta p{margin:0;color:var(--muted)}
@media (max-width:1100px){
    .lp-features{grid-template-columns:repeat(2,1fr)}
    .lp-showcase,.lp-plans{grid-template-columns:1fr}
}
@media (max-width:900px){
    .lp-hero{padding:44px 0 56px}
    .lp-hero .wrap{grid-template-columns:1fr;gap:40px}
    .lp-copy h1{font-size:34px}
    .lp-discord{position:static;width:100%;max-width:none;margin-top:14px}
    .lp-steps{grid-template-columns:1fr}
    .lp-section{padding:48px 0}
    .lp-section h2{font-size:26px}
}
@media (max-width:560px){
    .lp-features{grid-template-columns:1fr}
    .lp-fields{grid-template-columns:1fr}
    .lp-cta .wrap{padding:26px 22px}
    .lp-copy h1{font-size:30px}
}

.lp-demo-link{margin-left:auto;font-size:12px;color:#aab2ff}
.lp-demo-link:hover{color:#fff}

.demo-banner{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 18px;margin-bottom:18px;border-radius:14px;background:rgba(224,160,48,.1);border:1px solid rgba(224,160,48,.35);color:#f3d9a4}

form.demo-locked input:disabled,form.demo-locked select:disabled,form.demo-locked textarea:disabled{cursor:not-allowed;opacity:.75}
form.demo-locked button:disabled{cursor:not-allowed;opacity:.6}
@media (max-width:760px){.start-empty[style*="span 2"]{grid-column:auto !important}}

.plan-price{font-size:22px;font-weight:700;margin:2px 0 6px}

.lp-modbox{display:flex;align-items:center;gap:22px;flex-wrap:wrap;padding:26px 30px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
.lp-modtext{flex:1;min-width:260px}
.lp-modtext h2{margin:0 0 6px;font-size:24px;text-align:left}
.lp-modtext p{margin:0;color:var(--muted)}
.lp-modbox .lp-ic{margin:0}

/* Server-Verzeichnis: lange Beschreibung einklappen, Melden als kleiner Knopf */
.srv-clamp{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.srv-morewrap{padding:4px 20px 0}
.srv-more{background:none;border:0;padding:0;color:var(--brand-2,#8a94ff);font-size:13px;cursor:pointer}
.srv-more:hover{text-decoration:underline}
.srv-foot .srv-report{flex:none;display:grid;place-items:center;width:42px;height:auto;align-self:stretch;border-radius:10px;border:1px solid var(--line);background:transparent;color:var(--muted-2);cursor:pointer}
.srv-foot .srv-report:hover{color:var(--text);border-color:rgba(255,255,255,.3)}
.srv-report svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Server löschen: abgesetzter Gefahrenbereich */
.danger-zone{border-color:rgba(229,72,77,.45)}
.danger-zone .section-title{color:#ff8f93}

/* Server-Status: Vorschau der Discord-Nachricht */
.st-prev .embed{margin-top:6px}
.st-top{display:flex;gap:12px;justify-content:space-between;align-items:flex-start}
.st-main{min-width:0}
.st-desc{white-space:pre-line;font-size:13px;color:#dbdee1;margin-bottom:8px}
.st-thumb{width:56px;height:56px;border-radius:6px;object-fit:cover;flex:none}
.st-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 14px;font-size:13px}
.st-field{min-width:0}
.st-field.wide{grid-column:1/-1}
.st-field span{display:block;color:#a3a6ad;font-size:11px;font-weight:600;margin-bottom:2px}
.st-field b{display:block;font-weight:500;white-space:pre-line;word-break:break-word}
.st-foot{margin-top:10px;font-size:11px;color:#a3a6ad}
@media (max-width:560px){.st-fields{grid-template-columns:1fr 1fr}}

/* Einklappbare Abschnitte (Admin → Discord-Bot) */
.acc-tools{display:flex;gap:8px;justify-content:flex-end;margin:0 0 10px}
details.acc{padding:0}
details.acc > summary{list-style:none;display:flex;align-items:center;gap:12px;padding:16px 20px;cursor:pointer;user-select:none}
details.acc > summary::-webkit-details-marker{display:none}
details.acc > summary .section-title{margin:0;flex:1}
.acc-state{font-size:12px;color:var(--muted-2);background:var(--surface-2);border:1px solid var(--line);padding:2px 10px;border-radius:999px}
.acc-chev{width:9px;height:9px;border-right:2px solid var(--muted-2);border-bottom:2px solid var(--muted-2);transform:rotate(45deg);transition:transform .15s;margin:0 4px 3px}
details.acc[open] > summary .acc-chev{transform:rotate(-135deg);margin-top:5px}
details.acc[open] > summary{border-bottom:1px solid var(--line)}
.acc-body{padding:18px 20px 20px}

/* Einklappbare Abschnitte: Feinschliff (überschreibt die allgemeinen Regeln für Formular-Abschnitte) */
.set-form details.acc{grid-column:1/-1;display:block;padding:0;border-radius:16px;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.set-form details.acc:hover{border-color:rgba(255,255,255,.2)}
.set-form details.acc[open]{border-color:rgba(124,135,255,.35);box-shadow:0 14px 34px -24px rgba(0,0,0,.8)}
details.section.acc>summary::before,details.section.acc[open]>summary::before{content:none;display:none}
.set-form details.acc>summary{display:flex;align-items:center;gap:14px;padding:16px 20px}
.set-form details.acc>summary:hover{background:rgba(255,255,255,.025)}
.acc-ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:18px;font-weight:700;background:linear-gradient(135deg,rgba(124,135,255,.22),rgba(88,101,242,.1));border:1px solid rgba(124,135,255,.28);color:#c8cdff}
.acc-head{flex:1;min-width:0;display:grid;gap:2px}
.acc-head .section-title{margin:0;font-size:15.5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.acc-sub{font-size:12.5px;color:var(--muted-2);font-weight:400}
.set-form details.acc>summary .acc-state{margin-left:auto;flex:none}
.acc-state{font-size:12px;font-weight:600;color:var(--muted);background:rgba(255,255,255,.05);border:1px solid var(--line);padding:3px 11px;border-radius:999px}
.set-form details.acc[open]>summary{border-bottom:1px solid var(--line)}
.set-form details.acc>.acc-body{display:block;padding:20px 22px 22px}
.acc-tools{display:flex;gap:8px;justify-content:flex-end;margin:0 0 12px}
@media (max-width:640px){.acc-sub{display:none}.acc-ic{width:34px;height:34px}}

/* Einklappbare Abschnitte: jeder steht für sich, volle Breite, die Höhe richtet sich nach dem eigenen Inhalt */
.set-form details.acc{align-self:start;width:100%}
.set-form:has(details.acc){grid-template-columns:1fr;align-items:start}
.set-form.acc-form{grid-template-columns:1fr;align-items:start}

/* Discord-Bot: Panels links, Vorschau rechts (bleibt beim Scrollen sichtbar) */
.bot-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:20px;align-items:start}
.bot-main{min-width:0}
.bot-side{position:sticky;top:84px;align-self:start}
.st-sticky{padding:18px;display:grid;gap:12px}
.st-sticky h3{margin:0;font-size:15px}
@media (max-width:1100px){.bot-layout{grid-template-columns:1fr}.bot-side{position:static;order:-1}}

/* Einklappbare Abschnitte überall im Admin-Bereich */
details.acc{margin-bottom:14px}
.set-form details.acc,.set-form.acc-form details.acc{margin-bottom:0}
.set-form.acc-form{grid-template-columns:1fr;align-items:start;gap:14px}
details.acc>summary{display:flex;align-items:center;gap:14px;padding:16px 20px}
details.acc>.acc-body{display:block;padding:20px 22px 22px}
details.acc .section-title{margin-top:0}
details.acc.danger-zone{border-color:rgba(229,72,77,.45)}

/* Abstände im Inhalt der einklappbaren Abschnitte */
details.acc>.acc-body{display:flex;flex-direction:column;gap:14px}
details.acc>.acc-body>.field,details.acc>.acc-body>.checks,details.acc>.acc-body>.hint,details.acc>.acc-body>.row{margin:0}
details.acc>.acc-body .row-item:last-child{border-bottom:0}
details.acc + details.acc,form.acc-form + details.acc,.bot-main details.acc+details.acc{margin-top:14px}
details.acc[data-acc="roles-assign"]{margin-top:16px}

form.acc-form + form.acc-form{margin-top:14px}

/* Partner im Verzeichnis und bei „Server entdecken“: Abzeichen, Rahmen, stehen oben */
.srv-card.is-partner{border-color:rgba(124,135,255,.6);box-shadow:0 18px 40px -22px rgba(88,101,242,.55)}
.srv-role.srv-partner{background:linear-gradient(135deg,#6a76ff,#4a55e8);color:#fff;letter-spacing:.06em}

/* Partner-Karten: Symbol, Autor, Netzwerke */
.pt-card .av.av-img{padding:0;overflow:hidden;background:var(--surface-2)}
.pt-card .av.av-img img{width:100%;height:100%;object-fit:cover;display:block}
.pt-author{display:flex;align-items:center;gap:10px;padding:2px 20px 0;font-size:13px;color:var(--muted)}
.pt-author img,.pt-author-ph{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:none;border:2px solid var(--surface)}
.pt-author-ph{display:grid;place-items:center;background:var(--brand);color:#fff;font-weight:700;font-size:13px}
.pt-author small{color:var(--muted-2)}
.pt-author b{color:var(--text);font-weight:600}
.pt-social{display:flex;gap:8px;flex-wrap:wrap;padding:12px 20px 0}
.pt-social a{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid var(--line);color:var(--muted);transition:color .15s,border-color .15s,background .15s}
.pt-social a:hover{color:#fff;border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.06)}
.pt-social svg{width:18px;height:18px}
.pt-group{display:grid;gap:12px;padding:16px;border:1px solid var(--line);border-radius:12px}
.pt-group h3{margin:0;font-size:14px}
.pt-soc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}

.hue-pick{display:flex;flex-wrap:wrap;gap:8px}
.hue-dot{width:28px;height:28px;border-radius:50%;border:2px solid transparent;background:hsl(var(--h) 55% 45%);cursor:pointer;padding:0}
.hue-dot.on{border-color:#fff;box-shadow:0 0 0 2px hsl(var(--h) 55% 45%)}
.mcard{min-width:0;overflow:hidden}
.mcard .meter-row,.mcard .stk-row{grid-template-columns:minmax(60px,92px) minmax(30px,1fr) max-content}
.mcard .stk-val{font-size:11.5px}

/* Links auf der Server-Karte im Verzeichnis */
.srv-links{display:flex;gap:6px;flex-wrap:wrap;padding:0 18px 4px;margin-top:2px}
.srv-link{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:var(--surface-2);color:var(--muted-2);font-size:12px;text-decoration:none}
.srv-link:hover{border-color:var(--brand);color:var(--text)}
.srv-link svg{width:14px;height:14px;flex:none}

.price-trend{display:flex;align-items:center;justify-content:center;gap:10px;min-width:130px}
.price-trend .spark{width:64px;height:22px;flex:none}
.price-trend .spark polyline{fill:none;stroke:#8d95ff;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}

/* ---------- Kennkarten-Stil (einheitlich für alle Panels) ----------
   Eckig statt rund, abgeschrägte Ecke und Akzentkante, Messwerte und Beschriftungen in Monospace, Balken in Segmenten. */
:root{--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--cut:14px}

/* Abschnitte */
.section{border-radius:0;border:0;box-shadow:inset 0 0 0 1px var(--line)}
.section > .section-title,.section-head > .section-title{display:flex;align-items:center;gap:12px;font:700 13px var(--mono);letter-spacing:.14em;text-transform:uppercase}
.section > .section-title::after,.section-head > .section-title::after{content:"";flex:1;height:1px;background:var(--line);min-width:20px}
.section-head{gap:16px}
.section-head > .section-title{flex:1}
.section-title .muted{font-family:var(--mono);letter-spacing:0;text-transform:none}

/* Kennzahlen */
.stat{border:0;border-radius:0;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),inset 3px 0 0 var(--tone);padding:14px 22px 14px 20px;transition:box-shadow .15s}
.stat:hover{transform:none;box-shadow:inset 0 0 0 1px var(--tone),inset 3px 0 0 var(--tone)}
.stat-icon{border-radius:0}
.stat-label{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em}
.stat-value{font-family:var(--mono);font-size:28px;letter-spacing:-.01em}

/* Karten mit abgeschrägter Ecke und Akzentkante */
.mcard,.hcard,.fcard{position:relative;border:0;border-radius:0;box-shadow:inset 0 0 0 1px var(--line);background:#14171e;
    clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.mcard::before,.hcard::before,.fcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--brand);z-index:1}
.hcard::before{background:hsl(var(--h) 60% 55%)}
.fcard::before{background:var(--c)}
.hcard{background:#14171e}
.mc-ic{border-radius:0}
.mc-sub{font:600 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2)}
.mc-farm{font:600 11px var(--mono);color:#aab2ff;background:none;border:0;padding:0}
.badge{border-radius:0;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase}

/* Segmentbalken */
.meter{height:9px;border-radius:0;background:#272b36;
    -webkit-mask:repeating-linear-gradient(90deg,#000 0 calc(10% - 2px),transparent calc(10% - 2px) 10%);
    mask:repeating-linear-gradient(90deg,#000 0 calc(10% - 2px),transparent calc(10% - 2px) 10%)}
.meter-fill{border-radius:0}
.stk-val,.meter-val{font-family:var(--mono);font-size:11.5px}

/* Waren insgesamt: Anteilsbalken mit Legende */
.stk-stack{display:flex;height:14px;gap:2px;margin-bottom:14px}
.stk-stack i{display:block;min-width:3px}
.stk-legend{display:flex;flex-wrap:wrap;gap:6px 20px;font-size:13px;color:var(--muted)}
.stk-legend span{display:inline-flex;align-items:center;gap:7px}
.stk-legend i{width:10px;height:10px;flex:none}
.stk-legend b{font:600 12.5px var(--mono);color:var(--text)}

/* Tabellen, Buttons und Chips eckiger */
.chip,.chip-sm,.stk-chip{border-radius:0}
.chip-sm{font-family:var(--mono)}

/* Lager-Karten: Name und Wert oben, Segmentbalken über die volle Breite darunter */
.mcard .meter-row,.mcard .stk-row{grid-template-columns:minmax(0,1fr) max-content;row-gap:4px;column-gap:10px}
.mcard .meter-row .meter,.mcard .stk-row .meter{grid-column:1 / -1;grid-row:2}
.mcard .stk-row.has-act{grid-template-columns:minmax(0,1fr) max-content 24px}
.mcard .stk-row.has-act .meter{grid-column:1 / -1}
.btn{border-radius:0}

/* ---------- Lohnbuch im Kennkarten-Stil ---------- */
.account{border:0;border-radius:0;background:#14171e;box-shadow:inset 0 0 0 1px var(--line);position:relative;padding:22px 24px 20px 28px;
    clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.account::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--warn)}
.acc-label{font-family:var(--mono);font-size:11px;letter-spacing:.14em}
.acc-value{font-family:var(--mono);font-size:44px;letter-spacing:-.02em}
.acc-value small{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--warn)}
.acc-note{display:flex;align-items:center;gap:12px;margin-top:10px;font:600 12px var(--mono);letter-spacing:.06em;text-transform:uppercase}
.segbar{display:flex;gap:2px;flex:1;max-width:200px}
.segbar i{flex:1;height:9px;background:#272b36}.segbar i.on{background:var(--warn)}
.ledger-list.panel{border:0;border-radius:0;background:#14171e;box-shadow:inset 0 0 0 1px var(--line);clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.ledger-list .panel-head{border:0;padding:16px 22px 4px}
.ledger-list .panel-head h2{font:700 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2)}
.ledger-list .panel-scroll{padding:0 22px 10px}
.led-row{padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.led-date{font:500 12.5px var(--mono);width:104px}
.led-amt{font-family:var(--mono);min-width:80px;text-align:right}
.led-row.led-head{padding:8px 0;font:700 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2)}
.led-row.led-head .led-date,.led-row.led-head .led-amt{font:700 10.5px var(--mono);color:var(--muted-2)}
.rank-row{position:relative;border:0;border-radius:0;background:#14171e;box-shadow:inset 0 0 0 1px var(--line);padding:11px 18px 11px 24px;gap:14px;
    clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.rank-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--b2,#8d95ff)}
.rank-row:first-child::before{background:var(--warn)}
.rank-row.me{background:linear-gradient(90deg,rgba(88,101,242,.12),#14171e 60%)}
.rank-no{width:44px;height:auto;border-radius:0;background:none;font:800 26px var(--mono);color:var(--muted-2);place-items:center start}
.rank-1{background:none;color:var(--warn)}.rank-2{background:none;color:#c0c6d4}.rank-3{background:none;color:#c9824a}
.rank-row .av{border-radius:0}
.rank-bar{flex:none;width:260px;height:9px;margin:0;border-radius:0;background:#272b36;
    -webkit-mask:repeating-linear-gradient(90deg,#000 0 calc(10% - 2px),transparent calc(10% - 2px) 10%);mask:repeating-linear-gradient(90deg,#000 0 calc(10% - 2px),transparent calc(10% - 2px) 10%)}
.rank-bar i{border-radius:0;background:var(--brand)}
.rank-row:first-child .rank-bar i{background:var(--warn)}
.rank-credits{font-family:var(--mono);min-width:80px}
@media (max-width:900px){.rank-bar{display:none}}

/* ---------- Panels, Startseite und Zeilen im Kennkarten-Stil ---------- */
.panel{--pc:#8d95ff;position:relative;border:0;border-radius:0;background:#14171e;box-shadow:inset 0 0 0 1px var(--line);
    clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.panel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--pc);z-index:2}
.panel-head{padding:15px 20px 12px 24px;border-bottom:1px solid var(--line)}
.panel-head h2{font:700 12.5px var(--mono);letter-spacing:.14em;text-transform:uppercase}
.panel-ic{border-radius:0;background:none;width:20px;height:20px;color:var(--pc)}
.panel-sub{font-family:var(--mono);font-size:11px}
.panel-link{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em}
.panel-pad{padding:16px 20px 16px 24px}
.panel-scroll{padding:14px 20px 14px 24px}
.home-map .lm-map{border-radius:0}

.home-hero{position:relative;border:0;border-radius:0;background:#14171e;box-shadow:inset 0 0 0 1px var(--line);padding:22px 26px 22px 30px;
    clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.home-hero::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#8d95ff}
.home-hello{font-size:26px}
.home-status{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.home-sub .tag{border-radius:0;font-family:var(--mono)}

.group-title{--gc:var(--line2);padding-top:8px;border-top:3px solid var(--gc);font-family:var(--mono);font-size:11px;letter-spacing:.12em}
.group-title:has(.tone-green){--gc:var(--green)}.group-title:has(.tone-red){--gc:var(--danger)}.group-title:has(.tone-amber){--gc:var(--warn)}
.group-title .count{border-radius:0;background:none;color:var(--muted);font-family:var(--mono)}
.tone{display:none}
.row-item{border-radius:0;background:none;border:0;border-bottom:1px dotted var(--line2);padding:9px 2px;margin-bottom:0}
a.row-item:hover{background:rgba(141,149,255,.07);border-color:var(--line2)}
.row-side{font-family:var(--mono);font-size:11.5px}
.row-main .muted{font-family:var(--mono);font-size:12px}
.row-more{font:600 10.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:8px 2px 0}