
@media (prefers-color-scheme: dark)  { :root { --bg: #050506; color-scheme: dark; } }
@media (prefers-color-scheme: light) { :root { --bg: #050506; color-scheme: dark; } }

#s-haupt:not(.weg) > #t-chats, #s-haupt:not(.weg) > #t-chat { animation: nur-einblenden .38s ease; }

#dock button { position: relative; }
.dock-zahl {
  position: absolute; top: 4px; left: 50%; margin-left: 6px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 9px; background: var(--rot); color: #fff;
  font: 700 11px/18px var(--sans); font-style: normal; text-align: center;
  box-shadow: 0 0 8px -2px var(--rot);
}
.dock-zahl.leer { display: none; }

#chat-liste .kon-zeile {
  position: relative;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center;
  width: 100%; min-height: 0; margin: 0; padding: 12px 4px;
  border: 0; border-bottom: 1px solid rgba(255, 255, 255, .05); border-radius: 0;
  background: none; box-shadow: none; text-shadow: none;
  color: var(--text); font-size: 16px; font-weight: 500; text-align: left;
}
#chat-liste .kon-zeile.streifen { background: linear-gradient(90deg, rgba(60, 196, 245, .075), rgba(60, 196, 245, .025)); }
.chat-pfeil {
  -webkit-flex: none; flex: none; width: 14px; height: 14px; margin: 0 12px 0 0;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
}
.chat-pfeil svg { width: 14px; height: 14px; stroke-width: 2.6; }
.chat-pfeil.aus { color: var(--gruen); -webkit-filter: drop-shadow(0 0 4px rgba(60, 196, 245, .9)); filter: drop-shadow(0 0 4px rgba(60, 196, 245, .9)); }
.chat-pfeil.ein { color: var(--silber); -webkit-filter: drop-shadow(0 0 4px rgba(210, 220, 235, .6)); filter: drop-shadow(0 0 4px rgba(210, 220, 235, .6)); }
#chat-liste .verl-tag:first-child { margin-top: 6px; }
.chat-unter svg, .bl-kopf svg { vertical-align: -2px; margin-right: 5px; }
.chat-unter svg { color: var(--gruen); }
.chat-text {
  -webkit-flex: 1; flex: 1; min-width: 0;
  display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column;
}
.chat-text > b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-zeile.neu .chat-text > b { color: var(--silber-hell); font-weight: 700; }
.chat-unter { margin-top: 2px; font-size: 13px; color: var(--leise); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-rechts { -webkit-flex: none; flex: none; margin-left: 10px; text-align: right; }
.chat-zeit { display: block; font-size: 11.5px; color: var(--leise); }
.chat-zahl {
  display: inline-block; margin-top: 3px; min-width: 19px; height: 19px; padding: 0 6px; border-radius: 10px;
  background: var(--rot); color: #fff; font: 700 11px/19px var(--sans); font-style: normal; text-align: center;
}
.kon-ohne { margin-left: 7px; font-style: normal; font-size: 12px; color: var(--leise); }

.neu-knopf {
  position: fixed; z-index: 29; right: max(20px, calc(50% - 214px));
  bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  width: 56px; height: 56px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 50%;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  color: #041521; background: radial-gradient(circle at 50% 30%, #e6f9ff, #3cc4f5 45%, #0a5f9e 100%);
  box-shadow: 0 0 18px -2px rgba(60, 196, 245, .65), 0 12px 26px -10px rgba(0, 0, 0, .95);
}
.neu-knopf svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }

#blasen {
  display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column;
  min-height: 46vh; padding: 6px 0 74px;
}
.bl {
  max-width: 82%; margin-top: 8px; padding: 9px 13px; border-radius: 16px;
  font-size: 15px; line-height: 1.42; overflow-wrap: anywhere; white-space: pre-wrap;
}
.bl.ein { -webkit-align-self: flex-start; align-self: flex-start; background: rgba(255, 255, 255, .06); border: 1px solid var(--linie); border-bottom-left-radius: 5px; }
.bl.aus {
  -webkit-align-self: flex-end; align-self: flex-end; color: var(--silber-hell); border-bottom-right-radius: 5px;
  background: linear-gradient(180deg, rgba(60, 196, 245, .22), rgba(60, 196, 245, .12));
  border: 1px solid rgba(60, 196, 245, .3);
}
.bl-zeit { display: block; margin-top: 3px; font-size: 10.5px; color: var(--leise); text-align: right; }
.bl.geheim { cursor: pointer; border-style: dashed; }
.bl.geheim .bl-kopf { display: block; font-weight: 650; color: var(--silber-hell); }
.bl.geheim.ein { border-color: rgba(60, 196, 245, .55); box-shadow: 0 0 18px -8px rgba(60, 196, 245, .8); }
.bl-tag {
  -webkit-align-self: center; align-self: center; margin-top: 14px;
  font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--leise);
}

.eingabe {
  position: fixed; z-index: 29; display: -webkit-flex; display: flex; -webkit-align-items: flex-end; align-items: flex-end;
  left: max(14px, calc(50% - 220px)); right: max(14px, calc(50% - 220px));
  bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  padding: 7px; border-radius: 26px; border: 1px solid transparent;
  background: linear-gradient(180deg, rgba(28, 30, 34, .92), rgba(10, 11, 13, .95)) padding-box,
    linear-gradient(180deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, .06) 40%, rgba(255, 255, 255, .12)) border-box;
  box-shadow: 0 18px 40px -10px rgba(0, 0, 0, .95), inset 0 1px 0 rgba(255, 255, 255, .06);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  -webkit-transition: bottom .32s cubic-bezier(.2, .7, .2, 1); transition: bottom .32s cubic-bezier(.2, .7, .2, 1);
}
body.tippt .eingabe { bottom: calc(10px + var(--tastatur, 0px) + env(safe-area-inset-bottom, 0px)); }
#chat-feld {
  -webkit-flex: 1; flex: 1; min-width: 0; max-height: 120px; margin: 0 8px 0 0; padding: 9px 12px;
  border: 1px solid var(--linie); border-radius: 18px; resize: none;
  background: rgba(255, 255, 255, .05); color: var(--text);
  font: inherit; font-size: 15px; line-height: 1.35; outline: none;
}
#t-chat #chat-feld { min-height: 40px; height: 40px; line-height: 20px; padding-top: 9px; padding-bottom: 9px; overflow-y: auto; }
#chat-feld:focus { border-color: rgba(60, 196, 245, .45); }
#chat-feld::placeholder { color: var(--leise); }
.eingabe .rund {
  -webkit-flex: none; flex: none; width: 40px; height: 40px; min-height: 0; margin: 0; padding: 0; border-radius: 50%;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  background: rgba(255, 255, 255, .05); border: 1px solid var(--linie); box-shadow: none;
  color: var(--text-2); font-size: 23px; font-weight: 400; line-height: 1;
  -webkit-transition: -webkit-transform .2s; transition: transform .2s;
}
.eingabe .rund.send {
  border: 0; color: #041521;
  background: radial-gradient(circle at 50% 30%, #e6f9ff, #3cc4f5 45%, #0a5f9e 100%);
  box-shadow: 0 0 14px -3px rgba(60, 196, 245, .7);
}
.eingabe .rund.send::after {
  content: ""; width: 19px; height: 19px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 20l16-8L4 4l3 8z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 20l16-8L4 4l3 8z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.eingabe .rund:disabled { opacity: .45; }

#zoom-leiste {
  position: absolute; z-index: 3; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);
  bottom: calc(84px + env(safe-area-inset-bottom, 0px));
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 12px;
  padding: 6px 10px; border-radius: 22px;
  background: rgba(12, 14, 16, .8); border: 1px solid rgba(255, 255, 255, .14);
}
#zoom-leiste.weg { display: none !important; }
#zoom-leiste button {
  width: 40px; height: 40px; min-height: 0; margin: 0; padding: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .07); border: 1px solid var(--linie); box-shadow: none;
  color: var(--text); font-size: 22px; line-height: 1;
}
#zoom-leiste b { min-width: 46px; text-align: center; font-size: 14px; color: var(--text-2); }

