.admin-shell{min-height:100dvh;background:var(--z-bg)}
.admin-sidebar{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--z-border);background:var(--z-surface)}
.admin-brand{display:block;width:130px}.admin-brand .brand-logo{width:100%;height:auto}.admin-label{font-size:.8rem;color:var(--z-muted)}
.admin-nav{position:fixed;bottom:0;left:0;right:0;z-index:var(--z-layer-nav);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--z-surface);border-top:1px solid var(--z-border);padding-bottom:env(safe-area-inset-bottom)}
.admin-nav-link{min-height:64px;text-decoration:none;color:var(--z-muted);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.75rem;gap:3px}.admin-nav-link.active{color:var(--z-primary);font-weight:700}.admin-nav-link.active .nav-icon{background:var(--z-primary-soft)}
.admin-main{padding:24px 16px 110px;max-width:1500px;margin:auto;min-width:0}.admin-main h1{font-size:1.8rem;letter-spacing:-.04em;margin:0 0 12px;overflow-wrap:anywhere}.admin-main h2{overflow-wrap:anywhere}.admin-page-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.admin-main .button{min-height:44px}.admin-main .card{box-shadow:none;padding:22px;border-radius:20px}.admin-back{display:inline-block;min-height:44px;padding:8px 0;text-decoration:none}
.admin-field{margin-bottom:18px;min-width:0}.admin-field label{font-size:.85rem;margin-bottom:8px}.admin-field input,.admin-field select,.admin-field textarea{width:100%;min-height:48px;border:1px solid var(--z-border);border-radius:12px;padding:10px 12px;font:inherit;color:var(--z-text);background:var(--z-surface)}.admin-field input:focus,.admin-field select:focus{outline:2px solid var(--z-primary);outline-offset:2px}.admin-field input[type=number]{appearance:textfield}
.admin-tabs{display:flex;gap:20px;border-bottom:1px solid var(--z-border);margin:24px 0;overflow:auto}.admin-tab{display:block;min-height:48px;padding:12px 0;color:var(--z-muted);text-decoration:none;white-space:nowrap;border-bottom:3px solid transparent}.admin-tab.active{color:var(--z-primary);border-bottom-color:var(--z-primary);font-weight:650}
.admin-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:24px 0;flex-wrap:wrap}.admin-pager span{font-size:.8rem;color:var(--z-muted)}
.admin-details,.admin-facts{display:grid;grid-template-columns:minmax(80px,1fr) 3fr;gap:12px;font-size:.9rem}.admin-details dt,.admin-facts dt{color:var(--z-muted)}.admin-details dd,.admin-facts dd{margin:0;overflow-wrap:anywhere}.admin-footnote{font-size:.8rem;color:var(--z-muted);border-top:1px solid var(--z-border);padding-top:20px;margin-top:32px}.admin-notice{padding:16px 20px;background:var(--z-primary-soft);border-radius:14px;margin:20px 0}.admin-login{max-width:460px;margin:40px auto!important}.admin-form{max-width:900px}.admin-form-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0 24px}.admin-lifecycle{max-width:900px;border-color:var(--z-danger-border)!important}.admin-join-url{overflow-wrap:anywhere;font-size:.85rem;color:var(--z-muted)}
@media(min-width:680px){.admin-main{padding:32px 28px 110px}.admin-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.admin-shell{padding-left:236px}.admin-sidebar{position:fixed;left:0;top:0;bottom:0;width:236px;padding:36px 20px;display:block;border-right:1px solid var(--z-border);border-bottom:0}.admin-brand{margin:0 12px 8px}.admin-label{display:block;margin:0 12px 40px}.admin-nav{position:static;display:flex;flex-direction:column;border:0;gap:8px}.admin-nav-link{flex-direction:row;justify-content:start;min-height:48px;padding:12px 14px;border-radius:12px;font-size:.9rem;gap:12px}.admin-nav-link .nav-icon{width:auto;height:auto}.admin-nav-link.active,.admin-nav-link.active .nav-icon{background:var(--z-primary-soft)}.admin-main{padding:44px 40px 70px}.admin-main h1{font-size:2.2rem}}
@media print{@page{size:A4;margin:0}body{background:var(--z-surface)!important}.admin-sidebar,.admin-header,.admin-page-heading,.admin-back,.admin-breadcrumb,.page-header,.admin-kpis,.admin-start-checklist,.admin-tabs,.admin-no-print,.admin-main>.hint,.admin-notice,.hint-area,.toast-stack{display:none!important}.admin-shell{padding:0}.admin-main{padding:0;max-width:none}.admin-qr-layout{display:block}.qr-sheet{display:block;max-width:none;margin:0}.qr-sheet-page{--u:calc(210mm / 794);border:0;border-radius:0;box-shadow:none;break-after:page;print-color-adjust:exact;-webkit-print-color-adjust:exact}.qr-sheet-page:last-child{break-after:auto}}

