/* Beute (Download-Hub) — isolierte ES-Modul-Insel.
   CSS-Variablen-Shim: mappt v14-Namen auf v11-Palette, scoped auf den Tab. */
#tab-beute {
  --accent: var(--tertiary);
  --text: var(--on-surface);
  --text-dim: var(--on-surface-var);
  --outline-soft: var(--outline-var);
  --elev-2: var(--elevation-2);
  --success: var(--neon-green);
  --ok: var(--neon-green);
  --mono: var(--font-mono);
  --serif: var(--font-serif);
}

/* ── Hub-Shell: Segment-Leiste + Views ── */
.hub-seg { display:none; }
.hub-seg.visible {
  display:flex; gap:8px; flex-wrap:wrap;
  position:sticky; top:0; z-index:5;
  padding:8px 0; margin-bottom:4px;
  background:linear-gradient(180deg, var(--bg, var(--surface)) 70%, transparent);
}
.hub-seg-btn {
  display:inline-flex; align-items:center; gap:6px;
  min-height:44px; padding:0 16px;
  border:1px solid var(--outline); border-radius:999px;
  background:var(--surface-bright); color:var(--text-dim);
  font-size:13px; font-weight:600; font-family:inherit;
  cursor:pointer; transition:all .12s;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.hub-seg-btn:hover { color:var(--text); }
.hub-seg-btn:active { transform:scale(.97); }
.hub-seg-btn.active {
  background:var(--accent); color:var(--surface);
  border-color:transparent; font-weight:700;
}
.hub-seg-ic { font-size:14px; }
.hub-panel { display:none; }
.hub-panel.active {
  display:flex; flex-direction:column; gap:12px;
  animation:hubIn .2s ease-out;
}
@keyframes hubIn { from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none} }
@media (prefers-reduced-motion: reduce) { .hub-panel.active { animation:none; } }

.btn-primary {
  min-height: 44px; border-radius: var(--radius-s); border: none;
  cursor: pointer; font-weight: 600; touch-action: manipulation;
  background: var(--tertiary); color: #000;
}
.btn-primary:hover { background: color-mix(in oklab, var(--tertiary) 80%, white); }

