/* Auge — ein Feld, Schubladen, eine Akte. Schrift wie der Rest (Sans), nur Titel
   und Begriff in Georgia wie bei Atlas. Koralle nur für das, was gerade passiert:
   Suchen-Knopf, laufende Schublade, Fokus. */
.auge{--au-card:var(--surface-1,#1c1815);--au-card-2:var(--surface-2,#26211d);--au-text:var(--text-1,#f3ece6);--au-soft:var(--text-2,#d6cbc1);--au-muted:var(--text-3,#b3a79d);--au-line:var(--line-1,#3a312b);--au-line-2:var(--line-2,#4a4038);--au-mark:var(--accent,#E4795A);--au-mark-line:var(--accent-line,rgba(228,121,90,.42));--au-mark-soft:var(--accent-soft,rgba(228,121,90,.12));--au-serif:Georgia,'Source Serif 4',serif;
  color:var(--au-text);min-height:70vh;max-width:1040px;padding:32px 24px 56px;font-family:var(--font-sans,system-ui,sans-serif);font-size:15px;line-height:1.45}
.auge *{box-sizing:border-box}
.auge button,.auge input{font:inherit}
.auge :focus-visible{outline:2px solid var(--au-mark);outline-offset:3px;border-radius:6px}

/* Kopf */
.auge-eyebrow{margin:0 0 6px;font-size:10.5px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--au-muted)}
.auge h2{font:500 34px/1.1 var(--au-serif);margin:0 0 6px;letter-spacing:-.5px}
.auge-lead{color:var(--au-muted);margin:0 0 26px;font-size:14.5px}

