/* Einladungen zum Spieltag (js/einladungen.js), freigegeben 19.10.2026 nach docs/mockups-einladungen/einladungen-mockup-2.html.
   Stand und Entscheidungen: docs/einladungen.md. Alles unter .ein-root, damit Mein Bereich, Event Hub und Event-Cockpit
   unberuehrt bleiben. Schrift: Bebas 72 und 32, Cormorant 20 und 16 (Motto kursiv), Mono 12, Playfair eine Zeile.
   Ember nur fuer Handlungen (Knoepfe, Links, Siegel). Ausgewaehltes weiss umrandet. Keine Dauerbewegung.
   Nachgebessert 20.10.2026 (docs/einladungen-pruefung-2026-10-20.md): Abstaende nur 8, 16, 24, 40, 64 px, Ecken 4 px. */
.ein-root{
  --e-void:#08090e;--e-night:#10131a;--e-line:#2a2f3b;--e-white:#eae4dc;--e-mist:#8888a0;--e-ember:#c4843a;
  --e-sunset:linear-gradient(100deg,#e9b25a 0%,#e0814c 48%,#d97f88 100%);
  --e-glut:0 0 0 1px rgba(196,132,58,.3),0 0 28px rgba(224,129,76,.35);
  --e-wahl:inset 0 0 0 1px rgba(234,228,220,.85);
  color:var(--e-white);font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;line-height:24px;
}
.ein-root *,.ein-root *::before,.ein-root *::after{box-sizing:border-box;}
.ein-root [hidden]{display:none !important;}
.ein-root :focus-visible{outline:2px solid var(--e-ember);outline-offset:2px;}
:where(.ein-root) button,:where(.ein-root) input{font:inherit;color:inherit;}
.ein-root p,.ein-root h1,.ein-root h2,.ein-root h3,.ein-root ul,.ein-root dl,.ein-root dd{margin:0;}
.ein-root a{color:var(--e-ember);text-decoration:none;}
.ein-root input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;}
.ein-root[id]{scroll-margin-top:80px;}
.ein-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.ein-hero{font-family:'Bebas Neue',Impact,sans-serif;font-size:72px;line-height:72px;letter-spacing:.02em;font-weight:400;}
.ein-t32{font-family:'Bebas Neue',Impact,sans-serif;font-size:32px;line-height:40px;letter-spacing:.04em;font-weight:400;}
.ein-20{font-family:'Cormorant Garamond',Georgia,serif;font-size:20px;line-height:28px;font-weight:500;}
.ein-16{font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;line-height:24px;font-weight:400;}
.ein-motto{font-family:'Cormorant Garamond',Georgia,serif;font-size:20px;line-height:28px;font-weight:500;font-style:italic;}
.ein-sub{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:24px;line-height:32px;}
.ein-mono{font-family:'JetBrains Mono',monospace;font-size:12px;line-height:16px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;}
.ein-mist{color:var(--e-mist);}
.ein-sunset{background:var(--e-sunset);-webkit-background-clip:text;background-clip:text;color:transparent;}
.ein-glas{position:relative;--t:.30;background:radial-gradient(120% 90% at 0% 0%,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 55%),linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.02)),rgba(8,9,14,var(--t));-webkit-backdrop-filter:blur(40px) saturate(190%);backdrop-filter:blur(40px) saturate(190%);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 1px 2px rgba(0,0,0,.25),0 24px 56px -12px rgba(0,0,0,.6);text-shadow:0 1px 16px rgba(0,0,0,.45);}
.ein-glas::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(255,255,255,.6) 0%,rgba(255,255,255,.14) 30%,rgba(255,255,255,.04) 60%,rgba(255,255,255,.22) 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:3;}

