
:root {
    --bg: #f4f1ea;
    --ink: #111111;
    --muted: #77736c;
    --line: #d7d1c6;
    --card: #fffdf8;
    --danger: #a22222;
    --ok: #1c6b3f;
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

html, body {
    margin: 0;
    min-height: 100%;
    background: var(--bg);
    color: var(--ink);
    font-family: Arial, Helvetica, sans-serif;
}

body {
    padding: 32px 18px 80px;
}

.shell {
    width: min(760px, 100%);
    margin: 0 auto;
}

.brand {
    font-size: clamp(38px, 8vw, 72px);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 0.9;
    margin: 36px 0 44px;
}

.kicker {
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 12px;
    font-weight: 700;
    color: var(--muted);
}

.card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 28px;
    margin: 18px 0;
}

h1, h2, h3 { letter-spacing: -0.035em; }
h1 { font-size: clamp(32px, 6vw, 58px); margin: 0 0 18px; }
h2 { font-size: 28px; margin: 0 0 14px; }
p { line-height: 1.5; }

.big-name {
    font-size: clamp(28px, 5vw, 46px);
    font-weight: 800;
    letter-spacing: -0.04em;
}

.timer {
    font-size: clamp(34px, 9vw, 76px);
    font-variant-numeric: tabular-nums;
    font-weight: 900;
    letter-spacing: -0.05em;
    margin: 18px 0;
}

.event-meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 20px 0;
}

.event-meta div {
    padding: 11px 0;
    border-bottom: 1px solid var(--line);
}

label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin: 18px 0 7px;
}

input, textarea, select {
    width: 100%;
    border: 1px solid var(--line);
    background: white;
    padding: 14px 15px;
    border-radius: 11px;
    font: inherit;
}

button, .button {
    appearance: none;
    display: inline-block;
    border: 0;
    border-radius: 999px;
    background: var(--ink);
    color: white;
    padding: 14px 22px;
    font-weight: 800;
    font-size: 15px;
    cursor: pointer;
    text-decoration: none;
}

.button.secondary, button.secondary {
    background: transparent;
    border: 1px solid var(--ink);
    color: var(--ink);
}

.button.danger, button.danger {
    background: var(--danger);
}

.actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.muted { color: var(--muted); }
.ok { color: var(--ok); font-weight: 700; }
.error { color: var(--danger); font-weight: 700; }

.code {
    font-size: clamp(38px, 10vw, 74px);
    font-weight: 900;
    letter-spacing: 0.06em;
    margin: 20px 0;
}

.copybox {
    white-space: pre-wrap;
    background: #111;
    color: white;
    border-radius: 16px;
    padding: 20px;
    line-height: 1.5;
    margin: 14px 0;
}

table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

th, td {
    text-align: left;
    padding: 10px 8px;
    border-bottom: 1px solid var(--line);
    vertical-align: top;
}

.inline-form { display: inline; }

.admin-nav {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0 0 20px;
}

.admin-nav a {
    color: var(--ink);
    font-weight: 700;
}

.stat-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.stat {
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 16px;
}

.stat strong {
    display: block;
    font-size: 32px;
}

@media (min-width: 640px) {
    .event-meta { grid-template-columns: 1fr 1fr; gap: 0 20px; }
    .stat-grid { grid-template-columns: repeat(4, 1fr); }
}

.site-footer { display:flex; gap:16px; margin-top:42px; padding-top:20px; border-top:1px solid var(--line); font-size:13px; }
.site-footer a { color:var(--muted); }
.notice { border:1px solid var(--line); border-radius:14px; padding:14px 16px; margin:16px 0; }

.danger-link {
    color: var(--danger) !important;
    font-weight: 700;
}

.remaining-timer {
    font-size: clamp(24px, 5vw, 42px);
    letter-spacing: -0.035em;
}
.share-object {
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 18px;
    margin: 18px 0;
}
.short-link {
    display: inline-block;
    margin-top: 10px;
    font-size: clamp(22px, 5vw, 34px);
    font-weight: 900;
    letter-spacing: -0.04em;
    color: var(--ink);
    text-decoration: none;
    word-break: break-word;
}
.preview-card {
    border: 1px dashed var(--line);
    border-radius: 16px;
    padding: 18px;
    margin: 18px 0;
    background: #fff;
}
.danger-zone {
    margin-top: 34px;
    padding-top: 22px;
    border-top: 1px solid var(--line);
}
.small { font-size: 13px; }