#voll {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 90; background: #000;
  display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column;
  -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  padding: calc(24px + env(safe-area-inset-top, 0px)) 12px calc(96px + env(safe-area-inset-bottom, 0px));
}
#voll.weg { display: none !important; }
#voll-qr { display: block; width: min(96vw, calc(100vh - 210px)); height: auto; background: #fff; border-radius: 10px; image-rendering: pixelated; }
#voll-info { margin: 14px 0 0; color: #6f747c; font-size: 13px; text-align: center; max-width: 94vw; }
#b-voll-zu {
  position: absolute; width: 54px; height: 54px; min-height: 0; margin: 0; padding: 0; border-radius: 50%; font-size: 0; color: transparent;
  right: calc(18px + env(safe-area-inset-right, 0px)); bottom: calc(22px + env(safe-area-inset-bottom, 0px));
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dfe3e8' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / 22px no-repeat,
    radial-gradient(circle at 50% 30%, #34373d, #121316 75%);
  border: 1px solid rgba(60, 196, 245, .55);
  box-shadow: 0 0 16px 2px rgba(60, 196, 245, .45), 0 0 34px 6px rgba(60, 196, 245, .18), 0 8px 20px -6px rgba(0, 0, 0, .9);
}
#b-voll-weg {
  position: absolute; left: calc(18px + env(safe-area-inset-left, 0px)); bottom: calc(30px + env(safe-area-inset-bottom, 0px));
  width: auto; min-height: 0; height: 40px; margin: 0; padding: 0 16px; border-radius: 20px;
  font-size: 13.5px; font-weight: 600; color: var(--rot); background: rgba(18, 19, 22, .72);
  border: 1px solid rgba(255, 125, 115, .4); box-shadow: none;
}

.pruef {
  white-space: pre-wrap; word-break: break-word; font-family: var(--mono); font-size: 12px;
  color: var(--text-2); background: rgba(255, 255, 255, .04); border: 1px solid var(--linie);
  border-radius: 12px; padding: 10px; margin: 10px 0 0; max-height: 40vh; overflow: auto;
}
.pruef:empty { display: none; }

#info-mitte {
  position: fixed; z-index: 95; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1);
  width: min(78vw, 300px); padding: 22px 20px 18px; border-radius: 20px; text-align: center;
  background: rgba(12, 14, 16, .92); border: 1px solid rgba(60, 196, 245, .35);
  box-shadow: 0 0 28px -8px rgba(60, 196, 245, .55), 0 20px 40px -16px rgba(0, 0, 0, .95);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  -webkit-animation: info-auf .26s ease; animation: info-auf .26s ease;
}
#info-mitte.weg { display: none !important; }
#info-mitte.geht { opacity: 0; -webkit-transition: opacity .3s; transition: opacity .3s; }
#info-symbol { display: block; color: var(--gruen); -webkit-filter: drop-shadow(0 0 6px rgba(60, 196, 245, .8)); filter: drop-shadow(0 0 6px rgba(60, 196, 245, .8)); }
#info-symbol svg { width: 30px; height: 30px; }
#info-text { margin: 10px 0 0; font-size: 16px; font-weight: 600; line-height: 1.35; color: var(--text); }
@-webkit-keyframes info-auf { from { opacity: 0; -webkit-transform: translate(-50%, -50%) scale(.92); } }
@keyframes info-auf { from { opacity: 0; transform: translate(-50%, -50%) scale(.92); } }

#t-chat .menue-kopf { min-height: 48px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
#t-chat .menue-kopf h1 { margin: 0; padding: 0 58px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#b-chat-zu {
  position: absolute; z-index: 2; left: 0; top: 50%; margin: -31px 0 0; padding: 0;
  width: 48px; height: 48px; min-height: 0; border-radius: 50%;
  font-size: 0; color: transparent; opacity: .92;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dfe3e8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5'/%3E%3Cpath d='M11 18l-6-6 6-6'/%3E%3C/svg%3E") center / 22px no-repeat,
    radial-gradient(circle at 50% 30%, #34373d, #121316 75%);
  border: 1px solid rgba(255, 255, 255, .18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 10px 24px -8px rgba(0, 0, 0, .95), 0 0 18px -6px rgba(210, 220, 235, .25);
}
#b-chat-zu:active { -webkit-transform: scale(.94); transform: scale(.94); }

#t-chat .menue-kopf {
  position: -webkit-sticky; position: sticky; z-index: 25; top: 0;
  margin: 0 -14px; padding: calc(8px + env(safe-area-inset-top, 0px)) 14px 10px;
  background: linear-gradient(180deg, rgba(10, 11, 13, .96), rgba(10, 11, 13, .9));
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
#t-chat .menue-kopf #b-chat-zu { left: 14px; top: calc(8px + env(safe-area-inset-top, 0px)); margin: 0; }
#t-chat .menue-kopf h1 { line-height: 48px; }
#t-chat .menue-kopf::after { position: absolute; left: 24px; right: 24px; bottom: 0; margin: 0; }
html, body { overflow-x: clip; }

.eingabe .rund.weg, #chat-feld.weg { display: none !important; }
.eingabe .rund.mikro { color: var(--gruen); border-color: rgba(60, 196, 245, .4); box-shadow: 0 0 12px -4px rgba(60, 196, 245, .6); }
.eingabe .rund.mikro svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
#aufnahme {
  -webkit-flex: 1; flex: 1; min-width: 0; height: 40px; margin: 0 8px 0 0; padding: 0 14px;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 10px;
  border: 1px solid rgba(232, 93, 93, .35); border-radius: 18px; background: rgba(232, 93, 93, .06);
}
#aufnahme.weg { display: none !important; }
#b-ton-weg {
  position: absolute; z-index: 2; right: 4px; bottom: calc(100% + 12px);
  width: 46px; height: 46px; min-height: 0; margin: 0; padding: 0; border-radius: 50%;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  color: #ff8a8a; background: radial-gradient(circle at 50% 30%, #3a2a2c, #160f10 80%);
  border: 1px solid rgba(232, 93, 93, .45);
  box-shadow: 0 0 14px -4px rgba(232, 93, 93, .7), 0 10px 22px -10px rgba(0, 0, 0, .95);
  -webkit-animation: info-auf-klein .22s ease; animation: info-auf-klein .22s ease;
}
#b-ton-weg.weg { display: none !important; }
#b-ton-weg:active { -webkit-transform: scale(.92); transform: scale(.92); }
#b-ton-weg svg { width: 21px; height: 21px; }
@-webkit-keyframes info-auf-klein { from { opacity: 0; -webkit-transform: translateY(8px) scale(.8); } }
@keyframes info-auf-klein { from { opacity: 0; transform: translateY(8px) scale(.8); } }
.ton-punkt {
  -webkit-flex: none; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--rot);
  box-shadow: 0 0 10px var(--rot); -webkit-animation: ton-puls 1.1s ease-in-out infinite; animation: ton-puls 1.1s ease-in-out infinite;
}
@-webkit-keyframes ton-puls { 50% { opacity: .25; } }
@keyframes ton-puls { 50% { opacity: .25; } }
#ton-zeit { font-size: 15px; font-weight: 600; color: var(--text); font-variant-numeric: tabular-nums; }

