:root{--bg:#151719;--fl:#202327;--rand:#3c4044;--text:#edf0f2;--dim:#aeb7c0;--akz:#6cb6ff;--knopf:#34393f}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font:16px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.kopf{padding:14px max(16px,env(safe-area-inset-left));background:var(--fl);border-bottom:1px solid var(--rand);display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
h1{font-size:1.25rem;margin:0}.heim{color:inherit;text-decoration:none}.unter{margin:0;color:var(--dim);font-size:.9rem}
main{padding:12px max(16px,env(safe-area-inset-left)) 8px}
.leiste{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-bottom:8px}
.wahl{display:flex;gap:6px;align-items:center;color:var(--dim);font-size:.9rem}
button,select{font:inherit;color:var(--text);background:var(--knopf);border:1px solid #565d65;border-radius:7px;padding:9px 12px;min-height:44px}
button{cursor:pointer}button:disabled{opacity:.45;cursor:default}
.buehne{position:relative;width:100%;height:max(320px,calc(100vh - 250px));height:max(320px,calc(100dvh - 250px));background:#000;border-radius:10px;overflow:hidden;touch-action:none}
.buehne canvas{touch-action:none}
.buehne>img,.buehne>video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.meldung{position:absolute;left:0;right:0;bottom:0;margin:0;padding:8px 12px;background:rgba(0,0,0,.65);color:var(--text);font-size:.9rem;z-index:3;pointer-events:none}
.meldung:empty{display:none}
.hilfe{color:var(--dim);font-size:.82rem;margin:8px 0 0}.hinweis{color:#f2c879;font-size:.88rem;margin:6px 0 0}.hinweis:empty{display:none}
.fuss{padding:10px max(16px,env(safe-area-inset-left)) 18px;color:var(--dim);font-size:.8rem}.fuss a{color:var(--akz)}
@media (orientation:portrait){.buehne{height:max(360px,min(calc(100vh - 330px),150vw));height:max(360px,min(calc(100dvh - 330px),150vw))}}
.karten{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin:4px 0 10px}
.karte{display:flex;flex-direction:column;color:inherit;text-decoration:none;background:var(--fl);border:2px solid var(--rand);border-radius:10px;overflow:hidden}
.karte:hover,.karte:focus-visible{border-color:var(--akz);outline:none}
.karte img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background:#000}
.karte .txt{padding:8px 11px 10px;min-width:0}.karte b{display:block;overflow-wrap:anywhere}.karte small{display:block;color:var(--dim);margin-top:2px}
.zurueck{margin:0 0 8px}.zurueck a{color:var(--akz)}
.datum{color:var(--dim)}
[hidden]{display:none!important}
