/* Anvil Atlas -- Karte, Filter, Tafel, Liste. Farben aus dem Theme. */
.aat-atlas { position: relative; }
.aat-filter { margin: 0 0 1rem; }
.aat-filter-reihe { display: flex; flex-wrap: wrap; gap: .3rem .5rem; align-items: baseline; margin-bottom: .4rem; }
.aat-filter-titel { font-family: 'Share Tech Mono', monospace; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--text-dim, #888); min-width: 6em; }
.aat-filter-link { font-size: .8rem; padding: .15rem .55rem; border: 1px solid var(--border, #444); border-radius: 999px; color: var(--text-muted, #bbb); text-decoration: none; }
.aat-filter-link:hover { border-color: var(--accent, #c9a227); color: var(--text-body, #eee); }
/* Schrift auf Akzent nimmt --on-accent, das gepruefte Paar (seit 0.1.8; vorher
   die Grundfarbe, die zufaellig mitzog). Die Zahl in der Pille ohne opacity:
   Mit 80 % lag sie in Mittel bei 4,0-4,1:1; --text-muted traegt allein. */
.aat-filter-link.is-aktiv { background: var(--accent, #c9a227); color: var(--on-accent, #111); border-color: var(--accent, #c9a227); }
.aat-zahl { font-family: 'Share Tech Mono', monospace; font-size: .7em; }
.aat-ausfall, .aat-leer { color: var(--text-dim, #888); font-style: italic; }

.aat-buehne { position: relative; }
.aat-werkzeuge { display: flex; gap: .4rem; align-items: center; margin-bottom: .5rem; }
.aat-werkzeuge[hidden] { display: none !important; }
.aat-suche { flex: 1 1 12rem; max-width: 20rem; background: var(--bg-card, #14161c); color: var(--text-body, #eee); border: 1px solid var(--border, #444); border-radius: 4px; padding: .35rem .6rem; font-size: .85rem; }
.aat-zoom { background: var(--bg-card, #14161c); color: var(--text-body, #eee); border: 1px solid var(--border, #444); border-radius: 4px; width: 2rem; height: 2rem; cursor: pointer; font-size: 1rem; line-height: 1; }
.aat-zoom:hover { border-color: var(--accent, #c9a227); }

.aat-karte-rahmen { position: relative; border: 1px solid var(--border, #444); border-radius: var(--radius-md, 6px); overflow: hidden; background: #070910; }
.aat-karte { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; touch-action: none; user-select: none; }
.aat-karte.is-greift { cursor: grabbing; }
.aat-grund { fill: #070910; }
.aat-galaxie { fill: rgba(255,255,255,.025); stroke: rgba(255,255,255,.08); stroke-width: 1.5; stroke-dasharray: 6 8; }
.aat-dial circle { fill: none; stroke: var(--gold, #c9a227); pointer-events: none; }
.aat-dial-fein { stroke-width: 1; stroke-opacity: .4; stroke-dasharray: 1 6; }
.aat-dial-grob { stroke-width: 2; stroke-opacity: .3; stroke-dasharray: 2 16; }
.aat-ecken { pointer-events: none; }
.aat-ecken path { fill: none; stroke: var(--gold, #c9a227); stroke-opacity: .55; stroke-width: 1.5; }
.aat-ecken circle { fill: var(--gold, #c9a227); fill-opacity: .55; }
.aat-sterne { pointer-events: none; }
.aat-stern { fill: #e8e2d0; }
.aat-stern-0 { fill-opacity: .35; }
.aat-stern-1 { fill-opacity: .55; }
.aat-stern-2 { fill-opacity: .8; }
/* Fuellungen ueber fill-opacity statt fester rgba() -- damit sie dem
   gewaehlten Farbschema folgen (--gold/--accent), nicht am Vorgabe-Gold
   festkleben, waehrend die Randlinie schon vorher mitzog. */
.aat-grad-innen { stop-color: var(--gold, #c9a227); stop-opacity: .16; }
.aat-grad-aussen { stop-color: var(--gold, #c9a227); stop-opacity: 0; }
.aat-segment circle { fill: url(#aat-segment-glut); stroke: var(--gold, #c9a227); stroke-opacity: .35; stroke-width: 1.5; }
.aat-segment.is-aktiv circle { stroke: var(--accent, #c9a227); stroke-opacity: 1; stroke-width: 2; }
.aat-segment text { fill: var(--gold, #c9a227); fill-opacity: .7; font-family: 'Share Tech Mono', monospace; font-size: 15px; letter-spacing: .12em; text-transform: uppercase; pointer-events: none; }
.aat-welt { cursor: pointer; }
.aat-welt .aat-hitfeld { fill: transparent; }
.aat-welt .aat-punkt { fill: var(--gold, #c9a227); fill-opacity: .18; stroke: var(--accent, #c9a227); stroke-width: 1.6; transition: fill-opacity .15s, filter .15s; }
.aat-welt.is-genau .aat-punkt { fill-opacity: .45; }
.aat-welt .aat-kern { fill: var(--accent, #c9a227); }
.aat-welt.is-ungefaehr .aat-punkt { stroke-dasharray: 3 2; }
.aat-welt:hover .aat-punkt, .aat-welt.is-gewaehlt .aat-punkt { fill: var(--accent, #c9a227); fill-opacity: 1; filter: url(#aat-glut); }
.aat-welt.is-fremd { opacity: .18; }
.aat-welt .aat-name { fill: #e8e2d0; font-size: 12px; font-family: inherit; pointer-events: none; paint-order: stroke; stroke: #070910; stroke-width: 3px; stroke-linejoin: round; }
.aat-welt:not(.hat-bezuege):not(.is-genau) .aat-name { opacity: .55; }
/* Weit herausgezoomt (Standardansicht) verschwinden die Namen der Welten
   ohne Bezuege ganz -- sonst kollidieren sie in dichten Haufen wie Solar
   oder Ultima. Herangezoomt, bei Auswahl oder beim Ueberfahren bleiben sie
   sichtbar (JS setzt/entfernt .is-uebersicht auf dem <svg> je nach Zoom). */
.aat-karte.is-uebersicht .aat-welt:not(.hat-bezuege):not(.is-genau):not(.is-gewaehlt) .aat-name { display: none; }
.aat-karte.is-uebersicht .aat-welt:not(.hat-bezuege):not(.is-genau):not(.is-gewaehlt):hover .aat-name { display: inline; }
.aat-hinweis { position: absolute; pointer-events: none; background: var(--bg-card, #14161c); color: var(--text-body, #eee); border: 1px solid var(--accent, #c9a227); border-radius: 4px; padding: .3rem .55rem; font-size: .8rem; max-width: 18rem; z-index: 3; }
.aat-hinweis[hidden] { display: none !important; }

.aat-tafel { position: absolute; top: 3rem; right: .6rem; width: min(22rem, 90%); max-height: calc(100% - 4rem); overflow: auto; background: var(--bg-card, #14161c); border: 1px solid var(--accent, #c9a227); border-radius: var(--radius-md, 6px); padding: 1rem 1.1rem; z-index: 4; box-shadow: 0 8px 30px rgba(0,0,0,.5); }
.aat-tafel[hidden] { display: none !important; }
.aat-tafel-zu { position: absolute; top: .3rem; right: .4rem; background: none; border: 0; color: var(--text-dim, #888); font-size: 1.3rem; cursor: pointer; }
.aat-tafel h3 { margin: 0 .5rem .2rem 0; color: var(--gold, #c9a227); font-size: 1.05rem; }
.aat-tafel .aat-tafel-meta { margin: 0 0 .6rem; font-family: 'Share Tech Mono', monospace; font-size: .7rem; letter-spacing: .05em; text-transform: uppercase; color: var(--text-dim, #888); }
.aat-tafel ul { list-style: none; margin: 0; padding: 0; }
.aat-tafel li { padding: .25rem 0; border-top: 1px dashed var(--border, #444); font-size: .88rem; }
.aat-tafel .aat-bezug-art { font-family: 'Share Tech Mono', monospace; font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-dim, #888); margin-right: .4rem; }
.aat-tafel a { color: var(--gold, #c9a227); text-decoration: none; }
.aat-tafel a:hover { text-decoration: underline; }
.aat-tafel .aat-tafel-links { margin: .6rem 0 0; display: flex; gap: .8rem; flex-wrap: wrap; font-size: .85rem; }
.aat-legende { margin: .5rem 0 1.5rem; font-size: .75rem; font-family: 'Share Tech Mono', monospace; color: var(--text-dim, #888); }

.aat-liste .aat-gruppe { margin: 1.4rem 0; }
.aat-gruppe-titel { color: var(--gold, #c9a227); font-size: 1rem; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .5rem; }
.aat-welten-liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: .6rem 1.2rem; }
.aat-welt-zeile { border-top: 1px solid var(--border, #444); padding: .5rem 0; }
.aat-welt-titel { font-weight: 600; color: var(--gold, #c9a227); text-decoration: none; }
a.aat-welt-titel:hover { text-decoration: underline; }
.aat-welt-dossier { font-size: .75rem; color: var(--text-muted, #bbb); margin-left: .3rem; }
.aat-ungefaehr { font-family: 'Share Tech Mono', monospace; font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-dim, #888); margin-left: .4rem; }
.aat-bezuege { list-style: none; margin: .3rem 0 0; padding: 0; font-size: .85rem; }
.aat-bezuege li { padding: .1rem 0; }
.aat-bezug-art { font-family: 'Share Tech Mono', monospace; font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-dim, #888); }
.aat-bezuege a { color: var(--text-body, #eee); text-decoration: none; }
.aat-bezuege a:hover { color: var(--gold, #c9a227); }
.aat-gruppe-ohne .aat-welt-titel { color: var(--text-dim, #888); }