/* Bytewise Panel – Instrument-Look: dunkel als Standard, Signal-Orange als einziger Akzent. */
:root{
  --bg:#111210; --panel:#191A17; --panel-2:#23241F; --ink:#ECE8E0; --muted:#9C978D; --line:#34332E;
  --accent:#FF5A1F; --on-accent:#141414; --ok:#5FD697; --bad:#FF6B5B; --lcd:#0B0C0A; --lcd-ink:#D9D5CC; --lcd-dim:#7C776E;
  --shade:rgba(0,0,0,.45); --scrim:rgba(8,8,7,.6);
  --font-display:'Archivo','Helvetica Neue',Arial,sans-serif;
  --font-body:'Archivo','Helvetica Neue',Arial,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  --r-lg:16px; --r-md:12px; --r-sm:8px;
  color-scheme:dark;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --bg:#E6E3DC; --panel:#F4F2ED; --panel-2:#EBE8E1; --ink:#151515; --muted:#5F5A52; --line:#CBC6BC;
    --ok:#23804C; --bad:#C23A2B; --lcd:#121311; --shade:rgba(40,35,25,.14); --scrim:rgba(30,28,24,.35); color-scheme:light;
  }
}
:root[data-theme="light"]{
  --bg:#E6E3DC; --panel:#F4F2ED; --panel-2:#EBE8E1; --ink:#151515; --muted:#5F5A52; --line:#CBC6BC;
  --ok:#23804C; --bad:#C23A2B; --lcd:#121311; --shade:rgba(40,35,25,.14); --scrim:rgba(30,28,24,.35); color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.5;transition:background .4s,color .4s}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mono{font-family:var(--font-mono);font-size:12px}
.label{font-size:13px;color:var(--muted);font-weight:500}
.muted{color:var(--muted)} .small{font-size:13px} .grow{flex:1}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.err{color:var(--bad);margin:0;font-size:14px}
.note{margin:0;font-size:13px;color:var(--muted);border-left:2px solid var(--line);padding-left:10px}

/* buttons */
.btn-line{height:38px;padding:0 14px;border:1px solid var(--line);background:var(--panel);border-radius:var(--r-sm);cursor:pointer;font-size:14px;font-weight:500;transition:background .2s,border-color .2s,transform .15s;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;color:var(--ink)}
.btn-line:hover{border-color:var(--muted);background:var(--panel-2)}
.btn-accent,.btn-danger{height:38px;padding:0 16px;border:0;background:var(--accent);color:var(--on-accent);border-radius:var(--r-sm);cursor:pointer;font-size:14px;font-weight:600;transition:transform .15s,box-shadow .2s,filter .2s;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none}
.btn-danger{background:var(--bad);color:#fff}
.btn-accent:hover{filter:brightness(1.08)}
.btn-accent:active,.btn-line:active{transform:translateY(1px)}
.btn-accent:disabled,.btn-line:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.wide{width:100%}
.icon-btn{width:40px;height:40px;border-radius:var(--r-sm);border:1px solid var(--line);background:transparent;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.icon-btn:hover{border-color:var(--ink)}
a.icon-btn{color:var(--ink)}
kbd{font-family:var(--font-mono);font-size:10px;border:1px solid currentColor;border-radius:4px;padding:1px 5px;margin-left:6px;opacity:.8}
.switch{display:flex;align-items:center;gap:8px;height:34px;background:none;border:0;cursor:pointer;font-size:13.5px;color:var(--muted);padding:0 4px}
.switch .track{width:38px;height:22px;border:1px solid var(--line);background:var(--bg);border-radius:11px;padding:2px;display:flex}
.switch .knob{width:16px;height:16px;border-radius:8px;background:var(--muted);transition:transform .35s cubic-bezier(.5,1.6,.4,1),background .2s}
.switch[aria-pressed="true"] .knob{transform:translateX(16px);background:var(--accent)}

/* brand */
.brand{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-stretch:125%;font-weight:800;font-size:18px;text-transform:uppercase;text-decoration:none;color:var(--ink);}
.brand{text-transform:none;font-stretch:112%;gap:9px}
.brand-mark{width:28px;height:28px;display:block;flex:none;border-radius:7px;filter:drop-shadow(0 0 6px rgba(255,106,31,.25))}
.brand-name{white-space:nowrap;color:var(--accent)}.brand-name span{font-weight:400;color:#c9cbd0}
.brand.big{font-size:26px}.brand.big .brand-mark{width:40px;height:40px;border-radius:9px}
.auth-logo{display:block;width:100%;max-width:360px;height:auto;margin:-8px auto 10px}
.auth-logo+.brand.big{display:none}
:root[data-theme="light"] .brand-mark{background:#16181e;filter:none;padding:1px}
:root[data-theme="light"] .brand-name span{color:#6b6e75}
:root[data-theme="light"] .auth-logo{display:none}
:root[data-theme="light"] .auth-logo+.brand.big{display:flex}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]) .brand-mark{background:#16181e;filter:none;padding:1px}
  :root:not([data-theme="dark"]) .brand-name span{color:#6b6e75}
  :root:not([data-theme="dark"]) .auth-logo{display:none}
  :root:not([data-theme="dark"]) .auth-logo+.brand.big{display:flex}
}
@keyframes spin{to{transform:rotate(360deg)}}

/* auth */
.auth{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;overflow:auto}
#authBg{position:fixed;inset:0;width:100%;height:100%;z-index:0}
.auth-card{position:relative;z-index:1;width:min(420px,100%);background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;display:flex;flex-direction:column;gap:14px;box-shadow:0 30px 60px -30px var(--shade);animation:pop .4s both}
.auth-card h1{margin:8px 0 0;font-family:var(--font-display);font-weight:700;font-size:30px;line-height:1.05}
.auth-card p{margin:0}

/* forms */
.field{display:flex;flex-direction:column;gap:6px}
.field>span{font-size:13px;font-weight:500;color:var(--muted);display:flex;gap:8px;align-items:baseline}
.field>span b{color:var(--ink);font-weight:500}
.field input:not([type=range]),.field select,.field textarea{width:100%;border:1px solid var(--line);background:var(--bg);border-radius:var(--r-sm);padding:9px 12px;font-size:15px;transition:border-color .2s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent);outline:none}
.field textarea{font-family:var(--font-mono);font-size:12px;resize:vertical}
.field input[type=range]{accent-color:var(--accent);width:100%}
.field small{color:var(--muted);font-size:12px}
.check{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer}
.check input{width:18px;height:18px;accent-color:var(--accent)}
.picker select{padding:6px!important;font-size:14px}
.picker select optgroup{font-family:var(--font-mono);font-size:11px;color:var(--muted);font-style:normal}
.picker select option{padding:6px 8px;border-radius:6px;font-family:var(--font-body);font-size:14px;color:var(--ink)}
.picker select option:checked{background:var(--accent);color:var(--on-accent)}
.vars{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.vars .full{grid-column:1/-1}
@media (max-width:560px){.vars{grid-template-columns:minmax(0,1fr)}}

.banner{display:flex;gap:12px;align-items:flex-start;background:color-mix(in srgb,var(--bad) 12%,var(--panel));border:1px solid color-mix(in srgb,var(--bad) 55%,transparent);color:var(--ink);border-radius:var(--r-md);padding:12px 14px;font-size:14px;margin-bottom:20px}
.banner .ban-ic{flex-shrink:0;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--bad);color:#fff;font-weight:700;font-size:13px;margin-top:1px}
.banner .ban-txt{flex:1;min-width:0;line-height:1.5}
.banner details{margin-top:4px;color:var(--muted);font-size:12.5px}
.banner summary{cursor:pointer;width:max-content}
.banner details code{display:block;margin:6px 0;word-break:break-all;white-space:pre-wrap}
.banner .btn-line{flex-shrink:0}

/* readouts */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:680px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px 10px;display:flex;flex-direction:column;gap:4px;min-width:0}
.stat .v{font-family:var(--font-display);font-weight:650;font-size:26px;line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat .v small{font-size:14px;font-weight:600;color:var(--muted)}
.stat canvas{width:100%;height:36px;display:block}

/* stage */
.stage{position:relative;height:380px;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:radial-gradient(120% 90% at 50% 35%,var(--panel-2) 0%,var(--panel) 45%,var(--bg) 100%)}
@media (max-width:680px){.stage{height:380px}}
#land{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
.stage-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:24px}
.stage-empty p{margin:0;max-width:34ch;color:var(--muted)}
.zoom{position:absolute;left:18px;bottom:16px;display:flex;gap:6px}
.zoom button{min-width:40px;height:40px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--panel);cursor:pointer;font-family:var(--font-mono);font-size:16px}
.zoom button.txt{padding:0 12px;font-size:11px;}
.zoom button:hover{border-color:var(--ink)}
.labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.lab{position:absolute;left:0;top:0;display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11px;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:4px 8px;white-space:nowrap;transition:border-color .2s,opacity .2s;will-change:transform}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block;flex-shrink:0}
.lab.hot{border-color:var(--accent)}
.kv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px;margin:0}
.kv div{border-top:1px solid var(--line);padding:8px 0;min-width:0}
.kv dt{font-size:12.5px;color:var(--muted)}
.kv dd{margin:0;font-size:14px;overflow-wrap:anywhere}
.acts{display:flex;gap:8px;flex-wrap:wrap}
.st{display:flex;align-items:center;gap:6px;white-space:nowrap}
.msg-line{font-size:13px;color:var(--muted);margin:0}
.msg-line.bad{color:var(--bad)}
.nogl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:var(--muted)}

