:root { color-scheme: light dark; --bg:#fff; --fg:#1d2127; --muted:#5b6570; --line:#d8dde3; --code:#f2f4f6; --link:#0b5cad; }
@media (prefers-color-scheme: dark) { :root { --bg:#14171a; --fg:#e4e7ea; --muted:#9aa4ae; --line:#2c333a; --code:#1e2328; --link:#6cb2ff; } }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.6 system-ui, sans-serif; }
header { border-bottom:1px solid var(--line); padding:.6rem 1rem; display:flex; gap:1rem; flex-wrap:wrap; align-items:center; }
header a { color:var(--link); text-decoration:none; }
header a[aria-current] { color:var(--fg); font-weight:600; }
main { max-width:52rem; margin:0 auto; padding:1rem; }
a { color:var(--link); }
pre, code { background:var(--code); border-radius:4px; font-size:.9em; }
code { padding:.1em .3em; } pre { padding:.8rem; overflow-x:auto; } pre code { padding:0; }
table { border-collapse:collapse; display:block; overflow-x:auto; }
th, td { border:1px solid var(--line); padding:.3rem .6rem; text-align:left; }
/* Anwendung */
.spacer { flex: 1; }
.muted { color: var(--muted); } .small { font-size: .85em; }
.hidden { position: absolute; left: -9999px; }
.status { min-height: 1.5em; } .status.error { color: #c0392b; }
@media (prefers-color-scheme: dark) { .status.error { color: #ff7b6b; } }
button, a.button, label.button { font: inherit; padding: .35rem .8rem; border: 1px solid var(--line); border-radius: 6px; background: var(--code); color: var(--fg); cursor: pointer; text-decoration: none; display: inline-block; }
button:hover:not(:disabled), a.button:hover, label.button:hover { border-color: var(--link); }
button:disabled { opacity: .5; cursor: default; }
button.link { border: 0; background: none; color: var(--link); padding: 0 .2rem; }
input[type=text], input[type=password], input[type=number] { font: inherit; padding: .3rem .5rem; border: 1px solid var(--line); border-radius: 6px; background: var(--bg); color: var(--fg); max-width: 100%; }
input:focus-visible, button:focus-visible, a:focus-visible, label.button:focus-within { outline: 2px solid var(--link); outline-offset: 2px; }
table.files td.actions, td.actions { white-space: nowrap; display: table-cell; }
.token { word-break: break-all; user-select: all; }
.toolbar { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; }
@media (max-width: 40rem) { main { padding: .75rem; } header { gap: .5rem; } }
.card { border: 1px solid var(--line); border-radius: 8px; padding: .6rem .9rem; margin: .6rem 0; }
.card-head { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.dot { display: inline-block; width: .8em; height: .8em; border-radius: 50%; background: var(--line); margin-right: .4rem; }
.shares ul { padding-left: 1.2rem; } .shares h3 { font-size: 1rem; margin: .6rem 0 .2rem; }
select { font: inherit; padding: .3rem .5rem; border: 1px solid var(--line); border-radius: 6px; background: var(--bg); color: var(--fg); }
.share-panel { border: 1px solid var(--line); border-radius: 8px; padding: .6rem .9rem; margin: .4rem 0; }
.share-panel h3 { font-size: 1rem; margin: .6rem 0 .2rem; }
.verify { border-left: 3px solid var(--link); padding-left: .8rem; margin: .4rem 0; }
tr[hidden] { display: none; }