/* QUIBIQ App Design System – Tokens. Hell ist Standard, dunkel über data-theme="dark". Dichte über data-density. */
:root,[data-theme="light"]{
  color-scheme:light;
  --background:#f2f4f7;--foreground:#002c5c;--card:#ffffff;--popover:#ffffff;
  --muted:#f2f4f7;--muted-foreground:#46607d;--subtle-foreground:#5c7085;
  --accent:#e4ecf4;--accent-foreground:#002c5c;
  --logo:#002c5c;--primary:#002c5c;--primary-hover:#1b4f8a;--primary-foreground:#ffffff;
  --cta:#e2df00;--cta-hover:#c4c100;--cta-foreground:#002c5c;
  --destructive:#d5003c;--destructive-foreground:#ffffff;
  --border:#d6dce6;--input:#768aa5;--ring:#002c5c;--link:#00629e;
  --success:#2f6b4a;--success-soft:#e6f2ea;--warning:#9a4d00;--warning-soft:#f8ece0;
  --danger:#d5003c;--danger-soft:#fce8ed;--info:#00629e;--info-soft:#e0eff8;
  --flow:#892282;--flow-soft:#f6e3f4;--neutral:#46607d;--neutral-soft:#eff2f7;
  --head:#002c5c;--head-foreground:#ffffff;--head-muted:#c9d3df;--head-hover:#011e3f;--head-border:#011e3f;
  --nav:#ffffff;--nav-foreground:#002c5c;--nav-muted:#5c7085;--nav-hover:#f2f4f7;--nav-active:#f2f4f7;--nav-active-foreground:#002c5c;--nav-border:#d6dce6;
  --marker:#e2df00;--selected:#f2f4f7;--selected-border:#002c5c;--highlight:rgb(226 223 0 / .2);
  --shadow-pop:0 8px 24px rgb(1 30 63 / .18);--scrim:rgb(1 30 63 / .45);
  --chart-1:#1e5596;--chart-2:#8a8800;--chart-3:#b0456a;--chart-4:#6b3d1f;--chart-5:#3f9090;
  --code-tag:#0a5aa8;--code-attr:#892282;--code-val:#2f6b4a;
  --paper:#f7f7f8;--paper-space:#ffffff;--paper-line:#7a8ea6;
}
:host([data-theme="dark"]),[data-theme="dark"]{
  color-scheme:dark;
  --background:#011e3f;--foreground:#eff2f7;--card:#002c5c;--popover:#0a3a6d;
  --muted:#0a3a6d;--muted-foreground:#c9d3df;--subtle-foreground:#94a8bf;
  --accent:#0b3f74;--accent-foreground:#eff2f7;
  --logo:#ffffff;--primary:#2a6fc0;--primary-hover:#174c86;--primary-foreground:#ffffff;
  --cta:#e2df00;--cta-hover:#c4c100;--cta-foreground:#002c5c;
  --destructive:#ff8aa3;--destructive-foreground:#011e3f;
  --border:#10406f;--input:#6b9ace;--ring:#e2df00;--link:#8dbdf0;
  --success:#7cc79a;--success-soft:#123a26;--warning:#f6a24e;--warning-soft:#3d2711;
  --danger:#ff8aa3;--danger-soft:#40141f;--info:#56bdff;--info-soft:#0a3550;
  --flow:#d78bd0;--flow-soft:#3a1638;--neutral:#c9d3df;--neutral-soft:#0a3560;
  --head:#011e3f;--head-foreground:#eff2f7;--head-muted:#c9d3df;--head-hover:#0a3a6d;--head-border:#10406f;
  --nav:#011e3f;--nav-foreground:#eff2f7;--nav-muted:#94a8bf;--nav-hover:#0a3a6d;--nav-active:#0a3a6d;--nav-active-foreground:#ffffff;--nav-border:#10406f;
  --marker:#e2df00;--selected:#0a3a6d;--selected-border:#8dbdf0;--highlight:rgb(226 223 0 / .16);
  --shadow-pop:0 8px 24px rgb(0 0 0 / .55);--scrim:rgb(0 0 0 / .55);
  --chart-1:#6fa8e8;--chart-2:#e2df00;--chart-3:#f08ab0;--chart-4:#cd8650;--chart-5:#8fe3e3;
  --code-tag:#8cc4ff;--code-attr:#e5a3df;--code-val:#8fd4a9;
  --paper:#0a3560;--paper-space:#002c5c;--paper-line:#8aa6c8;
}
[data-density="compact"]{--row:32px;--ctl:32px;--cell:13px;--base:14px;--pad:8px}
[data-density="standard"]{--row:36px;--ctl:36px;--cell:13px;--base:14px;--pad:8px}
[data-density="comfortable"]{--row:44px;--ctl:44px;--cell:14px;--base:15px;--pad:12px}
/* Gangart Status (Wand, Präsentation): Maße in px bei 1920 px Breite; status.css skaliert sie mit der Breite (--u). */
[data-gangart="status"]{--status-pad-y:64;--status-pad-x:96;--status-gap:56;--status-kpi-gap:56;--status-text:24;--status-label:22;--status-title:84;--status-live:28;--status-dot:16;--status-kpi:112;--status-kpi-unit:40;--status-accent:8;--status-card-pad:36;--status-card-gap:20;--status-card-title:34;--status-card-kpi:64;--status-grid-gap:32;--status-bar:14}

/* QUIBIQ App Design System – Muster-CSS aus der App-Vorlage (Version 12). Wurzel: .qb-app (Container "app"). */
.qb-app{container:app/inline-size;background:var(--background);color:var(--foreground);font:400 var(--base,14px)/1.45 "Titillium Web",system-ui,sans-serif;-webkit-font-smoothing:antialiased;position:relative}

*{box-sizing:border-box;border-radius:0}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--background);color:var(--foreground);font:400 14px/1.45 "Titillium Web",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p{margin:0}
h1,h2,h3{font-weight:700;text-wrap:balance}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--link)}
:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
::selection{background:var(--cta);color:var(--cta-foreground)}
.mono{font-family:ui-monospace,"Cascadia Code",Menlo,Consolas,monospace;font-size:.93em}
kbd{font:400 12px/1.5 ui-monospace,Menlo,Consolas,monospace;border:1px solid var(--border);padding:0 6px;background:var(--muted);color:var(--foreground)}

/* Dokumentrahmen */
section>h2{font-size:21px;line-height:28px;margin-bottom:4px}
section>.lead{color:var(--muted-foreground);max-width:75ch;margin-bottom:12px}
h3{font-size:16px;line-height:22px;margin:16px 0 8px}
table.cmp{min-width:1240px}
table.cmp td{width:17%}table.cmp td.k{width:9%;white-space:normal}table.cmp td.v{width:23%;background:var(--muted)}
.sw{display:inline-block;width:14px;height:14px;border:1px solid var(--input);vertical-align:-2px;margin-right:6px}
.ok{color:var(--success);font-weight:600}.no{color:var(--danger);font-weight:600}

/* Bedienelemente der Vorlage */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:var(--ctl,36px);padding:0 12px;border:1px solid var(--input);background:var(--card);color:var(--foreground);font-size:14px;font-weight:600;white-space:nowrap;transition:background-color .12s}
.btn:hover{background:var(--muted)}
.btn.pri{background:var(--primary);border-color:var(--primary);color:var(--primary-foreground)}
.btn.pri:hover{background:var(--primary-hover);border-color:var(--primary-hover)}
.btn.cta{background:var(--cta);border-color:var(--cta);color:var(--cta-foreground);font-weight:700}
.btn.cta:hover{background:var(--cta-hover);border-color:var(--cta-hover)}
.btn.dng{background:var(--destructive);border-color:var(--destructive);color:var(--destructive-foreground)}
.btn.gh{background:transparent;border-color:transparent}
.btn.gh:hover{background:var(--muted)}
.btn svg,.ic{width:16px;height:16px;flex:none}
.seg{display:inline-flex;flex-wrap:wrap;max-width:100%;border:1px solid var(--input);background:var(--card)}
.a-main:has(.pnl) .lo,.a-main:has(.pnl) .tf .keys{display:none}
.pnl-h [data-back]{display:none}
.seg button{height:32px;padding:0 10px;border:0;background:transparent;color:var(--foreground);font-weight:600;font-size:13px}
.seg button+button{border-left:1px solid var(--input)}
.seg button[aria-pressed="true"]{background:var(--primary);color:var(--primary-foreground)}