/* modules */
.sec-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.sec-head h2{margin:0;font-family:var(--font-display);font-weight:700;font-size:24px;}
.mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.mods .empty{grid-column:1/-1;border:1px dashed var(--line);border-radius:var(--r-md);padding:24px;color:var(--muted);text-align:center}
.mod{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;cursor:pointer;transition:transform .25s ease-out,border-color .2s,box-shadow .25s;overflow:hidden}
.mod::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.07),transparent 60%);opacity:0;transition:opacity .25s}
.mod:hover::after{opacity:1}
.mod:hover{box-shadow:0 18px 36px -22px var(--shade)}
.mod.sel{border-color:var(--accent)}
.mod.stopped{background:var(--panel-2)}
.mod.error{border-color:var(--bad)}
.mod-top{display:flex;align-items:center;gap:10px;justify-content:space-between}
.mod-top .game{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mod h3{margin:4px 0 0;font-family:var(--font-display);font-weight:700;font-size:21px;line-height:1.1;overflow-wrap:anywhere}
.mod-foot{margin-top:8px;display:flex;align-items:flex-end;gap:22px}
.mod-foot .k{display:block;font-size:12px;color:var(--muted)}
.mod-foot .v{font-family:var(--font-display);font-weight:700;font-size:22px;font-variant-numeric:tabular-nums;line-height:1.1}
.mod-foot .v small{font-size:12px;color:var(--muted)}
.power{margin-left:auto;width:58px;height:32px;border-radius:16px;border:1px solid var(--ink);background:transparent;padding:3px;display:flex;cursor:pointer;transition:background .3s;flex-shrink:0}
.power span{width:24px;height:24px;border-radius:12px;background:var(--muted);transition:transform .35s cubic-bezier(.5,1.6,.4,1),background .3s}
.power[aria-pressed="true"]{background:var(--ink)}
.power[aria-pressed="true"] span{transform:translateX(26px);background:var(--accent)}
.power:disabled{opacity:.45;cursor:wait}
.bar{height:6px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:8px}
.bar b{display:block;height:100%;background:var(--accent);transition:width .6s ease;background-image:linear-gradient(90deg,transparent 0,rgba(255,255,255,.35) 50%,transparent 100%);background-size:60px 100%;animation:sheen 1.2s linear infinite}
.bar.indet b{width:35%!important;animation:indet 1.4s ease-in-out infinite}
@keyframes sheen{from{background-position:-60px 0}to{background-position:260px 0}}
@keyframes indet{0%{transform:translateX(-100%)}100%{transform:translateX(300%)}}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
@keyframes blink{50%{opacity:.25}}

/* KI */
.core-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .5s}
.core-card[data-state="thinking"],.core-card[data-state="executing"]{box-shadow:0 0 0 1px var(--accent),0 0 48px -12px var(--accent)}
.core-card[data-state="done"]{box-shadow:0 0 0 1px var(--ok),0 0 48px -12px var(--ok)}
.core-top{display:flex;align-items:center;gap:10px;padding:14px 16px 0}
.core-top h2{margin:0;font-family:var(--font-display);font-weight:700;font-size:20px;}
.core-state{margin-left:auto;display:flex;align-items:center;gap:6px}
.core-state i{width:7px;height:7px;border-radius:50%;background:var(--accent);animation:blink 1.4s ease-in-out infinite}
#core{width:100%;height:220px;display:block}
.core-body{padding:4px 16px 16px;display:flex;flex-direction:column;gap:12px}
.chat{display:flex;flex-direction:column;gap:10px}
.msg{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;animation:rise .4s both}
.msg .who{padding-top:3px}
.msg.du p{font-family:var(--font-display);font-stretch:108%;font-weight:600;font-size:16px}
.msg p{margin:0;font-size:14.5px}
.msg.bad p{color:var(--bad)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips button{border:1px solid var(--line);background:transparent;border-radius:999px;padding:6px 11px;cursor:pointer;font-size:13px;transition:border-color .2s}
.chips button:hover{border-color:var(--accent)}
.ask{display:flex;border:1px solid var(--ink);border-radius:var(--r-sm);overflow:hidden;background:var(--panel-2)}
.ask input{flex:1;min-width:0;border:0;background:transparent;padding:12px 14px;font-size:15px;outline:none}
.ask button{width:52px;border:0;background:var(--accent);color:var(--on-accent);cursor:pointer;display:flex;align-items:center;justify-content:center}
.ask button:disabled{opacity:.5}
.locked{border:1px dashed var(--line);border-radius:var(--r-md);padding:14px;font-size:14px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.plan{border-top:1px solid var(--line);padding-top:14px;display:flex;flex-direction:column;gap:12px;animation:rise .45s both}
.plan-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.stamp{transform:rotate(-2.5deg);border:2px solid var(--ink);padding:4px 9px;font-family:var(--font-mono);font-size:10px;font-weight:600;}
.stamp.ok{border-color:var(--ok);color:var(--ok)}
.stamp.bad{border-color:var(--bad);color:var(--bad)}
.plan h3{margin:0;font-family:var(--font-display);font-weight:700;font-size:22px;line-height:1.1}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.steps li{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--line);font-size:14px;animation:rise .4s both;animation-delay:var(--d,0ms)}
.steps .box{width:16px;height:16px;border:1.5px solid var(--ink);border-radius:4px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.steps li.run .box{border-color:var(--accent);animation:blink .7s infinite}
.steps li.done .box{background:var(--ok);border-color:var(--ok)}
.steps li.done .box::after{content:"";width:8px;height:4px;border-left:2px solid var(--on-accent);border-bottom:2px solid var(--on-accent);transform:rotate(-45deg) translate(1px,-1px)}
.plan-actions{display:flex;gap:8px}
.plan-actions .btn-accent{flex:1}

/* console */
.lcd{position:relative;background:var(--lcd);color:var(--lcd-ink);border-radius:var(--r-md);border:1px solid var(--line);font-family:var(--font-mono);font-size:12px;display:flex;flex-direction:column;overflow:hidden}
.lcd-head{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid #2A2B28;color:#A8A399}
.lcd-head .live{margin-left:auto;color:#9BE36D;display:flex;align-items:center;gap:6px}
.lcd-head .live i{width:6px;height:6px;border-radius:50%;background:#9BE36D;animation:blink 1.6s infinite}
.lines{height:420px;padding:10px 14px;overflow-y:auto;line-height:1.6;overscroll-behavior:contain}
.lines div{white-space:pre-wrap;overflow-wrap:anywhere}
.lines .dim{color:var(--lcd-dim)}
.lines .w{color:#FF7A45}.lines .g{color:#9BE36D}.lines .me{color:#FFB38A}
.lcd-in{display:flex;align-items:center;gap:10px;padding:10px 14px;border-top:1px solid #2A2B28;color:#FF7A45}
.lcd-in input{flex:1;min-width:0;height:28px;background:transparent;border:0;color:#EFEBE3;font-family:var(--font-mono);font-size:13px;outline:none}

/* dialogs */
.dlg{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);color:var(--ink);padding:24px;width:min(620px,calc(100% - 32px));max-height:calc(100% - 32px);box-shadow:0 30px 80px -20px var(--shade)}
.dlg.small{width:min(440px,calc(100% - 32px))}
.dlg{overflow:auto;overscroll-behavior:contain}
.dlg[open]{animation:pop .25s both}
.dlg::backdrop{background:var(--scrim);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
:is(.dlg,.page) form{display:flex;flex-direction:column;gap:14px}
.dlg-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
:is(.dlg,.page) h2{margin:0;font-family:var(--font-display);font-weight:700;font-size:20px}
:is(.dlg,.page) h3{margin:0;font-family:var(--font-display);font-weight:650;font-size:16px}
:is(.dlg,.page) p{margin:0}
.dlg-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:4px}
.set-block{border-top:1px solid var(--line);padding-top:16px;margin-top:16px}

/* verwalten: backups + dateien */
.dlg.wide{width:min(1040px,calc(100% - 32px));height:min(780px,calc(100% - 32px));padding:20px 24px}
.dlg.wide[open]{display:flex;flex-direction:column;gap:16px}
.mg-title{display:flex;flex-direction:column;min-width:0}
.mg-title h2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tabs button{flex:0 0 auto;font-size:14px;font-weight:500;padding:10px 12px;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;background:transparent;color:var(--muted);cursor:pointer}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.mg-pane{display:flex;flex-direction:column;gap:14px}
.bk-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.bk-top p{margin:0;flex:1 1 260px;min-width:0}
.bk-plan{display:flex!important;flex-direction:row!important;align-items:flex-end;gap:12px;flex-wrap:wrap;padding:14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel-2)}
.bk-plan .field{min-width:150px;flex:1 1 150px}
.bk-plan .btn-line{height:44px}
.tbl-wrap{position:relative;overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-md)}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font-size:12.5px;font-weight:500;color:var(--muted);padding:10px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:8px 14px;border-top:1px solid var(--line);white-space:nowrap}
.tbl tr:first-child td{border-top:0}
.tbl .num{text-align:right;font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.tbl .acts{justify-content:flex-end;flex-wrap:nowrap;gap:6px}
.tbl .acts .icon-btn{width:34px;height:34px}
.tbl .empty td{color:var(--muted);text-align:center;padding:26px;white-space:normal}
.btn-line.sm{height:34px;padding:0 10px;font-size:11px;display:inline-flex;align-items:center;text-decoration:none;color:var(--ink)}
.kind{font-family:var(--font-mono);font-size:10px;border:1px solid var(--line);border-radius:999px;padding:3px 8px}
.kind.auto{border-color:var(--ok);color:var(--ok)}
.kind.vor-wiederherstellung{border-color:var(--accent)}
.loc{display:inline-flex;gap:4px;align-items:center}
.loc span{font-family:var(--font-mono);font-size:10px;padding:3px 7px;border-radius:4px;background:var(--panel-2);border:1px solid var(--line)}
.loc span.ext{border-color:var(--ok);color:var(--ok)}
.loc .busy{color:var(--accent);border-color:var(--accent);animation:blink 1.2s infinite}
.loc .bad{color:var(--bad);border-color:var(--bad)}
.linkbtn{background:none;border:0;padding:0;color:var(--accent);text-decoration:underline;cursor:pointer;font:inherit}
.fm-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:2px;font-family:var(--font-mono);font-size:13px;min-width:0}
.crumbs button{background:none;border:0;cursor:pointer;padding:6px 6px;border-radius:6px}
.crumbs button:hover{background:var(--panel-2)}
.crumbs span{color:var(--muted)}
.upl{display:inline-flex;align-items:center;position:relative}
.upl input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.upl:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.fm-list{min-height:180px;border:1px solid var(--line);border-radius:var(--r-md);transition:border-color .2s,background .2s}
.fm-list.drop{border-color:var(--accent);background:var(--panel-2)}
.fm-row{display:grid;grid-template-columns:minmax(0,1fr) 90px 150px auto;align-items:center;gap:12px;padding:4px 10px 4px 6px;border-top:1px solid var(--line)}
.fm-row:first-child{border-top:0}
.fm-row .nm{display:flex;align-items:center;gap:10px;background:none;border:0;cursor:pointer;text-align:left;padding:8px;border-radius:6px;min-width:0;font-size:14px}
.fm-row .nm:hover{background:var(--panel-2)}
.fm-row .nm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fm-row .nm svg{flex-shrink:0;color:var(--muted)}
.fm-row .nm.dir svg{color:var(--accent)}
.fm-row .sz,.fm-row .dt{font-family:var(--font-mono);font-size:12px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
.fm-row .acts{flex-wrap:nowrap;gap:4px}
.fm-row .acts .icon-btn{width:34px;height:34px}
.fm-empty{padding:30px;text-align:center;color:var(--muted)}
@media (max-width:720px){.fm-row{grid-template-columns:minmax(0,1fr) auto}.fm-row .sz,.fm-row .dt{display:none}}
.fm-editor{flex:1;min-height:0;display:flex;flex-direction:column;gap:10px}
.fm-edbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fm-edbar .mono{text-transform:none;letter-spacing:0;font-size:13px;overflow:hidden;text-overflow:ellipsis}
#fmText{flex:1;min-height:240px;width:100%;resize:none;border:1px solid var(--line);border-radius:var(--r-md);background:var(--lcd);color:var(--lcd-ink);font-family:var(--font-mono);font-size:13px;line-height:1.55;padding:14px;tab-size:4}
#fmText:focus{outline:none;border-color:var(--accent)}
.fm-editor p{margin:0}

/* palette + toasts */
.scrim{position:fixed;inset:0;z-index:50;background:var(--scrim);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:12vh 16px 16px}
.pal{max-width:560px;margin:0 auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:0 30px 60px -20px var(--shade);animation:pop .25s both}
.pal input{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;padding:18px 20px;font-size:18px;outline:none}
.pal ul{list-style:none;margin:0;padding:6px;max-height:340px;overflow:auto}
.pal li button{width:100%;display:flex;align-items:center;gap:12px;background:none;border:0;border-radius:var(--r-sm);padding:11px 14px;cursor:pointer;text-align:left;font-size:15px}
.pal li button .mono{margin-left:auto;color:var(--muted)}
.pal li button.act{background:var(--panel-2);box-shadow:inset 3px 0 0 var(--accent)}
.toasts{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;display:flex;flex-direction:column;gap:8px;align-items:flex-end;max-width:calc(100% - 32px)}
.toast{background:var(--ink);color:var(--bg);border-radius:var(--r-sm);padding:12px 16px;font-size:14px;display:flex;align-items:center;gap:10px;animation:pop .3s both;box-shadow:0 12px 30px -12px var(--shade)}
.toast i{width:8px;height:8px;border-radius:50%;background:var(--accent);flex-shrink:0}
.toast.ok i{background:var(--ok)} .toast.bad i{background:var(--bad)}

body.still *,body.still *::before,body.still *::after{animation:none!important;transition:none!important}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Selbsttest */
:is(.dlg,.page) form.ts-start{flex-direction:row;gap:12px;align-items:flex-end;flex-wrap:wrap}
.ts-start .field{flex:1;min-width:220px;margin:0}
.ts-run{border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;margin:12px 0}
.ts-now{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.ts-now h3{margin:2px 0 4px}
.ts-now p{margin:0;color:var(--muted)}
.ts-sum{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.ts-sum span{font-family:var(--font-mono);font-size:11px;padding:5px 10px;border-radius:999px;border:1px solid var(--line)}
.ts-res{font-family:var(--font-mono);font-size:11px;}
.ts-res.ok{color:var(--ok)}.ts-res.fehler{color:var(--bad)}.ts-res.unsicher{color:var(--accent)}.ts-res.übersprungen{color:var(--muted)}
.ts-detail td{white-space:normal;background:color-mix(in srgb,var(--line) 25%,transparent)}
.ts-detail pre{font-family:var(--font-mono);margin:6px 0 0;max-height:220px;overflow:auto;font-size:11px;white-space:pre-wrap;word-break:break-word}
#tsRows tr.has-d{cursor:pointer}
.ts-yes{color:var(--ok)}.ts-no{color:var(--bad)}
a.btn-line{display:inline-flex;align-items:center;text-decoration:none;color:var(--ink)}

/* Aufgaben + Verlauf */
.tk-top{display:grid;grid-template-columns:1fr minmax(200px,280px);gap:16px;margin-bottom:18px}
@media (max-width:720px){.tk-top{grid-template-columns:1fr}}
.tk-watch,.tk-upd{border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px}
.tk-watch h3,.tk-upd h3{margin:0 0 8px}
.tk-watch .check{margin:6px 0}
.tk-hang{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tk-hang select{width:auto}
.tk-upd p{margin:0 0 10px}
:is(.dlg,.page) form.tk-form{flex-direction:row;flex-wrap:wrap;align-items:flex-end;gap:10px;margin-top:14px}
.tk-form .field{margin:0;min-width:130px}
.tk-form .tk-cmd{flex:1;min-width:200px}
.tk-days{display:flex;gap:4px;border:0;padding:0;margin:0}
.tk-days label{display:inline-flex;align-items:center;justify-content:center;width:38px;height:40px;border:1px solid var(--line);border-radius:var(--r-sm);cursor:pointer;font-family:var(--font-mono);font-size:11px;}
.tk-days input{position:absolute;opacity:0;pointer-events:none}
.tk-days label:has(input:checked){background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tk-days label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.tk-res{display:block;max-width:220px;overflow:hidden;text-overflow:ellipsis}
.tk-res.bad{color:var(--bad)}
.ev-list{list-style:none;margin:0;padding:0}
.ev-list li{display:grid;grid-template-columns:auto 130px 1fr;gap:12px;align-items:baseline;padding:9px 4px;border-top:1px solid var(--line)}
.ev-list li:first-child{border-top:0}
.ev-list .dot{width:8px;height:8px;border-radius:50%;background:var(--muted);transform:translateY(-1px)}
.ev-list .warn .dot{background:var(--accent)}
.ev-list .error .dot{background:var(--bad)}
.ev-list .info .dot{background:var(--ok)}
.ev-list time{font-family:var(--font-mono);font-size:11px;color:var(--muted)}
#paneTasks>*,#paneEvents>*{flex-shrink:0}
#paneTasks h3{margin:0}
.tk-cmdtxt{font-family:var(--font-mono);font-size:12px;background:color-mix(in srgb,var(--line) 40%,transparent);padding:1px 6px;border-radius:4px}
@media (max-width:720px){
  .dlg.wide .dlg-head{flex-wrap:wrap}
  .dlg.wide .mg-title{flex:1 1 calc(100% - 60px);order:0}
  .dlg.wide .dlg-head .icon-btn{order:1}
  .dlg.wide .tabs{order:2;flex:1 1 100%;margin:0;overflow-x:auto;scrollbar-width:none}
  .dlg.wide .tabs button{flex:0 0 auto;padding:8px 11px}
  .dlg.wide{padding:16px}
}

/* Einstellungen */
.st-form{display:flex;flex-direction:column;gap:18px}
:is(.dlg,.page) form.st-form{gap:18px}
.st-sec{border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px 16px;margin:0;min-width:0}
.st-sec legend{font-family:var(--font-display);font-weight:700;font-size:14px;padding:0 6px;margin-left:-6px}
.st-sec .st-file{font-family:var(--font-mono);font-size:11px;color:var(--muted);margin:0 0 10px;word-break:break-all}
.st-sec .vars{margin-top:6px}
.st-sec .st-info{margin:0 0 10px}
.st-sec .err{margin:0 0 10px}
.st-foot{position:sticky;bottom:0;display:flex;gap:12px;align-items:center;justify-content:flex-end;padding:12px 0 2px;background:var(--panel);border-top:1px solid var(--line)}
.st-foot p{margin:0;flex:1}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--accent);text-decoration:underline;cursor:pointer}

/* Mods */
.md-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.md-item{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:var(--r-md);padding:10px 12px;min-width:0}
.md-item img,.md-item .md-ph{width:44px;height:44px;border-radius:10px;object-fit:cover;background:color-mix(in srgb,var(--line) 60%,transparent)}
.md-item .md-t{min-width:0}
.md-item b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.md-item p{margin:2px 0 0;font-size:12px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.md-item .mono{font-size:10px}
.md-item.add{border-color:var(--ok)}
.md-item.del{opacity:.55;border-style:dashed}
.md-item .btn-line{height:34px;padding:0 10px}
.md-bar{position:sticky;top:0;z-index:2;display:flex;gap:10px;align-items:center;padding:10px 14px;border:1px solid var(--accent);border-radius:var(--r-md);background:var(--panel)}
.md-bar p{flex:1;margin:0;font-size:13px}
:is(.dlg,.page) form.md-search{flex-direction:row;gap:8px}
.md-search input{flex:1}
#paneMods>*{flex-shrink:0}
#paneMods h3{margin:0}
.md-search input{border:1px solid var(--line);background:var(--panel-2);border-radius:var(--r-sm);padding:10px 12px;font-size:15px;color:var(--ink);min-width:0}
.md-search input:focus{border-color:var(--accent);outline:none}
.md-item .mono{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:none;letter-spacing:0}
@media (max-width:720px){.md-bar{flex-wrap:wrap}.md-bar p{flex:1 1 100%}.md-bar button{flex:1}.md-list{grid-template-columns:minmax(0,1fr)}}
.spin{display:inline-block;width:12px;height:12px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;vertical-align:-1px}
@keyframes spin{to{transform:rotate(360deg)}}

/* rollen, konto, benutzer, protokoll, https */
body:not([data-role="admin"]) .admin-only,
body[data-role="admin"] .not-admin,
body[data-role="viewer"] .op-only,
body[data-role="viewer"] :is(#bkNow, #bkPlan, #bkRows button, #tkUpdWrap, #tkForm, #tkRows button, #tkRows input, .tk-watch){display:none!important}
#authCreds{display:flex;flex-direction:column;gap:14px}
#authBack{align-self:center;font-size:14px}
#meBlock form{margin-top:12px}
.sec2{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line);display:flex;flex-direction:column;gap:8px}
.sec2 h4{margin:0;font-family:var(--font-mono);font-size:11px;font-weight:500;color:var(--muted)}
.on-ok{color:var(--ok);font-weight:600}
.qr{align-self:center;background:#fff;padding:12px;border-radius:var(--r-md);width:max-content;margin:4px auto}
.qr svg,.qr img{display:block;width:200px;height:200px}
.secret{word-break:break-all;font-size:13px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 10px;user-select:all}
#tfStep1,#tfStep2{display:flex;flex-direction:column;gap:10px}
.codes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px;margin:0;padding:12px 12px 12px 34px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-md);font-size:14px}
.role{font-family:var(--font-mono);font-size:10px;border:1px solid var(--line);border-radius:999px;padding:3px 8px}
.role.admin{border-color:var(--accent);color:var(--accent)}
.role.operator{border-color:var(--ok);color:var(--ok)}
.tbl td.wrap{white-space:normal;min-width:160px}
.tbl tr.off td{opacity:.55}
.us-form{border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel-2);padding:16px}
.us-srv{display:flex;flex-direction:column;gap:6px;max-height:150px;overflow:auto;padding:4px 2px}
.us-extra{display:flex;flex-wrap:wrap;gap:10px 22px}
.au-bar{display:flex!important;flex-direction:row!important;flex-wrap:wrap;align-items:flex-end;gap:12px}
.au-bar .field{flex:1 1 170px;min-width:150px}
.au-bar .check{height:44px}
.au-wrap{flex:1;min-height:0;overflow:auto}
.tbl.au td{font-size:13px;vertical-align:top}
.tbl.au .bad{color:var(--bad)}
.tbl.au thead th{position:sticky;top:0;background:var(--panel)}
@media (max-width:560px){.codes{grid-template-columns:1fr}}
body[data-role="viewer"] .power{pointer-events:none;opacity:.55}
.btn-line.sm:hover{color:var(--bg)}
.field .check input[type=checkbox]{width:18px;height:18px;padding:0;flex-shrink:0}
.field .check{font-family:inherit;text-transform:none;letter-spacing:0;color:var(--ink)}

/* ============ Layout: Seitenleiste + Seiten ============ */
.app{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100vh;min-height:100dvh}
.side{position:sticky;top:0;height:100vh;height:100dvh;display:flex;flex-direction:column;gap:14px;padding:18px 12px 14px;border-right:1px solid var(--line);background:var(--panel);overflow-y:auto;z-index:40}
.side-top{display:flex;align-items:center;justify-content:space-between;padding:2px 8px 4px}
.side-close{display:none}
.side-search{display:flex;align-items:center;gap:10px;height:38px;padding:0 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg);color:var(--muted);cursor:pointer;font-size:14px;text-align:left}
.side-search:hover{border-color:var(--muted)}
.side-search kbd{margin-left:auto}
.side-nav{display:flex;flex-direction:column;gap:2px}
.side-nav a{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:var(--r-sm);color:var(--muted);text-decoration:none;font-size:14.5px;font-weight:500;transition:background .15s,color .15s}
.side-nav a:hover{background:var(--panel-2);color:var(--ink)}
.side-nav a[aria-current="page"]{background:var(--panel-2);color:var(--ink)}
.side-nav a[aria-current="page"] .ic{color:var(--accent)}
.side-nav .ic{flex-shrink:0}
.side-nav .cnt{margin-left:auto;font-size:12px;font-weight:500;color:var(--muted);background:var(--bg);border-radius:999px;padding:0 8px;line-height:20px}
.side-nav .cnt:empty{display:none}
.side-nav .cnt.live{color:var(--accent)}
.side-label{margin:16px 10px 4px;font-size:12px;color:var(--muted);font-weight:500}
.side-foot{margin-top:auto;display:flex;flex-direction:column;gap:10px;padding-top:12px}
.prefs{display:flex;flex-direction:column;padding:0 4px}
.prefs .switch{justify-content:space-between;width:100%;padding:0 6px}
.me-card{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 10px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;font-weight:700;font-size:14px;flex-shrink:0}
.me-txt{display:flex;flex-direction:column;min-width:0;flex:1;text-decoration:none;color:var(--ink);line-height:1.25}
.me-txt b{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-txt span{font-size:12px;color:var(--muted)}
.me-card .icon-btn{width:34px;height:34px;border:0;color:var(--muted)}
.me-card .icon-btn:hover{color:var(--ink);background:var(--panel-2)}
.side-foot .chip-ed{align-self:flex-start;margin-left:6px;border-color:var(--line);color:var(--muted);font-size:11px}
.side-scrim{position:fixed;inset:0;background:var(--scrim);z-index:35}

.main{min-width:0;padding:28px 36px 56px;max-width:1440px;width:100%}
.mbar{display:none}
.page{display:flex;flex-direction:column;gap:20px;animation:rise .3s both}
.page.narrow{max-width:860px}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.page-head h1{margin:0;font-family:var(--font-display);font-weight:700;font-size:28px;line-height:1.15}
.page-head p{margin:6px 0 0;max-width:75ch}
.page-head .acts{gap:8px}
.page-foot{display:flex;justify-content:flex-end}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg)}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.card-head h2{font-size:16px}
.link{color:var(--accent);text-decoration:none;font-size:14px;font-weight:500}
.link:hover{text-decoration:underline}

/* übersicht */
.stat{border-radius:var(--r-lg);padding:14px 16px 10px}
.home-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,1fr);gap:20px;align-items:stretch}
.home-grid .stage{height:auto;min-height:360px}
.home-list{padding:16px 18px 8px;display:flex;flex-direction:column;gap:6px;min-width:0}
.srv-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.srv-list li{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding:6px 0}
.srv-list li:first-child{border-top:0}
.srv-list .row{flex:1;display:flex;align-items:center;gap:12px;min-width:0;text-decoration:none;color:var(--ink);padding:6px 8px;margin-left:-8px;border-radius:var(--r-sm)}
.srv-list .row:hover{background:var(--panel-2)}
.srv-list .nm{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.3}
.srv-list .nm b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srv-list .nm small{color:var(--muted);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srv-list .rt{font-size:13px;color:var(--muted);white-space:nowrap}
.srv-list .power{width:46px;height:26px;padding:2px}
.srv-list .power span{width:20px;height:20px}
.srv-list .power[aria-pressed="true"] span{transform:translateX(20px)}
.srv-list .none,.srv-list .more{color:var(--muted);font-size:14px;padding:14px 0}
.srv-list .more a{color:var(--accent);text-decoration:none}
.zoom{left:14px;bottom:14px}
.lab{font-size:12px}

/* serverliste */
.toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.search-in{flex:1 1 260px;max-width:420px;display:flex;align-items:center;gap:8px;height:38px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--muted)}
.search-in:focus-within{border-color:var(--accent)}
.search-in input{flex:1;min-width:0;border:0;background:transparent;outline:none;font-size:14.5px;color:var(--ink)}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-sm);padding:3px;background:var(--panel);gap:2px}
.seg button{border:0;background:transparent;border-radius:6px;padding:5px 12px;font-size:13.5px;color:var(--muted);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--panel-2);color:var(--ink);font-weight:500}
.mods{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.mod{border-radius:var(--r-lg);padding:16px 18px}
.mod h3{font-size:18px;font-weight:650}
.mod-foot .v{font-size:19px;font-weight:600}
.mod.stopped{background:var(--panel)}
.mod:hover{border-color:var(--muted)}

/* ein server */
.back{display:inline-flex;align-items:center;gap:4px;color:var(--muted);text-decoration:none;font-size:14px;align-self:flex-start;margin:-6px 0 -10px -4px;padding:4px}
.back:hover{color:var(--ink)}
.srv-head{display:flex;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;align-items:flex-end}
.srv-title{min-width:0}
.srv-title h1{margin:2px 0 10px;font-family:var(--font-display);font-weight:700;font-size:30px;line-height:1.1;overflow-wrap:anywhere}
.srv-meta{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;font-size:14px;color:var(--muted)}
.pill{display:inline-flex;align-items:center;gap:7px;padding:3px 11px;border-radius:999px;background:var(--panel-2);border:1px solid var(--line);color:var(--ink);font-size:13px;font-weight:500}
.addr{border:0;background:none;padding:0;color:var(--ink);font-family:var(--font-mono);font-size:13px;cursor:pointer;text-decoration:underline dotted var(--muted);text-underline-offset:3px}
.addr:hover{color:var(--accent)}
#svActs{gap:8px}
#svMsg{margin-top:-8px}
.con-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:20px;align-items:start}
.con-grid .lcd{border-radius:var(--r-lg)}
.con-grid .lines{height:max(340px,calc(100vh - 400px))}
.info{padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.info h2{font-size:15px}
.kv.one{grid-template-columns:minmax(0,1fr)}
.kv.one div{display:flex;justify-content:space-between;gap:12px;padding:7px 0}
.kv.one dd{text-align:right}
.mg-pane .tbl-wrap{background:var(--panel)}
.lcd-head{font-size:12.5px}

/* einstellungen */
.set-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:28px;align-items:start}
.subnav{display:flex;flex-direction:column;gap:2px;position:sticky;top:24px}
.subnav a{padding:8px 10px;border-radius:var(--r-sm);color:var(--muted);text-decoration:none;font-size:14.5px;font-weight:500}
.subnav a:hover{color:var(--ink);background:var(--panel)}
.subnav a[aria-current="page"]{color:var(--ink);background:var(--panel);box-shadow:inset 2px 0 0 var(--accent)}
.set-body{max-width:760px;display:flex;flex-direction:column;gap:16px;min-width:0}
.set-body .set-block{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);padding:22px;margin:0;display:flex;flex-direction:column;gap:14px}
.set-body .set-block>h2{font-size:20px}
body:not([data-role="admin"]) .set-layout{grid-template-columns:minmax(0,1fr)}
.sec2{border-top:1px solid var(--line)}