.operator-text{white-space:pre-wrap;overflow-wrap:anywhere}

/* Selection stays available on touch screens and with keyboard navigation. */
.admin-main .gallery .select-toggle { opacity: 1; pointer-events: auto; }

.admin-auth { padding-left: 0; }
.admin-auth .admin-sidebar { position: static; width: auto; padding: 24px; border: 0; display: flex; justify-content: center; }
.admin-auth .admin-label { display: none; }
.admin-auth .admin-main { padding-top: 0; }

.admin-processing { margin-block: 2rem; }

.admin-notice.warning { background: var(--z-warning-soft); color: var(--z-warning); border-left: 4px solid var(--z-warning); }

@media(max-width:1023px) { .admin-sidebar { padding: 0; border: 0; } .admin-sidebar > .admin-brand, .admin-sidebar > .admin-label { display: none; } }

.admin-motif-preview { display: block; max-width: 320px; width: 100%; border-radius: 16px; margin-block: 16px; }

html:has(.admin-shell) { scroll-padding-block: 80px 90px; }
@media(min-width:1024px) { html:has(.admin-shell) { scroll-padding-bottom: 24px; } }

/* Admin shell (#72): own sticky header instead of the guest classes, one logo per viewport, account menu. */
.admin-content { min-width: 0; }
.admin-header {
  position: sticky; top: 0; z-index: var(--z-layer-header);
  display: flex; align-items: center; gap: 12px;
  min-height: calc(var(--z-bar-height) + env(safe-area-inset-top));
  padding: env(safe-area-inset-top) 16px 0;
  background: var(--z-bar-bg); backdrop-filter: blur(14px);
  border-bottom: 1px solid transparent;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.admin-header[data-collapsed="true"] { border-bottom-color: var(--z-border); box-shadow: var(--z-shadow); }
.admin-header .wordmark { flex: none; display: flex; align-items: center; color: var(--z-text); text-decoration: none; }
.admin-header .brand { width: 96px; overflow: hidden; transition: width .18s ease, opacity .18s ease; }
.admin-header[data-collapsed="true"] .brand { width: 0; opacity: 0; }
.admin-header[data-collapsed="true"] .brand-mark { width: 30px; opacity: 1; }
.admin-header[data-collapsed="true"] .header-title { opacity: 1; transform: none; }
.admin-header .admin-account { margin-inline-start: auto; }
.admin-account-sidebar { display: none; }
.admin-account-panel {
  position: absolute; z-index: var(--z-layer-overlay); top: calc(100% + 4px); right: 0; display: grid; gap: 4px;
  min-width: 220px; max-width: calc(100vw - 2 * var(--z-gutter)); padding: 8px;
  background: var(--z-surface); border: 1px solid var(--z-border); border-radius: var(--z-radius-small); box-shadow: var(--z-shadow-raised);
}
.admin-account-panel[data-placement^="top"] { top: auto; bottom: calc(100% + 4px); }
.admin-account-panel[data-placement$="start"] { right: auto; left: 0; }
.admin-account-name { display: flex; align-items: center; gap: 10px; margin: 0; padding: 8px 12px; font-weight: 650; overflow-wrap: anywhere; }
.admin-account-error { margin: 0; padding: 8px 12px; border-radius: 8px; background: var(--z-danger-soft); color: var(--z-danger); font-size: .9rem; }
.admin-account-signout {
  display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 12px; border: 0; border-radius: 8px;
  background: transparent; color: var(--z-text); font: inherit; text-align: start; cursor: pointer;
}
.admin-account-signout:hover, .admin-account-signout:focus-visible { background: var(--z-primary-soft); }
.admin-account-signout:disabled { opacity: .55; cursor: not-allowed; }
@media(min-width:680px) { .admin-header { padding-inline: 28px; } }
@media(min-width:1024px) {
  .admin-sidebar { display: flex; flex-direction: column; }
  .admin-account-sidebar { display: block; margin-top: auto; padding: 0 2px; }
  .admin-auth .admin-sidebar { flex-direction: row; }
  .admin-header { padding-inline: 40px; }
  .admin-header .wordmark, .admin-header .admin-account { display: none; }
  .admin-header .header-title { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) { .admin-header, .admin-header * { transition: none; } }

/* States and texts (#74, #75): technical details behind a disclosure, empty states, toasts above the bottom navigation. */
.admin-disclosure { margin-block: 16px; }
.admin-disclosure > summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--z-muted); font-weight: 650; }
.admin-disclosure[open] > summary { margin-bottom: 8px; }
.admin-disclosure-toggle { min-height: 44px; display: flex; align-items: center; gap: 6px; padding: 0; border: 0; background: none; cursor: pointer; color: var(--z-muted); font: inherit; font-weight: 650; }
/* The chevron is drawn, not written: generated text would become part of the button's accessible name. */
.admin-disclosure-toggle::before { content: ""; width: 6px; height: 6px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); }
.admin-disclosure-toggle[aria-expanded="true"] { margin-bottom: 8px; }
.admin-disclosure-toggle[aria-expanded="true"]::before { transform: rotate(45deg); }
.admin-main .empty-state { padding: 40px 16px; border: 1px dashed var(--z-border); border-radius: 20px; background: var(--z-surface); }
.admin-shell .toast-stack { bottom: calc(64px + env(safe-area-inset-bottom) + 12px); }
@media(min-width:1024px) { .admin-shell .toast-stack { bottom: 24px; left: auto; right: 40px; } }