.bl.sprache { min-width: 220px; }
.ton { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 10px; }
.ton-knopf {
  -webkit-flex: none; flex: none; width: 38px; height: 38px; min-height: 0; margin: 0; padding: 0; border-radius: 50%;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  border: 0; color: #041521; background: radial-gradient(circle at 50% 30%, #e6f9ff, #3cc4f5 45%, #0a5f9e 100%);
  box-shadow: 0 0 12px -3px rgba(60, 196, 245, .7);
}
.bl.ein .ton-knopf { color: var(--text); background: radial-gradient(circle at 50% 30%, #3a3d43, #16171a 80%); border: 1px solid rgba(255, 255, 255, .16); box-shadow: none; }
.ton-knopf svg { width: 16px; height: 16px; fill: currentColor; }
.ton-spur { -webkit-flex: 1; flex: 1; min-width: 60px; height: 4px; border-radius: 2px; background: rgba(255, 255, 255, .14); overflow: hidden; }
.ton-fort { display: block; width: 0; height: 100%; border-radius: 2px; background: var(--gruen); box-shadow: 0 0 6px rgba(60, 196, 245, .8); }
.ton-dauer { -webkit-flex: none; flex: none; min-width: 34px; font-size: 12.5px; color: var(--text-2); text-align: right; font-variant-numeric: tabular-nums; }
.chat-unter svg.mikro-klein { color: var(--gruen); }

#blasen { -webkit-justify-content: flex-end; justify-content: flex-end; }

.kon-suche { scroll-margin-top: 96px; }

#druck-schleier { position: fixed; z-index: 96; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, .35); }
#druck-schleier.weg, #druck-menue.weg { display: none !important; }
#druck-menue {
  position: fixed; z-index: 97; min-width: 210px; max-width: calc(100vw - 32px); padding: 6px; border-radius: 18px;
  border: 1px solid transparent;
  background: linear-gradient(180deg, rgba(28, 30, 34, .96), rgba(10, 11, 13, .97)) padding-box,
    linear-gradient(180deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, .06) 40%, rgba(255, 255, 255, .12)) border-box;
  box-shadow: 0 18px 40px -10px rgba(0, 0, 0, .95), 0 0 22px -10px rgba(60, 196, 245, .45);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  -webkit-animation: info-auf-klein .18s ease; animation: info-auf-klein .18s ease;
}
#druck-menue button {
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 12px;
  width: 100%; min-height: 0; margin: 0; padding: 12px 14px; border: 0; border-radius: 12px;
  background: none; box-shadow: none; text-shadow: none; text-align: left;
  color: var(--text); font-size: 15.5px; font-weight: 500;
}
#druck-menue button + button { border-top: 1px solid rgba(255, 255, 255, .06); border-radius: 0; }
#druck-menue button:active { background: rgba(255, 255, 255, .06); }
#druck-menue button svg { -webkit-flex: none; flex: none; color: var(--text-2); }
#druck-menue button.rot, #druck-menue button.rot svg { color: #ff8a8a; }
.bl.gedrueckt { -webkit-filter: brightness(1.25); filter: brightness(1.25); }
#chat-liste .kon-zeile.gedrueckt { background: rgba(60, 196, 245, .1); }
#chat-liste .kon-zeile, .bl { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.bl.geheim .bl-kopf { margin-bottom: 0; }

.neu-knopf { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; touch-action: manipulation; }
.neu-knopf.gedrueckt { -webkit-transform: scale(.93); transform: scale(.93); }

#chat-name { cursor: pointer; }
#chat-name:active { opacity: .75; }
#t-chat .menue-kopf #b-chat-leeren, #b-chat-leeren {
  position: absolute; z-index: 2; left: auto; right: 14px; top: calc(8px + env(safe-area-inset-top, 0px)); margin: 0; padding: 0;
  width: 48px; height: 48px; min-height: 0; border-radius: 50%;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  color: var(--gruen); opacity: .95;
  background: radial-gradient(circle at 50% 30%, #2e2a38, #110f15 75%);
  border: 1px solid rgba(60, 196, 245, .35);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 10px 24px -8px rgba(0, 0, 0, .95), 0 0 16px -6px rgba(60, 196, 245, .55);
}
#b-chat-leeren svg { width: 21px; height: 21px; -webkit-filter: drop-shadow(0 0 4px rgba(60, 196, 245, .7)); filter: drop-shadow(0 0 4px rgba(60, 196, 245, .7)); }
#b-chat-leeren:active { -webkit-transform: scale(.94); transform: scale(.94); }

#frage-schleier {
  position: fixed; z-index: 98; top: 0; right: 0; bottom: 0; left: 0; padding: 24px;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  background: rgba(0, 0, 0, .55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
}
#frage-schleier.weg { display: none !important; }
#frage-box {
  width: min(86vw, 330px); padding: 24px 20px 18px; border-radius: 22px; text-align: center;
  border: 1px solid transparent;
  background: linear-gradient(180deg, rgba(28, 30, 34, .97), rgba(10, 11, 13, .98)) padding-box,
    linear-gradient(180deg, rgba(60, 196, 245, .45), rgba(255, 255, 255, .06) 45%, rgba(255, 255, 255, .12)) border-box;
  box-shadow: 0 0 30px -10px rgba(60, 196, 245, .55), 0 22px 44px -16px rgba(0, 0, 0, .95);
  -webkit-animation: info-auf-klein .2s ease; animation: info-auf-klein .2s ease;
}
#frage-symbol { display: block; color: var(--gruen); -webkit-filter: drop-shadow(0 0 6px rgba(60, 196, 245, .8)); filter: drop-shadow(0 0 6px rgba(60, 196, 245, .8)); }
#frage-symbol svg { width: 30px; height: 30px; }
#frage-titel { margin: 10px 0 0; font-size: 17px; font-weight: 700; color: var(--text); letter-spacing: 0; text-transform: none; }
#frage-text { margin: 8px 0 0; font-size: 14px; line-height: 1.45; color: var(--text-2); }
.frage-knoepfe { display: -webkit-flex; display: flex; gap: 10px; margin-top: 18px; }
.frage-knoepfe button { -webkit-flex: 1; flex: 1; min-height: 0; margin: 0; padding: 12px 10px; border-radius: 14px; font-size: 15px; font-weight: 600; }
#frage-nein { color: var(--text); background: rgba(255, 255, 255, .06); border: 1px solid var(--linie); box-shadow: none; }
#frage-ja {
  color: #041521; border: 0;
  background: radial-gradient(circle at 50% 20%, #e6f9ff, #3cc4f5 50%, #0a5f9e 120%);
  box-shadow: 0 0 16px -4px rgba(60, 196, 245, .7);
}

input[type="search"] { -webkit-appearance: none; appearance: none; }
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { -webkit-appearance: none; appearance: none; display: none; }

#kamera-box video { height: 100%; bottom: auto; }
#kamera-box::after {
  top: calc((100% - var(--unten, 190px)) / 2); width: min(62vw, 48vh); height: min(62vw, 48vh);
  margin: calc(min(62vw, 48vh) / -2) 0 0 calc(min(62vw, 48vh) / -2);
}
#scan-unten {
  position: absolute; z-index: 3; left: 0; right: 0; bottom: 0; top: auto;
  display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; -webkit-align-items: center; align-items: center;
  column-gap: 18px; row-gap: 12px;
  padding: 4px max(18px, calc(50% - 200px)) calc(31px + env(safe-area-inset-bottom, 0px));
  background: var(--bg);
}
#scan-unten::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: 44px; pointer-events: none;
  background: linear-gradient(180deg, rgba(5, 5, 6, 0), var(--bg));
}
#b-kamera-logo {
  margin: 0; padding: 0; min-height: 0; border: 0; border-radius: 0; background: none; box-shadow: none;
  width: 92px; -webkit-tap-highlight-color: transparent;
}
#b-kamera-logo img { display: block; width: 92px; height: auto; -webkit-filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .8)); filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .8)); }
#b-kamera-logo:active { -webkit-transform: scale(.95); transform: scale(.95); }
#scan-rechts { display: grid; gap: 10px; justify-items: center; min-width: 0; }