/* benutzer, protokoll, selbsttest als seiten */
.page .us-form{background:var(--panel)}
.page .au-wrap{max-height:none}
.page .ts-run,.page .ts-sum{margin:0}

/* mobil */
@media (max-width:1100px){
  .home-grid,.con-grid{grid-template-columns:minmax(0,1fr)}
  .con-grid .lines{height:420px}
}
@media (max-width:900px){
  .app{grid-template-columns:minmax(0,1fr)}
  .side{position:fixed;left:0;top:0;bottom:0;width:min(280px,86vw);transform:translateX(-102%);transition:transform .25s ease;box-shadow:0 0 40px var(--shade)}
  body.side-open .side{transform:none}
  .side-close{display:inline-flex}
  .mbar{display:flex;align-items:center;justify-content:space-between;gap:10px;position:sticky;top:0;z-index:30;margin:-16px -16px 16px;padding:10px 16px;background:var(--bg);border-bottom:1px solid var(--line)}
  .main{padding:16px 16px 48px}
  .page-head h1{font-size:24px}
  .srv-title h1{font-size:24px}
  .set-layout{grid-template-columns:minmax(0,1fr);gap:14px}
  .subnav{flex-direction:row;overflow-x:auto;position:static;scrollbar-width:none;border-bottom:1px solid var(--line)}
  .subnav a{flex:0 0 auto}
  .subnav a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--accent);background:none}
  .set-body .set-block{padding:16px}
  .home-grid .stage{min-height:300px}
}
@media (max-width:560px){
  .page-head .acts,#svActs{width:100%}
  .page-head .acts>*,#svActs>*{flex:1 1 auto}
  .stat .v{font-size:22px}
}
.set-block h3.sub{margin-top:10px;padding-top:16px;border-top:1px solid var(--line)}
.more{position:relative}
.more summary{list-style:none;width:38px;padding:0}
.more summary::-webkit-details-marker{display:none}
.more .menu{position:absolute;right:0;top:calc(100% + 6px);z-index:20;min-width:230px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:0 18px 40px -16px var(--shade);padding:6px;display:flex;flex-direction:column;animation:pop .15s both}
.more .menu button{border:0;background:none;text-align:left;padding:9px 12px;border-radius:6px;font-size:14px;cursor:pointer;color:var(--ink)}
.more .menu button:hover{background:var(--panel-2)}
.more .menu button.danger{color:var(--bad)}
.sec2 h4{font-family:var(--font-body);font-size:15px;font-weight:600;color:var(--ink)}
.role{font-family:var(--font-body);font-size:12px;font-weight:500;padding:2px 9px}
.core-top h2{font-size:17px;font-weight:650}
@media (max-width:560px){#svActs{flex-wrap:nowrap}#svActs>.more{flex:0 0 auto}#svActs .more .menu{right:auto;left:0}}
@media (max-width:900px){.side-search kbd{display:none}}
.st-wait{display:flex;gap:10px;align-items:flex-start;font-size:14px;padding:12px 14px;border-radius:var(--r-md);background:var(--panel-2);margin:4px 0 0}
.st-wait .spin{flex-shrink:0;margin-top:3px}
.bad-txt{color:var(--bad)}
.howto{border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px;background:var(--bg)}
.howto summary{cursor:pointer;font-size:14px;font-weight:500}
.howto ol{margin:10px 0 2px;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.page form.lcd-in,.page form.ask{flex-direction:row;gap:10px}
.page form.ask{gap:0}
.stm-log{margin:8px 0 0;max-height:240px;overflow:auto;font-family:var(--font-mono);font-size:11.5px;white-space:pre-wrap;word-break:break-word;color:var(--muted)}

/* erreichbarkeit */
.info [data-reach]{align-self:flex-start}
#rcBody{display:flex;flex-direction:column;gap:14px}
.rc-wait{display:flex;gap:10px;align-items:center;color:var(--muted)}
.rc-ic{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;font-size:12px;font-weight:700;flex-shrink:0;background:var(--line);color:var(--muted)}
.rc-ic.big{width:34px;height:34px;font-size:18px}
.rc-ok .rc-ic{background:var(--ok);color:var(--panel)}
.rc-warn .rc-ic{background:var(--accent);color:var(--on-accent)}
.rc-fail .rc-ic{background:var(--bad);color:var(--panel)}
.rc-verdict{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-lg)}
.rc-verdict.rc-ok{border-color:var(--ok)}.rc-verdict.rc-fail{border-color:var(--bad)}.rc-verdict.rc-warn{border-color:var(--accent)}
.rc-verdict div,.rc-steps div{display:flex;flex-direction:column;gap:3px;min-width:0;align-items:flex-start}
.rc-verdict b{font-size:16px}
.rc-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.rc-steps li{display:flex;gap:12px;align-items:flex-start;padding:9px 0;border-top:1px solid var(--line)}
.rc-steps span{font-size:13.5px;color:var(--muted);overflow-wrap:anywhere}
.rc-scroll{overflow-x:auto}
.rc-ports{width:100%;border-collapse:collapse;font-size:13.5px}
.rc-ports th,.rc-ports td{text-align:left;vertical-align:top;padding:8px 8px 8px 0;border-top:1px solid var(--line)}
.rc-ports thead th{font-size:12.5px;color:var(--muted);font-weight:500;border-top:0}
.rc-ports td .rc-ic{width:16px;height:16px;font-size:10px;vertical-align:-3px;margin-right:4px}
.rc-ports tr.rc-int{opacity:.75}
@media (max-width:560px){.rc-ports thead{display:none}.rc-ports tr{display:grid;grid-template-columns:1fr;border-top:1px solid var(--line);padding:6px 0}.rc-ports th,.rc-ports td{border:0;padding:3px 0}.rc-ports td::before{content:attr(data-l) ": ";color:var(--muted);font-size:12.5px}}

/* einstellungen: kacheln wie bei amp */
.st-top{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.st-tabs{display:flex;gap:4px;flex-wrap:wrap;background:var(--panel-2);border-radius:var(--r-md);padding:4px}
.st-tabs button{border:0;background:none;color:var(--muted);font:inherit;font-size:14px;font-weight:500;padding:7px 14px;border-radius:calc(var(--r-md) - 3px);cursor:pointer}
.st-tabs button:hover{color:var(--ink)}
.st-tabs button.on{background:var(--panel);color:var(--ink);box-shadow:0 1px 0 var(--line),0 0 0 1px var(--line)}
#stFind{border:1px solid var(--line);background:var(--bg);border-radius:var(--r-sm);padding:8px 12px;font-size:14px;width:min(260px,100%)}
#stFind:focus{border-color:var(--accent);outline:none}
#stBody{display:flex;flex-direction:column;gap:14px}
.st-msgs{display:flex;flex-direction:column;gap:8px}
.st-msgs[hidden],.st-msgs>[hidden]{display:none}
.shared-cond .st-cond{display:none!important}
.st-msgs .err{margin:0}
.st-banner{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:10px 14px;border-radius:var(--r-md);background:var(--panel-2);font-size:14px;margin:0}
.st-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch}
@media (max-width:760px){.st-grid{grid-template-columns:minmax(0,1fr)}}
.st-card{display:flex;flex-direction:column;gap:6px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px 16px;min-width:0;transition:opacity .2s}
.st-card[hidden]{display:none}
.st-title,.st-head label{font-weight:600;font-size:15px;color:var(--ink);cursor:pointer}
.st-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.st-help{font-size:12.5px;color:var(--muted);margin:0;line-height:1.45}
.st-range{font-size:11.5px;color:var(--muted);margin:0;font-family:var(--font-mono)}
.st-in{position:relative;margin-top:auto;padding-top:6px}
.st-in input,.st-in select{width:100%;border:1px solid var(--line);background:var(--bg);border-radius:var(--r-sm);padding:9px 12px;font-size:15px;color:var(--ink)}
.st-in input:focus,.st-in select:focus{border-color:var(--accent);outline:none}
.st-in.has-unit input{padding-right:84px}
.st-unit{position:absolute;right:12px;bottom:10px;font-size:14px;color:var(--muted);pointer-events:none}
.st-cond{font-size:12px;color:var(--accent);margin:0}
.st-dim>:not(.st-cond):not(.st-gtag){opacity:.5}
.shared-cond .st-dim>*{opacity:1}.shared-cond .st-dim{opacity:.6}
.st-gtag{display:none;font-size:11px;color:var(--muted);font-family:var(--font-mono)}
.st-grid.searching .st-gtag{display:block}
.st-none{margin:0}
.tgl{appearance:none;-webkit-appearance:none;width:40px;height:22px;border-radius:11px;background:var(--line);position:relative;cursor:pointer;flex-shrink:0;margin:1px 0 0;transition:background .2s;border:0}
.tgl::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--ink);opacity:.75;transition:transform .25s cubic-bezier(.5,1.6,.4,1),opacity .2s}
.tgl:checked{background:var(--accent)}
.tgl:checked::after{transform:translateX(18px);background:var(--on-accent);opacity:1}
.tgl:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.undo-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.undo-list li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.undo-list li div{display:flex;flex-direction:column;gap:2px;min-width:0}
#dlgUndo[open]{display:flex;flex-direction:column;gap:14px}