/* Event workspace (#76): breadcrumb, tabs with icons that scroll on the phone, one-row key figures. */
.admin-breadcrumb ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; margin: 0 0 4px; padding: 0; list-style: none; font-size: .85rem; color: var(--z-muted); }
.admin-breadcrumb li { display: flex; align-items: center; gap: 6px; min-width: 0; overflow-wrap: anywhere; }
.admin-breadcrumb li + li::before { content: "/"; color: var(--z-muted); }
.admin-breadcrumb-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--z-muted); }
.admin-breadcrumb-link:hover, .admin-breadcrumb-link:focus-visible { color: var(--z-primary); }
.admin-breadcrumb [aria-current="page"] { color: var(--z-text); font-weight: 600; }
.admin-tabs { gap: 20px; scrollbar-width: none; }
.admin-tabs::-webkit-scrollbar { display: none; }
.admin-tab { display: flex; align-items: center; gap: 8px; flex: none; }
.admin-tab .nav-icon { width: auto; height: auto; }
.admin-tab .nav-icon svg { width: 18px; height: 18px; }
.admin-kpis { display: flex; gap: 8px; margin: 0 0 20px; overflow-x: auto; scrollbar-width: thin; }
.admin-kpi { flex: 1 0 auto; display: flex; flex-direction: column; justify-content: center; gap: 2px; min-width: 112px; padding: 8px 14px; border: 1px solid var(--z-border); border-radius: var(--z-radius-small); background: var(--z-surface); }
.admin-kpi dt { display: flex; align-items: center; gap: 6px; font-size: .75rem; color: var(--z-muted); white-space: nowrap; }
.admin-kpi dt svg { width: 16px; height: 16px; flex: none; }
.admin-kpi dd { margin: 0; }
.admin-kpi strong { font-size: 1.05rem; font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; }
.admin-kpi-problems { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; color: var(--z-text); text-decoration: none; }
.admin-kpi-problems:hover strong, .admin-kpi-problems:focus-visible strong { text-decoration: underline; }
.admin-start-checklist { margin: 0 0 20px; }
.admin-start-checklist-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.admin-start-checklist h2 { margin: 0; }
.admin-checklist { display: flex; flex-direction: column; gap: 4px; margin: 12px 0 0; padding: 0; list-style: none; }
.admin-checklist-step { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 10px 0; border-top: 1px solid var(--z-border); }
.admin-checklist-step > svg { flex: none; width: 22px; height: 22px; color: var(--z-muted); }
.admin-checklist-step.done > svg { color: var(--z-success); }
.admin-checklist-text { display: flex; flex-direction: column; gap: 2px; flex: 1 1 200px; min-width: 0; }
.admin-checklist-step.done .admin-checklist-text strong, .admin-checklist-step.skipped .admin-checklist-text strong { color: var(--z-muted); font-weight: 500; }
.admin-checklist-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