#kamera-box #kamera-zweck {
  position: static; left: auto; right: auto; bottom: auto; margin: 0; max-width: 100%;
  text-align: center; font-size: 13.5px; font-weight: 600; line-height: 1.35; color: var(--text); text-shadow: none;
}
#kamera-box #kamera-zweck:not(.warnung):not(.fehler)::before {
  content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 7px; vertical-align: 1px; border-radius: 50%;
  background: var(--gruen); box-shadow: 0 0 8px var(--gruen);
  -webkit-animation: ton-puls 1.4s ease-in-out infinite; animation: ton-puls 1.4s ease-in-out infinite;
}
#kamera-box #kamera-zweck.warnung, #kamera-box #kamera-zweck.fehler { padding: 6px 9px; font-size: 12.5px; }
#kamera-box #zoom-leiste {
  position: static; -webkit-transform: none; transform: none; left: auto; bottom: auto;
  gap: 4px; padding: 3px; border-radius: 22px; background: rgba(255, 255, 255, .05); border: 1px solid var(--linie); box-shadow: none;
}
#kamera-box #zoom-leiste button { width: 36px; height: 36px; font-size: 20px; }
#kamera-box #zoom-leiste b { min-width: 46px; font-size: 13px; font-variant-numeric: tabular-nums; }
#kamera-box #scan-unten #b-kamera-stop {
  grid-column: 1 / -1; position: static; top: auto; right: auto; bottom: auto;
  width: 100%; height: 38px; min-height: 0; margin: 0; padding: 0; border-radius: 19px;
  background: none; -webkit-backdrop-filter: none; backdrop-filter: none;
  border: 1px solid rgba(60, 196, 245, .45);
  box-shadow: 0 0 12px -3px rgba(60, 196, 245, .55), inset 0 0 10px -6px rgba(60, 196, 245, .6);
  color: var(--gruen); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  text-shadow: 0 0 8px rgba(60, 196, 245, .75), 0 0 16px rgba(60, 196, 245, .3);
}
#kamera-box #scan-unten #b-kamera-stop:active { background: rgba(60, 196, 245, .08); }

.alle-weg-knopf {
  position: fixed; z-index: 29; right: calc(max(20px, calc(50% - 214px)) + 56px + 12px);
  bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  width: 40px; height: 40px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 50%;
  display: -webkit-flex; display: flex; -webkit-align-items: flex-end; align-items: flex-end; -webkit-justify-content: center; justify-content: center;
  background: none; box-shadow: none; color: #ff8a8a;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent;
}
.alle-weg-knopf.weg { display: none !important; }
.alle-weg-knopf svg { width: 26px; height: 26px; margin-bottom: 2px;
  -webkit-filter: drop-shadow(0 0 4px rgba(255, 125, 115, .75)); filter: drop-shadow(0 0 4px rgba(255, 125, 115, .75)); }
.alle-weg-knopf:active { -webkit-transform: scale(.9); transform: scale(.9); }

#mein-voll {
  position: fixed; z-index: 85; top: 0; right: 0; bottom: 0; left: 0; background: var(--bg);
  display: grid; grid-template-rows: auto 1fr auto auto; justify-items: center; -webkit-align-items: center; align-items: center; row-gap: 16px;
  padding: calc(26px + env(safe-area-inset-top, 0px)) max(22px, calc(50% - 200px)) calc(31px + env(safe-area-inset-bottom, 0px));
}
#mein-voll.weg { display: none !important; }
.mein-kopf { width: 100%; display: grid; gap: 12px; justify-items: center; }
.mein-kopf h2 {
  margin: 0; font-family: "DIN Alternate", "Bahnschrift", "Eurostile", var(--sans);
  font-weight: 700; font-size: 26px; letter-spacing: .08em; text-transform: uppercase;
  background: var(--chrom); -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .8)); filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .8));
}
.mein-kopf::after { content: ""; width: 100%; height: 1px; background: linear-gradient(90deg, transparent, rgba(210, 218, 230, .35), transparent); }
.mein-qr { position: relative; width: min(82vw, 50vh, 400px); }
.mein-qr canvas { display: block; width: 100%; height: auto; border-radius: 10px; image-rendering: pixelated; }
.mein-qr::after {
  content: ""; position: absolute; top: -12px; right: -12px; bottom: -12px; left: -12px; pointer-events: none;
  background:
    linear-gradient(var(--gruen), var(--gruen)) top left / 28px 3px no-repeat, linear-gradient(var(--gruen), var(--gruen)) top left / 3px 28px no-repeat,
    linear-gradient(var(--gruen), var(--gruen)) top right / 28px 3px no-repeat, linear-gradient(var(--gruen), var(--gruen)) top right / 3px 28px no-repeat,
    linear-gradient(var(--gruen), var(--gruen)) bottom left / 28px 3px no-repeat, linear-gradient(var(--gruen), var(--gruen)) bottom left / 3px 28px no-repeat,
    linear-gradient(var(--gruen), var(--gruen)) bottom right / 28px 3px no-repeat, linear-gradient(var(--gruen), var(--gruen)) bottom right / 3px 28px no-repeat;
  -webkit-filter: drop-shadow(0 0 6px rgba(60, 196, 245, .7)); filter: drop-shadow(0 0 6px rgba(60, 196, 245, .7));
}
.mein-unter { display: grid; gap: 5px; text-align: center; }
.mein-unter b { font-size: 22px; font-weight: 700; letter-spacing: .04em; color: var(--text); }
.mein-unter .nummer { font-size: 14px; color: var(--text); }
#b-mein-zu {
  width: 100%; height: 38px; min-height: 0; margin: 0; padding: 0; border-radius: 19px; background: none;
  border: 1px solid rgba(60, 196, 245, .45);
  box-shadow: 0 0 12px -3px rgba(60, 196, 245, .55), inset 0 0 10px -6px rgba(60, 196, 245, .6);
  color: var(--gruen); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  text-shadow: 0 0 8px rgba(60, 196, 245, .75), 0 0 16px rgba(60, 196, 245, .3);
}
#b-mein-zu:active { background: rgba(60, 196, 245, .08); }

#t-chats > .kon-trenner { display: none; }
#mein-voll #mein-name { font-family: var(--sans); font-size: 22px; font-weight: 700; color: var(--text); }

#s-menue .menue-kopf h1, #t-chat .menue-kopf h1, .mein-kopf h2, #t-chats > h2.seiten-titel, #kon-titel, #s-menue > h2 {
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 14px;
  width: 100%; margin: 0; text-align: center; white-space: nowrap; overflow: hidden;
  font-family: var(--sans); font-size: 13px; font-weight: 600; letter-spacing: .32em; text-transform: uppercase;
  color: var(--text-2); background: none; -webkit-background-clip: border-box; background-clip: border-box;
  -webkit-text-fill-color: currentColor; -webkit-filter: none; filter: none; text-shadow: none;
}
#t-chats > h2.seiten-titel, #kon-titel, #s-menue > h2 { font-size: 11.5px; }
#t-chats > h2.seiten-titel, #kon-titel { margin: 18px 2px 8px; }
#s-menue > h2 { margin: 26px 2px 10px; }
#s-menue .menue-kopf h1::before, #s-menue .menue-kopf h1::after, #t-chat .menue-kopf h1::before, #t-chat .menue-kopf h1::after, .mein-kopf h2::before, .mein-kopf h2::after, #t-chats > h2.seiten-titel::before, #t-chats > h2.seiten-titel::after, #kon-titel::before, #kon-titel::after, #s-menue > h2::before, #s-menue > h2::after {
  content: ""; -webkit-flex: 1; flex: 1; min-width: 10px; height: 1px; background: linear-gradient(90deg, transparent, rgba(210, 218, 230, .35));
}
#s-menue .menue-kopf h1::after, #t-chat .menue-kopf h1::after, .mein-kopf h2::after, #t-chats > h2.seiten-titel::after, #kon-titel::after, #s-menue > h2::after {
  background: linear-gradient(90deg, rgba(210, 218, 230, .35), transparent);
}
#s-menue .menue-kopf h1 { padding: 0 58px; line-height: 48px; }
.mein-kopf::after { display: none; }

