/* feedback.css — "Rückmeldung" on every page (feedback.js 1.0.0): the footer button and the dialog that grows from it.
   1.4.0: four tabs wrap on small screens; the guest note; the join calls (.join-ctas) on the home page.
   1.5.0: the feedback dialog above Lleu.
   1.6.0: the compose card (ws-compose) — a big field that asks to join in, chips, one strong call to action, the steps after sending.
   1.7.0: „Meine Beiträge“ — the pill at the bottom and its slim sheet.
   1.8.0: the follow question after „Senden“ (fa-follow).
   version: 1.8.0 · created 2026-11-01 by Pascal Ehlig, ITS · edited 2026-11-02 by Pascal Ehlig, ITS */
.fb-open{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border:1px solid var(--border);border-radius:999px;background:var(--surface,#fff);
  color:var(--text);font:600 .82rem/1 var(--sans,system-ui);cursor:pointer;white-space:nowrap}
.fb-open:hover,.fb-open:focus-visible,.fb-open[aria-expanded="true"]{border-color:var(--accent,#fb683e);color:var(--accent-text,var(--accent,#fb683e));outline:none}
@media (max-width:40rem){.fb-open span{display:none}.fb-open{width:36px;padding:0;justify-content:center}}
.fb-back{position:fixed;inset:0;z-index:2147483280;background:rgb(16 42 67 / .35)}
.fb-dialog{position:fixed;z-index:2147483300;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,calc(100vw - 20px));max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;
  box-sizing:border-box;padding:18px 18px 16px;border:2px solid var(--accent,#fb683e);border-radius:20px;background:var(--surface,#fff);color:var(--text);box-shadow:0 24px 60px rgb(0 0 0 / .35);animation:fb-grow .2s ease-out}
@keyframes fb-grow{from{opacity:0;transform:translate(-50%,-50%) scale(.7)}to{opacity:1;transform:translate(-50%,-50%)}}
.fb-x{float:right;width:44px;height:44px;border:1px solid var(--border);border-radius:999px;background:var(--surface,#fff);color:var(--text);font:600 1.4rem/1 system-ui;cursor:pointer}
.fb-title{margin:4px 0 10px;font-size:1.3rem}
.fb-tabs{display:flex;gap:4px;padding:3px;margin:0 0 10px;border-radius:12px;background:color-mix(in srgb,var(--muted,#486581) 12%,transparent)}
.fb-tabs button{flex:1;min-height:42px;border:0;border-radius:10px;background:transparent;color:var(--text);font:600 .9rem/1 inherit;cursor:pointer}
.fb-tabs button[aria-selected="true"]{background:var(--surface,#fff);color:var(--accent-text,var(--accent,#fb683e));box-shadow:0 1px 3px rgb(16 42 67 / .15)}
.fb-lead{margin:0 0 8px;color:var(--muted)}
.fb-label{display:block;margin:10px 0 4px;font-weight:600}
.fb-input,.fb-text{display:block;width:100%;box-sizing:border-box;padding:10px;border:1px solid var(--border);border-radius:12px;background:var(--surface,#fff);color:var(--text);font:inherit;-webkit-user-select:text;user-select:text}
.fb-text{resize:vertical}
.fb-pub{display:flex;gap:8px;align-items:flex-start;margin:10px 0 0;font-size:.85rem;color:var(--muted)}.fb-pub[hidden]{display:none}
.fb-ctx{margin:10px 0 0;font-size:.82rem;color:var(--muted)}.fb-ctx pre{max-height:9rem;overflow:auto;white-space:pre-wrap;font-size:.72rem}
.fb-row{display:flex;justify-content:space-between;gap:8px;margin:12px 0 0}
.fb-row button,.fb-send{min-height:44px;padding:0 16px;border:1px solid var(--border);border-radius:12px;background:var(--surface,#fff);color:var(--text);font:600 .9rem/1 inherit;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.fb-send{background:var(--accent,#fb683e)!important;color:#fff!important;border-color:transparent!important}
.fb-note{min-height:1.2em;margin:8px 0 0;font-size:.88rem}
.fb-x:focus-visible,.fb-tabs button:focus-visible,.fb-row button:focus-visible{outline:3px solid var(--focus,#2563eb);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.fb-dialog{animation:none}}
/* 1.1.0 (owner 2026-11-01: the footer became three parts — make it small, but pretty): on wide screens one slim centred line — π, the
   feedback sign, the made-by line and the legal links in small type, joined by fine dots; the feedback button is a small round sign */
@media (min-width:601px) and (pointer:fine),(min-width:1367px){
  body>footer{border-top:1px solid color-mix(in srgb,var(--border) 70%,transparent);padding-block:0!important}
  body>footer .wrap{display:flex!important;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 14px!important;min-height:0!important;padding-block:8px!important;font-size:.78rem;color:var(--muted)}
  body>footer .wrap>*{margin:0!important}
  body>footer .fb-open{width:30px;height:30px;min-height:30px;padding:0;justify-content:center;border-radius:999px}
  body>footer .fb-open span{display:none}
  body>footer .fb-open svg{width:15px;height:15px}
  body>footer nav[aria-label]{flex:none!important}
  body>footer nav ul{display:flex;gap:0!important;margin:0;padding:0;list-style:none;justify-content:center}
  body>footer nav li+li::before{content:"·";margin:0 8px;color:color-mix(in srgb,var(--muted) 60%,transparent)}
  body>footer nav a{color:var(--muted);text-decoration:none}
  body>footer nav a:hover,body>footer nav a:focus-visible{color:var(--accent-text,var(--accent));text-decoration:underline}
  body>footer [data-i18n="foot.made"]{opacity:.85}
  body>footer [data-i18n="foot.made"]::after{content:"·";margin-left:14px;color:color-mix(in srgb,var(--muted) 60%,transparent)}
}
.gw-thanks{margin:6px 0;padding:12px 14px;border-radius:12px;background:var(--ok-bg,#e2f2e8);color:var(--ok,#1e6b45);font-weight:700;animation:gw-thanks-in .2s ease-out}@keyframes gw-thanks-in{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.gw-thanks{animation:none}}   /* 1.2.0: the one line after sending */
/* feedback.js 1.7.0: on touch devices anchored at the top (the keyboard comes from below) and above the tab bar and Lleu */
@media (pointer:coarse){.fb-dialog:not(.fb-inview){top:max(12px,env(safe-area-inset-top));transform:translateX(-50%);max-height:calc(100dvh - 24px)}.fb-back{z-index:2147483280}.fb-dialog:not(.fb-inview){z-index:2147483300}}
.fb-tabs { flex-wrap: wrap; }
.fb-tabs > button { flex: 1 1 auto; white-space: normal; line-height: 1.2; padding: 6px 8px; }
.fb-guest { font-size: .9em; opacity: .85; margin: .4rem 0 .6rem; }
.join-ctas { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0 1.4rem; }
.join-ctas .cta { white-space: normal; text-align: center; }
/* 1.6.0: the compose card */
.ws-compose{margin:1.6rem 0 2rem}
.ws-compose-card{position:relative;padding:22px 20px 18px;border-radius:24px;background:var(--surface,#fff);
  border:2px solid transparent;background-image:linear-gradient(var(--surface,#fff),var(--surface,#fff)),linear-gradient(135deg,var(--accent,#fb683e),#f7b267 45%,#7c5cff);
  background-origin:border-box;background-clip:padding-box,border-box;box-shadow:0 18px 50px -18px color-mix(in srgb,var(--accent,#fb683e) 55%,transparent)}
.ws-compose-card h2{margin:0 0 6px;font-size:clamp(1.4rem,4.5vw,2rem)}
.ws-compose-card .sub{margin:0 0 14px}
.ws-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ws-compose-field textarea{display:block;width:100%;box-sizing:border-box;min-height:120px;padding:14px 16px;border-radius:16px;border:1px solid var(--border,#d9e2ec);
  background:color-mix(in srgb,var(--accent,#fb683e) 4%,var(--surface,#fff));color:inherit;font:inherit;font-size:1.05rem;line-height:1.45;resize:vertical}
.ws-compose-field textarea:focus{outline:3px solid color-mix(in srgb,var(--accent,#fb683e) 55%,transparent);outline-offset:2px}
.ws-chips{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.ws-chip{min-height:36px;padding:6px 12px;border-radius:999px;border:1px dashed color-mix(in srgb,var(--accent,#fb683e) 55%,transparent);background:transparent;color:inherit;font:inherit;font-size:.9rem;cursor:pointer;white-space:normal;text-align:start}
.ws-chip:hover{background:color-mix(in srgb,var(--accent,#fb683e) 10%,transparent)}
.ws-compose-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ws-compose-mail summary{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--border,#d9e2ec);cursor:pointer;list-style:none;font-size:1.1rem}
.ws-compose-mail summary::-webkit-details-marker{display:none}
.ws-compose-mail[open]{flex:1 1 100%}
.ws-compose-mail label{display:block;margin-top:8px;font-size:.9rem}
.ws-compose-mail input{display:block;width:100%;box-sizing:border-box;min-height:44px;margin-top:4px;padding:8px 12px;border-radius:12px;border:1px solid var(--border,#d9e2ec);background:transparent;color:inherit;font:inherit}
.ws-go{min-height:56px;padding:0 28px;border:0;border-radius:999px;margin-inline-start:auto;font:700 1.1rem/1 inherit;color:#fff;cursor:pointer;
  background:linear-gradient(135deg,var(--accent,#fb683e),#ff8a3d);box-shadow:0 10px 24px -8px color-mix(in srgb,var(--accent,#fb683e) 70%,transparent);transition:transform .15s}
.ws-go:hover:not(:disabled){transform:translateY(-1px)}
.ws-go:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
.ws-compose-foot{margin:10px 0 0;font-size:.82rem;opacity:.75}
.ws-compose-note:empty{display:none}
.ws-compose-done{padding:22px 20px;border-radius:24px;border:2px solid color-mix(in srgb,var(--accent,#fb683e) 45%,transparent);background:color-mix(in srgb,var(--accent,#fb683e) 6%,var(--surface,#fff))}
.ws-compose-thanks{font-size:1.3rem;font-weight:700;margin:0 0 6px}
.ws-steps{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:14px 0}
.ws-steps li{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid var(--border,#d9e2ec);font-size:.9rem;opacity:.6}
.ws-steps li b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--border,#d9e2ec);font-size:.75rem}
.ws-steps li.is-done{opacity:1;border-color:#2f9e6e}.ws-steps li.is-done b{background:#2f9e6e;color:#fff}
.ws-steps li.is-next{opacity:1;border-color:var(--accent,#fb683e)}.ws-steps li.is-next b{background:var(--accent,#fb683e);color:#fff}
.ws-compose-again{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--border,#d9e2ec);background:transparent;color:inherit;font:600 .95rem/1 inherit;cursor:pointer}
/* 1.7.0: „Meine Beiträge“ */
.fa-mine-pill{position:fixed;left:max(12px,env(safe-area-inset-left));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:2147482400;min-height:44px;padding:0 16px;border-radius:999px;border:0;
  background:linear-gradient(135deg,var(--accent,#fb683e),#ff8a3d);color:#fff;font:700 .92rem/1 inherit;box-shadow:0 10px 24px -8px color-mix(in srgb,var(--accent,#fb683e) 70%,transparent);cursor:pointer}
html.gw-tabs .fa-mine-pill{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
.fa-mine-pill.is-new{animation:fa-mine-pulse .9s ease 2}
@keyframes fa-mine-pulse{50%{transform:scale(1.08)}}
@media (prefers-reduced-motion:reduce){.fa-mine-pill.is-new{animation:none}}
.fa-mine{position:fixed;left:8px;right:8px;bottom:calc(72px + env(safe-area-inset-bottom,0px));z-index:2147482450;max-width:520px;max-height:min(70dvh,560px);overflow:auto;padding:14px;border-radius:20px;
  background:var(--surface,#fff);color:var(--text,#102a43);border:1px solid var(--border,#d9e2ec);box-shadow:0 18px 48px rgb(16 42 67 / .25)}
html.gw-tabs .fa-mine{bottom:calc(132px + env(safe-area-inset-bottom,0px))}
.fa-mine-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.fa-mine-head b{font-size:1.1rem}
.fa-mine-x{width:40px;height:40px;border-radius:50%;border:1px solid var(--border,#d9e2ec);background:transparent;color:inherit;font:600 1.3rem/1 inherit;cursor:pointer}
[data-ctl-side="left"] .fa-mine-head{flex-direction:row-reverse}
.fa-mine-sub{margin:4px 0 10px;font-size:.88rem;opacity:.8}
.fa-mine-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.fa-mine-row{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;width:100%;padding:10px 12px;border-radius:14px;border:1px solid var(--border,#d9e2ec);background:transparent;color:inherit;font:inherit;text-align:start;cursor:pointer}
.fa-mine-kind{grid-row:1 / 3;align-self:center;padding:2px 8px;border-radius:999px;font-size:.72rem;font-weight:700;background:color-mix(in srgb,var(--accent,#fb683e) 14%,transparent)}
.fa-mine-title{font-weight:600;overflow-wrap:anywhere}
.fa-mine-state{opacity:.75}
.fa-mine-body{padding:8px 4px 2px}
.fa-mine-msg{margin:6px 0;padding:8px 12px;border-radius:14px;white-space:pre-wrap;overflow-wrap:anywhere}
.fa-mine-msg.is-owner{background:var(--sunken,#f0f4f8)}
.fa-mine-msg.is-me{background:color-mix(in srgb,var(--accent,#fb683e) 12%,transparent);margin-left:20%}
.fa-mine-none{opacity:.75;font-size:.88rem}
.fa-mine-reply{display:flex;gap:8px;align-items:flex-end;margin-top:6px}
.fa-mine-field{flex:1;min-height:44px;padding:8px 10px;border-radius:12px;border:1px solid var(--border,#d9e2ec);background:transparent;color:inherit;font:inherit;resize:vertical}
.fa-mine-send{min-height:44px;padding:0 14px;border-radius:12px;border:0;background:var(--action,#102a43);color:var(--on-action,#fff);font:700 .9rem/1 inherit;cursor:pointer}
/* 1.8.0: the follow question */
.fa-follow{display:flex;flex-direction:column;gap:8px}
.fa-follow-h{margin:0 0 2px;font-weight:700;font-size:1.05rem}
.fa-follow-opt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:12px 14px;border-radius:14px;border:1px solid var(--border,#d9e2ec);background:transparent;color:inherit;font:inherit;text-align:start;cursor:pointer}
.fa-follow-opt:first-of-type{border-color:var(--accent,#fb683e)}
.fa-follow-opt small{opacity:.8;font-size:.85rem}
.fa-follow-opt.gw-soon{cursor:default}
.fa-follow-mail{min-height:44px;padding:8px 12px;border-radius:12px;border:1px solid var(--border,#d9e2ec);background:transparent;color:inherit;font:inherit}
.fa-follow-mail[aria-invalid="true"]{border-color:#d64545}
.fa-follow-legal{margin:0;font-size:.82rem;opacity:.85}
.fa-follow-row{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.fa-follow-row button,.fa-follow-back{min-height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--border,#d9e2ec);background:transparent;color:inherit;font:600 .9rem/1 inherit;cursor:pointer}
.fa-follow-go{background:var(--accent,#fb683e)!important;border-color:transparent!important;color:#fff!important}
.fa-follow-back{align-self:flex-start;border:0}
.fa-follow .fa-follow-opt{display:flex!important;flex-direction:column!important;align-items:flex-start!important;width:100%!important;min-height:0!important;padding:12px 14px!important;border:1px solid var(--border,#d9e2ec)!important;border-radius:14px!important;text-align:start!important;white-space:normal!important}
.fa-follow .fa-follow-opt small{display:block!important;font-weight:400}
.fa-follow .fa-follow-opt b{display:block}
.fa-follow .fa-follow-opt:first-of-type{border-color:var(--accent,#fb683e)!important}
.fa-follow-legal{display:grid;grid-template-columns:1fr;gap:2px;margin:4px 0;font-size:.85rem}
.fa-follow-legal dt{font-weight:700}
.fa-follow-legal dd{margin:0 0 6px;opacity:.9}
.fa-follow-legal dd:last-child{grid-column:1 / -1}
/* session.js 1.4.0: the sign-in as a card over the page */
.fa-login{position:fixed;inset:0;z-index:2147483400;display:grid;place-items:center;padding:12px;background:rgb(16 42 67 / .35)}
.fa-login-box{display:flex;flex-direction:column;width:min(480px,100%);height:min(720px,100%);border-radius:20px;overflow:hidden;background:var(--surface,#fff);color:var(--text,#102a43);box-shadow:0 24px 64px rgb(16 42 67 / .3)}
.fa-login-head{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--border,#d9e2ec)}
.fa-login-head b{flex:1}
.fa-login-full{font-size:.85rem}
.fa-login-x{width:40px;height:40px;border-radius:50%;border:1px solid var(--border,#d9e2ec);background:transparent;color:inherit;font:600 1.3rem/1 inherit;cursor:pointer}
[data-ctl-side="left"] .fa-login-head{flex-direction:row-reverse}
.fa-login-frame{flex:1;width:100%;border:0;background:var(--surface,#fff)}