/* QRPilot – Startseite, Anmeldung, Rechtstexte, Editor.
   Aviatis CI 1.4: Blau #1025A1, Rot #B62E2B, Text #171A24, Fläche #F4F6FA, Poppins 700 / Inter 400.
   Ecken: Buttons und Schalter rund (999px), Karten 20px, Eingabefelder 12px. */

@font-face{font-family:Inter;font-weight:400;font-display:swap;src:url(/fonts/Inter-Regular.ttf) format('truetype')}
@font-face{font-family:Inter;font-weight:600;font-display:swap;src:url(/fonts/Inter-SemiBold.ttf) format('truetype')}
@font-face{font-family:Poppins;font-weight:700;font-display:swap;src:url(/fonts/Poppins-Bold.ttf) format('truetype')}

:root{
  --blue:#1025a1;--blue-deep:#0b1a73;--red:#b62e2b;--ink:#171a24;
  --bg:#f4f6fa;--surface:#ffffff;--surface-2:#eef1f8;--text:#171a24;--muted:#525a6e;--line:#dde2ee;
  --primary:#1025a1;--primary-ink:#ffffff;--focus:#1025a1;
  --ok:#1b7a4b;--err:#b62e2b;
  --shadow:0 1px 2px rgb(16 37 161/.06),0 12px 32px -16px rgb(16 37 161/.22);
  --r-card:20px;--r-field:12px;
  --ease:cubic-bezier(.16,1,.3,1);
  --head:Poppins,Inter,system-ui,sans-serif;--body:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0b0e1a;--surface:#141829;--surface-2:#1b2036;--text:#eef1f8;--muted:#a3abc2;--line:#2a3150;
    --primary:#3d55ff;--primary-ink:#ffffff;--focus:#8fa0ff;--ok:#4cc38a;--err:#ff7b77;
    --shadow:0 1px 2px rgb(0 0 0/.3),0 16px 40px -18px rgb(0 0 0/.6);
    color-scheme:dark;
  }
}

*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{min-height:100dvh;background:var(--bg);color:var(--text);font:16px/1.55 var(--body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--head);font-weight:700;letter-spacing:-.02em;line-height:1.1;text-wrap:balance}
p{text-wrap:pretty}
.i{width:20px;height:20px;flex:none}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:6px}
.wrap{width:min(1200px,100% - 32px);margin-inline:auto}

/* Buttons */
.btn{--b:var(--primary);--bi:var(--primary-ink);display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;
  border:1.5px solid var(--b);background:var(--b);color:var(--bi);font:600 1rem/1 var(--body);text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),background-color .2s,border-color .2s}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px -12px color-mix(in srgb,var(--b) 70%,transparent)}