/* Lists (#78–#80): one DOM per row; a table from 1024 px, stacked rows with one action cell below. */
.admin-list-toolbar { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; }
.admin-list-toolbar .gallery-search { flex: 1 1 auto; min-width: 0; max-width: 420px; }
.admin-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 0 0 12px; }
.admin-section-heading h2, .admin-section-heading p { margin: 0; }
.admin-table { margin: 0 0 16px; min-width: 0; }
.admin-table-grid { width: 100%; border-collapse: collapse; }
.admin-table-row { position: relative; }
.admin-row-actions { position: relative; display: flex; align-items: center; justify-content: flex-end; gap: 2px; }
.admin-row-link { color: var(--z-text); font-weight: 650; text-decoration: none; overflow-wrap: anywhere; }
.admin-table-row.linked .admin-row-link::after { content: ""; position: absolute; inset: 0; }
.admin-row-link:focus-visible { outline: 2px solid var(--z-primary); outline-offset: 2px; }
.admin-table-row.linked:hover .admin-row-link { color: var(--z-primary); text-decoration: underline; }
.admin-list-summary { display: flex; align-items: center; gap: 12px; min-width: 0; }
.admin-list-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.admin-list-title { font-weight: 650; overflow-wrap: anywhere; }
.admin-list-meta, .admin-cell-id { font-size: .8rem; color: var(--z-muted); overflow-wrap: anywhere; }
.admin-cell-title { display: block; font-weight: 650; overflow-wrap: anywhere; }
.admin-cell-with-art { display: flex; align-items: center; gap: 12px; min-width: 0; }
.admin-thumb { flex: none; width: 40px; height: 40px; border-radius: var(--z-radius-small); object-fit: cover; background: var(--z-primary-soft); }
.admin-thumb.initials { display: grid; place-items: center; color: var(--z-primary-strong); font-weight: 700; font-size: .85rem; }
.admin-list-summary .avatar { width: 40px; height: 40px; }
.admin-progress { display: flex; align-items: center; gap: 8px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.admin-progress progress { width: 96px; height: 8px; accent-color: var(--z-primary); }
@media(max-width:1023px) {
  .admin-table-grid, .admin-table-grid tbody { display: block; }
  .admin-table-grid thead { display: none; }
  .admin-table-row { display: flex; align-items: center; gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--z-border); }
  .admin-table-row > td { display: none; }
  .admin-table-row > td.admin-table-summary { display: block; flex: 1 1 auto; min-width: 0; }
  .admin-table-row > td.admin-table-actions { display: block; flex: none; }
}
@media(min-width:1024px) {
  .admin-table { overflow-x: auto; }
  .admin-table-summary { display: none; }
  .admin-table-grid th { padding: 10px 12px; border-bottom: 1px solid var(--z-border); color: var(--z-muted); font-size: .8rem; font-weight: 650; text-align: start; white-space: nowrap; }
  .admin-table-grid td { padding: 8px 12px; border-bottom: 1px solid var(--z-border); vertical-align: middle; }
  .admin-table-grid .numeric { text-align: end; font-variant-numeric: tabular-nums; }
  .admin-table-grid .admin-table-actions { width: 1%; text-align: end; white-space: nowrap; }
  .admin-table-row:hover { background: var(--z-surface); }
}

/* Operations (#80): health chips that wrap, freshness, one capacity bar, details. */
.admin-health { margin: 0 0 24px; }
.admin-health-freshness { display: flex; align-items: center; gap: 4px; }
.admin-health-chips { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0; padding: 0; list-style: none; }
.admin-health-chips li { display: flex; align-items: center; gap: 8px; font-size: .9rem; }
.admin-capacity { margin: 0 0 24px; }
.admin-capacity-bar { display: flex; height: 12px; border-radius: 999px; overflow: hidden; background: var(--z-neutral-soft); }
.admin-capacity-bar .used { inline-size: var(--used); background: var(--z-primary); }
.admin-capacity-bar .reserved { inline-size: var(--reserved); background: var(--z-warning); }
.admin-capacity-legend { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 12px 0 0; font-size: .9rem; }
.admin-capacity-legend > div { display: flex; align-items: center; gap: 6px; }
.admin-capacity-legend dt { color: var(--z-muted); }
.admin-capacity-legend dd { margin: 0; font-weight: 650; font-variant-numeric: tabular-nums; }
.admin-capacity-legend .used dt::before, .admin-capacity-legend .reserved dt::before, .admin-capacity-legend .free dt::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-inline-end: 6px; border-radius: 50%; background: var(--z-primary); }
.admin-capacity-legend .reserved dt::before { background: var(--z-warning); }
.admin-capacity-legend .free dt::before { background: var(--z-neutral-soft); box-shadow: inset 0 0 0 1px var(--z-border); }
.admin-facts > div { display: contents; }

/* Event and system settings (#82): sections, danger zone, sticky save bar, motif drop zone. */
.admin-section { margin: 0 0 20px; }
.admin-section h2 { margin-top: 0; }
.admin-moment { min-width: 0; margin: 0 0 18px; padding: 0; border: 0; }
.admin-moment legend { margin-bottom: 8px; font-weight: 650; }
.admin-moment .admin-field { margin-bottom: 8px; }
.admin-danger-zone { border: 1px solid var(--z-danger-border); }
.admin-danger-zone h2 { color: var(--z-danger); }
.admin-delete-scope { margin: 8px 0 12px; padding-inline-start: 20px; }
.admin-warning { margin: 0 0 18px; padding: 10px 12px; border-radius: var(--z-radius-small); background: var(--z-warning-soft); color: var(--z-text); }
.admin-save-bar { position: sticky; bottom: 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin: 0 0 20px; padding: 12px 16px; border: 1px solid var(--z-border); border-radius: var(--z-radius); background: var(--z-surface); box-shadow: var(--z-shadow-raised); }
.admin-save-bar p { margin: 0; }
.admin-drop-zone { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-block: 16px; padding: 16px; border: 2px dashed var(--z-border); border-radius: var(--z-radius); }
.admin-drop-zone.is-over { border-color: var(--z-primary); background: var(--z-primary-soft); }
.admin-drop-zone.is-refusing { border-color: var(--z-danger); background: var(--z-danger-soft); }
.admin-drop-zone .hint { flex-basis: 100%; margin: 0; }
.admin-drop-text { margin: 0; }
.admin-drop-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.admin-drop-zone:focus-within label { outline: 2px solid var(--z-primary); outline-offset: 2px; }
.admin-drop-rejections { margin: 0 0 16px; padding-inline-start: 20px; }
.button.text { min-height: 40px; padding-inline: 8px; border: 0; background: none; color: var(--z-primary); }