/* 0.3.3 public landing page */
.landing-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding-top: 8px;
}
.labs-wordmark {
    color: var(--ink);
    text-decoration: none;
    font-weight: 900;
    letter-spacing: -0.045em;
    font-size: 22px;
}
.landing-jump {
    color: var(--ink);
    font-size: 14px;
    font-weight: 700;
}
.landing-hero {
    padding: 86px 0 46px;
    max-width: 700px;
}
.landing-hero h1 {
    font-size: clamp(54px, 12vw, 108px);
    letter-spacing: -0.07em;
    line-height: 0.82;
    margin: 12px 0 28px;
}
.landing-lead {
    font-size: clamp(22px, 4vw, 34px);
    line-height: 1.16;
    letter-spacing: -0.035em;
    max-width: 680px;
    margin: 0;
}
.code-entry-card { scroll-margin-top: 24px; }
.landing-section {
    padding: 72px 0 28px;
    scroll-margin-top: 24px;
}
.landing-section > h2,
.principle-card > h2 {
    font-size: clamp(34px, 6vw, 56px);
    line-height: 1;
    max-width: 680px;
}
.landing-section > p,
.principle-card > p {
    max-width: 680px;
    font-size: 18px;
    line-height: 1.55;
}
.landing-section a { color: var(--ink); font-weight: 700; }
.how-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 26px;
}
.how-card {
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 20px;
    background: var(--card);
}
.how-card h3 { font-size: 22px; margin: 18px 0 8px; }
.how-card p { margin: 0; color: var(--muted); }
.step-number {
    display: inline-block;
    font-size: 13px;
    font-weight: 800;
    color: var(--muted);
    letter-spacing: 0.08em;
}
.principle-card { margin-top: 62px; }
.principle-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 24px;
    border-top: 1px solid var(--line);
}
.principle-list div {
    padding: 15px 0;
    border-bottom: 1px solid var(--line);
    font-weight: 700;
}
.landing-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
    margin: 64px 0 10px;
    padding: 26px 0;
    border-top: 1px solid var(--line);
}
.landing-cta p { font-size: 20px; font-weight: 800; margin: 0; }

@media (min-width: 640px) {
    .how-grid { grid-template-columns: repeat(2, 1fr); }
}
.landing-intro {
    max-width: 660px;
    margin: 22px 0 0;
    font-size: 18px;
    line-height: 1.55;
    color: var(--muted);
}

.countdown-inline {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
}

.coffee-fact {
    margin: 16px 0;
    font-weight: 700;
}
.coffee-pass {
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 18px;
    margin: 18px 0 24px;
}
.coffee-pass > p { margin-top: 8px; }
.qr-wrap {
    width: min(230px, 78vw);
    margin: 18px 0 14px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 12px;
}
.qr-code svg { display: block; width: 100%; height: auto; }
.pass-link {
    color: var(--ink);
    font-weight: 800;
    word-break: break-word;
}

/* 0.4.6: fokussierte Weitergabeansicht */
.share-focus{max-width:760px}
.share-focus .short-link{display:block;margin:.25rem 0 1rem}
.share-focus .timer{margin:.2rem 0 1.25rem}
.share-focus-actions{margin-top:.25rem}
.share-focus-back{margin:1.5rem 0 0;font-size:.92rem}
.share-focus-back a{
    color:var(--ink);
    font:inherit;
    font-weight:700;
    text-decoration-thickness:1px;
    text-underline-offset:.14em;
}

