/* ════════════════════════════════════════════════════════════════
   Archiv (Stammdaten › Archiv), Redesign 25.09.2026, Handoff "Archiv 1b".
   Drei Spalten: Liste (ziehbar) | Viewer | Inspector. Layout-Klassen auf #pageArchiv
   setzt archivLayoutMessen() in archiv.js:
     is-desk (>= 1280), is-tabL (1024-1279), is-narrow (< 1024, Push-Detail), is-phone (< 768),
     is-touch (Touch-Ziele 44 px), is-tabelle (Liste >= 520 px), has-doc, is-detail (Push offen),
     seg-details, insp-aus (Desktop), insp-overlay (iPad quer), is-labels (>= 1500), is-selmode.
   Farben nur über App-Variablen (app.css) plus die --ar-* Tokens unten, hell und dunkel.
   ════════════════════════════════════════════════════════════════ */

/* Tokens auch fuer den Reiter Archiv im Objekt (gleiche Karten) */
#pageArchiv, #pageObjektuebersicht {
  --ar-head: rgba(255,255,255,.97);
  --ar-inp: rgba(248,250,252,.95);
  --ar-tint: rgba(7,161,226,.09);
  --ar-tint-strong: rgba(7,161,226,.15);
  --ar-paper: rgba(203,213,225,.45);
  --ar-skel: rgba(15,23,42,.06);
  --ar-ok: #16a34a;
  --ar-ctrl: 36px;
  --ar-fb: 30px;
  --ar-row: 40px;
  /* Dateisymbol nach Dokumentgruppe: Text, Fläche, Kontur/Knick */
  --ar-blue-t:#0a6aa3;   --ar-blue-f:rgba(7,161,226,.09);   --ar-blue-k:rgba(7,161,226,.24);
  --ar-teal-t:#0f766e;   --ar-teal-f:rgba(20,184,166,.10);  --ar-teal-k:rgba(20,184,166,.26);
  --ar-orange-t:#b45309; --ar-orange-f:rgba(245,158,11,.11); --ar-orange-k:rgba(245,158,11,.30);
  --ar-violet-t:#6d28d9; --ar-violet-f:rgba(124,58,237,.08); --ar-violet-k:rgba(124,58,237,.22);
  --ar-gray-t:#475569;   --ar-gray-f:rgba(100,116,139,.09); --ar-gray-k:rgba(100,116,139,.24);
}
html.dark #pageArchiv, html.dark #pageObjektuebersicht {
  --ar-head: rgba(17,23,35,.96);
  --ar-inp: rgba(255,255,255,.045);
  --ar-tint: rgba(44,181,240,.13);
  --ar-tint-strong: rgba(44,181,240,.20);
  --ar-paper: rgba(5,8,14,.55);
  --ar-skel: rgba(255,255,255,.06);
  --ar-ok: #34d36b;
  --ar-blue-t:#7fd3f7;   --ar-blue-f:rgba(44,181,240,.12);  --ar-blue-k:rgba(44,181,240,.28);
  --ar-teal-t:#6ee0cf;   --ar-teal-f:rgba(45,212,191,.11);  --ar-teal-k:rgba(45,212,191,.26);
  --ar-orange-t:#fcc774; --ar-orange-f:rgba(245,158,11,.12); --ar-orange-k:rgba(245,158,11,.28);
  --ar-violet-t:#c4b1ff; --ar-violet-f:rgba(139,92,246,.14); --ar-violet-k:rgba(139,92,246,.30);
  --ar-gray-t:#c3ccd8;   --ar-gray-f:rgba(148,163,184,.12); --ar-gray-k:rgba(148,163,184,.26);
}
#pageArchiv.is-touch { --ar-ctrl:44px; --ar-fb:36px; --ar-row:48px; }

/* ── Seite füllt den Inhaltsbereich randlos (Muster #pageAdressen) ── */
body[data-seite="archiv"] .main-content:not(#_) {
  padding:0 !important; overflow:hidden !important;
  display:flex !important; flex-direction:column !important;
}
#pageArchiv.active {
  display:flex !important; flex:1 1 0; min-height:0; overflow:hidden; position:relative;
  color:var(--text); font-size:13.5px; font-feature-settings:'cv02','cv03','cv04','cv11';
}
#pageArchiv button { font-family:inherit; }
#pageArchiv button:focus-visible, #pageArchiv a:focus-visible, #pageArchiv [tabindex]:focus-visible,
#pageArchiv input:focus-visible { outline:none; box-shadow:var(--ring); }
#pageArchiv .ar-search input:focus-visible, #pageArchiv .ar-popsearch input:focus-visible { box-shadow:none; }
#pageArchiv i { font-style:normal; }
#pageArchiv a.ar-btn, #pageArchiv a.ar-tool, #pageArchiv .ar-zu-a { text-decoration:none; }
#pageArchiv .ar-zu-a:hover { text-decoration:underline; }
#pageArchiv [disabled], #pageArchiv .is-dis { opacity:.45; cursor:not-allowed !important; }
#pageArchiv [hidden] { display:none !important; }

