@font-face {
  font-family: 'Cormorant Garamond';
  src: url('/assets/fonts/cormorant-garamond-latin-400-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Cormorant Garamond';
  src: url('/assets/fonts/cormorant-garamond-latin-500-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'Cormorant Garamond';
  src: url('/assets/fonts/cormorant-garamond-latin-600-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Allura';
  src: url('/assets/fonts/allura-latin-400-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-latin-700-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --paper: #f9f6ef;
  --paper-deep: #eee6db;
  --ink: #5e4636;
  --ink-soft: #806b5b;
  --gold: #d99b28;
  --gold-soft: #f2c76a;
  --taupe: #b7a89c;
  --sage: #878f7a;
  --white: #fffdfa;
  --danger: #9e4e45;
  --success: #55745d;
  --status-todo: #e1d9d2;
  --status-working: #ff9900;
  --status-discuss: #db100d;
  --status-done: #18a81a;
  --shadow: 0 18px 55px rgba(77, 57, 42, .12);
  --radius: 26px;
  --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --script: 'Allura', 'Segoe Script', 'Snell Roundhand', 'Brush Script MT', cursive;
  --sans: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(ellipse at 0 20%, rgba(183, 168, 156, .26), transparent 32%),
    radial-gradient(ellipse at 100% 70%, rgba(215, 195, 172, .25), transparent 34%),
    var(--paper);
  font-family: var(--sans);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
body::before, body::after {
  content: '';
  position: fixed;
  z-index: -1;
  width: 28vw;
  min-width: 260px;
  height: 75vh;
  opacity: .45;
  filter: blur(1px);
  pointer-events: none;
}
body::before {
  left: -12vw;
  top: 8vh;
  background: radial-gradient(ellipse, rgba(152, 137, 127, .72), rgba(193, 182, 169, .26) 58%, transparent 72%);
  border-radius: 42% 58% 66% 34% / 38% 44% 56% 62%;
}
body::after {
  right: -14vw;
  bottom: -5vh;
  background: radial-gradient(ellipse, rgba(210, 197, 181, .8), rgba(177, 159, 143, .15) 62%, transparent 75%);
  border-radius: 68% 32% 36% 64% / 41% 59% 41% 59%;
}

a { color: inherit; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { max-width: 100%; height: auto; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.12; }
h1 { font-size: clamp(2.7rem, 7vw, 5.8rem); margin: 0 0 1rem; }
h2 { font-size: clamp(1.45rem, 3vw, 2rem); }

.sr-only, .skip-link:not(:focus) {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}
.skip-link:focus { position: fixed; z-index: 100; top: 1rem; left: 1rem; background: white; padding: .7rem 1rem; }

.site-header {
  position: sticky;
  z-index: 30;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  min-height: 74px;
  padding: .7rem clamp(1rem, 4vw, 4rem);
  border-bottom: 1px solid rgba(94, 70, 54, .1);
  background: rgba(249, 246, 239, .9);
  backdrop-filter: blur(16px);
}
.wordmark { display: flex; align-items: center; gap: .28rem; text-decoration: none; font: 1.42rem var(--serif); letter-spacing: .08em; }
.wordmark i { color: var(--gold); font: 2rem var(--script); }
.site-nav { display: flex; align-items: center; gap: clamp(.6rem, 1.6vw, 1.5rem); font-size: .88rem; }
.site-nav > a, .link-button { border: 0; padding: .3rem 0; color: var(--ink); background: transparent; text-decoration: none; cursor: pointer; }
.site-nav > a:hover, .site-nav > a:focus-visible, .link-button:hover { color: var(--gold); }
.logout-form { display: inline; }
.nav-toggle { display: none; width: 44px; height: 44px; border: 0; background: transparent; }
.nav-toggle span:not(.sr-only) { display: block; width: 24px; height: 2px; margin: 5px auto; background: var(--ink); }

.site-main { width: min(1180px, calc(100% - 2rem)); min-height: calc(100vh - 160px); margin: 0 auto; padding: clamp(2.2rem, 6vw, 6.5rem) 0; }
.public-main { width: 100%; min-height: 100svh; padding: 0; }

/* Der Brautpaar-Bereich hat zu viele Menuepunkte fuer eine Kopfzeile. */
.admin-sidebar {
  position: fixed;
  z-index: 40;
  top: 0;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  width: 244px;
  padding: 1.4rem 1rem 1rem;
  border-right: 1px solid rgba(94, 70, 54, .12);
  background: rgba(249, 246, 239, .96);
  backdrop-filter: blur(16px);
}
.sidebar-brand { flex: 0 0 auto; justify-content: center; padding-bottom: 1.1rem; border-bottom: 1px solid rgba(94, 70, 54, .12); }
.sidebar-scroll { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: .6rem .15rem; }
.sidebar-heading { margin: 1rem 0 .35rem; padding: 0 .6rem; color: var(--ink-soft); font-size: .64rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.sidebar-heading:first-child { margin-top: 0; }
.admin-sidebar a { display: block; padding: .5rem .6rem; border-radius: 10px; color: var(--ink); font-size: .9rem; text-decoration: none; }
.admin-sidebar a:hover, .admin-sidebar a:focus-visible { color: var(--gold); background: rgba(255, 253, 250, .9); }
.admin-sidebar a.is-current { color: var(--gold); background: var(--white); font-weight: 650; box-shadow: 0 4px 14px rgba(77, 57, 42, .07); }
.sidebar-logout { flex: 0 0 auto; padding: .8rem .6rem 0; border-top: 1px solid rgba(94, 70, 54, .12); }
.admin-bar { display: none; }
.sidebar-scrim { position: fixed; inset: 0; z-index: 35; background: rgba(52, 38, 28, .38); }
.has-sidebar .site-main { width: min(1180px, calc(100% - 244px - 3rem)); margin-right: auto; margin-left: calc(244px + 1.5rem); }
.has-sidebar .site-footer { margin-left: 244px; }
.site-footer { display: flex; justify-content: center; align-items: center; gap: .5rem; padding: 2.5rem 1rem; color: var(--ink-soft); font: 1.05rem var(--serif); }
.site-footer i { color: var(--gold); font: 1.5rem var(--script); }
.site-footer small { margin-left: 1rem; font: .72rem var(--sans); letter-spacing: .14em; text-transform: uppercase; }

.landing, .admin-login {
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  min-height: 100svh;
  padding: 3rem 1rem;
  overflow: hidden;
}
.watercolor-frame::before, .watercolor-frame::after {
  content: '';
  position: absolute;
  z-index: 0;
  top: 0;
  width: min(38vw, 550px);
  height: 100%;
  opacity: .78;
  filter: blur(.4px);
  pointer-events: none;
}
.watercolor-frame::before { left: 0; background: url('/assets/watercolor-left.svg') left center/100% 100% no-repeat; }
.watercolor-frame::after { right: 0; background: url('/assets/watercolor-right.svg') right center/100% 100% no-repeat; }
.landing-inner { position: relative; z-index: 1; width: min(720px, 100%); text-align: center; }
.eyebrow { margin: 0 0 .7rem; color: var(--ink-soft); font-size: .72rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; }
.landing h1 { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: .35em; margin: .2rem 0; font-size: clamp(2.4rem, 7vw, 5.2rem); letter-spacing: .02em; text-transform: uppercase; }
.landing h1 b { color: var(--gold); font: 1.15em var(--script); text-transform: none; }
.wedding-date { margin: 1.8rem 0 2.4rem; font: 1.25rem var(--serif); letter-spacing: .14em; text-transform: uppercase; }
.countdown { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(.45rem, 2vw, 1.3rem); margin: 0 auto 2.3rem; }
.countdown div { padding: 1rem .5rem; border: 1px solid rgba(94, 70, 54, .14); border-radius: 18px; background: rgba(255, 253, 250, .68); box-shadow: 0 8px 30px rgba(77, 57, 42, .06); }
.countdown strong { display: block; font: clamp(1.65rem, 4vw, 2.6rem) var(--serif); }
.countdown span { color: var(--ink-soft); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
.login-card { position: relative; z-index: 1; width: min(600px, 100%); margin: 0 auto; padding: clamp(1.3rem, 3vw, 2rem); border: 1px solid rgba(94, 70, 54, .12); border-radius: var(--radius); background: rgba(255, 253, 250, .88); box-shadow: var(--shadow); text-align: left; }
.login-card > label { display: block; margin-bottom: .7rem; font-family: var(--serif); font-size: 1.12rem; }
.input-action { display: flex; gap: .7rem; }
.input-action input { flex: 1; min-width: 0; }
.form-hint, .optional, .character-count { color: var(--ink-soft); font-size: .78rem; }
.couple-link { display: inline-block; margin-top: 1.3rem; color: var(--ink-soft); font-size: .78rem; }

input[type='text'], input[type='password'], input[type='number'], input[type='url'],
input[type='datetime-local'], select, textarea, input[type='file'] {
  width: 100%;
  border: 1px solid rgba(94, 70, 54, .28);
  border-radius: 12px;
  padding: .88rem 1rem;
  color: var(--ink);
  background: var(--white);
  outline: none;
  font: inherit;
}
textarea { resize: vertical; }
select:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(217, 155, 40, .18); }
input:focus, textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(217, 155, 40, .18); }
.button { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 999px; padding: .72rem 1.25rem; font-weight: 700; text-align: center; text-decoration: none; cursor: pointer; transition: transform .2s, box-shadow .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: #fff; background: var(--ink); box-shadow: 0 9px 24px rgba(94, 70, 54, .2); }
.button-primary:hover { background: #473326; }
.button-secondary { border-color: rgba(94, 70, 54, .3); color: var(--ink); background: transparent; }

.page-hero, .page-heading { max-width: 850px; margin: 0 auto clamp(2.4rem, 6vw, 5rem); text-align: center; }
.page-hero h1 .script-accent { color: var(--gold); font-family: var(--script); font-size: 1em; font-weight: 400; }
.page-hero > p:last-child, .page-heading > p:last-child { color: var(--ink-soft); font-family: var(--serif); font-size: 1.15rem; }
.deadline-badge { display: inline-flex; align-items: center; gap: .8rem; margin: .5rem 0 1rem; padding: .72rem 1.15rem; border: 1px solid rgba(217, 155, 40, .42); border-radius: 999px; color: var(--ink) !important; background: rgba(242, 199, 106, .18); font-family: var(--sans) !important; font-size: .9rem !important; box-shadow: 0 8px 24px rgba(94, 70, 54, .07); }
.deadline-badge span { color: var(--ink-soft); font-size: .7rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.deadline-badge strong { font-family: var(--serif); font-size: 1.18rem; font-weight: 600; }
.card-grid, .admin-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.feature-card, .action-card, .empty-card {
  position: relative;
  min-height: 220px;
  padding: 1.7rem;
  border: 1px solid rgba(94, 70, 54, .1);
  border-radius: var(--radius);
  background: rgba(255, 253, 250, .76);
  box-shadow: 0 12px 40px rgba(77, 57, 42, .07);
  text-decoration: none;
  transition: transform .25s, box-shadow .25s;
}
.feature-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.feature-card h2, .action-card h2 { margin: .8rem 0 .5rem; }
.feature-card p, .action-card p { color: var(--ink-soft); }
.card-icon { color: var(--gold); font: 2.2rem var(--serif); }

.timeline { max-width: 800px; margin: auto; }
.timeline-item { display: grid; grid-template-columns: 100px 1fr; gap: 1.4rem; position: relative; padding: 0 0 3rem; }
.timeline-item::before { content: ''; position: absolute; left: 48px; top: 50px; bottom: 0; width: 1px; background: rgba(94, 70, 54, .2); }
.timeline-item:last-child::before { display: none; }
.timeline-item time { display: grid; place-items: center; width: 96px; height: 96px; border-radius: 50%; color: #fff; background: var(--ink); font: 1.25rem var(--serif); box-shadow: 0 8px 25px rgba(94, 70, 54, .2); z-index: 1; }
.timeline-item h2 { margin: .3rem 0 .4rem; }
.timeline-item p { color: var(--ink-soft); }
.text-link { color: var(--gold); font-weight: 700; text-underline-offset: .25em; }
.notice-card, .watercolor-card, .locked-card, .menu-card, .status-page, .bank-card {
  position: relative;
  max-width: 850px;
  margin: 3rem auto 0;
  padding: clamp(1.7rem, 5vw, 3.5rem);
  overflow: hidden;
  border: 1px solid rgba(94, 70, 54, .11);
  border-radius: var(--radius);
  background: rgba(255, 253, 250, .88);
  box-shadow: var(--shadow);
}
.notice-card { text-align: center; }
.watercolor-card::after { content: ''; position: absolute; z-index: 0; right: -15%; bottom: -50%; width: 55%; height: 120%; border-radius: 50%; background: rgba(213, 198, 180, .25); filter: blur(16px); pointer-events: none; }
.watercolor-card > * { position: relative; z-index: 1; }

.stack-form { max-width: 860px; margin: 0 auto; }
.person-card { margin: 0 0 1.2rem; padding: clamp(1.2rem, 3vw, 2rem); border: 1px solid rgba(94, 70, 54, .13); border-radius: var(--radius); background: rgba(255, 253, 250, .78); box-shadow: 0 8px 30px rgba(77, 57, 42, .05); }
.person-card legend { padding: 0 .55rem; font: 1.55rem var(--serif); }
.choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.choice { display: flex; align-items: center; gap: .7rem; min-height: 56px; padding: .7rem 1rem; border: 1px solid rgba(94, 70, 54, .18); border-radius: 14px; background: var(--white); cursor: pointer; }
.choice:has(input:checked) { border-color: var(--gold); background: rgba(242, 199, 106, .15); }
.choice input { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; accent-color: var(--gold); cursor: pointer; }
.attendance-details .choice { font-weight: 400; }
.attendance-details .choice span { font-weight: 400; }
.attendance-details { margin-top: 1.3rem; padding-top: 1.3rem; border-top: 1px solid rgba(94, 70, 54, .12); }
.accommodation-card { margin-top: 2rem; }
.accommodation-card > p { color: var(--ink-soft); }
.accommodation-deadline { font-size: .88rem; }
.accommodation-editor { margin-top: 1.3rem; padding-top: 1.3rem; border-top: 1px solid rgba(94, 70, 54, .12); }
.accommodation-room { margin-bottom: 1rem; padding: 1rem; border: 1px solid rgba(94, 70, 54, .14); border-radius: 12px; background: var(--white); }
.accommodation-room-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.accommodation-room-heading h3 { margin: 0; font-size: 1.15rem; }
.accommodation-people { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem .8rem; margin-top: 1rem; }
.accommodation-people .field-label { grid-column: 1 / -1; }
.accommodation-card.is-locked { background: rgba(255, 253, 250, .52); }
.accommodation-card :disabled { cursor: not-allowed; opacity: .62; }
.attendance-details label:not(.choice), .stack-form > label, .inline-admin-form label { display: block; margin: 1rem 0; font-weight: 650; }
.field-label { margin-bottom: .25rem; font-weight: 650; }
.submit-panel { padding: 1.8rem; border-radius: var(--radius); background: rgba(217, 155, 40, .12); }
.submit-panel .button { width: 100%; margin-top: 1rem; }
.confirm-check { display: flex; gap: .7rem; align-items: flex-start; }
.confirm-check input { width: 20px; height: 20px; margin-top: .2rem; accent-color: var(--gold); }
.status-page, .locked-card { text-align: center; }
.status-mark, .lock-icon { display: block; color: var(--gold); font: 4rem var(--script); }

.wishlist-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.wish-card { display: flex; flex-direction: column; align-items: stretch; gap: 1.2rem; padding: 1.5rem; border: 1px solid rgba(94, 70, 54, .12); border-radius: var(--radius); background: rgba(255, 253, 250, .8); }
.wish-card.is-reserved { opacity: .72; }
.wish-card > div, .wish-action { width: 100%; }
.wish-card > div { flex: 1; }
.wish-action { margin-top: auto; }
.wish-action .button { width: 100%; }
.wish-card h2 { margin-top: 0; }
.reservation-label { color: var(--success); font-weight: 750; }
.reservation-capacity { color: var(--ink-soft); font-size: .82rem; }
.bank-card { display: grid; grid-template-columns: 1.5fr .7fr; gap: 2rem; align-items: center; max-width: 100%; }
.bank-details > div { display: grid; grid-template-columns: 130px 1fr; gap: 1rem; padding: .65rem 0; border-bottom: 1px solid rgba(94, 70, 54, .1); }
.bank-details dt { color: var(--ink-soft); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.bank-details dd { margin: 0; }
.copy-value { display: flex; align-items: center; gap: .7rem; border: 0; padding: 0; color: var(--ink); background: transparent; font-weight: 750; cursor: pointer; }
.copy-value span { color: var(--gold); font-size: .72rem; }
.qr-wrap { text-align: center; }
.qr-wrap img { padding: .7rem; border-radius: 16px; background: #fff; }
.qr-wrap small { display: block; color: var(--ink-soft); }

.wall-form { max-width: 760px; }
.wall-form label { display: block; margin-bottom: .6rem; font: 1.35rem var(--serif); }
.character-count { text-align: right; }
.wall-form .button { margin-top: 1rem; }
.photo-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.action-card { text-align: center; }
.menu-card { text-align: center; }
.menu-text { margin-bottom: 2rem; font: 1.25rem/1.9 var(--serif); }

.impersonation-bar { position: relative; z-index: 25; display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; justify-content: center; padding: .7rem 1.2rem; border-bottom: 1px solid rgba(94, 70, 54, .12); background: var(--paper-deep); font-size: .85rem; }
.impersonation-bar .button { min-height: 34px; padding: .35rem .9rem; font-size: .8rem; }

.flash { position: relative; z-index: 20; max-width: 850px; margin: 0 auto 1.2rem; padding: 1rem 1.2rem; border-radius: 14px; text-align: center; }
.flash-error { color: #723a34; background: #f4dfdb; }
.flash-success { color: #365640; background: #dcebdd; }
.stats-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: .8rem; margin-bottom: 2rem; }
.stats-grid article { padding: 1.2rem .8rem; border-radius: 18px; background: rgba(255, 253, 250, .82); text-align: center; box-shadow: 0 8px 24px rgba(77, 57, 42, .06); }
.stats-grid strong { display: block; font: 2.3rem var(--serif); }
.stats-grid span { color: var(--ink-soft); font-size: .7rem; text-transform: uppercase; }
.dashboard-room-types { margin-bottom: 2rem; }
.table-wrap { overflow-x: auto; border: 1px solid rgba(94, 70, 54, .12); border-radius: 18px; background: var(--white); }
table { width: 100%; border-collapse: collapse; font-size: .87rem; }
th, td { padding: .85rem; border-bottom: 1px solid rgba(94, 70, 54, .1); text-align: left; vertical-align: top; }
th { background: var(--paper-deep); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.inline-admin-form, .admin-list article { padding: 1.5rem; border: 1px solid rgba(94, 70, 54, .12); border-radius: var(--radius); background: rgba(255, 253, 250, .85); }
.admin-list { display: grid; gap: 1rem; margin-top: 1.2rem; }
.admin-list article { display: flex; flex-direction: column; align-items: stretch; gap: 1rem; }
.admin-wish-content { width: 100%; min-width: 0; }
.admin-wish-actions { display: grid; gap: .8rem; width: 100%; }
.admin-wish-actions label { display: block; margin-bottom: .55rem; font-weight: 650; }
.admin-wish-actions .button { width: 100%; }
/* Verwaltungsformulare: kompakter als die Gästeseiten. */
.settings-form, .stacked-form { display: grid; gap: 1rem; }
.settings-group { padding: 1.15rem 1.25rem 1.35rem; border: 1px solid rgba(94, 70, 54, .12); border-radius: var(--radius); background: rgba(255, 253, 250, .85); }
.settings-group legend { padding: 0 .5rem; color: var(--ink-soft); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.group-hint { margin: 0 0 .9rem; color: var(--ink-soft); font-size: .8rem; }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.field { display: flex; flex-direction: column; gap: .1rem; margin: 0; }
.field-wide { grid-column: 1 / -1; }
.field-label { font-size: .78rem; font-weight: 750; letter-spacing: .02em; }
.field-hint { color: var(--ink-soft); font-size: .75rem; font-weight: 400; line-height: 1.45; }
.settings-form input, .settings-form select, .settings-form textarea,
.stacked-form input, .stacked-form select, .stacked-form textarea { padding: .55rem .7rem; border-radius: 10px; font-size: .92rem; }
.settings-form input[type='file'], .stacked-form input[type='file'] { padding: .45rem .55rem; font-size: .85rem; }
.form-actions { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; }
.form-actions .button { min-height: 40px; padding: .55rem 1.15rem; }

.budget-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.budget-summary article { padding: 1.1rem 1.25rem; border: 1px solid rgba(94, 70, 54, .12); border-radius: var(--radius); background: rgba(255, 253, 250, .85); }
.budget-summary span { display: block; margin-bottom: .2rem; color: var(--ink-soft); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.budget-summary strong { font: 1.8rem var(--serif); }
.budget-list { display: grid; gap: .7rem; }
.budget-item { padding: .9rem 1rem; border: 1px solid rgba(94, 70, 54, .12); border-radius: 12px; background: rgba(255, 253, 250, .72); }
.budget-item-grid { display: grid; grid-template-columns: minmax(170px, 1.05fr) minmax(115px, .55fr) minmax(115px, .55fr) minmax(115px, .55fr) minmax(190px, 1.15fr) 32px; gap: .7rem; align-items: end; }
.budget-item textarea { min-height: 41px; resize: vertical; }
.budget-sort { margin-bottom: .45rem; }
.budget-sort .sort-grip { touch-action: none; }
.budget-item.is-dragging { opacity: .55; border-style: dashed; }
.budget-sort .save-state { margin-right: auto; text-align: left; }
.currency-input { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: stretch; }
.currency-input > span { display: flex; align-items: center; padding: 0 .55rem; border: 1px solid rgba(94, 70, 54, .22); border-right: 0; border-radius: 10px 0 0 10px; color: var(--ink-soft); background: var(--paper-deep); font-size: .72rem; font-weight: 800; }
.currency-input input { min-width: 0; border-radius: 0 10px 10px 0; }
.budget-delete { margin-bottom: .28rem; }

.repeatable-row { position: relative; margin-bottom: .7rem; padding: .9rem 1rem; border: 1px solid rgba(94, 70, 54, .12); border-radius: 12px; background: rgba(255, 253, 250, .6); }
.repeatable-row > .link-button { margin-top: .6rem; }
.repeatable-row.is-dragging { opacity: .45; border-style: dashed; }
.row-sort { display: flex; gap: .3rem; align-items: center; margin-bottom: .6rem; }
.row-sort .icon-button { width: 26px; height: 26px; font-size: .8rem; }
.sort-grip { padding: .1rem .35rem; margin: 0 0 0 -0.35rem; color: var(--ink-soft); font-size: 1.1rem; line-height: 1; cursor: grab; user-select: none; }
.sort-grip:active { cursor: grabbing; }
.person-rows { display: grid; gap: .5rem; }
.person-row { display: flex; gap: .5rem; align-items: center; }
.person-row input[type='text'] { flex: 1; min-width: 0; }
.role-toggle { display: flex; flex: 0 0 auto; gap: .35rem; align-items: center; color: var(--ink-soft); font-size: .8rem; white-space: nowrap; cursor: pointer; }
.role-toggle input { flex: 0 0 auto; width: 16px; height: 16px; margin: 0; accent-color: var(--gold); }
.delete-action { margin-left: auto; }
.icon-button { flex: 0 0 auto; width: 32px; height: 32px; border: 1px solid rgba(94, 70, 54, .2); border-radius: 50%; color: var(--ink-soft); background: transparent; font-size: 1.05rem; line-height: 1; cursor: pointer; }
.icon-button:hover { color: var(--danger); border-color: var(--danger); }
.link-button.danger { color: var(--danger); }
.empty-hint { color: var(--ink-soft); font-size: .85rem; }
.qr-status { margin: .8rem 0 .3rem; color: var(--success); font-size: .82rem; font-weight: 700; }
.qr-preview { margin-bottom: .9rem; }
.qr-preview img { padding: .6rem; border: 1px solid rgba(94, 70, 54, .12); border-radius: 12px; background: #fff; }
.action-card.is-muted { opacity: .6; }
.checkbox-row { display: flex; gap: .6rem; align-items: center; margin-top: .3rem; font-size: .85rem; font-weight: 400; }
.checkbox-row input { flex: 0 0 auto; width: 17px; height: 17px; accent-color: var(--gold); }
.accommodation-settings { margin-bottom: 1rem; }
.accommodation-settings > .checkbox-row { align-self: end; min-height: 41px; }
.accommodation-room-types { margin-top: .8rem; }
.accommodation-room-type-fields { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(100px, .35fr) auto auto; gap: .8rem; align-items: end; }
.accommodation-room-type-fields .checkbox-row { min-height: 41px; margin: 0; }
.accommodation-room-type-fields .link-button { min-height: 41px; }
.login-hint { color: var(--ink-soft); font-size: .82rem; }
.notice-inline { padding: .7rem .95rem; border-radius: 12px; background: rgba(242, 199, 106, .18); font-size: .85rem; }

.disclosure { margin-bottom: 1.4rem; padding: 1rem 1.25rem; border: 1px solid rgba(94, 70, 54, .12); border-radius: var(--radius); background: rgba(255, 253, 250, .85); }
.disclosure > summary { font-weight: 750; cursor: pointer; }
.disclosure[open] > summary { margin-bottom: 1rem; }


.card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.2rem; }
.guest-card { display: flex; flex-direction: column; gap: .55rem; padding: 1.15rem 1.25rem; border: 1px solid rgba(94, 70, 54, .12); border-radius: var(--radius); background: rgba(255, 253, 250, .85); }
.guest-card.is-inactive { opacity: .6; }
.guest-card header { display: flex; gap: .7rem; align-items: baseline; justify-content: space-between; }
.guest-card h2 { margin: 0; font-size: 1.15rem; }
.guest-title { display: flex; gap: .5rem; align-items: baseline; min-width: 0; border: 0; padding: 0; background: transparent; text-align: left; cursor: pointer; }
.guest-title span { opacity: 0; color: var(--gold); font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; transition: opacity .15s; }
.guest-title:hover span, .guest-title:focus-visible span { opacity: 1; }
.guest-counts { margin: 0; color: var(--ink-soft); font-size: .78rem; }
.guest-card footer { display: flex; gap: .8rem; align-items: center; margin-top: auto; padding-top: .5rem; }
.guest-card footer .button { min-height: 36px; padding: .4rem 1rem; font-size: .85rem; }
.guest-members { margin: 0; color: var(--ink-soft); font-size: .85rem; }
.badge { flex: 0 0 auto; padding: .2rem .6rem; border-radius: 999px; font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.badge-success { color: #365640; background: #dcebdd; }
.badge-muted { color: var(--ink-soft); background: rgba(94, 70, 54, .1); }
.badge-role { color: #6b4b12; background: rgba(242, 199, 106, .3); }
.planning-phase:not(:first-child) { margin-top: 1rem; }
.planning-phase .planning-task { position: relative; display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: .5rem; padding-left: .6rem; border-left: 0.4rem solid var(--status-todo); }
.planning-task-sort-grip { position: absolute; top: 0; bottom: 0; left: -.4rem; width: calc(.4rem + .6rem); cursor: grab; touch-action: none; user-select: none; }
.planning-task-sort-grip::after { content: '⠿'; position: absolute; top: 50%; left: 50%; color: currentColor; font-size: .72rem; line-height: 1; opacity: 0; transform: translate(-50%, -50%); transition: opacity .15s; }
.planning-task:hover .planning-task-sort-grip::after, .planning-task-sort-grip:active::after { opacity: .72; }
.planning-task-sort-grip:active { cursor: grabbing; }
.planning-task.is-dragging { opacity: .55; }
.planning-task .field { flex: 0 0 auto; margin: 0; }
.planning-task .planning-task-title { flex: 1 1 26%; min-width: 11rem; }
.planning-task .planning-task-note { flex: 2 1 46%; min-width: 14rem; }
.planning-task-status { flex: 0 0 auto; }
.planning-task-name { flex: 1 1 40%; min-width: 0; margin: 0; font-size: .92rem; }
.planning-status-badge { flex: 0 0 auto; padding: .22rem .55rem; border: 0.4rem solid currentColor; border-radius: 999px; color: var(--status-todo); background: rgba(102, 95, 89, .08); font-size: .66rem; font-weight: 800; letter-spacing: .06em; line-height: 1.2; text-transform: uppercase; white-space: nowrap; }
.planning-task.status-done { border-left-color: var(--status-done); }
.planning-task.status-done .planning-task-name { color: var(--ink-soft); text-decoration: line-through; }
.planning-task.status-done .planning-status-badge { color: var(--status-done); background: rgba(63, 108, 80, .1); }
.planning-task.status-working { border-left: 0.4rem double var(--status-working); }
.planning-task.status-working .planning-status-badge { color: var(--status-working); background: rgba(130, 84, 13, .1); }
.planning-task.status-discuss { border-left: 0.4rem dotted var(--status-discuss); }
.planning-task.status-discuss .planning-status-badge { color: var(--status-discuss); background: rgba(140, 61, 59, .09); }
.planning-phase-head { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-bottom: .9rem; }
.planning-phase-title { flex: 1 1 220px; margin: 0; }
.planning-phase-head .row-sort { margin-bottom: 0; }
.planning-add { display: flex; gap: .5rem; align-items: center; margin-top: .8rem; }
.planning-add input { flex: 1; min-width: 0; }
.planning-add .button { min-height: 36px; padding: .4rem 1rem; font-size: .85rem; }
.planning-form { margin-bottom: 3rem; }
.planning-notes { min-height: 15rem; resize: vertical; }

.tab-bar { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1.2rem; border-bottom: 1px solid rgba(94, 70, 54, .14); }
.tab { padding: .55rem 1.1rem; border: 0; border-bottom: 2px solid transparent; color: var(--ink-soft); background: transparent; font: inherit; font-size: .88rem; font-weight: 700; cursor: pointer; }
.tab.is-active { color: var(--ink); border-bottom-color: var(--gold); }

.packing-item { display: flex; gap: .5rem; align-items: center; margin-bottom: .5rem; padding-left: .6rem; border-left: 3px solid rgba(94, 70, 54, .18); }
.packing-item.is-packed { border-left-color: var(--success); }
.packing-item-check { flex: 0 0 auto; margin: 0; }
.packing-item-title { flex: 1 1 auto; min-width: 0; margin: 0; }
.save-state { flex: 0 0 auto; min-width: 6.5rem; font-size: .75rem; text-align: right; }
.planning-phase-head .save-state { margin-left: auto; }
.planning-task .save-state { flex: 0 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
@media screen and (min-width: 817px) { .planning-task .save-state { position: absolute; right: calc(32px + 3rem); } }
.save-state.is-pending { color: var(--ink-soft); }
.save-state.is-done { color: var(--success); }
.save-state.is-error { color: var(--danger); }
.row-insert { margin-left: auto; font-size: .8rem; }
.timeline-note { color: var(--ink-soft); font-size: .88rem; }
.role-badges { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; }
.timeline-item.is-internal { opacity: .85; }
.timeline-item.is-internal time { background: var(--gold); }
.message-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.message-card { padding: 1.7rem; border-radius: var(--radius); background: rgba(255, 253, 250, .87); box-shadow: 0 9px 30px rgba(77, 57, 42, .08); }
.message-card.is-hidden { opacity: .4; }
.message-card blockquote { margin: 0 0 1rem; font: 1.3rem/1.55 var(--serif); }
.message-card footer { color: var(--gold); font-weight: 750; }

.wall-stage { position: fixed; z-index: 100; inset: 0; display: grid; grid-template-rows: auto 1fr auto; min-height: 100vh; padding: clamp(1rem, 4vw, 3rem); color: var(--ink); background: var(--paper); text-align: center; }
.wall-stage::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at 15% 20%, rgba(217,155,40,.16), transparent 34%), radial-gradient(circle at 90% 80%, rgba(183,168,156,.35), transparent 38%); }
.wall-stage header h1 { font-size: clamp(2rem, 4vw, 4rem); }
.wall-slide { display: none; place-self: center; max-width: 1000px; }
.wall-slide.is-active { display: block; animation: soft-in .55s ease both; }
.wall-slide blockquote { margin: 0; font: clamp(2rem, 5vw, 4.5rem)/1.28 var(--serif); }
.wall-slide footer { margin-top: 2rem; color: var(--gold); font: clamp(1.2rem, 2.5vw, 2rem) var(--script); }
.stage-controls { display: flex; justify-content: center; align-items: center; gap: 1rem; flex-wrap: wrap; }

.reveal-up, .reveal-group > * { opacity: 1; transform: none; }
.motion-ready .reveal-up, .motion-ready .reveal-group > * { animation: reveal-up .65s ease both; }
.motion-ready .reveal-group > *:nth-child(2) { animation-delay: .08s; }
.motion-ready .reveal-group > *:nth-child(3) { animation-delay: .16s; }
.motion-ready .reveal-group > *:nth-child(4) { animation-delay: .24s; }
.motion-ready .reveal-group > *:nth-child(5) { animation-delay: .32s; }
.motion-ready .reveal-group > *:nth-child(6) { animation-delay: .4s; }
@keyframes soft-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes reveal-up { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

@media (max-width: 1080px) {
  .admin-bar {
    position: sticky;
    z-index: 30;
    top: 0;
    display: flex;
    align-items: center;
    gap: .6rem;
    min-height: 64px;
    padding: .5rem clamp(.7rem, 3vw, 1.5rem);
    border-bottom: 1px solid rgba(94, 70, 54, .1);
    background: rgba(249, 246, 239, .92);
    backdrop-filter: blur(16px);
  }
  .admin-sidebar { transform: translateX(-102%); transition: transform .25s ease; box-shadow: var(--shadow); }
  .admin-sidebar.is-open { transform: none; }
  .sidebar-brand { display: none; }
  .has-sidebar .site-main { width: min(100% - 1.4rem, 1180px); margin-right: auto; margin-left: auto; padding-top: 2rem; }
  .has-sidebar .site-footer { margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .admin-sidebar { transition: none; }
}

@media (max-width: 920px) {
  .nav-toggle { display: block; }
  .site-nav { position: absolute; top: 73px; left: 1rem; right: 1rem; display: none; flex-direction: column; align-items: stretch; gap: .2rem; padding: 1rem; border: 1px solid rgba(94,70,54,.12); border-radius: 18px; background: var(--white); box-shadow: var(--shadow); }
  .site-nav.is-open { display: flex; }
  .site-nav a, .site-nav .link-button { display: block; width: 100%; padding: .7rem; text-align: left; }
  .card-grid, .admin-actions { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(3, 1fr); }
  .bank-card { grid-template-columns: 1fr; }
  .qr-wrap { order: -1; }
  .card-grid { grid-template-columns: 1fr; }
  .budget-item-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .budget-title-field, .budget-note-field { grid-column: 1 / -1; }
  .budget-delete { align-self: center; margin: 0; }
}

@media (max-width: 640px) {
  body::before, body::after { opacity: .28; }
  .site-main { width: min(100% - 1.2rem, 1180px); padding: 2.2rem 0 4rem; }
  .public-main { width: 100%; min-height: 100svh; padding: 0; }
  .landing, .admin-login { padding: 2rem .7rem; }
  .watercolor-frame::before, .watercolor-frame::after { width: 55vw; opacity: .55; }
  .landing h1 { flex-direction: column; gap: 0; }
  .landing h1 b { margin: -.18em 0; }
  .countdown { gap: .35rem; }
  .countdown div { padding: .75rem .2rem; border-radius: 13px; }
  .countdown span { font-size: .5rem; letter-spacing: .04em; }
  .input-action { flex-direction: column; }
  .input-action .button { width: 100%; }
  .admin-login .login-card .button { margin-top: 1rem; }
  .card-grid, .admin-actions, .wishlist-grid, .photo-actions, .message-grid, .field-grid, .accommodation-room-type-fields { grid-template-columns: 1fr; }
  .accommodation-people { grid-template-columns: 1fr; }
  .feature-card { min-height: 160px; }
  .timeline-item { grid-template-columns: 75px 1fr; gap: 1rem; }
  .timeline-item time { width: 70px; height: 70px; font-size: 1rem; }
  .timeline-item::before { left: 34px; top: 36px; }
  .choice-grid { grid-template-columns: 1fr; }
  .wish-card, .admin-list article { flex-direction: column; }
  .bank-details > div { grid-template-columns: 1fr; gap: .15rem; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .budget-summary, .budget-item-grid { grid-template-columns: 1fr; }
  .budget-title-field, .budget-note-field { grid-column: auto; }
  .budget-item { position: relative; padding-right: 3rem; }
  .budget-delete { position: absolute; top: .9rem; right: .8rem; }
  .stage-controls .button { min-height: 40px; padding: .55rem .8rem; }

  /* Aufgaben und Packlisteneinträge stapeln statt in einer Zeile zu quetschen. */
  .planning-task, .packing-item { position: relative; flex-wrap: wrap; padding-right: 2.4rem; }
  .planning-task .field, .packing-item .field { flex: 1 1 100%; min-width: 0; }
  .planning-task-status select { width: 100%; }
  .planning-task > .icon-button, .packing-item > .icon-button { position: absolute; top: .35rem; right: 0; }
  .planning-task .save-state, .packing-item .save-state { flex: 1 1 100%; min-width: 0; text-align: left; }
  .planning-phase-head .save-state { flex: 1 1 100%; margin-left: 0; text-align: left; }
  .planning-add { flex-wrap: wrap; }
  .planning-add input { flex: 1 1 100%; }
  .planning-add .button { width: 100%; }

  /* Die Rollenschalter erzwingen sonst eine breitere Spalte als der Bildschirm. */
  .stacked-form > *, .person-rows > * { min-width: 0; }
  .person-row { flex-wrap: wrap; }
  .person-row input[type='text'] { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .motion-ready .reveal-up, .motion-ready .reveal-group > * { animation: none; opacity: 1; transform: none; }
}
