als Raster mit fester Höhe aus. * Hier soll die Seite einfach fließen und scrollen – beides zurücksetzen, * sonst landen die Karten in der 280 px breiten Seitenleistenspalte. */ body.verwaltung { display: block; height: auto; min-height: 100vh; overflow: auto; } body.verwaltung main.verw-inhalt { display: block; grid-template-columns: none; min-height: 0; } .verw-inhalt { max-width: 1000px; margin: 0 auto; padding: 24px 20px 60px; } .hinweisblock h1 { font-size: 20px; margin: 0 0 10px; } .hinweisblock p { margin: 0 0 8px; max-width: 68ch; } .klein { color: var(--text-schwach); font-size: 12px; } .kopf-rechts a.pause { text-decoration: none; } .tokenblock { margin: 20px 0; padding: 14px 16px; background: var(--bg-erhoben); border: 1px solid var(--linie); border-radius: 6px; } .tokenblock label { display: block; font-size: 12px; color: var(--text-schwach); margin-bottom: 6px; } .tokenzeile { display: flex; gap: 8px; max-width: 460px; } .tokenzeile input { flex: 1; background: var(--bg); border: 1px solid var(--linie); border-radius: 5px; color: var(--text); padding: 7px 9px; font: inherit; } .tokenzeile button { background: var(--akzent); border: none; border-radius: 5px; color: #08121f; font: 600 14px/1 var(--font); padding: 0 16px; cursor: pointer; } .tokenblock.gesperrt { border-color: var(--gelb); } .meldung { margin: 14px 0; padding: 10px 14px; border-radius: 5px; border: 1px solid var(--linie); background: var(--bg-erhoben); font-size: 13px; } .meldung.ok { border-color: var(--gruen); color: var(--gruen); } .meldung.fehler { border-color: var(--rot); color: var(--rot); } .gruppe { margin-top: 26px; } .gruppe > h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--text-schwach); margin: 0 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--linie); } .karten { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; } .karte { background: var(--bg-erhoben); border: 1px solid var(--linie); border-radius: 6px; padding: 12px; display: flex; flex-direction: column; gap: 9px; } .karte.eigen { border-color: var(--gruen); } .karte-kopf { display: flex; align-items: center; gap: 10px; } .karte canvas { background: #0d1117; border-radius: 4px; flex: none; } .karte-titel { font-size: 12px; line-height: 1.3; } .karte-quelle { font-size: 11px; color: var(--text-schwach); } .karte.eigen .karte-quelle { color: var(--gruen); } .karte input[type=file] { font-size: 11px; color: var(--text-schwach); width: 100%; } .karte input[type=file]::file-selector-button { background: var(--bg); border: 1px solid var(--linie); border-radius: 4px; color: var(--text); padding: 4px 8px; margin-right: 8px; cursor: pointer; font: inherit; } .karte-knoepfe { display: flex; gap: 6px; } .karte-knoepfe button { flex: 1; background: var(--bg); border: 1px solid var(--linie); border-radius: 4px; color: var(--text); padding: 5px 0; font: 12px/1 var(--font); cursor: pointer; } .karte-knoepfe button:disabled { opacity: .4; cursor: default; } .karte-knoepfe button.laden:not(:disabled):hover { border-color: var(--akzent); } .karte-knoepfe button.weg:not(:disabled):hover { border-color: var(--rot); color: var(--rot); } .sammelknopf { margin-top: 6px; background: var(--bg-erhoben); border: 1px solid var(--akzent); border-radius: 5px; color: var(--akzent); padding: 7px 14px; font: inherit; cursor: pointer; } .sammelknopf:hover { background: var(--akzent); color: #08121f; } .karte-quelle-zeile { display: flex; gap: 6px; } .karte-quelle-zeile input { flex: 1; min-width: 0; background: var(--bg); border: 1px solid var(--linie); border-radius: 4px; color: var(--text-schwach); padding: 4px 7px; font: 11px/1.3 var(--mono); } .karte-quelle-zeile input:focus { color: var(--text); outline: 1px solid var(--akzent); } .karte-quelle-zeile button { background: var(--bg); border: 1px solid var(--linie); border-radius: 4px; color: var(--text); padding: 4px 10px; font: 12px/1 var(--font); cursor: pointer; } .karte-quelle-zeile button:hover { border-color: var(--akzent); } .suchverweis { color: var(--text-schwach); font-size: 11px; text-decoration: none; } .suchverweis:hover { color: var(--akzent); }