/* Beispiel-App in Rahmen */
.app{display:grid;grid-template-rows:48px minmax(0,1fr) auto;height:100%}
.a-head{background:var(--head);color:var(--head-foreground);border-bottom:1px solid var(--head-border);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px) minmax(0,1fr);align-items:center;gap:16px;padding:0 12px;--ring:#e2df00}
.a-head .hl,.a-head .hr{display:flex;align-items:center;gap:10px;min-width:0}.a-head .hr{justify-content:flex-end;gap:6px}
.a-head .pn{font-weight:600;white-space:nowrap}
.a-head .sr{width:100%;margin:0;height:32px;display:flex;align-items:center;gap:8px;padding:0 10px;border:1px solid rgb(255 255 255 / .35);background:transparent;color:var(--head-muted);font-size:13px;min-width:0}
.a-head .sr kbd{margin-left:auto;background:transparent;border-color:rgb(255 255 255 / .4);color:var(--head-muted)}
.a-head .ib{width:32px;height:32px;display:grid;place-items:center;background:transparent;border:0;color:var(--head-foreground);position:relative}
.a-head .ib:hover{background:var(--head-hover)}
.a-head .ten{font-size:13px;color:var(--head-muted);white-space:nowrap}
.a-body{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:0}
.a-nav{background:var(--nav);border-right:1px solid var(--nav-border);padding:8px;overflow:auto;display:flex;flex-direction:column;gap:1px}
.a-nav small{font-size:12px;font-weight:600;color:var(--nav-muted);padding:10px 8px 3px}
.a-nav button{display:flex;align-items:center;gap:8px;height:36px;padding:0 8px;border:0;background:transparent;color:var(--nav-foreground);text-align:left;width:100%}
.a-nav button:hover{background:var(--nav-hover)}
.a-nav button[aria-current]{background:var(--nav-active);color:var(--nav-active-foreground);font-weight:600;box-shadow:inset 3px 0 0 var(--marker)}
.a-nav .ct{margin-left:auto;font-size:12px;font-weight:600}
.a-main{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;min-height:0;position:relative}
.a-page{min-width:0;overflow:auto;padding:16px 20px;display:flex;flex-direction:column;gap:12px}
.a-tabs{display:none;background:var(--nav);border-top:1px solid var(--nav-border);height:56px}
.a-tabs button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:0;background:transparent;color:var(--nav-foreground);font-size:12px;position:relative}
.a-tabs button[aria-current]{font-weight:700;color:var(--nav-active-foreground)}
.a-tabs button[aria-current]::before{content:'';position:absolute;top:0;left:24%;right:24%;height:3px;background:var(--marker)}
.pg-h{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px 12px}
.pg-h h2{font-size:21px;line-height:28px}
.pg-h p{color:var(--muted-foreground);font-size:13px}
.pg-h .act{margin-left:auto;display:flex;gap:8px}
.cnts{display:flex;gap:6px;overflow-x:auto;padding:2px}
.cnt{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border:1px solid var(--border);background:var(--card);color:var(--foreground);font-size:13px;white-space:nowrap}
.cnt b{font-weight:700}
.cnt:hover{border-color:var(--input)}
.cnt[aria-pressed="true"]{border-color:var(--primary);background:var(--primary);color:var(--primary-foreground);font-weight:600}
.cnt[aria-pressed="true"] svg{color:currentColor}
.flt{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}
.inp{height:var(--ctl);width:100%;border:1px solid var(--input);background:var(--card);padding:0 10px;font-size:var(--base);color:var(--foreground)}
.inp::placeholder{color:var(--subtle-foreground)}
.inp[aria-invalid="true"]{border-color:var(--danger);box-shadow:inset 0 0 0 1px var(--danger)}
textarea.inp{height:auto;padding:8px 10px;line-height:1.4}
.flt .q{width:260px;position:relative}
.flt .q kbd{position:absolute;right:8px;top:50%;transform:translateY(-50%)}
.chip{display:inline-flex;align-items:center;gap:4px;min-height:28px;padding:0 2px 0 8px;background:var(--accent);color:var(--accent-foreground);font-size:13px;border:0;white-space:nowrap}
.chip svg{width:14px;height:14px}
.chip span.x{display:grid;place-items:center;width:24px;height:24px}
.lnk{background:none;border:0;padding:0 4px;color:var(--link);text-decoration:underline;font-size:13px}
.stand{margin-left:auto;font-size:13px;color:var(--subtle-foreground);white-space:nowrap}
.tbl{background:var(--card);border:1px solid var(--border);display:flex;flex-direction:column;min-height:0;flex:1}
.tbl-s{overflow:auto;flex:1;min-height:0}
table.d{width:100%;border-collapse:collapse;font-size:var(--cell)}
table.d th{position:sticky;top:0;z-index:1;background:var(--card);height:32px;padding:0 10px;text-align:left;font-size:12px;font-weight:600;color:var(--muted-foreground);border-bottom:1px solid var(--input);white-space:nowrap}
table.d td{height:var(--row);padding:0 10px;border-bottom:1px solid var(--border);white-space:nowrap;max-width:240px;overflow:hidden;text-overflow:ellipsis}
table.d tbody tr{cursor:pointer}
table.d tbody tr:hover{background:var(--muted)}
table.d tbody tr:hover{background:color-mix(in srgb,var(--muted) 55%,var(--card))}
table.d tr[aria-selected="true"]{background:var(--selected);--subtle-foreground:var(--muted-foreground)}
table.d tr[aria-selected="true"] td{box-shadow:inset 0 1px 0 var(--selected-border),inset 0 -1px 0 var(--selected-border)}
table.d tr[aria-selected="true"] td:first-child{box-shadow:inset 1px 1px 0 var(--selected-border),inset 0 -1px 0 var(--selected-border)}
table.d tr[aria-selected="true"] td:last-child{box-shadow:inset -1px 1px 0 var(--selected-border),inset 0 -1px 0 var(--selected-border)}
table.d .num{text-align:right;font-variant-numeric:tabular-nums}
table.d td.sub{color:var(--subtle-foreground)}
.cb{width:16px;height:16px;accent-color:var(--primary);display:block;margin:0}
.tf{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;min-height:40px;padding:4px 10px;border-top:1px solid var(--input);font-size:13px;color:var(--muted-foreground)}
.tf .sp{flex:1}
.tf .keys{display:flex;gap:10px;font-size:12px;align-items:center;white-space:nowrap}
.bulk{display:flex;align-items:center;gap:8px;padding:6px 10px;border-top:1px solid var(--input);background:var(--accent);color:var(--accent-foreground);font-size:13px;font-weight:600}
.cards{display:none}
.card{display:block;width:100%;text-align:left;background:var(--card);border:1px solid var(--border);border-width:0 0 1px;padding:10px 12px;color:var(--foreground)}
.card .r1{display:flex;align-items:center;gap:8px;justify-content:space-between}
.card .r2{font-weight:600;margin-top:2px}
.card .r3{font-size:13px;color:var(--muted-foreground)}
.bdg{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 6px;font-size:12px;font-weight:600;white-space:nowrap}
.bdg svg{width:13px;height:13px}
.success{background:var(--success-soft);color:var(--success)}.warning{background:var(--warning-soft);color:var(--warning)}
.danger{background:var(--danger-soft);color:var(--danger)}.info{background:var(--info-soft);color:var(--info)}
.flow{background:var(--flow-soft);color:var(--flow)}.neutral{background:var(--neutral-soft);color:var(--neutral)}
.pnl{width:420px;background:var(--card);border-left:1px solid var(--input);display:flex;flex-direction:column;min-height:0}
.pnl-f{flex:none}.pnl-h{display:flex;align-items:center;gap:6px;min-height:48px;padding:8px 8px 8px 16px;border-bottom:1px solid var(--border)}
.pnl-h h3{margin:0;font-size:16px;line-height:22px}
.pnl-h .sp{flex:1}
.pnl-b{flex:1;overflow:auto;padding:12px 16px;display:flex;flex-direction:column;gap:12px;min-height:0}
.pnl-f{display:flex;gap:8px;padding:8px 16px;border-top:1px solid var(--input);background:var(--card)}
dl.m{display:grid;grid-template-columns:110px minmax(0,1fr);gap:4px 12px;margin:0;font-size:13px}
dl.m dt{color:var(--muted-foreground)}dl.m dd{margin:0;overflow-wrap:anywhere}
.sect{font-size:12px;font-weight:600;color:var(--muted-foreground);margin-bottom:6px}
.steps{list-style:none;margin:0;padding:0;font-size:13px}
.steps li{display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:8px;padding:5px 0;border-bottom:1px solid var(--border);align-items:start}
.steps li:last-child{border:0}
.steps svg{width:16px;height:16px;margin-top:2px}
.steps .t{color:var(--subtle-foreground);font-variant-numeric:tabular-nums}
.c-success{color:var(--success)}.c-warning{color:var(--warning)}.c-danger{color:var(--danger)}.c-info{color:var(--info)}.c-neutral{color:var(--subtle-foreground)}
.msg{display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:8px;padding:8px 12px;font-size:13px;border-left:3px solid currentColor;align-items:start}
.msg svg{width:16px;height:16px;margin-top:2px}
.msg b{display:block;font-weight:700}
.msg p{color:var(--foreground)}
.msg .btn{--ctl:30px;font-size:13px}
.frm{background:var(--card);border:1px solid var(--border);padding:16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;max-width:860px}
.frm h3{grid-column:1/-1;margin:4px 0 -4px;font-size:14px;line-height:20px}
.frm .w{grid-column:1/-1}
.fld label,.fld .lb{display:block;font-size:13px;font-weight:600;margin-bottom:3px}
.fld .h{font-size:12px;color:var(--muted-foreground);margin-top:3px}
.fld .e{font-size:12px;font-weight:600;color:var(--danger);margin-top:3px;display:flex;gap:4px;align-items:center}
.fld .e svg{width:13px;height:13px}
.req{color:var(--danger);margin-left:2px}
.savebar{display:flex;align-items:center;gap:8px;max-width:860px;padding:8px 0}
.savebar .st{font-size:13px;color:var(--muted-foreground)}
.savebar .sp{flex:1}
.rd{display:flex;gap:8px;align-items:flex-start;padding:10px;border:1px solid var(--input);background:var(--card);cursor:pointer}
.rd:has(input:checked){border-color:var(--selected-border);box-shadow:inset 0 0 0 1px var(--selected-border);background:var(--selected)}
.rd span b{display:block;font-weight:600}.rd span small{font-size:13px;color:var(--muted-foreground)}
.guide{max-width:620px;margin:0 auto;width:100%;display:flex;flex-direction:column;gap:16px}
.stp{display:flex;align-items:center;justify-content:center;gap:6px;list-style:none;margin:0;padding:0}
.stp li{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted-foreground)}
.stp li+li::before{content:"";width:20px;height:1px;background:var(--input)}
.stp li[aria-current]{color:var(--foreground);font-weight:700}
.hex{width:26px;height:30px;display:grid;place-items:center;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:var(--neutral-soft);color:var(--foreground);font-weight:700;font-size:13px;flex:none}
.hex.on{background:var(--primary);color:var(--primary-foreground)}
.hex.dn{background:var(--success-soft);color:var(--success)}
.hex svg{width:14px;height:14px}
.hbar{width:48px;height:3px;background:var(--cta);margin:-8px 0 0}
.gsec{background:var(--card);border:1px solid var(--border);padding:20px;display:flex;flex-direction:column;gap:14px}
.gsec h3{margin:0;font-size:18px;line-height:24px}
.empty{border:1px dashed var(--input);padding:28px 16px;display:flex;flex-direction:column;gap:6px;align-items:center;text-align:center}
.empty .hex{width:44px;height:50px}.empty .hex svg{width:20px;height:20px}
.empty h4{font-weight:700;font-size:14px}.empty p{font-size:13px;color:var(--muted-foreground);max-width:36ch}
.spec{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:12px}
.spb{background:var(--card);border:1px solid var(--border);padding:12px;display:flex;flex-direction:column;gap:8px;min-width:0}
.bdgs{display:flex;flex-wrap:wrap;gap:6px}
.skel{height:12px;background:var(--muted);animation:p 1.4s ease-in-out infinite}
@keyframes p{50%{opacity:.5}}
.scrim{position:absolute;inset:0;background:var(--scrim);z-index:5}
.dlg{position:absolute;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%);width:min(360px,calc(100% - 32px));background:var(--popover);border:1px solid var(--input);box-shadow:var(--shadow-pop);padding:16px;display:flex;flex-direction:column;gap:10px}
.dlg h4{font-weight:700;font-size:16px}.dlg p{font-size:13px;color:var(--muted-foreground)}
.dlg .a{display:flex;justify-content:flex-end;gap:8px}
.toast{background:var(--popover);border:1px solid var(--input);box-shadow:var(--shadow-pop);padding:8px 12px;font-size:13px;display:flex;gap:8px;align-items:center}
.toast svg{width:16px;height:16px}

