/* glamp2go – Design-System mit 5 Farbpaletten (data-farbe) und Hell/Dunkel (data-modus oder System) */
:root{
  --r:14px; --top:58px; --chips:50px; --nav:64px;
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --stell:#0e9f6e; --camp:#2563eb; --ent:#7c3aed; --wasser:#0891b2; --lpg:#ea580c; --service:#64748b; --frei:#db2777;
  --essen:#d97706; --tanken:#0369a1; --einkauf:#65a30d; --gesundheit:#dc2626; --waesche:#0d9488; --waschanlage:#6366f1;
  --ok:#15803d; --warn:#b45309; --bad:#b91c1c;
}
/* ---------- Palette 1: Petrol & Koralle (Standard) ---------- */
:root, [data-farbe="petrol"]{
  --bg:#f3f6f7; --card:#ffffff; --card2:#eef3f5; --ink:#0f1d24; --mute:#5a6b73; --line:#dde5e8;
  --brand:#0e5e6f; --brand2:#13849b; --brand-ink:#ffffff; --accent:#ff6b4a; --accent-ink:#2a0d05;
  --top-bg:#0b2730; --top-ink:#e8f5f7; --logo:#5fd3e4; --bubble-me:#d8f1f5; --bubble:#ffffff; --chatbg:#e9eff1;
  --shadow:0 8px 28px rgba(8,30,38,.16);
}
/* ---------- Palette 2: Sand & Ozean ---------- */
[data-farbe="ozean"]{
  --bg:#faf6ef; --card:#fffdf9; --card2:#f3ece0; --ink:#1d1a16; --mute:#6b6457; --line:#e9e1d3;
  --brand:#1d4e89; --brand2:#2f6db5; --brand-ink:#ffffff; --accent:#f28c28; --accent-ink:#2b1500;
  --top-bg:#1d4e89; --top-ink:#f4f8ff; --logo:#ffd08a; --bubble-me:#dbe8fb; --bubble:#fffdf9;
  --chatbg:#f1eadd; --shadow:0 8px 28px rgba(40,30,10,.14);
}
/* ---------- Palette 3: Graphit & Limette ---------- */
[data-farbe="graphit"]{
  --bg:#f2f3f0; --card:#ffffff; --card2:#ebede8; --ink:#16181a; --mute:#5f655f; --line:#dfe2dc;
  --brand:#23272a; --brand2:#3b4146; --brand-ink:#ffffff; --accent:#a8d930; --accent-ink:#172000;
  --top-bg:#16181a; --top-ink:#eef1ea; --logo:#b8ea3f; --bubble-me:#e6f5c4; --bubble:#ffffff; --chatbg:#e8eae5;
  --shadow:0 8px 28px rgba(0,0,0,.15);
}
/* ---------- Palette 4: Abendrot ---------- */
[data-farbe="abend"]{
  --bg:#f7f5fb; --card:#ffffff; --card2:#f0ecf8; --ink:#1c1630; --mute:#655d7a; --line:#e5dff1;
  --brand:#4b2e83; --brand2:#6a46b8; --brand-ink:#ffffff; --accent:#ff8f3f; --accent-ink:#2e1300;
  --top-bg:linear-gradient(100deg,#2f1b5c 0%,#5b2a78 55%,#8a3463 100%); --top-ink:#fff4ec; --logo:#ffb37a; --bubble-me:#ece3ff; --bubble:#ffffff; --chatbg:#efeaf7;
  --shadow:0 8px 28px rgba(40,20,80,.16);
}
/* ---------- Palette 5: Wald (bisher) ---------- */
[data-farbe="wald"]{
  --bg:#f6f7f4; --card:#ffffff; --card2:#eef1ea; --ink:#18201b; --mute:#5b665f; --line:#dfe4dc;
  --brand:#14532d; --brand2:#1f7a45; --brand-ink:#ffffff; --accent:#f59e0b; --accent-ink:#3b2500;
  --top-bg:#14532d; --top-ink:#ffffff; --logo:#bbf7d0; --bubble-me:#dcf3df; --bubble:#ffffff; --chatbg:#e9eee6;
  --shadow:0 6px 24px rgba(20,40,25,.16);
}
/* ---------- Dunkel ---------- */
@media (prefers-color-scheme: dark){
  :root:not([data-modus="hell"]){ --ok:#4ade80; --warn:#fbbf24; --bad:#f87171;
    --stell:#34d399; --camp:#60a5fa; --ent:#a78bfa; --wasser:#22d3ee; --lpg:#fb923c; --service:#94a3b8; --frei:#f472b6; }
  :root:not([data-modus="hell"]), :root:not([data-modus="hell"])[data-farbe="petrol"]{
    --bg:#0b1418; --card:#121f25; --card2:#182a31; --ink:#e6f0f2; --mute:#93a9b1; --line:#22363e;
    --brand:#2bb3c8; --brand2:#5fd3e4; --brand-ink:#04222a; --accent:#ff8a6b; --accent-ink:#2a0d05;
    --top-bg:#08181d; --top-ink:#e6f6f8; --bubble-me:#0f3d47; --bubble:#162a31; --chatbg:#0e1a1f; --shadow:0 8px 28px rgba(0,0,0,.5); }
  :root:not([data-modus="hell"])[data-farbe="ozean"]{
    --bg:#11151b; --card:#1a2029; --card2:#212a35; --ink:#eef2f8; --mute:#a0abbb; --line:#2a3443;
    --brand:#6ea8ff; --brand2:#9cc3ff; --brand-ink:#0a1830; --accent:#ffad5c; --top-bg:#0f1a2b; --top-ink:#eef4ff;
    --bubble-me:#1d3a63; --bubble:#202835; --chatbg:#141a22; --shadow:0 8px 28px rgba(0,0,0,.5); }
  :root:not([data-modus="hell"])[data-farbe="graphit"]{
    --bg:#0e1011; --card:#17191b; --card2:#1f2224; --ink:#eceee8; --mute:#9aa096; --line:#2a2e30;
    --brand:#b4e33d; --brand2:#ccf26a; --brand-ink:#11160a; --accent:#b4e33d; --top-bg:#0b0c0d; --top-ink:#eef1ea;
    --bubble-me:#2c3a12; --bubble:#1f2224; --chatbg:#121415; --shadow:0 8px 28px rgba(0,0,0,.6); }
  :root:not([data-modus="hell"])[data-farbe="abend"]{
    --bg:#110d1c; --card:#1b1530; --card2:#241c3e; --ink:#f1ecfb; --mute:#a99fc2; --line:#2f2650;
    --brand:#a98bff; --brand2:#c5b1ff; --brand-ink:#1a0d3a; --accent:#ffa25c; --top-bg:linear-gradient(100deg,#1c1038 0%,#3a1a4f 60%,#5a2140 100%); --top-ink:#fff1e8;
    --bubble-me:#3b2a6b; --bubble:#231b3c; --chatbg:#151026; --shadow:0 8px 28px rgba(0,0,0,.55); }
  :root:not([data-modus="hell"])[data-farbe="wald"]{
    --bg:#0f1512; --card:#18211c; --card2:#1f2a24; --ink:#e7eee9; --mute:#9db0a4; --line:#2a3830;
    --brand:#22c55e; --brand2:#4ade80; --brand-ink:#06210f; --top-bg:#0b2a17; --top-ink:#fff;
    --bubble-me:#164a2b; --bubble:#1f2a24; --chatbg:#111a15; --shadow:0 6px 24px rgba(0,0,0,.5); }
}
/* erzwungen dunkel */
:root[data-modus="dunkel"]{ --ok:#4ade80; --warn:#fbbf24; --bad:#f87171;
  --stell:#34d399; --camp:#60a5fa; --ent:#a78bfa; --wasser:#22d3ee; --lpg:#fb923c; --service:#94a3b8; --frei:#f472b6;
  --bg:#0b1418; --card:#121f25; --card2:#182a31; --ink:#e6f0f2; --mute:#93a9b1; --line:#22363e;
  --brand:#2bb3c8; --brand2:#5fd3e4; --brand-ink:#04222a; --accent:#ff8a6b; --top-bg:#08181d; --top-ink:#e6f6f8;
  --bubble-me:#0f3d47; --bubble:#162a31; --chatbg:#0e1a1f; --shadow:0 8px 28px rgba(0,0,0,.5); }
:root[data-modus="dunkel"][data-farbe="ozean"]{ --bg:#11151b; --card:#1a2029; --card2:#212a35; --ink:#eef2f8; --mute:#a0abbb; --line:#2a3443;
  --brand:#6ea8ff; --brand2:#9cc3ff; --brand-ink:#0a1830; --accent:#ffad5c; --top-bg:#0f1a2b; --bubble-me:#1d3a63; --bubble:#202835; --chatbg:#141a22; }
:root[data-modus="dunkel"][data-farbe="graphit"]{ --bg:#0e1011; --card:#17191b; --card2:#1f2224; --ink:#eceee8; --mute:#9aa096; --line:#2a2e30;
  --brand:#b4e33d; --brand2:#ccf26a; --brand-ink:#11160a; --accent:#b4e33d; --top-bg:#0b0c0d; --bubble-me:#2c3a12; --bubble:#1f2224; --chatbg:#121415; }
:root[data-modus="dunkel"][data-farbe="abend"]{ --bg:#110d1c; --card:#1b1530; --card2:#241c3e; --ink:#f1ecfb; --mute:#a99fc2; --line:#2f2650;
  --brand:#a98bff; --brand2:#c5b1ff; --brand-ink:#1a0d3a; --accent:#ffa25c; --top-bg:linear-gradient(100deg,#1c1038 0%,#3a1a4f 60%,#5a2140 100%);
  --bubble-me:#3b2a6b; --bubble:#231b3c; --chatbg:#151026; }
:root[data-modus="dunkel"][data-farbe="wald"]{ --bg:#0f1512; --card:#18211c; --card2:#1f2a24; --ink:#e7eee9; --mute:#9db0a4; --line:#2a3830;
  --brand:#22c55e; --brand2:#4ade80; --brand-ink:#06210f; --accent:#f59e0b; --top-bg:#0b2a17; --bubble-me:#164a2b; --bubble:#1f2a24; --chatbg:#111a15; }

*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font:15px/1.45 var(--font);-webkit-text-size-adjust:100%}
html{overflow:hidden;overscroll-behavior:none}
body{display:flex;flex-direction:column;overflow:hidden;position:fixed;inset:0;width:100%;overscroll-behavior:none;touch-action:manipulation}
.main,.view,.vbody,.pbody{max-width:100vw}
button{font:inherit;color:inherit;cursor:pointer}
input,textarea,select{font:inherit;color:var(--ink)}
a{color:var(--brand2)}
svg{width:20px;height:20px;flex:none}
[hidden]{display:none!important}

/* ---------- Kopf ---------- */
.top{height:var(--top);display:flex;align-items:center;gap:12px;padding:0 12px;background:var(--top-bg);color:var(--top-ink);padding-top:env(safe-area-inset-top);box-sizing:content-box;position:relative;z-index:1200}
.brand{display:flex;align-items:center;gap:7px;font-weight:800;font-size:19px;letter-spacing:-.3px;white-space:nowrap;cursor:pointer;background:none;border:0;padding:0}
.brand svg{width:28px;height:28px;color:var(--logo)}
.brand b{color:var(--accent)}
.searchwrap{flex:1;min-width:0;max-width:720px;position:relative}
.ask{display:flex;align-items:center;background:#fff;border-radius:999px;padding:3px;min-width:0;box-shadow:0 1px 0 rgba(0,0,0,.05)}
.ask input{flex:1;min-width:0;border:0;outline:0;background:transparent;padding:8px 10px 8px 14px;color:#121a1e}
.ask input::placeholder{color:#6b757a}
.ask button{border:0;border-radius:999px;width:38px;height:38px;display:grid;place-items:center;background:transparent;color:#0f1d24}
.ask .go{background:var(--brand);color:var(--brand-ink)}
.ask .mic.rec{background:#dc2626;color:#fff;animation:pulse 1s infinite}
.ask .mic.busy{opacity:.5}
@keyframes pulse{50%{box-shadow:0 0 0 6px rgba(220,38,38,.25)}}
.sugg{position:absolute;left:0;right:0;top:calc(100% + 6px);background:var(--card);color:var(--ink);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;z-index:1300;max-height:min(70vh,460px);overflow-y:auto;border:1px solid var(--line)}
.sugg button{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:0;background:none;padding:10px 14px;border-bottom:1px solid var(--line)}
.sugg button:last-child{border-bottom:0}
.sugg button:hover,.sugg button.sel{background:var(--card2)}
.sugg .si{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--card2);color:var(--brand2);flex:none}
.sugg .t{font-weight:600;line-height:1.2}
.sugg .s{font-size:13px;color:var(--mute)}
.sugg .k{margin-left:auto;font-size:11px;color:var(--mute);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.topnav{display:flex;gap:4px;align-items:center}
.topnav button{position:relative;border:0;background:transparent;color:var(--top-ink);border-radius:12px;padding:8px 10px;display:flex;align-items:center;gap:6px;font-weight:600;opacity:.82}
.topnav button.on,.topnav button:hover{opacity:1;background:rgba(255,255,255,.12)}
.badge{position:absolute;top:2px;right:2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--accent);color:var(--accent-ink);font-size:11px;font-weight:700;display:grid;place-items:center;line-height:1}
.badge:empty{display:none}

/* ---------- Chips ---------- */
.chips{height:var(--chips);display:flex;align-items:center;gap:8px;padding:0 12px;overflow-x:auto;scrollbar-width:none;background:var(--card);border-bottom:1px solid var(--line);flex:none}
.chips::-webkit-scrollbar{display:none}
.chips button{flex:none;border:1px solid var(--line);background:var(--card);border-radius:999px;padding:6px 13px;font-size:14px;white-space:nowrap;font-weight:500}
.chips button.on{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.chips button.f.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.fchips{display:contents}
.tag.open{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok);font-weight:600}
.tag.closed{background:color-mix(in srgb,var(--bad) 12%,transparent);color:var(--bad)}
.chips .sep{flex:none;width:1px;height:24px;background:var(--line)}

/* ---------- Hauptbereich ---------- */
.main{flex:1;position:relative;min-height:0}
#map{position:absolute;inset:0;background:#dfe7e9}
.mapbtns{position:absolute;z-index:500;right:12px;top:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end;max-width:70%}
.tonight{display:flex;align-items:center;gap:6px;border:0;border-radius:999px;padding:10px 16px;background:var(--accent);color:var(--accent-ink);font-weight:700;box-shadow:var(--shadow)}
.round{position:relative;border:0;border-radius:999px;width:44px;height:44px;display:grid;place-items:center;background:var(--card);color:var(--brand2);box-shadow:var(--shadow)}
.round.on{background:var(--brand);color:var(--brand-ink)}
.anz .row2{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.radiusbox{position:absolute;z-index:500;right:12px;top:66px;background:var(--card);border-radius:14px;box-shadow:var(--shadow);padding:10px 12px;width:230px;font-size:13px}
.radiusbox label{display:flex;justify-content:space-between;font-weight:600;margin-bottom:4px}
.radiusbox input[type=range]{width:100%;accent-color:var(--brand2)}
.radiusbox .row{display:flex;gap:6px;margin-top:6px}
.chk{display:flex!important;gap:6px;align-items:center;font-weight:500!important;margin:8px 0 0;justify-content:flex-start!important}
.chk input{accent-color:var(--brand2)}
.routebox{border:1px solid color-mix(in srgb,var(--brand2) 40%,var(--line));border-radius:12px;padding:10px 12px;margin-bottom:10px;background:color-mix(in srgb,var(--brand2) 7%,var(--card))}
.routebox h3{margin:0;font-size:16px;display:flex;gap:6px;align-items:center}
.routebox .go{width:100%;margin-top:8px;font-size:17px;padding:12px;border-radius:12px}
.onb .typen{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.onb .typen button{border:2px solid var(--line);background:var(--card);border-radius:14px;padding:10px;text-align:left;font-size:14px}
.onb .typen button.on{border-color:var(--brand2);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand2) 22%,transparent)}
.onb .typen b{display:block;font-size:15px}
.onb .stp{font-size:12px;color:var(--mute);margin-bottom:4px}
.routebox .big{font-size:20px;font-weight:800}
.routebox .navs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}
.routebox .navs .btn{padding:7px 4px;font-size:13px}
.routebox input[type=range]{width:100%;accent-color:var(--accent)}
.kmtag{font-size:12px;color:var(--brand2);font-weight:700;white-space:nowrap}
.legend{position:absolute;z-index:500;left:12px;bottom:28px;display:flex;flex-wrap:wrap;gap:6px 10px;background:color-mix(in srgb,var(--card) 92%,transparent);padding:6px 10px;border-radius:10px;font-size:12px;box-shadow:var(--shadow);max-width:calc(100% - 24px)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px;vertical-align:-1px;border:1.5px solid #fff}
.voicetip{position:absolute;z-index:550;left:12px;right:12px;margin:0 auto;width:fit-content;bottom:24px;background:var(--card);border-radius:14px;box-shadow:var(--shadow);padding:10px 12px;display:flex;gap:10px;align-items:center;max-width:min(520px,calc(100% - 24px));font-size:14px;border:1px solid var(--line)}
.voicetip .x{border:0;background:none;color:var(--mute);font-size:20px;line-height:1;padding:0 4px}

.panel{position:absolute;z-index:600;left:12px;top:12px;bottom:12px;width:400px;background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden}
.grip{display:none}
.tabs{display:flex;border-bottom:1px solid var(--line);flex:none}
.tabs button{flex:1;border:0;background:none;padding:11px 6px;font-weight:600;color:var(--mute);border-bottom:2px solid transparent}
.tabs button.on{color:var(--brand2);border-bottom-color:var(--brand2)}
.cnt{display:inline-block;min-width:18px;padding:0 5px;border-radius:9px;background:var(--accent);color:var(--accent-ink);font-size:12px}
.cnt:empty{display:none}
.pbody{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:10px 12px 16px}
@media (min-width:900px){ .legend{left:424px;max-width:calc(100% - 436px)} .voicetip{left:auto;right:12px;bottom:140px;max-width:440px} }

.answer{background:color-mix(in srgb,var(--brand2) 10%,var(--card));border:1px solid color-mix(in srgb,var(--brand2) 35%,var(--line));border-radius:12px;padding:10px 12px;margin-bottom:10px}
.answer .q{font-size:13px;color:var(--mute);margin-bottom:4px}
.row{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);background:var(--card);border-radius:10px;padding:8px 12px;font-size:14px;text-decoration:none;color:var(--ink);font-weight:500}
.btn.p{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.btn.a{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.d{color:var(--bad)}
.btn.sm{padding:5px 9px;font-size:13px}
.btn.w{width:100%}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.btn svg{width:18px;height:18px}
.ibtn{border:0;background:none;color:var(--mute);border-radius:10px;width:38px;height:38px;display:grid;place-items:center;flex:none}
.ibtn:hover{background:var(--card2);color:var(--ink)}

.recht{border-radius:12px;padding:10px 12px;margin-bottom:10px;border:1px solid var(--line)}
.recht h3{margin:0 0 4px;font-size:15px;display:flex;align-items:center;gap:8px}
.recht .dot{width:12px;height:12px;border-radius:50%;flex:none}
.recht p{margin:4px 0;font-size:14px}
.g .dot{background:var(--ok)} .y .dot{background:var(--warn)} .r .dot{background:var(--bad)}

.listhead{font-size:13px;color:var(--mute);margin:2px 2px 8px}
.lsearch{position:sticky;top:-1px;z-index:3;display:flex;align-items:center;gap:6px;margin:0 0 8px;padding:6px 10px;background:var(--card,var(--bg));border:1px solid var(--line);border-radius:12px;box-shadow:0 1px 0 var(--line)}
.lsearch[hidden]{display:none}
.lsearch:focus-within{border-color:var(--brand2);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand2) 20%,transparent)}
.lsearch .lsi{font-size:14px;opacity:.6}
.lsearch input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:16px;padding:4px 0}
.lsearch input::-webkit-search-cancel-button{display:none}
.lsearch button{border:0;background:var(--line);color:var(--ink);width:26px;height:26px;border-radius:50%;cursor:pointer;font-size:13px;line-height:1}
mark.lq{background:color-mix(in srgb,var(--accent) 35%,transparent);color:inherit;border-radius:3px;padding:0 1px}
.list{list-style:none;margin:0;padding:0}
.list li{display:flex;gap:10px;padding:10px 6px;border-bottom:1px solid var(--line);cursor:pointer;border-radius:8px}
.list li:hover,.list li:focus{background:var(--card2);outline:0}
.list .ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;color:#fff;font-weight:700;font-size:13px;flex:none;background-size:cover;background-position:center}
.list .t{font-weight:600;line-height:1.25;overflow-wrap:anywhere}
.list .s{font-size:13px;color:var(--mute)}
.list .km{margin-left:auto;font-size:13px;color:var(--mute);white-space:nowrap;padding-left:6px;text-align:right}
.stars{color:#f5a524;font-size:13px;letter-spacing:.5px;white-space:nowrap}
.tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.tag{font-size:12px;border-radius:6px;padding:1px 6px;background:color-mix(in srgb,var(--ink) 7%,transparent);color:var(--ink)}
.tag.free{background:color-mix(in srgb,var(--ok) 18%,transparent);color:var(--ok);font-weight:600}
.tag.com{background:color-mix(in srgb,var(--frei) 16%,transparent);color:var(--frei);font-weight:600}
.empty{color:var(--mute);padding:16px 4px;font-size:14px}

/* ---------- Detail ---------- */
.detail h2{margin:4px 0 2px;font-size:20px;line-height:1.25;overflow-wrap:anywhere}
.detail .typ{font-size:13px;font-weight:600}
.back{border:0;background:none;color:var(--brand2);padding:4px 0;font-weight:600;display:flex;align-items:center;gap:4px}
.gallery{display:flex;gap:6px;overflow-x:auto;margin:10px -12px 4px;padding:0 12px;scroll-snap-type:x mandatory;scrollbar-width:thin}
.gallery .ph{flex:none;width:68%;max-width:280px;aspect-ratio:4/3;border-radius:12px;overflow:hidden;position:relative;scroll-snap-align:start;background:var(--card2);border:0;padding:0}
.gallery .ph img{width:100%;height:100%;object-fit:cover;display:block}
.gallery .ph .cap{position:absolute;left:0;right:0;bottom:0;padding:16px 8px 5px;font-size:11px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.7));text-align:left;line-height:1.25}
.gallery .add{width:120px;display:grid;place-items:center;color:var(--brand2);font-weight:600;font-size:14px;border:2px dashed var(--line);background:var(--card)}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:12px 0}
.fact{border:1px solid var(--line);border-radius:10px;padding:7px 9px;font-size:13px;display:flex;justify-content:space-between;gap:6px}
.fact b{font-weight:600}
.fact .y{color:var(--ok);font-weight:600} .fact .n{color:var(--bad);font-weight:600} .fact .u{color:var(--mute)}
.kv{margin:8px 0;font-size:14px}
.kv div{display:flex;gap:8px;padding:5px 0;border-bottom:1px dashed var(--line)}
.kv .k{color:var(--mute);min-width:110px;flex:none}
.kv .v{overflow-wrap:anywhere}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.callbox{border:1px dashed var(--accent);border-radius:12px;padding:10px 12px;margin:12px 0;font-size:14px}
.callbox b{display:block;margin-bottom:2px}
.src{font-size:12px;color:var(--mute);margin-top:12px}
.sec{margin-top:18px}
.sec h3{font-size:16px;margin:0 0 8px;display:flex;align-items:center;gap:8px}
.sec h3 .cnt{font-weight:600}
.rating{display:flex;gap:14px;align-items:center;background:var(--card2);border-radius:12px;padding:10px 12px}
.rating .big{font-size:30px;font-weight:800;line-height:1}
.rating .bars{flex:1;font-size:12px;color:var(--mute);display:grid;gap:3px}
.bar{display:grid;grid-template-columns:60px 1fr 26px;gap:6px;align-items:center}
.bar i{height:6px;border-radius:3px;background:var(--line);position:relative;overflow:hidden}
.bar i b{position:absolute;left:0;top:0;bottom:0;background:var(--brand2);border-radius:3px}
.review{border-bottom:1px solid var(--line);padding:10px 0}
.review .h{display:flex;gap:8px;align-items:center;font-size:13px}
.review p{margin:6px 0;font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere}
.av{width:32px;height:32px;border-radius:50%;background:var(--brand2);color:var(--brand-ink);display:grid;place-items:center;font-weight:700;font-size:13px;flex:none;background-size:cover;background-position:center;border:0;padding:0}
.av.lg{width:72px;height:72px;font-size:26px}
.av.on{box-shadow:0 0 0 2px var(--card),0 0 0 4px #22c55e}
.who{font-weight:600;border:0;background:none;padding:0;color:var(--ink);text-align:left}
.when{color:var(--mute);font-size:12px}
.starpick{display:flex;gap:2px}
.starpick button{border:0;background:none;font-size:28px;line-height:1;color:var(--line);padding:2px}
.starpick button.on{color:#f5a524}
.minirate{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center;font-size:13px;margin:8px 0}
.minirate .starpick button{font-size:20px}
textarea.in,input.in,select.in{width:100%;border:1px solid var(--line);background:var(--card);border-radius:10px;padding:9px 11px;outline:0}
textarea.in{min-height:80px;resize:vertical}
.in:focus{border-color:var(--brand2);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand2) 20%,transparent)}
.lbl{display:block;font-size:13px;font-weight:600;margin:10px 0 4px}
.checks{display:flex;flex-wrap:wrap;gap:6px}
.checks label{display:flex;gap:6px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:5px 10px;font-size:14px;cursor:pointer}
.checks input{accent-color:var(--brand2)}
.checks label:has(input:checked){background:color-mix(in srgb,var(--brand2) 14%,var(--card));border-color:var(--brand2)}
.hint{font-size:13px;color:var(--mute);background:var(--card2);border-radius:10px;padding:8px 10px;margin:8px 0}
.hint b{color:var(--ink)}

/* Platz-Chat (anonym) */
.pchat{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--chatbg)}
.pchat .msgs{max-height:300px;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:6px}
.pchat .m{background:var(--bubble);border-radius:12px;padding:6px 9px;font-size:14px;max-width:88%;align-self:flex-start;box-shadow:0 1px 0 rgba(0,0,0,.05)}
.pchat .m.me{align-self:flex-end;background:var(--bubble-me)}
.pchat .m .n{font-size:12px;font-weight:600;color:var(--brand2)}
.pchat .m .tx{white-space:pre-wrap;overflow-wrap:anywhere}
.pchat .m img{max-width:100%;border-radius:8px;margin-top:4px;display:block}
.pchat form{display:flex;gap:6px;padding:6px;border-top:1px solid var(--line);background:var(--card)}
.pchat input{flex:1;border:1px solid var(--line);border-radius:999px;padding:8px 12px;background:var(--card);outline:0;min-width:0}

/* ---------- Vollbild-Ansichten (Chats, Forum, Profil, Benachrichtigungen) ---------- */
.view{position:absolute;inset:0;z-index:1100;background:var(--bg);display:flex;flex-direction:column;overflow:hidden}
.vhead{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--card);border-bottom:1px solid var(--line);min-height:56px;flex:none}
.vhead h2{font-size:18px;margin:0;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vhead .sub{font-size:12px;color:var(--mute);font-weight:400}
.vbody{flex:1;overflow-y:auto;overscroll-behavior:contain}
.wrap{max-width:860px;margin:0 auto;padding:12px}
.split{display:flex;height:100%;min-height:0}
.split > .side{position:relative;width:380px;border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;background:var(--card)}
.split > .pane{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}
.search{display:flex;align-items:center;gap:8px;margin:8px 12px;background:var(--card2);border-radius:12px;padding:0 10px}
.search input{flex:1;border:0;background:none;padding:9px 0;outline:0;min-width:0}
.clist{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1}
.clist li{display:flex;gap:10px;align-items:center;padding:10px 12px;cursor:pointer;border-bottom:1px solid var(--line)}
.clist li:hover,.clist li.on{background:var(--card2)}
.clist .av{width:46px;height:46px;font-size:16px}
.clist .mid{flex:1;min-width:0}
.clist .t{font-weight:600;display:flex;gap:6px;align-items:center}
.clist .t span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clist .s{font-size:13px;color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clist .r{display:flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:12px;color:var(--mute)}
.clist .un{background:var(--accent);color:var(--accent-ink);border-radius:10px;min-width:20px;height:20px;padding:0 6px;display:grid;place-items:center;font-size:12px;font-weight:700}
.fab{position:absolute;right:16px;bottom:16px;border:0;border-radius:18px;height:56px;padding:0 18px;display:flex;align-items:center;gap:8px;background:var(--brand);color:var(--brand-ink);font-weight:700;box-shadow:var(--shadow);z-index:5}

/* Konversation */
.conv{flex:1;overflow-y:auto;padding:12px 12px 4px;background:var(--chatbg);display:flex;flex-direction:column;gap:3px;overscroll-behavior:contain}
.pins{background:var(--card);border-bottom:1px solid var(--line);padding:6px 12px;font-size:13px;display:flex;gap:8px;align-items:center;cursor:pointer}
.pins b{color:var(--brand2)}
.day{align-self:center;background:var(--card);color:var(--mute);font-size:12px;border-radius:8px;padding:3px 10px;margin:8px 0;box-shadow:0 1px 0 rgba(0,0,0,.05)}
.sys{align-self:center;color:var(--mute);font-size:12px;background:color-mix(in srgb,var(--card) 80%,transparent);border-radius:8px;padding:3px 10px;margin:4px 0;text-align:center;max-width:80%}
.msg{max-width:min(78%,520px);align-self:flex-start;background:var(--bubble);border-radius:14px 14px 14px 4px;padding:6px 9px 4px;position:relative;box-shadow:0 1px 0 rgba(0,0,0,.06);margin-top:2px}
.msg.me{align-self:flex-end;background:var(--bubble-me);border-radius:14px 14px 4px 14px}
.msg .n{font-size:12px;font-weight:700;color:var(--brand2);margin-bottom:1px}
.msg .tx{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px}
.msg .meta{float:right;margin:6px 0 0 10px;font-size:11px;color:var(--mute);display:flex;gap:3px;align-items:center}
.msg .meta svg{width:16px;height:16px}
.msg .meta .read{color:#0ea5e9}
.msg.del .tx{font-style:italic;color:var(--mute)}
.msg img.media,.msg video.media{display:block;max-width:100%;max-height:340px;border-radius:10px;margin:2px 0 4px;background:#000}
.msg audio{width:240px;max-width:100%;height:40px;margin:2px 0}
.msg .quote{border-left:3px solid var(--brand2);background:color-mix(in srgb,var(--ink) 6%,transparent);border-radius:6px;padding:4px 8px;font-size:13px;margin-bottom:4px;cursor:pointer}
.msg .quote b{display:block;color:var(--brand2);font-size:12px}
.msg .loc{display:block;width:240px;max-width:100%;border-radius:10px;overflow:hidden;text-decoration:none;color:var(--ink);background:var(--card2);margin:2px 0 4px}
.msg .loc .mapimg{height:110px;background:linear-gradient(135deg,#cfe3e7,#e8f1e1);display:grid;place-items:center;font-size:34px}
.msg .loc .lt{padding:6px 8px;font-size:13px}
.msg .reacts{position:absolute;bottom:-12px;right:8px;background:var(--card);border-radius:999px;padding:1px 6px;font-size:13px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:flex;gap:3px;cursor:pointer}
.msg.hasr{margin-bottom:14px}
.msg .pin{color:var(--mute);font-size:11px}
.msg.flash{animation:flash 1.2s}
@keyframes flash{30%{box-shadow:0 0 0 3px var(--accent)}}
.typing{font-size:12px;color:var(--brand2);padding:2px 14px;min-height:18px;background:var(--chatbg)}
.composer{display:flex;align-items:flex-end;gap:6px;padding:8px;background:var(--card);border-top:1px solid var(--line);padding-bottom:max(8px,env(safe-area-inset-bottom))}
.composer textarea{flex:1;min-width:0;border:1px solid var(--line);background:var(--card2);border-radius:20px;padding:9px 14px;resize:none;max-height:140px;outline:0;line-height:1.35}
.composer .send{background:var(--brand);color:var(--brand-ink);width:44px;height:44px;border-radius:50%;border:0;display:grid;place-items:center;flex:none}
.composer .send.rec{background:#dc2626;color:#fff;animation:pulse 1s infinite}
.replybar{display:flex;gap:8px;align-items:center;padding:6px 10px;background:var(--card);border-top:1px solid var(--line);font-size:13px}
.replybar .q{flex:1;border-left:3px solid var(--brand2);padding-left:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recbar{display:flex;align-items:center;gap:10px;flex:1;padding:0 8px;color:#dc2626;font-weight:600}

/* Menüs / Dialoge */
.menu{position:fixed;z-index:3000;background:var(--card);border-radius:14px;box-shadow:0 12px 40px rgba(0,0,0,.28);padding:6px;min-width:210px;border:1px solid var(--line)}
.menu .emo{display:flex;gap:2px;padding:4px 4px 8px;border-bottom:1px solid var(--line);margin-bottom:4px}
.menu .emo button{border:0;background:none;font-size:22px;padding:4px;border-radius:8px}
.menu .emo button:hover{background:var(--card2)}
.menu > button{display:flex;gap:10px;width:100%;border:0;background:none;padding:9px 10px;border-radius:9px;text-align:left;align-items:center}
.menu > button:hover{background:var(--card2)}
.menu > button.d{color:var(--bad)}
.dlg-bg{position:fixed;inset:0;z-index:2500;background:rgba(0,0,0,.45);display:grid;place-items:center;padding:16px}
.dlg{background:var(--card);border-radius:18px;box-shadow:var(--shadow);width:min(520px,100%);max-height:calc(100% - 32px);overflow:auto;padding:16px}
.dlg h3{margin:0 0 10px;font-size:18px}
.dlg .acts{display:flex;gap:8px;justify-content:flex-end;margin-top:14px;flex-wrap:wrap}
.lightbox{position:fixed;inset:0;z-index:3500;background:rgba(0,0,0,.94);display:flex;flex-direction:column;touch-action:none;user-select:none;-webkit-user-select:none}
.lb-top{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:8px;padding:10px 12px;padding-top:max(10px,env(safe-area-inset-top));z-index:3;color:#fff;background:linear-gradient(rgba(0,0,0,.5),transparent)}
.lb-n{flex:1;font-size:14px;opacity:.85}
.lb-btn{border:0;background:rgba(255,255,255,.16);color:#fff;width:44px;height:44px;border-radius:50%;font-size:24px;display:grid;place-items:center;text-decoration:none;line-height:1}
.lb-btn:hover{background:rgba(255,255,255,.28)}
.lb-stage{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}
.lb-stage img,.lb-stage video{max-width:100%;max-height:100%;object-fit:contain;will-change:transform;transform-origin:center center}
.lb-stage img{cursor:zoom-in}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);border:0;background:rgba(255,255,255,.14);color:#fff;width:48px;height:64px;border-radius:12px;font-size:34px;z-index:3}
.lb-prev{left:10px}.lb-next{right:10px}
.lb-cap{position:absolute;left:0;right:0;bottom:0;padding:24px 16px 12px;padding-bottom:max(12px,env(safe-area-inset-bottom));color:#e6e6e6;font-size:13px;text-align:center;background:linear-gradient(transparent,rgba(0,0,0,.65));z-index:2}
.lb-cap a{color:#9cd8ff}
.lb-cap:empty{display:none}
.lb-dots{position:absolute;bottom:58px;left:0;right:0;display:flex;justify-content:center;gap:5px;z-index:2;pointer-events:none}
.lb-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.4)}
.lb-dots i.on{background:#fff}
@media (max-width:699px){.lb-nav{display:none}}
.pickl{list-style:none;margin:0;padding:0;max-height:320px;overflow:auto}
.pickl li{display:flex;gap:10px;align-items:center;padding:8px 4px;border-bottom:1px solid var(--line);cursor:pointer}
.pickl li:hover{background:var(--card2)}

/* Forum */
.cats{display:grid;gap:8px}
.cat{display:flex;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;cursor:pointer;text-align:left;width:100%}
.cat:hover{border-color:var(--brand2)}
.cat .ci{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:22px;background:var(--card2);flex:none}
.cat .t{font-weight:700}
.cat .s{font-size:13px;color:var(--mute)}
.cat .n{margin-left:auto;text-align:right;font-size:12px;color:var(--mute);white-space:nowrap}
.thr{display:block;width:100%;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:8px;cursor:pointer}
.thr:hover{border-color:var(--brand2)}
.thr .t{font-weight:700;font-size:16px}
.thr .s{font-size:13px;color:var(--mute);margin-top:4px;display:flex;gap:10px;flex-wrap:wrap}
.thr .p{font-size:14px;margin-top:6px;color:var(--ink);opacity:.85;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.post{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:10px}
.post.first{border-color:color-mix(in srgb,var(--brand2) 45%,var(--line))}
.post .h{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.post .tx{white-space:pre-wrap;overflow-wrap:anywhere}
.post .imgs{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.post .imgs img{width:120px;height:90px;object-fit:cover;border-radius:8px;cursor:pointer}
.post .f{display:flex;gap:6px;margin-top:8px;align-items:center}
.likebtn{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:3px 10px;font-size:13px}
.likebtn.on{background:color-mix(in srgb,var(--accent) 20%,var(--card));border-color:var(--accent)}

/* Profil */
.prof{display:flex;gap:14px;align-items:center;margin:8px 0 14px}
.prof h2{margin:0;font-size:22px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:10px 0}
.stats div{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px;text-align:center;font-size:12px;color:var(--mute)}
.stats b{display:block;font-size:18px;color:var(--ink)}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:10px}
.card h3{margin:0 0 8px;font-size:16px}
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.sw{border:2px solid var(--line);border-radius:14px;padding:8px;background:var(--card);text-align:left}
.sw.on{border-color:var(--brand2);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand2) 25%,transparent)}
.sw .bar3{display:flex;height:26px;border-radius:8px;overflow:hidden;margin-bottom:6px}
.sw .bar3 i{flex:1}
.sw b{font-size:13px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.seg button{border:0;background:var(--card);padding:7px 12px;font-size:14px}
.seg button.on{background:var(--brand);color:var(--brand-ink)}
.notif{display:flex;gap:10px;padding:12px;border-bottom:1px solid var(--line);cursor:pointer;align-items:flex-start}
.notif.un{background:color-mix(in srgb,var(--brand2) 8%,transparent)}
.notif:hover{background:var(--card2)}
.notif .tx{font-size:14px}

body.inview .chips{display:none}
/* Sprachassistent */
.agentfab{position:absolute;z-index:620;right:12px;bottom:84px;display:flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:12px 18px 12px 14px;background:var(--brand);color:var(--brand-ink);font-weight:700;box-shadow:var(--shadow)}
.agentfab svg{width:22px;height:22px}
.agentfab[data-state="hoert"]{background:#16a34a;color:#fff}
.agentfab[data-state="spricht"]{background:var(--accent);color:var(--accent-ink)}
.agentfab[data-state="denkt"],.agentfab[data-state="verbinde"]{background:var(--brand2);color:var(--brand-ink)}
body.inview .agentfab{display:none}
.vpanel{position:absolute;z-index:1150;right:12px;top:12px;bottom:12px;width:380px;background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line)}
.vpanel.min{display:none}
@media (min-width:700px){ body.vopen .mapbtns{right:404px} body.vopen .agentfab{right:404px} }
.vp-head{display:flex;align-items:center;gap:10px;padding:12px;border-bottom:1px solid var(--line)}
.vp-ring{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--card2);color:var(--brand2);transition:transform .08s;flex:none}
.vp-ring svg{width:24px;height:24px}
.vpanel[data-state="hoert"] .vp-ring{background:#16a34a;color:#fff}
.vpanel[data-state="spricht"] .vp-ring{background:var(--accent);color:var(--accent-ink)}
.vpanel[data-state="denkt"] .vp-ring,.vpanel[data-state="verbinde"] .vp-ring{background:var(--brand2);color:var(--brand-ink);animation:pulse 1.2s infinite}
.vp-t{flex:1;display:flex;flex-direction:column}
.vp-t span{font-size:13px;color:var(--mute)}
.vp-log{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;background:var(--chatbg)}
.vl{background:var(--bubble);border-radius:12px;padding:7px 10px;font-size:15px;max-width:90%;align-self:flex-start}
.vl b{display:block;font-size:11px;color:var(--brand2);text-transform:uppercase;letter-spacing:.04em}
.vl.user{align-self:flex-end;background:var(--bubble-me)}
.vl.sys{align-self:center;background:transparent;color:var(--mute);font-size:13px;text-align:center}
.vp-foot{display:flex;gap:8px;align-items:center;padding:10px 12px;border-top:1px solid var(--line)}
.vp-foot .when{flex:1}
@media (max-width:699px){
  .agentfab{bottom:calc(44% + 12px);right:10px;padding:10px 14px 10px 12px}
  .vpanel{left:0;right:0;bottom:0;top:auto;height:62%;width:auto;border-radius:18px 18px 0 0}
}
/* Untere Navigation (Handy) */
.bnav{display:none}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:#141a1d;color:#fff;padding:10px 16px;border-radius:12px;font-size:14px;opacity:0;pointer-events:none;transition:.25s;z-index:4000;max-width:calc(100% - 32px);text-align:center}
.toast.show{opacity:1;transform:translateX(-50%)}
.leaflet-container{font:12px var(--font)}
.me-dot{width:18px;height:18px;border-radius:50%;background:#2563eb;border:3px solid #fff;box-shadow:0 0 0 6px rgba(37,99,235,.25)}
.goal-dot{width:22px;height:22px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--accent);border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.spot-dot{width:16px;height:16px;border-radius:50%;background:var(--frei);border:2.5px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.35)}

/* Tablet */
@media (max-width:899px) and (min-width:700px){
  .panel{width:360px}
  .legend{left:384px;max-width:calc(100% - 396px)}
  .topnav button span{display:none}
  .split > .side{width:300px}
}
/* Handy */
@media (max-width:699px){
  .top{gap:8px;padding:0 8px;padding-top:env(safe-area-inset-top)}
  .brand span{display:none}
  .topnav{display:none}
  .ask input{padding-left:10px;font-size:16px}
  .ask input::placeholder{font-size:14px}
  .bnav{display:flex;height:var(--nav);background:var(--card);border-top:1px solid var(--line);flex:none;padding-bottom:env(safe-area-inset-bottom);box-sizing:content-box;z-index:1200}
  .bnav button{flex:1;border:0;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:11px;color:var(--mute);position:relative;font-weight:600}
  .bnav button svg{width:24px;height:24px}
  .bnav button.on{color:var(--brand2)}
  .bnav .badge{top:6px;right:calc(50% - 22px)}
  .panel{z-index:1001;left:0;right:0;bottom:0;top:auto;width:auto;height:44%;border-radius:18px 18px 0 0;transition:height .25s}
  .panel.full{height:calc(100% - 8px)}
  .panel.min{height:96px}
  .grip{display:block;border:0;background:none;padding:8px 0 2px;flex:none;width:100%}
  .grip span{display:block;width:44px;height:5px;border-radius:3px;background:var(--line);margin:0 auto}
  .tabs button{padding:8px 6px}
  .legend{display:none}
  .mapbtns{top:26px;right:10px}
  .radiusbox{top:128px;right:10px;left:10px;width:auto}
  .tonight{padding:9px 14px}
  .voicetip{bottom:calc(44% + 78px)}
  .split > .side{width:100%;border-right:0}
  .split.open > .side{display:none}
  .split:not(.open) > .pane{display:none}
  .msg{max-width:86%}
  .stats{grid-template-columns:repeat(2,1fr)}
}

/* ---------- Konto: Anmelden / Registrieren / Codes ---------- */
.konto{position:relative}
.konto .kx{position:absolute;top:-6px;right:-4px;border:0;background:none;font-size:26px;line-height:1;color:var(--mute);padding:4px 8px;cursor:pointer}
.kbrand{font-weight:800;font-size:22px;text-align:center;margin:2px 0 12px;color:var(--ink)}
.kbrand span{color:var(--accent)}
.ktabs{display:flex;width:100%;margin-bottom:10px}
.ktabs button{flex:1}
.kform .in{font-size:16px;padding:11px 12px}
.kf{position:relative}
.kf .in{padding-right:44px}
.kf-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);border:0;background:none;font-size:18px;padding:6px 8px;cursor:pointer;opacity:.7}
.kbig{width:100%;margin-top:14px;padding:12px;font-size:16px;justify-content:center}
.krow{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:10px;font-size:14px}
.krow a,.linkbtn{color:var(--brand2);text-decoration:none;font-weight:600}
.linkbtn{border:0;background:none;padding:0;font:inherit;font-size:14px;cursor:pointer}
.linkbtn:disabled{color:var(--mute);cursor:default;font-weight:500}
.kerr{background:color-mix(in srgb,#dc2626 12%,transparent);color:#b91c1c;border-radius:10px;padding:8px 10px;font-size:14px;margin:6px 0}
[data-modus="dunkel"] .kerr{color:#fca5a5}
.kerr[hidden]{display:none}
.kchk{display:flex;gap:8px;align-items:flex-start;margin-top:12px;font-size:14px;line-height:1.4}
.kchk input{margin-top:3px;flex:none}
.kanon{border-top:1px solid var(--line);margin-top:14px;padding-top:12px;text-align:center}
.kanon .btn{width:100%;justify-content:center}
.kcode{font-size:28px!important;letter-spacing:10px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums;padding:12px!important}
.pwm{display:flex;gap:4px;align-items:center;margin-top:6px;flex-wrap:wrap}
.pwm i{flex:1;height:5px;border-radius:3px;background:var(--line);max-width:60px}
.pwm span{flex-basis:100%;font-size:12px;color:var(--mute);margin-top:2px}
.pwm[data-s="1"] i:nth-child(-n+1){background:#dc2626}
.pwm[data-s="2"] i:nth-child(-n+2){background:#f59e0b}
.pwm[data-s="3"] i:nth-child(-n+3){background:#16a34a}
.pwm[data-s="4"] i:nth-child(-n+4){background:#15803d}
.kkarte .kz{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--line)}
.kkarte .kz span{width:70px;color:var(--mute);font-size:13px}
.kkarte .kz b{flex:1;min-width:120px;overflow-wrap:anywhere}
.kkarte .ok{font-style:normal;font-size:12px;color:#16a34a;font-weight:600}
.kgeraete{list-style:none;margin:0;padding:0}
.kgeraete li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--line)}