#s-menue .menue-kopf h1 { font-size: 20px; letter-spacing: .3em; }
#t-chat .menue-kopf { margin-top: -15px; }

#s-menue .menue-kopf h1 { color: var(--gruen); text-shadow: 0 0 8px rgba(60, 196, 245, .75), 0 0 16px rgba(60, 196, 245, .3); }
#s-menue .menue-kopf h1::before { background: linear-gradient(90deg, transparent, rgba(60, 196, 245, .45)); }
#s-menue .menue-kopf h1::after { background: linear-gradient(90deg, rgba(60, 196, 245, .45), transparent); }

#t-chat .menue-kopf { background: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
#t-chat .menue-kopf::before {
  content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(180deg, rgba(10, 11, 13, .96), rgba(10, 11, 13, .9));
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  opacity: 0; -webkit-transition: opacity .25s ease; transition: opacity .25s ease;
}
#t-chat .menue-kopf.hinterlegt::before { opacity: 1; }
#mein-voll {
  background:
    radial-gradient(120% 55% at 50% -12%, rgba(255, 255, 255, .13), rgba(255, 255, 255, .03) 45%, transparent 65%),
    linear-gradient(180deg, #3a3d42 0%, #2e3034 45%, #232528 100%);
  background-color: #2e3034;
}

#mein-voll {
  background:
    radial-gradient(120% 55% at 50% -12%, rgba(255, 255, 255, .26), rgba(255, 255, 255, .07) 45%, transparent 68%),
    linear-gradient(180deg, #3a3d42 0%, #2e3034 45%, #232528 100%);
}
.mein-qr::before {
  content: ""; position: absolute; z-index: -1; pointer-events: none;
  right: -38%; bottom: -38%; width: 90%; height: 90%; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, .30) 0%, rgba(255, 255, 255, .12) 35%, transparent 70%);
}

#kontaktliste .kon-zeile { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
#kontaktliste .kon-zeile.gedrueckt { background: rgba(60, 196, 245, .1); }

#frage-feld { display: block; width: 100%; margin: 14px 0 0; padding: 12px 14px; border-radius: 14px; font-size: 16px; text-align: center; }
#frage-feld.weg { display: none; }
#frage-symbol .stift-gross { width: 30px; height: 30px; }

#chat-suche-feld { margin: 2px 2px 2px; }
#chat-suche-feld.weg { display: none; }
#t-chats .kon-suche input {
  -webkit-flex: 1; flex: 1; min-width: 0; margin: 0; padding: 6px 0; min-height: 0; border: 0; border-radius: 0;
  background: none; box-shadow: none; color: var(--text); font-size: 16px; outline: none;
}
#t-chats .kon-suche input::placeholder { color: #5d626a; }

.teil-punkte { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; gap: 7px; margin: 2px 0 0; }
.teil-punkte.weg { display: none !important; }
.teil-punkte i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255, 255, 255, .25); }
.teil-punkte i.an { background: var(--gruen); box-shadow: 0 0 6px rgba(60, 196, 245, .8); }

#voll {
  position: fixed; z-index: 90; top: 0; right: 0; bottom: 0; left: 0;
  display: grid; grid-template-rows: auto 1fr auto auto; justify-items: center; -webkit-align-items: center; align-items: center; row-gap: 16px;
  -webkit-flex-direction: row; flex-direction: row;
  padding: calc(26px + env(safe-area-inset-top, 0px)) 14px calc(31px + env(safe-area-inset-bottom, 0px));
  background:
    radial-gradient(120% 55% at 50% -12%, rgba(255, 255, 255, .26), rgba(255, 255, 255, .07) 45%, transparent 68%),
    linear-gradient(180deg, #3a3d42 0%, #2e3034 45%, #232528 100%);
  background-color: #2e3034;
}
#voll .mein-qr { width: min(calc(100vw - 28px), 60vh, 560px); }
#voll .mein-qr::after { top: -8px; right: -8px; bottom: -8px; left: -8px; }
#voll #voll-qr { width: 100%; height: auto; background: none; }
#voll .mein-unter b { font-family: var(--sans); font-size: 18px; }
#voll #voll-info { margin: 0; max-width: none; font-size: 13.5px; color: var(--text-2); }
.voll-knoepfe { display: grid; grid-template-columns: 1fr 2fr; gap: 10px; width: min(100%, 372px); }
#voll .voll-knoepfe button {
  position: static; width: 100%; height: 38px; min-height: 0; margin: 0; padding: 0; border-radius: 19px; background: none;
  font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
#voll #b-voll-zu {
  border: 1px solid rgba(60, 196, 245, .45); color: var(--gruen);
  box-shadow: 0 0 12px -3px rgba(60, 196, 245, .55), inset 0 0 10px -6px rgba(60, 196, 245, .6);
  text-shadow: 0 0 8px rgba(60, 196, 245, .75), 0 0 16px rgba(60, 196, 245, .3);
}
#voll #b-voll-weg { border: 1px solid rgba(255, 125, 115, .4); color: #ff8a8a; box-shadow: none; text-shadow: none; }
#voll #b-voll-zu:active { background: rgba(60, 196, 245, .08); }
#voll #b-voll-weg:active { background: rgba(255, 125, 115, .08); }

#kontaktliste.auswahl-an .kon-zeile::after {
  content: ""; -webkit-flex: none; flex: none; width: 30px; height: 30px; margin-left: 12px; border-radius: 50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9f5dc' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / 16px no-repeat, rgba(60, 196, 245, .16);
  box-shadow: inset 0 0 0 1px rgba(60, 196, 245, .5), 0 0 12px -3px rgba(60, 196, 245, .6);
}
#kontaktliste.auswahl-an .kon-zeile.gewaehlt::after {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b1a12' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 16px no-repeat, var(--gruen);
  box-shadow: inset 0 0 0 1px rgba(159, 230, 255, .8), 0 0 14px -2px rgba(60, 196, 245, .8);
}
#kontaktliste.auswahl-an .kon-zeile.gewaehlt .kon-name { color: #9fe6ff; }
#kontaktliste.auswahl-an .kon-pfeil { display: none !important; }
#kon-auswahl-leiste {
  position: fixed; z-index: 31; left: max(14px, calc(50% - 220px)); right: max(14px, calc(50% - 220px));
  bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 8px; padding: 7px 7px 7px 16px;
  border-radius: 26px; border: 1px solid transparent;
  background: linear-gradient(180deg, rgba(28, 30, 34, .94), rgba(10, 11, 13, .96)) padding-box,
    linear-gradient(180deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, .06) 40%, rgba(255, 255, 255, .12)) border-box;
  box-shadow: 0 18px 40px -10px rgba(0, 0, 0, .95);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
#kon-auswahl-leiste.weg, body.tippt #kon-auswahl-leiste { display: none !important; }
#kon-auswahl-zahl { -webkit-flex: 1; flex: 1; min-width: 0; font-size: 14px; color: var(--text-2); white-space: nowrap; }
#kon-auswahl-leiste button {
  width: auto; height: 38px; min-height: 0; margin: 0; padding: 0 16px; border-radius: 19px; background: none; box-shadow: none; text-shadow: none;
  font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
#b-kon-auswahl-nein { color: var(--text); border: 1px solid rgba(255, 255, 255, .16); }
#b-kon-auswahl-weg { color: #ff8a8a; border: 1px solid rgba(255, 125, 115, .45); }
#b-kon-auswahl-weg:disabled { opacity: .4; }
#kon-auswahl-leiste button:active { -webkit-transform: scale(.96); transform: scale(.96); }

#kontaktliste.auswahl-an { padding-bottom: 90px; }