/* Feld */
.auge-form{display:flex;gap:10px;align-items:stretch}
.auge-form input:not([type=file]){flex:1;min-width:0;background:transparent;color:var(--au-text);border:0;border-bottom:1px solid var(--au-line-2);border-radius:0;font-size:21px;line-height:1.3;padding:10px 2px;transition:border-color .15s}
.auge-form input:not([type=file])::placeholder{color:var(--au-muted);opacity:.75}
.auge-form input:not([type=file]):focus{outline:none;border-bottom-color:var(--au-text)}
.auge.is-running .auge-form input:not([type=file]){border-bottom:2px solid var(--au-mark);padding-bottom:9px}
.auge-knopf{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 20px;border-radius:999px;border:1px solid var(--au-line-2);background:transparent;color:var(--au-text);font-size:14.5px;font-weight:500;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.auge-knopf:hover{background:var(--au-mark-soft);border-color:var(--au-mark-line)}
.auge-knopf.is-primary{background:var(--au-mark);border-color:transparent;color:var(--accent-on,#fff);font-weight:600}
.auge-knopf.is-primary:hover{background:var(--accent-hover,var(--au-mark))}
.auge-knopf:disabled{opacity:.5;cursor:wait}
.auge-datei{position:relative}
.auge-datei input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.auge-datei:focus-within{outline:2px solid var(--au-mark);outline-offset:3px}
.auge-hinweis{min-height:1.3em;color:var(--au-muted);font-size:13px;margin:9px 2px 26px}
.auge-hinweis:not(:empty)::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--au-muted);margin-right:7px;transform:translateY(-1px);opacity:.7}
.auge-hinweis:empty{margin-bottom:6px}
.auge-fehler{margin:-14px 0 22px;padding:10px 14px;border:1px solid var(--au-mark-line);border-radius:12px;background:var(--au-mark-soft);color:var(--au-text);font-size:14px}

/* Akte-Kopf */
.auge-akte-kopf{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:0 0 14px;padding-top:4px}
.auge-akte-kopf[hidden]{display:none}
.auge-akte-kopf .auge-eyebrow{margin-bottom:4px}
.auge-begriff{margin:0;font:500 25px/1.2 var(--au-serif);letter-spacing:-.3px;overflow-wrap:anywhere}
.auge-meta{margin:4px 0 0;color:var(--au-muted);font-size:13px}
.auge-akte-knoepfe{display:flex;gap:8px;flex-wrap:wrap}
.auge-klein{min-height:36px;padding:0 14px;font-size:13.5px;color:var(--au-soft)}
.auge-klein[data-tun=weg]:hover{border-color:var(--au-mark-line);color:var(--au-mark)}

/* Export-Menü */
.auge-export{position:relative}
.auge-export summary{list-style:none}
.auge-export summary::-webkit-details-marker{display:none}
.auge-export[open] summary{border-color:var(--au-mark-line);background:var(--au-mark-soft)}
.auge-export-menue{position:absolute;right:0;top:calc(100% + 6px);z-index:5;min-width:190px;padding:6px;border:1px solid var(--au-line-2);border-radius:12px;background:var(--au-card);box-shadow:0 14px 36px -12px rgba(0,0,0,.45);display:grid;gap:2px}
.auge-export-menue button{text-align:left;padding:9px 10px;border:0;border-radius:8px;background:transparent;color:var(--au-text);font-size:14px;cursor:pointer}
.auge-export-menue button:hover{background:var(--au-mark-soft)}

/* Brett-Graph */
.auge-graph-box{border:1px solid var(--au-line);border-radius:14px;background:var(--au-card);padding:6px;margin-top:4px}
.auge-graph{display:block;width:100%;height:auto;max-height:440px;overflow:visible}
.auge-kante{stroke:var(--au-line-2);stroke-width:1.2}
.auge-kante[data-k=genannt]{stroke-dasharray:3 4}
.auge-kante[data-k=hand]{stroke:var(--au-mark-line);stroke-width:1.6}
.auge-mitte circle{fill:var(--au-mark)}
.auge-mitte text{fill:var(--au-text);font:600 14px var(--au-serif)}
.auge-knoten{cursor:pointer;outline:none}
.auge-knoten circle{fill:var(--au-card);stroke:var(--au-soft);stroke-width:1.5;transition:stroke .15s,fill .15s}
.auge-knoten[data-art=akte] circle{fill:var(--au-soft)}
.auge-knoten text{fill:var(--au-text);font-size:12.5px}
.auge-knoten .auge-knoten-art{fill:var(--au-muted);font-size:10.5px}
/* mobile-dimensions.css setzt am Handy jede SVG-Schrift per !important auf 12px — im
   verkleinerten viewBox wären das ~10px. */
body .auge-graph.is-schmal .auge-knoten text,body .auge-graph.is-schmal .auge-knoten tspan{font-size:16px!important}
body .auge-graph.is-schmal .auge-mitte text{font-size:17px!important}
.auge-knoten:hover circle,.auge-knoten:focus-visible circle{stroke:var(--au-mark);fill:var(--au-mark-soft)}
.auge-knoten:focus-visible text{text-decoration:underline}
.auge-legende{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:8px 2px 0;color:var(--au-muted);font-size:12px}
.auge-legende span{display:inline-block;width:22px;height:0;border-top:1.4px solid var(--au-line-2);margin-right:-8px;transform:translateY(-3px)}
.auge-legende span[data-k=genannt]{border-top-style:dashed}
.auge-legende span[data-k=hand]{border-top-color:var(--au-mark-line);border-top-width:2px}

/* Verknüpfen von Hand */
.auge-verbund{display:flex;align-items:stretch}
.auge-verbund .auge-zeile-btn{flex:1}
.auge-loesen{flex:0 0 auto;width:36px;margin-left:10px;border:0;background:transparent;color:var(--au-muted);font-size:18px;cursor:pointer;border-radius:8px}
.auge-loesen:hover{color:var(--au-mark);background:var(--au-mark-soft)}
.auge-verknuepfen{display:flex;gap:8px;margin-top:10px}
.auge-verknuepfen select{flex:1;min-width:0;min-height:36px;padding:0 10px;border:1px solid var(--au-line-2);border-radius:10px;background:var(--au-card);color:var(--au-text);font:inherit;font-size:14px}
[data-theme=dark] .auge-graph-box{background:linear-gradient(180deg,color-mix(in srgb,var(--au-card) 94%,#fff 6%),var(--au-card) 80px);box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
[data-theme=dark] .auge-mitte circle{filter:drop-shadow(0 0 8px color-mix(in srgb,var(--au-mark) 55%,transparent))}
[data-theme=dark] .auge-export-menue{box-shadow:0 18px 40px -10px rgba(0,0,0,.75)}

/* Schubladen */
.auge-karten{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:900px){.auge-karten{grid-template-columns:1fr 1fr}}
.auge-karte{background:var(--au-card);border:1px solid var(--au-line);border-radius:14px;padding:14px 16px 15px;min-height:78px;transition:border-color .2s}
.auge-karte h3{margin:0 0 9px;font-size:10.5px;font-weight:600;line-height:1;letter-spacing:1.4px;text-transform:uppercase;color:var(--au-muted)}
.auge-zeile{display:flex;gap:9px;align-items:baseline;font-size:15.5px;line-height:1.4;overflow-wrap:anywhere}
.auge-karte[data-status=laufend]{border-color:var(--au-mark-line)}
.auge-karte[data-status=laufend] h3{color:var(--au-mark)}
.auge-karte[data-status=leer] .auge-zeile{color:var(--au-muted)}
.auge-karte[data-status=fehler]{background:transparent;border-style:dashed}
.auge-karte[data-status=fehler] .auge-zeile{color:var(--au-muted);font-size:14px}
.auge-balken{height:2px;margin-top:14px;border-radius:2px;background:color-mix(in srgb,var(--au-mark) 22%,transparent);overflow:hidden}
.auge-balken span{display:block;height:100%;width:35%;border-radius:2px;background:var(--au-mark);animation:auge-lauf 1.1s ease-in-out infinite}
@keyframes auge-lauf{0%{transform:translateX(-120%)}100%{transform:translateX(320%)}}
@media(prefers-reduced-motion:reduce){.auge-balken span{animation:none;width:100%;opacity:.6}}

/* Sicherheitspunkt: voll = mehrere Quellen, halb = eine, leer = Hinweis */
.auge-punkt{width:8px;height:8px;border-radius:50%;border:1.5px solid currentColor;flex:0 0 auto;transform:translateY(-1px);display:inline-block;font-style:normal}
.auge-punkt[data-s=fest]{background:currentColor}
.auge-punkt[data-s=eine]{background:color-mix(in srgb,currentColor 50%,transparent)}

/* Treffer */
.auge-abschnitt{margin-top:30px}
.auge-abschnitt h3{display:flex;align-items:baseline;gap:8px;margin:0 0 6px;font-size:10.5px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--au-muted)}
.auge-abschnitt h3 small{font-size:11px;letter-spacing:0;text-transform:none;font-weight:500;opacity:.8}
.auge-treffer{display:grid;grid-template-columns:10rem minmax(0,1fr) auto;gap:14px;align-items:baseline;padding:11px 0;border-top:1px solid var(--au-line);font-size:14.5px}
.auge-treffer>span:nth-child(2){overflow-wrap:anywhere}
.auge-treffer a{color:inherit;text-decoration:underline;text-decoration-color:var(--au-line-2);text-underline-offset:3px;transition:color .15s,text-decoration-color .15s}
.auge-treffer a:hover{color:var(--au-mark);text-decoration-color:currentColor}
.auge-quelle{color:var(--au-muted);font-size:13px}
.auge-sicher{display:inline-flex;align-items:center;gap:7px;color:var(--au-muted);font-size:12.5px;white-space:nowrap}

/* Zeilen-Knöpfe: letzte Suchen, darin genannt, hängt zusammen */
.auge-zeile-btn{display:flex;justify-content:space-between;align-items:baseline;gap:16px;text-align:left;background:transparent;color:inherit;border:0;padding:11px 8px;margin:0 -8px;width:calc(100% + 16px);border-radius:8px;font-size:15px;cursor:pointer;transition:background .15s;position:relative}
.auge-zeile-btn::before{content:'';position:absolute;left:8px;right:8px;top:0;border-top:1px solid var(--au-line)}
.auge-zeile-btn:hover{background:var(--au-mark-soft)}
.auge-zeile-btn:hover::before,.auge-zeile-btn:hover+.auge-zeile-btn::before{border-top-color:transparent}
.auge-zeile-btn span{overflow-wrap:anywhere}
.auge-zeile-btn small{color:var(--au-muted);font-size:12.5px;white-space:nowrap}
.auge-zeile-btn:hover small{color:var(--au-soft)}
.auge-leer{color:var(--au-muted);font-size:14px;padding:12px 0;border-top:1px solid var(--au-line)}

/* Hell: Karten heben sich leicht vom Grund ab */
[data-theme=light] .auge-karte{box-shadow:0 1px 2px rgba(0,0,0,.04)}
[data-theme=light] .auge-karte[data-status=fehler]{box-shadow:none}

/* Dunkel: eigene Tiefe statt bloßem Variablen-Tausch */
[data-theme=dark] .auge-karte{background:linear-gradient(180deg,color-mix(in srgb,var(--au-card) 92%,#fff 8%) 0%,var(--au-card) 46px);box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 22px -14px rgba(0,0,0,.65)}
[data-theme=dark] .auge-karte[data-status=laufend]{box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 0 0 1px color-mix(in srgb,var(--au-mark) 10%,transparent),0 10px 28px -16px color-mix(in srgb,var(--au-mark) 55%,transparent)}
[data-theme=dark] .auge-karte[data-status=fehler]{background:transparent;box-shadow:none}
[data-theme=dark] .auge-knopf.is-primary{box-shadow:0 6px 18px -8px color-mix(in srgb,var(--au-mark) 70%,transparent)}
[data-theme=dark] .auge-zeile-btn:hover{background:rgba(255,255,255,.035)}
[data-theme=dark] .auge-zeile-btn:hover small{color:var(--au-text)}

@media(max-width:700px){
  .auge{padding:20px 16px 40px}
  .auge h2{font-size:28px}
  .auge-form{flex-wrap:wrap}
  .auge-form input:not([type=file]){flex:1 0 100%;font-size:19px}
  .auge-form .auge-knopf{flex:1}
  .auge-form .auge-datei{flex:0 0 auto}
  .auge-akte-kopf{align-items:flex-start;flex-direction:column;gap:10px}
  .auge-export-menue{left:0;right:auto}
  .auge-graph{max-height:none}
  .auge-zeile-btn{flex-direction:column;gap:2px}
  .auge-zeile-btn small{white-space:normal}
  .auge-treffer{grid-template-columns:1fr auto;gap:2px 12px}
  .auge-treffer .auge-quelle{grid-column:1}
  .auge-treffer>span:nth-child(2){grid-column:1/-1;grid-row:2}
  .auge-treffer .auge-sicher{grid-column:2;grid-row:1}
}