/* Date, time and time zone fields: a text field with a panel below it (issue 163). From 600 px the panel is a popover that
   picker-panel.js turns upwards or to the end edge where it lacks room; below 600 px it lies in the flow under the field,
   pushes the content below it down and is scrolled into view. The width matches NARROW_QUERY in picker-panel.js. */
.picker-control { position: relative; display: flex; align-items: center; gap: 4px; }
.picker-control input { flex: 1 1 auto; min-width: 0; }
.picker-panel { position: absolute; inset-inline-start: 0; top: calc(100% + 4px); z-index: var(--z-layer-overlay); min-width: 100%; padding: 8px; border: 1px solid var(--z-border); border-radius: var(--z-radius-small); background: var(--z-surface); box-shadow: var(--z-shadow-raised); }
.picker-panel.calendar { min-width: 296px; max-width: calc(100vw - 2 * var(--z-gutter)); }
.calendar-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; font-weight: 650; }
.calendar table { width: 100%; border-collapse: collapse; }
.calendar th { padding: 4px 0; color: var(--z-muted); font-size: .75rem; font-weight: 650; text-align: center; }
.calendar td { padding: 1px; text-align: center; }
.calendar-day { width: 40px; height: 40px; border: 0; border-radius: 50%; background: none; color: var(--z-text); font: inherit; font-variant-numeric: tabular-nums; }
.calendar-day.outside { color: var(--z-muted); }
.calendar-day:hover { background: var(--z-primary-soft); }
.calendar-day:focus-visible { outline: 2px solid var(--z-primary); outline-offset: 1px; }
.calendar-day[aria-current=date] { box-shadow: inset 0 0 0 1px var(--z-primary); }
.calendar-day[aria-selected=true] { background: var(--z-primary); color: var(--z-surface); }
.picker-options { max-height: 260px; margin: 0; overflow-y: auto; list-style: none; }
.picker-option { padding: 8px 10px; border-radius: var(--z-radius-small); cursor: pointer; overflow-wrap: anywhere; }
.picker-option:hover, .picker-option.active { background: var(--z-primary-soft); }
.picker-option[aria-selected=true] { font-weight: 650; }
.picker-empty { margin: 0; padding: 8px 10px; color: var(--z-muted); }
.picker-panel[data-placement^="top"] { top: auto; bottom: calc(100% + 4px); }
.picker-panel[data-placement$="end"] { inset-inline-start: auto; inset-inline-end: 0; }
@media (max-width: 599.98px) {
  .date-field, .time-field, .time-zone-field { min-width: 0; }
  .picker-control { flex-wrap: wrap; }
  .picker-control input { flex-basis: 0; }
  .picker-panel, .picker-panel.calendar { position: static; flex: 1 0 100%; min-width: 0; max-width: none; margin-top: 4px; box-shadow: none; }
  .calendar table { table-layout: fixed; }
  .calendar-day { width: 100%; max-width: 40px; height: auto; aspect-ratio: 1; }
}

.admin-media-section { display: grid; gap: 8px; justify-items: start; margin-block: 20px; }
.admin-media-section h2 { margin: 0; font-size: .95rem; }
.admin-media-section .admin-notice { margin: 0; }
.admin-media-guest { display: flex; align-items: center; gap: 8px; margin: 0; overflow-wrap: anywhere; }

/* Tab „QR & Teilen“ (#83): am Handy zuerst das Aktionsfeld, darunter die Vorschau; ab 1024 px Vorschau links, Feld rechts. */
.admin-qr-layout { display: grid; gap: 24px; align-items: start; }
.admin-qr-panel { display: grid; gap: 20px; }
.admin-qr-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.admin-qr-value { display: grid; gap: 4px; min-width: 0; }
.admin-qr-value p { margin: 0; }
.admin-qr-value-row { display: flex; align-items: center; gap: 8px; min-width: 0; }
.admin-qr-value-row > p:first-child { flex: 1; min-width: 0; }
.admin-qr-code { font-size: 1.5rem; letter-spacing: .08em; }
.admin-qr-preview .qr-sheet { margin: 0 auto; }
.admin-qr-renew { margin-top: 24px; }
.admin-qr-renew h2 { margin-top: 0; }
@media (min-width: 1024px) {
  .admin-qr-layout { grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); }
  .admin-qr-panel { grid-column: 2; grid-row: 1; position: sticky; top: 88px; }
  .admin-qr-preview { grid-column: 1; grid-row: 1; }
}
.qr-sheet-brand { display: block; width: calc(116 * var(--u)); }
.qr-sheet-guide-head .qr-sheet-brand { width: calc(90 * var(--u)); }
.qr-sheet-brand .brand { width: 100%; }