.sro{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.btn:disabled{opacity:.45;cursor:default}
.ic-b{width:var(--ctl,32px);--ctl:32px;padding:0}
.app{position:relative}
.wm{font-family:"Anomoly","Titillium Web",sans-serif;font-style:italic;font-weight:900;text-transform:uppercase;letter-spacing:.01em;font-size:17px;line-height:1;white-space:nowrap;padding:2px 2px 3px 0;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 20' preserveAspectRatio='none'%3E%3Cpath fill-rule='evenodd' d='M0 0H64V20H0Z M2 5.6 Q26 8.6 64 10.4 L64 10.9 Q26 11.4 2 9.4 Z'/%3E%3C/svg%3E"),linear-gradient(#000,#000);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 20' preserveAspectRatio='none'%3E%3Cpath fill-rule='evenodd' d='M0 0H64V20H0Z M2 5.6 Q26 8.6 64 10.4 L64 10.9 Q26 11.4 2 9.4 Z'/%3E%3C/svg%3E"),linear-gradient(#000,#000);-webkit-mask-size:64px 100%,100% 100%;mask-size:64px 100%,100% 100%;-webkit-mask-position:0 0,64px 0;mask-position:0 0,64px 0;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.a-head .sr .scope{font-size:12px;font-weight:600;color:var(--head-foreground);border-right:1px solid rgb(255 255 255 / .35);padding-right:8px;white-space:nowrap}
.a-head .sr .ph{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.a-head .hsp{flex:1}
.a-head .sri{display:none}
.a-head .dot{position:absolute;top:2px;right:1px;min-width:15px;height:15px;padding:0 3px;border-radius:8px;background:var(--cta);color:var(--cta-foreground);font-size:10px;font-weight:700;line-height:15px;text-align:center}
.a-head .me{display:flex;align-items:center;gap:8px;background:transparent;border:0;color:var(--head-foreground);padding:2px 2px 2px 8px;height:36px}
.a-head .me:hover{background:var(--head-hover)}
.av{width:28px;height:28px;display:grid;place-items:center;background:var(--cta);color:var(--cta-foreground);font-weight:700;font-size:12px;border-radius:50%;flex:none}
.av.big{width:36px;height:36px;font-size:13px}
.ltabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--border);padding:0 4px;flex:none}
.ltabs::-webkit-scrollbar{display:none}
.ltabs button{position:relative;display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 10px;border:0;background:transparent;color:var(--muted-foreground);font-size:13px;white-space:nowrap;flex:none}
.ltabs button b{font-weight:600}
.ltabs button:hover{color:var(--foreground);background:var(--muted)}
.ltabs button[aria-selected="true"],.ltabs button[aria-pressed="true"]{color:var(--foreground);font-weight:700}
.ltabs button[aria-selected="true"]::after,.ltabs button[aria-pressed="true"]::after{content:'';position:absolute;left:8px;right:8px;bottom:0;height:3px;background:var(--marker)}
.ltabs .ltadd{width:36px;justify-content:center;padding:0}
.tb{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;min-height:44px;padding:4px 8px;border-bottom:1px solid var(--input);flex:none}
.tb .btn{--ctl:32px;font-size:13px}
.tb .sp{flex:1}
.tb .stand{margin:0}
.fb .nb{min-width:18px;height:18px;padding:0 4px;display:grid;place-items:center;background:var(--primary);color:var(--primary-foreground);font-size:11px;font-weight:700}
.sumb{display:inline-flex;align-items:center;gap:2px;max-width:280px;height:32px;border:0;background:transparent;color:var(--muted-foreground);font-size:13px;padding:0 4px}
.sumb span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sumb:hover{color:var(--foreground);text-decoration:underline}
.sumb[aria-expanded="true"] svg{transform:rotate(180deg)}
.pgn{display:inline-flex;align-items:center;gap:2px;font-size:13px;color:var(--muted-foreground);white-space:nowrap}
.pgn>span{margin-right:4px}
.pgs{gap:2px!important;padding:0 6px!important}
.chips{display:flex;flex-wrap:wrap;gap:6px;padding:6px 8px;border-bottom:1px solid var(--border);flex:none}
.fs{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:2px 12px}
.fs legend{font-size:13px;font-weight:600;margin-bottom:4px;padding:0}
.ck{display:flex;gap:8px;align-items:center;font-size:13px;min-height:30px}
.pop{position:absolute;z-index:8;top:52px;right:8px;width:340px;max-width:calc(100% - 16px);background:var(--popover);color:var(--foreground);border:1px solid var(--input);box-shadow:var(--shadow-pop);display:flex;flex-direction:column;font-size:14px}
.pop.p-search{left:50%;right:auto;width:520px;transform:translateX(-50%)}
.pop.st,.drw.st{position:static;width:auto;max-width:none;box-shadow:none}
.drw.st{border:1px solid var(--border);height:520px}
.stage{background:var(--background);border:1px solid var(--border);padding:10px}
.sq{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 12px;border-bottom:1px solid var(--input)}
.sq .inp{border:0;height:32px;padding:0;background:transparent;flex:1}
.ssc{display:flex;gap:2px;padding:4px 8px 0;border-bottom:1px solid var(--border)}
.ssc button{position:relative;height:34px;padding:0 10px;border:0;background:transparent;color:var(--muted-foreground);font-size:13px}
.ssc button[aria-pressed="true"]{color:var(--foreground);font-weight:700}
.ssc button[aria-pressed="true"]::after{content:'';position:absolute;left:8px;right:8px;bottom:0;height:3px;background:var(--marker)}
.shint{font-size:12px;color:var(--muted-foreground);padding:8px 12px;margin:0}
.sgrp{font-size:12px;font-weight:600;color:var(--muted-foreground);padding:6px 12px 2px}
.pop ul[role=listbox]{list-style:none;margin:0;padding:0 4px 4px}
.opt{display:flex;align-items:center;gap:10px;padding:6px 8px;font-size:13px;cursor:pointer}
.opt .ot{flex:1;min-width:0}.opt b{font-weight:600;display:block}.opt small{display:block;font-size:12px;color:var(--muted-foreground)}
.opt:hover{background:var(--muted)}
.opt[aria-selected="true"],.opt[aria-selected="true"] small{background:var(--cta);color:var(--cta-foreground)}
.ent{font:12px/1.5 ui-monospace,Menlo,Consolas,monospace;border:1px solid currentColor;padding:0 5px}
.mh{display:flex;align-items:center;gap:10px;padding:12px;border-bottom:1px solid var(--border)}
.mh b{display:block;font-weight:700}.mh small{display:block;font-size:12px;color:var(--muted-foreground)}
.mrow{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;padding:6px 12px;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--foreground);text-align:left;font-size:14px}
.mrow:hover{background:var(--muted)}
.mrow small{display:block;font-size:12px;color:var(--muted-foreground)}.mrow b{font-weight:600}
.mrow .mr{margin-left:auto;display:inline-flex;align-items:center;gap:2px;font-size:13px;color:var(--link)}
.mgrp{padding:8px 12px;border-bottom:1px solid var(--border);display:grid;grid-template-columns:auto 1fr;gap:6px 12px;align-items:center}
.ml{font-size:12px;font-weight:600;color:var(--muted-foreground)}
.seg.sm button{height:28px;font-size:12px;padding:0 8px}
.mf{padding:10px 12px;display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--muted-foreground);background:var(--muted)}
.mfv{display:flex;align-items:center;gap:8px;color:var(--foreground);font-weight:600;font-size:13px}
.tl{list-style:none;margin:0;padding:4px}
.topt{display:flex;align-items:center;gap:8px;padding:8px;font-size:13px;cursor:pointer}
.topt span{flex:1}.topt b{display:block;font-weight:600}.topt small{display:block;color:var(--muted-foreground);font-size:12px}
.topt:hover{background:var(--muted)}
.topt[aria-current]{background:var(--selected);box-shadow:inset 0 0 0 1px var(--selected-border)}
.drw{position:absolute;z-index:7;top:48px;right:0;bottom:0;width:400px;background:var(--card);border-left:1px solid var(--input);box-shadow:var(--shadow-pop);display:flex;flex-direction:column;min-height:0}
.drw .ltabs{padding:0 8px}
.note{display:grid;grid-template-columns:18px minmax(0,1fr);gap:8px;padding-bottom:10px;border-bottom:1px solid var(--border);font-size:13px}
.note svg{width:16px;height:16px;margin-top:2px}
.note b{font-weight:600}.note p{color:var(--muted-foreground)}
.na{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;margin-top:4px}
.na .t{font-size:12px;color:var(--subtle-foreground)}.na .lnk{padding:0;font-size:12px}
.hl{margin:0;padding-left:18px;font-size:13px}.hl li{margin:4px 0}
.kh{width:24px;height:27px;display:grid;place-items:center;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:var(--accent);color:var(--accent-foreground);flex:none}
.kh svg{width:14px;height:14px}
.aitag{font-size:11px;font-weight:700;padding:0 5px;background:var(--neutral-soft);color:var(--neutral)}
.ctx{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted-foreground);background:var(--muted);padding:4px 8px}
.ctx b{color:var(--foreground)}.ctx .lnk{font-size:12px;margin-left:auto}
.bub{font-size:13px;padding:8px 10px;max-width:92%}
.bub.me{align-self:flex-end;background:var(--accent);color:var(--accent-foreground)}
.bub.ai{background:var(--muted)}
.bub.ai p+p{margin-top:6px}.bub .src{font-size:12px;color:var(--muted-foreground)}
.prop{border:1px solid var(--input);padding:10px;display:flex;flex-direction:column;gap:6px;font-size:13px}
.prop .a{display:flex;gap:8px}.prop small{font-size:12px;color:var(--muted-foreground)}
.sugg{display:flex;flex-wrap:wrap;gap:6px}.sugg .chip{padding:0 8px}
.drw .pnl-f{align-items:center}.drw .pnl-f .ic-b{flex:none!important}.mgrp .seg{justify-self:start}.drw .pnl-f .inp{flex:1}