/* ── Liste ── */
.ar-list {
  position:relative; flex:0 0 auto; width:var(--ar-listw, 480px); min-width:0;
  display:flex; flex-direction:column; z-index:5;
  background:var(--surface); -webkit-backdrop-filter:blur(24px); backdrop-filter:blur(24px);
  border-right:1px solid var(--border);
}
.ar-top { position:relative; z-index:20; display:flex; flex-direction:column; gap:12px; padding:16px 16px 12px; }
#pageArchiv.is-phone .ar-top { padding:10px 16px 12px; }
.ar-resize { position:absolute; top:0; bottom:0; right:-4px; width:8px; cursor:col-resize; z-index:25; }
.ar-resize:hover, .ar-resize.is-drag { background:linear-gradient(to right, transparent 3px, var(--primary) 3px, var(--primary) 5px, transparent 5px); }

/* Objekt-Kopf */
.ar-objwrap { position:relative; }
.ar-objbtn {
  display:flex; flex-direction:column; align-items:flex-start; gap:2px; width:calc(100% + 12px);
  margin:0 -6px; padding:4px 6px; border:0; border-radius:10px; background:transparent; color:var(--text);
  cursor:pointer; text-align:left; transition:background-color .15s;
}
.ar-objbtn:hover { background:var(--hover); }
.ar-eyebrow { font-size:12px; font-weight:500; color:var(--text-3); }
.ar-objtitle { display:flex; align-items:baseline; gap:8px; max-width:100%; min-width:0; font-size:18px; font-weight:700; letter-spacing:-.02em; }
#pageArchiv.is-phone .ar-objtitle { font-size:19px; }
.ar-objnr { flex-shrink:0; font-variant-numeric:tabular-nums; }
.ar-objaddr { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; color:var(--text-2); }
.ar-objchev { flex-shrink:0; align-self:center; color:var(--text-3); }

/* Popover / Bottom-Sheet */
.ar-scrim { position:fixed; inset:0; z-index:30; background:transparent; }
#pageArchiv.is-phone .ar-scrim { background:var(--scrim); }
.ar-pop {
  position:absolute; top:calc(100% + 8px); left:-6px; z-index:31; width:420px; max-width:calc(100vw - 24px);
  display:flex; flex-direction:column; max-height:560px; overflow:hidden;
  background:var(--surface-solid); border:1px solid var(--border-strong); border-radius:14px; box-shadow:var(--pop-shadow);
}
.ar-fpop { left:-4px; width:400px; }
#pageArchiv.is-narrow .ar-pop { width:calc(100% + 12px); }
#pageArchiv.is-phone .ar-pop {
  position:fixed; left:0; right:0; bottom:0; top:auto; width:auto; max-width:none; max-height:82%;
  border:0; border-radius:20px 20px 0 0; padding-bottom:env(safe-area-inset-bottom);
}
.ar-sheetgrip { display:none; }
#pageArchiv.is-phone .ar-sheetgrip { display:block; width:36px; height:5px; border-radius:3px; background:var(--border-strong); margin:8px auto 2px; }
.ar-pophead { display:flex; align-items:center; justify-content:space-between; padding:12px 14px 4px; font-size:13px; font-weight:600; color:var(--text-2); }
.ar-popsearch {
  display:flex; align-items:center; gap:8px; margin:10px 10px 6px; height:var(--ar-ctrl); padding:0 6px 0 10px;
  border-radius:10px; background:var(--ar-inp); border:1px solid var(--border); color:var(--text-3);
  transition:border-color .15s;
}
.ar-popsearch:focus-within { box-shadow:var(--ring); border-color:transparent; }
.ar-popsearch input { flex:1; min-width:0; height:100%; border:0; outline:none; background:transparent; color:var(--text); font-size:13.5px; }
#pageArchiv.is-touch .ar-popsearch input, #pageArchiv.is-touch .ar-search input { font-size:16px; }
.ar-popbody { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:0 6px 8px; display:flex; flex-direction:column; gap:1px; }
.ar-popfoot {
  display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px;
  border-top:1px solid var(--border);
}
.ar-link { border:0; background:transparent; padding:6px 4px; color:var(--brand-text); font-size:13.5px; font-weight:600; cursor:pointer; }
.ar-x {
  flex-shrink:0; width:28px; height:28px; border:0; border-radius:8px; background:transparent; color:var(--text-3);
  font-size:18px; line-height:1; cursor:pointer;
}
.ar-x:hover { background:var(--hover); color:var(--text); }