/* 0.5.3: reichere, aber sachliche Landingpage */
.landing-mini-brand {
    font-weight: 900;
    letter-spacing: -0.04em;
    font-size: 18px;
}
.landing-hero-rich {
    min-height: 430px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-top: 100px;
    padding-bottom: 62px;
}
.landing-hero-rich h1 {
    font-size: clamp(72px, 15vw, 132px);
    line-height: .76;
    margin-top: 16px;
    margin-bottom: 34px;
}
.landing-hero-rich .landing-lead {
    font-size: clamp(30px, 5vw, 48px);
    font-weight: 800;
    max-width: 650px;
}
.landing-intro-strong {
    color: var(--ink);
    max-width: 600px;
    font-size: 19px;
    margin-top: 24px;
}
.landing-entry-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    margin: 18px 0 74px;
}
.landing-entry {
    border-radius: 22px;
    border: 1px solid var(--line);
    padding: 28px;
    min-height: 290px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.landing-entry h2 {
    font-size: clamp(38px, 6vw, 58px);
    line-height: .95;
    margin: 10px 0 16px;
}
.landing-entry p { max-width: 430px; }
.landing-entry-primary {
    background: var(--ink);
    color: white;
    border-color: var(--ink);
}
.landing-entry-primary .kicker { color: rgba(255,255,255,.58); }
.landing-entry-primary .button {
    background: white;
    color: var(--ink);
}
.landing-entry-code { background: var(--card); }
.start-availability {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 4px 14px;
    align-items: end;
    margin-top: 30px;
}
.start-availability > strong {
    grid-row: span 2;
    font-size: clamp(70px, 12vw, 108px);
    line-height: .72;
    letter-spacing: -.07em;
}
.start-availability > span {
    max-width: 180px;
    line-height: 1.2;
    font-size: 14px;
    color: rgba(255,255,255,.72);
}
.start-availability .landing-main-button {
    grid-column: 1 / -1;
    width: fit-content;
    margin-top: 24px;
}
.landing-code-form { margin-top: 22px; }
.landing-code-form label { margin-top: 0; }
.landing-code-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
}
.landing-code-row input {
    font-size: 20px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.landing-my-link {
    display: inline-block;
    margin-top: 14px;
    color: var(--ink);
    font-weight: 700;
}
.chain-stage {
    background: var(--ink);
    color: white;
    border-radius: 28px;
    padding: clamp(28px, 6vw, 58px);
    margin: 0 0 90px;
    overflow: hidden;
}
.chain-stage .chain-kicker { color: rgba(255,255,255,.56); }
.chain-stage h2 {
    font-size: clamp(38px, 7vw, 68px);
    line-height: .96;
    max-width: 680px;
    margin: 14px 0 20px;
}
.chain-stage > p {
    max-width: 580px;
    color: rgba(255,255,255,.72);
    font-size: 18px;
}
.chain-visual {
    display: flex;
    align-items: center;
    gap: 12px;
    overflow-x: auto;
    padding: 34px 0 4px;
    scrollbar-width: none;
}
.chain-visual::-webkit-scrollbar { display: none; }
.chain-node {
    min-width: 150px;
    height: 150px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.32);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 18px;
    flex: 0 0 auto;
}
.chain-node span {
    font-size: 24px;
    font-weight: 900;
    letter-spacing: -.04em;
}
.chain-node small {
    display: block;
    margin-top: 7px;
    color: rgba(255,255,255,.55);
    line-height: 1.2;
}
.chain-origin {
    background: white;
    color: var(--ink);
    border-color: white;
}
.chain-origin small { color: var(--muted); }
.chain-arrow {
    font-size: 30px;
    color: rgba(255,255,255,.45);
    flex: 0 0 auto;
}
.landing-story-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 36px;
    padding: 20px 0 80px;
}
.landing-story-main h2,
.landing-how-rich > h2 {
    font-size: clamp(40px, 7vw, 66px);
    line-height: .95;
    margin: 14px 0 28px;
}
.landing-story-main p {
    font-size: 19px;
    line-height: 1.55;
    max-width: 620px;
}
.landing-facts {
    border-top: 1px solid var(--line);
}
.landing-fact {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 2px 12px;
    padding: 20px 0;
    border-bottom: 1px solid var(--line);
}
.landing-fact > span {
    grid-row: span 2;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
}
.landing-fact > strong { font-size: 18px; }
.landing-fact > p { margin: 3px 0 0; color: var(--muted); }
.landing-how-rich { padding-top: 42px; }
.how-grid-rich .how-card {
    min-height: 200px;
    display: flex;
    flex-direction: column;
}
.how-grid-rich .how-card h3 {
    font-size: 25px;
    margin-top: auto;
}
.landing-end {
    margin-top: 70px;
    padding: 34px 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.landing-end h2 {
    margin: 7px 0 0;
    font-size: clamp(34px, 5vw, 52px);
}
.landing-contact { padding-top: 48px; padding-bottom: 0; }

@media (min-width: 760px) {
    .landing-entry-grid { grid-template-columns: 1.08fr .92fr; }
    .landing-story-grid { grid-template-columns: 1.15fr .85fr; gap: 64px; }
    .chain-node { min-width: 165px; height: 165px; }
}

/* 0.5.4: invitation gesture */
.chain-thought {
    font-size: clamp(19px, 2.1vw, 25px);
    line-height: 1.45;
    max-width: 760px;
}
.chain-thought strong {
    color: #fff;
    font-weight: 800;
}

/* 0.5.6: Geste -> Idee -> Funktion */
.landing-human-hero {
    background: var(--ink);
    color: #fff;
    border-radius: 30px;
    padding: clamp(34px, 7vw, 72px);
    margin: 22px 0 20px;
    min-height: 470px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.landing-human-hero .kicker { color: rgba(255,255,255,.58); }
.landing-human-hero h1 {
    font-size: clamp(58px, 10vw, 104px);
    line-height: .9;
    letter-spacing: -.065em;
    max-width: 900px;
    margin: 18px 0 30px;
}
.landing-human-lead {
    font-size: clamp(22px, 3.6vw, 34px);
    line-height: 1.25;
    max-width: 700px;
    color: rgba(255,255,255,.84);
    margin: 0;
}
.landing-human-action {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 34px;
}
.landing-human-action .button {
    background: #fff;
    color: var(--ink);
}
.landing-human-action > span,
.landing-human-closed {
    color: rgba(255,255,255,.62);
    font-size: 14px;
}
.landing-code-only {
    min-height: auto;
    margin: 0 0 88px;
    background: var(--card);
}
.landing-code-only h2 {
    font-size: clamp(34px, 5vw, 52px);
    margin-bottom: 8px;
}
.landing-idea {
    padding: clamp(34px, 6vw, 64px) 0 82px;
    border-top: 1px solid var(--line);
}
.landing-idea h2 {
    font-size: clamp(44px, 7vw, 74px);
    line-height: .95;
    letter-spacing: -.055em;
    max-width: 820px;
    margin: 16px 0 40px;
}
.landing-idea-copy {
    max-width: 720px;
    margin-left: auto;
}
.landing-idea-copy p {
    font-size: clamp(19px, 2.3vw, 25px);
    line-height: 1.45;
    margin: 0 0 24px;
}
.landing-idea-strong {
    font-weight: 800;
    color: var(--ink);
}
.landing-how-clean {
    border-top: 1px solid var(--line);
    padding-top: 56px;
}
@media (max-width: 680px) {
    .landing-human-hero { min-height: 420px; border-radius: 24px; }
    .landing-human-action { align-items: flex-start; flex-direction: column; }
    .landing-idea-copy { margin-left: 0; }
}

/* 0.5.12: clearer public explanation and Blooms link */
.landing-top-links {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.landing-human-lead strong {
    color: #fff;
    font-weight: 800;
}
.how-grid-rich .how-card {
    min-height: 0;
}
.how-grid-rich .how-card h3 {
    margin-top: 34px;
}
.how-grid-rich .how-card p {
    font-size: 17px;
    line-height: 1.5;
}
@media (max-width: 680px) {
    .landing-top { align-items: flex-start; }
    .landing-top-links { gap: 10px 14px; max-width: 72%; }
    .landing-jump { font-size: 13px; }
    .how-grid-rich .how-card { padding: 28px 24px; }
    .how-grid-rich .how-card h3 { margin-top: 28px; }
}

/* 0.5.13: receiver-first landing page */
.landing-receiver-hero {
    justify-content: center;
}
.landing-receiver-hero h1 {
    margin-bottom: 28px;
}
.landing-receiver-explain {
    max-width: 700px;
    margin: 32px 0 0;
    font-size: clamp(18px, 2.3vw, 24px);
    line-height: 1.45;
    color: rgba(255,255,255,.72);
}
.landing-receiver-explain strong {
    color: #fff;
}
.landing-code-receiver {
    min-height: 0;
    padding-top: 26px;
    padding-bottom: 26px;
}
.landing-code-receiver .landing-code-form {
    margin-top: 14px;
}
.landing-idea-human h2 {
    display: none;
}
.landing-idea-copy-full {
    max-width: 760px;
    margin: 24px 0 0;
}
.landing-idea-final {
    margin-top: 40px !important;
}
.landing-start-last {
    margin-top: 34px;
    padding: clamp(34px, 6vw, 64px);
    border-radius: 28px;
    background: var(--ink);
    color: #fff;
}
.landing-start-last .kicker {
    color: rgba(255,255,255,.58);
}
.landing-start-last h2 {
    max-width: 820px;
    margin: 14px 0 22px;
    font-size: clamp(46px, 8vw, 82px);
    line-height: .94;
    letter-spacing: -.055em;
}
.landing-start-last > p {
    max-width: 650px;
    color: rgba(255,255,255,.74);
    font-size: 19px;
    line-height: 1.5;
}
.landing-start-last-action {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 30px;
}
.landing-start-last-action .button {
    background: #fff;
    color: var(--ink);
}
.landing-start-last-action span,
.landing-start-last-closed {
    color: rgba(255,255,255,.62);
    font-size: 14px;
}
@media (min-width: 760px) {
    .landing-how-three .how-grid-rich {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 680px) {
    .landing-receiver-hero {
        min-height: 460px;
    }
    .landing-start-last {
        border-radius: 24px;
    }
    .landing-start-last-action {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* 0.5.14: receiver-first, fewer instructions, more human rhythm */
.landing-receiver-hero {
    min-height: 410px;
}
.landing-receiver-hero .landing-human-lead {
    max-width: 760px;
    color: #fff;
}
.landing-receiver-explain {
    margin-top: 22px;
}
.landing-code-intro p {
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 16px;
}
.landing-how-three .how-card {
    padding: 30px 26px;
}
.how-card-lead {
    display: block;
    margin: 0 0 10px;
    font-size: 19px;
    line-height: 1.3;
    letter-spacing: -.018em;
}
.landing-how-three .how-card p {
    max-width: 34ch;
}
.landing-idea-opening {
    font-size: clamp(28px, 4vw, 42px) !important;
    line-height: 1.12 !important;
    letter-spacing: -.04em;
    margin-bottom: 34px !important;
}
.landing-idea-final {
    font-size: clamp(24px, 3.3vw, 34px) !important;
    line-height: 1.2 !important;
    letter-spacing: -.03em;
}
@media (min-width: 760px) {
    .landing-how-three .how-grid-rich {
        gap: 18px;
    }
}

/* 0.5.15 share focus: menschlich statt technischer Linkkarte */
.share-focus h1 {
    font-size: clamp(34px, 6vw, 58px);
    line-height: 1.02;
    letter-spacing: -0.05em;
    max-width: 620px;
    margin: 12px 0 18px;
}
.share-focus-copy {
    max-width: 620px;
    font-size: 18px;
    line-height: 1.5;
    margin: 0 0 28px;
}
.share-focus .share-focus-timer {
    font-size: clamp(22px, 4vw, 32px);
    color: var(--muted);
    margin-bottom: 18px;
}


/* 0.5.17: emotional opener first, no accidental code-first mobile view */
.landing-receiver-hero {
    min-height: calc(100svh - 118px);
    min-height: calc(100dvh - 118px);
    margin-bottom: 34px;
}
.landing-code-receiver {
    scroll-margin-top: 24px;
}
@media (max-width: 680px) {
    .landing-receiver-hero {
        min-height: calc(100svh - 92px);
        min-height: calc(100dvh - 92px);
        padding-top: 42px;
        padding-bottom: 42px;
        margin-bottom: 30px;
    }
    .landing-receiver-hero h1 {
        font-size: clamp(54px, 15vw, 78px);
    }
}

/* 0.5.19: mobile brand truly centered */
@media (max-width: 680px) {
    .landing-top {
        position: relative;
        min-height: 24px;
        align-items: center;
        justify-content: flex-end;
    }
    .landing-mini-brand {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        margin: 0;
        text-align: center;
        white-space: nowrap;
    }
    .landing-top-links {
        max-width: none;
        margin-left: auto;
    }
    .landing-top-links a:first-child {
        display: none;
    }
}

/* 0.5.21: Bloom-Übergang nach Annahme eines Coffee+ */
.coffee-bloom-pending .accept-form-stage-bloom {
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px) scale(.992);
}
.accept-form-stage-bloom {
    transition: opacity .72s ease, transform .72s cubic-bezier(.2,.8,.2,1);
}
.accept-form-stage-bloom.accept-form-stage-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

/* 0.5.33: Bloom beim öffentlichen Start vor dem nächsten menschlichen Schritt. */
.coffee-bloom-pending .coffee-next-moment-bloom {
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px) scale(.992);
}
.coffee-next-moment-bloom {
    transition: opacity .72s ease, transform .72s cubic-bezier(.2,.8,.2,1);
}
.coffee-next-moment-bloom.accept-form-stage-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

.coffee-bloom-overlay {
    --bloom-x: 50vw;
    --bloom-y: 46vh;
    position: fixed;
    inset: 0;
    z-index: 9999;
    overflow: hidden;
    pointer-events: none;
    opacity: 0;
    background:
        radial-gradient(circle at var(--bloom-x) var(--bloom-y), rgba(255,253,248,.20) 0, rgba(244,241,234,.42) 32%, rgba(244,241,234,.72) 100%);
    transition: opacity .42s ease;
    isolation: isolate;
}
.coffee-bloom-overlay.is-active { opacity: 1; }
.coffee-bloom-overlay.is-leaving { opacity: 0; transition-duration: .92s; }

.coffee-bloom-glow {
    position: absolute;
    left: var(--bloom-x);
    top: var(--bloom-y);
    width: 22px;
    height: 22px;
    border-radius: 50%;
    transform: translate(-50%,-50%) scale(.2);
    background: rgba(255,255,255,.95);
    box-shadow:
        0 0 22px 14px rgba(255,255,255,.72),
        0 0 82px 48px rgba(255,218,231,.34),
        0 0 150px 88px rgba(255,244,226,.22);
    opacity: 0;
    animation: coffee-bloom-glow 2.65s cubic-bezier(.18,.72,.18,1) .08s both;
}

.coffee-bloom-seed {
    position: absolute;
    left: var(--bloom-x);
    top: var(--bloom-y);
    z-index: 3;
    font-size: clamp(24px, 5vw, 42px);
    line-height: 1;
    transform: translate(-50%,-50%) scale(.18) rotate(-12deg);
    transform-origin: 50% 50%;
    opacity: 0;
    filter: drop-shadow(0 8px 20px rgba(107,65,74,.18));
    animation: coffee-bloom-seed 2.15s cubic-bezier(.16,.88,.25,1) .08s both;
}

.coffee-bloom-particles {
    position: absolute;
    inset: 0;
    z-index: 2;
}
.coffee-bloom-flower {
    position: absolute;
    left: var(--bloom-x);
    top: var(--bloom-y);
    font-size: clamp(12px, 2.4vw, 22px);
    line-height: 1;
    opacity: 0;
    will-change: transform, opacity;
    transform: translate(-50%,-50%) translate3d(0,0,0) scale(.08) rotate(0deg);
    filter: drop-shadow(0 3px 8px rgba(85,50,59,.10));
    animation: coffee-bloom-flight var(--duration) cubic-bezier(.12,.72,.20,1) var(--delay) both;
}

@keyframes coffee-bloom-seed {
    0%   { opacity: 0; transform: translate(-50%,-50%) scale(.16) rotate(-14deg); }
    18%  { opacity: 1; transform: translate(-50%,-50%) scale(.72) rotate(-5deg); }
    42%  { opacity: 1; transform: translate(-50%,-50%) scale(1.22) rotate(4deg); }
    60%  { opacity: 1; transform: translate(-50%,-50%) scale(.98) rotate(0deg); }
    100% { opacity: 0; transform: translate(-50%,-50%) scale(1.75) rotate(10deg); }
}
@keyframes coffee-bloom-glow {
    0%   { opacity: 0; transform: translate(-50%,-50%) scale(.15); }
    34%  { opacity: .86; transform: translate(-50%,-50%) scale(2.4); }
    72%  { opacity: .46; transform: translate(-50%,-50%) scale(5.6); }
    100% { opacity: 0; transform: translate(-50%,-50%) scale(8.4); }
}
@keyframes coffee-bloom-flight {
    0% {
        opacity: 0;
        transform: translate(-50%,-50%) translate3d(0,0,0) scale(.06) rotate(0deg);
    }
    10% { opacity: .98; }
    30% { opacity: 1; }
    74% { opacity: .78; }
    100% {
        opacity: 0;
        transform: translate(-50%,-50%) translate3d(var(--tx),var(--ty),0) scale(var(--scale)) rotate(var(--rotation));
    }
}

.coffee-bloom-overlay.is-reduced .coffee-bloom-glow {
    animation-duration: .95s;
}
.coffee-bloom-overlay.is-reduced .coffee-bloom-seed {
    animation-duration: .9s;
}

@media (max-width: 680px) {
    .coffee-bloom-overlay { --bloom-y: 43vh; }
    .coffee-bloom-flower { font-size: clamp(11px, 4vw, 19px); }
}

@media (prefers-reduced-motion: reduce) {
    .accept-form-stage-bloom, .coffee-next-moment-bloom { transition-duration: .18s; }
    .coffee-bloom-particles { display: none; }
}


/* 0.5.25 Pilot Edition: ruhiger Coffee+-Flow und Pilot-Dashboard */
.pilot-stat-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:24px 0 18px;
}
.pilot-stat {
    border:1px solid var(--line);
    border-radius:14px;
    padding:14px 16px;
    background:rgba(255,255,255,.42);
}
.pilot-stat span,
.pilot-insights span,
.pilot-funnel span {
    display:block;
    color:var(--muted);
    font-size:.82rem;
    line-height:1.25;
}
.pilot-stat strong {
    display:block;
    margin-top:6px;
    font-size:clamp(28px,5vw,42px);
    letter-spacing:-.04em;
}
.pilot-insights {
    display:grid;
    grid-template-columns:1fr;
    gap:0;
    margin:18px 0 8px;
    border-top:1px solid var(--line);
}
.pilot-insights > div,
.pilot-funnel > div,
.lineage-row,
.event-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:13px 0;
    border-bottom:1px solid var(--line);
}
.pilot-insights strong,
.pilot-funnel strong { white-space:nowrap; }
.pilot-funnel { margin-top:18px; }
.lineage-list,.event-list { margin-top:12px; }
.lineage-row span { min-width:0; overflow-wrap:anywhere; }
.lineage-row strong { white-space:nowrap; font-size:.8rem; color:var(--muted); }
.event-row time { white-space:nowrap; color:var(--muted); font-size:.82rem; }
.event-row small { color:var(--muted); }
.pilot-dashboard code { font-size:.9em; }

@media (min-width:760px){
    .pilot-stat-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
    .pilot-insights { grid-template-columns:repeat(5,minmax(0,1fr)); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
    .pilot-insights > div { display:block; padding:14px 16px; border-bottom:0; border-right:1px solid var(--line); }
    .pilot-insights > div:last-child { border-right:0; }
    .pilot-insights strong { display:block; margin-top:7px; font-size:1.15rem; }
}

/* 0.5.26 Clean Pilot */
.landing-start-after-code { margin-top:18px; }
.pilot-run-label { margin-top:-4px; color:var(--muted); }
.pilot-funnel-group { margin-top:22px; }
.pilot-funnel-group h3 { margin:0 0 4px; font-size:1rem; }
.lineage-row-rich { align-items:flex-start; }
.lineage-row-rich > span:first-child { display:flex; flex-direction:column; gap:5px; }
.lineage-row-rich small { color:var(--muted); font-size:.8rem; }
.lineage-status { display:flex; flex-direction:column; align-items:flex-end; gap:4px; white-space:nowrap; font-weight:700; }
.feedback-options { display:grid; gap:10px; margin:14px 0 18px; }
.feedback-options label { display:flex; gap:10px; align-items:flex-start; font-weight:500; }
.feedback-options input[type="radio"] { width:auto; margin-top:3px; }
.pilot-feedback-inline { margin:24px 0 8px; padding:20px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.34); }
.pilot-feedback-inline h2,.pilot-feedback-card h2 { margin-top:6px; }
.feedback-admin-list > div { display:flex; flex-direction:column; gap:4px; padding:13px 0; border-bottom:1px solid var(--line); }
.feedback-admin-list small { color:var(--muted); }
.admin-details { padding:0; overflow:hidden; }
.admin-details summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:16px; align-items:center; padding:20px 24px; font-weight:750; }
.admin-details summary::-webkit-details-marker { display:none; }
.admin-details summary span { color:var(--muted); font-size:.82rem; font-weight:600; }
.admin-details[open] summary { border-bottom:1px solid var(--line); }
.details-body { padding:18px 24px 24px; }
.pilot-code-grid { display:grid; gap:10px; margin:18px 0; }
.pilot-code { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:13px 15px; border:1px solid var(--line); border-radius:14px; }
.pilot-code strong { font-size:1.15rem; letter-spacing:.06em; }
.pilot-code button { width:auto; margin:0; }
.danger-zone-card { border-color:rgba(125,36,36,.25); }
.pilot-reset-link { margin-top:28px; }
@media (max-width:680px){
    .admin-details summary { padding:17px 18px; }
    .details-body { padding:16px 18px 20px; }
    .lineage-row-rich { flex-direction:column; gap:8px; }
    .lineage-status { align-items:flex-start; }
    .pilot-code { align-items:flex-start; flex-direction:column; }
}
.pilot-code > span { display:flex; flex-direction:column; gap:4px; }
.pilot-code small { color:var(--muted); overflow-wrap:anywhere; }

/* 0.5.28 – emotional continuation after acceptance */
.coffee-next-moment {
    margin: 30px 0 10px;
    padding: 30px 28px;
    border-radius: 26px;
    background: #6D28D9;
    color: #fff;
}
.coffee-next-moment .kicker { color: rgba(255,255,255,.58); }
.coffee-next-moment h2 {
    margin: 10px 0 14px;
    font-size: clamp(30px, 5vw, 48px);
    line-height: 1.02;
    letter-spacing: -0.035em;
}
.coffee-next-moment p {
    max-width: 680px;
    color: rgba(255,255,255,.78);
}
.coffee-next-moment .coffee-next-question {
    margin-top: 18px;
    color: #fff;
    font-weight: 700;
}
.coffee-next-moment .actions,
.coffee-next-moment .coffee-next-form { margin-top: 22px; }
.coffee-next-moment .button,
.coffee-next-moment button {
    background: #fff;
    color: #111;
    border-color: #fff;
}
.coffee-next-moment .button:hover,
.coffee-next-moment button:hover { opacity: .9; }
.coffee-cancel { margin-top: 28px; }
.coffee-cancel form { display: inline; }
.coffee-cancel button {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--muted);
    padding: 0;
    font: inherit;
    font-size: .92rem;
    text-decoration: underline;
    cursor: pointer;
}
.coffee-invitation-place:empty { display:none; }
@media (max-width: 640px) {
    .coffee-next-moment { padding: 26px 22px; border-radius: 22px; }
    .coffee-next-moment .button,
    .coffee-next-moment button { width: 100%; text-align: center; }
}