/* Quno: bewusst weicher als die App, nur hier Radius */
.qn{background:var(--card)}
.qn .pnl-h{gap:10px}
.qav{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:var(--cta);flex:none;box-shadow:0 0 0 2px var(--card),0 0 0 3px var(--cta)}
.qav svg{width:16px;height:16px}
.qt{display:flex;flex-direction:column;line-height:1.2}.qt h3{display:flex;align-items:center;gap:6px}.qt small{font-size:12px;color:var(--muted-foreground)}
.qn .aitag{border-radius:4px}
.qn .pnl-b{gap:12px;background:linear-gradient(var(--background),var(--card) 140px)}
.qday{text-align:center}.qday span{display:inline-block;font-size:11px;font-weight:600;color:var(--muted-foreground);background:var(--card);border:1px solid var(--border);border-radius:999px;padding:1px 10px}
.qctx{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted-foreground);background:var(--card);border:1px solid var(--border);border-radius:10px;padding:5px 10px}
.qctx b{color:var(--foreground)}.qctx .lnk{font-size:12px;margin-left:auto}.qctx svg{width:14px;height:14px}
.qm{display:flex;gap:8px;align-items:flex-end;max-width:94%}
.qm time{display:block;font-size:11px;color:var(--muted-foreground);margin-top:3px;padding:0 6px}
.qm .qav{width:26px;height:26px;box-shadow:none}.qm .qav svg{width:13px;height:13px}
.qm .bub{font-size:13.5px;line-height:1.5;padding:9px 13px;border-radius:16px}
.qm.me{align-self:flex-end;flex-direction:column;align-items:flex-end}
.qm.me .bub{background:var(--primary);color:var(--primary-foreground);border-bottom-right-radius:5px}
.qm.ai .bub{background:var(--muted);color:var(--foreground);border-bottom-left-radius:5px}
.qm.ai .bub p+p{margin-top:6px}
.qrefs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.qref{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--foreground);background:var(--card);border:1px solid var(--border);border-radius:999px;padding:2px 10px 2px 8px;text-decoration:none}
.qref:hover{border-color:var(--input);background:var(--accent)}.qref svg{width:13px;height:13px}
.qprop{display:flex;flex-direction:column;gap:6px;background:var(--card)!important;border:1px solid var(--border)}
.qprop small{font-size:12px;color:var(--muted-foreground)}
.qn .btn{border-radius:999px;padding:0 14px}
.qprop .a{display:flex;gap:8px}
.qtyp{display:flex;gap:4px;padding:12px 14px!important}
.qtyp i{width:6px;height:6px;border-radius:50%;background:var(--muted-foreground);animation:qdot 1.2s infinite ease-in-out}
.qtyp i:nth-child(2){animation-delay:.15s}.qtyp i:nth-child(3){animation-delay:.3s}
@keyframes qdot{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){.qtyp i{animation:none;opacity:.6}}
.qsugg{display:flex;flex-wrap:wrap;gap:6px;padding:8px 16px 0}
.qsugg button{font:inherit;font-size:12.5px;color:var(--foreground);background:var(--card);border:1px solid var(--input);border-radius:999px;padding:4px 12px;cursor:pointer}
.qsugg button:hover{background:var(--accent);border-color:var(--primary)}
.qin{display:flex;align-items:center;gap:6px;margin:10px 16px 6px;border:1px solid var(--input);border-radius:999px;background:var(--card);padding:3px 3px 3px 14px}
.qin:focus-within{outline:2px solid var(--ring);outline-offset:1px}
.qin input{flex:1;min-width:0;border:0;background:transparent;color:var(--foreground);font:inherit;font-size:13.5px;height:32px;outline:0}
.qin input::placeholder{color:var(--muted-foreground)}
.qsend{width:32px;height:32px;border-radius:50%;border:0;display:grid;place-items:center;background:var(--primary);color:var(--primary-foreground);cursor:pointer;flex:none}
.qsend:hover{background:var(--primary-hover)}.qsend svg{width:15px;height:15px}
.aidis{font-size:12px;color:var(--muted-foreground);padding:0 16px 8px;margin:0}
.lbr{display:flex;align-items:center;gap:2px;margin-bottom:3px}.lbr label{margin:0!important}
.hi{width:24px;height:24px;display:grid;place-items:center;border:0;background:transparent;color:var(--muted-foreground);padding:0;flex:none}
.hi svg{width:15px;height:15px}.hi:hover{color:var(--foreground)}
.fld{position:relative}
.tip{position:absolute;z-index:3;top:28px;left:0;width:290px;background:var(--popover);border:1px solid var(--input);box-shadow:var(--shadow-pop);padding:8px 10px;font-size:13px}
.bc{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted-foreground)}
.bc .lnk{padding:0}.bc [aria-current]{font-weight:600;color:var(--foreground)}
.fpg{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:12px;align-items:start}
.fpc{display:flex;flex-direction:column;gap:12px;min-width:0}
.pmeta{font-weight:400;color:var(--subtle-foreground);margin-left:6px}
table.st td{max-width:none}
pre.code{margin:0;overflow:auto;font:12.5px/1.6 ui-monospace,Menlo,Consolas,monospace;background:var(--muted);padding:8px 12px;white-space:pre}
.ln{display:inline-block;width:2.4em;color:var(--subtle-foreground);user-select:none}
.dg{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}
.s3{grid-column:span 3}.s4{grid-column:span 4}.s6{grid-column:span 6}.s8{grid-column:span 8}
.wg{background:var(--card);border:1px solid var(--border);display:flex;flex-direction:column;min-width:0}
.dg.ed .wg{outline:1px dashed var(--input);outline-offset:-1px}
.wg-h{display:flex;align-items:center;gap:6px;min-height:40px;padding:4px 8px 4px 12px;border-bottom:1px solid var(--border)}
.wg-h h3{margin:0;font-size:13px;line-height:18px;font-weight:700}
.wg-h .sp{flex:1}.wg-h .lnk{font-size:12px}
.wg-b{padding:10px 12px;flex:1}
.drag{color:var(--subtle-foreground);cursor:grab;display:grid}
.kpi{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;border:0;background:transparent;padding:0;text-align:left;color:var(--foreground)}
.kpi .ic{width:18px;height:18px}
.kpi .kv{font-size:28px;line-height:32px;font-weight:700}
.kpi .ks{font-size:12px;color:var(--muted-foreground)}
.kpi:hover .kv{text-decoration:underline}
.ch{width:100%;height:140px;display:block}
.lg{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--muted-foreground);margin-top:6px}
.lg i{display:inline-block;width:10px;height:10px;margin-right:4px;vertical-align:-1px}
.lg .t{margin-left:auto}
.wl{list-style:none;margin:0;padding:0}
.wr{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;width:100%;padding:7px 4px;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--foreground);font-size:13px;text-align:left}
.wr span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wl li:last-child .wr{border-bottom:0}
button.wr:hover{background:var(--muted)}
.wr .t{color:var(--subtle-foreground)}
.wadd{grid-column:1/-1;height:56px;border:1px dashed var(--input);background:transparent;color:var(--muted-foreground);display:flex;align-items:center;justify-content:center;gap:6px;font-weight:600}
.dsel{border:0;background:transparent;color:var(--foreground);font-weight:600;padding:0;display:inline-flex;align-items:center;gap:2px;font-size:13px}
@container app (min-width:768px) and (max-width:1279px){
  .s3{grid-column:span 6}.s4,.s8{grid-column:span 12}
  .tb .stand{display:none}
}
@container app (max-width:767px){
  .a-head .hd,.a-head .sr{display:none}
  .a-head .sri{display:grid}
  .a-head{grid-template-columns:minmax(0,1fr) auto;gap:8px}.a-head .wm{font-size:15px}
  .drw{left:0;width:auto;bottom:56px;border:0}
  .pop.p-search{left:8px;right:8px;width:auto;transform:none}
  .tb .stand,.tb .sumb,.tb .pgs{display:none}
  .tb{padding:4px 12px}
  .ltabs{padding:0 8px}
  .fpg{grid-template-columns:minmax(0,1fr)}
  .s4,.s6,.s8{grid-column:span 12}.s3{grid-column:span 6}
  .kpi .kv{font-size:24px;line-height:28px}
  .tip{width:min(290px,calc(100vw - 40px))}
}