.kon-anzahl {
  margin: 14px 4px 0; padding-bottom: 7px; font-size: 11.5px; font-weight: 600; letter-spacing: .08em; color: var(--gruen); opacity: .8;
  font-variant-numeric: tabular-nums; border-bottom: 1px solid transparent;
  border-image: linear-gradient(90deg, rgba(60, 196, 245, .45), rgba(60, 196, 245, .12) 60%, transparent) 1;
}
.kon-anzahl + .kon-buchstabe { margin-top: 10px; }
#kon-auswahl-leiste { display: grid; grid-template-columns: minmax(0, 1fr) 104px 118px; gap: 6px; padding-left: 14px; }
#kon-auswahl-leiste.weg { display: none !important; }
#kon-auswahl-zahl { font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; }
#kon-auswahl-leiste button { width: 100%; padding: 0 6px; white-space: nowrap; }

#t-chat .menue-kopf #b-chat-zu, #b-menue-zu {
  width: 44px !important; height: 44px !important; min-height: 0 !important; padding: 0 !important;
  font-size: 0 !important; color: transparent !important; border: 0 !important; border-radius: 50% !important; box-shadow: none !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233cc4f5' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E") center / 26px no-repeat !important; opacity: 1 !important;
  -webkit-filter: drop-shadow(0 0 4px rgba(60, 196, 245, .8)); filter: drop-shadow(0 0 4px rgba(60, 196, 245, .8));
}