/* QR-Aushang (#99): zwei A4-Seiten nach docs/mockups/qr-aushang. Eine Einheit --u ist ein CSS-Pixel einer 794 × 1123 px
   großen A4-Seite: am Bildschirm auf die Spaltenbreite verkleinert, beim Drucken genau 210 mm / 794. Das PDF
   (QrSheetFrontPage, QrSheetGuidePage, QrSheetPhones) zeichnet dieselben Maße; Werte hier und dort gemeinsam ändern. */
.qr-sheet { container-type: inline-size; display: grid; gap: 24px; max-width: 794px; margin: 24px auto; }
.qr-sheet-page {
  --u: calc(100cqw / 794);
  box-sizing: border-box; width: calc(794 * var(--u)); height: calc(1123 * var(--u)); overflow: hidden;
  display: flex; flex-direction: column; background: var(--z-bg); color: var(--z-text);
  border: 1px solid var(--z-border); border-radius: var(--z-radius-small); box-shadow: var(--z-shadow);
  font-size: calc(16 * var(--u)); line-height: 1.5; text-align: start;
}
.qr-sheet-page h2, .qr-sheet-page h3, .qr-sheet-page p, .qr-sheet-page ol { margin: 0; }
.qr-sheet-page .icon { width: calc(22 * var(--u)); height: calc(22 * var(--u)); }
.qr-sheet-number { display: inline-flex; flex: none; align-items: center; justify-content: center; width: calc(28 * var(--u)); height: calc(28 * var(--u)); border-radius: 50%; background: var(--z-primary); color: var(--z-surface); font-size: calc(14 * var(--u)); font-weight: 800; line-height: 1; }
.qr-sheet-foot { margin-top: auto; align-self: stretch; display: flex; justify-content: space-between; align-items: flex-end; gap: calc(24 * var(--u)); padding-top: calc(18 * var(--u)); border-top: calc(1 * var(--u)) solid var(--z-border); }
.qr-sheet-foot p { max-width: calc(400 * var(--u)); font-size: calc(13 * var(--u)); color: var(--z-muted); }

.qr-sheet-front { padding: calc(56 * var(--u)) calc(64 * var(--u)) calc(48 * var(--u)); align-items: center; gap: calc(28 * var(--u)); }
.qr-sheet-head { align-self: stretch; height: calc(32 * var(--u)); display: flex; justify-content: space-between; align-items: center; }
.qr-sheet-tagline { font-size: calc(14 * var(--u)); font-weight: 600; color: var(--z-muted); }
.qr-sheet-intro { display: flex; flex-direction: column; align-items: center; gap: calc(12 * var(--u)); text-align: center; }
.qr-sheet-title { max-width: calc(620 * var(--u)); font-size: calc(46 * var(--u)); line-height: 1.1; font-weight: 800; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; }
.qr-sheet-title.medium { font-size: calc(38 * var(--u)); }
.qr-sheet-title.small { font-size: calc(30 * var(--u)); }
.qr-sheet-invitation { max-width: calc(560 * var(--u)); font-size: calc(20 * var(--u)); line-height: 1.45; color: var(--z-muted); }
.qr-sheet-card { display: flex; flex-direction: column; align-items: center; gap: calc(16 * var(--u)); padding: calc(28 * var(--u)); background: var(--z-surface); border: calc(1 * var(--u)) solid var(--z-border); border-radius: calc(28 * var(--u)); }
.qr-sheet-card .admin-qr-image { display: block; width: calc(340 * var(--u)); height: calc(340 * var(--u)); }
.qr-sheet-scan { display: flex; align-items: center; gap: calc(10 * var(--u)); height: calc(24 * var(--u)); font-size: calc(17 * var(--u)); font-weight: 700; color: var(--z-primary); }
.qr-sheet-scan .icon { stroke-width: 2; }
.qr-sheet-steps { display: flex; align-items: center; gap: calc(14 * var(--u)); height: calc(28 * var(--u)); padding: 0; list-style: none; font-size: calc(17 * var(--u)); font-weight: 600; }
.qr-sheet-steps li { display: inline-flex; align-items: center; gap: calc(8 * var(--u)); white-space: nowrap; }
.qr-sheet-steps li + li::before { content: "—"; margin-right: calc(6 * var(--u)); color: var(--z-muted); }
.qr-sheet-box { align-self: stretch; display: flex; align-items: center; justify-content: space-between; gap: calc(24 * var(--u)); padding: calc(22 * var(--u)) calc(28 * var(--u)); border-radius: calc(22 * var(--u)); background: var(--z-primary-soft); }
.qr-sheet-box-copy { flex: 1; min-width: 0; }
.qr-sheet-box-title { margin-bottom: calc(6 * var(--u)) !important; font-size: calc(18 * var(--u)); line-height: 1.3; font-weight: 700; }
.qr-sheet-box-text { font-size: calc(15 * var(--u)); line-height: 1.45; color: var(--z-muted); }
.qr-sheet-box-text strong { color: var(--z-text); }
.qr-sheet-code { flex: none; padding: calc(14 * var(--u)) calc(22 * var(--u)); border: calc(2 * var(--u)) solid var(--z-primary); border-radius: calc(16 * var(--u)); background: var(--z-surface); font-size: calc(34 * var(--u)); font-weight: 700; line-height: 1.2; letter-spacing: .08em; white-space: nowrap; }
.qr-sheet-next { display: flex; align-items: center; gap: calc(6 * var(--u)); font-size: calc(14 * var(--u)) !important; font-weight: 700; color: var(--z-primary) !important; white-space: nowrap; }
.qr-sheet-next .icon { width: calc(16 * var(--u)); height: calc(16 * var(--u)); stroke-width: 2.5; }