/* Stufe Tablet */
@container app (min-width:768px) and (max-width:1279px){
  .a-body{grid-template-columns:56px minmax(0,1fr)}
  .a-nav small,.a-nav .tx,.a-nav .ct{display:none}
  .a-nav button{justify-content:center}
  .a-main{display:block}
  .pnl{position:absolute;right:0;top:0;bottom:0;box-shadow:var(--shadow-pop);z-index:4}
}
/* Stufe Handy: gleiche Elemente, andere Anordnung */
@container app (max-width:767px){
  .app{grid-template-rows:48px minmax(0,1fr) 56px}
  .a-body{grid-template-columns:minmax(0,1fr)}
  .a-nav{display:none}
  .a-tabs{display:flex}
  .a-head .sr,.a-head .ten{display:none}
  .a-main{display:block;height:100%}
  .a-page{padding:12px;height:100%;overflow:auto}
  .pg-h .act .opt{display:none}
  .flt .q{width:100%}
  .flt{flex-wrap:nowrap;overflow-x:auto;padding:2px}
  .flt .q{flex:none;width:100%}
  .flt.top{flex-wrap:wrap;overflow:visible}
  .stand{margin-left:0}
  table.d{display:none}
  .tbl .tbl-s{overflow:visible}
  .tbl{flex:none;margin:0 -12px;border-width:1px 0}
  .cards{display:block}
  .tf .keys{display:none}
  .tf{padding:6px 12px}
  .pnl{position:absolute;inset:0;width:auto;border:0;z-index:4}
  .pnl-h [data-back]{display:inline-flex}
  .pnl-h [data-close]:not([data-back]){display:none}
  .pnl-f .btn{flex:1}
  .inp{font-size:16px}
  .frm{grid-template-columns:minmax(0,1fr);padding:12px;margin:0}
  .savebar{position:sticky;bottom:-12px;background:var(--background);padding:8px 0;border-top:1px solid var(--input)}
  .savebar .btn{flex:1}
  .savebar .st{display:none}
  .savebar .sp{display:none}
  .gsec{padding:14px}
  .stp li:not([aria-current]) .lab{display:none}
  .spec{grid-template-columns:minmax(0,1fr)}
}
/* Kürzel am Ort */
.a-head .sr .hk{margin-left:auto;font-size:11px;background:transparent;color:var(--head-muted);border:1px solid rgb(255 255 255 / .3);padding:0 5px;line-height:18px}
.kt{position:relative}
.kt:hover::after,.kt:focus-visible::after{content:attr(data-kl);white-space:pre;position:absolute;top:calc(100% + 6px);right:0;z-index:9;padding:3px 7px;font-size:12px;font-weight:600;background:var(--foreground);color:var(--background);pointer-events:none}
.kbar{display:none;align-items:center;gap:10px;padding:6px 12px;font-size:12px;color:var(--muted-foreground);border-top:1px solid var(--border);flex:none}
.tbl:focus-within .kbar{display:flex}
/* Felder: Hover gelb */
.inp:hover:not(:focus):not([aria-invalid="true"]):not(:disabled){box-shadow:inset 0 -2px 0 var(--marker)}
@container app (max-width:767px){.a-head .sr .hk{display:none}.kt::after{display:none}}
/* Kopf-Ecken */
.a-head{padding:0}
.a-head .hl{gap:12px}
.a-head .sw{margin:0;width:56px;height:47px;border-right:1px solid var(--head-border)}
.a-head .sw .ic,.a-head .sw svg{width:22px;height:22px}
.a-head .sw:hover{background:var(--head-hover)}
.a-head .me{height:47px;padding:0 14px;margin-left:6px;border-left:1px solid var(--head-border)}
/* Seitenleiste */
.nfw{display:flex;align-items:center;gap:6px;height:32px;margin:0 0 4px;padding:0 8px;border:1px solid var(--nav-border);color:var(--nav-muted)}
.nfw svg{width:14px;height:14px;flex:none}
.nf{flex:1;min-width:0;border:0;background:transparent;color:var(--nav-foreground);font:inherit;font-size:13px;outline:0}
.nfw:focus-within{outline:2px solid var(--ring);outline-offset:-1px}
.ng{display:flex;flex-direction:column;gap:1px}
.ng[hidden]{display:none}
.ngi{display:contents}
.ngi[hidden]{display:none}
.ngi.qopen{display:contents}
.ni{position:relative}
.ni[hidden]{display:none}
.a-nav .ngh{display:flex;align-items:center;gap:6px;height:28px;margin-top:6px;padding:0 8px;border:0;background:transparent;color:var(--nav-muted);font-size:12px;font-weight:600;width:100%;box-shadow:none}
.a-nav .ngh svg{width:12px;height:12px;margin-left:auto;transition:transform .15s}
.a-nav .ngh[aria-expanded="false"] svg{transform:rotate(-90deg)}
.a-nav .ngh.st svg{margin:0;width:13px;height:13px;transition:none}
.a-nav .ngh em{font-style:normal;font-weight:400}
.a-nav .ngh .nc{font-weight:600}
.a-nav .ngh:hover{background:var(--nav-hover)}
.a-nav .ng.pg{margin-top:8px;padding-top:4px;border-top:1px solid var(--nav-border)}
.a-nav .ni>button:first-child{padding-right:30px}
.a-nav .pin{position:absolute;right:2px;top:4px;width:28px;height:28px;padding:0;display:grid;place-items:center;justify-content:center;opacity:0;color:var(--nav-muted);background:transparent}
.a-nav .pin svg{width:14px;height:14px}
.a-nav .ni:hover .pin,.a-nav .pin:focus-visible{opacity:1}
.a-nav .pin[aria-pressed="true"]{color:var(--nav-foreground)}
.a-nav .pin[aria-pressed="true"] svg{fill:currentColor}
.a-nav .ni:has(.ct) .pin{right:22px}
.a-nav .fv .ni .pin{opacity:0}
.a-nav .fv .ni:hover .pin,.a-nav .fv .pin:focus-visible{opacity:1}
.nh{margin:2px 8px 6px;font-size:12px;color:var(--nav-muted)}
.nh[hidden]{display:none}
/* Pfad, Tab-Zeile mit Pager */
.pth{margin-bottom:-6px}
.pth .lnk{color:var(--muted-foreground)}
.trow{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border);flex:none}
.trow .ltabs{border-bottom:0;flex:1;min-width:0}
.trow .pgn{padding:0 12px}
@container app (max-width:1279px){
  .a-nav .nfw,.a-nav .ngh,.a-nav .pin,.a-nav .nh{display:none}
  .a-nav .ngi[hidden]{display:contents}
  .a-nav .ng.pg{margin-top:4px}
}
@container app (max-width:767px){
  .pth>:not(:last-child){display:none}
  .trow .pgn{display:none}
}
/* App-Wechsler */
.a-head .hl{display:flex;align-items:center;gap:6px;min-width:0}
.a-head .sw{margin-left:-6px}
.a-head .sw[aria-expanded="true"]{background:rgb(255 255 255 / .12)}
/* Wechsler-Ecke bündig wie Profil-Ecke */
.a-head .hl{padding:0}
.a-head .sw{margin-left:0}
/* Übersicht oben, Einklappen unten */
.a-nav .top>button{padding-right:8px}
.a-nav .ncl{margin-top:auto;position:sticky;bottom:-8px;background:var(--nav);color:var(--nav-muted);border-top:1px solid var(--nav-border)}
.a-nav .ncl:hover{color:var(--nav-foreground)}
@container app (max-width:1279px){.a-nav .ncl{display:none}}
@container app (min-width:1280px){
  .app.rail .a-body{grid-template-columns:56px minmax(0,1fr)}
  .app.rail .a-nav small,.app.rail .a-nav .tx,.app.rail .a-nav .ct,.app.rail .a-nav .nfw,.app.rail .a-nav .ngh,.app.rail .a-nav .pin,.app.rail .a-nav .nh{display:none}
  .app.rail .a-nav button{justify-content:center}
  .app.rail .a-nav .ni>button:first-child{padding-right:8px}
  .app.rail .a-nav .ngi[hidden]{display:contents}
  .app.rail .a-nav .ng{border-top:1px solid var(--nav-border);margin-top:4px;padding-top:4px}
}
/* Handy: Favoriten und Mehr als Blatt über der Leiste */
.pop.p-sheet{top:auto;bottom:56px;left:0;right:0;width:auto;max-width:none;max-height:75%;border-width:1px 0 0;background:var(--nav)}
.p-sheet .shh{display:flex;align-items:center;justify-content:space-between;padding:4px 8px 4px 16px;border-bottom:1px solid var(--nav-border);color:var(--nav-foreground)}
.p-sheet .a-nav.sh{display:flex;border-right:0;overflow:auto;min-height:0}
.p-sheet .a-nav .nfw{display:flex}
.p-sheet .a-nav .ngh{display:flex}
.p-sheet .a-nav .pin{display:grid;opacity:1}
.p-sheet .a-nav .nh{display:block}
.p-sheet .a-nav .nh[hidden]{display:none}
.p-sheet .a-nav .ngi[hidden]{display:none}
.p-sheet .a-nav .ni>button:first-child{min-height:44px}
.a-head a.wm{color:var(--head-foreground);text-decoration:none}
.pop.p-apps{left:8px;right:auto;width:520px}
.aph{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px;padding:12px 12px 6px}
.aplogo{flex-basis:100%}.aplogo .logo{height:14px;color:var(--primary)}
.aph small{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--muted-foreground)}
.aph small .ic,.apf .ic{width:13px;height:13px}
.agrid{list-style:none;margin:0;padding:4px 8px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px}
.atile,.amore a{display:flex;align-items:center;gap:10px;padding:8px;color:var(--foreground);text-decoration:none;border:1px solid transparent;min-height:56px}
.atile:hover,.amore a:hover{background:var(--muted)}
.atile[aria-current]{background:var(--selected);border-color:var(--selected-border)}
.atile.nx{color:var(--muted-foreground)}
.atile.nx .ahex{background:var(--neutral-soft);color:var(--muted-foreground)}
.atile.nx u{color:var(--link)}
.ahex{width:32px;height:36px;flex:none;display:grid;place-items:center;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:var(--primary);color:var(--primary-foreground);font-size:12px;font-weight:700;letter-spacing:.02em}
.atile[aria-current] .ahex{background:var(--cta);color:var(--cta-foreground)}
.ahex.o{background:var(--neutral-soft);color:var(--foreground)}
.at{min-width:0;flex:1}
.at b{display:flex;align-items:center;gap:6px;font-weight:600;font-size:14px}
.at small{display:block;font-size:12px;color:var(--muted-foreground);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.env{font-size:11px;font-weight:700;padding:0 5px;height:18px;line-height:18px;background:var(--flow-soft);color:var(--flow);border:1px solid var(--flow)}
.here{font-size:11px;font-weight:700;color:var(--muted-foreground)}
.amore{list-style:none;margin:0;padding:0 8px 4px}
.amore a{min-height:48px}
.amore .lnk{font-size:12px}
.apf{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;border-top:1px solid var(--border);font-size:12px;color:var(--muted-foreground)}
.apf span,.apf a{display:inline-flex;align-items:center;gap:4px}
.apf kbd{font-size:11px}
@container app (max-width:767px){
  .pop.p-apps{left:8px;right:8px;width:auto;max-height:calc(100% - 64px);overflow:auto}
  .agrid{grid-template-columns:minmax(0,1fr)}
  .apf span{display:none}
}
/* Administration */
.scp{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--muted-foreground)}
.scp .ic{width:14px;height:14px}
.scp.pl{color:var(--flow)}
.plat{display:flex;align-items:center;gap:8px;margin:-16px -20px 0;padding:6px 20px;background:var(--flow-soft);color:var(--foreground);font-size:13px;border-bottom:1px solid var(--flow)}
.plat .ic{color:var(--flow)}
.who{display:flex;align-items:center;gap:10px;min-width:0}
.who b{display:block;font-weight:600}
.who small{display:block;font-size:12px;color:var(--muted-foreground);overflow:hidden;text-overflow:ellipsis}
.uav{width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:var(--accent-foreground);font-size:11px;font-weight:700}
.uav.lg{width:32px;height:32px;font-size:12px}
table.d td:has(.who){height:auto;padding-top:6px;padding-bottom:6px}
.rl{display:inline-flex;align-items:center;height:22px;padding:0 6px;border:1px solid var(--input);font-size:12px;font-weight:600;color:var(--foreground);white-space:nowrap}
.rls{list-style:none;margin:0;padding:0}
.rls li{display:flex;align-items:center;gap:8px;min-height:36px;border-bottom:1px solid var(--border);font-size:13px}
.rls .t{color:var(--muted-foreground);flex:1}
.rls .lnk,.pnl-b>div>.lnk{display:inline-flex;align-items:center;gap:4px}
table.eff{width:100%;border-collapse:collapse;font-size:13px}
table.eff th{text-align:left;font-size:12px;font-weight:600;color:var(--muted-foreground);padding:4px 6px 4px 0;border-bottom:1px solid var(--input)}
table.eff td{padding:6px 6px 6px 0;border-bottom:1px solid var(--border)}
table.eff td:first-child{display:flex;align-items:center;gap:6px}
table.eff td:not(:first-child){color:var(--muted-foreground)}
ul.aud{list-style:none;margin:0;padding:0;font-size:13px}
ul.aud li{padding:6px 0;border-bottom:1px solid var(--border)}
ul.aud small{display:block;color:var(--muted-foreground);font-size:12px}
.mdl{position:absolute;inset:0;z-index:7}
.dlg.wide{width:min(480px,calc(100% - 32px))}
.dlg .fld{display:flex;flex-direction:column;gap:4px}
.dlg .fld label,.fs.one legend{font-size:13px;font-weight:600}
.fs.one{grid-template-columns:1fr 1fr}
.fs.one legend{margin-bottom:4px;padding:0}
.dlg .h{font-size:12px;color:var(--muted-foreground)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.mx .tbl-s{overflow:auto}
table.mxt{width:100%;border-collapse:collapse;font-size:13px}
table.mxt thead th{position:sticky;top:0;z-index:1;background:var(--card);border-bottom:1px solid var(--input);padding:6px 10px;text-align:left;font-size:12px;font-weight:600;color:var(--muted-foreground);vertical-align:bottom}
table.mxt th.rc,table.mxt td.rc{text-align:center;width:120px}
table.mxt th.rc button{display:inline-flex;align-items:center;gap:4px;border:0;background:transparent;color:var(--foreground);font-weight:700;font-size:13px;padding:2px 4px}
table.mxt th.rc small{display:block;font-weight:400;font-size:11px}
table.mxt .rc.on{background:var(--selected);box-shadow:inset 1px 0 0 var(--selected-border),inset -1px 0 0 var(--selected-border)}
table.mxt tbody th{text-align:left;font-weight:400;padding:0 10px;height:var(--row);border-bottom:1px solid var(--border);white-space:nowrap}
table.mxt tbody td{border-bottom:1px solid var(--border);height:var(--row)}
table.mxt tr.grp th{height:30px;font-size:12px;font-weight:700;color:var(--foreground);background:var(--muted);border-bottom:1px solid var(--input)}
table.mxt .no,.mxm .no{color:var(--subtle-foreground)}
.sens{display:inline-flex;margin-left:6px;color:var(--warning);vertical-align:-2px}
.sens .ic{width:13px;height:13px}
.mx .tf{display:flex;align-items:center;gap:8px;padding:8px 12px;border-top:1px solid var(--input);font-size:12px;color:var(--muted-foreground)}
.mx .tf>span:first-child{display:inline-flex;gap:6px;align-items:center}
.mx .tf .ic{width:13px;height:13px}
.rsel,.mxm{display:none}
.mxm ul{list-style:none;margin:0 0 10px;padding:0}
.mxm li{display:flex;align-items:center;gap:8px;min-height:40px;border-bottom:1px solid var(--border);font-size:14px}
.mxm li>span:not(.no){flex:1}
.mxm .sect{margin:10px 0 2px}
.rsel{gap:4px;overflow-x:auto;scrollbar-width:none;padding:8px 0}
.rsel button{flex:none;height:36px;padding:0 12px;border:1px solid var(--input);background:var(--card);color:var(--foreground);font-weight:600;font-size:13px}
.rsel button[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:var(--primary-foreground)}
.msg.sec{grid-template-columns:18px minmax(0,1fr) auto}
.secret{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.secret code{flex:1;min-width:0;padding:7px 10px;background:var(--card);border:1px solid var(--input);font-size:13px;overflow-wrap:anywhere;user-select:all}
.ico{display:inline-flex;align-items:center;gap:4px}
.sys{display:inline-flex;align-items:center;gap:5px;color:var(--muted-foreground)}
@container app (max-width:767px){
  table.mxt{display:none}
  .rsel{display:flex}
  .mxm{display:block}
  .mx .tbl-s{padding:0 12px}
  .mx .tf>span:first-child{display:none}
  .plat{margin:-12px -12px 0;padding:6px 12px}
  .dlg.wide{top:auto;bottom:0;left:0;right:0;transform:none;width:auto;max-height:calc(100% - 24px);overflow:auto}
  .card .who{margin-right:8px}
}

/* Runde 10 */
.fl.fr{-webkit-mask-image:linear-gradient(90deg,transparent,#000 32px,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,transparent,#000 32px,#000 calc(100% - 32px),transparent)}
.fr:not(.fl){-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent)}
.fl:not(.fr){-webkit-mask-image:linear-gradient(90deg,transparent,#000 32px);mask-image:linear-gradient(90deg,transparent,#000 32px)}
.a-head .qd{position:absolute;top:4px;right:4px;width:8px;height:8px;border-radius:50%;background:var(--cta);box-shadow:0 0 0 2px var(--head)}
.a-head .qd.ty{animation:qp 1s ease-in-out infinite}
@keyframes qp{50%{transform:scale(.5);opacity:.5}}
@media (prefers-reduced-motion:reduce){.a-head .qd.ty{animation:none;background:transparent;box-shadow:inset 0 0 0 2px var(--cta)}}
.mrow .mr svg{width:16px;height:16px}
.fb.ic-b{position:relative}
.fb.ic-b{width:auto;min-width:32px;padding:0 6px;gap:3px}
.fb.ic-b .nb{position:static;display:inline;min-width:0;height:auto;padding:0;background:none;color:var(--primary);font-size:13px;font-weight:700;line-height:1}
.fb[aria-label*="aktiv"] svg{color:var(--primary)}
.trow.lt{border-bottom:1px solid var(--border);gap:0}
.trow.lt .mo,.mo-d{display:none}
.a-nav .ni:has(.ct)>button:first-child{padding-right:34px}
.a-nav .ni:has(.ct) .pin{right:2px}
.a-nav .ni:has(.ct):hover .ct{visibility:hidden}
.p-sheet .a-nav .ni .ct{margin-right:4px}
.p-sheet .a-nav .ni:has(.ct) .ct{visibility:visible}
.p-sheet .a-nav .fv .ni .pin{opacity:1}
@media (pointer:coarse){.kbar{display:none!important}}
@container app (max-width:767px){
  .a-head .hd{display:grid}
  .a-head .ib{width:36px;height:36px}
  .a-head .hr{gap:0}
  .dk{display:none!important}
  .kbar{display:none!important}
  .mo-d{display:block}
  .pg-h .act .opt:has(svg){display:inline-flex}
  .pg-h .act .btn:has(svg){font-size:0;width:var(--ctl,36px);padding:0;gap:0}
  .tbl .tb{display:none}
  .trow.lt{position:sticky;top:-12px;z-index:3;background:var(--card);padding:0 4px}
  .trow.lt .mo{display:inline-flex;flex:none}
  .trow.lt .ltabs{padding:0 4px;-webkit-mask-image:none;mask-image:none}
  .trow.lt .ltabs.fr:not(.fl){-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent)}
  .trow.lt .ltabs.fl:not(.fr){-webkit-mask-image:linear-gradient(90deg,transparent,#000 32px);mask-image:linear-gradient(90deg,transparent,#000 32px)}
  .trow.lt .ltabs.fl.fr{-webkit-mask-image:linear-gradient(90deg,transparent,#000 32px,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,transparent,#000 32px,#000 calc(100% - 32px),transparent)}
}

/* Auswahllisten passend zum Theme */
select.inp{-webkit-appearance:none;appearance:none;padding-right:32px;background-repeat:no-repeat;background-position:right 10px center;background-size:12px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2346607d' stroke-width='1.6'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E")}
:host([data-theme="dark"]) select.inp,[data-theme="dark"] select.inp{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23c9d3df' stroke-width='1.6'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E")}
select.inp option{background:var(--popover);color:var(--foreground)}
.cbx .lbl{display:block;font-size:13px;font-weight:600;margin-bottom:3px}
.cbb{display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;cursor:pointer}
.cbb svg{flex:none;color:var(--muted-foreground)}.cbb[aria-expanded="true"] svg{transform:rotate(180deg)}
.cbp{margin-top:4px;background:var(--popover);border:1px solid var(--border-strong,var(--input));box-shadow:var(--shadow-pop)}
.cbp .sq{display:flex;align-items:center;gap:6px;padding:0 10px;border-bottom:1px solid var(--border)}
.cbl{list-style:none;margin:0;padding:4px 0;max-height:216px;overflow:auto}
.cbo{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 10px;min-height:32px;font-size:14px;cursor:pointer}
.cbo:hover{background:var(--muted)}.cbo[aria-selected="true"]{font-weight:700}.cbo svg{color:var(--primary)}
.cbm{display:flex;align-items:center;gap:8px;padding:0 10px;min-height:32px;font-size:13px;color:var(--muted-foreground)}
.spn{width:12px;height:12px;border:2px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spn 1s linear infinite}
@keyframes spn{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spn{animation:none}}
.cbo[hidden],.cbm[hidden]{display:none}
.cbf{padding:6px 10px;border-top:1px solid var(--border);font-size:12px;color:var(--muted-foreground)}
/* Tastenkürzel auf Abruf */
.app:not(.keys) .kbar{display:none!important}
.app:not(.keys) .a-head .sr .hk{display:none}
.app.keys .kt[data-k]:not([data-k=""])::before{content:attr(data-k);position:absolute;right:-3px;bottom:-3px;z-index:8;min-width:14px;padding:0 3px;font:700 10px/14px ui-monospace,Menlo,Consolas,monospace;text-align:center;background:var(--cta);color:var(--cta-foreground);pointer-events:none}
.kyrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--border);background:var(--card)}
.kyrow b{display:block;font-size:14px}.kyrow small{display:block;font-size:12px;color:var(--muted-foreground);margin-top:2px}
.tgl{flex:none;width:40px;height:22px;border:1px solid var(--input);background:var(--muted);padding:2px;display:flex;cursor:pointer}
.tgl span{width:16px;height:16px;background:var(--muted-foreground);transition:transform .15s ease}
.tgl[aria-checked="true"]{background:var(--primary);border-color:var(--primary)}
.tgl[aria-checked="true"] span{transform:translateX(18px);background:var(--primary-foreground)}
.mrow .tgl{margin-left:auto;pointer-events:none}
.mrow[aria-checked="true"] .tgl{background:var(--primary);border-color:var(--primary)}
.mrow[aria-checked="true"] .tgl span{transform:translateX(18px);background:var(--primary-foreground)}
.a-head .me .av{position:relative}
.a-head .me .avi{position:absolute;top:-2px;right:-2px;width:10px;height:10px;border-radius:50%;background:var(--cta);box-shadow:0 0 0 2px var(--head-foreground)}
.mfl{display:grid;grid-template-columns:auto 1fr;column-gap:12px;row-gap:2px;margin:0}
.mfl dt{color:var(--muted-foreground)}.mfl dd{margin:0;color:var(--foreground)}
.mfl dd[title]{text-decoration:underline dotted;text-underline-offset:2px;cursor:help}
@container app (max-width:767px){.kyrow{display:none}}
@media (pointer:coarse){.kyrow{display:none}}
/* Gangart Aufgelockert */
.app.easy .a-body{grid-template-columns:minmax(0,1fr)!important}
.app.easy .a-head{grid-template-columns:minmax(0,1fr) auto}
.app.easy .a-head .sr{display:none}.app.easy .a-head .sri{display:grid}
.tnav{display:flex;align-self:stretch;margin-left:20px}
.tnav a{display:flex;align-items:center;padding:0 12px;color:var(--head-foreground);font-size:14px;font-weight:600;text-decoration:none;position:relative}
.tnav a:hover{background:rgb(255 255 255 / .08)}
.tnav a[aria-current]::after{content:'';position:absolute;left:12px;right:12px;bottom:0;height:3px;background:var(--cta)}
.ez{background:var(--background);font-size:16px;line-height:1.5}
.ez-w{width:100%;max-width:960px;margin:0 auto;padding:12px 0 32px;display:flex;flex-direction:column;gap:24px}
.ez-w.wide{max-width:1376px}
.ey{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--muted-foreground)}
.ey::before{content:'';width:28px;height:3px;background:var(--cta)}
.ez-h h2{font-size:32px;line-height:40px;margin-top:6px}
.ez-h p{color:var(--muted-foreground);margin-top:2px}
.ez-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.ezc{background:var(--card);border:1px solid var(--border);padding:24px;display:flex;flex-direction:column;gap:14px}
.ezc.ezx{border:1px solid var(--foreground);border-top:4px solid var(--cta)}
.ezt{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ezt h3{font-size:18px;line-height:24px}
.ezb{--ctl:44px;font-size:15px;align-self:flex-start;padding:0 18px}
.ezf{display:flex;gap:16px;font-size:14px;padding-top:12px;border-top:1px solid var(--border)}
.ez-s{display:flex;align-items:baseline;justify-content:space-between}
.ez-s h3{font-size:18px}
.ez-l{list-style:none;margin:-12px 0 0;padding:0;background:var(--card);border:1px solid var(--border)}
.ez-l li+li{border-top:1px solid var(--border)}
.ezr{display:flex;align-items:center;gap:12px;padding:14px 20px;color:var(--foreground);text-decoration:none;min-height:56px}
.ezr:hover{background:var(--muted)}
.ezr>span:first-child{flex:1;min-width:0}
.ezr b{display:block;font-size:16px}.ezr small{display:block;font-size:13px;color:var(--muted-foreground)}
.ezr>svg{color:var(--muted-foreground);flex:none}
@container app (max-width:767px){
  .tnav{display:none}
  .ez-w{padding:4px 0 24px;gap:20px}
  .ez-h h2{font-size:26px;line-height:32px}
  .ezc{padding:18px}
  .ezb{align-self:stretch}
  .ezr{padding:12px 14px}
}

/* Runde 12 */
.pbar{display:flex;align-items:center;gap:8px;min-height:32px;margin-bottom:-8px}
.pbar .bc{flex:1;min-width:0;margin:0}
.pbar>span:first-child{flex:1}
.pbar .act{margin-left:auto;display:flex;align-items:center;gap:6px}
.pbar .act .btn{--ctl:32px;font-size:13px;padding:0 10px}
.pbar .act .btn.ic-b{width:32px;padding:0}
.vsep{width:1px;height:20px;background:var(--border);margin:0 4px}
.cpy{width:24px;height:24px;display:inline-grid;place-items:center;border:0;background:transparent;color:var(--muted-foreground);padding:0;flex:none;vertical-align:middle;position:relative}
.cpy svg{width:14px;height:14px}.cpy:hover{color:var(--foreground);background:var(--muted)}.cpy.ok{color:var(--success)}
dl.m dd{display:flex;align-items:center;gap:4px;min-height:24px}
dl.m dd .cpy{opacity:0}
dl.m dd:hover .cpy,dl.m dd .cpy:focus-visible,dl.m dd .cpy.ok{opacity:1}
@media (pointer:coarse){dl.m dd .cpy{opacity:.7}}
.pnl-h .cpy{margin-left:-4px}
.k-t{color:var(--code-tag)}.k-a{color:var(--code-attr)}.k-v{color:var(--code-val)}.k-p{color:var(--muted-foreground)}
:root,[data-theme="light"]{--code-tag:#0a5aa8;--code-attr:#892282;--code-val:#2f6b4a}
:host([data-theme="dark"]),[data-theme="dark"]{--code-tag:#8cc4ff;--code-attr:#e5a3df;--code-val:#8fd4a9}
.ph{display:flex;align-items:center;gap:6px}
.pfl{list-style:none;margin:6px 0 8px;padding:0;border:1px solid var(--border)}
.pfl li{display:flex;align-items:center;gap:8px;padding:2px 4px 2px 10px;min-height:40px}
.pfl li+li{border-top:1px solid var(--border)}
.pfl li[aria-current]{box-shadow:inset 3px 0 0 var(--marker);background:var(--muted)}
.pfn{flex:1;min-width:0}.pfn b{display:block;font-size:13px}.pfn small{display:block;font-size:12px;color:var(--muted-foreground)}
.pfe{font-size:12px;color:var(--muted-foreground);padding-right:8px}
.ph>.btn{display:none}
.tagf{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:var(--ctl,36px);padding:4px 6px;border:1px solid var(--input);background:var(--card);cursor:text}
.tagf:focus-within{outline:2px solid var(--ring);outline-offset:1px}
.tag{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 2px 0 8px;background:var(--muted);color:var(--foreground);border:1px solid var(--border);font-size:13px;max-width:100%}
.tag>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tag button{width:22px;height:22px;display:grid;place-items:center;border:0;background:transparent;color:var(--muted-foreground);padding:0}
.tag button:hover{color:var(--foreground);background:var(--border)}
.tag button svg{width:12px;height:12px}
.tag.bad{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}
.tag.bad>svg{width:13px;height:13px}
.tagi{flex:1;min-width:140px;border:0;background:transparent;height:26px;font-size:var(--base);color:var(--foreground);padding:0 2px}
.tagi:focus{outline:none}
.a-head .wm .ws{display:none}
@container app (max-width:767px){.box0 table.d.st{display:table;font-size:13px}.box0 table.d.st td:nth-child(5),.box0 table.d.st th:nth-child(5),.box0 table.d.st td:nth-child(4),.box0 table.d.st th:nth-child(4){display:none}}
@container app (max-width:767px){
  .a-head .wm .wl{display:none}.a-head .wm .ws{display:inline}
  .pbar{margin-bottom:-6px}
  .pbar .act .btn{width:36px;--ctl:36px;padding:0;gap:0;font-size:0}
  .pbar .act .btn:not(.pri):not(.dng){background:transparent;border-color:transparent}
  .pbar .act .btn:not(.pri):hover{background:var(--muted)}
  .pbar .act .opt:not(:has(svg)){display:none}
  .secret .btn{width:36px;padding:0;gap:0;font-size:0}
  .tagi{font-size:16px}
}
.rmenu{position:absolute;right:16px;z-index:8;width:220px;background:var(--popover);border:1px solid var(--input);box-shadow:var(--shadow-pop);padding:4px 0}
.rmenu button{display:flex;align-items:center;gap:8px;width:100%;height:32px;padding:0 12px;border:0;background:transparent;color:var(--foreground);font-size:13px;text-align:left}
.rmenu button:hover{background:var(--muted)}
.rmenu hr{border:0;border-top:1px solid var(--border);margin:4px 0}
.rmenu .dz{color:var(--danger)}
/* Knopf lädt: Inhalt bleibt unsichtbar stehen (Breite gleich), Kreis darüber in der Schriftfarbe */
.btn[aria-busy="true"]{position:relative}
.btn[aria-busy="true"]:disabled{opacity:1}
.btn[aria-busy="true"] .bl{visibility:hidden;display:inline-flex;align-items:center;gap:6px}
.btn[aria-busy="true"] .spn{position:absolute;inset:0;margin:auto;width:14px;height:14px;border:2px solid currentColor;border-top-color:transparent}
@media (prefers-reduced-motion:reduce){.btn[aria-busy="true"] .spn{border-top-color:currentColor;opacity:.6}}
/* Eingabefeld mit Zeichen vorn und Löschen hinten */
.inw{position:relative;display:block;width:100%}
.inw .inp.ld{padding-left:32px}.inw .inp.cl{padding-right:32px}
.inw .li,.inw .cx{position:absolute;top:0;bottom:0;width:32px;display:flex;align-items:center;justify-content:center;color:var(--subtle-foreground)}
.inw .li{left:0;pointer-events:none}
.inw .cx{right:0;padding:0;border:0;background:transparent}
.inw .cx:hover{color:var(--foreground)}
.inw .cx:focus-visible{outline-offset:-2px}
/* Textblock im Laden */
.skels{display:flex;flex-direction:column;gap:8px}.skels .skel:last-child{width:60%}
/* Zeilenmenü mit Untermenü */
.rmenu.st{position:relative;right:auto;top:auto}
.rmenu .sbw{position:relative}
.rmenu .sbt .chv{margin-left:auto;color:var(--muted-foreground)}
.rmenu .sbt[aria-expanded="true"]{background:var(--muted)}
.rmenu .fly{position:absolute;left:100%;top:-5px;z-index:1;margin-left:2px;width:200px;background:var(--popover);border:1px solid var(--input);box-shadow:var(--shadow-pop);padding:4px 0}
/* Waben: Tagesstatus, Nummer und Pin, Papier des Grundrisses, Diagrammfarben, Aktionsknopf je Karte */
.hxs{display:block;width:20px;height:20px;flex:none;overflow:visible}
.hxs .hp{stroke-width:2;stroke-linejoin:miter}
.hxs.none .hp{fill:var(--card);stroke:var(--input)}
.hxs.booked .hp,.hxs.present .hp{fill:var(--primary);stroke:var(--foreground)}
.hxs.open .hp,.hxs.hinted .hp{fill:var(--cta);stroke:var(--foreground)}
.hxs .hck{fill:none;stroke:var(--cta);stroke-width:2.4;stroke-linecap:square}
.hxs .hq{fill:var(--cta-foreground);font-size:13px;font-weight:700;text-anchor:middle;font-family:inherit}
.hxs .hdt{fill:var(--foreground);stroke:var(--card);stroke-width:1.6}
.hxl{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0;padding:0;list-style:none;font-size:12px;color:var(--muted-foreground)}
.hxl li{display:inline-flex;align-items:center;gap:6px}
.hxl .hxs{width:16px;height:16px}
.hxn{position:relative;display:inline-grid;place-items:center;flex:none;width:28px;height:28px;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.45;color:var(--foreground)}
.hxn svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hxn .hp{fill:var(--card);stroke:var(--foreground);stroke-width:1.6;stroke-linejoin:miter}
.hxn .hr{fill:none;stroke:var(--cta);stroke-width:1.6;stroke-linejoin:miter}
.hxn>span{position:relative}
.hxn.hsm{width:20px;height:20px;font-size:10px}
.hxn.hlg{width:40px;height:40px;font-size:13px}
.hxn.solid,.hxn.taken{color:var(--primary-foreground)}
.hxn.solid .hp,.hxn.taken .hp{fill:var(--primary)}
.hxn.accent{color:var(--cta-foreground)}
.hxn.accent .hp{fill:var(--cta);stroke:var(--cta)}
.hxn.mine{color:var(--cta-foreground)}
.hxn.mine .hp{fill:var(--cta)}
.hxn.onbrand{color:var(--head-foreground)}
.hxn.onbrand .hp{fill:transparent;stroke:var(--cta)}
.hxn.hxd{color:var(--danger)}
.hxn.hxd .hp{stroke:var(--danger)}
.hxn.off{color:var(--muted-foreground)}
.hxn.off .hp{fill:var(--neutral-soft);stroke:var(--input)}
.hxn.room{color:var(--muted-foreground)}
.hxn.room .hp{stroke:var(--input);stroke-dasharray:3 2}
.fpl{position:relative;background:var(--paper);border:1px solid var(--border);height:150px}
.fpl svg.fpd{position:absolute;inset:0;width:100%;height:100%}
.fpl .fps{fill:var(--paper-space);stroke:var(--paper-line);stroke-width:1.5}
.fpl .hxn{position:absolute;transform:translate(-50%,-50%)}
.chc{display:flex;align-items:flex-end;gap:3px;height:120px;border-bottom:1px solid var(--border)}
.chc .chbar{flex:1;max-width:28px;display:flex;flex-direction:column-reverse}
.chc .chbar i{display:block}
.chl{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0;padding:0;list-style:none;font-size:12px;color:var(--muted-foreground)}
.chl li{display:inline-flex;align-items:center;gap:6px}
.chl i{width:10px;height:10px;display:block}
.chs{display:flex;gap:8px;flex-wrap:wrap}
.chs i{width:44px;height:44px;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;color:var(--card)}
.dcard{display:flex;align-items:center;gap:12px;border:1px solid var(--border);background:var(--card);padding:8px 12px}
.dcard .dt{flex:1;min-width:0;display:grid}
.dcard .dt b{font-weight:700}
.dcard .dt small{font-size:12px;color:var(--muted-foreground)}
@container app (max-width:767px){.btn.ca{width:var(--ctl,36px);padding:0;gap:0}.btn.ca .bt{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}
/* PWA: Band „Neue Version verfügbar“ unter dem Kopf (UpdateBanner) und Offline-Seite im Inhalt (OfflinePage). */
.upd{display:flex;align-items:center;gap:8px;min-height:40px;padding:4px 8px 4px 16px;border-bottom:1px solid var(--border);background:var(--info-soft);color:var(--info);font-size:13px}
.upd>svg{width:16px;height:16px;flex:none}
.upd p{flex:1;min-width:0;color:var(--foreground)}
.upd p b{font-weight:700;color:var(--info)}
.upd .btn{height:32px;padding:0 10px;font-size:13px}
.upd .btn.gh{width:32px;padding:0;font-size:14px}
.ofl{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%}
.ofl .ofl-r{display:flex;flex-direction:column;align-items:center;gap:8px;padding:40px 16px;text-align:center}
.ofl .ofl-w{width:64px;height:70px;display:flex;align-items:center;justify-content:center;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:var(--accent);color:var(--accent-foreground)}
.ofl .ofl-w svg{width:28px;height:28px}
.ofl h2{margin-top:8px;font-size:21px;line-height:1.25;font-weight:700;color:var(--foreground)}
.ofl .ofl-d{max-width:52ch;font-size:14px;color:var(--muted-foreground)}
.ofl .ofl-n{max-width:52ch;font-size:13px;color:var(--subtle-foreground)}
.ofl .ofl-a{margin-top:12px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}

/* QUIBIQ App Design System – Gangart Status: Wand und Präsentation.
 * An der Wurzel der App data-gangart="status" (AppShell: gangart="status"); die Tokens --status-* stehen in tokens.css.
 * Maß 1920 px: alle Größen skalieren mit der Breite des umgebenden Containers (100cqw / 1920), am schmalen Container (≤ 700 px)
 * mit 600 px als Maß. Klassen wie in der Vorlage (template/app-vorlage.html, Ansicht „Status (Wand)“). */
.sta{--u:calc(100cqw / 1920);background:var(--background);color:var(--foreground);min-height:100%;height:max-content;padding:calc(var(--u)*var(--status-pad-y)) calc(var(--u)*var(--status-pad-x));display:flex;flex-direction:column;gap:calc(var(--u)*var(--status-gap));font-size:calc(var(--u)*var(--status-text));line-height:1.35}
.sta-top{display:flex;align-items:flex-end;justify-content:space-between;gap:calc(var(--u)*48)}
.sta .ey{display:flex;align-items:center;gap:10px;font-weight:600;font-size:calc(var(--u)*var(--status-label));letter-spacing:.06em;text-transform:uppercase;color:var(--muted-foreground)}
.sta .ey::before{content:'';background:var(--cta);width:calc(var(--u)*56);height:calc(var(--u)*6)}
.sta h2{text-wrap:balance;margin-bottom:0;font-size:calc(var(--u)*var(--status-title));line-height:1.08;font-weight:700;margin-top:calc(var(--u)*16);max-width:20ch;color:var(--primary)}
.sta-live{display:flex;align-items:center;gap:calc(var(--u)*16);font-size:calc(var(--u)*var(--status-live));font-weight:600;white-space:nowrap}
.sta-live i{width:calc(var(--u)*var(--status-dot));height:calc(var(--u)*var(--status-dot));border-radius:50%;background:var(--success)}
.sta-live span{color:var(--muted-foreground);font-weight:400;font-size:calc(var(--u)*var(--status-label))}
.sta-kz{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--u)*var(--status-kpi-gap))}
.sta-kz>div{border-top:calc(var(--u)*var(--status-accent)) solid var(--cta);padding-top:calc(var(--u)*20)}
.sta-kz b{display:block;font-size:calc(var(--u)*var(--status-kpi));line-height:1;font-weight:700;color:var(--primary);font-variant-numeric:tabular-nums}
.sta-kz b small{font-size:calc(var(--u)*var(--status-kpi-unit));font-weight:600;margin-left:calc(var(--u)*8)}
.sta-kz span{display:block;margin-top:calc(var(--u)*12);font-size:calc(var(--u)*var(--status-label));color:var(--muted-foreground)}
.sta-kz .bad b{color:var(--danger)}
.sta-pr{display:grid;grid-template-columns:repeat(auto-fit,minmax(calc(var(--u)*520),1fr));gap:calc(var(--u)*var(--status-grid-gap))}
.sta-c{background:var(--card);border:1px solid var(--border);padding:calc(var(--u)*var(--status-card-pad));display:flex;flex-direction:column;gap:calc(var(--u)*var(--status-card-gap))}
.sta-c header{display:flex;align-items:center;gap:calc(var(--u)*16)}
.sta-c header i{width:calc(var(--u)*20);height:calc(var(--u)*20);flex:none}
.sta-c h3{font-size:calc(var(--u)*var(--status-card-title));line-height:1.15;font-weight:700;flex:1;margin:0}
.sta-amp{display:inline-flex;align-items:center;gap:calc(var(--u)*10);padding:calc(var(--u)*6) calc(var(--u)*16);font-size:calc(var(--u)*20);font-weight:600;white-space:nowrap}
.sta-amp::before{content:'';width:calc(var(--u)*14);height:calc(var(--u)*14);border-radius:50%;background:currentColor}
.sta-amp[data-tone=er]{background:var(--danger-soft);color:var(--danger)}.sta-amp[data-tone=wa]{background:var(--warning-soft);color:var(--warning)}.sta-amp[data-tone=go]{background:var(--success-soft);color:var(--success)}.sta-amp[data-tone=na]{background:var(--muted);color:var(--muted-foreground)}
.sta-c .pc{display:flex;align-items:baseline;gap:calc(var(--u)*16)}
.sta-c .pc b{font-size:calc(var(--u)*var(--status-card-kpi));line-height:1;font-weight:700;color:var(--primary);font-variant-numeric:tabular-nums}
.sta-c .pc span{font-size:calc(var(--u)*var(--status-label));color:var(--muted-foreground)}
.sta-bar{height:calc(var(--u)*var(--status-bar));background:var(--muted)}.sta-bar i{display:block;height:100%;background:var(--cta)}
.sta-c p{margin:0;font-size:calc(var(--u)*var(--status-label));color:var(--muted-foreground)}
@container (max-width:700px){.sta{--u:calc(100cqw / 600);--status-pad-y:32;--status-pad-x:28;--status-kpi-gap:32;--status-title:56;--status-kpi:72;--status-card-title:30;--status-card-kpi:52;--status-label:20;--status-live:24}.sta-top{flex-direction:column;align-items:flex-start}.sta-kz{grid-template-columns:1fr 1fr}.sta-pr{grid-template-columns:1fr}}