:root { color-scheme: dark; }
body { font-family: system-ui, sans-serif; margin: 0; background: #0f172a; color: #e2e8f0; }
.wrap { max-width: 420px; margin: 8vh auto; padding: 0 1rem; }
.wrap-store { max-width: 860px; }
.wrap-dash { max-width: 960px; }
.wrap-narrow { max-width: 780px; }
.card { background: #1e293b; border: 1px solid #334155; border-radius: 12px; padding: 1.5rem; }
h1 { font-size: 1.25rem; margin: 0 0 1rem; }
h2 { font-size: 1rem; margin: 1.6rem 0 .5rem; }
.h2-other { margin: 1.4rem 0 .2rem; }
.h2-cred { margin: 1.2rem 0 .2rem; }
label { display: block; font-size: .85rem; margin: .75rem 0 .25rem; }
input { width: 100%; box-sizing: border-box; padding: .6rem; border-radius: 8px;
        border: 1px solid #475569; background: #0f172a; color: #e2e8f0; }
button { margin-top: 1rem; width: 100%; padding: .65rem; border: 0; border-radius: 8px;
         background: #3b82f6; color: white; font-weight: 600; cursor: pointer; }
.err { background: #7f1d1d; border: 1px solid #b91c1c; padding: .5rem .75rem;
       border-radius: 8px; margin-bottom: 1rem; font-size: .9rem; }
.muted { color: #94a3b8; font-size: .85rem; }
a { color: #93c5fd; }
:focus-visible { outline: 3px solid #93c5fd; outline-offset: 3px; }
button:disabled { opacity: .6; cursor: wait; }
.toolbar { display:flex; gap:1rem; flex-wrap:wrap; align-items:center; margin:1rem 0; }
.table-scroll { overflow-x:auto; }
[hidden] { display:none !important; }
.mono-wrap { overflow-wrap:anywhere; font-family:monospace; }
.uri-wrap { overflow-wrap:anywhere; font-size:.75rem; }
.logout-form { margin-top:1.25rem; }

/* Store: Kacheln, App-Karten, Status */
.stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:.6rem; margin:1rem 0 1.4rem; }
.stat { background:#0f172a; border:1px solid #334155; border-radius:10px; padding:.7rem .9rem; }
.stat .k { font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:#94a3b8; }
.stat .v { font-size:1.05rem; font-weight:600; margin-top:.15rem; }
.app { display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; align-items:flex-start;
       border:1px solid #334155; border-radius:10px; padding:1rem; margin:.6rem 0; }
.app .info { min-width:0; flex:1 1 220px; overflow-wrap:anywhere; }
.app .info h3 { margin:0 0 .25rem; font-size:1rem; }
.app .meta { font-size:.82rem; color:#94a3b8; }
.app .meta.danger { color:#f87171; font-weight:600; }
.badge { display:inline-block; padding:.1rem .5rem; border-radius:999px; font-size:.72rem; font-weight:600; margin-left:.35rem; }
.badge.running { background:#14532d; color:#86efac; border:1px solid #16a34a; }
.badge.error { background:#7f1d1d; color:#fca5a5; border:1px solid #b91c1c; }
.badge.other { background:#334155; color:#cbd5e1; border:1px solid #475569; }
.app .actions { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap;
                width:100%; border-top:1px solid #334155; padding-top:.8rem; }
.app .actions form { display:inline; margin:0; }
.btn { display:inline-block; width:auto; margin:0; padding:.4rem .8rem; border-radius:8px;
       background:#3b82f6; color:#fff; font-weight:600; font-size:.85rem; text-decoration:none;
       border:0; cursor:pointer; }
.btn.ghost { background:transparent; border:1px solid #475569; color:#e2e8f0; }
.btn.danger { background:#b91c1c; }
.warn { background:#7f1d1d; border:1px solid #b91c1c; border-radius:8px; padding:.6rem .8rem; margin:1rem 0; font-size:.9rem; }
.ok { background:#14532d; border:1px solid #16a34a; border-radius:8px; padding:.6rem .8rem; margin:1rem 0; font-size:.9rem; }
.overlay { position:fixed; inset:0; display:flex; flex-direction:column; align-items:center;
           justify-content:center; gap:1rem; background:rgba(15,23,42,.94); z-index:1000;
           text-align:center; padding:1.5rem; }
.overlay[hidden] { display:none; }
.spinner { width:56px; height:56px; border:5px solid #334155; border-top-color:#3b82f6;
           border-radius:50%; animation:ki-spin 1s linear infinite; }
@keyframes ki-spin { to { transform:rotate(360deg); } }
.overlay .big { font-size:1.1rem; font-weight:600; }
.overlay .muted { max-width:32rem; }
.app-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)); gap:.8rem; }
.app-grid .app { margin:0; background:#172235; }

/* Dashboard: Tabelle */
table { width:100%; border-collapse:collapse; margin:.4rem 0 1rem; }
th,td { text-align:left; padding:.45rem .5rem; border-bottom:1px solid #334155; font-size:.9rem; }
th { font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:#94a3b8; font-weight:600; }
td.mono { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.empty { color:#94a3b8; padding:1rem 0; }
td form { display:inline; margin:0; }

/* Zugangsdaten */
.cred-block { border:1px solid #334155; border-left:4px solid #3b82f6; border-radius:10px;
              padding:.9rem 1rem; margin:.6rem 0; }
.cred-block--other { border-left-color:#475569; }
.cred-label { font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; }
.cred-value { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:1.15rem;
              line-height:1.5; word-break:break-all; user-select:all; margin:.35rem 0; }
.cred-src { font-size:.72rem; }
.no-creds { border:1px dashed #475569; border-radius:10px; padding:1rem; }

@media(max-width:600px) { .wrap { margin:1.5rem auto; } .card { padding:1rem; } }
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { animation:none !important; } }