.qr-sheet-guide { padding: calc(48 * var(--u)) calc(64 * var(--u)) calc(40 * var(--u)); gap: calc(24 * var(--u)); }
.qr-sheet-guide-head { height: calc(96 * var(--u)); display: flex; flex-direction: column; justify-content: center; gap: calc(8 * var(--u)); }
.qr-sheet-guide-head h2 { font-size: calc(34 * var(--u)); line-height: 1.15; font-weight: 800; white-space: nowrap; }
.qr-sheet-guide-steps { display: flex; flex-direction: column; gap: calc(20 * var(--u)); padding: 0; list-style: none; }
.qr-sheet-guide-step { height: calc(196 * var(--u)); display: flex; align-items: center; gap: calc(36 * var(--u)); }
.qr-sheet-guide-step:nth-child(even) { flex-direction: row-reverse; }
.qr-sheet-guide-text { flex: 1; min-width: 0; display: flex; align-items: flex-start; gap: calc(18 * var(--u)); }
.qr-sheet-guide-text .qr-sheet-number { width: calc(40 * var(--u)); height: calc(40 * var(--u)); font-size: calc(19 * var(--u)); }
.qr-sheet-guide-text h3 { margin-bottom: calc(6 * var(--u)) !important; font-size: calc(22 * var(--u)); line-height: 1.25; font-weight: 700; }
.qr-sheet-guide-text p { font-size: calc(16 * var(--u)); line-height: 1.5; color: var(--z-muted); }
.qr-sheet-guide .qr-sheet-foot { box-sizing: border-box; height: calc(36 * var(--u)); align-items: center; padding-top: calc(12 * var(--u)); }
.qr-sheet-guide .qr-sheet-foot p { max-width: none; }
.qr-sheet-host { font-weight: 700; color: var(--z-primary) !important; }