/* ── Beute-Regeln ── */
.grab-bar { display:flex; gap:10px; }
.grab-bar input { flex:1; }
.grab-bar .btn-primary { min-height:48px; padding:0 18px; white-space:nowrap; }
.grab-target { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.grab-target-label { font-family:var(--mono); font-size:11px; color:var(--text-dim); text-transform:uppercase; }
.grab-target select { min-width:160px; min-height:44px; }
.grab-target #grab-newcat { flex:1; min-width:140px; min-height:44px; }
.grab-chips { display:flex; gap:8px; flex-wrap:wrap; }
.grab-chip {
  padding:7px 12px; min-height:40px;
  border:1px solid var(--outline); border-radius:999px;
  background:var(--surface-bright); color:var(--text-dim);
  font-size:12px; cursor:pointer; transition:all .12s;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.grab-chip:hover { color:var(--text); }
.grab-chip.active { background:var(--accent); color:#000; border-color:var(--accent); }
.grab-results { display:flex; flex-direction:column; gap:8px; }
.grab-card {
  display:flex; align-items:center; gap:12px;
  padding:10px 12px;
  background:var(--surface-bright); border:1px solid var(--outline-soft);
  border-left:3px solid var(--accent); border-radius:var(--radius-s);
}
.grab-card.g-movies { border-left-color:#f87171; }
.grab-card.g-tv { border-left-color:#60a5fa; }
.grab-card.g-audio { border-left-color:#22d3ee; }
.grab-card.g-games { border-left-color:#a78bfa; }
.grab-card.g-software { border-left-color:#facc15; }
.grab-card.g-books { border-left-color:#40e880; }
.grab-card.g-other { border-left-color:var(--text-dim); }
.grab-ic { font-size:24px; line-height:1; flex:0 0 auto; width:32px; text-align:center; }
.grab-main { flex:1; min-width:0; }
.grab-title { font-family:var(--mono); font-size:13px; word-break:break-word; line-height:1.35; }
.grab-badges { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.grab-badge {
  font-family:var(--mono); font-size:10px; padding:2px 7px;
  border-radius:999px; background:var(--surface-high); color:var(--text);
}
.grab-badge.dim { color:var(--text-dim); background:transparent; border:1px solid var(--outline-soft); }
.grab-badge.src { color:var(--accent); background:transparent; border:1px solid color-mix(in oklab, var(--accent) 45%, transparent); }
.grab-badge.have { color:#000; background:var(--success, #4cd964); }
.grab-card.has { opacity:.82; }

.grab-controls { display:none; align-items:center; flex-wrap:wrap; gap:8px; margin:2px 0 2px; }
.grab-controls.visible { display:flex; }
.grab-controls-label { font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--text-dim); }
.grab-sort { width:auto; min-width:110px; }
.grab-filter { width:84px; }
.grab-de-toggle {
  font-family:var(--mono); font-size:11px; padding:6px 10px; min-height:32px;
  border-radius:999px; background:transparent; border:1px solid var(--outline-soft); color:var(--text-dim);
}
.grab-de-toggle.active { background:var(--accent); color:#000; border-color:var(--accent); }
.grab-badge.de { background:transparent; border:1px solid var(--outline-soft); padding:1px 5px; }
.grab-dl {
  flex:0 0 auto; width:48px; height:48px; border-radius:var(--radius-s);
  border:1px solid var(--accent); background:transparent; color:var(--accent);
  font-size:20px; cursor:pointer; transition:all .12s;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.grab-dl:hover { background:var(--accent); color:#000; }
.grab-dl:active { transform:scale(.95); }
.grab-dl:disabled { opacity:.6; cursor:default; }
.grab-empty { text-align:center; padding:40px 16px; color:var(--text-dim); }
.grab-empty-ic { font-size:40px; margin-bottom:10px; }
.grab-skeletons { display:flex; flex-direction:column; gap:8px; }
.grab-skel { height:64px; border-radius:var(--radius-s); background:var(--surface-bright); animation:grab-shimmer 1.2s infinite; }
@keyframes grab-shimmer { 0%,100% { opacity:.5; } 50% { opacity:.9; } }
.grab-status { display:none; }
.grab-status.visible { display:block; background:var(--surface-high); border-radius:var(--radius-s); padding:10px 12px; }
.grab-status-head { font-family:var(--mono); font-size:10px; text-transform:uppercase; color:var(--text-dim); margin-bottom:6px; }
.grab-st-row { display:grid; grid-template-columns:1fr auto; gap:8px 10px; align-items:center; padding:4px 0; }
.grab-st-info { min-width:0; display:flex; flex-direction:column; }
.grab-st-title { font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.grab-st-cat { font-family:var(--mono); font-size:10px; color:var(--text-dim); }
.grab-st-mark { font-family:var(--mono); font-size:12px; color:var(--accent); }
.grab-st-row.done .grab-st-mark { color:var(--ok); }
.grab-st-row.failed .grab-st-mark { color:var(--danger); }
.grab-st-bar { grid-column:1 / -1; height:4px; border-radius:999px; background:var(--surface-bright); overflow:hidden; }
.grab-st-fill { height:100%; background:var(--accent); transition:width .4s; }
@media (prefers-reduced-motion: reduce) { .grab-skel { animation:none; } }

.grab-health { display:none; }
.grab-health.visible { display:flex; flex-direction:column; gap:8px; }
.grab-health-card {
  display:flex; align-items:center; gap:12px;
  background:var(--surface-high); border:1px solid var(--neon-yellow, #c8a030);
  border-radius:var(--radius-s); padding:10px 12px;
}
.grab-health-ic { font-size:20px; flex-shrink:0; }
.grab-health-main { flex:1; min-width:0; }
.grab-health-title { font-size:13px; font-weight:700; color:var(--text); }
.grab-health-detail { font-family:var(--mono); font-size:11px; color:var(--text-dim); margin-top:2px; overflow:hidden; text-overflow:ellipsis; }
.grab-health-btn {
  min-height:44px; padding:0 14px; flex-shrink:0;
  background:var(--accent); color:var(--surface);
  border:none; border-radius:var(--radius-s); cursor:pointer;
  font-size:12px; font-weight:700; font-family:inherit; touch-action:manipulation;
}
.grab-health-btn:active { transform:scale(.97); }
.grab-health-btn:disabled { opacity:.5; }

.grab-picker {
  position:fixed; inset:0; z-index:210;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.55); padding:20px;
}
.grab-picker-card {
  background:var(--surface); border:1px solid var(--outline);
  border-radius:var(--radius-m); box-shadow:var(--elevation-2);
  width:100%; max-width:480px; max-height:80vh;
  display:flex; flex-direction:column;
  overscroll-behavior:contain;
}
.grab-picker-head {
  display:flex; align-items:flex-start; gap:12px;
  padding:14px 16px; border-bottom:1px solid var(--outline-var);
}
.grab-picker-head > div:first-child { flex:1; min-width:0; }
.grab-picker-title { font-size:15px; font-weight:700; color:var(--text); }
.grab-picker-sub {
  font-family:var(--mono); font-size:11px; color:var(--text-dim);
  margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.grab-picker-close {
  min-width:44px; min-height:44px; flex-shrink:0;
  background:transparent; border:none; border-radius:var(--radius-s);
  color:var(--text); font-size:16px; cursor:pointer; touch-action:manipulation;
}
.grab-picker-close:hover { background:var(--surface-bright); }
.grab-picker-list {
  display:flex; flex-direction:column; gap:6px;
  padding:12px 16px; overflow-y:auto; overscroll-behavior:contain;
}
.grab-picker-item {
  display:flex; align-items:center; gap:10px; text-align:left;
  min-height:48px; padding:8px 12px;
  background:var(--surface-bright); border:1px solid var(--outline);
  border-radius:var(--radius-s); color:var(--text);
  font-size:14px; font-family:inherit; cursor:pointer;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
  transition:border-color .12s;
}
.grab-picker-item:hover { border-color:var(--accent); }
.grab-picker-item:active { transform:scale(.99); }
.grab-picker-item.busy { opacity:.5; }
.grab-picker-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; }
.grab-picker-err { font-size:13px; color:var(--text-dim); padding:4px 2px; }
.grab-picker-foot {
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:12px 16px; border-top:1px solid var(--outline-var);
}
.grab-picker-root { min-height:44px; min-width:180px; }

/* ── Direkt-View ── */
.direct-form { display:flex; flex-direction:column; gap:10px; }
.direct-urls {
  width:100%; min-height:96px; resize:vertical;
  font-family:var(--mono); font-size:13px; line-height:1.5;
  padding:10px 12px;
}
.direct-pkg { flex:1; min-width:160px; min-height:44px; }
.direct-cat { min-width:200px; min-height:44px; }
.direct-more summary {
  cursor:pointer; font-family:var(--mono); font-size:11px;
  text-transform:uppercase; color:var(--text-dim);
  min-height:44px; display:flex; align-items:center;
}
.direct-more-body { display:flex; flex-direction:column; gap:8px; padding:4px 0 2px; }
.direct-more-body input { min-height:44px; }
.direct-submit-row { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.direct-submit-row .btn-primary { min-height:48px; padding:0 20px; }
.direct-hint {
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--mono); font-size:11px; color:var(--text-dim);
}
.direct-jd-dot {
  width:9px; height:9px; border-radius:50%; flex-shrink:0;
  background:var(--text-dim); opacity:.6;
}
.direct-jd-dot.alive { background:var(--ok); opacity:1; }
.direct-list { display:flex; flex-direction:column; gap:6px; }
.direct-row {
  display:grid; grid-template-columns:1fr auto; gap:6px 10px; align-items:center;
  background:var(--surface-bright); border:1px solid var(--outline-soft);
  border-radius:var(--radius-s); padding:10px 12px;
}
.direct-row-main { min-width:0; }
.direct-row-title { font-size:13px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.direct-row-meta { font-family:var(--mono); font-size:11px; color:var(--text-dim); margin-top:2px; }
.direct-row-err { font-size:12px; color:var(--danger, #e05a5a); margin-top:3px; }
.direct-row.s-moved, .direct-row.s-done { opacity:.75; }
.direct-row .grab-st-bar { grid-column:1 / -1; }

/* ── ROMs-View ── */
.roms-grid {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr));
  gap:10px;
}
.roms-tile {
  display:flex; align-items:center; gap:10px; text-align:left;
  min-height:64px; padding:10px 12px;
  background:var(--surface-bright); border:1px solid var(--outline-soft);
  border-left:3px solid var(--tile-accent, var(--accent));
  border-radius:var(--radius-s); color:var(--text);
  font-family:inherit; cursor:pointer; transition:border-color .12s, transform .1s;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.roms-tile:hover { border-color:var(--tile-accent, var(--accent)); }
.roms-tile:active { transform:scale(.98); }
.roms-tile.active { border-color:var(--tile-accent, var(--accent)); background:var(--surface-high); }
.roms-tile-ic { font-size:22px; flex-shrink:0; }
.roms-tile-main { display:flex; flex-direction:column; gap:4px; min-width:0; }
.roms-tile-name { font-size:13px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.roms-tile-badges { display:flex; gap:6px; flex-wrap:wrap; }
.roms-tile-count { font-family:var(--mono); font-size:10px; color:var(--text-dim); }
.roms-tile-flag {
  font-family:var(--mono); font-size:10px; padding:1px 6px;
  border-radius:999px; border:1px solid var(--outline-soft); color:var(--text-dim);
}
.roms-tile-flag.warn { color:var(--neon-yellow, #c8a030); border-color:var(--neon-yellow, #c8a030); }
.roms-detail { display:none; }
.roms-detail.open {
  display:flex; flex-direction:column; gap:12px;
  background:var(--surface-high); border:1px solid var(--outline-soft);
  border-radius:var(--radius-s); padding:14px;
}
.roms-detail-head { display:flex; align-items:center; gap:10px; }
.roms-detail-title { flex:1; font-size:15px; font-weight:700; }
.roms-detail-close {
  min-width:44px; min-height:44px;
  background:transparent; border:none; border-radius:var(--radius-s);
  color:var(--text); font-size:15px; cursor:pointer; touch-action:manipulation;
}
.roms-detail-close:hover { background:var(--surface-bright); }
.roms-url-hint { font-size:13px; color:var(--text-dim); }
.roms-url-row input { flex:1; min-height:44px; }
.roms-bios { display:flex; flex-direction:column; gap:6px; }
.roms-bios-row { display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:12px; }
.roms-bios-mark { width:16px; text-align:center; }
.roms-bios .grab-health-btn { align-self:flex-start; margin-top:4px; }
.roms-jobs { display:flex; flex-direction:column; gap:6px; }
.roms-job-stop {
  min-width:44px; min-height:44px;
  background:transparent; border:1px solid var(--outline-soft); border-radius:var(--radius-s);
  color:var(--text-dim); cursor:pointer; touch-action:manipulation;
}
.roms-job-stop:hover { color:var(--danger, #e05a5a); border-color:var(--danger, #e05a5a); }

/* ── Aktivitaet-View ── */
.act-body { display:flex; flex-direction:column; gap:16px; }
.act-section { display:flex; flex-direction:column; gap:6px; }

/* ═══ EDITORIAL INK — Beute-Insel-Overrides (v12) ═══ */
#tab-beute .hub-seg{gap:26px;background:none;padding:8px 0;border-bottom:1px solid var(--ink16);margin-bottom:8px}
#tab-beute .hub-seg-btn{
  min-height:auto;padding:0 0 6px;border:none;border-radius:0;background:none;
  border-bottom:2px solid transparent;color:var(--ink45);
  font-family:var(--font-mono);font-size:13px;font-weight:400;
}
#tab-beute .hub-seg-btn:hover{color:var(--ink);background:none}
#tab-beute .hub-seg-btn.active{color:var(--ink);background:none;border-bottom-color:var(--accent);font-weight:400}
#tab-beute .hub-seg-ic{display:inline-flex;color:currentColor}

#tab-beute .btn-primary{background:var(--accent);color:var(--bg);border-radius:0;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:0 16px}
#tab-beute input,#tab-beute select,#tab-beute textarea{
  background:none;border:none;border-bottom:1px solid var(--ink16);border-radius:0;color:var(--ink);
  font-family:var(--font-sans);
}
#tab-beute input:focus,#tab-beute select:focus,#tab-beute textarea:focus{border-bottom-color:var(--accent);outline:none}
#tab-beute .grab-bar input{font-family:var(--font-serif);font-style:italic;font-size:22px}

#tab-beute .grab-chip{
  min-height:auto;padding:0 0 4px;border:none;border-radius:0;background:none;
  border-bottom:2px solid transparent;color:var(--ink45);
  font-family:var(--font-mono);font-size:12px;
}
#tab-beute .grab-chip:hover{color:var(--ink)}
#tab-beute .grab-chip.active{background:none;color:var(--ink);border-bottom-color:var(--accent)}
#tab-beute .grab-chips{gap:22px}

#tab-beute .grab-card,#tab-beute .direct-row,#tab-beute .grab-picker-item,#tab-beute .roms-tile{
  background:none;border:none;border-left:none;border-radius:0;
  border-bottom:1px solid var(--ink10);box-shadow:none;
}
#tab-beute .grab-card:hover,#tab-beute .roms-tile:hover,#tab-beute .grab-picker-item:hover{background:var(--ink04);border-color:var(--ink10)}
#tab-beute .grab-ic,#tab-beute .roms-tile-ic{color:var(--ink55)}
#tab-beute .grab-title{font-family:var(--font-mono);font-size:13px;color:var(--ink)}
#tab-beute .grab-badge{background:none;border:none;border-radius:0;color:var(--ink40);font-family:var(--font-mono);font-size:11px;padding:0}
#tab-beute .grab-badge.dim{border:none;color:var(--ink35)}
#tab-beute .grab-badge.src{border:none;color:var(--accent)}
#tab-beute .grab-badge.have{background:none;color:var(--ok)}
#tab-beute .grab-badge.de{border:1px solid var(--ink16);padding:1px 5px;color:var(--ink55)}
#tab-beute .grab-badges{gap:12px}
#tab-beute .grab-dl{border:1px solid var(--ink16);border-radius:0;background:none;color:var(--accent)}
#tab-beute .grab-dl:hover{background:var(--accent);color:var(--bg)}

#tab-beute .grab-health-card{background:none;border:none;border-left:2px solid var(--warn);border-radius:0;padding-left:12px}
#tab-beute .grab-health-ic{color:var(--warn)}
#tab-beute .grab-health-btn,#tab-beute .roms-job-stop{background:var(--accent);color:var(--bg);border:none;border-radius:0;font-family:var(--font-mono)}
#tab-beute .roms-job-stop{background:none;border:1px solid var(--ink16);color:var(--ink45)}

#tab-beute .grab-status,#tab-beute .roms-detail.open{background:none;border:1px solid var(--ink10);border-radius:0}
#tab-beute .grab-status-head{font-family:var(--font-mono);color:var(--ink40)}
#tab-beute .grab-st-bar{background:var(--ink10);border-radius:0}
#tab-beute .grab-st-fill{background:var(--accent)}
#tab-beute .grab-st-mark{font-family:var(--font-mono)}
#tab-beute .grab-st-row.done .grab-st-mark{color:var(--ok)}
#tab-beute .grab-st-row.failed .grab-st-mark,#tab-beute .direct-row-err{color:var(--danger)}

#tab-beute .grab-picker{background:color-mix(in srgb,var(--bg) 82%,transparent)}
#tab-beute .grab-picker-card{background:var(--bg);border:1px solid var(--ink16);border-radius:0;box-shadow:none}
#tab-beute .grab-picker-head,#tab-beute .grab-picker-foot{border-color:var(--ink16)}
#tab-beute .grab-picker-title{font-family:var(--font-serif);font-style:italic;font-size:18px}

#tab-beute .roms-grid{gap:0}
#tab-beute .roms-tile{border-left:none}
#tab-beute .roms-tile.active{background:var(--ink04)}
#tab-beute .roms-tile-flag,#tab-beute .roms-tile-count{font-family:var(--font-mono);color:var(--ink40);border:none}
#tab-beute .roms-tile-flag.warn{color:var(--warn)}
#tab-beute .roms-detail-title{font-family:var(--font-serif);font-style:italic;font-size:18px}
#tab-beute .direct-jd-dot.alive{background:var(--ok)}
#tab-beute .grab-empty-ic{color:var(--ink35)}
#tab-beute .grab-de-toggle{border:1px solid var(--ink16);border-radius:0;color:var(--ink45);font-family:var(--font-mono);background:none}
#tab-beute .grab-de-toggle.active{background:var(--accent);color:var(--bg);border-color:var(--accent)}