#stage .lab{max-width:140px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px;padding:3px 7px}
#stage .lab .nm{overflow:hidden;text-overflow:ellipsis;min-width:0}
#stage .lab .dot{flex:none}
@media (max-width:560px){#stage .lab{max-width:110px;font-size:10px}}
/* Übernahme aus AMP */
.amp-hint{margin:0 0 10px}
.amp-steps{margin:10px 0 14px;padding-left:20px;display:grid;gap:10px;font-size:14px}
.amp-cmd{display:flex;gap:8px;align-items:stretch;margin:6px 0 4px}
.amp-cmd code{flex:1;min-width:0;padding:8px 10px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-md);font-size:12px;word-break:break-all;user-select:all}
.amp-list{display:grid;gap:10px}
.amp-item{border:1px solid var(--line);border-radius:var(--r-md);padding:12px;background:var(--panel-2)}
.amp-item .amp-top{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.amp-item p{margin:6px 0}
.amp-item .dlg-actions{margin-top:8px}
/* KI-Diagnose */
.sv-checks{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.dg-ev{display:block;max-width:100%;margin-top:4px;padding:4px 8px;font-size:12px;background:var(--panel-2);border:1px solid var(--line);border-radius:6px;white-space:pre-wrap;overflow-wrap:anywhere}
.dg-h{font-size:15px;margin:14px 0 4px}
.dg-acts{list-style:none;margin:0;padding:0}
.dg-acts li{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 0;border-top:1px solid var(--line)}
.dg-acts li div{display:flex;flex-direction:column;gap:3px;min-width:0}
.dg-acts li span{font-size:13.5px;color:var(--muted);overflow-wrap:anywhere}
.dg-acts button{flex-shrink:0}
.dg-old summary{cursor:pointer;font-size:13.5px;color:var(--muted)}
.dg-old ul{margin:8px 0 0;padding-left:18px;display:grid;gap:8px;font-size:13.5px}
@media (max-width:560px){.dg-acts li{flex-direction:column;align-items:stretch}}
/* Installierte Mods */
.ml-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ml-head h2,.ml-sub{font-size:16px;margin:0}
.ml-sub{margin:26px 0 6px}
.ml-list{display:flex;flex-direction:column;margin-top:8px}
.ml-item{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--line)}
.ml-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.ml-t b{overflow-wrap:anywhere}
.ml-t a{color:inherit;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.ml-t p{margin:2px 0 0}
.ml-st{flex-shrink:0;width:132px;font-size:12.5px;font-weight:600;padding:3px 8px;border-radius:999px;border:1px solid var(--line);text-align:center}
.ml-ok{color:var(--ok);border-color:var(--ok)}
.ml-bad{color:var(--bad);border-color:var(--bad)}
.ml-warn{color:var(--accent);border-color:var(--accent)}
.ml-on{color:var(--ink)}
.ml-muted{color:var(--muted)}
.ml-upd{color:var(--accent)}
.ml-item .tgl{flex-shrink:0;margin-top:2px}
@media (max-width:560px){.ml-item{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"st . sw" "t t t";row-gap:6px}.ml-st{grid-area:st;width:auto}.ml-t{grid-area:t}.ml-item .tgl{grid-area:sw}}
.ws-b42{margin:6px 0 10px}
.ws-key{display:flex;gap:8px;margin-top:8px}.ws-key input{flex:1;min-width:0}
.ml-t .linkbtn{align-self:flex-start;margin-top:2px}
.ws-ki ol{margin:4px 0 0 18px;padding:0}.ws-ki p{margin:4px 0}

.tk-cond{display:flex;flex-wrap:wrap;gap:6px 18px;flex-basis:100%;order:9}
.tk-cond .check{margin:0;display:flex;align-items:center;gap:6px}
.tk-cond select{width:auto;padding:4px 8px;min-height:0}
.tk-form>button[type=submit]{order:10}
.tk-sugg{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px}
.tk-sugg-list{display:flex;flex-wrap:wrap;gap:8px}
.tk-sugg-list button{border:1px dashed var(--line);background:transparent;color:var(--ink);border-radius:999px;padding:6px 12px;font:inherit;font-size:13px;cursor:pointer}
.tk-sugg-list button:hover{border-color:var(--accent);color:var(--accent)}
.tk-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.tk-tag{font-size:11px;padding:1px 7px;border-radius:999px;background:color-mix(in srgb,var(--line) 55%,transparent);color:var(--muted);white-space:nowrap}
.tk-upd-btns{gap:8px;flex-wrap:wrap}

.tbl.chg{margin:10px 0}.tbl.chg td,.tbl.chg th{padding:7px 10px}

.nt-kinds{border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px;margin:6px 0 12px}
.nt-kinds legend{padding:0 6px;font-size:13px;color:var(--muted)}
.nt-kinds #ntKinds{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:4px 16px}
.nt-kinds .check{margin:4px 0}
.chip-ed.upd{background:var(--accent);color:#111}
.up-notes{border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px;max-height:260px;overflow:auto;font-size:13px;white-space:pre-wrap;margin:8px 0}

.pl-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}.pl-head h3{margin:0}.pl-head .btn-line{margin-left:auto}
.pl-online{margin-bottom:16px}.pl-acts{gap:6px;flex-wrap:wrap;justify-content:flex-end}
:is(.dlg,.page) form.pl-add{flex-direction:row;flex-wrap:wrap;align-items:flex-end;gap:10px;margin:8px 0 18px}
.pl-add .field{margin:0;min-width:220px;flex:1;max-width:360px}.pl-btns{display:flex;gap:8px;flex-wrap:wrap}
.pl-lists{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.pl-list{border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px}.pl-list h4{margin:0 0 8px}
.pl-list ul{list-style:none;margin:0;padding:0}.pl-list li{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid color-mix(in srgb,var(--line) 50%,transparent);font-family:var(--font-mono);font-size:13px}
.btn-line.small{padding:4px 10px;font-size:12px;min-height:0}

.pl-stats{margin-top:22px;border-top:1px solid var(--line);padding-top:14px}.pl-stats h3{margin:0 0 8px}
.insights{margin:0 0 12px;padding-left:18px}.insights li{margin:4px 0}
.insights-card{margin-bottom:16px;padding:14px 18px}.insights-card h2{margin:0 0 6px;font-size:16px}
.heat-wrap{overflow-x:auto;margin-bottom:14px}
.heat{display:grid;grid-template-columns:28px repeat(24,minmax(14px,1fr));gap:3px;min-width:420px;max-width:760px}
.heat .hc{aspect-ratio:1;border-radius:3px;background:color-mix(in srgb,var(--accent) calc(var(--a)*100%),var(--line) 20%)}
.heat .hc.none{background:transparent;outline:1px dashed color-mix(in srgb,var(--line) 70%,transparent);outline-offset:-1px}
.heat .wd,.heat .hh{font-family:var(--font-mono);font-size:10px;color:var(--muted);align-self:center}
.dot.on{display:inline-block;width:8px;height:8px;border-radius:50%;background:#3ccf91;vertical-align:1px}
/* Events */
.ge-h{margin-top:28px}
.ge-list{margin-top:6px}
.ge-item{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--line)}
.ge-item .ml-st{width:90px}
.ge-item>.linkbtn{flex-shrink:0;margin-top:3px}
.ge-chg{margin:6px 0 12px;padding-left:18px;font-size:13.5px;display:flex;flex-direction:column;gap:3px}
.ge-times{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:560px){.ge-times{grid-template-columns:1fr}.ge-item{flex-wrap:wrap}}
.dc-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media (max-width:640px){.dc-grid{grid-template-columns:1fr}}
#dcEndpoint{display:block;margin-top:4px;overflow-wrap:anywhere;user-select:all}
/* Herkunftskarte */
.pl-geo{margin-top:22px;border-top:1px solid var(--line);padding-top:14px}
.geo-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.geo-head h3{margin:0}
.geo-head select{margin-left:auto;width:auto}
.geo-wrap{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:16px;align-items:start}
@media (max-width:860px){.geo-wrap{grid-template-columns:1fr}}
.geo-map{position:relative;height:420px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:color-mix(in srgb,var(--bg) 70%,#0a2540 30%)}
@media (max-width:560px){.geo-map{height:300px}}
.geo-svg{display:block;width:100%;height:100%;cursor:grab;touch-action:none;user-select:none}
.geo-svg:active{cursor:grabbing}
.geo-svg path{fill:color-mix(in srgb,var(--panel) 75%,var(--ink) 25%);stroke:var(--bg);stroke-width:var(--sw,.6);stroke-linejoin:round}
.geo-svg path.has{fill:color-mix(in srgb,var(--accent) calc(var(--a)*100%),color-mix(in srgb,var(--panel) 75%,var(--ink) 25%))}
.geo-dot{fill:var(--accent);fill-opacity:.85;stroke:#fff;stroke-opacity:.9;stroke-width:var(--sw,.6);cursor:pointer}
.geo-live-dot{fill:#3ddc84;stroke:#fff;stroke-width:var(--sw,.6);animation:geoPulse 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes geoPulse{50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.geo-live-dot{animation:none}}
.geo-zoom{position:absolute;right:10px;top:10px;display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end;z-index:2}
.geo-zoom button{min-width:32px;height:30px;padding:0 9px;border-radius:8px;border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 90%,transparent);color:var(--ink);font-size:13px;cursor:pointer}
.geo-zoom button:hover{border-color:var(--accent)}
.geo-tip{position:absolute;z-index:3;pointer-events:none;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:12.5px;line-height:1.45;box-shadow:0 6px 20px rgba(0,0,0,.25);max-width:240px}
.geo-side h4{margin:0 0 6px;font-size:13px;color:var(--muted);font-weight:600}
.geo-side h4+ul,.geo-side h4+ol{margin:0 0 16px}
.geo-live,.geo-cc{list-style:none;padding:0;display:flex;flex-direction:column;gap:6px;font-size:14px}
.geo-cc li{display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:baseline}
.geo-cc i{grid-column:1/-1;height:4px;border-radius:2px;background:linear-gradient(90deg,var(--accent) var(--w),color-mix(in srgb,var(--line) 70%,transparent) var(--w))}
.geo-foot{margin-top:10px}
.join-hint{display:block;margin-top:3px;line-height:1.4}
/* Leistungsverlauf */
.perf{margin-bottom:22px}
.perf-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.perf-head h3{margin:0}
.perf-head .seg{margin-left:auto}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.seg button{border:0;background:transparent;color:var(--muted);padding:5px 11px;font-size:13px;cursor:pointer}
.seg button+button{border-left:1px solid var(--line)}
.seg button[aria-pressed="true"]{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--ink);font-weight:600}
.perf-charts{position:relative;display:grid;gap:6px}
.chart{margin:0}
.chart figcaption{font-size:12.5px;color:var(--muted);margin:0 0 2px}
.chart-svg{display:block;width:100%;height:120px;overflow:visible}
.chart[data-empty="1"] .chart-svg{opacity:.55}
.ch-grid{stroke:var(--line);stroke-width:1;opacity:.7}
.ch-ax{fill:var(--muted);font-size:10.5px;font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.ch-line{fill:none;stroke:var(--accent);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.ch-area{fill:var(--accent);opacity:.12}
.ch-off{fill:var(--muted);opacity:.1}
.ch-err{fill:var(--bad)}
.ch-ref{stroke:var(--muted);stroke-width:1;stroke-dasharray:4 4}
.ch-cross{stroke:var(--muted);stroke-width:1}
.ch-dot{fill:var(--accent);stroke:var(--bg);stroke-width:2}
.chart-tip{position:absolute;z-index:3;pointer-events:none;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:12.5px;line-height:1.5;box-shadow:0 6px 20px rgba(0,0,0,.25);min-width:150px}
.ev-h{margin:6px 0 8px}
/* Speicher */
.sg-disk{margin-bottom:18px}
.sg-bar{height:10px;border-radius:5px;background:var(--line);overflow:hidden;margin-bottom:6px}
.sg-bar i{display:block;height:100%;background:var(--accent)}
.sg-bar i.warn{background:var(--bad)}
.sg-row{display:grid;grid-template-columns:1fr auto 110px;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.sg-row .mono{text-align:right}
#sgBlock h3{margin:22px 0 8px}
.maint-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding:10px 14px;border-radius:10px;border:1px solid color-mix(in srgb,var(--accent) 50%,var(--line));background:color-mix(in srgb,var(--accent) 10%,transparent);font-size:14px}
.maint-bar span{flex:1;min-width:0}
.join-row{display:flex;gap:8px;margin:6px 0 10px}
.join-row input{flex:1;min-width:0;font-family:var(--font-mono);font-size:12.5px}
.iv-qr{width:180px;max-width:100%;margin:4px 0 8px}
.iv-qr svg{display:block;width:100%;height:auto;background:#fff;border-radius:8px}
.sp-cal{margin-top:18px}.sp-cal h3{margin:0 0 4px}
.mu-box{margin-bottom:22px}
.dc-h{margin:22px 0 4px}#dcLinks h4{margin:14px 0 6px}
.sz{margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.sz-h{margin:14px 0 4px;font-size:15px}
.auth-lang{display:block;margin:14px auto 0;font-size:13px;opacity:.8}
.nd-tbl td{vertical-align:top}
.nd-act{text-align:right}
.nd-act button{display:block;margin:0 0 6px auto}
.nd-steps{margin:0 0 4px;padding-left:20px;line-height:1.6}
.nk-show{border:1px solid var(--line);border-radius:12px;padding:12px}
.nk-code{display:flex;gap:8px;align-items:center}
.nk-code code{flex:1;word-break:break-all;font-size:12px;user-select:all}
.nk-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.nk-list li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
@media (max-width:700px){.nd-tbl th:nth-child(3),.nd-tbl td:nth-child(3),.nd-tbl th:nth-child(5),.nd-tbl td:nth-child(5){display:none}.nd-act{white-space:normal}}
.fleet-card{margin-bottom:16px;padding:14px 18px}.fleet-card h2{margin:0;font-size:16px}
.fleet{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.fl-row{display:grid;grid-template-columns:minmax(160px,1.2fr) repeat(3,minmax(0,1fr));gap:14px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.fl-row:first-child{border-top:0}
.fl-row.off{opacity:.65}
.fl-name{display:flex;flex-direction:column;gap:2px;min-width:0}
.fl-m{display:flex;flex-direction:column;gap:4px;min-width:0}.fl-m.wide{grid-column:span 3}
.fl-bar{display:block;height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.fl-bar i{display:block;height:100%;background:var(--ok)}.fl-bar.hot i{background:var(--bad)}
@media (max-width:760px){.fl-row{grid-template-columns:1fr 1fr}.fl-name{grid-column:1/-1}.fl-m.wide{grid-column:1/-1}}
.note.warn{border-left-color:var(--bad);color:var(--ink)}
.mv-notes{margin:4px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.mv-bar{height:6px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:8px}
.mv-bar i{display:block;height:100%;width:35%;background:var(--accent);animation:mvslide 1.2s ease-in-out infinite alternate}
#mvRun.done .mv-bar i{width:100%;animation:none}
@keyframes mvslide{from{transform:translateX(-30%)}to{transform:translateX(220%)}}
@media (prefers-reduced-motion:reduce){.mv-bar i{animation:none;width:100%;opacity:.5}}
.macro-bar{display:flex;flex-wrap:wrap;gap:6px;padding:6px 10px;border-top:1px solid var(--line)}
.macro-bar button{font:inherit;font-size:12px;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:999px;padding:4px 10px;cursor:pointer}
.macro-bar button:hover{border-color:var(--accent)}
.macro-bar .mc-edit{color:var(--muted);border-style:dashed}
.mc-list{display:flex;flex-direction:column;gap:12px;margin:10px 0}
.mc-item{border:1px solid var(--line);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px}
.mc-head{display:flex;gap:8px;align-items:center}.mc-head .mc-name{flex:1}
.mc-lines{width:100%;resize:vertical;min-height:90px}
.wi-tbl td{vertical-align:top}.wi-tbl .wi-answer{width:100%;min-width:160px}
.nav-btn{display:flex;align-items:center;gap:12px;width:100%;background:none;border:0;font:inherit;color:inherit;text-align:left;padding:10px 12px;border-radius:10px;cursor:pointer;opacity:.85}
.nav-btn:hover{background:var(--panel);opacity:1}
.msg-help{margin:-6px 0 10px}
.help-dlg{width:min(960px,96vw)}
.help-wrap{display:grid;grid-template-columns:260px 1fr;gap:18px;min-height:420px}
.help-side{display:flex;flex-direction:column;gap:8px;min-width:0}
.help-list{list-style:none;margin:0;padding:0;overflow:auto;max-height:60vh}
.help-list button{display:block;width:100%;text-align:left;background:none;border:0;font:inherit;color:inherit;padding:7px 10px;border-radius:8px;cursor:pointer}
.help-list button:hover{background:var(--panel)}
.help-list button[aria-current=true]{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--ink);font-weight:600}
.help-art{overflow:auto;max-height:65vh;line-height:1.6}
.help-art h3{margin:0 0 8px;font-size:18px}
.help-art pre{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px;overflow:auto;font-size:12.5px}
.help-art li{margin:4px 0}
@media (max-width:700px){.help-wrap{grid-template-columns:1fr}.help-list{max-height:180px}}
.wiz{width:min(620px,96vw)}
.wiz .dlg-head{align-items:center}
.wz-dots{display:flex;gap:6px;list-style:none;margin:0 0 0 auto;padding:0}
.wz-dots li{width:8px;height:8px;border-radius:50%;background:var(--line)}
.wz-dots li.on{background:var(--accent)}.wz-dots li.done{background:color-mix(in srgb,var(--accent) 45%,var(--line))}
.wz-step{display:flex;flex-direction:column;gap:10px;min-height:220px}
.wz-opt{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:10px 12px;cursor:pointer}
.wz-opt:has(input:checked){border-color:var(--accent)}
.wz-opt input[type=radio]{margin-top:4px}
.wz-opt input:not([type]){margin:6px 0 2px;width:100%}
.wz-first{display:flex;flex-wrap:wrap;gap:10px}
.wz-skip{margin-right:auto}
.wz-opt input:not([type]){background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 11px;color:var(--ink);font:inherit;box-sizing:border-box}

/* API & Webhooks */
.ik-servers{border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:10px 0}
.ik-srv{display:flex;flex-wrap:wrap;gap:6px 14px}
.ik-srv label{display:flex;gap:6px;align-items:center;font-size:13px}
.ik-help{margin-top:12px}
.ik-help summary{cursor:pointer;font-size:13px}
.ik-pre{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px;overflow:auto;white-space:pre;max-width:100%}
.ik-h2{margin-top:28px}
.wh-list{display:flex;flex-direction:column;gap:8px;margin:8px 0 14px}
.wh-item{border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}
.wh-item.off{opacity:.6}
.wh-main{flex:1;min-width:200px}
.wh-main .mono{word-break:break-all}
.wh-act{display:flex;gap:6px;flex-wrap:wrap}
.wh-secret{margin-top:4px}
.wh-secret code{word-break:break-all;user-select:all}

/* Log-Flut */
.con-fold{margin-left:auto;max-width:62%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:none;border:1px solid #3A3B36;color:#A8A399;border-radius:999px;padding:2px 10px;font:inherit;font-size:12px;cursor:pointer}
.con-fold[aria-pressed="false"]{border-style:dashed}
.con-fold:hover{color:#ECE8E0;border-color:#5A5B54}
.lcd-head .con-fold + .live{margin-left:8px}
.lines .rep{display:inline-block;margin-left:8px;padding:0 7px;border-radius:999px;background:#2E2F2A;color:#FFB38A;font-size:11.5px;line-height:1.5;vertical-align:1px;cursor:help;white-space:nowrap}

/* Feinschliff: scrollbare Reiter und Tabellen zeigen, dass es weitergeht */
.tabs.more-r{-webkit-mask-image:linear-gradient(to right,#000 82%,transparent);mask-image:linear-gradient(to right,#000 82%,transparent)}
.tabs.more-l{-webkit-mask-image:linear-gradient(to left,#000 82%,transparent);mask-image:linear-gradient(to left,#000 82%,transparent)}
.tabs.more-l.more-r{-webkit-mask-image:linear-gradient(to right,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(to right,transparent,#000 14%,#000 86%,transparent)}
@media (max-width:760px){
  .tbl-wrap,.mg-pane .tbl-wrap{background:
    linear-gradient(to right,var(--panel) 30%,transparent) left/36px 100% no-repeat local,
    linear-gradient(to left,var(--panel) 30%,transparent) right/36px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%,color-mix(in srgb,var(--ink) 22%,transparent),transparent) left/12px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%,color-mix(in srgb,var(--ink) 22%,transparent),transparent) right/12px 100% no-repeat scroll,
    var(--panel)}
}
.con-empty{position:absolute;left:0;right:0;top:46px;bottom:110px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:20px;font-family:var(--font-body);pointer-events:none}
.con-empty[hidden]{display:none}
.con-empty b{font-size:15px;color:#ECE8E0;font-weight:600}
.con-empty span{font-size:13px;color:#8F8A80;max-width:300px}
.con-empty button{margin-top:8px;pointer-events:auto}
/* Häkchen mit Erklärung: Text fließt als ein Absatz statt in Spalten */
.check:has(> .muted.small){display:block;padding-left:28px;text-indent:-28px;line-height:1.5}
.check:has(> .muted.small) > input{margin:0 10px 0 0;vertical-align:-4px}
.check:has(> .muted.small) > *{text-indent:0}
/* kleine Auswahllisten mitten im Text */
.check select,.tk-hang select,.tk-cond select{border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:var(--r-sm);padding:4px 8px;font-size:14px}
/* Links in Fließtext in der Akzentfarbe statt Browser-Blau */
:where(a:not([class])){color:var(--accent);text-underline-offset:2px}
:where(a:not([class])):hover{color:var(--ink)}
/* KI ohne Anbieter */
.core-card[data-state="off"] .core-state i{background:var(--muted);animation:none}
.core-card[data-state="off"] canvas,.core-card[data-state="off"] svg{opacity:.35;filter:grayscale(1)}
/* Details: Beschriftung bleibt einzeilig, lange Werte brechen rechts um */
.kv.one dt{flex-shrink:0;white-space:nowrap}
.kv.one dd{min-width:0}
.kv.one div.stack{display:block}
.kv.one .stack dd{text-align:left;margin-top:2px}

/* Handy-Widget */
.wg-grid{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:18px;align-items:start;margin:10px 0 6px}
@media (max-width:760px){.wg-grid{grid-template-columns:minmax(0,1fr)}}
.wg-card{background:#101110;color:#ECE8E0;border-radius:22px;padding:14px 16px;font-size:12.5px;line-height:1.55;box-shadow:0 10px 30px -14px rgba(0,0,0,.6);border:1px solid #2A2B28}
.wg-top{display:flex;justify-content:space-between;gap:8px;margin-bottom:6px}
.wg-top b{font-size:13px}.wg-top span{color:#8F8A80}
.wg-card ul{list-style:none;margin:0;padding:0}
.wg-card li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wg-card li.wg-aus{color:#8F8A80}.wg-card li.wg-fehler{color:#FF7A6B}
.wg-host{display:flex;gap:12px;margin-top:8px;padding-top:8px;border-top:1px solid #2A2B28;color:#A8A399}
.wg-side .btn-accent{margin-bottom:10px}
.wg-steps{padding-left:18px;margin:10px 0}
.wg-steps li{margin:3px 0}
.wg-formulas{display:flex;flex-direction:column;gap:8px;margin:8px 0}
.wg-f .nk-code code{font-size:11.5px}

/* Smart Home */
.sh-conn{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:12px 0}
@media (max-width:760px){.sh-conn{grid-template-columns:minmax(0,1fr)}}
.sh-card{border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.sh-card h3{margin:0}
.sh-form{border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;margin-top:8px}
.sh-form h4{margin:0 0 8px}

/* Sprachsteuerung */
.side-search-row{display:flex;gap:6px}
.side-search-row .side-search{flex:1;min-width:0}
.side-search-row .voice-btn{width:38px;height:38px;flex-shrink:0}
.voice{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:14px;width:min(520px,calc(100vw - 32px));padding:14px 16px;border-radius:18px;background:var(--panel);border:1px solid var(--line);box-shadow:0 18px 50px -18px rgba(0,0,0,.6)}
.voice[hidden]{display:none}
.voice-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.voice-txt span{overflow-wrap:anywhere}
#voiceHeard{font-size:15px}
#voiceAnswer{color:var(--muted)}
.voice-orb{position:relative;width:38px;height:38px;flex-shrink:0;display:grid;place-items:center}
.voice-orb i{position:absolute;inset:0;border-radius:50%;background:var(--accent);opacity:.25;transform:scale(.55)}
.voice-orb i:last-child{opacity:1;transform:scale(.42)}
.voice.on .voice-orb i:nth-child(1){animation:vpulse 1.4s ease-out infinite}
.voice.on .voice-orb i:nth-child(2){animation:vpulse 1.4s ease-out .45s infinite}
@keyframes vpulse{from{transform:scale(.45);opacity:.5}to{transform:scale(1.15);opacity:0}}
@media (prefers-reduced-motion:reduce){.voice.on .voice-orb i{animation:none}}

/* Twitch & YouTube */
.st-feed li{align-items:flex-start}
.st-feed li > span:last-child{text-align:right;max-width:45%}
#tvRewards{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:4px 0 10px}
#tvPreset{margin-top:6px;max-width:100%;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:var(--r-sm);padding:4px 8px}