/* 0.5.30 – two distinct Coffee+ entry paths */
.coffee-invitation-explain {
    margin: 24px 0 6px;
    padding: 22px 0 4px;
    border-top: 1px solid var(--line);
}
.coffee-invitation-explain .kicker { margin-bottom: 10px; }
.coffee-invitation-explain p { max-width: 680px; }
.coffee-invitation-explain p + p { margin-top: 10px; color: var(--muted); }

/* 0.5.35 – klare Coffee+-Leistung vor Annahme/Start */
.coffee-benefit-choice {
    margin: 24px 0 8px;
    padding: 20px 0 4px;
    border-top: 1px solid var(--line);
}
.coffee-benefit-choice .kicker { margin-bottom: 10px; }
.coffee-benefit-choice p { max-width: 680px; margin: 0; }



/* 0.5.37 – direkte Weitergabe und Mitarbeiter-Scanner */
.coffee-direct-share-actions { align-items:center; }
.coffee-next-moment .coffee-dark-secondary { background:transparent; color:#fff; border-color:rgba(255,255,255,.55); }
.scanner-head { padding-bottom:22px; }
.scanner-camera { overflow:hidden; }
.scanner-video-wrap { position:relative; width:100%; aspect-ratio:4/3; max-height:560px; border-radius:20px; overflow:hidden; background:#111; }
.scanner-video-wrap video { width:100%; height:100%; object-fit:cover; display:block; }
.scanner-frame { position:absolute; left:50%; top:50%; width:min(62vw,300px); aspect-ratio:1; transform:translate(-50%,-50%); border:3px solid rgba(255,255,255,.92); border-radius:24px; box-shadow:0 0 0 999px rgba(0,0,0,.28); }
.scanner-status { font-weight:700; margin-top:16px; }
.scanner-result h2 { font-size:clamp(28px,5vw,46px); margin-bottom:10px; }
.scanner-state { display:inline-block; padding:9px 13px; border-radius:999px; font-weight:800; }
.scanner-state.good { background:#e9f5ec; color:#215d32; }
.scanner-state.bad { background:#f7e8e6; color:#812d24; }
.scanner-result-ok { border:2px solid #8bb596; }
.scanner-result-error { border:2px solid #c28a83; }
.scanner-manual { margin-top:22px; border-top:1px solid var(--line); padding-top:18px; }
.scanner-manual summary { cursor:pointer; font-weight:700; }
.scanner-campaign-list { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
@media (max-width:640px){
    .scanner-video-wrap { aspect-ratio:3/4; }
    .scanner-frame { width:min(72vw,290px); }
    .scanner-camera .actions button,.scanner-result .actions .button { width:100%; text-align:center; }
    .coffee-direct-share-actions button { width:100%; }
}


/* 0.5.38 – Weitergabe direkt auf dem Pass + kräftiges Lila als Aktionsfläche */
.coffee-pass-next { margin-top: 24px; }
.coffee-pass-share-form { margin: 0; }
.coffee-pass-share-form button { margin: 0; }
@media (max-width: 640px) {
    .coffee-pass-share-form { width: 100%; }
    .coffee-pass-share-form button { width: 100%; }
}