.btn:active{transform:scale(.97)}
.btn .i{transition:transform .3s var(--ease)}
.btn:hover .i{transform:translateX(3px)}
.btn.ghost{background:transparent;color:var(--text);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--text);box-shadow:none}
.btn.red{--b:var(--red);--bi:#fff}
.btn.white{--b:#fff;--bi:var(--blue)}
.btn.sm{min-height:40px;padding:0 16px;font-size:.92rem}
.btn[disabled]{opacity:.5;pointer-events:none}

/* Navigation */
.nav{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(160%) blur(14px);-webkit-backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s}
.nav.scrolled{border-bottom-color:var(--line)}
.nav .wrap{display:flex;align-items:center;gap:20px;height:68px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:700 1.2rem/1 var(--head);letter-spacing:-.01em;color:var(--text)}
.brand img{width:40px;height:40px;border-radius:12px;background:#fff;box-shadow:0 0 0 1px var(--line)}
.brand b{color:var(--red)}
.nav-links{display:flex;gap:4px;margin-left:12px}
.nav-links a{padding:8px 12px;border-radius:999px;text-decoration:none;color:var(--muted);font-weight:600;font-size:.95rem;transition:color .2s,background-color .2s}
.nav-links a:hover{color:var(--text);background:var(--surface-2)}
.nav-end{margin-left:auto;display:flex;align-items:center;gap:8px}
.lang{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border-radius:999px;text-decoration:none;color:var(--muted);font-weight:600;font-size:.88rem}
.lang:hover{color:var(--text);background:var(--surface-2)}
@media (max-width:860px){.nav-links{display:none}}
@media (max-width:560px){.nav .wrap{gap:6px}.nav-end{gap:4px}.nav-end .btn.sm{padding:0 12px;font-size:.86rem}.nav-end .ghost{border-color:transparent}.brand span{display:none}.lang{padding:0 8px}.lang span{display:none}}

/* Hero */
.hero{position:relative;overflow:hidden;padding:56px 0 88px}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.hero h1{font-size:clamp(2.6rem,5.6vw,4.6rem);color:var(--blue);max-width:12ch}
@media (prefers-color-scheme:dark){.hero h1{color:#fff}}
.hero h1 em{font-style:normal;color:var(--red)}
.hero-sub{font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--muted);max-width:44ch;margin-top:20px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.band{position:absolute;z-index:-1;pointer-events:none;right:-12%;top:8%;width:62%;height:78%;background:var(--blue);transform:skewX(-12deg);border-radius:40px}
.band::after{content:"";position:absolute;left:-28px;top:12%;bottom:12%;width:12px;border-radius:12px;background:var(--red)}
@media (prefers-color-scheme:dark){.band{background:#16247f}}

.stage{position:relative;justify-self:center;width:min(100%,420px);aspect-ratio:420/560}
.phone{position:absolute;right:0;top:0;width:76%;aspect-ratio:9/18.6;border-radius:44px;padding:10px;background:#0d1020;
  box-shadow:0 0 0 1.5px rgb(255 255 255/.12) inset,0 30px 80px -30px rgb(11 26 115/.65),0 12px 24px -12px rgb(0 0 0/.35)}
.phone-screen{position:relative;width:100%;height:100%;border-radius:34px;overflow:hidden;background:#fff}
.phone-screen .pf{height:100%;overflow:hidden;font-size:13px}
.phone-screen .pf-in{padding:40px 12px 14px;min-height:100%}
.phone-screen .pf-av{width:68px;height:68px;font-size:24px;margin-bottom:12px}
.phone-screen .pf-name{font-size:1.2rem;color:var(--pf-text)}
.phone-screen .pf-link{min-height:46px;padding:4px;grid-template-columns:34px minmax(0,1fr) 34px}
.phone-screen .pf-ic{width:34px;height:34px}
.phone-screen .pf-ic svg{width:18px;height:18px}
.phone-screen .pf-t{font-size:.86rem}
.phone-screen .pf-soc{width:34px;height:34px}.phone-screen .pf-soc svg{width:19px;height:19px}
.phone-screen .pf-socs{margin-top:10px;gap:2px}
.phone-screen .pf-links{gap:9px}
.phone-screen .pf-head{margin-bottom:18px}
.phone-screen .pf-foot{padding-top:20px}
.phone-notch{position:absolute;z-index:3;top:20px;left:50%;width:30%;height:22px;transform:translateX(-50%);border-radius:999px;background:#0d1020}

.pass{position:absolute;left:-4%;bottom:-14%;width:74%;min-width:270px;border-radius:18px;background:var(--surface);color:var(--text);box-shadow:var(--shadow),0 30px 60px -30px rgb(11 26 115/.5);
  display:grid;grid-template-columns:1fr auto;overflow:hidden;transform:rotate(-6deg);border:1px solid var(--line)}
.pass-main{padding:16px 16px 14px;display:grid;gap:10px;min-width:0}
.pass-top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.64rem;white-space:nowrap;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pass-top img{width:22px;height:22px;border-radius:6px;background:#fff}
.pass-route{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}
.pass-route small{display:block;font-size:.62rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.pass-route b{font:700 1.05rem/1.1 var(--head);white-space:nowrap}
.pass-line{position:relative;height:1.5px;background:repeating-linear-gradient(90deg,var(--line) 0 6px,transparent 6px 10px)}
.pass-line .i{position:absolute;left:50%;top:50%;width:18px;height:18px;transform:translate(-50%,-50%) rotate(45deg);color:var(--red);background:var(--surface);padding:1px}
.pass-scan{font-size:.72rem;color:var(--muted)}
.pass-stub{position:relative;padding:12px;display:grid;place-items:center;background:var(--surface-2);border-left:1.5px dashed var(--line)}
.pass-stub::before,.pass-stub::after{content:"";position:absolute;left:-9px;width:16px;height:16px;border-radius:50%;background:var(--bg)}
.pass-stub::before{top:-8px}.pass-stub::after{bottom:-8px}
.qr{width:78px;height:78px;color:var(--ink);background:#fff;border-radius:6px;fill:currentColor}
.qr-scan{position:absolute;left:10px;right:10px;height:2px;top:14px;background:var(--red);box-shadow:0 0 12px 2px rgb(182 46 43/.45);opacity:0;border-radius:2px}

@media (max-width:900px){
  .hero{padding:28px 0 64px}
  .hero .wrap{grid-template-columns:1fr;gap:40px}
  .hero h1{max-width:14ch}
  .stage{width:min(100%,360px)}
  .band{right:-30%;top:auto;bottom:4%;width:120%;height:40%;transform:skewY(-8deg)}
  .band::after{display:none}
}
@media (max-width:420px){.hero-cta .btn{flex:1 1 100%}}

/* Bewegung auf der Startseite */
@media (prefers-reduced-motion:no-preference){
  .hero-copy>*{animation:rise .9s var(--ease) backwards}
  .hero-copy>*:nth-child(2){animation-delay:.08s}
  .hero-copy>*:nth-child(3){animation-delay:.16s}
  .phone{animation:phone-in 1.1s var(--ease) .2s backwards}
  .pass{animation:pass-in 1s var(--ease) .55s backwards}
  .qr rect{animation:pix .4s var(--ease) backwards;animation-delay:calc(.9s + var(--d))}
  .qr-scan{animation:scan 1.6s ease-in-out 2.1s 1}
  .band{animation:band-in 1.2s var(--ease) .05s backwards}
  @media (max-width:900px){.band{animation:none}}
  .js .reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
  .js .reveal.in{opacity:1;transform:none}
}
@keyframes rise{from{opacity:0;transform:translateY(18px)}}
@keyframes phone-in{from{opacity:0;transform:translateY(40px) rotate(4deg)}}
@keyframes pass-in{from{opacity:0;transform:translate(-30px,30px) rotate(-14deg)}}
@keyframes pix{from{opacity:0;transform:scale(.2)}}
@keyframes scan{0%{opacity:0;top:14px}10%{opacity:1}90%{opacity:1}100%{opacity:0;top:calc(100% - 16px)}}
@keyframes band-in{from{opacity:0;transform:skewX(-12deg) translateX(30%)}}
.qr rect{transform-box:fill-box;transform-origin:center}

/* Abschnitte */
section[id]{scroll-margin-top:84px}
.sec{padding:96px 0}
.sec h2{font-size:clamp(2rem,3.8vw,3rem);max-width:18ch}
.sec-sub{color:var(--muted);max-width:56ch;margin-top:14px;font-size:1.08rem}

/* Flugroute: drei Wegpunkte */
.route{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:56px;padding-top:44px}
.route-line{position:absolute;left:16px;right:16px;top:15px;height:2px;background:repeating-linear-gradient(90deg,var(--line) 0 10px,transparent 10px 18px)}
.route-line span{position:absolute;inset:0;background:var(--blue);transform-origin:left;transition:transform 1.8s var(--ease)}
.js .route-line span{transform:scaleX(0)}
@media (prefers-color-scheme:dark){.route-line span{background:var(--primary)}}
.route-plane{position:absolute;top:2px;left:calc(100% - 44px);width:28px;height:28px;color:var(--red);transform:rotate(45deg);transition:left 1.8s var(--ease)}
.js .route.in .route-line span{transform:scaleX(1)}
.js .route-plane{left:16px}
.js .route.in .route-plane{left:calc(100% - 44px)}
.wp{position:relative}
.wp::before{content:"";position:absolute;top:-36px;left:0;width:14px;height:14px;border-radius:50%;background:var(--surface);border:3px solid var(--blue)}
.wp h3{font-size:1.5rem;color:var(--text)}
.wp p{color:var(--muted);margin-top:8px;max-width:34ch}
@media (max-width:760px){
  .route{grid-template-columns:1fr;padding-top:0;padding-left:36px;gap:36px}
  .route-line{left:6px;right:auto;top:6px;bottom:6px;width:2px;height:auto;background:repeating-linear-gradient(180deg,var(--line) 0 10px,transparent 10px 18px)}
  .route-line span{transform-origin:top}
  .js .route-line span{transform:scaleY(0)}
  .js .route.in .route-line span{transform:scaleY(1)}
  .route-plane{display:none}
  .wp::before{top:6px;left:-36px}
}
@media (prefers-reduced-motion:reduce){.route-line span{transform:none!important;transition:none}.route-plane{left:calc(100% - 44px);transition:none}}

/* Bento */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:48px}
.cell{position:relative;overflow:hidden;border-radius:28px;padding:32px;background:var(--surface);border:1px solid var(--line);min-height:300px;display:flex;flex-direction:column}
.cell h3{font-size:1.55rem;max-width:20ch}
.cell p{color:var(--muted);margin-top:10px;max-width:40ch}
.c-design{grid-column:span 4;display:grid;grid-template-columns:1fr 240px;gap:28px;align-items:center;background:linear-gradient(135deg,var(--surface) 40%,color-mix(in srgb,var(--blue) 8%,var(--surface)))}
.c-qr{grid-column:span 2;background:var(--blue);color:#fff;border-color:transparent}
.c-qr p{color:rgb(255 255 255/.78)}
.c-stats{grid-column:span 3}
.c-privacy{grid-column:span 3;background:var(--ink);color:#fff;border-color:transparent}
.c-privacy p{color:rgb(255 255 255/.72)}
@media (prefers-color-scheme:dark){.c-privacy{background:#1b2036}}
.swatches{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.sw{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 8px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);color:var(--text);font:600 .9rem/1 var(--body);cursor:pointer;transition:border-color .2s,transform .2s var(--ease)}
.sw:hover{transform:translateY(-1px)}
.sw[aria-pressed=true]{border-color:var(--text)}
.sw i{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--a) 50%,var(--b) 50%);box-shadow:inset 0 0 0 1px rgb(0 0 0/.08)}
.mini{width:100%;aspect-ratio:9/15;border-radius:28px;overflow:hidden;border:8px solid #0d1020;box-shadow:var(--shadow);background:#fff}
.mini .pf{height:100%;font-size:11px}
.mini .pf-in{padding:24px 10px 10px;min-height:100%}
.mini .pf-av{width:48px;height:48px;font-size:18px;margin-bottom:8px}
.mini .pf-name{font-size:1rem}
.mini .pf-link{min-height:36px;padding:2px;grid-template-columns:28px minmax(0,1fr) 28px}
.mini .pf-ic{width:28px;height:28px}.mini .pf-ic svg{width:14px;height:14px}
.mini .pf-t{font-size:.8rem}.mini .pf-go{width:12px;height:12px}
.mini .pf-soc{width:28px;height:28px}.mini .pf-soc svg{width:16px;height:16px}.mini .pf-socs{margin-top:8px;gap:0}
.mini .pf-links{gap:6px}.mini .pf-head{margin-bottom:12px}.mini .pf-foot{display:none}
.mini .pf,.phone-screen .pf{transition:background-color .5s var(--ease),color .5s var(--ease)}
.mini .pf-link,.phone-screen .pf-link{transition:background-color .5s var(--ease),border-radius .5s var(--ease),color .5s}
.qr-big{margin-top:auto;align-self:flex-start;width:148px;height:148px;padding:10px;background:#fff;border-radius:16px;color:var(--ink)}
.qr-big svg{width:100%;height:100%}
.spark{margin-top:auto;padding-top:24px}
.spark svg{width:100%;height:130px;overflow:visible}
.spark .grid line{stroke:var(--line);stroke-width:1}
.spark .l-views{fill:none;stroke:var(--blue);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
@media (prefers-color-scheme:dark){.spark .l-views{stroke:#8fa0ff}}
.spark .l-clicks{fill:none;stroke:var(--red);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.spark .area{fill:url(#sparkfill)}
.spark-legend{display:flex;gap:16px;align-items:center;font-size:.82rem;color:var(--muted);margin-top:8px}
.spark-legend i{display:inline-block;width:12px;height:3px;border-radius:2px;margin-right:6px;vertical-align:middle}
.spark-legend em{margin-left:auto;font-style:normal;font-size:.75rem;padding:3px 8px;border-radius:999px;border:1px solid var(--line)}
@media (prefers-reduced-motion:no-preference){
  .js .spark path.draw{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1.8s var(--ease)}
  .js .reveal.in .spark path.draw{stroke-dashoffset:0}
}
.privacy-icons{display:flex;gap:10px;margin-top:auto;padding-top:28px}
.privacy-icons span{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:rgb(255 255 255/.08);color:#fff}
.privacy-icons .i{width:26px;height:26px}
@media (max-width:980px){.c-design{grid-template-columns:1fr 190px}}
@media (max-width:860px){
  .bento{grid-template-columns:1fr}
  .cell{grid-column:auto!important;min-height:0;padding:26px}
  .c-design{grid-template-columns:1fr;gap:20px}
  .mini{max-width:230px;margin-inline:auto}
  .qr-big{margin-top:24px}
}

/* Abschluss */
.final{position:relative;overflow:hidden;background:var(--blue);color:#fff;border-radius:36px;padding:72px 56px;display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center}
.final h2{color:#fff;font-size:clamp(2.2rem,4.6vw,3.6rem)}
.final p{color:rgb(255 255 255/.8);margin-top:12px;max-width:44ch}
.final::before{content:"";position:absolute;right:-6%;top:-40%;width:42%;height:180%;background:rgb(255 255 255/.06);transform:skewX(-14deg)}
.final::after{content:"";position:absolute;right:30%;top:-40%;width:14px;height:180%;background:var(--red);transform:skewX(-14deg);opacity:.9}
.final>*{position:relative;z-index:1}
@media (max-width:760px){.final{grid-template-columns:1fr;padding:48px 24px;border-radius:28px}.final::after{right:8%}}

/* Fußzeile */
.foot{padding:48px 0 40px;color:var(--muted);font-size:.9rem}
.foot .wrap{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:28px}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 18px}
.foot a{text-decoration:none}.foot a:hover{color:var(--text);text-decoration:underline;text-underline-offset:3px}

/* Formularseiten (Anmeldung, Registrierung, Meldung) */
.auth{min-height:calc(100dvh - 69px);display:grid;grid-template-columns:1fr 1fr;align-items:start}
.auth-side{position:sticky;top:69px;height:calc(100dvh - 69px);overflow:hidden;background:var(--blue);color:#fff;padding:56px;display:flex;flex-direction:column;justify-content:flex-end}
.auth-side::before{content:"";position:absolute;left:-20%;top:-10%;width:90%;height:70%;background:rgb(255 255 255/.06);transform:skewX(-14deg)}
.auth-side::after{content:"";position:absolute;left:58%;top:-10%;width:12px;height:70%;background:var(--red);transform:skewX(-14deg)}
.auth-side p{position:relative;font:700 clamp(1.8rem,3vw,2.6rem)/1.15 var(--head);max-width:14ch;letter-spacing:-.02em}
.auth-side img{position:relative;width:88px;height:88px;border-radius:24px;background:#fff;margin-bottom:24px}
.auth-main{display:flex;align-items:center;justify-content:center;padding:48px 24px}
.auth-card{width:min(100%,440px)}
.auth-card h1{font-size:clamp(2rem,4vw,2.6rem);color:var(--text)}
.auth-card .lead{color:var(--muted);margin-top:10px}
.auth-alt{margin-top:24px;color:var(--muted);font-size:.95rem}
.auth-alt a{color:var(--text);font-weight:600;text-underline-offset:3px}
@media (max-width:860px){.auth{grid-template-columns:1fr}.auth-side{display:none}.auth-main{align-items:flex-start;padding-top:32px}}

.form{display:grid;gap:18px;margin-top:28px}
.field{display:grid;gap:6px}
.field>label,.field>.lbl{font-weight:600;font-size:.92rem}
.hint{color:var(--muted);font-size:.84rem}
.input,.form input:not([type=checkbox]):not([type=hidden]):not([type=color]):not([type=range]):not([type=file]),.form textarea,.form select{
  width:100%;min-height:48px;padding:12px 14px;border-radius:var(--r-field);border:1.5px solid var(--line);background:var(--surface);color:var(--text);font:inherit;
  transition:border-color .2s,box-shadow .2s}
.form textarea{min-height:110px;resize:vertical;line-height:1.5}
.form input:hover,.form textarea:hover,.form select:hover{border-color:color-mix(in srgb,var(--text) 35%,var(--line))}
.form input:focus,.form textarea:focus,.form select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 18%,transparent)}
.form input[aria-invalid=true]{border-color:var(--err)}
.prefix{display:flex;align-items:stretch;border-radius:var(--r-field);border:1.5px solid var(--line);background:var(--surface);overflow:hidden;transition:border-color .2s,box-shadow .2s}
.prefix:focus-within{border-color:var(--primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 18%,transparent)}
.prefix span{display:flex;align-items:center;padding:0 2px 0 14px;color:var(--muted);white-space:nowrap}
.form .prefix input{border:0!important;box-shadow:none!important;padding-left:2px}
.check{display:flex;gap:12px;align-items:flex-start;font-size:.92rem;color:var(--muted)}
.check input{width:22px;height:22px;margin-top:1px;accent-color:var(--primary);flex:none}
.check a{color:var(--text)}
.form .btn{width:100%;margin-top:4px}
.note{padding:14px 16px;border-radius:14px;border:1.5px solid var(--line);background:var(--surface);font-size:.95rem;margin-top:20px;display:flex;gap:10px;align-items:flex-start}
.note .i{margin-top:2px}
.note.err{border-color:color-mix(in srgb,var(--err) 50%,var(--line));color:var(--text);background:color-mix(in srgb,var(--err) 7%,var(--surface))}
.note.err .i{color:var(--err)}
.note.ok{border-color:color-mix(in srgb,var(--ok) 45%,var(--line));background:color-mix(in srgb,var(--ok) 7%,var(--surface))}
.note.ok .i{color:var(--ok)}
.back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);text-decoration:none;font-weight:600;font-size:.92rem;margin-bottom:24px}
.back:hover{color:var(--text)}

/* Rechtstexte */
.doc{width:min(760px,100% - 32px);margin:48px auto 80px}
.doc h1{font-size:clamp(2rem,4vw,2.8rem);color:var(--blue);margin-bottom:24px}
@media (prefers-color-scheme:dark){.doc h1{color:#fff}}
.doc h2{font-size:1.2rem;margin:32px 0 10px}
.doc p{color:var(--muted);margin-bottom:10px;max-width:68ch}
.doc a{color:var(--text)}
.msg{width:min(560px,100% - 32px);margin:72px auto;text-align:center}
.msg h1{font-size:clamp(2rem,4vw,2.6rem)}
.msg .note{text-align:left}
.msg .btn{margin-top:24px}

/* ===================== Editor ===================== */
.ed{min-height:100dvh;display:flex;flex-direction:column}
.ed-top{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:saturate(160%) blur(14px);-webkit-backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid var(--line)}
.ed-top .wrap{display:flex;align-items:center;gap:12px;height:64px;width:min(1320px,100% - 32px)}
.ed-top .brand img{width:34px;height:34px;border-radius:10px}
.ed-save{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;color:var(--muted);min-width:0;overflow:hidden;white-space:nowrap}
.ed-save .txt{overflow:hidden;text-overflow:ellipsis}
.ed-save .dot{width:8px;height:8px;border-radius:50%;background:var(--ok);flex:none;transition:background-color .2s}
.ed-save[data-state=saving] .dot{background:#d99a1e;animation:pulse 1s ease-in-out infinite}
.ed-save[data-state=error] .dot{background:var(--err)}
@keyframes pulse{50%{opacity:.35}}
.ed-actions{margin-left:auto;display:flex;align-items:center;gap:8px}
.icon-btn{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;text-decoration:none;transition:border-color .2s,transform .2s var(--ease),background-color .2s}
.icon-btn:hover{border-color:var(--text)}
.icon-btn:active{transform:scale(.94)}
.icon-btn[disabled]{opacity:.35;pointer-events:none}
.icon-btn.on{background:color-mix(in srgb,var(--red) 10%,var(--surface));border-color:var(--red);color:var(--red)}
.icon-btn.danger:hover{border-color:var(--err);color:var(--err)}

/* Schalter */
.switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-weight:600;font-size:.9rem;user-select:none}
.switch input{appearance:none;-webkit-appearance:none;width:48px;height:28px;border-radius:999px;background:var(--line);position:relative;cursor:pointer;transition:background-color .25s var(--ease);flex:none}
.switch input::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgb(0 0 0/.25);transition:transform .3s var(--ease)}
.switch input:checked{background:var(--ok)}
.switch input:checked::after{transform:translateX(20px)}
.switch input:focus-visible{outline:2px solid var(--focus);outline-offset:3px}

.ed-main{flex:1;width:min(1320px,100% - 32px);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:40px;padding:28px 0 64px;align-items:start}
.ed-tabs{position:sticky;top:76px;z-index:5;display:flex;gap:4px;padding:5px;border-radius:999px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);width:max-content;max-width:100%;overflow-x:auto;scrollbar-width:none}
.ed-tabs::-webkit-scrollbar{display:none}
.ed-tab{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 16px;border-radius:999px;border:0;background:transparent;color:var(--muted);font:600 .92rem/1 var(--body);cursor:pointer;white-space:nowrap;transition:color .2s,background-color .25s var(--ease)}
.ed-tab:hover{color:var(--text)}
.ed-tab[aria-selected=true]{background:var(--blue);color:#fff}
@media (prefers-color-scheme:dark){.ed-tab[aria-selected=true]{background:var(--primary)}}
.ed-work{min-width:0}
.ed-panel{margin-top:24px}
.ed-panel[hidden]{display:none}
@media (prefers-reduced-motion:no-preference){.ed-panel:not([hidden]){animation:rise .45s var(--ease)}}
.card{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:28px;box-shadow:var(--shadow)}
.card+.card{margin-top:16px}
.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}
.card-head h2{font-size:1.5rem}
.card-head p{color:var(--muted);font-size:.92rem;margin-top:4px}
.ed .form{margin-top:0}
.counter{justify-self:end;font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}
.counter.over{color:var(--err)}

.banner-note{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border-radius:16px;margin-bottom:20px;font-size:.92rem;border:1.5px solid var(--line);background:var(--surface)}
.banner-note.warn{border-color:color-mix(in srgb,#d99a1e 50%,var(--line));background:color-mix(in srgb,#d99a1e 8%,var(--surface))}
.banner-note.err{border-color:color-mix(in srgb,var(--err) 50%,var(--line));background:color-mix(in srgb,var(--err) 7%,var(--surface))}

/* Profilbild */
.av-row{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.av{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:var(--blue);color:#fff;font:700 1.8rem/1 var(--head);flex:none;box-shadow:0 0 0 4px var(--surface),0 0 0 5px var(--line)}
.av img{width:100%;height:100%;object-fit:cover}
.av-actions{display:grid;gap:8px}
.av-actions .row{display:flex;gap:8px;flex-wrap:wrap}
.form .av-actions .btn,.form .share-url .btn,.ln-edit .btn,.add-link .btn,.share-qr .btn{width:auto;margin-top:0}

/* Links */
.add-link{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end;padding:16px;border-radius:18px;background:var(--surface-2);margin-bottom:20px}
.add-link .field>label{font-size:.82rem}
.add-link .btn{width:auto;min-height:48px}
@media (max-width:640px){.add-link{grid-template-columns:1fr}.add-link .btn{width:100%}}
/* Handy: schlichter, weniger Rand und Text */
@media (max-width:640px){
  .ed-main{padding-top:14px;gap:20px}
  .ed-panel{margin-top:14px}
  .card{padding:18px;border-radius:22px}
  .card-head{margin-bottom:14px}
  .card-head p{display:none}
  .add-link{padding:14px;gap:12px;margin-bottom:12px}
  .av-row{flex-wrap:nowrap;gap:14px}
  .av{width:64px;height:64px;font-size:1.3rem}
  .av-actions .hint{display:none}
}
/* Link hinzufügen: einfaches Formular, weitere Aktionen aus einem Raster */
.add-link[hidden]{display:none}
.add-link.wa{grid-template-columns:1fr 1fr}
.add-link .full{grid-column:1/-1}
.add-link .half{min-width:0}
.add-link textarea{min-height:76px}
.wa-foot{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px 16px;flex-wrap:wrap}
.wa-prev{margin:0;display:flex;align-items:center;gap:8px;flex:1 1 220px;min-width:0;color:var(--muted);font-size:.84rem;line-height:1.4;overflow-wrap:anywhere}
.wa-prev .i{width:18px;height:18px;flex:none;color:#1a9d52}
.wa-prev.ok{color:var(--text)}
.wa-prev.bad{color:var(--red)}
@media (max-width:640px){.wa-foot .btn{width:100%}.add-link.wa:not(.k-event) .half{grid-column:1/-1}}
@media (prefers-reduced-motion:no-preference){.add-link:not([hidden]){animation:rise .35s var(--ease)}}
.ln-list{display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
.ln-edit>*{min-width:0}
.ln{border:1.5px solid var(--line);border-radius:18px;background:var(--surface);transition:border-color .2s,box-shadow .3s var(--ease),transform .3s var(--ease)}
.ln.open{border-color:color-mix(in srgb,var(--primary) 50%,var(--line));box-shadow:var(--shadow)}
.ln.flash{animation:flash 1s var(--ease)}
@keyframes flash{0%{box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 30%,transparent)}100%{box-shadow:0 0 0 0 transparent}}
.ln-row{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 12px;min-height:64px}
.ln-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--blue) 9%,var(--surface));color:var(--blue);flex:none}
@media (prefers-color-scheme:dark){.ln-ic{color:#a9b6ff}}
.ln-main{flex:1;min-width:0;text-align:left;background:none;border:0;color:inherit;font:inherit;cursor:pointer;padding:4px 0;border-radius:8px}
.ln-main b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ln-main small{display:block;color:var(--muted);font-size:.82rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ln-tools{display:flex;gap:4px;flex:none}
.ln-tools .icon-btn{width:40px;height:40px;border-color:transparent;background:transparent}
.ln-tools .icon-btn:hover{border-color:var(--line);background:var(--surface-2)}
.ln-tools .icon-btn.on{border-color:transparent;background:color-mix(in srgb,var(--red) 10%,var(--surface))}
.ln-edit{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:4px 16px 18px}
.ln-edit .full{grid-column:1/-1}
.ln-edit .foot{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 0 0;border-top:1px solid var(--line)}
.ln-edit .err-line{color:var(--err);font-size:.85rem}
.ln-edit .foot .ln-tools{margin-left:auto;align-items:center}
@media (min-width:641px){.ln-edit .foot .icon-btn{display:none}}
@media (max-width:640px){.ln-edit{grid-template-columns:1fr}.ln-edit.k-event{grid-template-columns:1fr 1fr}.ln-edit:not(.k-event) .half{grid-column:1/-1}.ln-tools .hide-sm{display:none}}
.empty{text-align:center;padding:36px 16px;color:var(--muted);border:1.5px dashed var(--line);border-radius:18px}
.empty .i{width:32px;height:32px;margin:0 auto 10px;color:var(--blue)}

/* Design */
.presets{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.preset{position:relative;text-align:left;padding:16px;border-radius:18px;border:1.5px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;font:inherit;transition:border-color .2s,transform .25s var(--ease)}
.preset:hover{transform:translateY(-2px)}
.preset[aria-checked=true]{border-color:var(--text);box-shadow:0 0 0 3px color-mix(in srgb,var(--text) 10%,transparent)}
.preset b{display:block;font:700 1.02rem/1.2 var(--head)}
.preset small{display:block;color:var(--muted);font-size:.82rem;margin-top:2px}
.preset .chips{display:flex;gap:6px;margin-top:14px}
.preset .chips i{width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 1px rgb(0 0 0/.12)}
.preset .tick{position:absolute;top:12px;right:12px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--text);color:var(--bg);opacity:0;transform:scale(.6);transition:opacity .2s,transform .3s var(--ease)}
.preset .tick .i{width:14px;height:14px}
.preset[aria-checked=true] .tick{opacity:1;transform:none}
@media (max-width:520px){.preset{padding:14px}.preset .chips i{width:20px;height:20px}.preset small{font-size:.78rem}}
@media (max-width:340px){.presets{grid-template-columns:1fr}}
.custom-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin-top:16px}
.color{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;border:1.5px solid var(--line);background:var(--surface)}
.color input[type=color]{width:36px;height:36px;border:0;border-radius:10px;padding:0;background:none;cursor:pointer;flex:none}
.color input[type=color]::-webkit-color-swatch-wrapper{padding:0}
.color input[type=color]::-webkit-color-swatch{border:1px solid rgb(0 0 0/.12);border-radius:10px}
.color span{font-size:.82rem;font-weight:600;line-height:1.2}
.color code{display:block;font-size:.75rem;color:var(--muted);font-weight:400}
.seg{display:inline-flex;padding:4px;gap:4px;border-radius:999px;background:var(--surface-2);flex-wrap:wrap}
.seg button{min-height:38px;padding:0 14px;border-radius:999px;border:0;background:transparent;color:var(--muted);font:600 .88rem/1 var(--body);cursor:pointer}
.seg button[aria-pressed=true]{background:var(--surface);color:var(--text);box-shadow:0 1px 3px rgb(0 0 0/.12)}
.opt-row{display:flex;flex-wrap:wrap;gap:16px 28px;margin-top:20px;align-items:center}
.opt-row .lbl{display:block;font-weight:600;font-size:.88rem;margin-bottom:8px}

/* Statistik */
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.kpi{padding:18px;border-radius:18px;background:var(--surface-2)}
.kpi .i{width:22px;height:22px;color:var(--blue)}
@media (prefers-color-scheme:dark){.kpi .i{color:#a9b6ff}}
.kpi:last-child .i{color:var(--red)}
.kpi b{display:block;font:700 2rem/1.1 var(--head);margin-top:10px;font-variant-numeric:tabular-nums}
.kpi small{color:var(--muted);font-size:.84rem}
.kpi em{display:block;font-style:normal;color:var(--muted);font-size:.78rem;margin-top:2px}
@media (max-width:560px){.kpis{grid-template-columns:1fr 1fr}.kpi:last-child{grid-column:1/-1}}
.chart{margin-top:20px;padding:18px;border-radius:18px;border:1px solid var(--line)}
.chart svg{width:100%;height:160px;overflow:visible}
.chart .ax{font-size:11px;fill:var(--muted);font-family:var(--body)}
.chart .gl{stroke:var(--line)}
.chart .v{fill:none;stroke:var(--blue);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
@media (prefers-color-scheme:dark){.chart .v{stroke:#8fa0ff}}
.chart .c{fill:none;stroke:var(--red);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.chart .va{fill:color-mix(in srgb,var(--blue) 12%,transparent)}
.chart .dot{fill:var(--surface);stroke-width:2}
.top-links{display:grid;gap:12px;margin-top:20px}
.tl{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center}
.tl span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;font-size:.92rem}
.tl b{font-variant-numeric:tabular-nums}
.tl i{grid-column:1/-1;height:6px;border-radius:6px;background:var(--red);transform-origin:left;width:var(--w)}
@media (prefers-reduced-motion:no-preference){.tl i{animation:grow .8s var(--ease) backwards}}
@keyframes grow{from{transform:scaleX(0)}}

/* Teilen */
.share-url{display:flex;gap:8px;align-items:stretch}
.share-url input{flex:1;min-width:0;font-weight:600}
.share-qr{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:center;margin-top:24px}
.share-qr .qrbox{background:#fff;border-radius:20px;padding:14px;border:1px solid var(--line)}
.share-qr .qrbox img{width:100%;height:auto}
.share-qr .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
@media (max-width:560px){.share-qr{grid-template-columns:1fr}.share-qr .qrbox{max-width:220px}}

/* Vorschau rechts */
.ed-preview{position:sticky;top:88px}
.ed-preview .phone{position:relative;width:100%;max-width:360px;margin:0 auto;aspect-ratio:9/18.6}
.ed-preview-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px;color:var(--muted);font-size:.85rem;font-weight:600}
.ed-preview-head a{color:var(--text)}
.preview-fab{display:none}
@media (max-width:1023px){
  .ed-main{grid-template-columns:1fr;padding-bottom:110px}
  .ed-tabs{display:none}
  .ed-preview{display:none}
  .ed-preview.sheet{display:flex;position:fixed;inset:0;z-index:60;background:color-mix(in srgb,var(--ink) 70%,transparent);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);flex-direction:column;align-items:center;justify-content:center;padding:16px}
  .ed-preview.sheet .phone{width:min(84vw,330px);max-width:none}
  .ed-preview.sheet .ed-preview-head{color:#fff;width:min(84vw,330px)}
  .ed-preview.sheet .ed-preview-head a{color:#fff}
  @media (prefers-reduced-motion:no-preference){.ed-preview.sheet .phone{animation:phone-in .5s var(--ease)}}
  .preview-fab{display:inline-flex;position:fixed;z-index:40;right:16px;bottom:calc(84px + env(safe-area-inset-bottom));box-shadow:0 12px 30px -10px rgb(11 26 115/.6)}
  .ed-bottom{position:fixed;z-index:45;left:0;right:0;bottom:0;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:saturate(160%) blur(16px);-webkit-backdrop-filter:saturate(160%) blur(16px);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  .ed-bottom button{display:grid;justify-items:center;gap:3px;min-height:56px;padding:6px 2px;border:0;background:none;color:var(--muted);font:600 .7rem/1.1 var(--body);border-radius:14px;cursor:pointer}
  .ed-bottom button .i{width:24px;height:24px}
  .ed-bottom button[aria-selected=true]{color:var(--blue);background:color-mix(in srgb,var(--blue) 8%,transparent)}
  @media (prefers-color-scheme:dark){.ed-bottom button[aria-selected=true]{color:#a9b6ff}}
  .card{padding:20px}
  .ed-top .hide-sm{display:none}
}
@media (min-width:1024px){.ed-bottom{display:none}}
@media (max-width:560px){.ed-top .wrap{gap:8px}.ed-top .brand span{display:none}.switch .txt{display:none}}

/* Hinweis unten (Rückgängig) */
.toast{position:fixed;z-index:70;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,20px);opacity:0;pointer-events:none;display:flex;align-items:center;gap:14px;padding:10px 10px 10px 18px;border-radius:999px;background:var(--ink);color:#fff;font-size:.92rem;box-shadow:0 18px 40px -16px rgb(0 0 0/.5);transition:opacity .3s var(--ease),transform .4s var(--ease);max-width:calc(100% - 32px)}
.toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.toast button{min-height:36px;padding:0 14px;border-radius:999px;border:0;background:#fff;color:var(--ink);font:600 .85rem/1 var(--body);cursor:pointer}
@media (max-width:1023px){.toast{bottom:calc(96px + env(safe-area-inset-bottom))}}
@media (prefers-color-scheme:dark){.toast{background:#eef1f8;color:#0b0e1a}.toast button{background:#0b0e1a;color:#fff}}

/* ===================== Admin =====================
   Ruhig und flach: Seitenleiste, gruppierte Listen mit Haarlinien, keine Schatten.
   Farbe nur für Auswahl/Links (Blau) und Zähler/Löschen (Rot). */
.ad{--c-views:#1025a1;--c-clicks:#b62e2b;--ad-line:color-mix(in srgb,var(--text) 10%,transparent);--ad-row:color-mix(in srgb,var(--text) 4%,transparent);background:var(--bg)}
.ad-shell{display:grid;grid-template-columns:214px minmax(0,1fr);min-height:100dvh}
.ad-side{position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;gap:3px;padding:18px 12px;border-right:1px solid var(--ad-line);background:var(--surface)}
.ad-side .brand{padding:2px 9px 16px;font-size:1rem;gap:9px}
.ad-side .brand img{width:27px;height:27px;border-radius:7px}
.ad-side .brand em{font-style:normal;color:var(--muted);font:600 .72rem/1 var(--body);margin-left:2px}
.ad-side nav{display:grid;gap:2px}
.ad-side a.nav-i{display:flex;align-items:center;gap:10px;min-height:34px;padding:0 9px;border-radius:8px;color:var(--text);text-decoration:none;font-size:.9rem}
.ad-side a.nav-i .i{width:17px;height:17px;color:var(--muted)}
.ad-side a.nav-i:hover{background:var(--ad-row)}
.ad-side a.nav-i[aria-current=page]{background:color-mix(in srgb,var(--blue) 10%,transparent);color:var(--blue);font-weight:600}
.ad-side a.nav-i[aria-current=page] .i{color:var(--blue)}
@media (prefers-color-scheme:dark){.ad-side a.nav-i[aria-current=page]{background:color-mix(in srgb,var(--primary) 22%,transparent);color:#c3cbff}.ad-side a.nav-i[aria-current=page] .i{color:#c3cbff}}
.ad-side .spacer{flex:1}
.ad-side .foot-links{display:grid;gap:2px;padding-top:10px;border-top:1px solid var(--ad-line)}
.count{margin-left:auto;min-width:19px;height:19px;padding:0 6px;border-radius:999px;background:var(--red);color:#fff;font:700 .7rem/19px var(--body);text-align:center}
.ad-main{width:100%;min-width:0;max-width:1040px;padding:30px 36px 72px}
.ad-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px}
.ad-head h1{font-size:1.55rem;letter-spacing:-.015em}
.ad-head p{color:var(--muted);font-size:.86rem;margin-top:3px}
.ad-sec{margin-top:26px}
.ad-sec>h2{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font:600 .88rem/1.3 var(--body);letter-spacing:0;color:var(--text);margin:0 3px 8px}
.ad-sec>h2 a,.ad-sec>h2 span{font-weight:400;font-size:.8rem;color:var(--muted);text-decoration:none}
.ad-sec>h2 a:hover{color:var(--blue)}
.ad-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 26px}
.group{background:var(--surface);border:1px solid var(--ad-line);border-radius:12px}
.group>:first-child{border-top-left-radius:11px;border-top-right-radius:11px}
.group>:last-child{border-bottom-left-radius:11px;border-bottom-right-radius:11px}
.li{display:flex;align-items:center;gap:11px;min-height:44px;padding:8px 14px;border-top:1px solid var(--ad-line);color:var(--text);text-decoration:none}
.li:first-child{border-top:0}
a.li:hover{background:var(--ad-row)}
.li .grow{flex:1;min-width:0}
.li .t{display:block;font-weight:600;font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.li .s{display:block;color:var(--muted);font-size:.78rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
div.li .s{white-space:normal}
.li .v{font-variant-numeric:tabular-nums;font-size:.88rem;white-space:nowrap}
.li .v small{color:var(--muted);font-size:.76rem;margin-left:6px}
.li .chev{width:15px;height:15px;color:var(--muted);flex:none}
.li.empty-row{color:var(--muted);font-size:.86rem;justify-content:center}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--muted);flex:none}
.dot.ok{background:#1b9a5a}.dot.warn{background:#d99a1e}.dot.err{background:var(--red)}.dot.info{background:var(--blue)}
.state{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;color:var(--muted);white-space:nowrap}

/* Zahlenleiste */
.stats-bar{display:grid;grid-template-columns:repeat(4,1fr);background:var(--surface);border:1px solid var(--ad-line);border-radius:12px}
.stats-bar>div{padding:14px 17px;border-left:1px solid var(--ad-line)}
.stats-bar>div:first-child{border-left:0}
.stats-bar b{display:block;font:700 1.6rem/1.12 var(--head);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stats-bar span{display:block;font-size:.82rem;color:var(--text);margin-top:3px}
.stats-bar small{display:block;font-size:.74rem;color:var(--muted);margin-top:2px}

/* Diagramm */
.chart-box{background:var(--surface);border:1px solid var(--ad-line);border-radius:12px;padding:13px 14px 8px}
.chart-box svg{width:100%;height:auto;overflow:visible;display:block}
.chart-box .gl{stroke:var(--ad-line)}
.chart-box .ax{font:11px var(--body);fill:var(--muted)}
.legend{display:inline-flex;gap:13px;font-size:.78rem;color:var(--muted)}
.legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px;vertical-align:-1px}

/* Segment-Schalter und Suche */
.toolbar{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin-bottom:14px}
.seg-l{display:inline-flex;padding:2px;gap:2px;border-radius:8px;background:var(--ad-row)}
.seg-l a{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 11px;border-radius:7px;color:var(--muted);text-decoration:none;font-size:.82rem;font-weight:600;white-space:nowrap}
.seg-l a[aria-current=true]{background:var(--surface);color:var(--text);box-shadow:0 1px 2px rgb(0 0 0/.08),0 0 0 .5px var(--ad-line)}
.seg-l .count{margin-left:2px}
.ad-search{flex:1;min-width:200px;display:flex}
.ad-search input{width:100%;min-height:34px;padding:0 11px 0 33px;border-radius:9px;border:1px solid var(--ad-line);background:var(--surface) no-repeat 12px 50%/16px;color:var(--text);font:inherit;font-size:.86rem;background-position:11px 50%;background-size:15px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%23808898'%3E%3Cpath d='M229.66 218.34l-50.07-50.06a88.11 88.11 0 1 0-11.31 11.31l50.06 50.07a8 8 0 0 0 11.32-11.32ZM40 112a72 72 0 1 1 72 72 72.08 72.08 0 0 1-72-72Z'/%3E%3C/svg%3E")}
.ad-search input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 18%,transparent)}
.ad-select{min-height:34px;padding:0 9px;border-radius:9px;border:1px solid var(--ad-line);background:var(--surface);color:var(--text);font:inherit;font-size:.84rem}

/* Aktionen-Menü (ohne JavaScript, details/summary) */
.menu{position:relative;flex:none}
.menu summary{list-style:none;display:grid;place-items:center;width:31px;height:31px;border-radius:8px;color:var(--muted);cursor:pointer}
.menu summary::-webkit-details-marker{display:none}
.menu summary:hover,.menu[open] summary{background:var(--ad-row);color:var(--text)}
.menu .pop{position:absolute;right:0;top:calc(100% + 4px);z-index:20;min-width:180px;padding:5px;border-radius:11px;background:var(--surface);border:1px solid var(--ad-line);box-shadow:0 10px 30px -10px rgb(0 0 0/.3)}
.menu .pop form{margin:0}
.menu .pop button,.menu .pop a{display:flex;width:100%;align-items:center;min-height:31px;padding:0 9px;border:0;border-radius:7px;background:none;color:var(--text);font:inherit;font-size:.86rem;text-align:left;text-decoration:none;cursor:pointer}
.menu .pop button:hover,.menu .pop a:hover{background:var(--ad-row)}
.menu .pop .del{color:var(--red)}
.menu .pop hr{border:0;border-top:1px solid var(--ad-line);margin:4px 2px}

/* Nachrichten */
.msg-row{display:block;padding:12px 14px;border-top:1px solid var(--ad-line)}
.msg-row:first-child{border-top:0}
.msg-row.done{opacity:.55}
.msg-top{display:flex;align-items:baseline;gap:10px}
.msg-top .t{flex:1;min-width:0;font-weight:600;font-size:.9rem}
.msg-top time{color:var(--muted);font-size:.76rem;white-space:nowrap}
.msg-from{color:var(--muted);font-size:.8rem;margin-top:2px}
.msg-body{margin-top:7px;font-size:.88rem;white-space:pre-wrap;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.msg-row:target .msg-body,.msg-row details[open]~.msg-body{-webkit-line-clamp:unset}
.msg-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.msg-actions form{margin:0}
.tbtn{display:inline-flex;align-items:center;gap:6px;min-height:29px;padding:0 11px;border-radius:7px;border:1px solid var(--ad-line);background:var(--surface);color:var(--text);font:600 .8rem/1 var(--body);text-decoration:none;cursor:pointer}
.tbtn:hover{background:var(--ad-row)}
.tbtn.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.tbtn.primary:hover{background:color-mix(in srgb,var(--blue) 88%,#000)}
.tbtn.del{color:var(--red)}
.tbtn .i{width:14px;height:14px}

/* Log */
.log-row{display:grid;grid-template-columns:122px 84px minmax(0,1fr);gap:11px;align-items:baseline;padding:8px 14px;border-top:1px solid var(--ad-line);font-size:.84rem}
.log-row:first-child{border-top:0}
.log-row time{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.log-row code{font-size:.76rem;color:var(--muted)}
.log-row .m{overflow-wrap:anywhere}
.log-row .meta{display:block;color:var(--muted);font-size:.76rem;margin-top:2px}

/* Bestätigung (Löschen) */
.confirm{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding:12px 14px;margin-bottom:14px;border-radius:12px;border:1px solid color-mix(in srgb,var(--red) 40%,var(--ad-line));background:color-mix(in srgb,var(--red) 6%,var(--surface))}
.confirm p{font-size:.88rem}
.confirm .acts{display:flex;gap:8px}
.confirm form{margin:0}
.tbtn.danger{background:var(--red);border-color:var(--red);color:#fff}

/* Handy: Tab-Leiste unten statt Seitenleiste */
.ad-tabs{display:none}
@media (max-width:900px){
  .ad-shell{grid-template-columns:minmax(0,1fr)}
  .ad-side{display:none}
  .ad-main{padding:16px 16px 100px}
  .li{min-height:44px}
  .seg-l a,.tbtn{min-height:32px}
  .menu summary{width:36px;height:36px}
  .menu .pop button,.menu .pop a{min-height:38px}
  .ad-mtop{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .ad-tabs{position:fixed;z-index:45;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);padding:6px 6px calc(6px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:saturate(160%) blur(16px);-webkit-backdrop-filter:saturate(160%) blur(16px);border-top:1px solid var(--ad-line)}
  .ad-tabs a{position:relative;display:grid;justify-items:center;gap:3px;min-height:52px;padding:6px 2px;color:var(--muted);text-decoration:none;font:600 .7rem/1.1 var(--body);border-radius:12px}
  .ad-tabs a .i{width:22px;height:22px}
  .ad-tabs a[aria-current=page]{color:var(--blue)}
  .ad-tabs .count{position:absolute;top:2px;left:calc(50% + 6px);margin:0}
  .ad-cols{grid-template-columns:1fr}
  .stats-bar{grid-template-columns:1fr 1fr}
  .stats-bar>div:nth-child(3){border-left:0}
  .stats-bar>div:nth-child(n+3){border-top:1px solid var(--ad-line)}
  .log-row{grid-template-columns:1fr auto;gap:2px 10px}
  .log-row .m{grid-column:1/-1}
}
@media (min-width:901px){.ad-mtop{display:none}}
@media (prefers-color-scheme:dark){.ad-tabs a[aria-current=page]{color:#a9b6ff}}
.toolbar .seg-l{max-width:100%;overflow-x:auto;scrollbar-width:none}
.toolbar .seg-l::-webkit-scrollbar{display:none}
@media (prefers-color-scheme:dark){.ad{--c-views:#8fa0ff;--c-clicks:#ff7b77}}
.ok-ic svg{display:inline-block;width:15px;height:15px;color:var(--blue);vertical-align:-2px}
.ad .li,.ad .msg-row{font-size:.88rem}

/* Kalender-Auswahlseite */
.cal-choice{display:grid;gap:10px;margin-top:20px}
.cal-choice .btn{margin-top:0;justify-content:center}
.msg .note+p{margin-top:20px}

.act-more{display:flex;align-items:center;gap:6px;min-height:44px;margin:-8px 0 12px;padding:0 6px;border:0;border-radius:12px;background:none;color:var(--muted);font:600 .9rem/1.2 var(--body);cursor:pointer;text-align:left;transition:color .2s}
.act-more[hidden]{display:none}
.act-more .i{width:16px;height:16px;flex:none;transition:transform .25s var(--ease)}
.act-more[aria-expanded=true]{color:var(--text)}
.act-more[aria-expanded=true] .i{transform:rotate(180deg)}
@media (hover:hover) and (pointer:fine){.act-more:hover{color:var(--text)}}
.act-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:20px}
.act-grid[hidden]{display:none}
.act-tile{display:grid;justify-items:center;align-content:center;gap:6px;min-height:78px;padding:10px 6px;border-radius:18px;border:1.5px solid var(--line);background:var(--surface);color:var(--text);font:600 .88rem/1.2 var(--body);cursor:pointer;transition:transform .16s ease-out,border-color .2s,background-color .2s}
.act-tile:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.act-tile:hover{border-color:color-mix(in srgb,var(--text) 35%,var(--line));background:var(--surface-2)}}
.act-ic{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:12px;background:var(--surface-2)}
.act-ic .i{width:22px;height:22px}
.act-tile[data-k=whatsapp] .act-ic{color:#1a9d52}
.act-head{grid-column:1/-1;display:flex;align-items:center;gap:12px}
.act-head b{font-size:1.02rem}
@media (prefers-reduced-motion:no-preference){.act-grid:not([hidden]){animation:rise .3s var(--ease)}}

/* Auswahl: zwei Buttons (Aktionen, Inhalte) */
.act-morerow{display:flex;flex-wrap:wrap;gap:8px;margin:-4px 0 12px}
.act-morerow[hidden]{display:none}
.act-morerow .act-more{margin:0;padding:0 14px 0 16px;border:1.5px solid var(--line);border-radius:999px;background:var(--surface)}
.act-morerow .act-more[aria-expanded=true]{border-color:color-mix(in srgb,var(--text) 35%,var(--line))}

/* Zusammengesetzte Felder: Bilder, FAQ, Öffnungszeiten */
.rep{display:grid;gap:10px;min-width:0}
.thumbs{display:flex;flex-wrap:wrap;gap:8px}
.thumb{position:relative;width:84px;height:84px;border-radius:14px;overflow:hidden;background:var(--surface-2);border:1.5px solid var(--line);flex:none}
.thumb img{display:block;width:100%;height:100%;object-fit:cover}
.thumb-x{position:absolute;top:3px;right:3px;width:36px;height:36px;border-radius:50%;border:0;background:transparent;color:#fff;display:grid;place-items:center;cursor:pointer}
.thumb-x::before{content:"";position:absolute;width:24px;height:24px;border-radius:50%;background:rgb(0 0 0/.62);z-index:0}
.thumb-x .i{position:relative;width:13px;height:13px}
.thumb.add{display:grid;place-items:center;cursor:pointer;color:var(--muted);border-style:dashed;background:transparent;padding:0;transition:transform .16s ease-out,border-color .2s}
.thumb.add .i{width:22px;height:22px}
.thumb.add:active{transform:scale(.97)}
.thumb.add.busy{opacity:.5;cursor:progress}
.rep-list{display:grid;gap:10px}
.rep-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:12px;background:var(--surface-2);border-radius:14px}
.rep-row input,.rep-row textarea{grid-column:1}
.rep-row .icon-btn{grid-column:2;grid-row:1/3;align-self:start}
.rep .btn.sm{justify-self:start}
.icon-btn.sm{width:40px;height:40px}
.hours-ed{display:grid;gap:8px}
.hours-row{display:grid;grid-template-columns:30px minmax(0,1fr) minmax(0,1fr) 40px;gap:8px;align-items:center}
.hours-row b{font-size:.88rem}
.hours-row input[type=time]{padding:10px 8px;min-height:44px}
.hours-row input[type=time]::-webkit-calendar-picker-indicator{display:none}
.hours-row .off-txt{grid-column:2/4;color:var(--muted);font-size:.9rem}
.ln-ic .ln-img{width:100%;height:100%;object-fit:cover;border-radius:inherit}

/* Reiter Anfragen: Abzeichen und Liste */
.ed-tab[hidden],.ed-bottom button[hidden]{display:none}
.tab-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--red);color:#fff;font:700 .68rem/1 var(--body);font-style:normal;margin-left:6px}
.tab-badge[hidden]{display:none}
.ed-bottom .bi{position:relative;display:grid;place-items:center}
.ed-bottom .tab-badge{position:absolute;top:-4px;left:calc(50% + 6px);margin:0}
.inq-list{display:grid;gap:12px}
.inq{display:grid;gap:6px;padding:16px;border:1.5px solid var(--line);border-radius:18px;background:var(--surface)}
.inq.new{border-color:color-mix(in srgb,var(--blue) 55%,var(--line));background:color-mix(in srgb,var(--blue) 5%,var(--surface))}
.inq-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.inq-head small,.inq-mail{color:var(--muted);font-size:.86rem}
.inq-mail{overflow-wrap:anywhere}
.inq-msg{white-space:pre-wrap;overflow-wrap:anywhere;margin:4px 0 6px}
.inq-act{display:flex;gap:8px;flex-wrap:wrap}
.inq-act .btn{width:auto;margin-top:0}
.poll-res{display:grid;gap:6px;padding:12px 14px;border-radius:14px;background:var(--surface-2)}
.poll-res ul{list-style:none;padding:0;margin:0;display:grid;gap:4px}
.poll-res li{display:flex;justify-content:space-between;gap:12px;font-size:.92rem}
.poll-res em{font-style:normal;font-weight:700}