/* Gezeichnete Handybildschirme der Rückseite; Beschriftungen aus den Texten der Gast-App. */
.qr-sheet-phone { flex: none; box-sizing: border-box; width: calc(96 * var(--u)); height: calc(196 * var(--u)); padding: calc(5 * var(--u)); border-radius: calc(20 * var(--u)); background: var(--z-text); }
.qr-sheet-screen { position: relative; box-sizing: border-box; height: 100%; overflow: hidden; display: flex; flex-direction: column; border-radius: calc(15 * var(--u)); background: var(--z-bg); color: var(--z-text); font-size: calc(8 * var(--u)); line-height: 1.2; }
.qr-sheet-screen::before { content: ""; position: absolute; top: calc(5 * var(--u)); left: calc(30 * var(--u)); width: calc(26 * var(--u)); height: calc(5 * var(--u)); border-radius: calc(2.5 * var(--u)); background: var(--z-text); }
.qr-sheet-screen.scan { align-items: center; justify-content: center; gap: calc(12 * var(--u)); background: var(--z-camera); }
.qr-sheet-screen.name { padding: calc(16 * var(--u)) calc(8 * var(--u)) calc(10 * var(--u)); gap: calc(8 * var(--u)); }
.qr-sheet-screen.add { padding: calc(16 * var(--u)) calc(7 * var(--u)) calc(8 * var(--u)); gap: calc(6 * var(--u)); }
.qr-sheet-screen.arrived { padding: calc(16 * var(--u)) calc(7 * var(--u)) calc(8 * var(--u)); gap: calc(7 * var(--u)); }
.qr-sheet-mini-qr { position: relative; flex: none; width: calc(56 * var(--u)); height: calc(56 * var(--u)); border-radius: calc(6 * var(--u)); background: var(--z-surface); outline: calc(2 * var(--u)) solid var(--z-primary); outline-offset: calc(6 * var(--u)); }
.qr-sheet-mini-qr span { position: absolute; box-sizing: border-box; width: calc(13 * var(--u)); height: calc(13 * var(--u)); border: calc(3 * var(--u)) solid var(--z-text); }
.qr-sheet-mini-qr span:nth-child(1) { left: calc(5 * var(--u)); top: calc(5 * var(--u)); }
.qr-sheet-mini-qr span:nth-child(2) { right: calc(5 * var(--u)); top: calc(5 * var(--u)); }
.qr-sheet-mini-qr span:nth-child(3) { left: calc(5 * var(--u)); bottom: calc(5 * var(--u)); }
.qr-sheet-mini-qr span:nth-child(4) { right: calc(9 * var(--u)); bottom: calc(9 * var(--u)); width: calc(10 * var(--u)); height: calc(10 * var(--u)); border: 0; background: var(--z-text); }
.qr-sheet-mini-qr span:nth-child(5) { left: calc(24 * var(--u)); top: calc(24 * var(--u)); width: calc(8 * var(--u)); height: calc(8 * var(--u)); border: 0; background: var(--z-text); }
.qr-sheet-pill { padding: calc(4 * var(--u)) calc(8 * var(--u)); border-radius: 999px; background: var(--z-surface); font-size: calc(7 * var(--u)); font-weight: 700; white-space: nowrap; }
.qr-sheet-screen-brand { font-weight: 800; color: var(--z-primary); }
.qr-sheet-screen-label { margin-top: calc(10 * var(--u)); font-size: calc(10 * var(--u)); font-weight: 800; }
.qr-sheet-screen-title { font-size: calc(9 * var(--u)); font-weight: 800; }
.qr-sheet-field { padding: calc(6 * var(--u)); border: calc(1 * var(--u)) solid var(--z-border); border-radius: calc(6 * var(--u)); background: var(--z-surface); }
.qr-sheet-mini-button { margin-top: auto; padding: calc(7 * var(--u)) 0; border-radius: calc(7 * var(--u)); background: var(--z-primary); color: var(--z-surface); font-weight: 700; text-align: center; }
.qr-sheet-screen.add .qr-sheet-mini-button { padding: calc(6 * var(--u)) calc(4 * var(--u)); font-size: calc(7 * var(--u)); line-height: 1.25; }
.qr-sheet-mini-button.outline { padding: calc(5 * var(--u)) calc(2 * var(--u)); border: calc(1 * var(--u)) solid var(--z-primary); background: transparent; color: var(--z-primary); font-size: calc(7 * var(--u)); }
.qr-sheet-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(3 * var(--u)); }
.qr-sheet-thumb { display: block; flex: none; height: calc(22 * var(--u)); border-radius: calc(3 * var(--u)); background: var(--z-placeholder-1); }
.qr-sheet-grid .qr-sheet-thumb:nth-child(3n + 2), .qr-sheet-upload:nth-of-type(3n + 3) .qr-sheet-thumb { background: var(--z-placeholder-2); }
.qr-sheet-grid .qr-sheet-thumb:nth-child(3n), .qr-sheet-upload:nth-of-type(3n + 1) .qr-sheet-thumb { background: var(--z-placeholder-3); }
.qr-sheet-banner { display: flex; align-items: center; gap: calc(4 * var(--u)); padding: calc(5 * var(--u)); border-radius: calc(6 * var(--u)); background: var(--z-success-soft); color: var(--z-success); font-size: calc(7 * var(--u)); font-weight: 800; }
.qr-sheet-banner .icon { width: calc(9 * var(--u)); height: calc(9 * var(--u)); stroke-width: 3; }
.qr-sheet-upload { display: flex; align-items: center; gap: calc(4 * var(--u)); }
.qr-sheet-upload .qr-sheet-thumb { width: calc(16 * var(--u)); height: calc(16 * var(--u)); }
.qr-sheet-bar { flex: 1; height: calc(4 * var(--u)); border-radius: calc(2 * var(--u)); background: var(--z-success); }
/* Gastgeber-Konten (Bild 07): drei Kennzahlkarten, Suche mit Filterchips in einer Zeile, Name über E-Mail. */
.admin-host-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; overflow: visible; }
.admin-host-kpis .admin-kpi { gap: 4px; padding: 16px; border-radius: var(--z-radius); }
.admin-host-kpis .admin-kpi dt { font-size: .8125rem; }
.admin-host-kpis .admin-kpi strong { font-size: 1.6rem; font-weight: 800; }
.admin-host-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 16px; }
.admin-host-toolbar .gallery-search { flex: 1 1 260px; min-width: 0; }
.admin-host-toolbar .host-state-chips { margin: 0; }
.admin-host-identity { display: flex; flex-direction: column; min-width: 0; }
.admin-host-email { color: var(--z-muted); font-size: .8125rem; overflow-wrap: anywhere; }
.admin-host-deletion { color: var(--z-danger); font-size: .8125rem; font-weight: 600; }

/* „Seite ansehen“ unter jedem Betreibertext (Issue 124): öffnet die öffentliche Seite in einem neuen Tab. */
.admin-page-link { margin: -6px 0 8px; font-size: .875rem; }
.admin-page-link a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--z-primary-strong); font-weight: 600; }
.admin-page-link .icon { width: 16px; height: 16px; stroke-width: 2; }