.such-muell { -webkit-flex: none; flex: none; width: 34px; height: 30px; min-height: 0; margin: 0 0 0 6px; padding: 0; border: 0; border-radius: 8px;
  background: none; box-shadow: none; color: #ff8a8a; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.such-muell svg { width: 20px; height: 20px; -webkit-filter: drop-shadow(0 0 4px rgba(255, 125, 115, .6)); filter: drop-shadow(0 0 4px rgba(255, 125, 115, .6)); }
.such-muell:active { -webkit-transform: scale(.9); transform: scale(.9); }
.kon-suche .such-muell svg { width: 20px; height: 20px; margin: 0; color: #ff8a8a; stroke: #ff8a8a; fill: none; opacity: 1; }

#chat-liste .verl-tag:first-of-type, .kon-anzahl { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: space-between; justify-content: space-between; }
.verl-tag .such-muell, .kon-anzahl .such-muell { height: 26px; margin: -7px 0 -7px 6px; background: none; }
.verl-tag .such-muell svg, .kon-anzahl .such-muell svg { width: 20px; height: 20px; margin: 0; color: #ff8a8a; stroke: #ff8a8a; fill: none; opacity: 1; }

body.tippt .neu-knopf, body.tippt .alle-weg-knopf { display: none !important; }

.m-chat-reihe { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; }
.m-chat-reihe span { -webkit-flex: 1; flex: 1; }
.m-chat-reihe .such-muell { height: 28px; margin: -6px -6px -6px 8px; background: none; }
.m-chat-reihe .such-muell.weg { display: none; }
.m-chat-reihe .such-muell svg { width: 20px; height: 20px; margin: 0; color: #ff8a8a; stroke: #ff8a8a; fill: none; opacity: 1; }
#m-push-hinweis { margin-bottom: 16px; }

#druck-sperre { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2147483000; background: transparent;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; touch-action: none; }
#kamera-box, #kamera-box * { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }

.tag-nacht { display: -webkit-inline-flex; display: inline-flex; justify-self: center; margin-top: 8px; padding: 3px; gap: 3px;
  border-radius: 18px; border: 1px solid rgba(60, 196, 245, .4); background: rgba(0, 0, 0, .25); }
.tag-nacht button { display: -webkit-inline-flex; display: inline-flex; -webkit-align-items: center; align-items: center; gap: 6px;
  width: auto; min-height: 0; height: 30px; margin: 0; padding: 0 14px; border: 0; border-radius: 15px; background: none; box-shadow: none;
  color: var(--leise); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.tag-nacht svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.tag-nacht button.an { background: rgba(60, 196, 245, .2); color: var(--gruen); text-shadow: 0 0 8px rgba(60, 196, 245, .6); }
body.qr-tag #mein-voll, body.qr-tag #voll { background: #fff !important; --text: #15161a; --leise: #50545b; }
body.qr-tag #mein-voll .mein-qr::before, body.qr-tag #voll .mein-qr::before { display: none; }
body.qr-tag #mein-voll .mein-kopf h2, body.qr-tag #voll .mein-kopf h2 { color: #3a3b40 !important; -webkit-text-fill-color: #3a3b40 !important; text-shadow: none !important; }
body.qr-tag #mein-voll .mein-unter b, body.qr-tag #mein-voll .mein-unter span, body.qr-tag #voll .mein-unter b, body.qr-tag #voll .mein-unter span { color: #15161a; }
body.qr-tag .tag-nacht { background: #f1f1f3; border-color: #a0d6ea; }
body.qr-tag .tag-nacht button.an { background: #15161a; color: #fff; text-shadow: none; }
body.qr-tag .teil-punkte i { background: #d0d0d4; }
body.qr-tag .teil-punkte i.an { background: #4fb2d6; box-shadow: none; }
body.qr-tag #b-mein-zu, body.qr-tag #b-voll-zu { color: #2f8eb0 !important; text-shadow: none !important; border-color: #a0d6ea !important; box-shadow: none !important; background: none !important; }
body.qr-tag #b-voll-weg { color: #c2362c !important; text-shadow: none !important; box-shadow: none !important; }
#kamera-box #kamera-zweck.schwer, #kamera-zweck.schwer { color: #ffcf6b !important; font-weight: 700; }

body.qr-tag #b-mein-zu, body.qr-tag #b-voll-zu {
  color: #15161a !important; -webkit-text-fill-color: #15161a !important; text-shadow: none !important; box-shadow: none !important;
  border-color: #15161a !important; background: transparent !important; }

#mein-voll { padding-left: 14px; padding-right: 14px; }
#mein-voll .mein-qr { width: min(calc(100vw - 28px), 60vh, 560px); }
#mein-voll .mein-qr::after { top: -8px; right: -8px; bottom: -8px; left: -8px; }
#mein-voll #b-mein-zu { width: min(100%, 372px); }
#chat-feld { font-size: 16px; }
#blasen .chat-leer { text-align: center; margin-top: 30px; }
#druck-menue button svg { width: 20px; height: 20px; }

#s-haupt.im-chat > .kopf, #s-haupt.im-chat > .status { display: none !important; }
#s-haupt.im-chat #t-chat .menue-kopf { margin-top: calc(-26px - env(safe-area-inset-top, 0px)); }

.bl-von { display: block; margin-bottom: 2px; font-size: 12px; font-weight: 700; color: var(--gruen); }

#b-chat-leeren.zahnrad svg { color: var(--gruen); stroke: var(--gruen); fill: none; }


.gruppe-knopf {
  position: fixed; z-index: 29; right: calc(max(20px, calc(50% - 214px)) + 68px);
  bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  width: 48px; height: 48px; min-height: 0; margin: 0; padding: 0; border-radius: 50%;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;
  color: var(--gruen); background: rgba(16, 21, 24, .92); border: 1.5px solid rgba(60, 196, 245, .55);
  box-shadow: 0 0 16px -4px rgba(60, 196, 245, .7), 0 12px 26px -10px rgba(0, 0, 0, .95);
}
.gruppe-knopf svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.gruppe-knopf:active { -webkit-transform: scale(.93); transform: scale(.93); }
body.tippt .gruppe-knopf { display: none !important; }

.gruppe-knopf {
  right: calc(max(20px, calc(50% - 214px)) + 56px + 12px); bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  width: 40px; height: 40px; border: 0; background: none; box-shadow: none;
  -webkit-align-items: flex-end; align-items: flex-end;
}
.gruppe-knopf svg { width: 28px; height: 28px; margin-bottom: 2px;
  -webkit-filter: drop-shadow(0 0 4px rgba(60, 196, 245, .8)); filter: drop-shadow(0 0 4px rgba(60, 196, 245, .8)); }


.gruppe-knopf { border: 1.5px solid rgba(60, 196, 245, .6); -webkit-align-items: center; align-items: center; }
.gruppe-knopf svg { width: 22px; height: 22px; margin-bottom: 0; }

#t-oeff > h2.seiten-titel { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 14px; width: 100%; margin: 18px 2px 8px;
  font-family: var(--sans); font-size: 11.5px; font-weight: 600; letter-spacing: .32em; text-transform: uppercase; color: var(--text-2); }
#t-oeff > h2.seiten-titel::before, #t-oeff > h2.seiten-titel::after { content: ""; -webkit-flex: 1; flex: 1; min-width: 10px; height: 1px; background: linear-gradient(90deg, transparent, rgba(210, 218, 230, .35)); }
#t-oeff > h2.seiten-titel::after { background: linear-gradient(90deg, rgba(210, 218, 230, .35), transparent); }
#b-voll-weg.weg { display: none !important; }
#voll .voll-knoepfe.einzeln { grid-template-columns: 1fr; }

#oeff-neu-box { margin: 4px 0 14px; padding: 10px; border-radius: var(--radius); border: 1px solid var(--linie); background: var(--flaeche), #0d0e10; box-shadow: var(--kante-licht), var(--kante-schatten); }
#oeff-feld { margin: 0; min-height: 76px; padding: 10px 12px; font-size: 16px; border-radius: 12px; resize: none; }
#b-oeff-senden { -webkit-flex: none; flex: none; width: auto; margin: 0; padding: 9px 16px; border-radius: 999px; font-size: 14px; font-weight: 700; color: #041521; border: 0;
  background: radial-gradient(circle at 50% 30%, #e6f9ff, #3cc4f5 55%, #1580c4 100%); box-shadow: 0 0 14px -3px rgba(60, 196, 245, .7); }
#b-oeff-senden:disabled { opacity: 1; color: var(--gruen); text-shadow: 0 0 8px rgba(60, 196, 245, .6);
  background: radial-gradient(circle at 50% 30%, #2e2a38, #110f15 75%); border: 1px solid rgba(60, 196, 245, .35);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 16px -6px rgba(60, 196, 245, .55); }
#b-oeff-senden { border: 1px solid transparent; }

#oeff-feld:focus { border-color: rgba(60, 196, 245, .55);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, .65), 0 0 0 4px rgba(60, 196, 245, .10), 0 0 24px -6px rgba(60, 196, 245, .45); }

.oeff-post { display: -webkit-flex; display: flex; gap: 12px; margin: 0 0 10px; padding: 12px 14px; border-radius: var(--radius); border: 1px solid var(--linie);
  background: var(--flaeche), #0d0e10; box-shadow: var(--kante-licht), var(--kante-schatten); -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.oeff-post.neu { border-color: rgba(60, 196, 245, .55); box-shadow: var(--kante-licht), var(--kante-schatten), 0 0 18px -8px rgba(60, 196, 245, .8); }
.oeff-ava { position: relative; -webkit-flex: none; flex: none; width: 42px; height: 42px; margin-top: 2px; border-radius: 50%; display: -webkit-flex; display: flex;
  -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; color: #fff; font-weight: 700; font-size: 16px; }
.oeff-ring { position: absolute; top: -4px; left: -4px; width: 50px; height: 50px; overflow: visible; }
.oeff-ring circle { fill: none; stroke-width: 2.5; }
.oeff-ring .ring-grund { stroke: rgba(255, 255, 255, .08); }
.oeff-ring .ring-rest { stroke: #3cc4f5; stroke-linecap: round; -webkit-filter: drop-shadow(0 0 3px #3cc4f5); filter: drop-shadow(0 0 3px #3cc4f5); }
.oeff-rechts { -webkit-flex: 1; flex: 1; min-width: 0; }
.oeff-kopf { display: -webkit-flex; display: flex; -webkit-align-items: baseline; align-items: baseline; gap: 8px; }
.oeff-kopf b { color: var(--silber-hell); }
.oeff-kopf small { min-width: 0; font-size: 11.5px; color: var(--leise); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oeff-neu { margin-left: auto; -webkit-flex: none; flex: none; padding: 1px 6px; border-radius: 6px; font-size: 10px; font-weight: 700; letter-spacing: .08em; color: #041521; background: var(--gruen); }
.oeff-t { margin: 3px 0 0; white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; color: var(--text); }
.oeff-qr { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 10px; width: auto; min-height: 0; margin: 6px 0 0; padding: 0;
  border: 0; background: none; box-shadow: none; text-shadow: none; color: var(--text-2); font-size: 13.5px; font-weight: 500; text-align: left; }
.oeff-qr-bild { -webkit-flex: none; flex: none; width: 34px; height: 34px; border-radius: 6px; background: url("qr-feld.png") center / cover no-repeat, #fff; box-shadow: 0 0 0 2px #fff; }
.reakt-chips { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.reakt-chip { display: inline-block; width: auto; min-height: 0; margin: 0; padding: 3px 9px; border-radius: 999px; font-size: 13px; font-weight: 600; line-height: 1.35;
  color: var(--text-2); background: rgba(255, 255, 255, .05); border: 1px solid var(--linie); box-shadow: none; text-shadow: none; }
.reakt-chip.mein { border-color: rgba(60, 196, 245, .55); color: #9fe6ff; background: rgba(60, 196, 245, .12); }
.reakt-chip.plus { padding: 3px 11px; color: var(--gruen); }
.bl .reakt-chips { margin-top: 6px; }
.bl.aus .reakt-chips { -webkit-justify-content: flex-end; justify-content: flex-end; }
.reakt-leiste { display: -webkit-flex; display: flex; gap: 2px; padding: 4px 4px 8px; margin-bottom: 4px; border-bottom: 1px solid rgba(255, 255, 255, .06); }
#druck-menue .reakt-leiste button { -webkit-flex: 1; flex: 1; -webkit-justify-content: center; justify-content: center; padding: 8px 0; border: 0; border-radius: 12px; font-size: 22px; }
#druck-menue .reakt-leiste button + button { border-top: 0; border-radius: 12px; }
#druck-menue .reakt-leiste button.an { background: rgba(60, 196, 245, .2); box-shadow: inset 0 0 0 1px rgba(60, 196, 245, .5); }
#druck-menue .reakt-leiste:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 4px; }

.eingabe .rund.knobeln { margin: 0 8px 0 0; font-size: 19px; border-color: rgba(60, 196, 245, .4); background: radial-gradient(circle at 50% 30%, #2e2a38, #110f15 75%); box-shadow: 0 0 12px -4px rgba(60, 196, 245, .6); }
.eingabe .rund.verdeckt { margin: 0 8px 0 0; font-size: 18px; border-color: rgba(255, 255, 255, .14); filter: grayscale(1); opacity: .75; }
.eingabe .rund.verdeckt.an { filter: none; opacity: 1; border-color: rgba(60, 196, 245, .7); background: rgba(60, 196, 245, .2); box-shadow: 0 0 14px -3px rgba(60, 196, 245, .8); }
.bl.verdeckt { min-width: 220px; }
.bl-tag.bl-spiel { color: var(--silber-hell); font-size: 12.5px; letter-spacing: .02em; text-transform: none; }
.ton-fx { display: inline-block; margin-top: 4px; padding: 1px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; color: #041521; background: #9fe6ff; }

 
body.chat-fest { overflow: hidden; }
body.chat-fest #t-chat {
  position: fixed; z-index: 26; left: 0; right: 0; top: var(--vv-top, 0px); height: var(--vv-h, 100vh);
  display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column;
  padding: 0 max(14px, calc(50% - 262px)); background: linear-gradient(180deg, #0b0c0e, #050506);
}
body.chat-fest #t-chat .menue-kopf { position: relative; top: auto; -webkit-flex: none; flex: none; margin-top: 0 !important; }
body.chat-fest #blasen { -webkit-flex: 1 1 auto; flex: 1 1 auto; min-height: 0 !important; overflow-y: auto; -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain; padding: 6px 0 10px !important; -webkit-justify-content: flex-start; justify-content: flex-start; }
body.chat-fest #blasen > :first-child { margin-top: auto; }
body.chat-fest #t-chat .eingabe { position: relative; left: auto; right: auto; bottom: auto !important; -webkit-flex: none; flex: none;
  margin: 4px 0 calc(92px + env(safe-area-inset-bottom, 0px)); -webkit-transition: none; transition: none; }
body.chat-fest.tippt #t-chat .eingabe { margin-bottom: calc(8px + env(safe-area-inset-bottom, 0px)); }

.eingabe .rund.verdeckt { filter: none; opacity: 1; color: var(--text-2); }
.eingabe .rund.verdeckt svg, .eingabe .rund.roboter svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.eingabe .rund.verdeckt.an { color: #9fe6ff; }
.eingabe .rund.roboter { margin: 0 8px 0 0; color: var(--text-2); }
.eingabe .rund.roboter.an { color: #9fe6ff; border-color: rgba(60, 196, 245, .7); background: rgba(60, 196, 245, .2); box-shadow: 0 0 14px -3px rgba(60, 196, 245, .8); }

.eingabe .rund.mikro { position: relative; overflow: visible; }
#t-chat .eingabe.rubbel-an { border-color: rgba(60, 196, 245, .85) !important; box-shadow: 0 0 24px -4px rgba(60, 196, 245, .85), 0 18px 40px -10px rgba(0, 0, 0, .95); }
#t-chat .eingabe.rubbel-an::before { content: attr(data-schild); position: absolute; top: -28px; left: 10px; padding: 3px 10px; border-radius: 999px;
  font-size: 11.5px; font-weight: 700; color: #041521; background: #9fe6ff; box-shadow: 0 0 14px rgba(60, 196, 245, .8); white-space: nowrap; }
body.chat-fest #t-chat .eingabe.rubbel-an { margin-top: 32px; }
.eingabe .rund.verdeckt.immer::after { content: "∞"; position: absolute; right: -5px; bottom: -5px; padding: 0 4px; border-radius: 8px; font-size: 11px; font-weight: 800; line-height: 15px; color: #041521; background: #9fe6ff; }
.eingabe .rund.verdeckt { position: relative; overflow: visible; }

@supports not (overflow-x: clip) { html, body { overflow-x: visible; } }

body.wischt #t-chats { pointer-events: none; }
body.wischt #t-chat { will-change: transform; }

body.wischt #t-chat { z-index: 32; }

.mein-knoepfe { width: 100%; display: grid; gap: 10px; }
#b-mein-senden {
  width: 100%; height: 46px; min-height: 0; margin: 0; padding: 0; border-radius: 23px; border: 0;
  display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; gap: 8px;
  background: linear-gradient(180deg, #6ed2fa, #5cc9f0); color: #fff; font-size: 15.5px; font-weight: 650;
  box-shadow: 0 10px 26px -10px rgba(60, 196, 245, .9);
}
#b-mein-senden svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#b-mein-senden:active { -webkit-transform: scale(.97); transform: scale(.97); }
#scan-extra { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
#scan-extra.weg { display: none !important; }
#scan-extra button {
  height: 42px; min-height: 0; margin: 0; padding: 0 8px; border-radius: 21px; font-size: 14px; font-weight: 600;
  background: rgba(255, 255, 255, .06); border: 1px solid var(--linie); color: var(--text);
}
#scan-extra button:active { background: rgba(60, 196, 245, .14); }
.kon-ungeprueft { -webkit-flex: none; flex: none; margin-left: auto; margin-right: 8px; padding: 2px 8px; border-radius: 999px; font-style: normal;
  font-size: 10.5px; font-weight: 650; letter-spacing: .02em; color: #f2b84b; border: 1px solid rgba(242, 184, 75, .45); white-space: nowrap; }

#frage-text { white-space: pre-line; }
#scan-datei { display: none !important; }

#scan-extra { grid-template-columns: 1fr; }

.bl-spiel.bl-anfrage { cursor: pointer; color: #d6f4ff; border: 1px solid rgba(60, 196, 245, .55); border-radius: 14px; padding: 7px 12px;
  background: rgba(60, 196, 245, .12); box-shadow: 0 0 14px -4px rgba(60, 196, 245, .7); }
.bl-spiel.bl-anfrage:active { background: rgba(60, 196, 245, .22); }

.bl.offcode { cursor: pointer; }
.bl.offcode .bl-kopf { color: #e1c786; }
.bl.offcode .off-text { display: block; margin-top: 3px; font-size: 14px; line-height: 1.4; }
.bl.offcode .off-knopf { display: block; width: 100%; margin: 9px 0 2px; min-height: 0; height: 36px; padding: 0 12px; border-radius: 18px; border: 1px solid rgba(225, 199, 134, .6);
  background: rgba(225, 199, 134, .1); color: #e1c786; font-size: 13px; font-weight: 650; }
#mein-voll.fremd #b-mein-senden { display: none !important; }

.kon-offline { display: inline-block; vertical-align: -3px; margin-right: 6px; font-style: normal; color: #e1c786; }
.kon-offline svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

#m-verloren.rot { border: 1px solid rgba(255, 90, 78, .75); color: #ff8a80; border-radius: 12px; }
#frage-box.rot {
  background: linear-gradient(180deg, rgba(28, 30, 34, .97), rgba(10, 11, 13, .98)) padding-box,
    linear-gradient(180deg, rgba(255, 90, 78, .7), rgba(255, 255, 255, .06) 45%, rgba(255, 255, 255, .12)) border-box;
  box-shadow: 0 0 30px -10px rgba(255, 90, 78, .6), 0 22px 44px -16px rgba(0, 0, 0, .95);
}
#frage-box.rot #frage-symbol { color: #ff8a80; -webkit-filter: drop-shadow(0 0 6px rgba(255, 90, 78, .8)); filter: drop-shadow(0 0 6px rgba(255, 90, 78, .8)); }
#frage-box.rot #frage-ja { color: #fff; background: radial-gradient(circle at 50% 20%, #ffb4aa, #ff5a4e 50%, #8f1a12 120%); box-shadow: 0 0 16px -4px rgba(255, 90, 78, .7); }

#frage-box.nur-schliessen #frage-ja { display: none !important; }

#t-chat.chat-mehrere #b-chat-leeren, #t-chat.chat-mehrere #b-mikro { visibility: hidden; }
#t-chat.chat-sonder #b-chat-leeren { visibility: hidden; }

#chat-liste .kon-zeile.chat-zeile.chat-bv .chat-text b { color: #ff6b5e; letter-spacing: .08em; }
#chat-liste .kon-zeile.chat-zeile.chat-bv .chat-unter { color: #ff8a80; }
#chat-liste .kon-zeile.chat-zeile.chat-bv .chat-zahl { background: #ff6b5e; color: #2b0603; }
#t-chat.chat-bv #chat-name { color: #ff6b5e; letter-spacing: .08em; }
#info-zu { margin-top: 14px; font: 700 14px var(--sans, system-ui); padding: 8px 18px; border-radius: 99px; border: 1px solid #3cc4f5; background: #3cc4f5; color: #041521; cursor: pointer; }
#info-zu.weg { display: none; }

#m-problem-knopf { margin-top: 10px; }

#frage-problem { display: block; width: 100%; box-sizing: border-box; min-height: 110px; margin: 14px 0 0; padding: 12px 14px; border-radius: 14px; font: inherit; font-size: 15px; resize: vertical; text-align: left; }
#frage-problem.weg { display: none; }

