:root{--purple:#4000ff;--ink:#24252a;--muted:#626672;--line:#dedee5;--bg:#f4f4f6;--white:#fff;--lime:#bfff00;--danger:#b42318;--success:#187345;--amber:#936200;--radius:16px;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);line-height:1.5;font-size:15px}a{color:inherit}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8a67ff;outline-offset:2px}
.layout{min-height:100vh;display:flex;flex-direction:column}.topbar{background:#161519;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:13px max(24px,calc((100vw - 1450px)/2));min-height:68px}.brand{text-decoration:none;display:flex;align-items:center;gap:12px;font-size:17px;font-weight:450;letter-spacing:-.4px}.brand strong{font-weight:750}.brand-mark{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:var(--purple);color:#fff;font-size:27px;font-weight:750}.top-actions{display:flex;align-items:center;gap:22px}.quiet-link{font-size:13px;color:#d4d0e0;text-decoration:none}.quiet-link:hover{text-decoration:underline}
.main{width:min(1450px,calc(100% - 46px));margin:0 auto;flex:1}.hero{background:var(--purple);color:#fff;border-radius:20px;padding:30px 37px;margin:26px 0 20px;display:flex;justify-content:space-between;align-items:center;min-height:156px;overflow:hidden}.hero h1{font-weight:680;letter-spacing:-1.1px;font-size:clamp(27px,3vw,37px);margin:3px 0}.hero p{margin:0;color:#eee8ff}.eyebrow{letter-spacing:.11em;font-size:11px;font-weight:800;color:#d2c0ff;margin:0 0 8px!important}.eyebrow.dark{color:var(--purple)}.hero-symbol{font-size:110px;opacity:.8;line-height:.5;padding:0 20px}.version{font-size:12px;border:1px solid #ad90ff;border-radius:90px;display:inline-flex;vertical-align:middle;padding:2px 8px;letter-spacing:0;font-weight:550}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:27px}.stat{border:1px solid var(--line);background:#fff;padding:19px 21px;border-radius:15px;display:flex;flex-direction:column;gap:3px}.stat span{color:var(--muted);font-size:13px}.stat strong{font-size:33px;font-weight:710;font-variant-numeric:tabular-nums}.page-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin:18px 0}.page-row h2{font-size:21px;margin:0}.page-row p{margin:2px 0 0}.muted,.hint{color:var(--muted)}.muted{font-size:13px}.hint{font-size:13px;margin:0 0 24px}.buttons{display:flex;flex-wrap:wrap;gap:10px}.button{border-radius:8px;padding:10px 17px;border:1px solid var(--line);background:#fff;color:var(--ink);display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:650;font-size:13px;text-decoration:none;white-space:nowrap}.button:hover:not(:disabled){filter:brightness(.96)}.button.primary{background:var(--purple);color:#fff;border-color:var(--purple)}.button.outline{border-color:var(--purple);color:var(--purple)}.button.small{padding:8px 12px}.button.ghost{background:transparent;color:#fff;border-color:#5c5861}.button.danger{background:#fff0ee;border-color:#f7cdca;color:#a32720}.button.full{width:100%}
.toolbar{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:14px 14px 0 0;margin-top:18px}.toolbar label{font-weight:650;font-size:12px}.toolbar input,.toolbar select{display:block;margin-top:5px;min-height:38px;border:1px solid #d0d1d9;border-radius:7px;padding:7px 10px;background:#fff;color:var(--ink);font-size:13px}.search-label{flex:1;min-width:190px}.search-label input{width:100%}.filter-label select{min-width:145px}.table-scroll{overflow-x:auto;background:#fff;border:1px solid var(--line);border-top:0;border-radius:0 0 14px 14px}.site-table{border-collapse:collapse;width:100%;min-width:1060px;font-size:13px}.site-table th{text-align:left;font-size:11px;letter-spacing:.02em;color:#6d6e78;background:#fafafc;padding:14px 12px;font-weight:750;white-space:nowrap}.site-table td{padding:16px 12px;vertical-align:middle;border-top:1px solid #ededf0}.site-table tbody tr:hover{background:#fbfaff}.site-table tbody tr[hidden]{display:none}.site-name{font-size:13px;display:block;max-width:240px;overflow-wrap:anywhere}.site-table td small{display:block;font-size:11px;color:var(--muted);margin-top:3px}.site-table .mono{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-variant-numeric:tabular-nums;white-space:nowrap}.pill{border-radius:50px;display:inline-block;font-size:11px;font-weight:650;white-space:nowrap;padding:5px 9px}.pill.success{color:#17643c;background:#e7f6ed}.pill.warning{color:#906000;background:#fff2cf}.pill.neutral{color:#5c616b;background:#ededf0}.pill.danger{color:#b3261e;background:#ffebe8}.site-table small.target{color:#9e6b00;font-variant-numeric:tabular-nums;white-space:nowrap}.site-table small.checked{white-space:nowrap}.links{display:flex;gap:10px}.links a{border-radius:7px;border:1px solid #dedee9;text-decoration:none;width:29px;height:29px;display:grid;place-items:center;color:var(--purple);font-size:17px}.links a:hover{background:#eee9ff}.actions{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.text-button{border:0;color:var(--purple);background:transparent;padding:2px 0;text-decoration:none;font-size:12px;font-weight:650}.text-button:hover{text-decoration:underline}.empty{text-align:center;padding:38px!important;color:var(--muted)}.legend{display:flex;gap:19px;flex-wrap:wrap;padding:17px 4px 4px;font-size:12px;color:var(--muted)}.legend span{display:flex;align-items:center;gap:7px}.dot{width:9px;height:9px;border-radius:50%;display:inline-block}.dot.green{background:#25a866}.dot.amber{background:#e2a42b}.dot.gray{background:#aeb0b8}.dot.red{background:#db4a41}.footer-note{font-size:12px;color:var(--muted);padding-bottom:17px}.footer{text-align:center;color:#898a93;font-size:11px;margin:35px auto 18px}
.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:27px;margin-top:20px}.panel.narrow{max-width:760px}.panel h2{margin:0 0 14px}.panel h3{margin:0 0 8px}.panel p{color:#575a64}.panel label,.login-card label,.copy-group label{font-weight:650;font-size:13px;display:block;margin:0 0 18px}.panel label input,.login-card label input,.copy-row input{display:block;margin-top:7px;width:100%;padding:12px 11px;border:1px solid #cbd0db;border-radius:8px;background:#fff;min-height:43px;font-size:14px}.panel hr{border:0;border-top:1px solid var(--line);margin:27px 0}.copy-row{display:flex;align-items:center;gap:10px}.copy-row input{font-family:ui-monospace,Consolas,monospace;margin:0}.copy-group{margin:22px 0}.copy-group label{margin-bottom:7px}.notice{padding:12px 15px;border:1px solid var(--line);border-radius:10px;background:#fff;margin:17px 0;font-size:13px}.notice.error{color:#8d2922;background:#fff1ee;border-color:#f1b9b2}.notice.success{color:#17643c;background:#eafaef;border-color:#b7dfc3}.notice.warning{color:#8c5605;background:#fff7e3;border-color:#efddb0}.notice.info{background:#eff0ff;border-color:#d1cdfa;color:#30248b}.login-wrap{min-height:100vh;display:flex;justify-content:center;align-items:center;padding:24px;background:radial-gradient(circle at 75% 20%,#eee7ff 0,transparent 38%),var(--bg)}.login-card{max-width:480px;width:100%;background:#fff;border-radius:19px;border:1px solid var(--line);padding:38px 36px;box-shadow:0 22px 70px #20005b12}.login-card h1{font-size:30px;margin:0 0 14px;letter-spacing:-1px}.login-card .eyebrow{color:var(--purple)}.login-card p{color:var(--muted)}.login-card form{margin-top:27px}.login-card .button{margin-top:8px}.login-card code{font-size:12px;overflow-wrap:anywhere}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-symbol{font-size:75px}.main{width:min(100% - 28px,1450px)}.hero{padding:24px}}@media(max-width:600px){.topbar{padding:12px 15px}.brand{font-size:15px}.top-actions{gap:9px}.quiet-link{display:none}.stats{gap:8px}.stat{padding:13px}.stat strong{font-size:27px}.hero{margin-top:14px;padding:22px;min-height:128px}.hero-symbol{display:none}.hero h1{font-size:26px}.copy-row{flex-direction:column;align-items:stretch}.login-card{padding:28px 22px}.toolbar{gap:9px}.filter-label{flex:1}.filter-label select{width:100%}.buttons{width:100%}.buttons .button{flex:1}.page-row{gap:11px}}

/* Branding and icon-only statuses (UI extension, v1.0.0). */
.brand-logo{display:block;width:auto;height:40px;max-width:clamp(124px,15vw,180px);object-fit:contain;object-position:left center}.brand-label{font-size:15px;color:#f1eff6;font-weight:650;letter-spacing:0}.hero{justify-content:flex-start}.status-icon{display:inline-block;font-size:18px;line-height:1.35;vertical-align:middle;white-space:nowrap}.status-target{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;color:#8a5c00;font-size:12px;white-space:nowrap;margin-left:3px}.builder-line{min-height:28px;display:flex;align-items:center;gap:5px;white-space:nowrap}.builder-names .builder-line{justify-content:flex-start}.builder-statuses .builder-line{justify-content:flex-start}.builder-version{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:12px;color:#626672}.site-table td.builder-names,.site-table td.builder-statuses{vertical-align:middle}.legend span{white-space:nowrap}@media(max-width:600px){.brand-logo{height:32px;max-width:122px}.brand-label{font-size:13px}.topbar{gap:10px}}

/* Version 1.1.0: monitoring reports forms */
.checkline{display:flex!important;flex-direction:row!important;align-items:center;gap:.65rem;margin:1rem 0;line-height:1.5;font-weight:600}
.checkline input{width:1.15rem!important;height:1.15rem!important;flex:0 0 auto;margin:0!important}
.report-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem}
.report-log{display:grid;gap:.55rem}
.report-log>div{padding:.7rem .8rem;border:1px solid #d6d6e2;border-radius:.5rem}
.report-log small{display:block;color:#666;margin-top:.25rem}
@media (max-width:640px){.report-fields{grid-template-columns:1fr}}

/* Systemverwaltung: eigenständiger Tab */
.system-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.system-grid .panel{margin:0;min-width:0}.system-grid .panel p{font-size:14px}
.panel input[type=file]{display:block;width:100%;margin-top:8px;max-width:100%;background:#fafafd;border:1px solid #cbd0db;padding:12px;border-radius:8px}
.backup-list{display:grid;gap:9px}.backup-item{border:1px solid var(--line);border-radius:10px;padding:12px 15px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.backup-item small{display:block;color:var(--muted);margin-top:4px;overflow-wrap:anywhere}.backup-item form{margin:0}
@media(max-width:900px){.system-grid{grid-template-columns:1fr}}

@media(max-width:600px){.main-tabs{gap:3px}.main-tabs a{padding:9px 12px}}


/* Version 1.1.2: Navigation im violetten Hero statt einer separaten Linkzeile. */
.hero{align-items:flex-start;gap:24px}
.hero-content{min-width:0;flex:1 1 auto}
.hero-nav{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px;max-width:64%;margin-left:auto;flex:0 1 auto}
.hero-nav-button{display:inline-flex;justify-content:center;align-items:center;padding:10px 20px;min-height:42px;border-radius:999px;background:#9c7aff;border:1px solid transparent;color:#fff;text-decoration:none;font-weight:650;font-size:14px;line-height:1.3;text-align:center;white-space:nowrap;transition:background-color .18s ease,color .18s ease}
.hero-nav-button:hover,.hero-nav-button:focus-visible,.hero-nav-button.is-active{background:#161519;color:#fff}
.hero-nav-button:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(max-width:1050px){
  .hero{flex-direction:column;align-items:stretch}
  .hero-nav{max-width:none;width:100%;justify-content:flex-start;margin-left:0}
}
@media(max-width:600px){
  .hero-nav{gap:7px}
  .hero-nav-button{flex:1 1 auto;padding:9px 12px;font-size:12px}
}


/* 1.1.3: Einheitliche Navigation in allen Monitor-Modulen */
.hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
}
.hero-content {
    flex: 1 1 auto;
    min-width: 0;
}
.hero-nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex: 0 0 auto;
    max-width: 70%;
    margin-left: auto;
    flex-wrap: wrap;
}
.hero-nav .hero-nav-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 22px;
    border: 1px solid transparent;
    border-radius: 9999px;
    background: #9974ff;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 550;
    line-height: 1.3;
    white-space: nowrap;
    transition: background-color .2s ease, color .2s ease;
}
.hero-nav .hero-nav-button:hover,
.hero-nav .hero-nav-button:focus-visible,
.hero-nav .hero-nav-button.is-active {
    background: #161519;
    color: #fff;
    text-decoration: none;
}
.hero-nav .hero-nav-button:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}
/* Automatik und Reports über die volle verfügbare Breite */
.automation-form,
.automation-form > .automation-panel,
.main > .automation-panel {
    width: 100%;
    max-width: none;
}
.automation-panel {
    margin-top: 20px;
}
.automation-panel h3 {
    margin-bottom: 20px;
}
.automation-panel .report-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    width: 100%;
}
.automation-panel label,
.automation-panel .report-fields label {
    min-width: 0;
}
/* Formular-Kontrollen normalisieren, insbesondere Checkboxen und Selects */
.panel label select {
    display: block;
    width: 100%;
    margin-top: 7px;
    padding: 11px 12px;
    min-height: 43px;
    background: #fff;
    border: 1px solid #cbd0db;
    border-radius: 8px;
    color: var(--ink);
    font: inherit;
    font-size: 14px;
}
.panel label.checkline {
    display: flex !important;
    align-items: center;
    gap: 12px;
    margin: 12px 0 24px;
    font-size: 14px;
    font-weight: 650;
}
.panel label.checkline input[type="checkbox"] {
    display: inline-block !important;
    box-sizing: border-box !important;
    flex: 0 0 20px !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 4px;
    accent-color: var(--purple);
}
.automation-panel .hint {
    max-width: 90ch;
}
.automation-panel .cron-copy {
    border-top: 1px solid var(--line);
    padding-top: 18px;
    margin-top: 26px;
}
@media(max-width: 1200px) {
    .hero {
        flex-direction: column;
        align-items: stretch;
    }
    .hero-nav {
        width: 100%;
        max-width: none;
        margin-left: 0;
        justify-content: flex-start;
    }
}
@media(max-width: 640px) {
    .hero-nav {
        gap: 8px;
    }
    .hero-nav .hero-nav-button {
        flex: 1 1 auto;
        white-space: normal;
        padding: 10px 12px;
        font-size: 13px;
    }
    .automation-panel .report-fields {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .automation-panel {
        padding: 20px;
    }
}


/* v1.1.5: Einheitliche Kopfzeilen-Aktionen (alle Monitor-Bereiche). */
.topbar .top-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.topbar .top-actions form { margin: 0; }
.topbar .topbar-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 42px;
    padding: 9px 19px;
    border: 1px solid rgba(255, 255, 255, .36);
    border-radius: 9999px;
    background: #000;
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.3;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.topbar .topbar-button:hover,
.topbar .topbar-button:focus-visible,
.topbar .topbar-button:active,
.topbar .topbar-button.is-active {
    background: rgba(0, 0, 0, .8);
    border-color: #fff;
    color: #fff;
    text-decoration: none;
}
.topbar .topbar-button.is-active {
    background: #000;
    border-color: #fff;
    color: #fff;
}
.topbar .topbar-button:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}
/* Der Benutzer- und Passwortbereich nutzt dieselbe volle Breite wie die anderen Module. */
.main > .account-panel {
    width: 100%;
    max-width: none;
}
@media (max-width: 640px) {
    .topbar {
        flex-wrap: wrap;
        gap: 10px;
    }
    .topbar .top-actions { gap: 8px; }
    .topbar .topbar-button {
        min-height: 38px;
        padding: 8px 12px;
        font-size: 12px;
    }
}