.ar-toggles { display:flex; gap:8px; flex-wrap:wrap; padding:2px 10px 8px; }
.ar-tpill {
  display:inline-flex; align-items:center; gap:7px; height:30px; padding:0 12px; border-radius:99px; white-space:nowrap;
  border:1px solid var(--border); background:transparent; color:var(--text-2); font-size:12.5px; font-weight:600; cursor:pointer;
  transition:background-color .15s, border-color .15s;
}
#pageArchiv.is-touch .ar-tpill { height:36px; }
.ar-tpill input { position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }
.ar-tpill i { width:14px; height:14px; border-radius:4px; border:1.5px solid var(--border-strong); }
.ar-tpill.is-on, .ar-tpill:has(input:checked) { background:var(--ar-tint); border-color:transparent; color:var(--brand-text); }
.ar-tpill.is-on i, .ar-tpill:has(input:checked) i { border:0; background:var(--primary); box-shadow:inset 0 0 0 3px var(--surface-solid); }
.ar-tpill:has(input:focus-visible) { box-shadow:var(--ring); }
.ar-range { display:flex; align-items:center; gap:6px; padding:0 12px 8px; font-size:12.5px; color:var(--text-2); }
.ar-inp { width:84px; height:30px; padding:0 8px; border:1px solid var(--border); border-radius:8px; background:var(--ar-inp); color:var(--text); font-size:12.5px; }
.ar-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:6px; height:30px; padding:0 12px;
  border:1px solid var(--border); border-radius:10px; background:var(--ar-inp); color:var(--text);
  font-size:13px; font-weight:600; cursor:pointer; white-space:nowrap; transition:background-color .15s;
}
.ar-btn:hover { background:var(--hover); }
.ar-btn-primary { border-color:transparent; background:var(--primary); color:#fff; }
.ar-btn-primary:hover { background:var(--primary-hover); }
.ar-btn-ghost { border-color:transparent; background:transparent; color:var(--brand-text); }
#pageArchiv.is-touch .ar-btn { height:44px; padding:0 16px; }
.ar-objlist { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:2px 6px 8px; }
.ar-orow {
  display:flex; align-items:center; gap:10px; width:100%; min-height:40px; padding:6px 10px; border:0; border-radius:9px;
  background:transparent; color:var(--text); font-size:13.5px; text-align:left; cursor:pointer;
}
#pageArchiv.is-touch .ar-orow { min-height:48px; }
.ar-orow:hover { background:var(--hover); }
.ar-orow.is-on { background:var(--ar-tint); }
.ar-orow-nr { min-width:58px; font-weight:700; font-variant-numeric:tabular-nums; }
.ar-orow-adr { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-2); }
.ar-orow-n { font-size:12px; color:var(--text-3); font-variant-numeric:tabular-nums; }
.ar-orow-tag { font-size:11px; color:var(--text-3); border:1px solid var(--border); border-radius:99px; padding:0 6px; }
.ar-pleer { padding:14px; text-align:center; color:var(--text-3); font-size:13px; }

/* Suchzeile */
.ar-searchrow { display:flex; gap:8px; align-items:center; }
.ar-search {
  position:relative; flex:1; min-width:0; display:flex; align-items:center; gap:8px; height:var(--ar-ctrl); padding:0 6px 0 12px;
  border-radius:10px; background:var(--ar-inp); border:1px solid var(--border); color:var(--text-3); transition:border-color .15s;
}
.ar-search:focus-within { box-shadow:var(--ring); border-color:transparent; }
.ar-search input { flex:1; min-width:0; height:100%; border:0; outline:none; background:transparent; color:var(--text); font-size:13.5px; }
.ar-search input::placeholder, .ar-popsearch input::placeholder { color:var(--text-3); }
.ar-sq {
  width:var(--ar-ctrl); height:var(--ar-ctrl); flex-shrink:0; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--border); border-radius:10px; background:var(--ar-inp); color:var(--text-2); cursor:pointer;
  transition:background-color .15s, border-color .15s;
}
.ar-sq:hover { background:var(--hover); }
.ar-sq.is-on { border-color:transparent; background:var(--ar-tint); color:var(--brand-text); box-shadow:inset 0 0 0 1px var(--brand); }
#archivSuchDrop { background:var(--surface-solid); border:1px solid var(--border-strong); border-radius:10px; box-shadow:var(--pop-shadow); overflow-y:auto; color:var(--text); }