/* Knoepfe */
.ein-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 24px;border:1px solid var(--e-ember);border-radius:4px;background:none;color:var(--e-ember);font-family:'JetBrains Mono',monospace;font-size:12px;line-height:16px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;white-space:nowrap;text-decoration:none;transition:box-shadow .25s ease,background-color .25s ease;}
.ein-btn:hover{box-shadow:var(--e-glut);background:rgba(196,132,58,.10);}
.ein-btn.voll{background:var(--e-ember);color:#0a0b10;}
.ein-btn.voll:hover{background:#d0904a;}
.ein-btn.leise{border-color:var(--e-line);color:var(--e-white);}
.ein-btn.leise:hover{border-color:var(--e-ember);}
.ein-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;}
.ein-chip{min-height:44px;padding:0 16px;border:1px solid var(--e-line);border-radius:4px;background:none;color:var(--e-white);cursor:pointer;font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;line-height:24px;}
.ein-chip[aria-pressed="true"]{box-shadow:var(--e-wahl);background:rgba(255,255,255,.06);border-color:transparent;}
.ein-chip:hover{background:rgba(255,255,255,.05);}
.ein-link{display:inline-flex;align-items:center;min-height:44px;background:none;border:0;padding:0;cursor:pointer;color:var(--e-ember);}
.ein-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:1200;transform:translate(-50%,8px);opacity:0;width:max-content;max-width:calc(100% - 48px);padding:8px 16px;border-radius:12px;--t:.78;color:#eae4dc;transition:opacity .3s ease,transform .3s ease;pointer-events:none;}
.ein-toast.an{opacity:1;transform:translate(-50%,0);}

/* Avatare und Rahmen: Faceclaim, sonst Initialen in Fraktionsfarbe */
.ein-av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;background:linear-gradient(135deg,var(--a,#4a4e60),var(--b,#16181f) 85%);background-size:cover;background-position:center 20%;font-family:'JetBrains Mono',monospace;font-size:12px;line-height:16px;font-weight:500;letter-spacing:.06em;color:#eae4dc;overflow:hidden;}
.ein-rahmen{width:58px;height:72px;flex:0 0 auto;border:1px solid var(--e-line);border-radius:4px;display:grid;place-items:center;background:linear-gradient(160deg,var(--a,#4a4e60),var(--b,#16181f) 90%);background-size:cover;background-position:center 20%;font-family:'JetBrains Mono',monospace;font-size:12px;line-height:16px;letter-spacing:.06em;color:#eae4dc;transition:transform .35s ease;}

/* ---------- Mein Bereich: Post fuer deine Charaktere ----------
   Umschlaege nach docs/mockups-einladungen/post-mockup.html (freigegeben 20.10.2026, Entscheidungen 1 a, 2 a, 3 ja, 4 ja, 5 nein):
   Poststempel statt Kicker, Adresszeile, neue Einladung als geschlossener Umschlag, der Brief gleitet beim ersten Oeffnen heraus,
   Stempel "Beantwortet". Alles laeuft einmal, keine Dauerbewegung, bei reduzierter Bewegung aus. */
.ein-post{--e-foto:220px;}
.ein-post-h{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px 24px;margin-bottom:24px;}
.ein-post-tx{display:flex;flex-direction:column;min-width:0;}
.ein-adresse{font-style:italic;color:rgba(234,228,220,.8);}
.ein-post-vs{margin-top:8px;}
.ein-ziel{display:inline-flex;align-items:center;min-height:44px;align-self:end;}
.ein-poststempel{position:relative;width:112px;height:112px;color:rgba(234,228,220,.82);transform:rotate(-10deg);}
.ein-poststempel svg{display:block;overflow:visible;}
.ein-poststempel .wellen{position:absolute;left:96px;top:30px;width:160px;height:52px;color:rgba(234,228,220,.28);}
.ein-poststempel text{font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:500;letter-spacing:2px;fill:currentColor;}
.ein-poststempel .mitte{font-family:'Bebas Neue',Impact,sans-serif;font-size:24px;letter-spacing:2px;}
.ein-drueck .ein-poststempel{animation:einAufdruecken .5s cubic-bezier(.3,1.4,.5,1) both;}
.ein-drueck .ein-poststempel .wellen path{stroke-dasharray:200;stroke-dashoffset:200;animation:einZiehen .7s ease-out .45s forwards;}
@keyframes einAufdruecken{0%{opacity:0;transform:rotate(-16deg) scale(1.5);filter:blur(2px)}60%{opacity:1;filter:none}100%{opacity:1;transform:rotate(-10deg) scale(1)}}
@keyframes einZiehen{to{stroke-dashoffset:0}}

.ein-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}
.ein-karte{position:relative;isolation:isolate;display:flex;flex-direction:column;background:var(--e-night);border:1px solid var(--e-line);border-radius:4px;overflow:hidden;cursor:pointer;transition:border-color .25s ease,box-shadow .25s ease;}
.ein-karte:hover,.ein-karte:focus-within{border-color:var(--e-ember);box-shadow:var(--e-glut);}
/* Oberer Teil: Rueckseite des Umschlags, darin liegt der Brief (das Foto). Hover hebt den Brief 8 px heraus. */
.ein-fach{position:relative;height:var(--e-foto);overflow:hidden;background:linear-gradient(180deg,#0c0e15,#121520);}
.ein-innen{position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.015) 0 8px,transparent 8px 16px);}
.ein-bild{position:absolute;left:16px;right:16px;top:16px;bottom:-16px;border-radius:2px 2px 0 0;background-color:#05070d;background-size:cover;background-repeat:no-repeat;box-shadow:0 -8px 24px rgba(0,0,0,.5);transform:translateY(0);transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .6s ease;filter:saturate(.92) brightness(.9);}
.ein-karte.auf:hover .ein-bild{transform:translateY(-8px);filter:saturate(1.05) brightness(1);}
.ein-karte.zu .ein-bild{transform:translateY(105%);}
/* Klappe mit Siegel: deckt den Brief ab, solange der Umschlag zu ist */
.ein-klappe{position:absolute;inset:0;z-index:3;pointer-events:none;transition:transform .5s ease,opacity .5s ease;}
.ein-karte:not(.zu) .ein-klappe{transform:translateY(-100%);opacity:0;}
.ein-papier{position:absolute;inset:0;background:#141824;}
.ein-flaeche{position:absolute;inset:0 0 16% 0;clip-path:polygon(0 0,100% 0,50% 100%);background:linear-gradient(180deg,#1d2230 0%,#171b27 70%,#121620 100%);filter:drop-shadow(0 4px 8px rgba(0,0,0,.5));}
.ein-klappe svg{position:absolute;left:0;top:0;width:100%;height:84%;}
.ein-siegel{position:absolute;left:50%;top:84%;z-index:4;width:56px;height:56px;margin:-28px 0 0 -28px;display:grid;place-items:center;border-radius:48% 52% 50% 46% / 50% 46% 54% 50%;background:radial-gradient(circle at 35% 30%,#dfa964 0%,#b07330 50%,#6e4116 100%);box-shadow:inset 0 0 0 4px rgba(0,0,0,.14),inset 0 -3px 6px rgba(0,0,0,.35),0 4px 10px rgba(0,0,0,.55);pointer-events:none;}
.ein-siegel span{font-family:'Bebas Neue',Impact,sans-serif;font-size:32px;line-height:32px;color:rgba(46,24,6,.78);text-shadow:0 1px 0 rgba(255,222,176,.35);transform:translateY(2px);}
.ein-siegel::after{content:"";position:absolute;inset:8px;border-radius:50%;border:1px solid rgba(46,24,6,.35);}
.ein-karte.bricht .ein-siegel{animation:einBricht .55s ease forwards;}
@keyframes einBricht{0%{transform:scale(1) rotate(0);opacity:1}40%{transform:scale(1.14) rotate(-10deg);opacity:1}100%{transform:scale(.4) rotate(14deg);opacity:0}}
.ein-neu{position:absolute;right:16px;top:16px;z-index:4;color:#eae4dc;}
.ein-karte:not(.zu) .ein-neu{display:none;}
/* Stempel "Beantwortet": alle eigenen Charaktere haben geantwortet. Aufgedrueckt wird er nur beim Wechsel in diesen Zustand. */
.ein-erledigt{position:absolute;right:24px;bottom:32px;z-index:5;padding:8px 16px;border:2px solid rgba(234,228,220,.8);border-radius:4px;background:rgba(8,9,14,.55);color:#eae4dc;transform:rotate(-8deg);pointer-events:none;}
.ein-karte.stempelt .ein-erledigt{animation:einErledigt .45s cubic-bezier(.3,1.4,.5,1) both;}
@keyframes einErledigt{0%{opacity:0;transform:rotate(-14deg) scale(1.6)}100%{opacity:1;transform:rotate(-8deg) scale(1)}}
/* Vorderseite des Umschlags (Taschenkante oben), darauf die Angaben */
.ein-body{display:flex;flex-direction:column;gap:8px;padding:24px;flex:1 1 auto;}
.ein-vorne{position:relative;z-index:2;margin-top:-16px;background:var(--e-night);box-shadow:0 -16px 24px -8px rgba(0,0,0,.65);}
.ein-vorne::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(234,228,220,.18),transparent);}
.ein-kick{color:var(--e-mist);}
.ein-fakt{color:var(--e-mist);}
.ein-fuss{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:auto;padding-top:16px;border-top:1px solid var(--e-line);}
.ein-stand{min-width:0;display:flex;flex-direction:column;}
.ein-stand b{font-weight:500;color:#eae4dc;}
.ein-hinweis{display:inline-flex;align-items:center;gap:8px;color:#eae4dc;}
.ein-hinweis::before{content:"";width:8px;height:8px;border-radius:50%;background:#eae4dc;flex:0 0 auto;}
.ein-kurz{display:none;}
.ein-vorschau{display:inline-flex;align-items:center;gap:8px;min-height:24px;padding:0 8px;border:1px dashed rgba(234,228,220,.45);border-radius:4px;color:var(--e-mist);}

/* Fotos in Schublade und Event Hub */
.ein-art{position:relative;height:220px;overflow:hidden;background:#05070d;}
.ein-foto{position:absolute;inset:0;background-size:cover;background-repeat:no-repeat;transition:transform .6s ease,filter .6s ease;filter:saturate(.92) brightness(.86);}
.ein-spalte-kopf:hover .ein-foto{transform:scale(1.05);filter:saturate(1.08) brightness(1);}
.ein-scrim{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,9,14,.88) 0%,rgba(8,9,14,.25) 45%,rgba(8,9,14,0) 70%);pointer-events:none;}
.ein-wimpel{position:absolute;left:16px;top:16px;z-index:2;padding:8px 24px 8px 8px;background:rgba(8,9,14,.72);color:#eae4dc;clip-path:polygon(0 0,100% 0,calc(100% - 12px) 50%,100% 100%,0 100%);}

/* Persoenliche Einladung: Sunset-Rahmen (freigegeben 19.10.2026) */
.ein-karte.gold{border-color:transparent;}
.ein-karte.gold::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:var(--e-sunset);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:6;}

/* ---------- Schublade ---------- */
.ein-back{position:fixed;inset:0;z-index:1000;background:rgba(4,5,8,.72);animation:einEin .3s ease;}
@keyframes einEin{from{opacity:0}to{opacity:1}}
.ein-sh{position:fixed;z-index:1001;left:50%;top:50%;transform:translate(-50%,-50%);width:min(1120px,calc(100% - 48px));height:min(820px,calc(100% - 48px));border-radius:16px;--t:.78;display:flex;flex-direction:column;overflow:hidden;animation:einShEin .35s ease;}
@keyframes einShEin{from{opacity:0;transform:translate(-50%,calc(-50% + 8px))}to{opacity:1;transform:translate(-50%,-50%)}}
.ein-grip{display:none;}
.ein-x{position:absolute;right:8px;top:8px;z-index:6;display:inline-grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:rgba(16,19,26,.72);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#eae4dc;cursor:pointer;}
.ein-x:hover{background:rgba(40,44,56,.9);}
.ein-sh-in{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:360px minmax(0,1fr);}
.ein-sh-inv{min-height:0;overflow:auto;border-right:1px solid rgba(255,255,255,.10);display:flex;flex-direction:column;}
.ein-sh-inv .ein-art{height:200px;flex:0 0 auto;}
.ein-sh-inv-body{display:flex;flex-direction:column;gap:8px;padding:24px;}
.ein-mehr > summary{display:none;}
.ein-mehr > div{display:flex;flex-direction:column;gap:16px;padding-top:16px;}
.ein-fakten{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 16px;align-items:baseline;}
.ein-fakten dt{color:var(--e-mist);}
.ein-sh-liste{min-height:0;display:flex;flex-direction:column;overflow:auto;}
.ein-sh-lh{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:24px 64px 16px 24px;}
.ein-sh-lh h2{flex:1 1 auto;}
.ein-filter{display:flex;gap:8px;flex-wrap:wrap;padding:0 24px 8px;}
.ein-legende{display:flex;flex-direction:column;gap:0;padding:0 24px 16px;}
.ein-legende b{font-weight:500;color:#eae4dc;}
.ein-legende b.ein-sunset{color:transparent;}
.ein-ohne{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:24px 8px;}
.ein-fehlerbox{gap:8px;}
.ein-rows{padding:0 24px 24px;}
.ein-sh-fuss{display:none;}
.ein-laden{padding:40px 8px;color:var(--e-mist);text-align:center;}

.ein-anfragen{display:flex;flex-direction:column;gap:8px;margin:0 24px 16px;padding:16px;border:1px solid rgba(234,228,220,.35);border-radius:4px;}
.ein-anfrage{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px 16px;}
.ein-anfrage .acts{display:flex;gap:8px;}
.ein-paar{display:inline-flex;}
.ein-paar .ein-av + .ein-av{margin-left:-16px;box-shadow:0 0 0 2px var(--e-night);}

.ein-row{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:8px 16px;padding:8px;border-radius:4px;border-bottom:1px solid rgba(255,255,255,.06);}
.ein-row:hover{background:rgba(255,255,255,.03);}
.ein-rtx{display:flex;flex-direction:column;min-width:0;}
.ein-rn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ein-rs{color:var(--e-mist);}
.ein-rs.kommt{color:#eae4dc;}
.ein-rs .tagk{margin-left:8px;color:var(--e-mist);}
.ein-rs .tagk.ein-sunset{color:transparent;}
.ein-seg{display:inline-flex;border:1px solid var(--e-line);border-radius:4px;overflow:hidden;}
.ein-seg button{min-height:46px;padding:0 16px;border:0;border-left:1px solid var(--e-line);background:none;color:#eae4dc;cursor:pointer;font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;line-height:24px;white-space:nowrap;transition:background-color .2s ease;}
.ein-seg button:first-child{border-left:0;}
.ein-seg button:hover{background:rgba(255,255,255,.06);}
.ein-seg button[aria-pressed="true"]{background:rgba(234,228,220,.10);box-shadow:var(--e-wahl);}
.ein-seg button:focus-visible{outline-offset:-3px;}
.ein-seg button:disabled{cursor:not-allowed;opacity:.45;}
.ein-row.wartet .ein-seg button{cursor:progress;}
.ein-tag{display:inline-flex;align-items:center;min-height:32px;padding:0 16px;border:1px solid rgba(234,228,220,.5);border-radius:4px;color:#eae4dc;}
.ein-stempel{position:absolute;right:50%;top:50%;z-index:2;padding:8px 16px;border:2px solid rgba(234,228,220,.85);border-radius:4px;color:#eae4dc;transform:translate(50%,-50%) rotate(-8deg);opacity:0;pointer-events:none;animation:einStempel 1.4s ease forwards;}
@keyframes einStempel{0%{opacity:0;transform:translate(50%,-50%) rotate(-8deg) scale(1.7)}18%{opacity:.95;transform:translate(50%,-50%) rotate(-8deg) scale(1)}75%{opacity:.95}100%{opacity:0}}

.ein-wahl{grid-column:2 / -1;display:flex;flex-direction:column;gap:8px;padding:16px;margin-top:8px;border:1px solid rgba(234,228,220,.35);border-radius:4px;background:rgba(8,9,14,.4);}
.ein-wahl label{color:var(--e-mist);}
.ein-wahl input{min-height:44px;width:100%;padding:0 16px;background:var(--e-night);border:1px solid var(--e-line);border-radius:4px;color:#eae4dc;font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;}
.ein-wahl input:focus{border-color:var(--e-ember);outline:none;}
.ein-treffer{list-style:none;padding:0;display:flex;flex-direction:column;}
.ein-treffer button{display:flex;align-items:center;gap:16px;width:100%;min-height:48px;padding:0 8px;border:0;border-radius:4px;background:none;color:#eae4dc;cursor:pointer;text-align:left;}
.ein-treffer button:hover{background:rgba(255,255,255,.05);}
.ein-treffer button[aria-pressed="true"]{box-shadow:var(--e-wahl);background:rgba(255,255,255,.06);}
.ein-treffer button:disabled{cursor:not-allowed;opacity:.5;}
.ein-treffer-info{padding:8px;}
.ein-treffer .ein-16{color:var(--e-mist);}
.ein-wahl .acts{display:flex;gap:8px;flex-wrap:wrap;}
.ein-frage-z{border-color:rgba(196,132,58,.6);}

/* ---------- Event Hub: Gaestelisten ---------- */
.ein-hub{margin-bottom:40px;}
.ein-hub-kopf{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 40px;padding-block:40px 24px;}
.ein-hub-kopf h1{margin-top:8px;text-wrap:balance;}
.ein-hub-kopf .ein-sub{margin-top:8px;color:rgba(234,228,220,.85);}
.ein-tag-e{color:var(--e-ember);}
.ein-hub-r{display:flex;flex-direction:column;align-items:flex-end;gap:8px;text-align:right;color:var(--e-mist);}
.ein-tabs{display:none;}
.ein-spalten{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;}
.ein-spalte{min-width:0;display:flex;flex-direction:column;gap:24px;}
.ein-spalte-kopf{position:relative;height:200px;border:1px solid var(--e-line);border-radius:4px;overflow:hidden;}
.ein-spalte-tx{position:absolute;left:24px;right:24px;bottom:16px;z-index:3;display:flex;flex-direction:column;}
.ein-spalte-tx .ein-16{color:rgba(234,228,220,.85);}
.ein-host{display:flex;align-items:center;gap:16px;}
.ein-host .tx{display:flex;flex-direction:column;}
.ein-gruppe-h{display:flex;align-items:baseline;gap:16px;color:var(--e-mist);}
.ein-gruppe-h::after{content:"";flex:1 1 auto;height:1px;background:var(--e-line);}
.ein-gaeste{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:24px 16px;}
.ein-gast{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;min-width:0;}
.ein-gast a{display:flex;flex-direction:column;align-items:center;gap:8px;color:inherit;min-width:0;max-width:100%;}
.ein-gast.duo{grid-column:span 2;}
.ein-gast.mein .ein-rahmen{border-color:#eae4dc;}
.ein-duo{display:flex;}
.ein-duo-t{display:block;color:inherit;}
.ein-duo-t + .ein-duo-t{margin-left:-16px;}
.ein-duo-t:first-child .ein-rahmen{transform:rotate(-4deg);}
.ein-duo-t + .ein-duo-t .ein-rahmen{transform:rotate(4deg);box-shadow:-4px 0 12px rgba(0,0,0,.5);}
.ein-gast.duo:hover .ein-duo-t:first-child .ein-rahmen{transform:rotate(-6deg) translateX(-6px);}
.ein-gast.duo:hover .ein-duo-t + .ein-duo-t .ein-rahmen{transform:rotate(6deg) translateX(6px);}
.ein-gast-n{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;max-width:100%;}
.ein-gast a:hover .ein-gast-n{text-decoration:underline;text-underline-offset:4px;}
.ein-spalte-tx h2{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:anywhere;}
.ein-leer{color:var(--e-mist);}
.ein-dock{display:none;}

/* ---------- Event-Cockpit ---------- */
.ein-ck{display:flex;flex-direction:column;gap:24px;margin-bottom:40px;}
.ein-box{display:flex;flex-direction:column;gap:16px;padding:24px;background:var(--e-night);border:1px solid var(--e-line);border-radius:4px;}
.ein-acts{display:flex;flex-wrap:wrap;gap:16px;align-items:center;}
.ein-acts-weit{justify-content:space-between;}
.ein-liste{list-style:none;padding:0;}
.ein-pers-box{border-top:1px solid var(--e-line);}
.ein-frage{display:flex;flex-direction:column;gap:16px;padding:16px;border:1px solid rgba(234,228,220,.35);border-radius:4px;}
.ein-vorschau-gl{display:flex;gap:16px;align-items:flex-start;padding:16px;border-radius:12px;--t:.6;max-width:480px;}
.ein-gk-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--e-line);color:#eae4dc;flex:0 0 auto;}
.ein-zahlen{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;}
.ein-z{display:flex;flex-direction:column;padding:16px 24px;background:var(--e-night);border:1px solid var(--e-line);border-radius:4px;min-width:0;}
.ein-z .ein-mono,.ein-z .ein-16{color:var(--e-mist);}
.ein-sp{border-top:1px solid var(--e-line);}
.ein-sp > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:16px;min-height:56px;padding:8px;}
.ein-sp > summary::-webkit-details-marker{display:none;}
.ein-sp > summary:hover{background:rgba(255,255,255,.03);}
.ein-sp-n{flex:1 1 auto;min-width:0;}
.ein-sp-bar{flex:0 0 120px;height:4px;border-radius:4px;background:var(--e-line);overflow:hidden;}
.ein-sp-bar i{display:block;height:100%;background:#eae4dc;}
.ein-sp-z{flex:0 0 auto;color:var(--e-mist);font-variant-numeric:tabular-nums;}
.ein-chev{flex:0 0 auto;transition:transform .25s ease;color:var(--e-mist);}
.ein-sp[open] > summary .ein-chev{transform:rotate(180deg);}
.ein-sp-namen{padding:0 8px 16px;columns:2;column-gap:24px;list-style:none;color:var(--e-mist);}
.ein-pers-zeile{display:flex;align-items:center;gap:16px;min-height:48px;padding:0 8px;border-bottom:1px solid rgba(255,255,255,.06);}
.ein-pers-zeile .tx{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;}
.ein-pers-suche{min-height:44px;width:100%;padding:0 16px;background:var(--e-void);border:1px solid var(--e-line);border-radius:4px;color:#eae4dc;font-family:'Cormorant Garamond',Georgia,serif;font-size:16px;}

/* Mittlere Breiten (halbes Desktop-Fenster, Tablet quer, Zoom): Antwortzeilen untereinander wie am Handy. */
@media (min-width:900px) and (max-width:1180px){
  .ein-sh-in{grid-template-columns:320px minmax(0,1fr);}
  .ein-row{grid-template-columns:40px minmax(0,1fr);}
  .ein-row .ein-seg,.ein-row .ein-tag{grid-column:1 / -1;}
  .ein-row .ein-seg{display:flex;width:100%;}
  .ein-row .ein-seg button{flex:1 1 0;padding:0 8px;}
  .ein-row .ein-tag{justify-self:start;}
  .ein-wahl{grid-column:1 / -1;}
}
@media (max-width:899px){
  .ein-hero{font-size:48px;line-height:48px;}
  .ein-sub{font-size:20px;line-height:28px;}
  .ein-post{--e-foto:120px;}
  .ein-post-h{grid-template-columns:minmax(0,1fr) auto;align-items:start;margin-bottom:16px;}
  .ein-post-tx{grid-column:1;grid-row:1;}
  .ein-poststempel{grid-column:2;grid-row:1;width:88px;height:88px;}
  .ein-poststempel svg.ring{width:88px;height:88px;}
  .ein-poststempel .wellen{display:none;}
  .ein-ziel{grid-column:1 / -1;}
  .ein-grid{gap:8px;}
  .ein-bild{left:8px;right:8px;top:8px;}
  .ein-body{padding:16px;gap:8px;}
  .ein-body h3{font-size:28px;line-height:32px;-webkit-hyphens:auto;hyphens:auto;overflow-wrap:anywhere;}
  .ein-kick,.ein-motto-k,.ein-fakt{display:none;}
  .ein-fuss{flex-direction:column;align-items:stretch;gap:8px;padding-top:8px;}
  .ein-fuss .ein-btn{padding:0 8px;width:100%;}
  .ein-lang{display:none;}
  .ein-kurz{display:inline;}
  .ein-siegel{width:44px;height:44px;margin:-22px 0 0 -22px;}
  .ein-siegel span{font-size:24px;line-height:24px;}
  .ein-neu{right:8px;top:8px;}
  .ein-erledigt{right:8px;bottom:24px;padding:8px;}
  .ein-karte .ein-wimpel{display:none;}

  .ein-sh{left:0;right:0;top:auto;bottom:0;transform:none;width:auto;height:88%;border-radius:16px 16px 0 0;animation:einShHoch .35s ease;}
  @keyframes einShHoch{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
  .ein-grip{display:flex;justify-content:center;align-items:center;height:24px;flex:0 0 auto;touch-action:none;cursor:grab;}
  .ein-grip span{width:40px;height:4px;border-radius:4px;background:rgba(234,228,220,.35);}
  .ein-x{top:16px;}
  .ein-sh-in{display:flex;flex-direction:column;overflow:auto;}
  .ein-sh-inv{overflow:visible;border-right:0;flex:0 0 auto;}
  .ein-sh-inv .ein-art{height:120px;margin:8px 16px 0;border-radius:4px;}
  .ein-sh-inv-body{padding:16px 16px 8px;}
  .ein-mehr > summary{display:flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;list-style:none;color:var(--e-ember);}
  .ein-mehr > summary::-webkit-details-marker{display:none;}
  .ein-mehr > div{padding-top:8px;}
  .ein-sh-liste{flex:0 0 auto;overflow:visible;}
  .ein-sh-lh{padding:16px 16px 8px;}
  .ein-sh-lh h2{font-size:28px;line-height:32px;}
  .ein-filter{padding:0 16px 8px;}
  .ein-legende{padding:0 16px 8px;}
  .ein-anfragen{margin:0 16px 16px;}
  .ein-anfrage{grid-template-columns:auto minmax(0,1fr);}
  .ein-anfrage .acts{grid-column:1 / -1;}
  .ein-anfrage .acts .ein-btn{flex:1 1 0;}
  .ein-rows{padding:0 16px 16px;}
  .ein-row{grid-template-columns:40px minmax(0,1fr);padding:8px 0;}
  .ein-row .ein-seg,.ein-row .ein-tag{grid-column:1 / -1;}
  .ein-row .ein-seg{display:flex;width:100%;}
  .ein-row .ein-seg button{flex:1 1 0;padding:0;}
  .ein-row .ein-tag{justify-self:start;}
  .ein-wahl{grid-column:1 / -1;}
  .ein-stempel{right:16px;top:16px;transform:rotate(-8deg);animation-name:einStempelM;}
  @keyframes einStempelM{0%{opacity:0;transform:rotate(-8deg) scale(1.7)}18%{opacity:.95;transform:rotate(-8deg) scale(1)}75%{opacity:.95}100%{opacity:0}}
  .ein-sh-fuss{display:flex;gap:8px;padding:8px 16px calc(8px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(255,255,255,.10);flex:0 0 auto;}
  .ein-sh-fuss .ein-btn{flex:1 1 0;padding:0 8px;}

  .ein-hub-kopf{padding-block:24px 16px;}
  .ein-hub-r{align-items:flex-start;text-align:left;}
  .ein-tabs{display:flex;position:sticky;top:64px;z-index:15;gap:24px;margin-bottom:16px;border-bottom:1px solid var(--e-line);background:var(--e-void);}
  .ein-tabs button{min-height:44px;padding:0;border:0;border-bottom:2px solid transparent;background:none;color:var(--e-mist);cursor:pointer;font-family:'JetBrains Mono',monospace;font-size:12px;line-height:16px;letter-spacing:.16em;text-transform:uppercase;}
  .ein-tabs button[aria-selected="true"]{color:#eae4dc;border-bottom-color:var(--e-ember);}
  .ein-spalten{display:block;}
  .ein-spalte:not(.an){display:none;}
  .ein-spalte{gap:16px;}
  .ein-hub.mit-dock{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px));}
  .ein-nur-desktop{display:none;}
  .ein-spalte-kopf{height:150px;}
  .ein-spalte-tx{left:16px;right:16px;}
  .ein-spalte-tx h2{font-size:28px;line-height:32px;}
  .ein-gaeste{gap:16px 8px;}
  .ein-dock{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;gap:8px;padding:8px max(16px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));border-radius:16px 16px 0 0;--t:.6;}
  .ein-dock .ein-btn{flex:1 1 0;}

  .ein-zahlen{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .ein-z{padding:16px;}
  .ein-sp-bar{flex-basis:56px;}
  .ein-sp-namen{columns:1;}
}
@media (max-width:420px){
  .ein-body h3{font-size:24px;line-height:28px;}
}
/* Sehr schmale Geraete (320 px): Karten untereinander, damit lange Titel nicht falsch umbrechen. */
@media (max-width:359px){
  .ein-grid{grid-template-columns:minmax(0,1fr);gap:16px;}
  .ein-post{--e-foto:160px;}
}
@media (prefers-reduced-motion:reduce){
  .ein-root *,.ein-root *::before,.ein-root *::after,.ein-sh,.ein-back,.ein-toast{animation:none !important;transition:none !important;}
}