/* Filterleiste (2a) */
.ar-fwrap { position:relative; }
.ar-fbar { display:flex; flex-wrap:wrap; gap:6px; }
.ar-fb {
  display:inline-flex; align-items:center; gap:6px; height:var(--ar-fb); max-width:100%; padding:0 10px 0 12px;
  border:1px solid var(--border); border-radius:8px; background:var(--ar-inp); color:var(--text-2);
  font-size:13px; font-weight:500; white-space:nowrap; cursor:pointer; transition:background-color .15s, border-color .15s;
}
.ar-fb > span { overflow:hidden; text-overflow:ellipsis; }
.ar-fb svg { flex-shrink:0; }
.ar-fb:hover { background:var(--hover); }
.ar-fb.is-on { border-color:transparent; background:var(--ar-tint); color:var(--brand-text); font-weight:600; box-shadow:inset 0 0 0 1px var(--brand); }
.ar-fb.is-open { box-shadow:var(--ring); }
.ar-fb.is-on.is-open { box-shadow:inset 0 0 0 1px var(--brand), var(--ring); }

.ar-chips { display:flex; flex-wrap:wrap; gap:6px; }
.ar-chip {
  display:inline-flex; align-items:center; gap:2px; height:28px; padding:0 3px 0 10px; border-radius:99px;
  background:var(--ar-tint); color:var(--brand-text); font-size:12.5px; font-weight:600;
}
.ar-chip button { width:22px; height:22px; border:0; border-radius:50%; background:transparent; color:inherit; cursor:pointer; font-size:15px; line-height:1; }
.ar-chip button:hover { background:var(--ar-tint-strong); }
.ar-meta { display:flex; justify-content:space-between; gap:8px; font-size:12px; color:var(--text-3); min-height:16px; }
.ar-meta span:first-child { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Popover-Inhalte */
.ar-sec { padding:8px 10px 4px; font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--text-3); }
.ar-pills { display:flex; flex-wrap:wrap; gap:6px; padding:0 10px 8px; }
.ar-pill {
  display:inline-flex; align-items:center; gap:6px; height:30px; padding:0 12px; border-radius:99px;
  border:1px solid var(--border); background:var(--ar-inp); color:var(--text-2); font-size:13px; font-weight:600; cursor:pointer;
}
#pageArchiv.is-touch .ar-pill { height:36px; }
.ar-pill.is-on { border-color:transparent; background:var(--text); color:var(--surface-solid); }
.ar-grp {
  display:flex; align-items:center; gap:10px; width:100%; min-height:36px; padding:0 10px; border:0; border-radius:8px;
  background:transparent; color:var(--text); cursor:pointer; text-align:left; font-size:13.5px;
}
#pageArchiv.is-touch .ar-grp { min-height:46px; }
.ar-grp.is-open { background:var(--hover); }
.ar-grp-chev { flex-shrink:0; color:var(--text-3); transition:transform .15s; }
.ar-grp.is-open .ar-grp-chev { transform:rotate(90deg); }
.ar-grp-l { flex:1; min-width:0; font-weight:600; }
.ar-grp-s { font-size:12px; color:var(--text-3); white-space:nowrap; }
.ar-grp-s.is-sel { color:var(--brand-text); font-weight:600; }
.ar-opt {
  display:flex; align-items:center; gap:10px; width:100%; min-height:34px; padding:4px 10px; border:0; border-radius:8px;
  background:transparent; color:var(--text); font-size:13.5px; text-align:left; cursor:pointer;
}
#pageArchiv.is-touch .ar-opt { min-height:44px; }
.ar-opt:hover { background:var(--hover); }
.ar-opt.is-on { background:var(--ar-tint); }
.ar-opt.is-in { padding-left:32px; }
.ar-opt.is-in.is-on { background:transparent; }
.ar-opt.is-leer { opacity:.4; cursor:default; }
.ar-opt.is-leer:hover { background:transparent; }
.ar-opt-l { flex:1; min-width:0; display:flex; flex-direction:column; }
.ar-opt-l b { font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ar-opt-l small { font-size:12px; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ar-opt-n { font-size:12.5px; color:var(--text-3); font-variant-numeric:tabular-nums; }
.ar-cb {
  width:18px; height:18px; flex-shrink:0; border-radius:6px; border:1.5px solid var(--border-strong);
  display:flex; align-items:center; justify-content:center; color:transparent; transition:background-color .15s, border-color .15s;
}
.is-on > .ar-cb, .ar-cb.is-on { border:1px solid var(--primary); background:var(--primary); color:#fff; }
.ar-radio { width:18px; height:18px; flex-shrink:0; border-radius:50%; border:1.5px solid var(--border-strong); }
.is-on > .ar-radio { border:5px solid var(--primary); background:#fff; }

/* Avatare */
.ar-av {
  width:18px; height:18px; flex-shrink:0; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:8px; font-weight:700; background:var(--ar-tint); color:var(--brand-text);
}
.ar-av.is-firma { border-radius:5px; background:var(--press); color:var(--text-2); }
.ar-av.ar-av28 { width:28px; height:28px; font-size:10.5px; }
.ar-av.ar-av28.is-firma { border-radius:8px; }
.ar-av.ar-av40 { width:40px; height:40px; font-size:13px; }
.ar-av.ar-av40.is-firma { border-radius:11px; }

/* Dateisymbol */
.ar-fi {
  position:relative; width:24px; height:28px; flex-shrink:0; border-radius:4px 7px 4px 4px;
  display:flex; align-items:flex-end; justify-content:center; padding-bottom:4px; box-sizing:border-box;
  font-size:8.5px; font-weight:700; letter-spacing:.02em;
  background:var(--ar-gray-f); color:var(--ar-gray-t); box-shadow:inset 0 0 0 1px var(--ar-gray-k);
}
.ar-fi::after { content:''; position:absolute; top:0; right:0; width:7px; height:7px; border-radius:0 6px 0 3px; background:var(--ar-gray-k); }
.ar-fi.ar-fi34 { width:34px; height:42px; border-radius:5px 9px 5px 5px; padding-bottom:6px; font-size:10px; margin-top:2px; }
.ar-fi.ar-fi34::after { width:10px; height:10px; border-radius:0 8px 0 4px; }
.ar-fi.g-blue { background:var(--ar-blue-f); color:var(--ar-blue-t); box-shadow:inset 0 0 0 1px var(--ar-blue-k); }
.ar-fi.g-blue::after { background:var(--ar-blue-k); }
.ar-fi.g-teal { background:var(--ar-teal-f); color:var(--ar-teal-t); box-shadow:inset 0 0 0 1px var(--ar-teal-k); }
.ar-fi.g-teal::after { background:var(--ar-teal-k); }
.ar-fi.g-orange { background:var(--ar-orange-f); color:var(--ar-orange-t); box-shadow:inset 0 0 0 1px var(--ar-orange-k); }
.ar-fi.g-orange::after { background:var(--ar-orange-k); }
.ar-fi.g-violet { background:var(--ar-violet-f); color:var(--ar-violet-t); box-shadow:inset 0 0 0 1px var(--ar-violet-k); }
.ar-fi.g-violet::after { background:var(--ar-violet-k); }

/* Ergebnisliste */
.ar-scroll { flex:1 1 0; min-height:0; overflow:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
#pageArchiv.is-selmode .ar-scroll { padding-bottom:64px; }
.ar-t { display:flex; flex-direction:column; min-width:var(--ar-tmin, 0); }
.ar-th, .ar-tr { display:grid; grid-template-columns:var(--ar-grid); align-items:center; padding:0 16px; }
.ar-th {
  position:sticky; top:0; z-index:3; height:36px; background:var(--ar-head); border-bottom:1px solid var(--border);
}
.ar-th > button {
  display:flex; align-items:center; gap:4px; height:36px; min-width:0; padding:0 8px; border:0; background:transparent;
  font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--text-3);
  white-space:nowrap; cursor:pointer;
}
.ar-th > button.is-r { justify-content:flex-end; }
.ar-th > button.is-first { padding-left:0; }
.ar-th > button.is-sort { color:var(--text); }
.ar-th > button b { color:var(--brand-text); font-size:11px; font-weight:600; }
.ar-th > button:hover { color:var(--text); }
.ar-colbtn { position:absolute; right:8px; top:4px; width:28px; height:28px; border:0; border-radius:7px; background:transparent; color:var(--text-3); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.ar-colbtn:hover, .ar-colbtn.is-on { background:var(--ar-tint); color:var(--brand-text); }
.ar-colpop { position:absolute; right:8px; top:38px; z-index:31; width:220px; padding:6px; background:var(--surface-solid); border:1px solid var(--border-strong); border-radius:14px; box-shadow:var(--pop-shadow); }
.ar-colpop .ar-opt { min-height:32px; font-size:13px; }
.ar-colpop .ar-cb { width:16px; height:16px; border-radius:5px; }
.ar-tr {
  height:var(--ar-row); font-size:13.5px; border-bottom:1px solid var(--border); cursor:pointer;
  transition:background-color .15s;
}
#pageArchiv.is-kompakt:not(.is-touch) .ar-tr { height:34px; }
.ar-tr:hover { background:var(--hover); }
.ar-tr.is-sel { background:var(--ar-tint); }
.ar-tr.is-akt { background:var(--ar-tint-strong); box-shadow:inset 3px 0 0 var(--primary); }
.ar-tr > span { min-width:0; padding:0 8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-2); }
.ar-tr > span.is-r { text-align:right; font-variant-numeric:tabular-nums; }
.ar-tr > .ar-tc-titel { display:flex; align-items:center; gap:10px; padding-left:0; color:var(--text); }
.ar-tc-titel .ar-tt { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; }
.ar-tr > .ar-tc-bezug { display:flex; align-items:center; gap:6px; color:var(--text); }
.ar-tc-bezug .ar-bz { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.ar-muted { color:var(--text-3) !important; }

/* Kartenmodus */
.ar-day {
  position:sticky; top:0; z-index:2; display:flex; justify-content:space-between; padding:10px 20px 6px;
  font-size:12px; font-weight:600; color:var(--text-3); background:var(--ar-head);
}
.ar-cards { padding:0 4px; }
.ar-card { display:flex; align-items:flex-start; gap:12px; padding:0 12px; border-radius:10px; cursor:pointer; transition:background-color .15s; }
.ar-card:hover { background:var(--hover); }
.ar-card.is-sel { background:var(--ar-tint); }
.ar-card.is-akt { background:var(--ar-tint-strong); }
.ar-card > .ar-cb { align-self:center; width:20px; height:20px; border-radius:7px; }
.ar-cbody { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; padding:12px 0; border-bottom:1px solid var(--border); }
.ar-card.is-last .ar-cbody, .ar-card.is-akt .ar-cbody { border-bottom-color:transparent; }
.ar-c1 { display:flex; align-items:baseline; gap:8px; }
.ar-ct { flex:1; min-width:0; font-size:14.5px; font-weight:600; letter-spacing:-.005em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#pageArchiv.is-touch .ar-ct { font-size:15px; }
.ar-cd { flex-shrink:0; font-size:12px; color:var(--text-3); font-variant-numeric:tabular-nums; }
.ar-c2 { display:flex; align-items:center; gap:6px; font-size:13px; color:var(--text); min-width:0; }
.ar-c2 .ar-bz { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ar-c3 { font-size:12px; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Laden / leer */
.ar-skel { display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--border); }
.ar-skel i { display:block; height:10px; border-radius:5px; background:var(--ar-skel); }
.ar-skel i.ar-skel-fi { width:24px; height:28px; border-radius:4px; flex-shrink:0; }
.ar-empty { display:flex; flex-direction:column; align-items:center; gap:8px; padding:56px 24px; text-align:center; color:var(--text-3); }
.ar-empty svg { color:var(--text-3); margin-bottom:4px; }
.ar-empty b { font-size:15px; font-weight:600; color:var(--text); }
.ar-empty span { font-size:13px; max-width:280px; }
.ar-empty .ar-btn { margin-top:6px; height:var(--ar-ctrl); padding:0 16px; }
.ar-fehler { color:var(--red, #dc2626); }

/* Auswahlleiste */
.ar-selbar {
  position:absolute; left:12px; right:12px; bottom:12px; z-index:21; display:flex; align-items:center; gap:8px;
  padding:8px 8px 8px 16px; border-radius:14px; background:var(--surface-solid); border:1px solid var(--border-strong); box-shadow:var(--pop-shadow);
}
.ar-selbar-t { flex:1; min-width:0; font-size:13.5px; font-weight:600; }
#pageArchiv.is-phone .ar-selbar { left:8px; right:8px; bottom:calc(8px + env(safe-area-inset-bottom)); }

/* ── Detail: Viewer + Inspector ── */
.ar-detail { position:relative; flex:1 1 0; min-width:0; display:flex; flex-direction:column; }
.ar-vbar {
  display:flex; align-items:center; gap:6px; min-height:60px; padding:10px 12px 10px 16px; flex-shrink:0;
  border-bottom:1px solid var(--border); background:var(--surface); -webkit-backdrop-filter:blur(24px); backdrop-filter:blur(24px);
}
#pageArchiv.is-phone .ar-vbar { min-height:56px; padding:6px 8px 6px 4px; }
.ar-back { display:none; align-items:center; gap:2px; height:40px; padding:0 8px 0 2px; border:0; background:transparent; color:var(--brand-text); font-size:15px; font-weight:500; cursor:pointer; flex-shrink:0; }
#pageArchiv.is-narrow .ar-back { display:inline-flex; }
.ar-nav { display:flex; gap:2px; flex-shrink:0; }
#pageArchiv.is-narrow .ar-nav { display:none; }
.ar-ib {
  width:32px; height:32px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  border:0; border-radius:9px; background:transparent; color:var(--text-2); cursor:pointer; transition:background-color .15s;
}
#pageArchiv.is-touch .ar-ib { width:40px; height:40px; }
.ar-ib:hover { background:var(--hover); }
.ar-ib:disabled { opacity:.35; cursor:default !important; }
.ar-ib.is-on { background:var(--ar-tint); color:var(--brand-text); }
.ar-vtitle { flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; padding:0 4px; }
.ar-vtitle h3 { margin:0; font-size:14px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ar-vtitle span { font-size:12px; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ar-zoom { display:flex; align-items:center; gap:2px; height:32px; padding:0 3px; border:1px solid var(--border); border-radius:99px; background:var(--ar-inp); flex-shrink:0; }
.ar-zoom button { width:26px; height:26px; border:0; border-radius:50%; background:transparent; color:var(--text-2); font-size:16px; line-height:1; cursor:pointer; }
.ar-zoom button:hover { background:var(--hover); }
.ar-zoom span { min-width:44px; text-align:center; font-size:12.5px; font-weight:600; font-variant-numeric:tabular-nums; }
#pageArchiv.is-phone .ar-zoom { display:none !important; }
.ar-tool {
  display:inline-flex; align-items:center; justify-content:center; gap:6px; height:32px; min-width:32px; padding:0 8px; flex-shrink:0;
  border:0; border-radius:9px; background:transparent; color:var(--text-2); font-size:13px; font-weight:500; white-space:nowrap;
  cursor:pointer; text-decoration:none; transition:background-color .15s;
}
#pageArchiv.is-touch .ar-tool { height:40px; min-width:40px; }
.ar-tool:hover { background:var(--hover); color:var(--text); }
.ar-tl { display:none; }
#pageArchiv.is-labels .ar-tl { display:inline; }
#pageArchiv.is-narrow .ar-insp-btn { display:none; }

.ar-seg { display:none; margin:8px 12px; padding:2px; gap:2px; border-radius:9px; background:var(--surface-2); flex-shrink:0; }
#pageArchiv.is-narrow .ar-seg { display:flex; }
.ar-seg button { flex:1; height:32px; border:0; border-radius:7px; background:transparent; color:var(--text-3); font-size:13.5px; font-weight:500; cursor:pointer; }
.ar-seg button[aria-selected="true"] { background:var(--surface-solid); color:var(--text); font-weight:600; box-shadow:0 1px 2px rgba(0,0,0,.12), 0 0 0 .5px var(--border); }

.ar-dbody { position:relative; flex:1 1 0; min-height:0; display:flex; }
.ar-viewer { flex:1 1 0; min-width:0; display:flex; background:var(--ar-paper); }
#archivPreviewContent {
  width:100%; height:100%; display:flex; align-items:center; justify-content:center; box-sizing:border-box;
  color:var(--text-3); cursor:pointer; padding:28px;
}
#pageArchiv.is-phone #archivPreviewContent { padding:12px; }
#archivPreviewContent img { box-shadow:0 1px 3px rgba(0,0,0,.18), 0 12px 32px rgba(0,0,0,.18); border-radius:4px; background:#fff; }
#archivPreviewContent canvas { box-shadow:0 1px 3px rgba(0,0,0,.18), 0 12px 32px rgba(0,0,0,.18); border-radius:4px; }

.ar-insp {
  width:320px; flex-shrink:0; overflow-y:auto; overscroll-behavior:contain;
  border-left:1px solid var(--border); background:var(--surface); -webkit-backdrop-filter:blur(24px); backdrop-filter:blur(24px);
}
#pageArchiv.is-w1700 .ar-insp { width:360px; }
#pageArchiv.is-desk.insp-aus .ar-insp { display:none; }
#pageArchiv.is-tabL .ar-insp {
  position:absolute; top:0; right:0; bottom:0; width:340px; z-index:50; display:none;
  background:var(--surface-solid); border-left:1px solid var(--border-strong); box-shadow:var(--pop-shadow);
}
#pageArchiv.is-tabL.insp-overlay .ar-insp { display:block; }
.ar-insp-scrim { position:absolute; inset:0; z-index:49; background:var(--scrim); }
#pageArchiv.is-narrow .ar-insp { display:none; width:auto; flex:1 1 0; border-left:0; }
#pageArchiv.is-narrow.seg-details .ar-insp { display:block; }
#pageArchiv.is-narrow.seg-details .ar-viewer { display:none; }

.ar-ih { padding:18px 18px 14px; border-bottom:1px solid var(--border); display:flex; flex-direction:column; gap:6px; }
.ar-ih-e { font-size:12.5px; font-weight:600; color:var(--text-3); }
.ar-ih-t { margin:0; font-size:17px; font-weight:600; line-height:1.3; text-wrap:pretty; overflow-wrap:anywhere; }
.ar-ih-b { display:flex; gap:8px; margin-top:8px; }
.ar-ih-b > * { flex:1; height:36px; }
#pageArchiv.is-touch .ar-ih-b > * { height:44px; }
.ar-isec { padding:14px 18px; border-bottom:1px solid var(--border); }
.ar-isec h4 { margin:0 0 8px; font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--text-3); }
.ar-zu {
  display:flex; align-items:center; gap:12px; width:100%; padding:10px; border:1px solid var(--border); border-radius:12px;
  background:var(--ar-inp); color:var(--text); text-align:left; cursor:pointer; transition:background-color .15s;
}
.ar-zu:hover { background:var(--hover); }
.ar-zu-l { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.ar-zu-l b { font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ar-zu-l small { font-size:12px; color:var(--text-3); }
.ar-zu-a { display:inline-block; margin-top:6px; font-size:12.5px; color:var(--brand-text); cursor:pointer; }
.ar-fld { display:grid; grid-template-columns:auto minmax(0,1fr); gap:6px 12px; font-size:13.5px; }
.ar-fld dt { color:var(--text-3); }
.ar-fld dd { margin:0; font-weight:500; text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-variant-numeric:tabular-nums; }
.ar-fld dd.is-leer { color:var(--text-3); }
.ar-rel { display:flex; flex-direction:column; width:100%; padding:7px 8px; margin:0 -8px; border:0; border-radius:8px; background:transparent; text-align:left; cursor:pointer; color:var(--text); }
.ar-rel:hover { background:var(--hover); }
.ar-rel b { font-size:13px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ar-rel small { font-size:12px; color:var(--text-3); }

.ar-nodoc { display:none; flex:1; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:var(--text-3); font-size:13.5px; background:var(--ar-paper); }
#pageArchiv:not(.has-doc) .ar-vbar, #pageArchiv:not(.has-doc) .ar-seg, #pageArchiv:not(.has-doc) .ar-dbody { display:none; }
#pageArchiv:not(.has-doc) .ar-nodoc { display:flex; }

/* Push-Navigation (iPad hoch, iPhone) */
#pageArchiv.is-narrow .ar-list { width:100%; flex:1 1 auto; border-right:0; }
#pageArchiv.is-narrow .ar-resize { display:none; }
#pageArchiv.is-narrow .ar-detail { display:none; }
#pageArchiv.is-narrow.is-detail .ar-list { display:none; }
#pageArchiv.is-narrow.is-detail .ar-detail { display:flex; }

/* Toast */
.ar-toast {
  position:fixed; left:50%; bottom:calc(24px + env(safe-area-inset-bottom)); transform:translateX(-50%); z-index:9000;
  display:flex; align-items:center; gap:8px; padding:10px 16px; border-radius:12px;
  background:var(--text); color:var(--surface-solid); font-size:13.5px; font-weight:500; box-shadow:var(--pop-shadow);
}
.ar-toast svg { color:var(--ar-ok); }