/* Aplikacja Ślubna – style */
/* Czcionki hostowane lokalnie (SIL Open Font License) – bez wysyłania adresów IP gości do Google */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/inter-latin-ext-400-normal.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/inter-latin-400-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/inter-latin-ext-500-normal.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/inter-latin-500-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/inter-latin-ext-600-normal.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/inter-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/cormorant-garamond-latin-ext-500-normal.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/cormorant-garamond-latin-500-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/cormorant-garamond-latin-ext-600-normal.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/cormorant-garamond-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/cormorant-garamond-latin-ext-700-normal.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/cormorant-garamond-latin-700-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Great Vibes'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/great-vibes-latin-ext-400-normal.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Great Vibes'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/great-vibes-latin-400-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root {
  --bg: #f7f5f1;
  --surface: #ffffff;
  --surface-2: #f3f0ea;
  --text: #2e2a25;
  --muted: #7a7166;
  --line: #e9e4dc;
  --accent: #a8875a;
  --accent-strong: #8c6d42;
  --accent-soft: #f3ebdf;
  --ok: #4f7a5a;
  --ok-soft: #e5efe6;
  --warn: #a8732a;
  --warn-soft: #f8ecd9;
  --danger: #b0473f;
  --danger-soft: #f7e3e1;
  --on-accent: #fff;
  --radius: 16px;
  --radius-sm: 10px;
  --shadow: 0 1px 2px rgba(46, 42, 37, .04);
  --ring: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Cormorant Garamond", Georgia, serif;
  --font-script: "Great Vibes", "Brush Script MT", cursive;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #1b1916;
    --surface: #24211d;
    --surface-2: #2c2823;
    --text: #efe9df;
    --muted: #a99f92;
    --line: #3a352e;
    --accent: #c9a873;
    --accent-strong: #dcbd8a;
    --accent-soft: #352e24;
    --ok-soft: #26352a;
    --warn-soft: #3a2f1f;
    --danger-soft: #3d2523;
    --shadow: 0 1px 2px rgba(0, 0, 0, .25);
  }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 15px/1.6 var(--font-body);
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}
img, video { max-width: 100%; }
a { color: var(--accent-strong); }
h1, h2, h3 { font-family: var(--font-display); font-weight: 600; line-height: 1.15; margin: 0 0 .6em; }
h1 { font-size: 2.15rem; letter-spacing: -.01em; }
h2 { font-size: 1.5rem; margin-top: .4em; }
h3 { font-size: 1.2rem; }
code { background: var(--surface-2); padding: .1em .35em; border-radius: 6px; font-size: .9em; }
[hidden] { display: none !important; }
.muted { color: var(--muted); }
.small { font-size: .85rem; }
.center { text-align: center; }
.inline { display: inline; }
.row { display: flex; gap: .6rem; align-items: center; }
.row.wrap { flex-wrap: wrap; }

/* ---------- Layout ---------- */
/* Górny pasek: admin, logowanie, strona główna */
.topbar {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
  padding: .7rem 1.5rem; background: color-mix(in srgb, var(--surface) 92%, transparent); border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 20; backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px);
}
.brand { display: inline-flex; align-items: center; gap: .55rem; font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; color: var(--text); text-decoration: none; margin-right: auto; }
.brand-mark { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: var(--accent-soft); color: var(--accent-strong); }
.brand-mark .icon { width: 17px; height: 17px; }
.topbar-date { color: var(--muted); font-size: .9rem; }
.topnav { display: flex; gap: .25rem; align-items: center; flex-wrap: wrap; }
.topnav a, .topnav-logout { display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .8rem; border-radius: var(--radius-sm); color: var(--muted); text-decoration: none; font: 500 .92rem var(--font-body); background: none; border: 0; cursor: pointer; }
.topnav a:hover, .topnav-logout:hover { background: var(--surface-2); color: var(--text); }
.topnav a.active { background: var(--accent-soft); color: var(--accent-strong); }
.topnav-logout:hover { color: var(--danger); }
.link-button { background: none; border: 0; color: var(--muted); font: inherit; cursor: pointer; padding: 0; }
.link-button:hover { color: var(--danger); }
.container { max-width: 1180px; margin: 0 auto; padding: 2rem 1.5rem 3rem; }
.footer { text-align: center; padding: 1rem; }
@media (max-width: 640px) {
  .topbar { padding: .6rem 1rem; }
  .topnav span { display: none; }
  .topnav a, .topnav-logout { padding: .55rem; }
  .container { padding: 1.25rem 1rem 3rem; }
}

/* Panel pary: boczne menu z sekcjami */
.panel-shell { display: grid; grid-template-columns: 264px minmax(0, 1fr); min-height: 100vh; }
.sidenav {
  background: var(--surface); border-right: 1px solid var(--line); display: flex; flex-direction: column;
  position: sticky; top: 0; height: 100vh; overflow-y: auto; overscroll-behavior: contain; z-index: 40;
  scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--accent) 35%, transparent) transparent;
}
/* Długie menu przewija się w całości – części nie mogą się ściskać (nagłówek nachodził na „Pulpit”) */
.sidenav > * { flex-shrink: 0; }
.sidenav::-webkit-scrollbar { width: 6px; }
.sidenav::-webkit-scrollbar-track { background: transparent; }
.sidenav::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 35%, transparent); border-radius: 6px; }
.sidenav-head { position: relative; padding: 1.25rem 1.1rem 1rem; border-bottom: 1px solid var(--line); }
.sidenav-brand { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--text); }
.sidenav-monogram { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border-radius: 12px; background: var(--accent); color: var(--on-accent); font: 600 .8rem var(--font-body); letter-spacing: -.02em; }
.sidenav-names { font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; line-height: 1.15; }
.sidenav-date { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem .45rem; margin-top: .8rem; font-size: .84rem; color: var(--muted); }
.sidenav-date .icon { color: var(--accent); }
.sidenav .sidenav-close { display: none; position: absolute; top: .9rem; right: .8rem; }
.sidenav-nav { padding: .6rem .7rem; display: flex; flex-direction: column; gap: 1px; flex: 1; }
.sidenav-label { margin: .9rem .7rem .3rem; font-size: .7rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.sidenav-nav a, .sidenav-logout, .sidenav-install {
  position: relative; display: flex; gap: .7rem; align-items: center; padding: .52rem .75rem; border-radius: var(--radius-sm);
  color: var(--text); text-decoration: none; font: 500 .92rem var(--font-body); background: none; border: 0; width: 100%; cursor: pointer; text-align: left;
}
.sidenav-nav a:hover, .sidenav-logout:hover, .sidenav-install:hover { background: var(--surface-2); }
.sidenav-nav a.active { background: var(--accent-soft); color: var(--accent-strong); font-weight: 600; }
.sidenav-nav a.active::before { content: ""; position: absolute; left: -.7rem; top: .45rem; bottom: .45rem; width: 3px; border-radius: 0 3px 3px 0; background: var(--accent); }
.nav-icon { width: 18px !important; height: 18px !important; color: var(--muted); }
.sidenav-nav a.active .nav-icon { color: var(--accent-strong); }
.sidenav-foot { padding: .6rem .7rem 1rem; border-top: 1px solid var(--line); }
.sidenav-logout { color: var(--muted); }
.sidenav-logout:hover { color: var(--danger); }
.sidenav-logout:hover .nav-icon { color: var(--danger); }
.panel-main { padding: 2rem 2.25rem 3rem; min-width: 0; width: 100%; max-width: 1240px; }
.icon-btn { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: var(--radius-sm); border: 1px solid var(--line); background: var(--surface); color: var(--text); cursor: pointer; flex: none; }
.icon-btn:hover { background: var(--surface-2); }
.icon-btn .icon { width: 20px; height: 20px; }
.mobilebar, .panel-tabbar, .nav-backdrop { display: none; }

@media (max-width: 1000px) {
  .panel-shell { grid-template-columns: 1fr; min-height: calc(100dvh - 58px); }
  .mobilebar {
    display: flex; align-items: center; gap: .75rem; padding: .6rem 1rem; position: sticky; top: 0; z-index: 30;
    background: color-mix(in srgb, var(--surface) 92%, transparent); border-bottom: 1px solid var(--line);
    backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px);
  }
  .mobilebar-brand { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; color: var(--text); text-decoration: none; margin-right: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .sidenav { position: fixed; top: 0; left: 0; bottom: 0; width: min(300px, 86vw); height: auto; transform: translateX(-100%); visibility: hidden; transition: transform .25s cubic-bezier(.2,.7,.2,1), visibility 0s .25s; }
  .nav-open .sidenav { transform: none; visibility: visible; transition: transform .25s cubic-bezier(.2,.7,.2,1); }
  .sidenav .sidenav-close { display: inline-grid; }
  .nav-backdrop { display: block; position: fixed; inset: 0; background: rgba(20, 16, 12, .4); z-index: 35; }
  .nav-backdrop[hidden] { display: none; }
  .nav-open { overflow: hidden; }
  .panel-main { padding: 1.25rem 1rem calc(5.5rem + env(safe-area-inset-bottom)); }
  .panel-tabbar {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; padding: .35rem .4rem calc(.35rem + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--surface) 94%, transparent); border-top: 1px solid var(--line);
    backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px);
  }
  .panel-tabbar a, .panel-tabbar button { flex: 1; display: flex; flex-direction: column; align-items: center; gap: .15rem; padding: .35rem 0; border-radius: var(--radius-sm); color: var(--muted); text-decoration: none; font: 500 .7rem var(--font-body); background: none; border: 0; cursor: pointer; }
  .panel-tabbar .icon { width: 22px; height: 22px; }
  .panel-tabbar a.active, .panel-tabbar button.active { color: var(--accent-strong); }
  .panel-tabbar a.active .icon, .panel-tabbar button.active .icon { background: var(--accent-soft); border-radius: 999px; padding: 3px 16px; box-sizing: content-box; margin: -3px 0; }
  h1 { font-size: 1.7rem; }
}

/* ---------- Components ---------- */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.4rem 1.5rem; box-shadow: var(--shadow); margin-bottom: 1.25rem; }
/* Panele: tytuły kart prostym krojem – czytelniej niż ozdobny szeryf */
.layout-panel .card h2, .layout-main .card h2 { font-family: var(--font-body); font-size: 1.05rem; font-weight: 600; letter-spacing: 0; margin: 0 0 1rem; display: flex; align-items: center; gap: .5rem; }
.layout-panel .card h3, .layout-main .card h3 { font-family: var(--font-body); font-size: .95rem; font-weight: 600; }
.layout-panel .card h2 > .icon, .layout-main .card h2 > .icon { width: 1.15em; height: 1.15em; }
.card.narrow { max-width: 460px; margin: 2rem auto; }
.auth-card { max-width: 420px; margin: clamp(1.5rem, 8vh, 5rem) auto 2rem; padding: 2rem 2rem 1.5rem; }
.auth-head { text-align: center; margin-bottom: 1.5rem; }
.auth-head h1 { margin: .9rem 0 .25rem; font-size: 1.9rem; }
.auth-head p { margin: 0; font-size: .92rem; }
.auth-mark { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--accent-soft); color: var(--accent-strong); }
.auth-mark .icon { width: 24px; height: 24px; }
.auth-foot { text-align: center; margin: 1.25rem 0 0; padding-top: 1rem; border-top: 1px solid var(--line); }
.btn-lg { min-height: 46px; font-size: .97rem; }
@media (max-width: 480px) { .auth-card { padding: 1.5rem 1.25rem 1.25rem; } }
.card.empty, .empty { color: var(--muted); text-align: center; padding: 2rem 1rem; }
.page-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.page-head h1 { margin: 0; }
.page-sub { margin: .3rem 0 0; color: var(--muted); font-size: .88rem; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1.25rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1.25rem; }
.grid-2.align-start { align-items: start; gap: 1.25rem; }
@media (max-width: 720px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  min-height: 40px; padding: .5rem 1.05rem; border-radius: var(--radius-sm); border: 1px solid var(--line);
  background: var(--surface); color: var(--text); font: 600 .9rem var(--font-body); line-height: 1.2; white-space: nowrap;
  text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, transform .05s;
}
.btn:hover { border-color: color-mix(in srgb, var(--accent) 60%, var(--line)); background: var(--surface-2); }
.btn:focus-visible { outline: 0; box-shadow: var(--ring); }
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.btn-primary:hover { background: var(--accent-strong); border-color: var(--accent-strong); }
.btn-ghost { background: transparent; }
.btn-ghost:hover { background: var(--surface-2); }
.btn-danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.btn-danger-ghost { color: var(--danger); background: transparent; }
.btn-danger-ghost:hover { background: var(--danger-soft); border-color: transparent; }
.btn-small { min-height: 32px; padding: .3rem .75rem; font-size: .84rem; border-radius: 8px; }
.btn-tiny { min-height: 26px; padding: .15rem .5rem; font-size: .75rem; border-radius: 7px; }
.btn-block { width: 100%; }
.btn:disabled { opacity: .55; cursor: wait; }

.form label { display: block; font-weight: 500; margin-bottom: 1rem; font-size: .88rem; }
.form label.check, label.check { display: flex; gap: .5rem; align-items: center; font-weight: 400; }
input, select, textarea {
  display: block; width: 100%; margin-top: .35rem; padding: .6rem .8rem; min-height: 42px;
  border: 1px solid color-mix(in srgb, var(--line) 70%, var(--muted)); border-radius: var(--radius-sm); background: var(--surface); color: var(--text);
  font: 400 .97rem var(--font-body); transition: border-color .15s, box-shadow .15s;
}
input[type="checkbox"], input[type="radio"] { width: auto; display: inline-block; margin: 0; accent-color: var(--accent); }
/* Pola wyboru: nowoczesne kwadraty z animowanym ptaszkiem i radio z kropką (wszędzie poza przełącznikami) */
input[type="checkbox"]:not(.switch), input[type="radio"] {
  appearance: none; -webkit-appearance: none; position: relative; flex: none; width: 22px !important; height: 22px; min-height: 0; padding: 0; margin: 0;
  border: 2px solid color-mix(in srgb, var(--muted) 45%, var(--line)); border-radius: 7px; background: var(--surface); cursor: pointer; vertical-align: middle;
  transition: background .2s, border-color .2s, box-shadow .2s, transform .15s;
}
input[type="radio"] { border-radius: 50%; }
input[type="checkbox"]:not(.switch)::after { content: ""; position: absolute; left: 50%; top: 45%; width: 5px; height: 10px; border: solid var(--on-accent, #fff); border-width: 0 2.5px 2.5px 0; transform: translate(-50%, -50%) rotate(45deg) scale(0); transition: transform .22s cubic-bezier(.3,1.6,.5,1); }
input[type="radio"]::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--on-accent, #fff); transform: scale(0); transition: transform .22s cubic-bezier(.3,1.6,.5,1); }
input[type="checkbox"]:not(.switch):checked, input[type="radio"]:checked { background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 72%, #fff)); border-color: var(--accent); }
input[type="checkbox"]:not(.switch):checked::after { transform: translate(-50%, -50%) rotate(45deg) scale(1); }
input[type="radio"]:checked::after { transform: scale(1); }
input[type="checkbox"]:not(.switch):active, input[type="radio"]:active { transform: scale(.9); }
input[type="checkbox"]:hover, input[type="radio"]:hover { border-color: var(--accent); }
input[type="checkbox"]:focus-visible, input[type="radio"]:focus-visible { outline: 0; box-shadow: var(--ring, 0 0 0 3px color-mix(in srgb, var(--accent) 30%, transparent)); }
input[type="checkbox"]:disabled, input[type="radio"]:disabled { opacity: .45; cursor: not-allowed; }
input[type="color"] { padding: .2rem; height: 2.6rem; }
input:hover, select:hover, textarea:hover { border-color: var(--muted); }
input:focus, select:focus, textarea:focus { outline: 0; border-color: var(--accent); box-shadow: var(--ring); }
input::placeholder, textarea::placeholder { color: color-mix(in srgb, var(--muted) 75%, transparent); }
textarea { resize: vertical; }
.field-error { display: block; color: var(--danger); font-size: .82rem; font-weight: 400; margin-top: .25rem; }
.form-inline { display: flex; gap: .5rem; }
.form-inline input { margin: 0; }

.alert { padding: .8rem 1rem; border-radius: var(--radius-sm); margin-bottom: 1rem; border: 1px solid transparent; font-size: .93rem; }
.alert-success { background: var(--ok-soft); color: var(--ok); border-color: color-mix(in srgb, var(--ok) 25%, transparent); }
.alert-error { background: var(--danger-soft); color: var(--danger); border-color: color-mix(in srgb, var(--danger) 25%, transparent); }
.alert-info { background: var(--accent-soft); color: var(--accent-strong); }

.badge { display: inline-block; white-space: nowrap; padding: .1rem .5rem; border-radius: 999px; font-size: .75rem; font-weight: 600; background: var(--surface-2); color: var(--muted); vertical-align: middle; }
.badge-ok { background: var(--ok-soft); color: var(--ok); }
.badge-warn { background: var(--warn-soft); color: var(--warn); }
.badge-off { background: var(--danger-soft); color: var(--danger); }

.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; }
.table th { text-align: left; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; padding: .65rem .75rem; background: var(--surface-2); border-bottom: 1px solid var(--line); white-space: nowrap; }
.table th:first-child { border-radius: var(--radius-sm) 0 0 var(--radius-sm); } .table th:last-child { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.table td { padding: .75rem; border-bottom: 1px solid var(--line); vertical-align: middle; }
.table tbody tr { transition: background .12s; }
.table tbody tr:hover { background: color-mix(in srgb, var(--surface-2) 60%, transparent); }
.table tr:last-child td { border-bottom: 0; }
.table .actions { white-space: nowrap; text-align: right; }
.toolbar { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; margin-bottom: .8rem; }
.toolbar input[type="search"] { max-width: 300px; margin: 0; }

.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(116px, 1fr)); gap: .75rem; margin-bottom: 1.25rem; }
.stat { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.1rem 1.15rem; color: var(--muted); text-decoration: none; font-size: .86rem; box-shadow: var(--shadow); }
.stat span { display: block; font-family: var(--font-body); font-size: 1.75rem; font-weight: 600; color: var(--text); line-height: 1.15; letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin-bottom: .15rem; }
a.stat:hover { border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); }
.countdown { text-align: center; font-family: var(--font-display); font-size: 1.4rem; background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 25%, var(--line)); }
.countdown-num { font-size: 2.6rem; font-weight: 700; color: var(--accent-strong); margin-right: .3rem; }
.welcome { display: flex; align-items: center; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; padding: 1.6rem 1.75rem; background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 22%, var(--line)); }
.welcome h1 { margin: 0; }
.welcome-kicker { display: flex; align-items: center; gap: .4rem; margin: 0 0 .4rem; color: var(--accent-strong); font-size: .85rem; font-weight: 500; }
.welcome-count { display: flex; align-items: baseline; gap: .5rem; font-family: var(--font-display); font-size: 1.25rem; color: var(--accent-strong); }
.welcome-count .countdown-num { font-size: 3rem; line-height: 1; margin: 0; }
@media (max-width: 640px) {
  .welcome { padding: 1.25rem; } .welcome-count .countdown-num { font-size: 2.4rem; }
  .stats { grid-template-columns: 1fr 1fr; gap: .6rem; }
  .stat { padding: .85rem .9rem; font-size: .82rem; line-height: 1.35; }
  .stat span { font-size: 1.45rem; }
  .stat-icon { top: .85rem; right: .85rem; }
}
.steps li { margin-bottom: .4rem; }
.credentials { display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1rem; }
.credentials dt { color: var(--muted); }
.credentials dd { margin: 0; }
code.big { font-size: 1.2rem; padding: .3rem .6rem; }
.danger-zone { border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); }
.log { list-style: none; padding: 0; margin: 0; }
.log li { padding: .4rem 0; border-bottom: 1px solid var(--line); }
.tabs { display: flex; gap: .4rem; margin-bottom: 1rem; }
.tab { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius-sm); padding: .45rem 1rem; cursor: pointer; font: 500 .9rem var(--font-body); color: var(--text); }
.tab.active { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.pager { display: flex; gap: .3rem; flex-wrap: wrap; justify-content: center; margin: 1rem 0; }
.pager a { padding: .3rem .7rem; border-radius: 8px; border: 1px solid var(--line); text-decoration: none; }
.pager a.active { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }

.feature-list { display: grid; gap: .2rem; margin-bottom: 1rem; }
.switch-row { display: flex !important; justify-content: space-between; align-items: center; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid var(--line); margin: 0 !important; cursor: pointer; }
/* Przełącznik: tor z gradientem, sprężysta gałka z ptaszkiem. Każde pole „label.check” też jest przełącznikiem. */
.switch, label.check > input[type="checkbox"] {
  appearance: none; -webkit-appearance: none; position: relative; flex: none; width: 52px !important; height: 30px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 999px; cursor: pointer;
  background: color-mix(in srgb, var(--muted) 30%, var(--surface)); box-shadow: inset 0 1px 3px rgba(0,0,0,.14);
  transition: background .3s, box-shadow .3s;
}
.switch::before, label.check > input[type="checkbox"]::before {
  content: ""; position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 999px; background: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.22), 0 0 0 .5px rgba(0,0,0,.05); transition: transform .35s cubic-bezier(.3,1.5,.5,1), width .2s;
}
.switch::after, label.check > input[type="checkbox"]::after {
  content: ""; position: absolute; left: 12.5px; top: 9px; width: 5px; height: 10px; border: solid var(--accent); border-width: 0 2.5px 2.5px 0;
  transform: translateX(0) rotate(45deg) scale(0); opacity: 0; transition: transform .35s cubic-bezier(.3,1.5,.5,1), opacity .2s;
}
.switch:checked, label.check > input[type="checkbox"]:checked {
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 65%, #fff)); box-shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 2px 10px color-mix(in srgb, var(--accent) 35%, transparent);
}
.switch:checked::before, label.check > input[type="checkbox"]:checked::before { transform: translateX(22px); }
.switch:checked::after, label.check > input[type="checkbox"]:checked::after { transform: translateX(22px) rotate(45deg) scale(1); opacity: 1; }
.switch:active::before, label.check > input[type="checkbox"]:active::before { width: 30px; }
.switch:checked:active::before, label.check > input[type="checkbox"]:checked:active::before { transform: translateX(16px); }
.switch:focus-visible, label.check > input[type="checkbox"]:focus-visible { outline: 0; box-shadow: var(--ring, 0 0 0 3px color-mix(in srgb, var(--accent) 30%, transparent)); }
.switch:disabled, label.check > input[type="checkbox"]:disabled { opacity: .45; cursor: not-allowed; }
label.check { cursor: pointer; padding: .35rem 0; line-height: 1.35; }
.switch-row:hover .switch:not(:checked) { background: color-mix(in srgb, var(--muted) 42%, var(--surface)); }
@media (prefers-reduced-motion: reduce) { .switch::before, .switch::after, label.check > input::before, label.check > input::after { transition: none; } }

/* ---------- Home ---------- */
.hero { text-align: center; padding: 4rem 1rem; max-width: 640px; margin: 0 auto; }
.hero h1 { font-size: 3.2rem; }
.hero-ornament { font-size: 2.5rem; color: var(--accent); }
.lead { font-size: 1.15rem; color: var(--muted); }
.hero-actions { margin: 2rem 0; }

/* ---------- Gallery ---------- */
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: .75rem; }
.gallery-item { margin: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.gallery-item.is-hidden, .gb-entry.is-hidden { opacity: .45; }
.gallery-item figcaption { padding: .4rem .55rem; display: flex; justify-content: space-between; align-items: center; gap: .3rem; flex-wrap: wrap; }
.media-thumb { display: block; aspect-ratio: 1; background: var(--surface-2); position: relative; overflow: hidden; }
.media-thumb img, .media-thumb video { width: 100%; height: 100%; object-fit: cover; display: block; }
.media-thumb .play { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 2rem; text-shadow: 0 2px 8px rgba(0,0,0,.5); pointer-events: none; }
.media-thumb.is-file { display: grid; place-items: center; text-align: center; text-decoration: none; color: var(--muted); font-size: 2rem; }
.lightbox { position: fixed; inset: 0; background: rgba(15, 12, 10, .94); z-index: 100; display: flex; align-items: center; justify-content: center; }
.lightbox-stage { max-width: 94vw; max-height: 88vh; display: flex; }
.lightbox-stage img, .lightbox-stage video { max-width: 94vw; max-height: 88vh; object-fit: contain; border-radius: 6px; }
.lightbox-close, .lightbox-nav { position: absolute; background: rgba(255,255,255,.12); color: #fff; border: 0; border-radius: 50%; width: 46px; height: 46px; font-size: 1.8rem; cursor: pointer; line-height: 1; }
.lightbox-close { top: 14px; right: 14px; }
.lightbox-nav.prev { left: 10px; top: 50%; }
.lightbox-nav.next { right: 10px; top: 50%; }

/* ---------- Guestbook ---------- */
.guestbook { display: grid; gap: 1rem; }
.gb-entry { margin: 0; }
.gb-message { font-family: var(--font-display); font-size: 1.25rem; line-height: 1.4; }
.gb-media { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: .4rem; margin-top: .8rem; }
.gb-media .media-thumb { border-radius: 8px; }
.gb-entry footer { margin-top: .8rem; display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
.gb-author { font-weight: 600; color: var(--accent-strong); }
.gb-entry footer form { margin-left: auto; }

/* ---------- Seating ---------- */
.seating-editor { display: grid; grid-template-columns: 320px 1fr; gap: 1rem; align-items: start; }
.seating-side { position: sticky; top: 1.5rem; max-height: calc(100vh - 3rem); overflow-y: auto; }
.seating-side h3 { margin-top: 1rem; }
.guest-pool { list-style: none; padding: 0; margin: .5rem 0 0; display: grid; gap: .3rem; }
.guest-chip { padding: .4rem .65rem; background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; cursor: grab; font-size: .88rem; user-select: none; touch-action: none; }
.guest-chip.selected { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.guest-chip .small { opacity: .75; }
.seated-list { display: flex; flex-wrap: wrap; gap: .3rem; margin-bottom: .8rem; }
.seated-list .guest-chip { cursor: pointer; }
.seated-list .guest-chip::after { content: " ×"; opacity: .6; }
.seating-canvas-wrap { padding: .5rem; overflow: auto; }
.seating-canvas {
  position: relative; width: 1400px; height: 900px; border-radius: 10px;
  background-color: var(--surface-2);
  background-image: radial-gradient(circle, var(--line) 1px, transparent 1px);
  background-size: 20px 20px;
}
.seating-canvas.readonly { width: 100%; height: auto; aspect-ratio: 14 / 9; overflow: hidden; }
.seating-canvas.readonly .s-table-layer { position: absolute; left: 0; top: 0; width: 1400px; height: 900px; transform-origin: 0 0; }
.s-table {
  position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  background: var(--surface); border: 2px solid var(--accent); color: var(--text); cursor: move; user-select: none; touch-action: none;
  box-shadow: var(--shadow); padding: .4rem; font-size: .85rem; overflow: hidden;
}
.s-table.round { border-radius: 50%; }
.s-table.rect { border-radius: 10px; }
.s-table.element { border: 2px dashed var(--muted); background: transparent; color: var(--muted); border-radius: 8px; box-shadow: none; }
.s-table.selected { outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent); }
.s-table.drop-target { background: var(--accent-soft); }
.s-table.full { border-color: var(--ok); }
.s-table.over { border-color: var(--danger); }
.s-table.mine { background: var(--accent); color: var(--on-accent); animation: pulse 1.6s ease-in-out infinite; }
.s-table.found { background: var(--accent-soft); outline: 3px solid var(--accent); }
.readonly .s-table { cursor: default; }
.s-table-name { font-weight: 600; line-height: 1.15; }
.s-table-count { font-size: .75rem; opacity: .8; }
@keyframes pulse { 50% { box-shadow: 0 0 0 10px color-mix(in srgb, var(--accent) 25%, transparent); } }
@media (max-width: 860px) {
  .seating-editor { grid-template-columns: 1fr; }
  /* Telefon: plan przyklejony u góry, lista gości pod nim – można przeciągać palcem z listy na krzesło */
  .seating-canvas-wrap { order: -1; position: sticky; top: 58px; z-index: 5; height: 55vh; margin-bottom: .8rem; padding: .3rem; }
  .seating-side { order: 1; }
  .seating-side { position: static; max-height: none; }
}
.my-seat { text-align: center; }
.my-seat-table { font-family: var(--font-display); font-size: 2.2rem; font-weight: 700; color: var(--accent-strong); margin: .2rem 0; }
.seat-results { list-style: none; padding: 0; margin: .5rem 0 0; }
.seat-results li { padding: .5rem 0; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; gap: 1rem; cursor: pointer; }

/* Zaproszenie: style w invitation.css */
.layout-bare { background: var(--surface-2); }

/* ---------- Guest panel ---------- */
.layout-guest { padding-bottom: 80px; }
.guest-header { text-align: center; padding: 1.6rem 1rem 1rem; background: linear-gradient(180deg, var(--accent-soft), var(--bg)); }
.guest-names { font-family: var(--font-script); font-size: 2.4rem; color: var(--text); text-decoration: none; line-height: 1.1; }
.guest-names .amp { color: var(--accent); }
.guest-date { color: var(--muted); font-size: .9rem; letter-spacing: .1em; text-transform: uppercase; }
.guest-main { max-width: 640px; margin: 0 auto; padding: 1rem; }
.guest-welcome { text-align: center; margin-bottom: 1rem; }
.guest-hello { font-family: var(--font-display); font-size: 1.8rem; margin: 0; }
.tiles { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin-bottom: 1.5rem; }
.tile { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.2rem .8rem; text-align: center; text-decoration: none; color: var(--text); font-weight: 600; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: .3rem; align-items: center; }
.tile small { font-weight: 400; color: var(--muted); }
.tile-icon { width: 2rem !important; height: 2rem !important; color: var(--accent); }
.tile-accent { grid-column: 1 / -1; background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.tile-accent .tile-icon { color: var(--on-accent); }
.tabbar { position: fixed; bottom: 0; left: 0; right: 0; display: flex; background: var(--surface); border-top: 1px solid var(--line); padding: .3rem .3rem calc(.3rem + env(safe-area-inset-bottom)); z-index: 30; }
.tabbar a { flex: 1; display: flex; flex-direction: column; align-items: center; gap: .1rem; text-decoration: none; color: var(--muted); font-size: .72rem; padding: .3rem 0; border-radius: 10px; }
.tabbar a .icon { width: 1.4rem; height: 1.4rem; }
.tabbar a.active { color: var(--accent-strong); background: var(--accent-soft); }
.choice-row { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin-bottom: 1rem; }
.rsvp-fam { border: 1px solid var(--line); border-radius: 14px; padding: .7rem .9rem .8rem; margin: 0 0 1rem; display: grid; gap: .45rem; }
.rsvp-fam legend { font-weight: 600; padding: 0 .3rem; }
.choice input { position: absolute; opacity: 0; }
.choice span { display: block; text-align: center; padding: .9rem; border: 2px solid var(--line); border-radius: 12px; cursor: pointer; font-weight: 600; }
.choice input:checked + span { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-strong); }
.choice input:focus-visible + span { outline: 2px solid var(--accent); }

/* ---------- Upload ---------- */
.dropzone { display: flex; flex-direction: column; align-items: center; gap: .5rem; text-align: center; border: 2px dashed var(--accent); border-radius: var(--radius); padding: 2rem 1rem; cursor: pointer; background: var(--accent-soft); margin-bottom: .8rem; }
.dropzone.drag { background: var(--surface-2); }
.dropzone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.dropzone-icon { width: 2.6rem !important; height: 2.6rem !important; color: var(--accent); }
.camera-btn { margin-bottom: 1rem; }
.upload-list { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: .5rem; }
.upload-item { display: grid; grid-template-columns: 48px 1fr auto; gap: .6rem; align-items: center; background: var(--surface-2); border-radius: 10px; padding: .45rem; }
.upload-item .thumb { width: 48px; height: 48px; border-radius: 8px; object-fit: cover; background: var(--line); display: grid; place-items: center; font-size: 1.3rem; overflow: hidden; }
.upload-item .thumb img { width: 100%; height: 100%; object-fit: cover; }
.upload-item .name { font-size: .85rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.progress { height: 6px; background: var(--line); border-radius: 999px; overflow: hidden; margin-top: .3rem; }
.progress > i { display: block; height: 100%; width: 0; background: var(--accent); transition: width .2s; }
.upload-item.done .progress > i { background: var(--ok); }
.upload-item.error .progress > i { background: var(--danger); }
.upload-item .status { font-size: .78rem; color: var(--muted); }
.upload-item.error .status { color: var(--danger); }
.upload-item.error .name { white-space: normal; line-height: 1.4; }
.upload-item.is-waiting .progress > i { background: var(--warn); }
.upload-item.is-waiting .status { color: var(--warn); }
.upload-item .upload-retry { white-space: nowrap; }

/* ---------- QR ---------- */
.qr-poster { text-align: center; max-width: 520px; margin: 0 auto 1rem; padding: 2.5rem 2rem; background: var(--surface); border: 1px solid var(--accent); border-radius: var(--radius); }
.qr-poster-kicker { text-transform: uppercase; letter-spacing: .25em; font-size: .8rem; color: var(--accent-strong); }
.qr-poster-names { font-family: var(--font-script); font-size: 2.8rem; font-weight: 400; }
.qr { display: inline-block; background: #fff; padding: 8px; border-radius: 8px; line-height: 0; }
.qr img, .qr svg { display: block; image-rendering: pixelated; }
.qr-url { word-break: break-all; }
.qr-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: .8rem; }
.qr-card { display: flex; gap: .8rem; align-items: center; background: var(--surface); border: 1px dashed var(--line); border-radius: 10px; padding: .7rem; break-inside: avoid; }

@media print {
  body { background: #fff; color: #000; }
  .topbar, .sidenav, .mobilebar, .panel-tabbar, .nav-backdrop, .footer, .no-print, .tabbar, .alert { display: none !important; }
  .panel-shell { display: block; }
  .panel-main { padding: 0; }
  [data-tab-panel][hidden] { display: none !important; }
  .qr-poster { border: 0; page-break-inside: avoid; }
  .qr-cards { grid-template-columns: repeat(2, 1fr); }
  .qr-card { border: 1px dashed #999; }
}

/* ---------- Szaty graficzne: wybór ---------- */
.theme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.theme-option { display: flex !important; flex-direction: column; gap: .5rem; cursor: pointer; margin: 0 !important; font-weight: 400 !important; }
.theme-option input { position: absolute; opacity: 0; }
.theme-option .theme-preview { transition: transform .15s, box-shadow .15s; }
.theme-option:hover .theme-preview { transform: translateY(-2px); }
.theme-option input:checked + .theme-preview { box-shadow: 0 0 0 3px var(--surface), 0 0 0 6px var(--accent); }
.theme-option input:focus-visible + .theme-preview { outline: 3px solid var(--accent); }

/* ---------- Wirtualna Księga Gości ---------- */
.gb-card { position: relative; border-radius: var(--radius); padding: 1.4rem 1.4rem 1rem; border: 1px solid var(--line); box-shadow: var(--shadow); color: #2e2a25; }
.gb-card .muted { color: #7a7166; }
.gb-style-paper { background: #fffdf8; }
.gb-style-blush { background: #fff0f3; }
.gb-style-sage  { background: #edf3ea; }
.gb-style-gold  { background: linear-gradient(135deg, #fbf3df, #f3e4bf); }
.gb-style-sky   { background: #ecf3fb; }
.gb-style-kraft { background: #ecdcc0; background-image: repeating-linear-gradient(0deg, rgba(122,92,62,.05) 0 1px, transparent 1px 7px); }
.gb-card .gb-author { color: #8c6d42; font-style: italic; }
.gb-sticker { position: absolute; top: -16px; right: 16px; font-size: 2.4rem; line-height: 1; filter: drop-shadow(0 3px 4px rgba(0,0,0,.15)); transform: rotate(8deg); }
.gb-reactions { display: flex; gap: .3rem; flex-wrap: wrap; margin-top: .8rem; }
.gb-react { border: 1px solid rgba(0,0,0,.08); background: rgba(255,255,255,.7); border-radius: 999px; padding: .2rem .55rem; font-size: 1rem; cursor: pointer; display: inline-flex; gap: .25rem; align-items: center; color: #2e2a25; }
.gb-react span { font-size: .78rem; font-weight: 600; min-width: .4em; }
.gb-react.mine { background: #fff; border-color: #a8875a; box-shadow: 0 0 0 1px #a8875a inset; }
.gb-react.pop { animation: gb-pop .35s ease; }
@keyframes gb-pop { 40% { transform: scale(1.35); } }
.gb-manage { margin-top: .6rem; display: flex; gap: .3rem; justify-content: flex-end; }
.gb-textarea { position: relative; margin-bottom: .6rem; }
.gb-textarea textarea { padding-right: 3rem; margin-top: .3rem; }
.emoji-toggle { position: absolute; right: .5rem; bottom: .5rem; border: 0; background: var(--accent-soft); border-radius: 50%; width: 2.2rem; height: 2.2rem; font-size: 1.2rem; cursor: pointer; }
.emoji-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(2.4rem, 1fr)); gap: .15rem; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: .4rem; margin-bottom: .9rem; }
.emoji-picker button { border: 0; background: none; font-size: 1.45rem; padding: .2rem; border-radius: 8px; cursor: pointer; }
.emoji-picker button:hover { background: var(--surface); }
.gb-options { border: 0; padding: 0; margin: 0 0 .9rem; }
.gb-options legend { font-weight: 500; font-size: .92rem; margin-bottom: .35rem; padding: 0; }
.sticker-row, .style-row { display: flex; flex-wrap: wrap; gap: .35rem; }
.sticker-opt input, .style-opt input { position: absolute; opacity: 0; }
.sticker-opt span { display: grid; place-items: center; min-width: 2.5rem; height: 2.5rem; border: 2px solid var(--line); border-radius: 12px; font-size: 1.4rem; cursor: pointer; background: var(--surface); padding: 0 .3rem; }
.sticker-opt span:not(:empty) { font-size: 1.4rem; }
.sticker-opt:first-child span { font-size: .75rem; color: var(--muted); }
.style-opt span { display: inline-block; padding: .4rem .8rem; border: 2px solid rgba(0,0,0,.08); border-radius: 999px; font-size: .82rem; cursor: pointer; color: #2e2a25; }
.sticker-opt input:checked + span, .style-opt input:checked + span { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.sticker-opt input:focus-visible + span, .style-opt input:focus-visible + span { outline: 2px solid var(--accent); }
.guestbook { margin-top: 1.5rem; gap: 1.6rem; }

/* ---------- Księga jako książka ---------- */
.book-shell { max-width: 1100px; margin: 0 auto; padding: 1rem; }
.book-toolbar { display: flex; justify-content: space-between; align-items: center; gap: .6rem; margin-bottom: 1rem; }
.book { position: relative; display: grid; grid-template-columns: 1fr; perspective: 2000px; }
.book.spread { grid-template-columns: 1fr 1fr; box-shadow: 0 20px 50px rgba(0,0,0,.18); border-radius: 6px; }
.book-page { display: none; min-height: min(78vh, 720px); padding: 2.4rem 2.2rem 2.8rem; position: relative; color: #2e2a25; overflow: hidden; flex-direction: column; justify-content: center; }
.book-page.is-visible { display: flex; }
.book:not(.spread) .book-page { border-radius: 6px; box-shadow: 0 12px 30px rgba(0,0,0,.15); }
.book-page.is-left { border-right: 1px solid rgba(0,0,0,.08); box-shadow: inset -24px 0 30px -20px rgba(0,0,0,.18); border-radius: 6px 0 0 6px; }
.book-page.is-right { box-shadow: inset 24px 0 30px -20px rgba(0,0,0,.18); border-radius: 0 6px 6px 0; }
.book-page.flip-next { animation: flip-next .5s ease both; transform-origin: left center; }
.book-page.flip-prev { animation: flip-prev .5s ease both; transform-origin: right center; }
@keyframes flip-next { from { transform: rotateY(-25deg); opacity: .3; } to { transform: none; opacity: 1; } }
@keyframes flip-prev { from { transform: rotateY(25deg); opacity: .3; } to { transform: none; opacity: 1; } }
.book-cover, .book-end { text-align: center; align-items: center; background: var(--hero, linear-gradient(180deg, var(--accent-soft), var(--bg))); color: var(--text); }
.book-orn { font-size: 2.6rem; color: var(--accent); }
.book-kicker { text-transform: uppercase; letter-spacing: .35em; font-size: .8rem; color: var(--accent-strong); }
.book-names { font-family: var(--font-script); font-weight: 400; font-size: 3.4rem; line-height: 1.1; margin: .4rem 0; }
.book-names span { color: var(--accent); }
.book-names.small-names { font-size: 2.2rem; }
.book-date { font-family: var(--font-display); font-size: 1.2rem; }
.book-sticker { position: absolute; top: 1.2rem; right: 1.4rem; font-size: 3rem; transform: rotate(10deg); }
.book-photos { display: grid; gap: .5rem; margin-bottom: 1.2rem; }
.book-photos.n2, .book-photos.n4 { grid-template-columns: 1fr 1fr; }
.book-photos.n3 { grid-template-columns: 1fr 1fr 1fr; }
.book-photos img { width: 100%; max-height: 300px; object-fit: cover; border-radius: 4px; border: 6px solid #fff; box-shadow: 0 3px 10px rgba(0,0,0,.15); }
.book-photos.n1 img { transform: rotate(-1.5deg); }
.book-video { display: grid; place-items: center; height: 120px; background: #eee; border-radius: 4px; font-size: 2rem; }
.book-message { font-family: var(--font-display); font-size: 1.45rem; line-height: 1.5; }
.book-author { margin-top: 1.2rem; font-family: var(--font-script); font-size: 1.6rem; color: #8c6d42; }
.book-meta { color: #7a7166; margin-top: .3rem; }
.book-num { position: absolute; bottom: 1rem; left: 0; right: 0; text-align: center; color: #a39a8f; }

/* Przewracanie kartki: obrót na grzbiecie z cieniem */
.book { position: relative; }
.book-leaf { position: absolute; top: 0; bottom: 0; z-index: 5; transform-style: preserve-3d; pointer-events: none; }
.leaf-2.turn-next { left: 50%; width: 50%; transform-origin: left center; animation: leaf-next .9s cubic-bezier(.45,.05,.25,1) both; }
.leaf-2.turn-prev { left: 0; width: 50%; transform-origin: right center; animation: leaf-prev .9s cubic-bezier(.45,.05,.25,1) both; }
.leaf-1 { left: 0; width: 100%; transform-origin: left center; }
.leaf-1.turn-next { animation: leaf-away .8s cubic-bezier(.45,.05,.25,1) both; }
.leaf-1.turn-prev { animation: leaf-back .8s cubic-bezier(.45,.05,.25,1) both; }
.leaf-face { position: absolute !important; inset: 0; display: flex !important; flex-direction: column; justify-content: center; min-height: 0 !important; backface-visibility: hidden; -webkit-backface-visibility: hidden; overflow: hidden; }
.leaf-face.back { transform: rotateY(180deg); }
.leaf-face::after { content: ""; position: absolute; inset: 0; pointer-events: none; animation: leaf-shade .9s ease both; }
.leaf-2.turn-next .front::after, .leaf-1 .front::after { background: linear-gradient(90deg, rgba(0,0,0,.18), transparent 35%, rgba(255,255,255,.12)); }
.leaf-2.turn-next .back::after { background: linear-gradient(270deg, rgba(0,0,0,.2), transparent 40%); }
.leaf-2.turn-prev .front::after { background: linear-gradient(270deg, rgba(0,0,0,.18), transparent 35%); }
.leaf-2.turn-prev .back::after { background: linear-gradient(90deg, rgba(0,0,0,.2), transparent 40%); }
.leaf-face.hold { position: absolute !important; top: 0; bottom: 0; width: 50%; z-index: 4; }
.leaf-face.hold-left { left: 0; inset: 0 auto 0 0; }
.leaf-face.hold-right { left: 50%; inset: 0 0 0 50%; }
.book-blank { background: #fffdf8; }
@keyframes leaf-next { 0% { transform: perspective(2200px) rotateY(0); } 50% { transform: perspective(2200px) rotateY(-90deg) scaleX(1.03); } 100% { transform: perspective(2200px) rotateY(-180deg); } }
@keyframes leaf-prev { 0% { transform: perspective(2200px) rotateY(0); } 50% { transform: perspective(2200px) rotateY(90deg) scaleX(1.03); } 100% { transform: perspective(2200px) rotateY(180deg); } }
@keyframes leaf-away { 0% { transform: perspective(1600px) rotateY(0); opacity: 1; } 100% { transform: perspective(1600px) rotateY(-105deg); opacity: .2; } }
@keyframes leaf-back { 0% { transform: perspective(1600px) rotateY(-105deg); opacity: .2; } 100% { transform: perspective(1600px) rotateY(0); opacity: 1; } }
@keyframes leaf-shade { 0% { opacity: .2; } 50% { opacity: 1; } 100% { opacity: .2; } }
/* Gięta kartka (guestbook.js → curl): paski zagnieżdżone w 3D, każdy z przodem, tyłem i cieniem */
.book { perspective: 2600px; perspective-origin: 50% 40%; }
.book-leaf.curl { transform-style: preserve-3d; z-index: 7; }
.curl-strip { position: absolute; top: 0; bottom: 0; transform-style: preserve-3d; will-change: transform; }
.curl-face { position: absolute; inset: 0; overflow: hidden; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.curl-face.back { transform: rotateY(180deg); }
.curl-page { position: absolute !important; top: 0; display: flex !important; min-height: 0 !important; border-radius: 0 !important; box-shadow: none !important; cursor: default; }
.curl-shade { position: absolute; inset: 0; opacity: 0; pointer-events: none; background: rgb(70, 50, 30); }
.curl-face.back .curl-shade { background: rgb(60, 45, 30); }
/* Delikatna księga: papier z lekkim ziarnem, krawędzie kartek pod spodem, miękki cień */
.book.spread { box-shadow: 0 1px 0 #fff, 3px 4px 0 -1px #f4efe5, 5px 7px 0 -2px #e8e0d0, -3px 4px 0 -1px #f4efe5, -5px 7px 0 -2px #e8e0d0, 0 26px 50px -18px rgba(70, 50, 30, .35); border-radius: 4px; }
.book-page:not(.book-cover):not(.book-end)::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(rgba(140, 110, 70, .06) 1px, transparent 1px) 0 0 / 5px 5px, linear-gradient(180deg, rgba(255,255,255,.3), rgba(255,255,255,0) 30%); }
.curl-face, .leaf-face.hold { background-color: #fffdf8; }
.book-page.is-left { box-shadow: inset -30px 0 36px -26px rgba(70, 50, 30, .22); }
.book-page.is-right { box-shadow: inset 30px 0 36px -26px rgba(70, 50, 30, .22); }
.book.spread::after { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 40px; margin-left: -20px; z-index: 6; pointer-events: none; background: linear-gradient(90deg, transparent, rgba(0,0,0,.12) 45%, rgba(0,0,0,.18) 50%, rgba(0,0,0,.12) 55%, transparent); }
.book-page.is-visible { cursor: pointer; }
.book-print-mode { display: inline-flex !important; align-items: center; gap: .4rem; margin: 0 !important; }
.book-print-mode select { margin: 0; min-height: 34px; width: auto; padding: .2rem .5rem; }

/* Wydruk księgi: A4, okładka, ramka na każdej stronie, kolory kartek, 1 lub 2 wpisy na stronę */
@media print {
  /* Margines strony 0 = przeglądarka nie dopisuje nagłówka (data, tytuł) i stopki (adres, numer strony); odstęp dają same kartki */
  @page ksiega { size: A4 portrait; margin: 0; }
  .book-shell { page: ksiega; }
  body:has(.book-shell) { margin: 0 !important; padding: 0 !important; }
  .layout-bare { background: #fff; }
  .book-shell { padding: 0; max-width: none; }
  .book, .book.spread { display: block !important; box-shadow: none; perspective: none; }
  .book.spread::after, .book-leaf, .leaf-face { display: none !important; }
  .book-page, .book-page.is-visible { display: flex !important; width: 210mm; height: 296.5mm; min-height: 0; padding: 26mm 24mm; overflow: hidden; background-image: none !important; break-after: page; page-break-after: always; break-inside: avoid;
    box-shadow: none !important; border: 0 !important; border-radius: 0 !important; animation: none !important; transform: none !important; cursor: auto;
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .book-page::after { display: none; }
  .book-page::before { content: ""; position: absolute; inset: 11mm; border: .6pt solid rgba(140, 109, 66, .55); outline: .4pt solid rgba(140, 109, 66, .3); outline-offset: -2.5mm; pointer-events: none; }
  .book-page:last-child { break-after: auto; page-break-after: auto; }
  .book-cover .book-names { font-size: 46pt; }
  .book-cover .book-orn, .book-end .book-orn { font-size: 34pt; }
  .book-message { font-size: 17pt; line-height: 1.5; }
  .book-author { font-size: 20pt; }
  .book-photos img { max-height: 95mm; border-width: 3mm; }
  .book-num { bottom: 15mm; }
  .book.print-2 .book-page:not(.book-cover):not(.book-end) { height: 148mm; padding: 20mm 22mm; break-after: auto; page-break-after: auto; margin-bottom: 0; }
  .book.print-2 .book-page:not(.book-cover):not(.book-end)::before { inset: 9mm 11mm; }
  .book.print-2 .book-page:not(.book-cover):not(.book-end) .book-num { bottom: 11mm; }
  .book.print-2 .book-page:not(.book-cover):not(.book-end):nth-child(odd) { break-after: page; page-break-after: always; margin-bottom: 0; }
  .book.print-2 .book-photos img { max-height: 48mm; }
  .book.print-2 .book-message { font-size: 13pt; }
  .book.print-2 .book-author { font-size: 15pt; }
}

.wrap-anywhere { word-break: break-all; }
.slideshow-link .qr { margin-top: .6rem; }

/* ---------- Ikony (Lucide, sprite SVG) ---------- */
.icon { width: 1.2em; height: 1.2em; vertical-align: -.22em; flex: none; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.icon-title { color: var(--accent); width: .95em; height: .95em; vertical-align: -.1em; }
h2 > .icon { color: var(--accent); margin-right: .2rem; }
.btn .icon { width: 1.1em; height: 1.1em; }
.btn-tiny .icon { width: 1em; height: 1em; }
.lightbox-nav .icon { width: 28px; height: 28px; }
.media-thumb.is-file .icon { width: 2rem; height: 2rem; }
.stat { position: relative; transition: transform .2s ease, box-shadow .2s ease, border-color .2s; }
.stat-icon { position: absolute; top: 1rem; right: 1rem; width: 1.25rem; height: 1.25rem; color: var(--accent); opacity: .8; }
.text-ok { color: var(--ok); } .text-warn { color: var(--warn); } .text-bad { color: var(--danger); }
.row.between { justify-content: space-between; flex-wrap: wrap; }
.push-right { margin-left: auto; }

/* ---------- Budżet ---------- */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .9rem; margin-bottom: 1.25rem; }
.kpi { --k: var(--accent); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.1rem; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: .25rem; position: relative; overflow: hidden; }
.kpi::after { content: ""; position: absolute; inset: auto 0 0 0; height: 3px; background: var(--k); opacity: .8; }
.kpi-ok { --k: var(--ok); } .kpi-warn { --k: var(--warn); } .kpi-bad { --k: var(--danger); background: color-mix(in srgb, var(--danger) 12%, var(--surface)); }
.kpi-icon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, var(--k, var(--accent)) 14%, transparent); color: var(--k, var(--accent)); margin-bottom: .3rem; flex: none; }
.kpi-icon .icon { width: 22px; height: 22px; }
.kpi-label { font-size: .82rem; color: var(--muted); }
.kpi-value { font-family: var(--font-body); font-weight: 600; letter-spacing: -.02em; font-size: 1.45rem; line-height: 1.15; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kpi-form { display: flex; gap: .35rem; align-items: center; }
.kpi-form input { margin: 0; padding: .35rem .6rem; font-family: var(--font-body); font-weight: 600; font-size: 1.1rem; min-width: 0; }
.bar { height: 12px; background: var(--surface-2); border-radius: 999px; overflow: hidden; margin: .6rem 0; }
.bar.thin { height: 6px; margin: .4rem 0 .8rem; }
.bar-fill { display: block; height: 100%; width: var(--w, 0); border-radius: inherit; background: linear-gradient(90deg, var(--c, var(--accent)), color-mix(in srgb, var(--c, var(--accent)) 70%, #fff)); }
.budget-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 0 1.25rem; align-items: start; }
.donut-wrap { position: relative; width: 200px; max-width: 100%; margin: .5rem auto 1rem; }
.donut { width: 100%; height: auto; display: block; }
.donut-seg { transition: stroke-width .2s; }
.donut-seg:hover { stroke-width: 28; }
.donut-center { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; pointer-events: none; }
.donut-center strong { font-family: var(--font-display); font-size: 1.35rem; }
.legend { list-style: none; padding: 0; margin: 0; display: grid; gap: .35rem; font-size: .88rem; }
.legend li { display: flex; align-items: center; gap: .5rem; }
.legend li .muted { margin-left: auto; white-space: nowrap; }
.legend .dot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.pay-list { list-style: none; padding: 0; margin: 0 0 .6rem; }
.pay { display: flex; align-items: center; gap: .75rem; padding: .65rem .5rem; border-bottom: 1px solid var(--line); border-radius: 10px; transition: background .2s; }
.pay:hover { background: var(--surface-2); }
.pay.is-soon { background: color-mix(in srgb, var(--warn) 12%, transparent); }
.pay.is-overdue { background: color-mix(in srgb, var(--danger) 13%, transparent); }
.pay-icon { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; flex: none; color: var(--c); background: color-mix(in srgb, var(--c) 15%, transparent); }
.pay-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.add-expense > summary, .expense > summary { cursor: pointer; list-style: none; }
.add-expense > summary::-webkit-details-marker, .expense > summary::-webkit-details-marker { display: none; }
.add-expense > summary { font-weight: 600; font-size: 1.05rem; display: flex; align-items: center; gap: .5rem; color: var(--accent-strong); }
.add-expense[open] > summary { margin-bottom: 1rem; }
.cat-picker { border: 0; padding: 0; margin: 0 0 1rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .45rem; }
.cat-picker legend { font-size: .9rem; font-weight: 500; margin-bottom: .45rem; }
.cat-opt { margin: 0 !important; cursor: pointer; }
.cat-opt input { position: absolute; opacity: 0; pointer-events: none; }
.cat-opt span { display: flex; align-items: center; gap: .5rem; padding: .5rem .65rem; border: 1px solid var(--line); border-radius: 12px; font-size: .84rem; background: var(--surface); transition: border-color .15s, background .15s, transform .15s; }
.cat-opt .icon { color: var(--c); }
.cat-opt:hover span { border-color: var(--c); }
.cat-opt input:checked + span { border-color: var(--c); background: color-mix(in srgb, var(--c) 12%, var(--surface)); box-shadow: 0 0 0 1px var(--c) inset; font-weight: 600; }
.cat-opt input:focus-visible + span { outline: 2px solid var(--c); outline-offset: 2px; }
.first-payment { background: var(--surface-2); border-radius: 12px; padding: .6rem 1rem .2rem; margin-bottom: 1rem; }
.budget-cat { border-top: 4px solid var(--c); }
.cat-head { display: flex; align-items: center; gap: .75rem; }
.cat-head h2 { margin: 0; font-size: 1.25rem; flex: 1; }
.cat-icon { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; color: var(--c); background: color-mix(in srgb, var(--c) 14%, transparent); flex: none; }
.cat-icon .icon { width: 22px; height: 22px; }
.cat-sum { white-space: nowrap; font-variant-numeric: tabular-nums; }
.expense { border-top: 1px solid var(--line); }
.expense > summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .7rem .2rem; flex-wrap: wrap; border-radius: 8px; transition: background .15s; }
.expense > summary:hover { background: var(--surface-2); }
.expense[open] > summary { background: var(--surface-2); }
.exp-name { display: flex; flex-direction: column; }
.exp-nums { display: flex; gap: 1.2rem; font-variant-numeric: tabular-nums; }
.exp-nums > span { display: flex; flex-direction: column; text-align: right; min-width: 82px; }
.exp-body { padding: .6rem .2rem 1rem; }
.pay-history { list-style: none; padding: 0; margin: 0 0 .8rem; }
.pay-history li { display: flex; align-items: center; gap: .6rem; padding: .45rem .5rem; border-radius: 8px; flex-wrap: wrap; }
.pay-history li > .icon { color: var(--warn); }
.pay-history li.paid > .icon { color: var(--ok); }
.pay-history li.is-overdue { background: color-mix(in srgb, var(--danger) 13%, transparent); }
.pay-history li.is-overdue > .icon { color: var(--danger); }
.add-payment { display: grid; grid-template-columns: 1fr 1fr 1fr 1.6fr auto; gap: .5rem; align-items: center; margin-bottom: .8rem; }
.add-payment input, .add-payment select { margin: 0; }
@media (max-width: 720px) {
  .add-payment { grid-template-columns: 1fr 1fr; }
  .exp-nums { width: 100%; justify-content: space-between; }
  .exp-nums > span { text-align: left; min-width: 0; }
}
.budget-widget { display: flex; gap: 1rem; align-items: center; text-decoration: none; color: var(--text); transition: transform .2s ease, box-shadow .2s ease, border-color .2s; }
.budget-widget:hover { border-color: var(--accent); }
.budget-widget h2 { margin: 0 0 .3rem; font-size: 1.25rem; }
.budget-widget p { margin: .2rem 0 0; }
.bw-main { flex: 1; min-width: 0; }
.bw-go { color: var(--muted); transition: transform .2s; }
.budget-widget:hover .bw-go { transform: translateX(4px); color: var(--accent); }


/* ---------- Ankiety ---------- */
.label-like { font-size: .9rem; font-weight: 500; margin: 0 0 .45rem; }
.rot-90 { transform: rotate(90deg); }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .7rem 0; }
.chip { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid var(--line); background: var(--surface); color: var(--muted); border-radius: 999px; padding: .3rem .75rem; font: 500 .8rem var(--font-body); cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.chip:hover { border-color: var(--accent); }
.chip.is-on { background: var(--accent-soft); color: var(--accent-strong); border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.poll-empty { text-align: center; display: flex; flex-direction: column; align-items: center; }
.poll-admin-head, .poll-hero { display: flex; gap: .9rem; align-items: center; }
.poll-hero { align-items: flex-start; }
.poll-hero h2 { margin: 0 0 .3rem; }
.poll-admin-title { flex: 1; min-width: 0; }
.poll-admin-title h2 { margin: 0; font-size: 1.3rem; }
.poll-admin-title h2 a { color: inherit; text-decoration: none; }
.poll-admin-title h2 a:hover { color: var(--accent-strong); }
.poll-count { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--text); min-width: 76px; }
.poll-count strong { font-family: var(--font-display); font-size: 2rem; line-height: 1; }
.poll-admin .bar.thin { margin: .8rem 0 0; }
.poll-admin-actions { margin-top: .4rem; }
.preset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .6rem; }
.preset-card { display: flex; gap: .6rem; align-items: center; padding: .8rem .9rem; border: 1px dashed var(--line); border-radius: 12px; text-decoration: none; color: var(--text); font-size: .9rem; transition: border-color .15s, background .15s, transform .2s; }
.preset-card .icon { color: var(--accent); }
.preset-card:hover { border-style: solid; border-color: var(--accent); background: var(--accent-soft); }
.kind-picker { border: 0; padding: 0; margin: 0 0 1rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.kind-picker legend { font-size: .9rem; font-weight: 500; margin-bottom: .45rem; }
.kind-opt { margin: 0 !important; cursor: pointer; }
.kind-opt input { position: absolute; opacity: 0; pointer-events: none; }
.kind-opt span { display: flex; flex-direction: column; align-items: center; gap: .35rem; padding: .9rem .5rem; border: 1px solid var(--line); border-radius: 14px; text-align: center; font-size: .88rem; transition: border-color .15s, background .15s; }
.kind-opt .icon { width: 1.6rem; height: 1.6rem; color: var(--accent); }
.kind-opt input:checked + span { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 1px var(--accent) inset; font-weight: 600; }
.kind-opt input:disabled + span { opacity: .45; cursor: not-allowed; }
.kind-opt input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (max-width: 520px) { .kind-picker { grid-template-columns: 1fr; } .kind-opt span { flex-direction: row; } }
.poll-options { margin-bottom: 1rem; }
.opt-list { list-style: none; counter-reset: opt; padding: 0; margin: 0 0 .5rem; display: grid; gap: .4rem; }
.opt-row { display: flex; gap: .4rem; align-items: center; counter-increment: opt; }
.opt-row::before { content: counter(opt); width: 1.6rem; height: 1.6rem; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--surface-2); color: var(--muted); font-size: .78rem; font-weight: 600; }
.opt-row input { margin: 0; flex: 1; }
.poll-switches { margin-bottom: 1rem; }
.poll-switches .switch-row .icon { color: var(--accent); }
.poll-bars { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.poll-bars.compact { gap: .55rem; }
.poll-bars.compact .bar { height: 8px; margin: .3rem 0 0; }
.poll-bar .bar { margin: .4rem 0 .2rem; }
.poll-bar .bar-fill { animation-delay: calc(var(--i, 0) * 90ms + 150ms); }
.poll-bar-label { display: inline-flex; align-items: center; gap: .35rem; font-weight: 500; }
.poll-bar-label .icon { color: #d4a72c; }
.poll-bar.is-leader .bar-fill { background: linear-gradient(90deg, var(--accent), #d4a72c); }
.poll-bar.is-mine .poll-bar-label { color: var(--accent-strong); }
.voters > summary { cursor: pointer; list-style: none; display: inline-flex; gap: .3rem; align-items: center; }
.voters > summary::-webkit-details-marker { display: none; }
.voter-chips { display: flex; flex-wrap: wrap; gap: .3rem; margin: .4rem 0 0; }
.voter { background: var(--surface-2); border-radius: 999px; padding: .15rem .6rem; font-size: .8rem; }
.kpi-text { font-size: 1.2rem; white-space: normal; }
.answer-wall { columns: 3 260px; column-gap: 1rem; padding-bottom: 1px; margin-bottom: 1.25rem; }
.answer-wall::after { content: ""; display: block; height: 1px; }
.answer-card { break-inside: avoid; margin: 0 0 1rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.1rem; box-shadow: var(--shadow); position: relative; }
.answer-card blockquote { margin: 0 0 .5rem; font-family: var(--font-display); font-size: 1.2rem; line-height: 1.35; }
.answer-quote { color: var(--accent); opacity: .5; float: right; }
/* Gość */
.poll-card { scroll-margin-top: 1rem; }
.poll-head { display: flex; gap: .75rem; align-items: flex-start; margin-bottom: .8rem; }
.poll-head p { margin: .2rem 0 0; }
.poll-q { margin: 0; font-size: 1.3rem; line-height: 1.25; }
.poll-icon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; flex: none; color: var(--accent); background: var(--accent-soft); }
.poll-choices { display: grid; gap: .5rem; margin-bottom: .6rem; }
.poll-choice { margin: 0 !important; cursor: pointer; font-weight: 400; }
.poll-choice input { position: absolute; opacity: 0; pointer-events: none; }
.poll-choice span { display: flex; align-items: center; gap: .7rem; padding: .75rem .9rem; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); transition: border-color .15s, background .15s, transform .15s; }
.poll-choice .tick { width: 1.4rem; height: 1.4rem; border-radius: 50%; border: 2px solid var(--line); display: grid; place-items: center; flex: none; color: transparent; transition: background .15s, border-color .15s, color .15s; }
.poll-choice input[type=checkbox] + span .tick { border-radius: 6px; }
.poll-choice .tick .icon { width: .9rem; height: .9rem; }
.poll-choice:hover span { border-color: var(--accent); }
.poll-choice input:checked + span { border-color: var(--accent); background: var(--accent-soft); font-weight: 600; }
.poll-choice input:checked + span .tick { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.poll-choice input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.poll-done { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; background: color-mix(in srgb, var(--ok) 10%, transparent); border-radius: 12px; padding: .75rem .9rem; }
.poll-done p { margin: .15rem 0 0; overflow-wrap: break-word; }
.poll-done > div { flex: 1; min-width: 0; }
.poll-done-icon { color: var(--ok); }
.poll-done-icon .icon { width: 1.8rem; height: 1.8rem; }
.poll-public { margin-top: 1rem; padding-top: .9rem; border-top: 1px solid var(--line); }
.text-answers { list-style: none; padding: 0; margin: 0; display: grid; gap: .4rem; }
.text-answers li { background: var(--surface-2); border-radius: 12px; padding: .5rem .75rem; font-size: .9rem; }
.tile-badge { background: var(--accent); color: var(--on-accent) !important; border-radius: 999px; padding: .05rem .55rem; font-size: .72rem; }
@media (prefers-reduced-motion: no-preference) {
  .opt-row { animation: fade-up .25s ease-out both; }
  .opt-row.is-leaving { opacity: 0; transform: translateX(12px); transition: opacity .18s, transform .18s; }
  .poll-choice span:active { transform: scale(.98); }
  .poll-choice input:checked + span .tick { animation: pop-in .3s ease-out both; }
  .poll-done-icon .icon { animation: pop-in .5s cubic-bezier(.2,.7,.2,1) both; }
  .answer-card.is-in { animation-delay: calc(var(--i, 0) * 70ms); }
  .tile-badge { animation: pop-in .5s .4s both; }
}

/* ---------- Lista gości: status zaproszenia ---------- */
.status-pill { display: inline-flex; align-items: center; gap: .3rem; padding: .15rem .55rem; border-radius: 999px; font-size: .75rem; font-weight: 600; background: var(--surface-2); color: var(--muted); white-space: nowrap; }
.status-pill.is-sent { background: color-mix(in srgb, var(--warn) 14%, transparent); color: var(--warn); }
.status-pill.is-opened { background: color-mix(in srgb, var(--ok) 15%, transparent); color: var(--ok); }
.inv-status .muted { display: block; margin-top: .15rem; }
.kpi-bad-soft { --k: var(--danger); }
.kpi .bar.thin { margin: .5rem 0 0; }
.kpi-value small { font-size: .55em; }
.toolbar .chips { margin: 0; }
.chip .icon { width: 1em; height: 1em; }

/* ---------- Animacje (lekkie, tylko transform/opacity; wyłączane przy prefers-reduced-motion) ---------- */
@keyframes fade-up { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes grow-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes donut-in { from { stroke-dasharray: 0 999; } }
@keyframes pop-in { 0% { opacity: 0; transform: scale(.85); } 70% { transform: scale(1.04); } 100% { opacity: 1; transform: none; } }
@keyframes float-y { 50% { transform: translateY(-4px); } }

@media (prefers-reduced-motion: no-preference) {
  .panel-main, .guest-main, .container { animation: fade-in .25s ease-out both; }
  .js-anim .reveal { opacity: 0; transform: translateY(14px); }
  .js-anim .reveal.is-in { animation: fade-up .55s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(var(--d, 0) * 70ms); }
  .bar-fill { transform-origin: left; animation: grow-x .9s cubic-bezier(.2,.7,.2,1) .15s both; }
  .donut-seg { animation: donut-in .9s cubic-bezier(.3,.7,.2,1) both; animation-delay: calc(var(--i, 0) * 80ms + 150ms); }
  .tiles .tile, .gallery-grid > *, .theme-option { animation: fade-up .5s cubic-bezier(.2,.7,.2,1) both; }
  .tiles .tile:nth-child(2) { animation-delay: 60ms; } .tiles .tile:nth-child(3) { animation-delay: 120ms; }
  .tiles .tile:nth-child(4) { animation-delay: 180ms; } .tiles .tile:nth-child(5) { animation-delay: 240ms; } .tiles .tile:nth-child(n+6) { animation-delay: 300ms; }
  .tile, .stat, .kpi, .card.budget-cat, .theme-option .theme-preview { transition: transform .22s cubic-bezier(.2,.7,.2,1), box-shadow .22s, border-color .2s; }
  .tile:hover, a.stat:hover, .budget-widget:hover { transform: translateY(-1px); }
  .tile:active, a.stat:active { transform: scale(.98); }
  .tile:hover .tile-icon, .kpi:hover .kpi-icon .icon { animation: float-y 1.2s ease-in-out infinite; }
  .btn { transition: background .15s, border-color .15s, transform .15s, box-shadow .15s; }
  .btn:active { transform: translateY(1px) scale(.98); }
  .sidenav-nav a { transition: background .15s, color .15s; }
  .tabbar a .icon { transition: transform .2s cubic-bezier(.2,.7,.2,1); }
  .tabbar a.active .icon { animation: pop-in .4s cubic-bezier(.2,.7,.2,1) both; }
  .alert { animation: fade-up .4s cubic-bezier(.2,.7,.2,1) both; }
  .expense[open] .exp-body, .add-expense[open] form { animation: fade-up .3s ease-out both; }
  .cat-opt input:checked + span .icon { animation: pop-in .35s ease-out both; }
  .countdown-num { display: inline-block; animation: pop-in .6s cubic-bezier(.2,.7,.2,1) .1s both; }
}
@media (prefers-reduced-motion: reduce) {
  /* Drobne animacje interfejsu wyłączone; animacje będące treścią (pokaz slajdów, przewracanie kartek księgi,
     otwieranie zaproszenia) zostają – inaczej przy systemowym „ogranicz ruch” po prostu nie działały. */
  .panel-main, .guest-main, .container, .reveal, .tiles .tile, .theme-option, .gallery-grid > * { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto !important; }
}


/* ---------- Plan sali: krzesła, postacie, elementy sali ---------- */
.s-table { overflow: visible; }
.s-table.element { flex-direction: column; gap: 2px; }
.s-table.element-round { border-radius: 50%; }
.s-el-icon { width: 22px; height: 22px; opacity: .75; }
.s-chair { position: absolute; touch-action: none; border-radius: 50%; background: var(--surface); border: 1.5px solid color-mix(in srgb, var(--accent) 45%, var(--line)); display: grid; place-items: center; cursor: pointer; z-index: 2; transition: transform .12s, box-shadow .12s; }
.s-chair:hover { transform: scale(1.12); }
.s-chair svg { width: 100%; height: 100%; display: block; }
.s-chair.taken { border-color: transparent; background: var(--surface); box-shadow: 0 1px 3px rgba(0, 0, 0, .15); cursor: grab; }
.s-chair.plus svg { opacity: .55; }
.s-chair.sel { box-shadow: 0 0 0 3px var(--accent); }
.s-chair.drop-target { box-shadow: 0 0 0 3px var(--accent); transform: scale(1.18); background: var(--accent-soft); }
.s-resize { position: absolute; width: 16px; height: 16px; border-radius: 4px; background: var(--accent); border: 2px solid var(--surface); z-index: 3; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); touch-action: none; }
.s-resize-se { right: -8px; bottom: -8px; cursor: nwse-resize; }
.s-resize-e { right: -8px; top: 50%; width: 12px; height: 26px; margin-top: -13px; cursor: ew-resize; border-radius: 6px; }
.s-resize-s { bottom: -8px; left: 50%; width: 26px; height: 12px; margin-left: -13px; cursor: ns-resize; border-radius: 6px; }
.s-rotate { position: absolute; left: 50%; top: -46px; width: 22px; height: 22px; margin-left: -11px; border-radius: 50%; background: var(--surface); border: 2px solid var(--accent); cursor: grab; z-index: 3; touch-action: none; box-shadow: 0 1px 3px rgba(0, 0, 0, .2); }
.s-rotate::after { content: ""; position: absolute; left: 50%; top: 20px; width: 2px; height: 14px; margin-left: -1px; background: var(--accent); }
.s-rotate::before { content: "⟳"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 13px; line-height: 1; color: var(--accent-strong); }
/* Obrócony stół: napisy, ikony i postacie zostają pionowo */
.s-label { display: flex; flex-direction: column; align-items: center; gap: 1px; text-align: center; pointer-events: none; position: relative; z-index: 1; transform: rotate(calc(var(--rot, 0deg) * -1)); }
.s-chair svg { transform: rotate(calc(var(--rot, 0deg) * -1)); }
@media (pointer: coarse) { .s-resize-se { width: 24px; height: 24px; right: -12px; bottom: -12px; } .s-rotate { width: 30px; height: 30px; margin-left: -15px; top: -54px; } .s-rotate::after { top: 28px; } }
.s-table-name, .s-table-count { position: relative; z-index: 1; pointer-events: none; }
.guest-chip { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.chip-fig { width: 22px; height: 22px; flex: none; }
.chip-fig svg { width: 100%; height: 100%; display: block; }
.chip-group { flex-basis: 100%; padding-left: 1.85rem; margin-top: -.3rem; opacity: .75; }
.guest-chip.declined { opacity: .55; }
.seated-list .guest-chip { padding-right: .7rem; }
.drag-ghost { position: fixed; z-index: 999; pointer-events: none; display: flex; align-items: center; gap: .4rem; background: var(--surface); border: 1px solid var(--accent); border-radius: 999px; padding: .2rem .7rem .2rem .2rem; box-shadow: 0 6px 18px rgba(0, 0, 0, .18); font-size: .85rem; }
.drag-ghost svg { width: 28px; height: 28px; }
.el-presets { margin: .8rem 0 0; }
.el-presets > summary { cursor: pointer; font-weight: 600; font-size: .9rem; color: var(--accent-strong); display: flex; align-items: center; gap: .4rem; list-style: none; }
.el-presets > summary::-webkit-details-marker { display: none; }
.el-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem; margin-top: .6rem; }
.el-btn { display: flex; align-items: center; gap: .45rem; padding: .4rem .5rem; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--text); font: 500 .8rem var(--font-body); cursor: pointer; text-align: left; }
.el-btn:hover { border-color: var(--accent); background: var(--accent-soft); }
.el-shape { width: 26px; height: 22px; flex: none; border: 1.5px dashed var(--muted); border-radius: 5px; display: grid; place-items: center; color: var(--accent); }
.el-shape.is-round { width: 24px; height: 24px; border-radius: 50%; }
.el-shape .icon { width: 13px; height: 13px; }
.size-row { display: flex; align-items: flex-end; gap: .35rem; flex-wrap: wrap; margin-bottom: .8rem; }
.size-row > .small { align-self: center; margin-right: .2rem; }
.size-row .btn { min-width: 34px; font-size: 1.05rem; }
.size-inp { margin: 0 !important; font-size: .75rem !important; width: 74px; }
.size-inp input { margin-top: .15rem; padding: .3rem .45rem; min-height: 32px; }
.names-switch { margin: 1rem 0 .4rem !important; border-top: 1px solid var(--line); }
.table-props .grid-2 { gap: 0 .6rem; }

/* Plan dla gości i w zaproszeniu (SVG z serwera) */
.seat-svg { width: 100%; height: auto; display: block; font-family: var(--font-body); --sa: var(--seat-accent, var(--accent)); }
.seat-svg text { font-size: 13px; text-anchor: middle; fill: var(--seat-text, var(--text)); }
.seat-el rect, .seat-el ellipse { fill: none; stroke: var(--seat-muted, var(--muted)); stroke-width: 1.5; stroke-dasharray: 6 5; }
.seat-el use { color: var(--seat-muted, var(--muted)); }
.seat-el text { fill: var(--seat-muted, var(--muted)); font-size: 12px; }
.seat-top { fill: var(--seat-surface, var(--surface)); stroke: var(--sa); stroke-width: 2; }
.seat-chair circle { fill: var(--seat-surface, var(--surface)); stroke: color-mix(in srgb, var(--sa) 45%, transparent); stroke-width: 1.5; }
.seat-chair.is-taken circle { fill: color-mix(in srgb, var(--sa) 14%, var(--seat-surface, var(--surface))); stroke: color-mix(in srgb, var(--sa) 35%, transparent); }
.seat-fig { fill: color-mix(in srgb, var(--sa) 55%, #888); }
.seat-chair.is-me circle { fill: var(--sa); stroke: var(--sa); stroke-width: 3; }
.seat-chair.is-me .seat-fig { fill: #fff; }
.seat-table.is-mine .seat-top { fill: color-mix(in srgb, var(--sa) 18%, var(--seat-surface, var(--surface))); stroke-width: 3; }
.seat-table.is-found .seat-top { fill: color-mix(in srgb, var(--sa) 25%, var(--seat-surface, var(--surface))); stroke-width: 4; }
.seat-detail text { font-size: 12px; }
.seat-detail .seat-detail-name { font-family: var(--seat-font, var(--font-display)); font-size: 17px; font-weight: 600; }
.seat-detail .seat-label { font-size: 11.5px; }
.seat-detail .seat-label.is-me { font-weight: 700; font-size: 13px; fill: var(--sa); }
.seat-where { text-align: center; margin: .2rem 0 .8rem; }
.seat-where strong { color: var(--accent-strong); }
.seat-plan-wrap { overflow-x: auto; }
.seat-plan-wrap .seat-svg { max-height: 70vh; }
.seat-detail { max-width: 420px; margin: 0 auto; }


/* ---------- Kreator sali v2: widok z powiększaniem, zakładki, ikony, kolory ---------- */
.seating-editor { display: grid; grid-template-columns: 330px minmax(0, 1fr); grid-template-areas: "side stage"; gap: 1rem; align-items: start; }
.seating-editor .seat-stage { grid-area: stage; position: relative; padding: 0; overflow: hidden; margin: 0; }
.seating-editor .seating-side { grid-area: side; position: sticky; top: 1rem; max-height: calc(100vh - 150px); overflow: auto; margin: 0; padding: 0 1rem 1rem; }
.seat-view { position: relative; overflow: hidden; touch-action: none; height: calc(100vh - 150px); min-height: 460px; border-radius: var(--radius);
  background-color: var(--surface-2); background-image: radial-gradient(circle, var(--line) 1px, transparent 1px); background-size: 20px 20px; cursor: grab; }
.seat-view:active { cursor: grabbing; }
.seat-view .seating-canvas { position: absolute; left: 0; top: 0; width: 3000px; height: 2000px; transform-origin: 0 0; background: none; border-radius: 0; }
.zoom-ctrl { position: absolute; right: .6rem; bottom: .6rem; z-index: 6; display: flex; flex-direction: column; gap: .35rem; }
.zoom-ctrl .icon-btn { width: 42px; height: 42px; background: var(--surface); box-shadow: 0 2px 8px rgba(0, 0, 0, .12); font-size: 1.3rem; font-weight: 600; }
.zoom-minus { font-size: 1.5rem; line-height: 1; }
.seat-tip { position: absolute; left: .6rem; right: 3.8rem; top: .6rem; z-index: 6; margin: 0; padding: .45rem .75rem; border-radius: var(--radius-sm); background: var(--surface); box-shadow: 0 2px 10px rgba(0, 0, 0, .12); font-size: .82rem; pointer-events: none; }

/* Zakładki panelu */
.sheet-tabs { position: sticky; top: 0; z-index: 3; display: grid; grid-template-columns: repeat(4, 1fr); gap: .25rem; margin: 0 -1rem .8rem; padding: .7rem .7rem .5rem; background: var(--surface); border-bottom: 1px solid var(--line); }
.sheet-tab { display: flex; flex-direction: column; align-items: center; gap: .15rem; padding: .45rem .15rem; border: 0; border-radius: var(--radius-sm); background: none; color: var(--muted); font: 600 .7rem var(--font-body); cursor: pointer; }
.sheet-tab .icon { width: 20px; height: 20px; }
.sheet-tab .badge { font-size: .62rem; padding: 0 .35rem; }
.sheet-tab.active { background: var(--accent-soft); color: var(--accent-strong); }
.sheet-pane { display: none; }
.seating-editor[data-tab="guests"] [data-pane="guests"], .seating-editor[data-tab="add"] [data-pane="add"],
.seating-editor[data-tab="props"] [data-pane="props"], .seating-editor[data-tab="settings"] [data-pane="settings"] { display: block; }
.sheet-pane h3 { font-size: .85rem; margin: .4rem 0 .5rem; }
.add-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; margin-bottom: .8rem; }
.el-btn { min-height: 44px; }
.el-shape.is-table { border-style: solid; border-color: var(--accent); }
.guest-hint { margin: .4rem 0 .6rem; }
.guest-pool { max-height: none; }

/* Panel „Wybrany” */
.prop-label { display: block; font-size: .78rem; font-weight: 600; color: var(--muted); margin: .8rem 0 .35rem; }
.prop-row { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-bottom: .5rem; }
.prop-row .prop-label { margin: 0; }
.stepper { display: flex; align-items: center; gap: .3rem; }
.stepper .icon-btn { font-size: 1.2rem; font-weight: 600; }
.stepper input { width: 58px; margin: 0; text-align: center; }
.chair-move { width: 100%; padding: .4rem 0 !important; border-bottom: 0 !important; }
.seg { display: flex; gap: .35rem; }
.seg button { flex: 1; display: flex; align-items: center; justify-content: center; gap: .45rem; min-height: 40px; padding: .35rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); color: var(--text); font: 500 .82rem var(--font-body); cursor: pointer; }
.seg button.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-strong); }
.icon-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(42px, 1fr)); gap: .3rem; }
.pick-btn { height: 42px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--text); display: grid; place-items: center; cursor: pointer; font-size: 1rem; }
.pick-btn .icon { width: 20px; height: 20px; }
.pick-btn.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-strong); box-shadow: 0 0 0 1px var(--accent) inset; }
.color-pick { display: flex; flex-wrap: wrap; gap: .45rem; }
.swatch { width: 34px; height: 34px; border-radius: 50%; border: 2px solid var(--surface); box-shadow: 0 0 0 1px var(--line); cursor: pointer; padding: 0; position: relative; overflow: hidden; }
.swatch.on { box-shadow: 0 0 0 2px var(--accent); }
.swatch-none { background: linear-gradient(135deg, transparent 46%, var(--danger) 46%, var(--danger) 54%, transparent 54%), var(--surface); }
.swatch-custom { background: conic-gradient(#e74c3c, #f1c40f, #2ecc71, #1abc9c, #3498db, #9b59b6, #e74c3c); margin: 0 !important; }
.swatch-custom input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; margin: 0; padding: 0; }

/* Kolor stolika / elementu */
.s-table.has-color { border-color: var(--tc); background: color-mix(in srgb, var(--tc) 16%, var(--surface)); }
.s-table.element.has-color { border-color: var(--tc); background: color-mix(in srgb, var(--tc) 22%, transparent); color: color-mix(in srgb, var(--tc) 75%, var(--text)); }
.seat-el.has-color rect, .seat-el.has-color ellipse { stroke: var(--tc); fill: color-mix(in srgb, var(--tc) 18%, transparent); }
.seat-el.has-color use, .seat-el.has-color text { color: var(--tc); fill: color-mix(in srgb, var(--tc) 75%, #333); }
.seat-table.has-color .seat-top { stroke: var(--tc); fill: color-mix(in srgb, var(--tc) 15%, var(--seat-surface, var(--surface))); }

/* Imię i nazwisko nad postacią */
.s-chair-name { position: absolute; width: 0; height: 0; z-index: 4; pointer-events: none; }
.s-chair-name span { position: absolute; white-space: nowrap; font: 600 9px/1.25 var(--font-body); color: var(--text); background: color-mix(in srgb, var(--surface) 90%, transparent); padding: 1px 4px; border-radius: 5px; box-shadow: 0 1px 2px rgba(0, 0, 0, .14); }
.s-chair-name.dir-n span { bottom: 1px; left: 0; transform: translateX(-50%); }
.s-chair-name.dir-s span { top: 1px; left: 0; transform: translateX(-50%); }
.s-chair-name.dir-e span { left: 1px; top: 0; transform: translateY(-50%); }
.s-chair-name.dir-w span { right: 1px; top: 0; transform: translateY(-50%); }
.s-table.chair-move .s-chair { outline: 2px dashed var(--accent); outline-offset: 2px; cursor: move; }
.s-chair:not(.taken) { cursor: move; }
.s-chair:not(.taken):hover { box-shadow: 0 0 0 2px var(--accent); }

/* Podgląd planu dla gości z powiększaniem */
.seat-view-guest { height: auto; min-height: 0; touch-action: pan-y; background: none; cursor: default; border-radius: 0; }
.seat-view-inner { transform-origin: 0 0; }
.seat-view-guest .zoom-ctrl .icon-btn { width: 38px; height: 38px; }

/* Telefon: plan na górze, panel z zakładkami pod nim – bez przewijania strony */
@media (max-width: 860px) {
  .seat-head { margin-bottom: .5rem; }
  .seat-head h1 { font-size: 1.45rem; }
  .seating-editor { display: flex; flex-direction: column; align-items: stretch; gap: .5rem; height: calc(100dvh - 222px - env(safe-area-inset-bottom)); min-height: 420px; }
  .seating-editor .seat-stage { flex: 1 1 56%; min-height: 220px; }
  .seat-view { height: 100%; min-height: 0; }
  .seating-editor .seating-side { position: static; flex: 1 1 44%; max-height: none; min-height: 0; overflow: auto; padding: 0 .8rem .8rem; overscroll-behavior: contain; }
  .sheet-tabs { margin: 0 -.8rem .6rem; padding: .45rem .5rem .4rem; }
  .guest-pool { display: flex; flex-wrap: wrap; gap: .35rem; }
  .guest-pool .guest-chip { flex: 0 1 auto; }
  .chip-group { display: none; }
  .zoom-ctrl .icon-btn { width: 40px; height: 40px; }
}

/* ---------- Logowanie odciskiem palca ---------- */
.passkey-login { margin-top: .7rem; }
.passkey-login .btn .icon { width: 1.3em; height: 1.3em; }
.passkey-login p:empty { display: none; }
.passkey-list { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: .5rem; }
.passkey-list li { display: flex; align-items: center; gap: .7rem; padding: .6rem .7rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-2); }
.passkey-ic { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent-strong); flex: none; }
.passkey-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.passkey-info small { font-size: .78rem; }
.narrow-wrap { max-width: 460px; margin: 0 auto; }
.passkey-nudge { position: fixed; left: 1rem; right: 1rem; bottom: calc(5.2rem + env(safe-area-inset-bottom)); z-index: 45; display: flex; align-items: center; gap: .7rem; padding: .7rem .8rem; background: var(--surface); border: 1px solid var(--gold-line, var(--line)); border-radius: var(--radius); box-shadow: 0 10px 30px rgba(0,0,0,.18); max-width: 460px; margin: 0 auto; }
.passkey-nudge > span:nth-child(2) { flex: 1; line-height: 1.3; font-size: .9rem; }
.passkey-nudge small { color: var(--muted); }
.passkey-nudge-ic { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent-strong); flex: none; }
.passkey-nudge-ic .icon { width: 22px; height: 22px; }
.passkey-nudge-x { width: 32px; height: 32px; }
@media (min-width: 1001px) { .passkey-nudge { bottom: 1.5rem; left: auto; right: 1.5rem; margin: 0; } }

/* ---------- Glamour: wygląd paneli (para, administrator, logowanie) ----------
   Wspólna struktura .ui-glamour + 10 palet .panel-{klucz} (wybór pary w „Szata graficzna”).
   Ozdoby (diament, pióro, puch, iskry) to lokalne SVG użyte jako maski, więc przyjmują
   kolor szaty (--orn). Panel gości, zaproszenie i plakat QR mają osobną szatę gości. */
.ui-glamour {
  color-scheme: light;
  --bg: #fbf8f3; --surface: #ffffff; --surface-2: #f8f3ea;
  --text: #2b2620; --muted: #8a7f70; --line: #eee6d8; --gold-line: #e2cf9f;
  --accent: #b8923f; --accent-strong: #8a6a22; --accent-soft: #f8f0dd; --on-accent: #ffffff;
  --orn: #c9a54e; --orn-o: 1;
  --btn-a: #d2b062; --btn-b: #b8923f; --btn-edge: #b08a39; --btn-text: #ffffff;
  --side-bg: rgba(255, 255, 255, .92); --bar-bg: rgba(255, 255, 255, .9);
  --hover: #fcf7ec; --nav-text: #4a4238; --nav-icon: #b3a68f; --input-bg: #fffdf9; --input-line: #e6dccb;
  --ok: #4f7a5a; --ok-soft: #e8f1e9; --warn: #a8732a; --warn-soft: #f8eedb; --danger: #b0473f; --danger-soft: #f8e6e3;
  --shadow: 0 1px 2px rgba(60, 45, 20, .05), 0 6px 20px -12px rgba(60, 45, 20, .18);
  --ring: 0 0 0 3px color-mix(in srgb, var(--orn) 28%, transparent);
  --font-display: "Playfair Display", Georgia, serif;
  --pattern: none;
  background: var(--bg);
}

/* --- 10 szat panelu pary --- */
.panel-noc {
  color-scheme: dark;
  --bg: #0e0d0c; --surface: #171513; --surface-2: #211e1a;
  --text: #f4ecdc; --muted: #a99d87; --line: #2e2922; --gold-line: #4a3f2a;
  --accent: #c9a54e; --accent-strong: #e2c47a; --accent-soft: #2a2416; --on-accent: #15120b;
  --orn: #c9a54e; --orn-o: .75;
  --btn-a: #d8b867; --btn-b: #b8923f; --btn-edge: #b8923f; --btn-text: #15120b;
  --side-bg: rgba(18, 17, 16, .95); --bar-bg: rgba(14, 13, 12, .9);
  --hover: rgba(201, 165, 78, .07); --nav-text: #d9cfbd; --nav-icon: #8d806a; --input-bg: #12100e; --input-line: #3a3429;
  --ok: #8fc29b; --ok-soft: #1b2a1f; --warn: #e3b062; --warn-soft: #2f2618; --danger: #ec8b80; --danger-soft: #351d1a;
  --shadow: none;
}
.panel-roz {
  --bg: #fdf5f4; --surface: #ffffff; --surface-2: #fbecea;
  --text: #3e2a2c; --muted: #94797a; --line: #f3e1df; --gold-line: #e8c3bd;
  --accent: #b9756f; --accent-strong: #94524d; --accent-soft: #fbe9e6;
  --orn: #d3a19a; --btn-a: #d9a29b; --btn-b: #bf7d76; --btn-edge: #b5726b;
  --hover: #fdf1ef; --nav-text: #5a4446; --nav-icon: #cfa6a1; --input-bg: #fffbfa; --input-line: #efd8d5;
}
.panel-platyna {
  --bg: #f6f7f9; --surface: #ffffff; --surface-2: #eef0f4;
  --text: #22262c; --muted: #7c8592; --line: #e4e7ec; --gold-line: #cfd5de;
  --accent: #6b7584; --accent-strong: #3f4753; --accent-soft: #eceff4;
  --orn: #9aa4b2; --btn-a: #9aa4b2; --btn-b: #6b7584; --btn-edge: #646e7d;
  --hover: #f2f4f7; --nav-text: #3b414b; --nav-icon: #a3acb8; --input-bg: #fbfcfd; --input-line: #dde1e8;
  --font-display: "Cormorant Garamond", Georgia, serif;
}
.panel-szalwia {
  --bg: #f4f6f1; --surface: #ffffff; --surface-2: #edf1e9;
  --text: #26302a; --muted: #7b8679; --line: #e2e8dd; --gold-line: #d7caa0;
  --accent: #6f8a6a; --accent-strong: #4a6347; --accent-soft: #e8efe5;
  --orn: #b9a46a; --btn-a: #85a07f; --btn-b: #6a8565; --btn-edge: #627d5d;
  --hover: #f1f5ee; --nav-text: #3c4a3e; --nav-icon: #a5b3a1; --input-bg: #fbfcfa; --input-line: #dbe3d6;
}
.panel-lawenda {
  --bg: #f8f5fc; --surface: #ffffff; --surface-2: #f1ecf8;
  --text: #2f2840; --muted: #857c98; --line: #e9e2f3; --gold-line: #d5c8ea;
  --accent: #8a73b5; --accent-strong: #634f8c; --accent-soft: #efe9f8;
  --orn: #a996cf; --btn-a: #a08cc8; --btn-b: #8069ae; --btn-edge: #7963a6;
  --hover: #f6f2fb; --nav-text: #463d5c; --nav-icon: #b4a7cf; --input-bg: #fdfcfe; --input-line: #e2daef;
}
.panel-granat {
  --bg: #f3f5f9; --surface: #ffffff; --surface-2: #eaeef5;
  --text: #1b2330; --muted: #6f7a8c; --line: #e0e5ee; --gold-line: #d9c48f;
  --accent: #1f3a5f; --accent-strong: #142843; --accent-soft: #e6ecf5;
  --orn: #c2a05a; --btn-a: #2b4c78; --btn-b: #1f3a5f; --btn-edge: #1a3354;
  --hover: #f0f3f8; --nav-text: #2c3646; --nav-icon: #9aa6b8; --input-bg: #fbfcfd; --input-line: #d9dfe9;
}
.panel-terakota {
  --bg: #faf3ec; --surface: #ffffff; --surface-2: #f6ebe1;
  --text: #3f2a20; --muted: #94796a; --line: #f0e2d6; --gold-line: #e5c3a8;
  --accent: #c0673f; --accent-strong: #934726; --accent-soft: #f9e9df;
  --orn: #c98a62; --btn-a: #d27d55; --btn-b: #b85f37; --btn-edge: #ab5631;
  --hover: #fbf1ea; --nav-text: #553b2e; --nav-icon: #d0a891; --input-bg: #fffcf9; --input-line: #ecdccf;
  --font-display: "Cormorant Garamond", Georgia, serif;
}
.panel-szmaragd {
  color-scheme: dark;
  --bg: #0f2622; --surface: #14302b; --surface-2: #1a3a34;
  --text: #f1e9d8; --muted: #a9b8ad; --line: #24463f; --gold-line: #5a5233;
  --accent: #c9a45c; --accent-strong: #e2c587; --accent-soft: #233a2c; --on-accent: #10221e;
  --orn: #c9a45c; --orn-o: .7;
  --btn-a: #d6b56f; --btn-b: #b8924a; --btn-edge: #b8924a; --btn-text: #10221e;
  --side-bg: rgba(13, 34, 30, .96); --bar-bg: rgba(15, 38, 34, .92);
  --hover: rgba(201, 164, 92, .08); --nav-text: #dfe6dc; --nav-icon: #8aa196; --input-bg: #0d221e; --input-line: #2c524a;
  --ok: #8fc29b; --ok-soft: #1c3a2b; --warn: #e3b062; --warn-soft: #3a3320; --danger: #ec8b80; --danger-soft: #3d2622;
  --shadow: none;
}
.panel-minimal {
  --bg: #ffffff; --surface: #ffffff; --surface-2: #f5f5f5;
  --text: #111111; --muted: #6b6b6b; --line: #e8e8e8; --gold-line: #d4d4d4;
  --accent: #111111; --accent-strong: #000000; --accent-soft: #f0f0f0;
  --orn: #111111; --orn-o: 0;
  --btn-a: #111111; --btn-b: #111111; --btn-edge: #111111;
  --hover: #f6f6f6; --nav-text: #333333; --nav-icon: #9a9a9a; --input-bg: #ffffff; --input-line: #dcdcdc;
  --font-display: "Inter", system-ui, sans-serif; --shadow: none;
}
.panel-minimal h1, .panel-minimal .card h2 { letter-spacing: -.01em; }

/* --- Nowe szaty panelu (2026-10): klasyczne, nowoczesne, kolorowe --- */
.panel-bordo {
  --bg: #f8f3ee; --surface: #fffdfa; --surface-2: #f3ebe3;
  --text: #2c1a1e; --muted: #8b7471; --line: #eadfd6; --gold-line: #d9bf86;
  --accent: #7a1f32; --accent-strong: #5c1424; --accent-soft: #f4e4e4;
  --orn: #c4a05a; --btn-a: #922a40; --btn-b: #6e1a2c; --btn-edge: #641727;
  --hover: #f8eeeb; --nav-text: #4a3034; --nav-icon: #c2a29a; --input-bg: #fffdfa; --input-line: #e6d8cc;
  --font-display: "Cormorant Garamond", Georgia, serif;
}
.panel-vintage {
  --bg: #f1e9db; --surface: #fbf6ec; --surface-2: #efe4d0;
  --text: #3a2c20; --muted: #85705b; --line: #e0d2ba; --gold-line: #c8ae86;
  --accent: #8a5a3b; --accent-strong: #6a4228; --accent-soft: #eddcc8;
  --orn: #a3784f; --orn-o: .7; --btn-a: #9c6a47; --btn-b: #7e5133; --btn-edge: #74492d;
  --hover: #f3e8d8; --nav-text: #4e3c2c; --nav-icon: #b49b7e; --input-bg: #fdf9f1; --input-line: #dccbb0;
  --font-display: "Playfair Display", Georgia, serif;
  --pattern: radial-gradient(rgba(120, 85, 50, .07) 1px, transparent 1px);
}
.panel-nowy {
  --bg: #f6f5fb; --surface: #ffffff; --surface-2: #f0eefa;
  --text: #16142b; --muted: #6e6b86; --line: #e7e4f3; --gold-line: #d9d2fb;
  --accent: #6d4aff; --accent-strong: #4f2fe0; --accent-soft: #efeaff;
  --orn: #6d4aff; --orn-o: 0; --btn-a: #8a6bff; --btn-b: #5b39f2; --btn-edge: #5b39f2;
  --hover: #f3f0ff; --nav-text: #34314d; --nav-icon: #a7a2c4; --input-bg: #ffffff; --input-line: #e0dcef;
}
.panel-grafit {
  color-scheme: dark;
  --bg: #121417; --surface: #1a1d22; --surface-2: #22262c;
  --text: #e8edf2; --muted: #8f99a6; --line: #2a2f37; --gold-line: #2f4a47;
  --accent: #2ee6c5; --accent-strong: #6af2da; --accent-soft: #15302d; --on-accent: #06201b;
  --orn: #2ee6c5; --orn-o: 0; --btn-a: #3df0cf; --btn-b: #1fcfb0; --btn-edge: #1fcfb0; --btn-text: #06201b;
  --side-bg: rgba(20, 22, 26, .96); --bar-bg: rgba(18, 20, 23, .92);
  --hover: rgba(46, 230, 197, .07); --nav-text: #c9d1da; --nav-icon: #6b7684; --input-bg: #15181c; --input-line: #313741;
  --ok: #7fdca0; --ok-soft: #173024; --warn: #f2c063; --warn-soft: #2e2716; --danger: #ff8a80; --danger-soft: #36201f;
  --shadow: none;
}
.panel-redakcja {
  --bg: #fbfaf7; --surface: #ffffff; --surface-2: #f4f2ed;
  --text: #121212; --muted: #6d6a64; --line: #e6e3dc; --gold-line: #121212;
  --accent: #ff5a4e; --accent-strong: #d63a2f; --accent-soft: #ffece9;
  --orn: #121212; --orn-o: 0; --btn-a: #121212; --btn-b: #121212; --btn-edge: #121212;
  --hover: #f6f4ef; --nav-text: #2b2b2b; --nav-icon: #9b978f; --input-bg: #ffffff; --input-line: #d9d5cc;
  --font-display: "Playfair Display", Georgia, serif;
}
.panel-tecza {
  --bg: #fffaf3; --surface: #ffffff; --surface-2: #fff2f5;
  --text: #2b2140; --muted: #7c7092; --line: #f1e6ef; --gold-line: #ffc7d6;
  --accent: #ff4f7b; --accent-strong: #e0285a; --accent-soft: #ffe8ee;
  --orn: #ff4f7b; --orn-o: 0; --btn-a: #ff6f91; --btn-b: #8b5cf6; --btn-edge: #ff4f7b;
  --hover: #fff1f5; --nav-text: #3d3256; --nav-icon: #c0a8d6; --input-bg: #ffffff; --input-line: #eedde8;
  --font-display: "Josefin Sans", "Inter", sans-serif;
}
.panel-cytrus {
  --bg: #fbfdf2; --surface: #ffffff; --surface-2: #f4f9e2;
  --text: #22301a; --muted: #6f7b5f; --line: #e8efd2; --gold-line: #ffd27a;
  --accent: #f28c00; --accent-strong: #c46c00; --accent-soft: #fff1d9;
  --orn: #8cc63f; --orn-o: 0; --btn-a: #ffab2e; --btn-b: #f07c00; --btn-edge: #e57400;
  --hover: #f8fbe9; --nav-text: #364528; --nav-icon: #a9bd7c; --input-bg: #ffffff; --input-line: #e2eac8;
  --font-display: "Josefin Sans", "Inter", sans-serif;
}
.panel-koral {
  --bg: #f3fbfb; --surface: #ffffff; --surface-2: #e7f6f6;
  --text: #13303a; --muted: #5e7a83; --line: #dcefef; --gold-line: #9fdedf;
  --accent: #ff6b5e; --accent-strong: #e0473a; --accent-soft: #ffeae7;
  --orn: #0aa5a8; --orn-o: 0; --btn-a: #ff8a6b; --btn-b: #ff5e57; --btn-edge: #f2534c;
  --hover: #ecf8f8; --nav-text: #1f4450; --nav-icon: #84b8bd; --input-bg: #ffffff; --input-line: #cfe7e8;
  --font-display: "Montserrat", "Inter", sans-serif;
}


/* --- Szaty panelu – runda 2 --- */
.panel-velvet {
  color-scheme: dark;
  --bg: #1e0a10; --surface: #2a1018; --surface-2: #361520;
  --text: #f5e6dc; --muted: #c9a99e; --line: #43202b; --gold-line: #6a4a2a;
  --accent: #d6b46a; --accent-strong: #ecd08f; --accent-soft: #3d1f20; --on-accent: #1e0a10;
  --orn: #d6b46a; --orn-o: .65; --btn-a: #e2c27c; --btn-b: #c09a4e; --btn-edge: #c09a4e; --btn-text: #1e0a10;
  --side-bg: rgba(30, 10, 16, .96); --bar-bg: rgba(30, 10, 16, .92);
  --hover: rgba(214, 180, 106, .08); --nav-text: #ead6cc; --nav-icon: #9c7a72; --input-bg: #1a080d; --input-line: #4e2532;
  --ok: #b9d79a; --ok-soft: #2a3320; --warn: #f0c870; --warn-soft: #3a2e18; --danger: #f29a9a; --danger-soft: #45161e;
  --shadow: none; --font-display: "Playfair Display", Georgia, serif;
}
.panel-gwiazdy {
  color-scheme: dark;
  --bg: #0f1733; --surface: #16204a; --surface-2: #1d295a;
  --text: #eef1ff; --muted: #a8b2d8; --line: #27346a; --gold-line: #4b4a6a;
  --accent: #e7c873; --accent-strong: #f5dc94; --accent-soft: #252c4a; --on-accent: #0f1733;
  --orn: #e7c873; --orn-o: .6; --btn-a: #f0d58a; --btn-b: #d9b85e; --btn-edge: #d9b85e; --btn-text: #0f1733;
  --side-bg: rgba(15, 23, 51, .96); --bar-bg: rgba(15, 23, 51, .92);
  --hover: rgba(231, 200, 115, .07); --nav-text: #dfe4ff; --nav-icon: #7f89b8; --input-bg: #0c1330; --input-line: #2f3d78;
  --ok: #8fd6b4; --ok-soft: #173a30; --warn: #f0c870; --warn-soft: #3a3320; --danger: #f29aac; --danger-soft: #3d1f2a;
  --shadow: none; --font-display: "Cormorant Garamond", Georgia, serif;
}
.panel-gwiazdy::before { -webkit-mask: none; mask: none; background:
  radial-gradient(1.2px 1.2px at 10% 20%, #fff, transparent), radial-gradient(1px 1px at 30% 70%, #fff, transparent), radial-gradient(1.4px 1.4px at 55% 35%, #fff, transparent),
  radial-gradient(1px 1px at 75% 80%, #fff, transparent), radial-gradient(1.6px 1.6px at 88% 15%, #e7c873, transparent), radial-gradient(1px 1px at 45% 90%, #fff, transparent); opacity: .7; }
.panel-atrament {
  --bg: #f7f3ea; --surface: #fffdf7; --surface-2: #efe9db;
  --text: #1a1a1a; --muted: #5d584e; --line: #e2dccd; --gold-line: #1a1a1a;
  --accent: #b23a2b; --accent-strong: #8e2a1e; --accent-soft: #f4e2dc;
  --orn: #1a1a1a; --orn-o: 0; --btn-a: #1a1a1a; --btn-b: #1a1a1a; --btn-edge: #1a1a1a;
  --hover: #f1ecdf; --nav-text: #2b2b2b; --nav-icon: #8f897c; --input-bg: #fffdf7; --input-line: #d6cfbd;
  --font-display: "Playfair Display", Georgia, serif;
}
.panel-atrament h1, .panel-atrament .card h2 { font-style: italic; }
.panel-atrament .card, .panel-atrament .stat, .panel-atrament .kpi { border: 1px solid #1a1a1a; border-radius: 2px; box-shadow: none; }
.panel-atrament .btn { border-radius: 2px; }
.panel-atrament .sidenav-nav a.active { background: none; color: #b23a2b; box-shadow: inset 3px 0 0 #b23a2b; border-radius: 0; }
.panel-lod {
  --bg: #eef4fa; --surface: rgba(255, 255, 255, .78); --surface-2: #e2ecf6;
  --text: #1f2f40; --muted: #627589; --line: #d3e1ee; --gold-line: #b9cde0;
  --accent: #4f7fb0; --accent-strong: #33618f; --accent-soft: #dfeaf6;
  --orn: #9ab7d3; --orn-o: .6; --btn-a: #74a0cc; --btn-b: #4f7fb0; --btn-edge: #4a78a6;
  --hover: #e7f0f9; --nav-text: #2a3c50; --nav-icon: #93a9bf; --input-bg: #ffffff; --input-line: #cddcea;
  --font-display: "Montserrat", "Inter", sans-serif;
}
.panel-lod .card, .panel-lod .stat, .panel-lod .kpi { backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.panel-pop {
  --bg: #fffbe6; --surface: #ffffff; --surface-2: #fff4b8;
  --text: #111111; --muted: #444; --line: #111111; --gold-line: #111111;
  --accent: #ff2e88; --accent-strong: #d4005f; --accent-soft: #ffe0ee;
  --orn: #111; --orn-o: 0; --btn-a: #ff2e88; --btn-b: #ff2e88; --btn-edge: #111;
  --hover: #fff6c7; --nav-text: #111; --nav-icon: #555; --input-bg: #ffffff; --input-line: #111;
  --font-display: "Montserrat", "Inter", sans-serif; --shadow: 4px 4px 0 #111;
  background-image: radial-gradient(#ff2e8826 2px, transparent 2.5px); background-size: 16px 16px;
}
.panel-pop .card, .panel-pop .stat, .panel-pop .kpi, .panel-pop .welcome { border: 3px solid #111 !important; box-shadow: 4px 4px 0 #111 !important; }
.panel-pop .btn { border: 2px solid #111; box-shadow: 2px 2px 0 #111; font-weight: 700; }
.panel-pop h1 { text-transform: uppercase; }
.panel-pop .stat:nth-child(3n+1) { background: #fff35c !important; } .panel-pop .stat:nth-child(3n+2) { background: #bfe0ff !important; }
.panel-retro {
  --bg: #fbf0d9; --surface: #fffaf0; --surface-2: #f5e3bf;
  --text: #4a2a16; --muted: #7d5a3e; --line: #ecd6ae; --gold-line: #e7b77a;
  --accent: #e0762c; --accent-strong: #b85818; --accent-soft: #f8dcc0;
  --orn: #e0762c; --orn-o: 0; --btn-a: #f2a93b; --btn-b: #e0762c; --btn-edge: #c96218;
  --hover: #f7e8c9; --nav-text: #4a2a16; --nav-icon: #b89671; --input-bg: #fffaf0; --input-line: #e6cfa6;
  --font-display: "Josefin Sans", "Inter", sans-serif; --radius: 26px;
}
.panel-retro .welcome { background: repeating-linear-gradient(170deg, #f6d27a 0 22px, #f2a93b 22px 44px, #e0762c 44px 66px, #fbf0d9 66px 88px) !important; }
.panel-retro .welcome h1, .panel-retro .welcome-kicker { color: #4a2a16; }
.panel-sakura {
  --bg: #fff6f8; --surface: #ffffff; --surface-2: #fdebf0;
  --text: #4a2f38; --muted: #8c6f78; --line: #f5dbe3; --gold-line: #efc3d1;
  --accent: #d97a96; --accent-strong: #b85776; --accent-soft: #fde4ec;
  --orn: #e9a7bb; --btn-a: #eba0b6; --btn-b: #d97a96; --btn-edge: #cf6f8c;
  --hover: #fdf0f4; --nav-text: #5a3d46; --nav-icon: #d3a9b6; --input-bg: #fffbfc; --input-line: #f1d6de;
  --font-display: "Cormorant Garamond", Georgia, serif;
}
.panel-oliwka {
  --bg: #f6f4ea; --surface: #fcfbf5; --surface-2: #ece9d8;
  --text: #33331f; --muted: #6c6c4e; --line: #e2dec8; --gold-line: #cfc79a;
  --accent: #6f7a3a; --accent-strong: #505a24; --accent-soft: #e6e8cf;
  --orn: #a3a35a; --btn-a: #86913f; --btn-b: #6f7a3a; --btn-edge: #66702f;
  --hover: #efeddf; --nav-text: #3e3e26; --nav-icon: #a6a580; --input-bg: #fdfcf7; --input-line: #dcd8bf;
  --font-display: "Playfair Display", Georgia, serif;
}
.panel-morze {
  --bg: #f2f8f8; --surface: #ffffff; --surface-2: #e4f1f1;
  --text: #173236; --muted: #587275; --line: #d5e8e8; --gold-line: #e3cfa5;
  --accent: #1f7f86; --accent-strong: #135f65; --accent-soft: #dbefef;
  --orn: #c9b27e; --btn-a: #2b9aa2; --btn-b: #1f7f86; --btn-edge: #1b737a;
  --hover: #ebf5f5; --nav-text: #21444a; --nav-icon: #8fb2b5; --input-bg: #ffffff; --input-line: #cfe3e3;
  --font-display: "Cormorant Garamond", Georgia, serif;
}
.panel-morze .welcome { background: linear-gradient(180deg, #ffffff 55%, #d9efef) !important; }

/* --- Charakter kategorii: kształty, czcionki i ozdoby, nie tylko kolory --- */
/* Nowoczesne: bez piór i diamentów, bezszeryfowe nagłówki, karty bez ramek z miękkim cieniem, przyciski-pigułki */
.pcat-nowoczesne { --radius: 20px; --radius-sm: 12px; --shadow: 0 1px 2px rgba(20, 16, 50, .04), 0 10px 30px -14px rgba(20, 16, 50, .22); }
.panel-nowy, .panel-grafit { --font-display: "Montserrat", "Inter", sans-serif; }
.pcat-nowoczesne::before, .pcat-nowoczesne .decor, .pcat-kolorowe::before { display: none; }
.pcat-nowoczesne h1 { font-weight: 700; letter-spacing: -.02em; }
.pcat-nowoczesne.layout-panel .card h2 { font-weight: 700; letter-spacing: -.01em; }
.pcat-nowoczesne.layout-panel .card h2::after, .pcat-kolorowe.layout-panel .card h2::after { display: none; }
.pcat-nowoczesne .card, .pcat-nowoczesne .stat, .pcat-nowoczesne .kpi { border-color: transparent; box-shadow: var(--shadow); }
.pcat-nowoczesne .btn, .pcat-kolorowe .btn { border-radius: 999px; }
.pcat-nowoczesne .welcome::before, .pcat-nowoczesne .welcome::after, .pcat-nowoczesne .welcome-count::before { display: none; }
.pcat-nowoczesne .welcome-count { padding-left: 0; }
.pcat-nowoczesne .welcome { background: linear-gradient(135deg, var(--surface), var(--accent-soft)); border-color: transparent; }
.pcat-nowoczesne .sidenav-nav a.active { background: var(--accent); color: var(--on-accent); }
.pcat-nowoczesne .sidenav-nav a.active .nav-icon { color: var(--on-accent); }
.pcat-nowoczesne .sidenav-nav a.active::before { display: none; }
.pcat-nowoczesne .sidenav-monogram { border-radius: 14px; box-shadow: none; background: var(--accent); color: var(--on-accent); border: 0; }
.pcat-nowoczesne .sidenav-label::before { display: none; }
.panel-redakcja h1, .panel-redakcja .welcome h1 { font-weight: 600; font-style: italic; }
.panel-redakcja .card, .panel-redakcja .stat, .panel-redakcja .kpi { border: 1px solid #121212; box-shadow: none; border-radius: 0; }
.panel-redakcja .btn { border-radius: 0; }
.panel-redakcja .btn-primary { background: #121212; color: #fff; }
.panel-redakcja .welcome { background: #fff; border: 2px solid #121212; border-radius: 0; }
.panel-redakcja .sidenav-nav a.active { background: var(--accent); color: #fff; border-radius: 0; }
.panel-redakcja .sidenav-monogram { border-radius: 0; background: #121212; }

/* Kolorowe: kolorowe plamy w tle, karty i liczniki w różnych kolorach, gradientowe przyciski */
.pcat-kolorowe { --radius: 22px; --radius-sm: 12px; --shadow: 0 10px 28px -16px rgba(60, 20, 80, .3); }
.pcat-kolorowe .decor i { -webkit-mask: none; mask: none; border-radius: 50%; opacity: .35; filter: blur(50px); transform: none; }
.pcat-kolorowe .decor-feather { right: -80px; bottom: -80px; width: 360px; height: 360px; background: var(--btn-b); }
.pcat-kolorowe .decor-down { left: 180px; top: -100px; width: 380px; height: 380px; background: var(--accent); }
.pcat-kolorowe .btn-primary { background: linear-gradient(120deg, var(--btn-a), var(--btn-b)); border: 0; color: #fff; }
.pcat-kolorowe .card, .pcat-kolorowe .stat, .pcat-kolorowe .kpi { border-color: transparent; box-shadow: var(--shadow); }
.pcat-kolorowe .stat:nth-child(5n+1), .pcat-kolorowe .kpi:nth-child(5n+1) { background: #fff0f4; --k: #ff4f7b; }
.pcat-kolorowe .stat:nth-child(5n+2), .pcat-kolorowe .kpi:nth-child(5n+2) { background: #eef4ff; --k: #2d6cdf; }
.pcat-kolorowe .stat:nth-child(5n+3), .pcat-kolorowe .kpi:nth-child(5n+3) { background: #fff6e2; --k: #f28c00; }
.pcat-kolorowe .stat:nth-child(5n+4), .pcat-kolorowe .kpi:nth-child(5n+4) { background: #eafaf2; --k: #12a36b; }
.pcat-kolorowe .stat:nth-child(5n+5), .pcat-kolorowe .kpi:nth-child(5n+5) { background: #f4efff; --k: #8b5cf6; }
.pcat-kolorowe .stat .stat-icon, .pcat-kolorowe .stat span { color: var(--k, var(--accent)); }
.pcat-kolorowe .welcome { background: linear-gradient(120deg, color-mix(in srgb, var(--btn-a) 18%, #fff), color-mix(in srgb, var(--btn-b) 16%, #fff)); border-color: transparent; }
.pcat-kolorowe .welcome::before, .pcat-kolorowe .welcome::after, .pcat-kolorowe .welcome-count::before { display: none; }
.pcat-kolorowe .welcome-count { padding-left: 0; }
.pcat-kolorowe h1 { font-weight: 700; }
.pcat-kolorowe.layout-panel .card h2 { font-weight: 700; }
.pcat-kolorowe .sidenav-nav a.active { background: linear-gradient(120deg, var(--btn-a), var(--btn-b)); color: #fff; }
.pcat-kolorowe .sidenav-nav a.active .nav-icon { color: #fff; }
.pcat-kolorowe .sidenav-nav a.active::before { display: none; }
.pcat-kolorowe .sidenav-monogram { background: linear-gradient(135deg, var(--btn-a), var(--btn-b)); color: #fff; border: 0; box-shadow: none; }
.pcat-kolorowe .sidenav-label::before { display: none; }

/* Klasyczne: podwójne złote ramki, kapitaliki w nagłówkach kart */
.pcat-klasyczne .card { outline: 1px solid color-mix(in srgb, var(--gold-line) 70%, transparent); outline-offset: -6px; }
.pcat-klasyczne.layout-panel .card h2 { font-variant: small-caps; letter-spacing: .04em; }
.panel-bordo .welcome h1, .panel-bordo h1 { font-style: italic; }
.panel-vintage .ui-glamour, .panel-vintage { background-image: var(--pattern); background-size: 6px 6px; }
.panel-vintage .card { border-style: dashed; border-color: var(--gold-line); }

/* --- Ozdoby: maski w kolorze szaty --- */
.ui-glamour::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: var(--orn); opacity: calc(var(--orn-o) * .9);
  -webkit-mask: url(../img/glam-sparkles.svg) 0 0 / 280px repeat; mask: url(../img/glam-sparkles.svg) 0 0 / 280px repeat; }
.decor { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.decor i { position: absolute; display: block; background: var(--orn); opacity: calc(var(--orn-o) * .55); }
.decor-feather { right: -30px; bottom: -40px; width: 230px; height: 530px; transform: rotate(-24deg);
  -webkit-mask: url(../img/glam-feather.svg) center / contain no-repeat; mask: url(../img/glam-feather.svg) center / contain no-repeat; }
.decor-down { left: 210px; top: -70px; width: 260px; height: 260px;
  -webkit-mask: url(../img/glam-down.svg) center / contain no-repeat; mask: url(../img/glam-down.svg) center / contain no-repeat; }
.layout-main .decor-down { left: -60px; top: auto; bottom: -60px; }
.gem { -webkit-mask: url(../img/glam-gem.svg) center / contain no-repeat; mask: url(../img/glam-gem.svg) center / contain no-repeat; background: var(--orn); }
.ui-glamour ::selection { background: var(--accent-soft); color: var(--accent-strong); }
.ui-glamour h1 { font-weight: 400; letter-spacing: .01em; }
.ui-glamour a { color: var(--accent-strong); }

/* Karty */
.ui-glamour .card, .ui-glamour .stat, .ui-glamour .kpi { border-color: var(--line); }
.ui-glamour.layout-panel .card h2, .ui-glamour.layout-main .card h2 { font-family: var(--font-display); font-size: 1.2rem; font-weight: 600; letter-spacing: .01em; }
.ui-glamour.layout-panel .card h2::after, .ui-glamour.layout-main .card h2::after { content: ""; flex: 0 0 9px; height: 9px; margin-left: .15rem; background: var(--orn); transform: rotate(45deg) scale(.7); opacity: calc(var(--orn-o) * .55); }
.ui-glamour .card h2 > .icon, .ui-glamour h1 .icon { color: var(--orn); }
.panel-minimal .card h2 > .icon, .panel-minimal h1 .icon { color: var(--accent); }
.ui-glamour .stat span, .ui-glamour .kpi-value { font-family: var(--font-display); font-weight: 600; letter-spacing: 0; }
.ui-glamour a.stat:hover, .ui-glamour .budget-widget:hover { border-color: var(--gold-line); }
.ui-glamour .stat-icon { color: var(--accent); opacity: .85; }

/* Przyciski */
.ui-glamour .btn { background: var(--surface); border-color: var(--gold-line); color: var(--text); letter-spacing: .02em; }
.ui-glamour .btn:hover { background: var(--accent-soft); border-color: var(--accent); }
.ui-glamour .btn-primary { background: linear-gradient(180deg, var(--btn-a), var(--btn-b)); border-color: var(--btn-edge); color: var(--btn-text); }
.ui-glamour .btn-primary:hover { background: var(--btn-b); border-color: var(--btn-edge); }
.ui-glamour .btn-ghost { background: transparent; }
.ui-glamour .btn-danger-ghost { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 30%, transparent); background: var(--surface); }
.ui-glamour .btn-danger-ghost:hover { background: var(--danger-soft); border-color: var(--danger); }

/* Formularze i tabele */
.ui-glamour input, .ui-glamour select, .ui-glamour textarea { background: var(--input-bg); border-color: var(--input-line); color: var(--text); }
.ui-glamour input:hover, .ui-glamour select:hover, .ui-glamour textarea:hover { border-color: var(--gold-line); }
.ui-glamour input:focus, .ui-glamour select:focus, .ui-glamour textarea:focus { border-color: var(--accent); }
.ui-glamour input[type="checkbox"]:not(:checked), .ui-glamour input[type="radio"]:not(:checked) { background-color: var(--input-bg, var(--surface)); }
.ui-glamour .switch:not(:checked), .ui-glamour label.check > input[type="checkbox"]:not(:checked) { background: color-mix(in srgb, var(--muted) 30%, var(--surface)); }
.ui-glamour code { background: var(--accent-soft); color: var(--accent-strong); }
.ui-glamour .table th { background: transparent; color: var(--accent); border-bottom: 1px solid var(--gold-line); letter-spacing: .12em; font-size: .68rem; }
.ui-glamour .table tbody tr:hover { background: var(--hover); }

/* Boczne menu pary */
.ui-glamour .sidenav { background: var(--side-bg); border-right-color: var(--line); }
.ui-glamour .sidenav-head { border-bottom-color: var(--line); padding-bottom: 1.1rem; overflow: hidden; }
.ui-glamour .sidenav-head::after { content: ""; position: absolute; right: -6px; top: -36px; width: 70px; height: 160px; background: var(--orn); opacity: calc(var(--orn-o) * .45); transform: rotate(32deg); pointer-events: none;
  -webkit-mask: url(../img/glam-feather.svg) center / contain no-repeat; mask: url(../img/glam-feather.svg) center / contain no-repeat; }
.ui-glamour .sidenav-monogram { background: var(--surface); color: var(--accent-strong); border: 1px solid var(--accent); border-radius: 50%; box-shadow: 0 0 0 3px var(--surface), 0 0 0 4px var(--gold-line); font: 400 .95rem var(--font-display); letter-spacing: .02em; }
.ui-glamour .sidenav-names { font-weight: 400; font-size: 1.35rem; }
.ui-glamour .sidenav-date { text-transform: uppercase; letter-spacing: .14em; font-size: .7rem; }
.ui-glamour .sidenav-date .icon { color: var(--accent); }
.ui-glamour .sidenav-label { display: flex; align-items: center; gap: .5rem; color: var(--accent); letter-spacing: .2em; font-size: .64rem; }
.ui-glamour .sidenav-label::before { content: ""; width: 6px; height: 6px; background: var(--orn); transform: rotate(45deg); flex: none; }
.ui-glamour .sidenav-label::after { content: ""; height: 1px; flex: 1; background: linear-gradient(90deg, var(--gold-line), transparent); }
.ui-glamour .sidenav-nav a { color: var(--nav-text); }
.ui-glamour .sidenav-nav a:hover { background: var(--hover); color: var(--text); }
.ui-glamour .sidenav-nav a.active { background: var(--accent-soft); color: var(--accent-strong); }
.ui-glamour .sidenav-nav a.active::before { background: var(--accent); }
.ui-glamour .nav-icon { color: var(--nav-icon); }
.ui-glamour .sidenav-nav a:hover .nav-icon, .ui-glamour .sidenav-nav a.active .nav-icon { color: var(--accent); }
.ui-glamour .sidenav-foot { border-top-color: var(--line); }
.ui-glamour .mobilebar, .ui-glamour .panel-tabbar, .ui-glamour .topbar { background: var(--bar-bg); border-color: var(--line); }
.ui-glamour .mobilebar-brand { font-weight: 400; }
.ui-glamour .icon-btn { background: var(--surface); border-color: var(--gold-line); color: var(--accent-strong); }
.ui-glamour .panel-tabbar a.active, .ui-glamour .panel-tabbar button.active { color: var(--accent-strong); }
.ui-glamour .panel-tabbar a.active .icon, .ui-glamour .panel-tabbar button.active .icon { background: var(--accent-soft); }

/* Górny pasek administratora */
.ui-glamour .topbar { border-bottom-color: var(--gold-line); }
.ui-glamour .brand { font-weight: 400; letter-spacing: .02em; }
.ui-glamour .brand-mark { border: 0; background: var(--orn); -webkit-mask: url(../img/glam-gem.svg) center / 82% no-repeat; mask: url(../img/glam-gem.svg) center / 82% no-repeat; }
.ui-glamour .brand-mark .icon { display: none; }
.ui-glamour .topnav a, .ui-glamour .topnav-logout { color: var(--nav-text); }
.ui-glamour .topnav a:hover, .ui-glamour .topnav-logout:hover { background: var(--hover); color: var(--text); }
.ui-glamour .topnav a.active { background: transparent; color: var(--accent-strong); box-shadow: inset 0 -1px 0 var(--accent); border-radius: 0; }

/* Powitanie na pulpicie */
.ui-glamour .welcome { background: var(--surface); border-color: var(--gold-line); position: relative; overflow: hidden; }
.ui-glamour .welcome::before { content: ""; position: absolute; inset: 6px; border: 1px solid color-mix(in srgb, var(--orn) 22%, transparent); border-radius: calc(var(--radius) - 5px); pointer-events: none; }
.ui-glamour .welcome::after { content: ""; position: absolute; left: -40px; bottom: -70px; width: 200px; height: 200px; background: var(--orn); opacity: calc(var(--orn-o) * .5); pointer-events: none;
  -webkit-mask: url(../img/glam-down.svg) center / contain no-repeat; mask: url(../img/glam-down.svg) center / contain no-repeat; }
.ui-glamour .welcome-text, .ui-glamour .welcome-count { position: relative; z-index: 1; }
.ui-glamour .welcome-kicker { text-transform: uppercase; letter-spacing: .18em; font-size: .7rem; color: var(--accent); }
.ui-glamour .welcome h1 { font-size: 2.3rem; }
.ui-glamour .welcome-count { color: var(--muted); font-family: var(--font-body); font-size: .74rem; text-transform: uppercase; letter-spacing: .16em; flex-direction: column; align-items: center; gap: .35rem; padding-left: 68px; }
.ui-glamour .welcome-count::before { content: ""; position: absolute; left: 0; top: 50%; width: 54px; height: 54px; margin-top: -27px; background: var(--orn); opacity: var(--orn-o);
  -webkit-mask: url(../img/glam-gem.svg) center / contain no-repeat; mask: url(../img/glam-gem.svg) center / contain no-repeat; }
.panel-minimal .welcome-count { padding-left: 0; }
.ui-glamour .welcome-count .countdown-num { font-family: var(--font-display); font-weight: 400; color: var(--accent-strong); font-size: 3.4rem; letter-spacing: 0; }

/* Logowanie */
.ui-glamour .auth-card { border-color: var(--gold-line); position: relative; overflow: visible; }
.ui-glamour .auth-card::before { content: ""; position: absolute; inset: 6px; border: 1px solid color-mix(in srgb, var(--orn) 20%, transparent); border-radius: calc(var(--radius) - 5px); pointer-events: none; }
.ui-glamour .auth-card::after { content: ""; position: absolute; right: -70px; top: -60px; width: 120px; height: 280px; background: var(--orn); transform: rotate(28deg); opacity: calc(var(--orn-o) * .8); pointer-events: none; z-index: -1;
  -webkit-mask: url(../img/glam-feather.svg) center / contain no-repeat; mask: url(../img/glam-feather.svg) center / contain no-repeat; }
.ui-glamour .auth-mark { width: 64px; height: 64px; border: 0; background: var(--orn); -webkit-mask: url(../img/glam-gem.svg) center / contain no-repeat; mask: url(../img/glam-gem.svg) center / contain no-repeat; }
.ui-glamour .auth-mark .icon { display: none; }
.ui-glamour .auth-head h1 { font-size: 2.1rem; }
.ui-glamour .auth-foot { border-top-color: var(--line); }
.ui-glamour .auth-card form, .ui-glamour .auth-head, .ui-glamour .auth-foot { position: relative; }

/* Drobne elementy */
.ui-glamour .badge { background: var(--surface-2); }
.ui-glamour .badge-ok { background: var(--ok-soft); } .ui-glamour .badge-warn { background: var(--warn-soft); } .ui-glamour .badge-off { background: var(--danger-soft); }
.ui-glamour .chip { background: var(--surface); border-color: var(--line); }
.ui-glamour .chip.is-on { background: var(--accent-soft); border-color: var(--gold-line); color: var(--accent-strong); }
.ui-glamour .alert-info { border-color: var(--gold-line); }

.ui-glamour .kpi-icon, .ui-glamour .cat-icon, .ui-glamour .pay-icon { border: 1px solid color-mix(in srgb, var(--k, var(--c, var(--accent))) 25%, transparent); }
.ui-glamour .bar { background: var(--surface-2); }
.ui-glamour .seating-canvas { background-color: var(--surface-2); background-image: radial-gradient(circle, var(--line) 1px, transparent 1px); }
.ui-glamour .stat span, .ui-glamour .kpi-value, .ui-glamour .countdown-num, .ui-glamour .poll-count strong, .ui-glamour .donut-center strong { font-variant-numeric: lining-nums tabular-nums; }

/* Kartki księgi gości mają własne kolory – przyciski na nich neutralne */
.ui-glamour .gb-card .btn { color: #2e2a25; border-color: rgba(46, 42, 37, .2); background: rgba(255, 255, 255, .6); }
.ui-glamour .gb-card .btn:hover { background: #fff; border-color: #a8875a; }
.ui-glamour .gb-card .btn-danger-ghost { color: #b0473f; border-color: rgba(176, 71, 63, .3); }

/* Podglądy szat gości i plakat QR: własne kolory, bez dziedziczenia z panelu */
.ui-glamour .theme-preview, .ui-glamour .qr-themed { --gold-line: var(--line); --on-accent: #fff; color-scheme: light; }
.ui-glamour .qr-themed { color: var(--text); }
.ui-glamour .qr-cards.qr-themed { background: var(--bg); padding: .8rem; border-radius: var(--radius); }
.ui-glamour .theme-preview.theme-classic, .ui-glamour .qr-themed.theme-classic {
  --bg: #faf7f2; --surface: #ffffff; --surface-2: #f4efe7; --text: #2e2a25; --muted: #7a7166; --line: #e7dfd3;
  --accent: #a8875a; --accent-strong: #8c6d42; --accent-soft: #f3ebdf;
  --font-display: "Cormorant Garamond", Georgia, serif;
}
.ui-glamour .theme-preview.theme-glamour, .ui-glamour .theme-preview.theme-artdeco, .ui-glamour .qr-themed.theme-glamour, .ui-glamour .qr-themed.theme-artdeco { --on-accent: #141312; color-scheme: dark; }

/* Wybór szaty panelu pary: miniatury panelu */
.section-title { margin: 2rem 0 .3rem; }
.panel-theme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.pt-preview { display: grid; grid-template-columns: 34% 1fr; height: 128px; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); background: var(--bg); position: relative; transition: transform .15s; }
.theme-option input:checked + .pt-preview { box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--accent); }
.theme-option:hover .pt-preview { transform: translateY(-2px); }
.pt-side { background: var(--side-bg); border-right: 1px solid var(--line); padding: 10px 7px; display: grid; align-content: start; gap: 5px; }
.pt-side i { display: block; height: 5px; border-radius: 3px; background: var(--nav-icon); opacity: .6; }
.pt-side i.on { background: var(--accent); opacity: 1; }
.pt-main { padding: 10px; display: grid; align-content: start; gap: 7px; }
.pt-card { background: var(--surface); border: 1px solid var(--gold-line); border-radius: 6px; padding: 6px 7px; font: 400 .78rem var(--font-display); color: var(--text); display: flex; justify-content: space-between; align-items: center; }
.pt-card b { color: var(--accent-strong); font-weight: 600; }
.pt-btn { justify-self: start; height: 14px; width: 54px; border-radius: 4px; background: linear-gradient(180deg, var(--btn-a), var(--btn-b)); }
.pt-gem { position: absolute; right: 8px; bottom: 6px; width: 26px; height: 26px; opacity: var(--orn-o); }

@media (max-width: 1000px) {
  .decor-down { left: auto; right: -80px; top: 40px; }
}
@media (max-width: 640px) {
  .decor-feather { width: 150px; height: 340px; }
  .ui-glamour .welcome h1 { font-size: 1.8rem; }
  .ui-glamour .welcome::after { left: auto; bottom: auto; right: -70px; top: -70px; width: 170px; height: 170px; }
  .ui-glamour .welcome-count { flex-direction: row; align-items: baseline; padding-left: 52px; }
  .ui-glamour .welcome-count::before { width: 40px; height: 40px; margin-top: -20px; }
  .ui-glamour .welcome-count .countdown-num { font-size: 2.6rem; }
  .ui-glamour .auth-card::after { right: -30px; top: -80px; width: 80px; height: 190px; }
  .budget-widget > .kpi-icon { display: none; }
}
@media print {
  .ui-glamour { background: #fff; }
  .ui-glamour::before, .decor { display: none; }
}

/* ---------- Szata graficzna: lista + podgląd na żywo ---------- */
.theme-studio { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 1.5rem; align-items: start; }
.ts-target { margin-bottom: .6rem; }
.pill-seg { display: inline-flex; gap: .25rem; padding: .25rem; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); }
.pill-seg > button { all: unset; display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 1rem; border-radius: 999px; cursor: pointer; font-size: .9rem; font-weight: 500; color: var(--muted); min-height: 24px; transition: background .2s, color .2s, box-shadow .2s; }
.pill-seg > button.active { background: var(--surface); color: var(--text); box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 4px 12px -6px rgba(0,0,0,.2); }
.pill-seg > button:focus-visible { outline: 2px solid var(--accent); }
.ts-filters { display: flex; gap: .4rem; overflow-x: auto; padding: .2rem 0 .8rem; scrollbar-width: none; }
.ts-filters .chip { flex: none; cursor: pointer; }
.theme-studio .theme-grid, .theme-studio .panel-theme-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.theme-studio .theme-option[hidden] { display: none !important; }
.ts-match { border-bottom: 0; }
.ts-preview { position: sticky; top: 1.25rem; padding: 1rem; display: grid; gap: .8rem; }
.ts-preview-head { display: flex; justify-content: space-between; gap: .6rem; align-items: flex-start; }
.ts-preview-head strong { display: block; font-family: var(--font-display); font-size: 1.25rem; font-weight: 600; }
.ts-preview-head .muted { display: block; margin-top: .15rem; }
.ts-close { display: none; flex: none; }
.ts-device { position: relative; overflow: hidden; margin: 0 auto; width: var(--ts-w, 100%); border-radius: 26px; background: #111; box-shadow: 0 0 0 7px #111, 0 18px 40px -18px rgba(0,0,0,.5); }
.ts-device iframe { position: absolute; left: 0; top: 0; border: 0; transform-origin: 0 0; background: #fff; display: block; }
.ts-loading { position: absolute; inset: 0; display: grid; place-items: center; background: color-mix(in srgb, var(--surface) 60%, transparent); color: var(--accent); z-index: 2; }
.ts-loading .icon { width: 30px; height: 30px; animation: spin 1s linear infinite; }
.ts-loading[hidden] { display: none; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 1000px) {
  .theme-studio { grid-template-columns: minmax(0, 1fr); }
  .theme-studio .theme-grid, .theme-studio .panel-theme-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
  .theme-studio .pt-preview { height: 104px; }
  .ts-preview { position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; top: auto; margin: 0; border-radius: 22px 22px 0 0; padding: .9rem 1rem calc(1rem + env(safe-area-inset-bottom));
    transform: translateY(105%); transition: transform .35s cubic-bezier(.2,.8,.2,1); box-shadow: 0 -12px 40px rgba(0,0,0,.25); max-height: 92dvh; }
  .ts-preview.is-open { transform: none; }
  .ts-close { display: inline-grid; }
  html.ts-sheet-open .panel-tabbar { visibility: hidden; }
}

/* ---------- Link galerii i hasło ---------- */
.gallery-link { margin-bottom: 1.25rem; }
.gl-row { display: flex; gap: .5rem; align-items: center; margin: .6rem 0 1rem; }
.gl-url { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: .55rem .7rem; border-radius: var(--radius-sm); font-size: .8rem; }
.gl-grid { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.gl-qr-box { display: grid; gap: .6rem; justify-items: center; max-width: 220px; }
.gl-qr-box .qr { background: #fff; padding: 10px; border-radius: 14px; border: 1px solid var(--line); line-height: 0; }
.gl-qr-box .qr img { width: 170px; height: 170px; image-rendering: pixelated; }
.gl-qr-box label.check { font-size: .8rem; }
.gallery-lock { text-align: center; max-width: 440px; margin: 1.5rem auto; padding: 2rem 1.25rem; }
.gallery-lock h1 { font-size: 1.6rem; margin: .6rem 0 .3rem; }
.gallery-lock .form { text-align: left; margin-top: 1rem; }
.gallery-lock-icon { display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--accent-soft); color: var(--accent); }
.gallery-lock-icon .icon { width: 28px; height: 28px; }
@media (max-width: 640px) {
  .gl-grid { grid-template-columns: 1fr; }
  .gl-qr-box { margin: 0 auto; }
}

/* ---------- Projekty z kodem QR: rysowanie (wspólne dla kreatora, listy i wydruku) ---------- */
.qd-page { position: absolute; left: 0; top: 0; overflow: hidden; transform-origin: 0 0; color: #222; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.qd-layer { position: absolute; inset: 0; pointer-events: none; }
.qd-el { position: absolute; box-sizing: border-box; transform-origin: 50% 50%; }
.qd-text { white-space: pre-wrap; overflow-wrap: break-word; }
.qd-text .qd-ph { opacity: .4; }
.qd-img { width: 100%; height: 100%; overflow: hidden; box-sizing: border-box; }
.qd-img img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; user-select: none; }
.qd-img.qd-heart { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M50 92C18 70 2 52 2 32 2 16 14 4 30 4c9 0 16 4 20 12 4-8 11-12 20-12 16 0 28 12 28 28 0 20-16 38-48 60z'/%3E%3C/svg%3E") center/100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M50 92C18 70 2 52 2 32 2 16 14 4 30 4c9 0 16 4 20 12 4-8 11-12 20-12 16 0 28 12 28 28 0 20-16 38-48 60z'/%3E%3C/svg%3E") center/100% 100% no-repeat; }
.qd-img-empty { width: 100%; height: 100%; display: grid; place-items: center; background: repeating-linear-gradient(45deg, #eee 0 10px, #f7f7f7 10px 20px); color: #999; font: 600 14px Inter, sans-serif; }
.qd-emoji { font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; }

/* Lista projektów i szablony */
.qr-links { display: grid; grid-template-columns: minmax(0, 1fr); gap: .6rem; margin: 1rem 0 1.25rem; }
.qr-link-row { display: flex; align-items: center; gap: .7rem; }
.qr-link-row > div { flex: 1; min-width: 0; }
.qr-link-row strong { display: block; font-size: .88rem; }
.qr-link-row code { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .76rem; background: none; padding: 0; color: var(--muted); }
.qr-link-ic { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); flex: none; }
.qd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.qd-card { padding: 0; overflow: hidden; display: flex; flex-direction: column; text-align: left; }
.qd-tpl { cursor: pointer; border: 1px solid var(--line); background: var(--surface); color: var(--text); font: inherit; transition: transform .2s, box-shadow .2s, border-color .2s; }
.qd-tpl:hover, .qd-tpl:focus-visible { transform: translateY(-3px); border-color: var(--accent); box-shadow: var(--shadow); }
.qd-thumb { display: block; padding: 12px; background: var(--surface-2); }
.qd-thumb-in { display: block; position: relative; height: 210px; overflow: hidden; }
.qd-thumb-in .qd-page { box-shadow: 0 6px 18px -8px rgba(0,0,0,.35); }
.qd-card-body { padding: .7rem .8rem .3rem; display: grid; gap: .1rem; }
.qd-card-actions { display: flex; flex-wrap: wrap; gap: .3rem; padding: .5rem .8rem .8rem; align-items: center; }
.qd-card-actions form { display: inline-flex; gap: .3rem; margin-left: auto; }
.qd-kind { margin-bottom: .5rem; }
@media (max-width: 640px) { .qd-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; } .qd-thumb-in { height: 170px; } .qd-card-actions .btn span { display: none; } }

/* Kreator */
.layout-panel:has(.qde) .panel-main { max-width: none; padding-bottom: 1rem; }
.qde { display: flex; flex-direction: column; height: calc(100dvh - 4rem); min-height: 520px; margin: -1rem -1.25rem 0; }
.qde-bar { display: flex; align-items: center; gap: .5rem; padding: .4rem .6rem; border-bottom: 1px solid var(--line); background: var(--surface); }
.qde-name { flex: 1; min-width: 80px; margin: 0; min-height: 38px; font-weight: 600; border-color: transparent; background: transparent; }
.qde-name:hover, .qde-name:focus { border-color: var(--line); background: var(--surface); }
.qde-bar-tools { display: flex; align-items: center; gap: .35rem; }
.qde-state { white-space: nowrap; max-width: 150px; overflow: hidden; text-overflow: ellipsis; }
.qde-main { flex: 1; display: grid; grid-template-columns: minmax(0, 1fr) 340px; min-height: 0; }
.qde-stage { position: relative; overflow: hidden; touch-action: none; user-select: none; -webkit-user-select: none;
  background: var(--surface-2); background-image: radial-gradient(circle, color-mix(in srgb, var(--muted) 30%, transparent) 1px, transparent 1px); background-size: 18px 18px; }
.qde-world { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
.qde-world .qd-page { position: relative; box-shadow: 0 2px 4px rgba(0,0,0,.08), 0 24px 50px -20px rgba(0,0,0,.45); }
.qde-world .qd-el { cursor: move; }
.qde-world .qd-el.is-editing { cursor: text; outline: 2px dashed var(--accent); outline-offset: 4px; user-select: text; -webkit-user-select: text; }
.qde-sel { position: absolute; border: 1.5px solid var(--accent); box-shadow: 0 0 0 1px rgba(255,255,255,.7); pointer-events: none; transform-origin: 50% 50%; z-index: 5; }
.qde-sel.is-locked { border-style: dashed; }
.qde-sel.is-locked .qde-h, .qde-sel.is-locked .qde-rot { display: none; }
.qde-h { position: absolute; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; background: #fff; border: 2px solid var(--accent); pointer-events: auto; touch-action: none; box-shadow: 0 1px 4px rgba(0,0,0,.25); }
.qde-h::after { content: ""; position: absolute; inset: -12px; } /* większy cel dotyku */
.qde-h[data-h="nw"] { left: 0; top: 0; cursor: nwse-resize; } .qde-h[data-h="ne"] { left: 100%; top: 0; cursor: nesw-resize; }
.qde-h[data-h="sw"] { left: 0; top: 100%; cursor: nesw-resize; } .qde-h[data-h="se"] { left: 100%; top: 100%; cursor: nwse-resize; }
.qde-h-side { width: 10px; height: 22px; margin: -11px 0 0 -5px; border-radius: 6px; }
.qde-h[data-h="e"] { left: 100%; top: 50%; cursor: ew-resize; } .qde-h[data-h="w"] { left: 0; top: 50%; cursor: ew-resize; }
.qde-h-tb { width: 22px; height: 10px; margin: -5px 0 0 -11px; }
.qde-h[data-h="n"] { left: 50%; top: 0; cursor: ns-resize; } .qde-h[data-h="s"] { left: 50%; top: 100%; cursor: ns-resize; }
.qde-sel.is-text .qde-h-tb { display: none; }
.qde-rot { position: absolute; left: 50%; top: -42px; width: 30px; height: 30px; margin-left: -15px; border-radius: 50%; background: #fff; color: var(--accent); display: grid; place-items: center; border: 1.5px solid var(--accent); pointer-events: auto; cursor: grab; touch-action: none; box-shadow: 0 1px 4px rgba(0,0,0,.25); }
.qde-rot .icon { width: 16px; height: 16px; }
.qde-rot::before { content: ""; position: absolute; left: 50%; top: 100%; height: 12px; border-left: 1.5px solid var(--accent); }
.qde-guide { position: absolute; z-index: 4; pointer-events: none; }
.qde-guide-v { top: 0; bottom: 0; border-left: 1px dashed #ff3db8; }
.qde-guide-h { left: 0; right: 0; border-top: 1px dashed #ff3db8; }
.qde-zoomctl { position: absolute; right: .6rem; bottom: .6rem; display: flex; gap: .3rem; z-index: 6; }
.qde-zoomctl .icon-btn { background: var(--surface); box-shadow: var(--shadow); }
.qde-guest { position: absolute; left: .6rem; bottom: .6rem; z-index: 6; max-width: calc(100% - 150px); }
.qde-guest select { margin: 0; min-height: 38px; font-size: .82rem; box-shadow: var(--shadow); }
.qde-panel { border-left: 1px solid var(--line); background: var(--surface); display: flex; flex-direction: column; min-height: 0; }
.qde-tabs { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--line); }
.qde-tabs button { all: unset; display: flex; flex-direction: column; align-items: center; gap: .15rem; padding: .55rem .2rem; font-size: .72rem; font-weight: 600; color: var(--muted); cursor: pointer; border-bottom: 2px solid transparent; }
.qde-tabs button.active { color: var(--accent-strong); border-bottom-color: var(--accent); }
.qde-tabs .icon { width: 20px; height: 20px; }
.qde-pane { overflow-y: auto; padding: .4rem .9rem 1.2rem; flex: 1; -webkit-overflow-scrolling: touch; }
.qde-pane[hidden], .qde.is-collapsed .qde-pane { display: none; }
.qde-sec { padding: .5rem 0 .8rem; border-bottom: 1px dashed var(--line); }
.qde-sec:last-child { border-bottom: 0; }
.qde-sec h3 { font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); margin: .4rem 0 .5rem; font-family: var(--font-body); font-weight: 600; }
.qde-pane label { display: block; font-size: .82rem; font-weight: 500; margin: .55rem 0 0; }
.qde-pane label output { float: right; color: var(--muted); font-weight: 400; font-variant-numeric: tabular-nums; }
.qde-pane input[type=range] { padding: 0; min-height: 28px; border: 0; background: none; accent-color: var(--accent); }
.qde-pane input[type=color] { height: 40px; padding: 2px; }
.qde-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: .5rem; }
.qde-btns { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
.qde-btns-col { grid-template-columns: 1fr; }
.qde-btns button, .qde-seg button, .qde-tg, .qde-emoji button, .qde-art button, .qde-shapes button {
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem; min-height: 40px; padding: .35rem .6rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--text); font: 500 .8rem var(--font-body); cursor: pointer; transition: border-color .15s, background .15s; }
.qde-btns button:hover, .qde-seg button:hover, .qde-tg:hover, .qde-emoji button:hover, .qde-art button:hover, .qde-shapes button:hover { border-color: var(--accent); }
.qde-btns-col button { justify-content: flex-start; }
.qde-btns button .icon { color: var(--accent); }
.qde-add-text.t-h { font: 600 1.15rem "Playfair Display", serif; }
.qde-add-text.t-s { font: 600 1.3rem "Great Vibes", cursive; }
.qde-add-text.t-p { font: 400 .9rem Inter, sans-serif; }
.qde-add-text.t-l { font: 600 .7rem "Josefin Sans", sans-serif; letter-spacing: .18em; }
.qde-seg { display: flex; flex-wrap: wrap; gap: .3rem; margin: .3rem 0; }
.qde-seg button.on, .qde-tg.on, .qde-art button.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-strong); }
.qde-tgs { display: flex; flex-wrap: wrap; gap: .3rem; margin: .5rem 0; }
.qde-emoji { display: grid; grid-template-columns: repeat(auto-fill, minmax(42px, 1fr)); gap: .3rem; margin-top: .4rem; }
.qde-emoji button { font-size: 1.35rem; padding: 0; }
.qde-art, .qde-shapes { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: .35rem; }
.qde-art button, .qde-shapes button { flex-direction: column; padding: .4rem .2rem; min-height: 72px; }
.qde-art small, .qde-shapes small { font-size: .66rem; color: var(--muted); }
.qde-art-prev { position: relative; overflow: hidden; width: 36px; height: 36px; color: var(--accent); display: block; }
.qde-art-prev > svg, .qde-art-prev > div { width: 100%; height: 100%; }
.qde-shape-prev { width: 32px; height: 26px; background: var(--accent); display: block; }
.sp-circle { border-radius: 50%; width: 28px; height: 28px; } .sp-line { height: 4px; border-radius: 2px; margin: 11px 0; }
.sp-heart { clip-path: path("M16 26C5 19 0 13 0 8 0 3 4 0 9 0c3 0 5 1 7 4 2-3 4-4 7-4 5 0 9 3 9 8 0 5-5 11-16 18z"); }
.sp-star { clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }
.sp-ribbon { clip-path: polygon(0 20%, 100% 20%, 88% 50%, 100% 80%, 0 80%, 12% 50%); }
.sp-badge { clip-path: polygon(50% 0, 62% 12%, 79% 9%, 82% 25%, 98% 33%, 90% 50%, 98% 67%, 82% 75%, 79% 91%, 62% 88%, 50% 100%, 38% 88%, 21% 91%, 18% 75%, 2% 67%, 10% 50%, 2% 33%, 18% 25%, 21% 9%, 38% 12%); width: 30px; height: 30px; }
.qde-pool { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: .35rem; }
.qde-pool-item { position: relative; }
.qde-pool-item > button:first-child { width: 100%; aspect-ratio: 1; padding: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; cursor: pointer; background: var(--surface-2); display: block; }
.qde-pool-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.qde-pool-del { position: absolute; top: -6px; right: -6px; width: 22px; height: 22px; border-radius: 50%; border: 0; background: var(--text); color: var(--surface); display: grid; place-items: center; cursor: pointer; padding: 0; }
.qde-pool-del .icon { width: 12px; height: 12px; }
.qde-pool-up { aspect-ratio: 1; border: 1.5px dashed var(--accent); border-radius: 10px; display: grid !important; place-items: center; color: var(--accent); cursor: pointer; margin: 0 !important; }
.qde-palettes { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .6rem; }
.qde-palettes button { width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line); cursor: pointer; padding: 0; }
.qde-actions { display: flex; flex-wrap: wrap; gap: .35rem; }
.qde-layers { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.qde-layers li { display: flex; align-items: center; gap: .2rem; border: 1px solid var(--line); border-radius: 12px; padding: .2rem; }
.qde-layers li.on { border-color: var(--accent); background: var(--accent-soft); }
.qde-layers li > button:first-child { all: unset; flex: 1; min-width: 0; display: flex; align-items: center; gap: .5rem; padding: .35rem .4rem; cursor: pointer; }
.qde-layers strong { display: block; font-size: .82rem; }
.qde-layers small { display: block; font-size: .72rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qde-layers span { min-width: 0; }
.qde-layers .icon-btn { width: 32px; height: 32px; }
.qde-empty { padding: 1rem 0; }
@media (max-width: 1000px) {
  .qde { height: calc(100dvh - 58px - 62px - env(safe-area-inset-bottom) - .8rem); margin: -1.25rem -1rem 0; min-height: 0; }
  .qde-main { grid-template-columns: 1fr; grid-template-rows: minmax(0, 1fr) auto; }
  .qde-panel { border-left: 0; border-top: 1px solid var(--line); max-height: 44dvh; border-radius: 18px 18px 0 0; box-shadow: 0 -8px 24px -14px rgba(0,0,0,.3); }
  .qde-tabs { order: 2; border-bottom: 0; border-top: 1px solid var(--line); }
  .qde-pane { order: 1; }
  .qde-bar-tools .btn span, .qde-state { display: none; }
  .qde-name { font-size: .9rem; }
}

/* Wydruk */
.pp-body { background: #e9e6e1; }
.pp-bar { position: sticky; top: 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; padding: .6rem 1rem; background: var(--surface); border-bottom: 1px solid var(--line); }
.pp-title { font-family: var(--font-display); font-size: 1.1rem; }
.pp-field { display: flex !important; align-items: center; gap: .35rem; margin: 0 !important; font-size: .82rem; }
.pp-field select, .pp-field input[type=number] { margin: 0; min-height: 36px; width: auto; }
.pp-sheets { display: grid; justify-content: center; gap: 1.2rem; padding: 1.2rem; }
@media screen { .pp-sheets { zoom: var(--pp-zoom, 1); } }
.pp-sheet { position: relative; background: #fff; box-shadow: 0 6px 24px rgba(0,0,0,.18); overflow: hidden; box-sizing: border-box; }
.pp-grid { display: grid; justify-content: center; align-content: start; }
.pp-card { position: relative; overflow: hidden; outline: 1px dashed #bbb; outline-offset: 0; }
.pp-poster .pp-card { outline: 0; }
.pp-no-marks .pp-card { outline: 0; }
@media print {
  .pp-body { background: #fff; }
  .pp-sheets { display: block; padding: 0; }
  .pp-sheet { box-shadow: none; margin: 0; page-break-after: always; break-after: page; }
  .pp-sheet:last-child { page-break-after: auto; break-after: auto; }
  .pp-card { outline-color: #999; }
}

/* ---------- Wybierak ikon (ikony + emoji) ---------- */
.emo-ic { display: inline-block; font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif; font-style: normal; line-height: 1; font-size: 1.15em; vertical-align: -.12em; }
.icon-field { display: block; margin: .35rem 0 1rem; }
.icon-field-btn { display: inline-flex; align-items: center; gap: .6rem; }
.icon-field-prev { width: 32px; height: 32px; border-radius: 10px; display: inline-grid; place-items: center; background: var(--accent-soft); color: var(--accent); }
.icon-field-prev .emo-ic { font-size: 1.25rem; }
.ip-sheet { position: fixed; inset: 0; z-index: 95; background: rgba(20, 16, 12, .45); display: grid; align-items: end; justify-items: center; animation: fade-in .2s ease-out; }
.ip-sheet[hidden] { display: none; }
html.ip-lock, html.ip-lock body { overflow: hidden; }
.ip-card { width: min(640px, 100%); height: min(78dvh, 640px); display: flex; flex-direction: column; background: var(--surface); color: var(--text); border-radius: 24px 24px 0 0; padding: .9rem .9rem calc(.8rem + env(safe-area-inset-bottom)); box-shadow: 0 -10px 40px rgba(0,0,0,.3); animation: sheet-up .3s cubic-bezier(.2,.8,.2,1); }
@media (min-width: 761px) { .ip-sheet { align-items: center; } .ip-card { border-radius: 24px; } }
.ip-head { display: flex; gap: .5rem; align-items: center; }
.ip-head input { margin: 0; }
.ip-tabs { margin: .7rem 0 .4rem; align-self: flex-start; }
.ip-cats { display: flex; gap: .35rem; overflow-x: auto; padding-bottom: .5rem; scrollbar-width: none; flex: none; }
.ip-cats .chip { flex: none; }
.ip-grid { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding-right: .2rem; }
.ip-grid h4 { font: 600 .72rem var(--font-body); text-transform: uppercase; letter-spacing: .12em; color: var(--muted); margin: .7rem 0 .4rem; scroll-margin-top: .3rem; }
.ip-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(70px, 1fr)); gap: .3rem; }
.ip-item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem; min-height: 62px; padding: .35rem .2rem; border: 1px solid transparent; border-radius: 12px; background: var(--surface-2); color: var(--text); cursor: pointer; font: inherit; transition: background .15s, border-color .15s, transform .15s; }
.ip-item:hover, .ip-item:focus-visible { border-color: var(--accent); background: var(--accent-soft); transform: translateY(-1px); }
.ip-item.on { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent); }
.ip-item .icon { width: 24px; height: 24px; color: var(--accent); }
.ip-item small { font-size: .62rem; color: var(--muted); line-height: 1.1; text-align: center; }
.ip-emo { font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif; font-size: 1.7rem; min-height: 52px; }
.ip-grid:has(.ip-emo) .ip-items { grid-template-columns: repeat(auto-fill, minmax(50px, 1fr)); }
.ip-foot { padding-top: .5rem; border-top: 1px solid var(--line); flex: none; }
.tl-dot .emo-ic, .inv-section-icon .emo-ic, .inv-event-icon .emo-ic { font-size: 1.2rem; }
.inv-section-icon .emo-ic { font-size: 1.7rem; }
.seat-el text.seat-emoji { fill: initial; font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif; text-anchor: middle; }
.pick-more { grid-column: span 2; display: inline-flex !important; gap: .3rem; font-size: .8rem !important; }
.s-el-icon.emo-ic { font-size: 1.4em; }

/* Ustawienia wysyłki (administrator) */
.settings-seg { display: flex; flex-wrap: wrap; margin: .35rem 0 1rem; }
.settings-seg label { display: inline-flex !important; gap: .45rem; align-items: center; padding: .45rem .9rem; margin: 0 !important; font-weight: 500; cursor: pointer; border-radius: 999px; font-size: .85rem; }
.settings-seg label:has(:checked) { background: var(--surface); box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 4px 12px -6px rgba(0,0,0,.2); }
.settings-test { margin-top: 1rem; padding-top: 1rem; border-top: 1px dashed var(--line); display: flex; flex-wrap: wrap; gap: .6rem; align-items: flex-end; }
.settings-test label { flex: 1; min-width: 200px; margin: 0 !important; }
.settings-test.row { border-top: 0; padding-top: 0; }

/* Wysyłka zaproszeń: szablony i kanały */
.send-tpl { padding: 0; overflow: hidden; margin-bottom: 1rem; }
.send-tpl > summary { list-style: none; display: flex; gap: .8rem; align-items: center; padding: 1rem 1.1rem; cursor: pointer; }
.send-tpl > summary::-webkit-details-marker { display: none; }
.send-tpl > summary strong { display: block; } .send-tpl > summary small { display: block; color: var(--muted); font-size: .78rem; }
.send-tpl .acc-ic { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); flex: none; }
.send-tpl > form { padding: 0 1.1rem 1.1rem; }
.send-tabs { margin-bottom: .6rem; }
.send-fields .chip { font-family: ui-monospace, monospace; font-size: .72rem; margin: .1rem 0; }
.send-preview { margin: .4rem 0 1rem; }
.mail-preview { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #f4efe8; }
.mp-head { padding: .6rem .9rem; background: var(--surface); border-bottom: 1px solid var(--line); display: grid; gap: .1rem; }
.mp-body { margin: .8rem; padding: 1.2rem 1rem; background: var(--b); color: var(--t); border: 1px solid var(--a); border-radius: 10px; text-align: center; font-family: Georgia, serif; white-space: pre-wrap; }
.mp-kicker { text-transform: uppercase; letter-spacing: .2em; font-size: .7rem; color: var(--a); margin: 0; }
.mp-names { font-size: 1.5rem; margin: .3rem 0 .6rem; }
.mp-sign { font-style: italic; }
.mp-btn { display: inline-block; background: var(--a); color: #fff; padding: .55rem 1.1rem; border-radius: 999px; font: 600 .82rem Arial, sans-serif; }
.sms-preview { display: grid; gap: .4rem; justify-items: start; background: var(--surface-2); padding: 1rem; border-radius: 16px; }
.sms-bubble { max-width: 290px; background: #e9e9eb; color: #111; padding: .6rem .8rem; border-radius: 18px 18px 18px 4px; font: 400 .9rem/1.35 -apple-system, "Segoe UI", sans-serif; white-space: pre-wrap; overflow-wrap: anywhere; }
.sms-count { margin: 0 0 .5rem; }
.send-channels { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .6rem; margin-bottom: 1rem; }
.send-ch { margin: 0 !important; cursor: pointer; }
.send-ch input { position: absolute; opacity: 0; pointer-events: none; }
.send-ch > span { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: .7rem; align-items: center; padding: .8rem 1rem; border: 2px solid var(--line); border-radius: 16px; transition: border-color .15s, background .15s; }
.send-ch > span .icon { grid-row: span 2; width: 26px; height: 26px; color: var(--muted); }
.send-ch small { color: var(--muted); font-weight: 400; }
.send-ch input:checked + span { border-color: var(--accent); background: var(--accent-soft); }
.send-ch input:checked + span .icon { color: var(--accent); }
.send-ch input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.send-ch.is-off { opacity: .55; cursor: not-allowed; }
.leaf-face.hold-full { inset: 0; width: 100%; left: 0; }

/* Stolik gościa: numery krzeseł i lista osób */
.seat-detail .seat-no { font-weight: 700; fill: color-mix(in srgb, var(--sa) 70%, var(--seat-text, var(--text))); font-family: var(--font-body); }
.seat-detail .is-me .seat-no { fill: #fff; }
.seat-detail .seat-label.is-me { font-size: 14px; text-anchor: middle; }
.seat-people { list-style: none; margin: .4rem auto 0; padding: 0; max-width: 420px; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .3rem .6rem; text-align: left; }
.seat-people li { display: flex; align-items: center; gap: .5rem; padding: .3rem .5rem; border-radius: 10px; font-size: .9rem; line-height: 1.25; }
.seat-people-no { flex: none; width: 1.6rem; height: 1.6rem; border-radius: 50%; display: grid; place-items: center; font-size: .72rem; font-weight: 700;
  background: color-mix(in srgb, var(--seat-accent, var(--accent)) 14%, transparent); color: var(--seat-accent, var(--accent)); }
.seat-people li.is-me { background: color-mix(in srgb, var(--seat-accent, var(--accent)) 12%, transparent); font-weight: 600; }
.seat-people li.is-me .seat-people-no { background: var(--seat-accent, var(--accent)); color: #fff; }
/* Księga na telefonie: pasek narzędzi w dwóch rzędach, bez wychodzenia poza ekran */
[data-book-pos] { white-space: nowrap; min-width: 3.2em; text-align: center; }
@media (max-width: 640px) {
  .book-toolbar { flex-wrap: wrap; justify-content: center; }
  .book-toolbar > .row:last-child { width: 100%; justify-content: center; flex-wrap: nowrap; }
  .book-print-mode { font-size: 0; gap: 0; }
  .book-print-mode select { font-size: .85rem; }
  .book-shell { padding: .75rem; }
}


/* --- Szaty panelu – runda 3 --- */
.panel-szampan {
  --bg: #fbf6ea; --surface: #fffdf7; --surface-2: #f6eedb;
  --text: #3a3022; --muted: #7d6f58; --line: #eee2c8; --gold-line: #e0c88f;
  --accent: #b8934a; --accent-strong: #967532; --accent-soft: #f5ead0;
  --orn: #c8a45a; --orn-o: .7; --btn-a: #d9bb73; --btn-b: #b08d48; --btn-edge: #a8843f;
  --hover: #f8efdc; --nav-text: #4a3d2b; --nav-icon: #c4ad80; --input-bg: #fffdf8; --input-line: #e8dabb;
  --font-display: "Cormorant Garamond", Georgia, serif;
  --pattern: radial-gradient(circle, rgba(200, 164, 90, .16) 0 2px, transparent 3px);
}
.panel-szampan .welcome { background: radial-gradient(circle at 15% 80%, rgba(255,255,255,.7) 0 3px, transparent 4px) 0 0 / 40px 40px, linear-gradient(135deg, #f1dfb2, #fbf6ea) !important; }
.panel-marmur {
  --bg: #f7f6f3; --surface: #ffffff; --surface-2: #f1efea;
  --text: #2f2b28; --muted: #7a736b; --line: #e6e2db; --gold-line: #d7c296;
  --accent: #a8863f; --accent-strong: #86672a; --accent-soft: #f3ecdc;
  --orn: #b89650; --orn-o: .55; --btn-a: #3a3531; --btn-b: #2a2522; --btn-edge: #1f1b18; --btn-text: #f0d9a0;
  --hover: #f3f1ec; --nav-text: #3a3531; --nav-icon: #aaa196; --input-bg: #ffffff; --input-line: #ddd7cd;
  --font-display: "Cormorant Garamond", Georgia, serif;
  --pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cg fill='none' stroke='%23a59c91' stroke-opacity='.18'%3E%3Cpath d='M-10 80 C 70 50 120 150 200 120 S 330 40 410 90'/%3E%3Cpath d='M-10 290 C 80 260 140 340 230 300 S 340 250 410 270' stroke-width='.7'/%3E%3C/g%3E%3C/svg%3E");
}
.panel-zorza {
  color-scheme: dark;
  --bg: #0b1426; --surface: #111d36; --surface-2: #172647;
  --text: #e8f2ff; --muted: #9fb2d1; --line: #22345c; --gold-line: #2c5a63;
  --accent: #5ef0c4; --accent-strong: #9af7db; --accent-soft: #143a3e; --on-accent: #062019;
  --orn: #5ef0c4; --orn-o: 0; --btn-a: #6ff3cc; --btn-b: #8f8bff; --btn-edge: #5ef0c4; --btn-text: #062019;
  --side-bg: rgba(11, 20, 38, .94); --bar-bg: rgba(11, 20, 38, .9);
  --hover: rgba(94, 240, 196, .07); --nav-text: #d6e3f7; --nav-icon: #6f84a8; --input-bg: #0a1222; --input-line: #2a3d66;
  --ok: #8ff0c8; --ok-soft: #12332b; --warn: #f0c870; --warn-soft: #3a3320; --danger: #ff9fb0; --danger-soft: #3d1f2a;
  --shadow: none; --font-display: "Montserrat", "Inter", sans-serif;
}
.panel-zorza::before { -webkit-mask: none; mask: none; opacity: .9; background: radial-gradient(60% 40% at 15% 0%, rgba(94,240,196,.18), transparent 70%), radial-gradient(50% 40% at 85% 5%, rgba(180,140,255,.2), transparent 70%); }
.panel-kontrast {
  --bg: #ffffff; --surface: #ffffff; --surface-2: #f2f2f2;
  --text: #000000; --muted: #555555; --line: #000000; --gold-line: #000000;
  --accent: #000000; --accent-strong: #000000; --accent-soft: #ececec; --on-accent: #ffffff;
  --orn: #000; --orn-o: 0; --btn-a: #000; --btn-b: #000; --btn-edge: #000;
  --hover: #f2f2f2; --nav-text: #000; --nav-icon: #666; --input-bg: #ffffff; --input-line: #000;
  --font-display: "Montserrat", "Inter", sans-serif; --shadow: none;
}
.panel-kontrast .card, .panel-kontrast .stat, .panel-kontrast .kpi { border: 2px solid #000 !important; border-radius: 0 !important; box-shadow: none !important; }
.panel-kontrast .btn { border-radius: 0; text-transform: uppercase; letter-spacing: .05em; }
.panel-kontrast h1 { text-transform: uppercase; letter-spacing: -.01em; font-weight: 800; }
.panel-kontrast .sidenav-nav a.active { background: #000; color: #fff; border-radius: 0; }
.panel-kontrast .sidenav-nav a.active .icon { color: #fff; }
.panel-folk {
  --bg: #fffaf0; --surface: #ffffff; --surface-2: #fff1dd;
  --text: #1f2a44; --muted: #5a6380; --line: #f1dfc4; --gold-line: #f2a900;
  --accent: #d62839; --accent-strong: #ad1a2a; --accent-soft: #fde2e2;
  --orn: #1f6f4a; --orn-o: 0; --btn-a: #e5404f; --btn-b: #c81f30; --btn-edge: #b51d2d;
  --hover: #fff3e3; --nav-text: #1f2a44; --nav-icon: #b4a07f; --input-bg: #ffffff; --input-line: #ecd8b8;
  --font-display: "Josefin Sans", "Inter", sans-serif;
  --pattern: radial-gradient(circle, rgba(214, 40, 57, .08) 0 3px, transparent 4px);
}
.panel-folk .card { border-top: 4px solid var(--accent); }
.panel-folk .stat:nth-child(4n+2) { border-top: 4px solid #1f6f4a; } .panel-folk .stat:nth-child(4n+3) { border-top: 4px solid #f2a900; } .panel-folk .stat:nth-child(4n+4) { border-top: 4px solid #2b4fa8; }
.panel-folk .welcome { border-bottom: 6px solid; border-image: repeating-linear-gradient(90deg, #d62839 0 14px, #1f6f4a 14px 28px, #f2a900 28px 42px, #2b4fa8 42px 56px) 6; }
.panel-piwonia {
  --bg: #fff6f8; --surface: #ffffff; --surface-2: #fdeaf0;
  --text: #4a2a35; --muted: #8f6a77; --line: #f6d8e2; --gold-line: #efbccd;
  --accent: #c9567c; --accent-strong: #a83c61; --accent-soft: #fde1ea;
  --orn: #e48fab; --orn-o: .6; --btn-a: #e07c9e; --btn-b: #c9567c; --btn-edge: #bc4c71;
  --hover: #fdf0f4; --nav-text: #5a3341; --nav-icon: #d3a2b3; --input-bg: #fffbfc; --input-line: #f1d3dd;
  --font-display: "Cormorant Garamond", Georgia, serif;
}
.panel-piwonia .welcome { background: radial-gradient(50% 80% at 0% 0%, #f6b8cb, transparent 70%), radial-gradient(45% 70% at 100% 100%, #f9cbd8, transparent 70%), #fff7f9 !important; }
.panel-las {
  color-scheme: dark;
  --bg: #121d17; --surface: #19271f; --surface-2: #203127;
  --text: #e9efe6; --muted: #a3b4a5; --line: #2a3f31; --gold-line: #5a5332;
  --accent: #d2b46a; --accent-strong: #e8cf8c; --accent-soft: #2c3524; --on-accent: #121d17;
  --orn: #d2b46a; --orn-o: .55; --btn-a: #dcc07a; --btn-b: #b8984f; --btn-edge: #b8984f; --btn-text: #121d17;
  --side-bg: rgba(18, 29, 23, .96); --bar-bg: rgba(18, 29, 23, .92);
  --hover: rgba(210, 180, 106, .07); --nav-text: #dbe5d8; --nav-icon: #7f947f; --input-bg: #0f1914; --input-line: #33493a;
  --ok: #a8dca0; --ok-soft: #22392a; --warn: #f0c870; --warn-soft: #3a3320; --danger: #f2a39a; --danger-soft: #3d2222;
  --shadow: none; --font-display: "Playfair Display", Georgia, serif;
}
.panel-piasek {
  --bg: #f8efe4; --surface: #fffaf4; --surface-2: #f2e3d1;
  --text: #4a3324; --muted: #8a6f5b; --line: #ecdac4; --gold-line: #e2b58f;
  --accent: #c9714a; --accent-strong: #a6532f; --accent-soft: #f6dccd;
  --orn: #6f8a5a; --orn-o: 0; --btn-a: #dc875c; --btn-b: #c4663e; --btn-edge: #b65d37;
  --hover: #f5e8d8; --nav-text: #4a3324; --nav-icon: #bf9f84; --input-bg: #fffaf4; --input-line: #e5cfb6;
  --font-display: "Josefin Sans", "Inter", sans-serif; --radius: 22px;
}
.panel-piasek .welcome { background: radial-gradient(circle at 85% 120%, #f6c27a 0 26%, transparent 27%), linear-gradient(160deg, #f4cfa8, #f8efe4) !important; }
/* Pulpit na telefonie: nieparzysty ostatni kafelek nie zostaje sam w połowie rzędu */
@media (max-width: 640px) {
  .stats > .stat:last-child:nth-child(odd), .kpis > .kpi:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
/* Zwinięty formularz (app.js → data-fold-mobile) */
.fold-chev { display: none; }
@media (max-width: 700px) {
  [data-fold-mobile] > h2 { cursor: pointer; display: flex; align-items: center; gap: .5rem; }
  [data-fold-mobile].is-folded > h2 { margin: 0 !important; }
  .fold-chev { display: block; margin-left: auto; flex: none; width: .6rem; height: .6rem; border-right: 2px solid var(--accent); border-bottom: 2px solid var(--accent); transform: rotate(-135deg); transition: transform .25s ease; }
  [data-fold-mobile].is-folded .fold-chev { transform: rotate(45deg) translate(-2px, -2px); }
  [data-fold-mobile].is-folded > :not(h2) { display: none !important; }
}

/* Tabela jako karty na telefonie (lista ślubów w panelu admina) */
@media (max-width: 700px) {
  .table-cards-wrap { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; overflow: visible !important; }
  .table-cards-wrap::before, .table-cards-wrap::after { display: none !important; }
  .table-cards, .table-cards tbody { display: block; }
  .table-cards thead { display: none; }
  .table-cards tr { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem 1rem; padding: 1rem 1.1rem; margin-bottom: .8rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg, 18px); box-shadow: var(--shadow, none); }
  .table-cards td { display: block; padding: 0 !important; border: 0 !important; font-size: .9rem; min-width: 0; }
  .table-cards td[data-label]::before { content: attr(data-label); display: block; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-bottom: .1rem; }
  .table-cards .tc-head { grid-column: 1 / -1; padding-bottom: .5rem !important; border-bottom: 1px solid var(--line) !important; }
  .table-cards .tc-head strong { font-size: 1.05rem; }
  .table-cards .tc-act { grid-column: 1 / -1; }
  .table-cards .tc-act .btn { width: 100%; justify-content: center; }
  .table-cards .badge { margin-top: .2rem; }
}

/* ===== Menu panelu na telefonie (2026-10-03): szuflada z kafelkami w dwóch kolumnach ===== */
@media (max-width: 900px) {
  .ui-glamour .sidenav, .sidenav {
    width: min(340px, 90vw); z-index: 60; border-right: 0; border-radius: 0 26px 26px 0;
    box-shadow: 18px 0 50px -10px rgba(0, 0, 0, .45); overflow-y: auto; overscroll-behavior: contain;
    padding-bottom: env(safe-area-inset-bottom);
  }
  .nav-backdrop { z-index: 55; background: rgba(12, 10, 8, .55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); animation: nav-fade .25s ease both; }
  @keyframes nav-fade { from { opacity: 0; } to { opacity: 1; } }
  .nav-open .panel-tabbar { visibility: hidden; }
  .ui-glamour .sidenav-head, .sidenav-head { padding: 1rem 1rem .9rem; }
  .sidenav-names { font-size: 1.2rem !important; }
  .sidenav .sidenav-close { top: .8rem; right: .8rem; width: 40px; height: 40px; border-radius: 50%; }
  .sidenav-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem; padding: .4rem .75rem .7rem; align-content: start; }
  .sidenav-label { grid-column: 1 / -1; margin: .55rem .2rem .05rem !important; }
  .sidenav-nav a {
    flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: .35rem; min-height: 70px;
    padding: .55rem .3rem !important; border-radius: 16px !important; font-size: .76rem; line-height: 1.12; hyphens: auto;
    background: color-mix(in srgb, var(--surface-2) 70%, transparent); border: 1px solid var(--line);
  }
  .sidenav-nav a .nav-icon { width: 22px; height: 22px; color: var(--accent); margin: 0 !important; }
  .sidenav-nav a.active { border-color: var(--accent); box-shadow: 0 6px 16px -10px var(--accent); }
  .sidenav-nav a.active::before { display: none; }
  .sidenav-nav a:active { transform: scale(.97); }
  .sidenav-foot { display: flex; gap: .5rem; padding: .6rem .8rem 1rem; }
  .sidenav-foot form { flex: 1; }
  .sidenav-foot .sidenav-install:not([hidden]) { flex: 1; }
  .sidenav-logout, .sidenav-install { justify-content: center; border: 1px solid var(--line) !important; border-radius: 14px !important; min-height: 46px; }
}
@media (max-width: 900px) and (max-height: 700px) {
  .sidenav-nav a { min-height: 58px; }
  .sidenav-date { display: none !important; }
}

/* Plan sali: zwijany panel i pełny ekran (2026-10-03) */
.seat-full-save, .sheet-min-btn { display: none; }
@media (max-width: 860px) {
  .sheet-tabs { display: flex; align-items: stretch; }
  .sheet-min-btn { display: grid; place-items: center; flex: 0 0 38px; background: none; border: 0; color: var(--muted); border-radius: 10px; cursor: pointer; }
  .seating-editor.sheet-min .sheet-min-btn { transform: rotate(180deg); }
  .seating-editor .seat-stage { flex: 1 1 62%; }
  .seating-editor.sheet-min .seating-side { flex: 0 0 auto; overflow: hidden; padding-bottom: 0; }
  .seating-editor.sheet-min .sheet-pane { display: none !important; }
  .seating-editor.sheet-min .sheet-tabs { margin-bottom: 0; }
  .seating-editor.sheet-min .sheet-tab.active { background: none; color: inherit; box-shadow: none; }
  .seating-editor { height: calc(100dvh - 200px - env(safe-area-inset-bottom)); }
}
.seating-editor.is-full { position: fixed; inset: 0; z-index: 80; height: 100dvh !important; margin: 0; padding: .5rem .5rem calc(.5rem + env(safe-area-inset-bottom)); background: var(--bg); display: flex; flex-direction: column; gap: .5rem; }
.seating-editor.is-full .seat-stage { flex: 1 1 auto; min-height: 0; }
.seating-editor.is-full .seat-view { height: 100%; }
.seating-editor.is-full .seating-side { flex: 0 1 auto; max-height: 42dvh; }
.seating-editor.is-full.sheet-min .seating-side { max-height: none; }
.seating-editor.is-full .seat-full-save { display: inline-flex; position: absolute; top: .6rem; left: .6rem; z-index: 5; box-shadow: 0 8px 20px -8px rgba(0,0,0,.4); }
.seating-editor.is-full .seat-full-btn { background: var(--accent); color: var(--on-accent); }
html.seat-full-open, html.seat-full-open body { overflow: hidden; }
html.seat-full-open .panel-tabbar, html.seat-full-open .mobilebar { visibility: hidden; }
@media (min-width: 861px) {
  .seating-editor.is-full { display: grid; grid-template-columns: 330px minmax(0, 1fr); grid-template-areas: "side stage"; }
  .seating-editor.is-full .seating-side { max-height: none; height: 100%; }
}
/* ===== Budżet na telefonie (2026-10-03): zwarte kafle, mniejszy wykres obok legendy, karty wydatków w jednym wierszu ===== */
@media (max-width: 640px) {
  .kpis { grid-template-columns: 1fr 1fr; gap: .5rem; margin-bottom: .8rem; }
  .kpi { padding: .65rem .75rem .75rem; gap: .1rem; display: grid; grid-template-columns: auto 1fr; grid-template-areas: "ic lab" "val val"; align-items: center; column-gap: .45rem; border-radius: 16px; }
  .kpi > .kpi-icon { grid-area: ic; width: 26px; height: 26px; border-radius: 8px; margin: 0; }
  .kpi > .kpi-icon .icon { width: 15px; height: 15px; }
  .kpi > .kpi-label { grid-area: lab; font-size: .74rem; line-height: 1.15; }
  .kpi > .kpi-value, .kpi > .kpi-form { grid-area: val; margin-top: .25rem; }
  .kpi > .bar { grid-column: 1 / -1; }
  .kpi-value { font-size: 1.12rem; }
  .kpi-budget { grid-column: 1 / -1; grid-template-columns: auto auto 1fr; grid-template-areas: "ic lab val"; }
  .kpi-budget .kpi-form { margin: 0; justify-self: end; }
  .kpi-budget .kpi-form input { width: 7.5rem; font-size: 1rem; padding: .3rem .5rem; text-align: right; }
  .budget-progress { padding: .8rem .9rem; }
  .budget-grid { gap: .8rem; }
  .budget-grid .card { padding: .9rem; }
  .budget-grid .card h2 { font-size: 1.05rem; margin-bottom: .5rem; }
  .budget-grid .card:has(.donut-wrap) { display: grid; grid-template-columns: 128px 1fr; grid-template-areas: "h h" "d l"; gap: .4rem .9rem; align-items: center; }
  .budget-grid .card:has(.donut-wrap) > h2 { grid-area: h; }
  .budget-grid .donut-wrap { grid-area: d; width: 128px; margin: 0; }
  .budget-grid .donut-center strong { font-size: .9rem; }
  .budget-grid .donut-center .small { font-size: .65rem; }
  .budget-grid .legend { grid-area: l; font-size: .78rem; gap: .3rem; }
  .budget-grid .legend li { flex-wrap: wrap; column-gap: .4rem; }
  .budget-grid .legend li .muted { margin-left: 1.05rem; width: 100%; font-size: .72rem; }
  .pay { padding: .55rem .2rem; gap: .55rem; flex-wrap: wrap; }
  .pay-icon { width: 30px; height: 30px; }
  .pay form { margin-left: auto; }
  .budget-cat { padding: .8rem .9rem .4rem; border-top-width: 3px; }
  .cat-head { gap: .55rem; }
  .cat-head .cat-icon { width: 32px; height: 32px; }
  .cat-head h2, .ui-glamour .cat-head h2 { font-size: 1rem !important; font-variant: normal !important; text-transform: none !important; letter-spacing: 0 !important; line-height: 1.2; }
  .cat-head h2::after { display: none !important; }
  .cat-sum { font-size: .82rem; white-space: nowrap; }
  .budget-cat .bar.thin { margin: .55rem 0 .2rem; }
  .expense > summary { gap: .3rem; padding: .55rem .1rem; }
  .exp-name { width: 100%; flex-direction: row; align-items: baseline; gap: .4rem; flex-wrap: wrap; }
  .exp-nums { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: .3rem; font-size: .86rem; }
  .exp-nums > span { min-width: 0; text-align: left; }
  .exp-nums .small { font-size: .68rem; }
  .add-payment { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
  .add-payment input[name="note"], .add-payment button { grid-column: 1 / -1; }
  .cat-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem; }
}
@media (max-width: 640px) { .kpis:has(.kpi-budget) > .kpi:last-child { grid-column: auto; } }

/* ===== Dokumenty prawne i informacja o cookies ===== */
.legal-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .3rem 1rem; font-size: .78rem; padding: .6rem 0; }
.legal-links a { color: var(--muted); text-decoration: none; }
.legal-links a:hover { color: var(--accent-strong); text-decoration: underline; }
.footer .legal-links { width: 100%; }
.sidenav-foot .legal-links { justify-content: flex-start; padding: .5rem .4rem 0; gap: .2rem .8rem; font-size: .72rem; }
.panel-legal { margin-top: 2rem; border-top: 1px solid var(--line); }
@media (min-width: 901px) { .panel-legal { display: none; } }
@media (max-width: 900px) { .sidenav-foot { flex-wrap: wrap; } .sidenav-foot .legal-links { width: 100%; justify-content: center; } }
.guest-main > .legal-links { margin-top: 1.5rem; }
.legal-wrap { max-width: 820px; margin: 0 auto; }
.legal-tabs { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: 1rem; }
.legal-tabs a { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem .9rem; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--text); text-decoration: none; font-size: .88rem; }
.legal-tabs a.active { background: var(--accent); color: var(--on-accent, #fff); border-color: var(--accent); }
.legal-doc { padding: clamp(1.2rem, 4vw, 2.4rem); line-height: 1.65; }
.legal-doc h1 { margin-bottom: .2rem; }
.legal-doc h2 { font-size: 1.15rem; margin: 1.6rem 0 .5rem; }
.legal-doc ul { padding-left: 1.2rem; display: grid; gap: .35rem; }
.legal-back { margin-top: 1rem; }
.legal-edit { border: 1px solid var(--line); border-radius: 12px; padding: .6rem .8rem; margin: .6rem 0; }
.legal-edit summary { cursor: pointer; font-weight: 600; }
.legal-edit textarea { font: .85rem/1.5 ui-monospace, Consolas, monospace; }
.cookie-notice { position: fixed; left: 50%; bottom: calc(1rem + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 90; width: min(560px, calc(100% - 1.5rem));
  display: flex; align-items: center; gap: .8rem; padding: .8rem .9rem; border-radius: 18px; background: var(--surface, #fff); color: var(--text, #222); border: 1px solid var(--line, #ddd);
  box-shadow: 0 18px 40px -12px rgba(0,0,0,.35); font-size: .85rem; animation: cookie-in .35s cubic-bezier(.2,.7,.2,1) both; }
.cookie-notice[hidden] { display: none; }
.cookie-notice p { margin: 0; flex: 1; line-height: 1.4; }
.cookie-notice .cookie-ic { flex: none; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: var(--accent-soft, #f3e9d6); color: var(--accent, #b08d57); }
.cookie-notice.is-leaving { opacity: 0; transform: translate(-50%, 12px); transition: opacity .25s, transform .25s; }
@keyframes cookie-in { from { opacity: 0; transform: translate(-50%, 16px); } to { opacity: 1; transform: translate(-50%, 0); } }
@media (max-width: 900px) { .layout-panel .cookie-notice, body:has(.panel-tabbar) .cookie-notice, .layout-guest .cookie-notice { bottom: calc(5rem + env(safe-area-inset-bottom)); } }
@media print { .cookie-notice, .legal-links, .panel-legal { display: none !important; } }
.qde-lbl { display: block; font-size: .72rem; color: var(--muted); margin: .5rem 0 .25rem; text-transform: uppercase; letter-spacing: .08em; }
.qde-hint { font-size: .74rem; color: var(--muted); margin: .4rem 0 0; }

/* --- Szaty panelu – runda 4 --- */
.panel-porcelana {
  --bg: #f7f9fd; --surface: #ffffff; --surface-2: #eef2fb;
  --text: #16264d; --muted: #56648a; --line: #dbe3f3; --gold-line: #b8c8ea;
  --accent: #24489c; --accent-strong: #19357a; --accent-soft: #e2e9f8;
  --orn: #24489c; --orn-o: .35; --btn-a: #3a5fb6; --btn-b: #24489c; --btn-edge: #1f3f8a;
  --hover: #eef2fb; --nav-text: #1d2e5a; --nav-icon: #8fa1cc; --input-bg: #ffffff; --input-line: #d3ddf1;
  --font-display: "Playfair Display", Georgia, serif;
}
.panel-rozowezloto {
  --bg: #fdf4f2; --surface: #fffaf9; --surface-2: #fae8e4;
  --text: #4a2c30; --muted: #8e6a6e; --line: #f2d9d3; --gold-line: #e7b9ae;
  --accent: #b76e79; --accent-strong: #965360; --accent-soft: #f8e0e0;
  --orn: #d4949a; --orn-o: .6; --btn-a: #d6949a; --btn-b: #b76e79; --btn-edge: #a9616c;
  --hover: #fbeeeb; --nav-text: #5a3a3f; --nav-icon: #d3a6aa; --input-bg: #fffbfa; --input-line: #efd3cd;
  --font-display: "Cormorant Garamond", Georgia, serif;
}
.panel-terrazzo {
  --bg: #f6f2ec; --surface: #ffffff; --surface-2: #efe9e0;
  --text: #2a2622; --muted: #6d655c; --line: #e5ddd1; --gold-line: #e9b6a3;
  --accent: #2f6f73; --accent-strong: #1f5357; --accent-soft: #dcebeb;
  --orn: #e06c4f; --orn-o: 0; --btn-a: #3c8589; --btn-b: #2f6f73; --btn-edge: #285f63;
  --hover: #f1ebe2; --nav-text: #2a2622; --nav-icon: #b3a99b; --input-bg: #ffffff; --input-line: #ddd4c6;
  --font-display: "Montserrat", "Inter", sans-serif; --radius: 20px;
  background-image: radial-gradient(circle at 12% 18%, #e06c4f30 0 5px, transparent 6px), radial-gradient(circle at 70% 30%, #2f6f7330 0 4px, transparent 5px), radial-gradient(circle at 40% 75%, #f2b84b40 0 6px, transparent 7px); background-size: 160px 160px;
}
.panel-onyks {
  color-scheme: dark;
  --bg: #101010; --surface: #181818; --surface-2: #202020;
  --text: #f2ede4; --muted: #a8a196; --line: #2a2a2a; --gold-line: #5a4a2a;
  --accent: #c9a45c; --accent-strong: #e2c27f; --accent-soft: #2a251b; --on-accent: #101010;
  --orn: #c9a45c; --orn-o: .5; --btn-a: #d8b673; --btn-b: #b8924a; --btn-edge: #b8924a; --btn-text: #101010;
  --side-bg: rgba(16, 16, 16, .96); --bar-bg: rgba(16, 16, 16, .92);
  --hover: rgba(201, 164, 92, .07); --nav-text: #e2ddd3; --nav-icon: #7d766b; --input-bg: #0c0c0c; --input-line: #333;
  --ok: #a8d49a; --ok-soft: #1f2b1f; --warn: #f0c870; --warn-soft: #2e2716; --danger: #f29a9a; --danger-soft: #331b1b;
  --shadow: none; --font-display: "Poiret One", "Josefin Sans", sans-serif;
}
.panel-disco {
  color-scheme: dark;
  --bg: #160d2c; --surface: #20143f; --surface-2: #2a1b52;
  --text: #f6eaff; --muted: #bba9e0; --line: #33245f; --gold-line: #5a3a8a;
  --accent: #ff4fd8; --accent-strong: #ff86e6; --accent-soft: #3a1d55; --on-accent: #160d2c;
  --orn: #ff4fd8; --orn-o: 0; --btn-a: #ff4fd8; --btn-b: #7c5cff; --btn-edge: #ff4fd8; --btn-text: #ffffff;
  --side-bg: rgba(22, 13, 44, .95); --bar-bg: rgba(22, 13, 44, .92);
  --hover: rgba(255, 79, 216, .08); --nav-text: #eadcff; --nav-icon: #8f7cc4; --input-bg: #120a24; --input-line: #3d2b70;
  --ok: #8ff0c8; --ok-soft: #12332b; --warn: #ffd36e; --warn-soft: #3a3320; --danger: #ff9fb0; --danger-soft: #3d1f2a;
  --shadow: none; --font-display: "Montserrat", "Inter", sans-serif;
  background-image: radial-gradient(circle, rgba(255,255,255,.12) 0 1px, transparent 1.5px); background-size: 20px 20px;
}
.panel-disco .welcome { background: conic-gradient(from 200deg at 80% 0%, #ff4fd855, #7c5cff55, #38e1ff44, #ffd36e44, #ff4fd855), var(--surface) !important; }
.panel-riwiera {
  --bg: #f3fbfb; --surface: #ffffff; --surface-2: #e4f5f5;
  --text: #173236; --muted: #577477; --line: #d3ecec; --gold-line: #f6c445;
  --accent: #0aa5a8; --accent-strong: #077f82; --accent-soft: #d8f2f2;
  --orn: #f6c445; --orn-o: 0; --btn-a: #19b7ba; --btn-b: #0a9497; --btn-edge: #08888b;
  --hover: #eaf8f8; --nav-text: #173236; --nav-icon: #86b9bb; --input-bg: #ffffff; --input-line: #cbe7e7;
  --font-display: "Josefin Sans", "Inter", sans-serif;
}
.panel-riwiera .welcome { background: repeating-linear-gradient(90deg, #d8f2f2 0 24px, #ffffff 24px 48px) !important; }
.panel-toskania {
  --bg: #f8f0e3; --surface: #fffaf2; --surface-2: #f1e4cf;
  --text: #3f2e1c; --muted: #7f6a52; --line: #ebdbc0; --gold-line: #e2b980;
  --accent: #b5762f; --accent-strong: #8f5a1f; --accent-soft: #f4e2c7;
  --orn: #6f7a3a; --orn-o: .45; --btn-a: #c98a42; --btn-b: #a3672a; --btn-edge: #955e25;
  --hover: #f5e9d6; --nav-text: #3f2e1c; --nav-icon: #bfa37e; --input-bg: #fffaf2; --input-line: #e6d2b2;
  --font-display: "Playfair Display", Georgia, serif;
}
.panel-dzungla {
  color-scheme: dark;
  --bg: #0d241d; --surface: #133128; --surface-2: #193b31;
  --text: #eaf3ee; --muted: #a1bcb0; --line: #214a3b; --gold-line: #5a5a32;
  --accent: #e3b85b; --accent-strong: #f2d184; --accent-soft: #283a24; --on-accent: #0d241d;
  --orn: #e3b85b; --orn-o: .5; --btn-a: #ecc56f; --btn-b: #c79a3f; --btn-edge: #c79a3f; --btn-text: #0d241d;
  --side-bg: rgba(13, 36, 29, .96); --bar-bg: rgba(13, 36, 29, .92);
  --hover: rgba(227, 184, 91, .07); --nav-text: #dbe9e1; --nav-icon: #79998b; --input-bg: #0a1d17; --input-line: #2b5444;
  --ok: #a8dca0; --ok-soft: #1d3a2c; --warn: #f0c870; --warn-soft: #3a3320; --danger: #f2a39a; --danger-soft: #3d2222;
  --shadow: none; --font-display: "Playfair Display", Georgia, serif;
}@media (max-width: 900px) {
  .ui-glamour .sidenav, .sidenav { top: 0; bottom: auto; height: 100vh; height: 100dvh; padding-top: env(safe-area-inset-top); }
  .mobilebar { padding-top: calc(.6rem + env(safe-area-inset-top)); }
}
.seating-editor.is-full { padding-top: calc(.5rem + env(safe-area-inset-top)); }
html.ip-open .cookie-notice, html.seat-full-open .cookie-notice, html.nav-open .cookie-notice, body.nav-open .cookie-notice { display: none !important; }

/* ---------- Sklep: oferta, zakup, wersja testowa, płatności ---------- */
.shop-wrap { max-width: 980px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
.shop-wrap.shop-narrow { max-width: 620px; }
.shop-product { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 1.5rem; align-items: center; }
.shop-photo { margin: 0; border-radius: 16px; overflow: hidden; background: var(--surface-2); }
.shop-photo img { display: block; width: 100%; height: auto; }
.shop-info h1 { margin: .2rem 0 .6rem; font-size: clamp(1.4rem, 3.4vw, 2rem); line-height: 1.2; }
.shop-kicker { margin: 0; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); font-weight: 600; }
.shop-price { margin: .2rem 0 .4rem; display: flex; align-items: baseline; gap: .45rem; flex-wrap: wrap; }
.shop-price strong { font-size: 2rem; line-height: 1; }
.shop-price span { color: var(--muted); font-size: .9rem; }
.shop-cta { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0 .6rem; }
.shop-features { list-style: none; padding: 0; margin: .6rem 0 1rem; display: grid; gap: .55rem; }
.shop-features li { display: flex; gap: .6rem; align-items: flex-start; }
.shop-features .icon { flex: none; margin-top: .15rem; color: var(--accent); }
.shop-summary { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem; align-items: center; }
.shop-summary img { border-radius: 10px; background: var(--surface-2); }
.shop-summary .shop-price { flex-direction: column; align-items: flex-end; gap: 0; margin: 0; }
.shop-summary .shop-price strong { font-size: 1.4rem; }
.shop-status, .shop-trial { text-align: center; }
.shop-trial .form { text-align: left; }
.shop-status h1, .shop-trial h1 { font-size: 1.5rem; margin: .6rem 0; }
.shop-status-ic { width: 64px; height: 64px; margin: .4rem auto 0; border-radius: 50%; display: grid; place-items: center; }
.shop-status-ic .icon { width: 30px; height: 30px; }
.shop-status-ic.ok { background: var(--ok-soft); color: var(--ok); }
.shop-status-ic.wait { background: var(--warn-soft); color: var(--warn); }
.shop-status-ic.wait .icon { animation: shop-spin 1.2s linear infinite; }
.shop-status-ic.bad { background: var(--danger-soft); color: var(--danger); }
@keyframes shop-spin { to { transform: rotate(360deg); } }
.pay-logos { display: flex; gap: 1rem; align-items: center; }
.pay-logos img { flex: none; width: 92px; height: 92px; border-radius: 10px; background: #fff; }
.pay-logos p { margin: 0; }
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.shop-wrap label.check { align-items: flex-start; line-height: 1.45; }
.shop-wrap label.check > input { flex: none; }
.shop-wrap > * { min-width: 0; }
.trial-banner { display: flex; align-items: center; gap: .75rem; padding: .7rem .9rem; margin-bottom: 1rem; border-radius: 14px; background: color-mix(in srgb, var(--accent) 12%, var(--surface)); border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); }
.trial-banner > .icon { flex: none; color: var(--accent); }
.trial-banner span { flex: 1; min-width: 0; font-size: .92rem; }
.trial-banner .btn { flex: none; }
.billing-plan { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 1.5rem; align-items: center; }
.billing-plan h2 { margin: .2rem 0 .6rem; }
.billing-plan ul { padding-left: 1.1rem; margin: 0; display: grid; gap: .3rem; }
.billing-buy { padding: 1rem; border-radius: 14px; background: var(--surface-2); text-align: center; }
.billing-buy .shop-price { justify-content: center; }
.billing-plan.is-full .shop-kicker { color: var(--ok); }
.payments-filter { flex-wrap: wrap; border-radius: 18px; margin-bottom: 1rem; }
.payments-filter > a { padding: .45rem .9rem; border-radius: 999px; font-size: .88rem; color: var(--muted); text-decoration: none; }
.payments-filter > a.on { background: var(--surface); color: var(--text); box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.kv { display: grid; grid-template-columns: minmax(130px, 40%) minmax(0, 1fr); gap: .4rem .9rem; margin: 0; font-size: .92rem; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; overflow-wrap: anywhere; }
.pay-events { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.pay-events > li { padding: .6rem .8rem; border: 1px solid var(--line); border-radius: 12px; border-left: 4px solid var(--accent); }
.pay-events > li.is-bad { border-left-color: var(--danger); }
.pev-head { display: flex; flex-wrap: wrap; gap: .3rem .8rem; align-items: baseline; }
.pay-events p { margin: .3rem 0 0; }
.pay-events pre { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 260px; overflow: auto; background: var(--surface-2); padding: .6rem; border-radius: 8px; font-size: .78rem; }
.pay-keys { border: 1px solid var(--line); border-radius: 12px; padding: .5rem .9rem .3rem; margin: .8rem 0; }
.pay-keys legend { padding: 0 .4rem; font-weight: 600; }
.legal-cards { margin: 1rem 0; }
@media (max-width: 720px) {
  .shop-product, .billing-plan { grid-template-columns: 1fr; }
  .shop-summary { grid-template-columns: auto minmax(0, 1fr); }
  .shop-summary .shop-price { grid-column: 1 / -1; flex-direction: row; justify-content: flex-end; align-items: baseline; gap: .4rem; }
  .shop-summary img { width: 84px; height: auto; }
  .shop-cta .btn { flex: 1 1 100%; justify-content: center; }
  .trial-banner { flex-wrap: wrap; }
  .trial-banner .btn { flex: 1 1 100%; justify-content: center; }
  .payments-filter { display: flex; flex-wrap: nowrap; overflow-x: auto; border-radius: 999px; scrollbar-width: none; }
  .payments-filter > a { flex: none; }
  .kv { grid-template-columns: 1fr; gap: 0; }
  .kv dd { margin-bottom: .45rem; }
  .pay-logos img { width: 72px; height: 72px; }
}

/* ---------- Organizacja ślubu (runda 11) ---------- */
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* Kolory „miękkie” liczone z motywu (motywy jasne nie dziedziczą ciemnych wartości trybu systemowego); :where = motyw z własną wartością wygrywa */
:where(.layout-panel, .layout-main, .layout-guest) {
  --ok-soft: color-mix(in srgb, var(--ok) 14%, var(--surface));
  --warn-soft: color-mix(in srgb, var(--warn) 16%, var(--surface));
  --danger-soft: color-mix(in srgb, var(--danger) 13%, var(--surface));
}
.guest-emo { font-size: .95rem; cursor: help; }

/* Statystyki */
.st-hero { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 14%, var(--surface)), var(--surface)); }
.st-hero-num { display: flex; flex-direction: column; align-items: center; min-width: 140px; }
.st-hero-num strong { font: 600 3.4rem/1 var(--font-display); color: var(--accent-strong); }
.st-hero-num span { color: var(--muted); font-size: .9rem; }
.st-hero-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; flex: 1; min-width: 220px; }
.st-hero-facts li { display: flex; gap: .5rem; align-items: center; }
.st-hero-facts .icon { color: var(--accent); flex: none; }
.st-h { display: flex; align-items: center; gap: .5rem; margin: 1.6rem 0 .8rem; font-size: 1.25rem; }
.st-h .icon { color: var(--accent); }
.st-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.st-card { position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.05rem 1.1rem; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: .15rem; min-width: 0; overflow: hidden; }
.st-card::after { content: ""; position: absolute; inset: auto -30px -30px auto; width: 90px; height: 90px; border-radius: 50%; background: color-mix(in srgb, var(--accent) 9%, transparent); pointer-events: none; }
.st-card.is-ok::after { background: color-mix(in srgb, var(--ok) 12%, transparent); }
.st-emo { font-size: 1.7rem; line-height: 1; margin-bottom: .35rem; }
.st-card strong { font: 600 1.9rem/1.1 var(--font-display); color: var(--text); overflow-wrap: anywhere; }
.st-card strong.st-name { font-size: 1.25rem; }
.st-card > span:not(.st-emo) { font-weight: 500; }
.st-card small { color: var(--muted); font-size: .8rem; line-height: 1.35; }
.st-bars { list-style: none; padding: 0; margin: .4rem 0 1rem; display: grid; gap: .45rem; }
.st-bars li { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) 2.2rem; gap: .6rem; align-items: center; font-size: .88rem; }
.st-bl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-bt { height: 10px; border-radius: 99px; background: var(--surface-2); overflow: hidden; }
.st-bt i { display: block; height: 100%; width: var(--w); border-radius: inherit; background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #fff)); animation: st-grow .9s cubic-bezier(.2,.8,.2,1) both; transform-origin: left; }
@keyframes st-grow { from { transform: scaleX(0); } }
.st-bars b { text-align: right; }
.st-split { display: flex; height: 22px; border-radius: 99px; overflow: hidden; background: var(--surface-2); margin: .6rem 0 .8rem; }
.st-split i { width: var(--w); transition: width .6s; }
.st-split .k, .st-legend .k { background: #e38aa4; }
.st-split .m, .st-legend .m { background: #6b9ac4; }
.st-split .n, .st-legend .n { background: color-mix(in srgb, var(--muted) 35%, transparent); }
.st-legend { list-style: none; padding: 0; margin: 0 0 .6rem; display: grid; gap: .35rem; font-size: .9rem; }
.st-legend li { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.st-legend i { width: 12px; height: 12px; border-radius: 3px; flex: none; }
.st-hours, .st-days { display: flex; align-items: flex-end; gap: 3px; height: 110px; padding-top: 1rem; }
.st-hours i, .st-days i { flex: 1; position: relative; height: max(3px, var(--h)); border-radius: 4px 4px 0 0; background: color-mix(in srgb, var(--accent) 70%, transparent); }
.st-hours i b { position: absolute; top: -1.15rem; left: 50%; transform: translateX(-50%); font-size: .65rem; color: var(--muted); font-weight: 600; }
.st-days i { background: color-mix(in srgb, var(--ok) 65%, transparent); }
.st-hours-axis { display: flex; justify-content: space-between; font-size: .7rem; color: var(--muted); margin: .25rem 0 1rem; }
.st-facts { list-style: none; padding: 0; margin: 0; display: grid; gap: .55rem; }
.st-facts li { line-height: 1.4; }
@media (max-width: 720px) {
  .st-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
  .st-card { padding: .8rem .75rem; }
  .st-emo { font-size: 1.35rem; }
  .st-card strong { font-size: 1.45rem; }
  .st-card strong.st-name { font-size: 1rem; }
  .st-card > span:not(.st-emo) { font-size: .85rem; line-height: 1.25; }
  .st-card small { font-size: .72rem; }
  .st-hero-num strong { font-size: 2.8rem; }
  .st-bars li { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) 1.8rem; font-size: .82rem; }
}

/* Lista zadań */
.task-progress { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.tp-ring { --p: 0; width: 86px; height: 86px; border-radius: 50%; flex: none; display: grid; place-items: center; background: radial-gradient(closest-side, var(--surface) 76%, transparent 78% 100%), conic-gradient(var(--accent) calc(var(--p) * 1%), var(--surface-2) 0); }
.tp-ring strong { font: 600 1.15rem var(--font-display); }
.tp-text { flex: 1; min-width: 200px; display: flex; flex-direction: column; gap: .3rem; }
.tp-template { flex: none; }
.task-form-card > summary { cursor: pointer; font-weight: 600; display: flex; align-items: center; gap: .5rem; list-style: none; }
.task-form-card > summary::-webkit-details-marker { display: none; }
.task-form-card[open] > summary { margin-bottom: 1rem; }
.task-bucket { margin-bottom: 1.4rem; }
.tb-head { display: flex; align-items: center; gap: .5rem; font-size: 1.05rem; margin: 0 0 .6rem; }
.tb-head .icon { color: var(--accent); }
.tb-overdue .tb-head, .tb-overdue .tb-head .icon { color: var(--danger); }
.tb-count { display: inline-grid; place-items: center; min-width: 1.6rem; height: 1.6rem; padding: 0 .4rem; border-radius: 99px; background: var(--surface-2); font: 600 .78rem var(--font-body); color: var(--muted); }
.tb-done > summary { cursor: pointer; color: var(--muted); font-size: .9rem; margin-bottom: .6rem; }
.task-list { display: grid; gap: .6rem; }
.task { display: flex; gap: .85rem; align-items: flex-start; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: .9rem 1rem; box-shadow: var(--shadow); scroll-margin-top: 90px; transition: opacity .3s, background .3s; }
.task.is-star { border-left: 4px solid var(--accent); }
.task:target { outline: 2px solid var(--accent); }
.task-tick-form { display: contents; }
.task-tick { width: 28px; height: 28px; flex: none; border-radius: 50%; border: 2px solid color-mix(in srgb, var(--accent) 55%, var(--line)); background: var(--surface); display: grid; place-items: center; cursor: pointer; padding: 0; color: transparent; transition: background .2s, color .2s, transform .15s, border-color .2s; }
.task-tick .icon { width: 16px; height: 16px; }
.task-tick:hover { border-color: var(--accent); color: color-mix(in srgb, var(--accent) 45%, transparent); }
.task-tick:active { transform: scale(.88); }
.is-done > .task-tick-form .task-tick, .is-done > form > .task-tick { background: var(--ok); border-color: var(--ok); color: #fff; }
.just-done > .task-tick-form .task-tick { animation: tick-pop .5s cubic-bezier(.3,1.6,.5,1); }
@keyframes tick-pop { 40% { transform: scale(1.25); } }
.task-body { flex: 1; min-width: 0; }
.task-top { display: flex; justify-content: space-between; gap: .4rem .8rem; align-items: baseline; flex-wrap: wrap; }
.task-title { font-weight: 600; overflow-wrap: anywhere; }
.is-done .task-title, .subtask.is-done .subtask-title { text-decoration: line-through; color: var(--muted); }
.task.is-done { opacity: .75; }
.task-star { color: var(--accent); }
.task-meta { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.task-due, .task-cat, .task-subcount { display: inline-flex; align-items: center; gap: .25rem; height: 24px; font-size: .75rem; padding: 0 .55rem; border-radius: 99px; background: var(--surface-2); border: 1px solid var(--line); color: var(--muted); white-space: nowrap; line-height: 1; }
.task-due.is-late, .task-due.is-soon { border-color: transparent; }
.task-cat, .task-subcount, .tb-count { color: var(--text); opacity: .85; }
.task-due .icon, .task-cat .icon { width: 13px; height: 13px; }
.task-due.is-late { background: var(--danger-soft); color: color-mix(in srgb, var(--danger) 70%, var(--text)); font-weight: 600; }
.task-due.is-soon { background: var(--warn-soft); color: color-mix(in srgb, var(--warn) 55%, var(--text)); font-weight: 600; }
.task-desc { margin: .35rem 0 0; font-size: .88rem; color: var(--muted); }
.subtasks { list-style: none; padding: 0; margin: .6rem 0 0; display: grid; gap: .25rem; }
.subtask { display: flex; align-items: center; gap: .55rem; padding: .25rem .2rem; border-radius: 8px; font-size: .92rem; }
.subtask:hover { background: var(--surface-2); }
.subtask .task-tick { width: 22px; height: 22px; }
.subtask .task-tick .icon { width: 13px; height: 13px; }
.subtask-title { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.subtask-del { opacity: 0; transition: opacity .15s; }
.subtask:hover .subtask-del, .subtask:focus-within .subtask-del { opacity: 1; }
.subtask-del .icon-btn { width: 28px; height: 28px; border: 0; background: none; }
.task-actions { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-top: .7rem; }
.task-actions .icon-btn, .sub-add .icon-btn { width: 34px; height: 34px; border-radius: 9px; }
.task-actions .icon-btn .icon, .sub-add .icon-btn .icon { width: 16px; height: 16px; }
.task-actions .task-del:hover { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 40%, var(--line)); }
.task-actions .inline { display: inline-flex; }
.sub-add { display: flex; gap: .3rem; flex: 1 1 260px; min-width: 0; }
.sub-add input[name="title"] { flex: 1; min-width: 0; height: 34px; min-height: 34px; padding: .3rem .6rem; font-size: .88rem; }
.sub-add input[type="date"] { width: 9.5rem; height: 34px; min-height: 34px; padding: .25rem .4rem; font-size: .82rem; }
@media (hover: none) { .subtask-del { opacity: 1; } }
@media (max-width: 720px) {
  .sub-add { flex-wrap: wrap; flex-basis: 100%; }
  .sub-add input[name="title"] { flex: 1 1 100%; }
  .sub-add input[type="date"] { flex: 1; width: auto; }
  .task { padding: .8rem .8rem; gap: .65rem; }
}

/* Kalendarz */
.cal-nav { display: flex; align-items: center; gap: .6rem; margin-bottom: .8rem; flex-wrap: wrap; }
.cal-nav h2 { margin: 0; min-width: 11rem; text-align: center; font-size: 1.3rem; }
.cal-jump { margin-left: auto; display: flex; gap: .4rem; }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.cal-dow { text-align: center; font: 600 .75rem var(--font-body); color: var(--muted); text-transform: uppercase; padding: .2rem 0; }
.cal-day { position: relative; min-height: 96px; border-radius: 10px; border: 1px solid var(--line); padding: .3rem .35rem; text-decoration: none; color: var(--text); display: flex; flex-direction: column; gap: .2rem; background: var(--surface); transition: background .15s, border-color .15s; min-width: 0; }
.cal-day:hover { border-color: var(--accent); }
.cal-day.is-out { opacity: .45; background: transparent; }
.cal-day.is-today { border: 2px solid var(--accent); }
.cal-day.is-today .cal-num { background: var(--accent); color: var(--on-accent); }
.cal-day.is-wedding { background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 22%, var(--surface)), var(--surface)); }
.cal-num { font: 600 .82rem var(--font-body); width: 1.6rem; height: 1.6rem; display: grid; place-items: center; border-radius: 50%; }
.cal-heart { position: absolute; top: .25rem; right: .35rem; font-size: 1rem; }
.cal-items { display: grid; gap: 2px; min-width: 0; }
.cal-chip { font-size: .68rem; line-height: 1.25; padding: .1rem .3rem; border-radius: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--text); }
.cal-chip.k-pay { background: color-mix(in srgb, #e07a5f 25%, transparent); }
.cal-chip.k-rsvp { background: color-mix(in srgb, #6b9ac4 22%, transparent); }
.cal-chip.k-wedding { background: var(--accent); color: var(--on-accent); font-weight: 600; }
.cal-chip.is-done { text-decoration: line-through; opacity: .55; }
.cal-day.is-late .cal-chip.k-task:not(.is-done) { background: var(--danger-soft); color: var(--danger); }
.cal-more { font-size: .68rem; color: var(--muted); padding-left: .2rem; }
.cal-dots { display: none; gap: 3px; justify-content: center; margin-top: auto; }
.cal-dots i, .cal-legend i { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); display: inline-block; }
.cal-dots i.k-pay, .cal-legend i.k-pay { background: #e07a5f; }
.cal-dots i.k-rsvp, .cal-legend i.k-rsvp { background: #6b9ac4; }
.cal-dots i.k-wedding, .cal-legend i.k-wedding { background: #d4567a; }
.cal-dots i.is-done { opacity: .35; }
.cal-legend { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem 1rem; padding: 0; margin: .8rem 0 0; color: var(--muted); }
.cal-legend li { display: inline-flex; align-items: center; gap: .35rem; }
.agenda { list-style: none; padding: 0; margin: 0; display: grid; gap: .7rem; }
.agenda-day { display: flex; gap: .8rem; padding: .5rem; border-radius: 12px; scroll-margin-top: 90px; }
.agenda-day.is-today { background: color-mix(in srgb, var(--accent) 9%, transparent); }
.agenda-day.is-flash { animation: ag-flash 1.4s ease; }
@keyframes ag-flash { 0%, 40% { background: color-mix(in srgb, var(--accent) 22%, transparent); } }
.agenda-date { width: 3rem; flex: none; text-align: center; display: flex; flex-direction: column; }
.agenda-date strong { font: 600 1.4rem/1 var(--font-display); }
.agenda-date span { font-size: .75rem; color: var(--muted); text-transform: uppercase; }
.agenda-day > ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .35rem; flex: 1; min-width: 0; }
.agenda-item { display: flex; align-items: center; gap: .55rem; }
.agenda-item .task-tick { width: 24px; height: 24px; }
.agenda-ic { width: 24px; height: 24px; flex: none; display: grid; place-items: center; color: var(--accent); }
.agenda-item.k-pay .agenda-ic { color: #e07a5f; }
.agenda-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.agenda-kind { font-size: .7rem; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
@media (max-width: 720px) {
  .cal-grid { gap: 2px; }
  .cal-day { min-height: 52px; padding: .2rem; align-items: center; }
  .cal-items { display: none; }
  .cal-dots { display: flex; }
  .cal-heart { font-size: .7rem; top: .1rem; right: .1rem; }
  .cal-nav h2 { min-width: 0; flex: 1; font-size: 1.1rem; }
  .cal-jump { width: 100%; margin: 0; justify-content: center; }
  .agenda-kind { display: none; }
}

/* Prezenty */
.gift-ideas { display: flex; flex-wrap: wrap; gap: .35rem; margin: -.3rem 0 .8rem; }
.gift-sum { font-size: 1.1rem; margin: .2rem 0 .5rem; }
.gift-sum strong { font: 600 2rem var(--font-display); color: var(--accent-strong); }
.gift-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.gift { display: flex; gap: .9rem; align-items: flex-start; margin: 0; scroll-margin-top: 90px; }
.gift.is-taken { opacity: .6; }
.gift.is-mine { border-color: var(--ok); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ok) 25%, transparent); }
.gift-ic { width: 52px; height: 52px; flex: none; border-radius: 14px; display: grid; place-items: center; background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent-strong); font-size: 1.7rem; }
.gift-ic .icon { width: 26px; height: 26px; }
.gift-body { flex: 1; min-width: 0; }
.gift-body h3 { margin: 0 0 .25rem; font-size: 1.05rem; overflow-wrap: anywhere; }
.gift-body p { margin: 0 0 .45rem; }
.gift-actions { display: flex; flex-direction: column; gap: .3rem; }
.gift-who { margin-top: .5rem; }
.gift-who ul { padding-left: 1rem; margin: .4rem 0 0; }
.gift-mine { color: var(--ok); font-weight: 600; display: flex; align-items: center; gap: .3rem; margin: .3rem 0; }
.gift-claim { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .3rem; }
.gift-claim input { flex: 1 1 140px; min-height: 36px; }

/* Menu i diety */
.diet-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .7rem; margin: .4rem 0 1rem; }
.diet-tile { border: 1px solid var(--line); border-radius: 14px; padding: .8rem; display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.diet-tile.is-total { background: color-mix(in srgb, var(--accent) 10%, var(--surface)); border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); }
.diet-emo { font-size: 1.5rem; }
.diet-tile strong { font: 600 1.6rem/1.1 var(--font-display); }
.diet-tile small { color: var(--muted); font-size: .75rem; overflow-wrap: anywhere; }
@media (max-width: 720px) { .diet-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; } .diet-tile { padding: .6rem; } .diet-tile.is-total { grid-column: 1 / -1; } .card.diet-card, .card.menu-card { padding: 1.1rem .9rem; } }
.allergy-list { padding-left: 1.1rem; margin: .3rem 0 1rem; display: grid; gap: .3rem; }
.tag-pick { border: 1px solid var(--line); border-radius: 12px; padding: .5rem .8rem .7rem; margin: 0 0 1rem; display: flex; flex-wrap: wrap; gap: .35rem; }
.tag-pick legend { font-size: .85rem; font-weight: 600; padding: 0 .3rem; }
.tag-opt { margin: 0 !important; cursor: pointer; position: relative; }
.tag-opt input { position: absolute; opacity: 0; pointer-events: none; }
.tag-opt span { display: inline-block; padding: .3rem .65rem; border-radius: 99px; border: 1px solid var(--line); font-size: .82rem; font-weight: 400; transition: background .15s, border-color .15s; }
.tag-opt input:checked + span { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-strong); font-weight: 600; }
.tag-opt input:focus-visible + span { box-shadow: var(--ring); }
.menu-card { text-align: center; }
.menu-title { font: 600 2rem var(--font-display); margin: 0 0 .5rem; }
.menu-course { display: flex; align-items: center; justify-content: center; gap: .6rem; font-size: .82rem; text-transform: uppercase; letter-spacing: .14em; color: var(--accent-strong); margin: 1.2rem 0 .4rem; }
.menu-course::before, .menu-course::after { content: ""; flex: 0 1 50px; height: 1px; background: color-mix(in srgb, var(--accent) 45%, transparent); }
.menu-items { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.menu-items li { display: flex; justify-content: center; gap: .5rem; align-items: flex-start; }
.menu-tag { font-size: .85rem; margin-left: .15rem; }
.menu-act { display: inline-flex; gap: .2rem; }
.menu-act .icon-btn { width: 30px; height: 30px; border: 0; background: none; }
.menu-legend { margin-top: 1.2rem; }

/* Muzyka */
.moment-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .7rem; }
.moment { border: 1px dashed var(--line); border-radius: 14px; padding: .7rem .8rem; min-width: 0; }
.moment.has-song { border-style: solid; background: color-mix(in srgb, var(--accent) 6%, var(--surface)); }
.moment-head { display: flex; align-items: center; gap: .5rem; }
.moment-head strong { flex: 1; font-size: .9rem; min-width: 0; overflow-wrap: anywhere; hyphens: auto; }
.moment-head > a { flex: none; }
.moment-emo { font-size: 1.3rem; }
.moment p { margin: .3rem 0 0; }
.song-list { list-style: none; padding: 0; margin: .4rem 0 0; display: grid; gap: .3rem; }
.song { display: flex; align-items: center; gap: .6rem; padding: .35rem .3rem; border-radius: 10px; }
.song:hover { background: var(--surface-2); }
.song.is-rejected { opacity: .55; }
.song-list.is-never .song-txt strong { text-decoration: line-through; text-decoration-color: var(--danger); }
.song-play { width: 32px; height: 32px; flex: none; border-radius: 50%; display: grid; place-items: center; background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent-strong); }
.song-play .icon { width: 15px; height: 15px; }
.song-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; overflow-wrap: anywhere; }
.song-act { display: inline-flex; gap: .2rem; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.song-act .icon-btn { width: 30px; height: 30px; border: 0; background: none; }
.song-decide { display: inline-flex; gap: .25rem; flex-wrap: wrap; }
@media (max-width: 720px) {
  .moment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }
  .moment { padding: .5rem .55rem; }
  .moment.has-song { grid-column: 1 / -1; }
  .moment:not(.has-song) p { display: none; }
  .moment-head strong { font-size: .8rem; line-height: 1.2; }
  .moment-head .btn-tiny { padding: .2rem .35rem; min-height: 28px; }
}

/* Usługodawcy */
.vendor-cat { margin-bottom: 1.2rem; }
.vendor-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.vendor { margin: 0; display: flex; flex-direction: column; scroll-margin-top: 90px; }
.vendor.is-rejected { opacity: .55; }
.vendor-top { display: flex; justify-content: space-between; gap: .5rem; align-items: flex-start; }
.vendor-top h3 { margin: 0; font-size: 1.08rem; overflow-wrap: anywhere; }
.vendor-info { list-style: none; padding: 0; margin: .7rem 0; display: grid; gap: .35rem; font-size: .9rem; }
.vendor-info li { display: flex; gap: .45rem; align-items: center; overflow-wrap: anywhere; min-width: 0; }
.vendor-info .icon { color: var(--accent); flex: none; width: 16px; height: 16px; }
.vendor-notes { margin: 0 0 .7rem; }
.vendor-act { margin-top: auto; display: flex; gap: .4rem; }
.st-card.st-wide { grid-column: 1 / -1; }
.vendor-missing { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .45rem; position: relative; z-index: 1; }
.vendor-missing .chip { font-size: .72rem; padding: .2rem .55rem; text-decoration: none; }

/* Komentarze w galerii */
.cm-toggle .switch-form { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.cm-btn { display: inline-flex; align-items: center; gap: .2rem; border: 0; background: none; color: var(--muted); cursor: pointer; padding: .2rem .3rem; border-radius: 8px; font: 600 .8rem var(--font-body); }
.cm-btn:hover { color: var(--accent-strong); background: var(--surface-2); }
.cm-btn .icon { width: 17px; height: 17px; }
.cm-sheet { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: flex-end; justify-content: center; }
.cm-sheet[hidden] { display: none; }
.cm-backdrop { position: absolute; inset: 0; background: rgba(20, 16, 12, .5); animation: cm-fade .2s ease; }
.cm-panel { position: relative; width: min(560px, 100%); max-height: min(80vh, 680px); display: flex; flex-direction: column; background: var(--surface); color: var(--text); border-radius: 20px 20px 0 0; box-shadow: 0 -10px 40px rgba(0,0,0,.25); padding: .9rem 1rem calc(.9rem + env(safe-area-inset-bottom)); animation: cm-up .28s cubic-bezier(.2,.8,.2,1); }
@keyframes cm-up { from { transform: translateY(40px); opacity: 0; } }
@keyframes cm-fade { from { opacity: 0; } }
.cm-head { display: flex; align-items: center; gap: .7rem; padding-bottom: .6rem; border-bottom: 1px solid var(--line); }
.cm-head h2 { flex: 1; margin: 0; font-size: 1.05rem; display: flex; align-items: center; gap: .4rem; }
.cm-thumb { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; }
.cm-list { list-style: none; margin: 0; padding: .6rem 0; overflow-y: auto; flex: 1; display: grid; gap: .55rem; align-content: start; min-height: 90px; }
.cm-item { background: var(--surface-2); border-radius: 14px 14px 14px 4px; padding: .5rem .75rem; position: relative; max-width: 92%; }
.cm-item.is-mine { justify-self: end; border-radius: 14px 14px 4px 14px; background: color-mix(in srgb, var(--accent) 14%, var(--surface)); }
.cm-item p { margin: .15rem 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.cm-del { border: 0; background: none; color: var(--muted); font-size: .72rem; cursor: pointer; padding: 0; margin-top: .2rem; text-decoration: underline; }
.cm-form { display: grid; gap: .4rem; border-top: 1px solid var(--line); padding-top: .6rem; }
.cm-row { display: flex; gap: .4rem; align-items: flex-end; }
.cm-row textarea { flex: 1; resize: none; min-height: 42px; max-height: 140px; }
.cm-row .btn { min-height: 42px; }
.cm-quick { display: flex; gap: .25rem; flex-wrap: wrap; }
.cm-quick button { border: 1px solid var(--line); background: var(--surface); border-radius: 99px; padding: .15rem .55rem; font-size: 1.05rem; cursor: pointer; }
body.cm-open { overflow: hidden; }
@media (min-width: 721px) { .cm-sheet { align-items: center; } .cm-panel { border-radius: 20px; } }

/* Kreator zaproszeń: gotowe pomysły */
.blk-presets-h { font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin: 1rem 0 .5rem; }
.blk-presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .45rem; }
.blk-preset { display: flex; align-items: center; gap: .5rem; text-align: left; border: 1px solid var(--line); border-radius: 12px; padding: .55rem .7rem; background: var(--surface); cursor: pointer; font: 500 .85rem var(--font-body); color: var(--text); }
.blk-preset:hover { border-color: var(--accent); background: var(--accent-soft); }
.blk-preset span { font-size: 1.35rem; }
.blk-wishes { display: flex; flex-wrap: wrap; gap: .35rem; }
.blk-wishes button { display: inline-flex; align-items: center; gap: .3rem; border: 1px solid var(--line); background: var(--surface); border-radius: 99px; padding: .3rem .65rem; cursor: pointer; font-size: .82rem; color: var(--text); }
.blk-wishes button.on { background: var(--accent-soft); border-color: var(--accent); font-weight: 600; }
.blk-wishes button span { font-size: 1.05rem; }

/* Pulpit: najbliższe zadania */
.dash-task-list { list-style: none; padding: 0; margin: .4rem 0 .8rem; display: grid; gap: .3rem; }
.dash-task-list a { display: flex; align-items: center; gap: .6rem; padding: .45rem .5rem; border-radius: 10px; text-decoration: none; color: var(--text); }
.dash-task-list a:hover { background: var(--surface-2); }
.dash-task-list .icon { color: var(--accent); flex: none; }
.dash-task-list span { flex: 1; min-width: 0; }
.dash-links { display: flex; flex-wrap: wrap; gap: .35rem; }
.dash-links .chip { text-decoration: none; }

@media print {
  .task-actions, .task-tick-form, .tp-template, .task-form-card, .cal-nav .icon-btn, .cal-jump, .sub-add, .cm-btn, [data-print], .page-head .btn { display: none !important; }
  .card, .st-card, .task, .vendor, .gift { box-shadow: none !important; break-inside: avoid; }
  .grid-2 { display: block; }
}

/* ---------- Pulpit: powitanie z pierścieniem, kafelki z ikonami, budżet ---------- */
.welcome { position: relative; overflow: hidden; }
.welcome-text, .welcome-count { position: relative; z-index: 1; }
.welcome-amp { font-family: var(--font-display); font-style: italic; font-weight: 400; color: var(--accent); padding: 0 .05em; }
.welcome-date { display: flex; align-items: center; gap: .4rem; margin: .55rem 0 0; color: var(--text); opacity: .8; font-size: .92rem; }
.welcome-date .icon { width: 1rem; height: 1rem; color: var(--accent); }
.welcome-sub { margin: .35rem 0 0; color: var(--muted); font-size: .86rem; max-width: 46ch; }
.welcome-deco { position: absolute; inset: 0; pointer-events: none; z-index: 0; color: var(--accent); }
.welcome-deco .icon { position: absolute; opacity: .13; }
.welcome-deco .wd-1 { width: 46px; height: 46px; right: 190px; top: 18px; transform: rotate(-14deg); }
.welcome-deco .wd-2 { width: 26px; height: 26px; right: 168px; bottom: 22px; opacity: .2; }
.welcome-deco .wd-3 { width: 22px; height: 22px; right: 26px; top: 14px; transform: rotate(12deg); opacity: .16; }

.welcome .welcome-count.has-ring { flex-direction: column; align-items: center; gap: .45rem; padding-left: 0; font-family: var(--font-body); font-size: .72rem; text-transform: uppercase; letter-spacing: .16em; color: var(--muted); }
.welcome .welcome-count.has-ring::before { display: none; }
.wc-ring { display: grid; place-items: center; width: 124px; height: 124px; }
.wc-ring > * { grid-area: 1 / 1; }
.wc-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); overflow: visible; }
.wc-ring circle { fill: none; stroke-width: 7; }
.wc-track { stroke: color-mix(in srgb, var(--accent) 14%, transparent); }
.wc-prog { stroke: var(--accent); stroke-linecap: round; }
.welcome .wc-ring .countdown-num { font-size: 2.5rem; line-height: 1; margin: 0; letter-spacing: -.01em; }
.welcome .wc-ring .countdown-num.is-word { font-size: 1.6rem; }
.wc-label { text-align: center; }

.dash-stats .stat { display: flex; flex-direction: column; gap: .1rem; padding-top: 1rem; overflow: hidden; --k: var(--accent); }
.dash-stats .stat.st-ok { --k: var(--ok); }
.dash-stats .stat.st-warn { --k: var(--warn); }
.dash-stats .stat.st-bad { --k: var(--danger); }
.dash-stats .stat.st-pink { --k: color-mix(in srgb, var(--accent) 45%, #e0567f); }
.stat-ico { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; margin-bottom: .45rem; color: var(--k); background: color-mix(in srgb, var(--k) 14%, transparent); border: 1px solid color-mix(in srgb, var(--k) 22%, transparent); }
.stat-ico .icon { width: 19px; height: 19px; }
.stat-label { font-style: normal; color: var(--muted); line-height: 1.3; }
.stat-bar { display: block; height: 4px; margin-top: auto; border-radius: 99px; background: color-mix(in srgb, var(--k) 13%, transparent); overflow: hidden; position: relative; top: .45rem; }
.stat-bar b { display: block; height: 100%; width: var(--w, 0); border-radius: inherit; background: var(--k); transform-origin: left; }
.dash-stats .stat::after { content: ""; position: absolute; right: -28px; bottom: -28px; width: 80px; height: 80px; border-radius: 50%; background: var(--k); opacity: .05; transition: transform .35s cubic-bezier(.2,.7,.2,1), opacity .35s; pointer-events: none; }
.dash-stats a.stat:hover::after { transform: scale(1.5); opacity: .09; }

.bw-head { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .3rem; }
.budget-widget .bw-head h2 { margin: 0; }
.bw-pct { font: 600 .78rem var(--font-body); padding: .15rem .55rem; border-radius: 99px; background: var(--accent-soft); color: var(--accent-strong); }
.bw-badge { display: inline-flex; align-items: center; gap: .3rem; font: 500 .76rem var(--font-body); padding: .15rem .6rem; border-radius: 99px; background: var(--ok-soft); color: color-mix(in srgb, var(--ok) 70%, var(--text)); }
.bw-badge .icon { width: .95rem; height: .95rem; }
.budget-widget.is-paid .bar-fill { --c: var(--ok); }
.bw-bar .bar-fill { position: relative; overflow: hidden; }
.budget-widget > .kpi-icon { width: 48px; height: 48px; border-radius: 14px; }

.dash-tasks .bar.thin { margin: .5rem 0 .3rem; }
.dash-links .chip { transition: transform .2s cubic-bezier(.2,.7,.2,1), background .15s, color .15s, border-color .15s; }

@keyframes ring-in { from { stroke-dasharray: 0 100; } }
@keyframes deco-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -6px; } }
@keyframes ico-wiggle { 0%, 100% { rotate: 0deg; } 30% { rotate: -10deg; } 60% { rotate: 8deg; } }
@keyframes bar-shine { 0%, 70% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
@keyframes amp-beat { 0%, 100% { scale: 1; } 50% { scale: 1.12; } }
@media (prefers-reduced-motion: no-preference) {
  .wc-prog { animation: ring-in 1.4s cubic-bezier(.3,.7,.2,1) .2s both; }
  .welcome-deco .wd-1 { animation: deco-float 6s ease-in-out infinite; }
  .welcome-deco .wd-2 { animation: deco-float 5s ease-in-out -2s infinite; }
  .welcome-deco .wd-3 { animation: deco-float 7s ease-in-out -4s infinite; }
  .welcome-amp { display: inline-block; animation: amp-beat 3.2s ease-in-out 1.2s infinite; }
  .stat-bar b { animation: grow-x .9s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(var(--d, 0) * 70ms + 300ms); }
  .dash-stats a.stat:hover .stat-ico .icon { animation: ico-wiggle .5s ease-in-out; }
  .stat-ico { transition: transform .25s cubic-bezier(.2,.7,.2,1); }
  .dash-stats a.stat:hover .stat-ico { transform: scale(1.08); }
  .bw-bar .bar-fill::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent); animation: bar-shine 4.5s ease-in-out 1.5s infinite; }
  .bw-badge { animation: pop-in .5s cubic-bezier(.2,.7,.2,1) .6s both; }
  .dash-task-list li { animation: fade-up .45s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(var(--i, 0) * 80ms + 200ms); }
  .dash-links .chip:hover { transform: translateY(-2px); }
}
@media (max-width: 640px) {
  .welcome .welcome-count.has-ring { flex-direction: row; gap: .8rem; text-align: left; }
  .wc-ring { width: 88px; height: 88px; }
  .welcome .wc-ring .countdown-num { font-size: 1.85rem; }
  .welcome .wc-ring .countdown-num.is-word { font-size: 1.2rem; }
  .wc-label { text-align: left; max-width: 12ch; }
  .welcome-deco .wd-1 { right: 18px; top: auto; bottom: 30px; }
  .welcome-deco .wd-2 { right: 80px; bottom: 16px; }
  .stat-ico { width: 32px; height: 32px; margin-bottom: .35rem; }
}

@media (max-width: 640px) { .dash-stats .stat:last-child:nth-child(odd) { grid-column: 1 / -1; } }

/* Podzadania: zmiana nazwy w miejscu */
.subtask-title[data-sub-edit] { cursor: text; }
.subtask-edit { opacity: 0; transition: opacity .15s; }
.subtask .subtask-edit { width: 28px; height: 28px; border: 0; background: none; color: var(--muted); }
.subtask .subtask-edit .icon { width: 14px; height: 14px; }
.subtask:hover .subtask-edit, .subtask:focus-within .subtask-edit { opacity: 1; }
.subtask .subtask-edit:hover { color: var(--accent); }
@media (hover: none) { .subtask-edit { opacity: 1; } }
.sub-edit:not([hidden]) { display: flex; align-items: center; gap: .3rem; flex: 1; min-width: 0; flex-wrap: wrap; }
.sub-edit input[name="title"] { flex: 1 1 160px; min-width: 0; height: 32px; min-height: 32px; margin: 0; padding: .25rem .55rem; font-size: .9rem; }
.sub-edit input[type="date"] { width: 9.5rem; height: 32px; min-height: 32px; margin: 0; padding: .2rem .4rem; font-size: .82rem; }
.sub-edit .icon-btn { width: 32px; height: 32px; border-radius: 8px; }
.sub-edit .icon-btn .icon { width: 15px; height: 15px; }
.sub-edit .is-save { background: var(--accent); border-color: var(--accent); color: #fff; }
.subtask.is-editing { background: var(--surface-2); }
.subtask.is-editing > .subtask-title, .subtask.is-editing > .task-due, .subtask.is-editing > .subtask-edit, .subtask.is-editing > .subtask-del { display: none; }
@media (prefers-reduced-motion: no-preference) { .sub-edit:not([hidden]) { animation: fade-up .25s ease-out both; } }

/* Kalendarz: przełącznik ukończonych */
.cal-foot { display: flex; align-items: center; justify-content: space-between; gap: .6rem 1rem; flex-wrap: wrap; margin-top: .8rem; }
.cal-foot .cal-legend { margin: 0; }
.cal-hide { text-decoration: none; }
.cal-hide .icon { width: 1rem; height: 1rem; }

/* ---------- Statystyki v2: hero, nawigacja sekcji, pierścienie, animacje przy przewijaniu ---------- */
.st-hero { position: relative; overflow: hidden; display: flex; gap: 1.2rem 2rem; align-items: center; flex-wrap: wrap; padding: 1.5rem 1.6rem; }
.st-hero > * { position: relative; z-index: 1; }
.st-hero-deco { position: absolute; inset: 0; z-index: 0; pointer-events: none; color: var(--accent); }
.st-hero-deco .icon { position: absolute; opacity: .12; }
.st-hero-deco .d1 { width: 70px; height: 70px; right: 22px; bottom: -14px; }
.st-hero-deco .d2 { width: 34px; height: 34px; right: 120px; top: 14px; transform: rotate(-12deg); }
.st-hero-main { display: flex; flex-direction: column; gap: .1rem; min-width: 150px; }
.st-big { font: 600 3.6rem/1 var(--font-display); color: var(--accent-strong); letter-spacing: -.02em; font-variant-numeric: lining-nums tabular-nums; }
.st-big-lbl { color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .16em; }
.st-hero-date { display: inline-flex; align-items: center; gap: .35rem; margin-top: .6rem; font-size: .88rem; color: var(--text); opacity: .85; }
.st-hero-date .icon { width: 1rem; height: 1rem; color: var(--accent); }
.st-hero-tiles { flex: 1; min-width: 260px; display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: .7rem; }
.st-mini { display: flex; flex-direction: column; gap: .1rem; padding: .8rem .9rem; border-radius: 14px; background: color-mix(in srgb, var(--surface) 70%, transparent); border: 1px solid var(--line); color: var(--text); text-decoration: none; min-width: 0; }
.st-mini > .icon { width: 1.15rem; height: 1.15rem; color: var(--accent); margin-bottom: .2rem; }
.st-mini strong { font: 600 1.5rem/1.1 var(--font-display); font-variant-numeric: lining-nums tabular-nums; }
.st-mini span { font-size: .8rem; color: var(--muted); }
.st-mini span em { display: block; font-style: normal; font-size: .76rem; }
.st-mini-ring { flex-direction: row; align-items: center; gap: .7rem; }
.st-mini-ring:hover { border-color: var(--accent); }

.st-ring { --rc: var(--accent); position: relative; display: grid; place-items: center; width: 64px; height: 64px; flex: none; }
.st-ring.is-ok { --rc: var(--ok); }
.st-ring > * { grid-area: 1 / 1; }
.st-ring svg, .st-donut svg { width: 100%; height: 100%; transform: rotate(-90deg); overflow: visible; }
.st-ring circle, .st-donut circle { fill: none; stroke-width: 10; }
.st-ring .r-track, .st-donut .r-track { stroke: color-mix(in srgb, var(--rc, var(--accent)) 14%, transparent); }
.st-ring .r-prog { stroke: var(--rc); stroke-linecap: round; }
.st-ring-in strong { font: 600 .95rem var(--font-body); color: var(--text); }
.st-card-ring { flex-direction: row !important; align-items: center; gap: .8rem !important; }
.st-card-ring .st-ring { width: 76px; height: 76px; }
.st-card-ring .st-ring-in strong { font-size: 1.05rem; }
.st-card-ring div { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.st-card-ring div span { font-weight: 500; }

.st-nav { position: sticky; top: .6rem; z-index: 6; display: flex; gap: .35rem; overflow-x: auto; scrollbar-width: none; margin: 1.1rem 0 .2rem; padding: .35rem; border-radius: 999px; background: color-mix(in srgb, var(--surface) 82%, transparent); border: 1px solid var(--line); box-shadow: var(--shadow); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.st-nav::-webkit-scrollbar { display: none; }
.st-nav a { flex: none; padding: .38rem .8rem; border-radius: 999px; font-size: .84rem; font-weight: 500; color: var(--text); text-decoration: none; white-space: nowrap; transition: background .2s, color .2s; }
.st-nav a:hover { background: var(--surface-2); }
.st-nav a.is-on { background: var(--accent); color: var(--on-accent, #fff); }
.st-h, #st-ciekawostki { scroll-margin-top: 4.5rem; }

.st-card { transition: transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s, border-color .2s; }
.st-card.is-gold::after { background: color-mix(in srgb, #d4a72c 18%, transparent); }
.st-meter { display: block; height: 5px; margin-top: .55rem; border-radius: 99px; background: color-mix(in srgb, var(--accent) 12%, transparent); overflow: hidden; }
.st-card.is-ok .st-meter { background: color-mix(in srgb, var(--ok) 14%, transparent); }
.st-meter b { display: block; height: 100%; width: var(--w); border-radius: inherit; background: var(--accent); transform-origin: left; }
.st-card.is-ok .st-meter b { background: var(--ok); }

.st-gender-row { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.st-donut { position: relative; display: grid; place-items: center; width: 130px; height: 130px; flex: none; }
.st-donut > * { grid-area: 1 / 1; }
.st-donut circle { stroke-width: 14; }
.st-donut .seg.k { stroke: #e38aa4; } .st-donut .seg.m { stroke: #6b9ac4; } .st-donut .seg.n { stroke: color-mix(in srgb, var(--muted) 35%, transparent); }
.st-donut-in { display: flex; flex-direction: column; align-items: center; gap: .1rem; font-size: .85rem; }
.st-gender .st-legend { flex: 1; min-width: 180px; }
.st-dancers { display: inline-block; }

.st-facts li { display: flex; gap: .6rem; align-items: flex-start; padding: .45rem .55rem; border-radius: 10px; transition: background .2s; }
.st-facts li:hover { background: var(--surface-2); }
.st-facts li > span { font-size: 1.15rem; line-height: 1.25; flex: none; }
.st-hours i.is-peak { background: var(--accent); }

.st-empty { display: flex; gap: 1rem; align-items: center; }
.st-empty-emo { font-size: 2.6rem; flex: none; }
.st-empty strong { font-size: 1.05rem; }
.st-empty p { margin: .25rem 0 .6rem; }

@keyframes st-up { from { transform: scaleY(0); } }
@keyframes st-in { from { opacity: 0; transform: translateX(-8px); } }
@keyframes st-emo-bob { 0%, 100% { transform: none; } 40% { transform: translateY(-4px) rotate(-8deg); } 70% { transform: translateY(0) rotate(5deg); } }
@keyframes st-dance { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg); } }
@keyframes st-ring-in { from { stroke-dasharray: 0 100; } }
@keyframes st-float { 50% { translate: 0 -7px; } }
@media (prefers-reduced-motion: no-preference) {
  .st-hero-deco .d1 { animation: st-float 6s ease-in-out infinite; }
  .st-hero-deco .d2 { animation: st-float 5s ease-in-out -2s infinite; }
  .st-ring .r-prog { animation: st-ring-in 1.3s cubic-bezier(.3,.7,.2,1) .3s both; }
  .js-anim .reveal:not(.is-in) .r-prog, .js-anim .reveal:not(.is-in) .seg, .js-anim .reveal:not(.is-in) .st-bt i,
  .js-anim .reveal:not(.is-in) .st-meter b, .js-anim .reveal:not(.is-in) .st-hours i, .js-anim .reveal:not(.is-in) .st-days i { animation-play-state: paused; }
  .st-donut .seg { animation: st-ring-in 1.2s cubic-bezier(.3,.7,.2,1) .2s both; }
  .st-meter b { animation: grow-x .9s cubic-bezier(.2,.7,.2,1) .25s both; }
  .st-bars li { animation: st-in .45s ease-out both; animation-delay: calc(var(--i, 0) * 60ms); }
  .st-bt i { animation-delay: calc(var(--i, 0) * 60ms + 150ms); }
  .st-hours i, .st-days i { transform-origin: bottom; animation: st-up .7s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(var(--i, 0) * 25ms + 150ms); }
  .st-card:hover { transform: translateY(-3px); box-shadow: 0 10px 26px -14px color-mix(in srgb, var(--accent) 45%, transparent); }
  .st-card:hover .st-emo { animation: st-emo-bob .7s ease-in-out; }
  .st-emo { display: inline-block; align-self: flex-start; }
  .st-dancers { animation: st-dance 1.6s ease-in-out infinite; }
  .st-empty-emo { animation: st-float 3s ease-in-out infinite; }
}
@media (max-width: 1000px) {
  .st-nav { top: 66px; }
  .st-h, #st-ciekawostki { scroll-margin-top: 8rem; }
}
@media (max-width: 720px) {
  .st-hero { padding: 1.15rem; gap: 1rem; }
  .st-big { font-size: 2.9rem; }
  .st-hero-tiles { min-width: 0; width: 100%; grid-template-columns: 1fr 1fr; gap: .5rem; }
  .st-mini { padding: .65rem .7rem; }
  .st-mini strong { font-size: 1.25rem; }
  .st-mini-ring { grid-column: 1 / -1; }
  .st-ring { width: 54px; height: 54px; }
  .st-card-ring { grid-column: 1 / -1; }
  .st-donut { width: 110px; height: 110px; }
  .st-grid > .st-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media print { .st-nav, .st-hero-deco { display: none !important; } }

/* ---------- Arkusze wydruku (muzyka, menu, usługodawcy, zadania, harmonogram) ---------- */
.print-actions { display: inline-flex; gap: .4rem; flex-wrap: wrap; }
.ps { display: none; }
@media print {
  /* Margines strony 0 = przeglądarka nie dopisuje nagłówka (data, tytuł) ani stopki (adres, numer strony); odstęp daje sam arkusz,
     powtarzany na każdej stronie (box-decoration-break: clone) */
  @page arkusz { size: A4; margin: 0; }
  body:has(.ps) { page: arkusz; margin: 0 !important; padding: 0 !important; }
  .panel-main:has(> .ps) > :not(.ps) { display: none !important; }
  .panel-main:has(> .ps) { max-width: none; padding: 0 !important; margin: 0 !important; }
  .ps { page: arkusz; padding: 14mm 15mm 14mm; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
  .ps { display: block; --pa: var(--accent); color: #1d1b22; font: 10.5pt/1.45 var(--font-body); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .ps * { box-shadow: none !important; }
  .ps-head { text-align: center; margin-bottom: 7mm; }
  .ps-mono { display: inline-grid; place-items: center; width: 15mm; height: 15mm; border-radius: 50%; border: 1.5px solid var(--pa); color: var(--pa); font: 600 11pt var(--font-display); letter-spacing: .04em; }
  .ps-kind { margin: 3mm 0 1mm; font-size: 8.5pt; letter-spacing: .22em; text-transform: uppercase; color: var(--pa); font-weight: 600; }
  .ps-names { margin: 0; font: 400 24pt/1.15 var(--font-display); color: #1d1b22; }
  .ps-names i { color: var(--pa); font-weight: 400; padding: 0 .1em; }
  .ps-meta { margin: 1.2mm 0 0; color: #6b6474; font-size: 9.5pt; letter-spacing: .04em; }
  .ps-orn { display: flex; align-items: center; justify-content: center; gap: 3mm; margin: 3.5mm auto 0; max-width: 90mm; color: var(--pa); font-size: 12pt; }
  .ps-orn span { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--pa)); }
  .ps-orn span:last-child { background: linear-gradient(90deg, var(--pa), transparent); }
  .ps-sub { margin: 2.5mm 0 0; font-size: 9.5pt; color: #4a4452; }
  .ps-sec { margin: 0 0 6mm; break-inside: auto; }
  .ps-sec.ps-keep { break-inside: avoid-page; } /* tylko krótkie bloki (np. podsumowania) */
  .ps-sec h2 { display: flex; align-items: baseline; gap: 2mm; margin: 0 0 2.5mm; padding-bottom: 1.5mm; border-bottom: 1.5px solid color-mix(in srgb, var(--pa) 45%, #fff); font: 600 13pt var(--font-display); color: #1d1b22; break-after: avoid; }
  .ps-sec h2 small { font: 600 8.5pt var(--font-body); color: #fff; background: var(--pa); border-radius: 99px; padding: .3mm 2.2mm; }
  .ps-table { width: 100%; border-collapse: collapse; font-size: 9.5pt; }
  .ps-table th { text-align: left; font-size: 7.5pt; text-transform: uppercase; letter-spacing: .1em; color: #fff; background: var(--pa); padding: 1.8mm 2.5mm; }
  .ps-table th:first-child { border-radius: 2mm 0 0 2mm; } .ps-table th:last-child { border-radius: 0 2mm 2mm 0; }
  .ps-table td { padding: 1.8mm 2.5mm; border-bottom: .5px solid #e4dfe9; vertical-align: top; }
  .ps-table tbody tr:nth-child(even) td { background: color-mix(in srgb, var(--pa) 5%, #fff); }
  .ps-table tr { break-inside: avoid; }
  .ps-table tr.is-empty td { color: #9a93a3; font-style: italic; }
  .ps-table tr.is-empty td:first-child { color: #1d1b22; font-style: normal; }
  .ps-table em { color: #6b6474; font-size: 8.5pt; }
  .ps-cols { display: grid; grid-template-columns: 1.4fr 1fr; gap: 7mm; }
  .ps-check, .ps-x { list-style: none; margin: 0; padding: 0; display: block; }
  .ps-check > li + li, .ps-x > li + li { margin-top: 1.6mm; }
  .ps-check li { display: flex; gap: 2.5mm; align-items: flex-start; break-inside: avoid; }
  .ps-box { flex: none; width: 3.6mm; height: 3.6mm; margin-top: .6mm; border: 1.2px solid var(--pa); border-radius: 1mm; }
  .ps-check em { color: #6b6474; font-style: normal; font-size: 8.5pt; }
  .ps-check ul { list-style: none; margin: 1.2mm 0 0; padding: 0; display: block; font-size: 9pt; }
  .ps-check ul li + li { margin-top: 1mm; }
  .ps-check ul li { gap: 2mm; }
  .ps-check ul .ps-box { width: 3mm; height: 3mm; }
  .ps-check ul li.is-done { color: #9a93a3; text-decoration: line-through; }
  .ps-check ul li.is-done .ps-box { background: var(--pa); }
  .ps-x li { padding-left: 5mm; position: relative; }
  .ps-x li::before { content: "✕"; position: absolute; left: 0; color: #c0392b; font-weight: 700; }
  .ps-never h2 { border-bottom-color: #e7b3ac; }
  .ps-never h2 small { background: #c0392b; }
  .ps-muted { color: #9a93a3; font-style: italic; margin: 0; }
  .ps-notes .ps-lines { display: grid; gap: 7mm; padding-top: 4mm; }
  .ps-notes .ps-lines i { display: block; border-bottom: .6px dashed #bdb5c6; }
  .ps-tiles { display: flex; flex-wrap: wrap; gap: 2.5mm; margin-bottom: 4mm; }
  .ps-tile { min-width: 26mm; padding: 2.5mm 3.5mm; border-radius: 3mm; border: 1px solid color-mix(in srgb, var(--pa) 30%, #fff); background: color-mix(in srgb, var(--pa) 5%, #fff); display: flex; flex-direction: column; }
  .ps-tile b { font: 600 15pt/1.1 var(--font-display); color: var(--pa); }
  .ps-tile span { font-size: 8.5pt; color: #4a4452; }
  .ps-tile.is-main { background: var(--pa); border-color: var(--pa); }
  .ps-tile.is-main b, .ps-tile.is-main span { color: #fff; }
  .ps-alert h2 { border-bottom-color: #f0c27a; }
  .ps-alert .ps-table th { background: #c77d14; }
  .ps-menu { text-align: center; border: 1px solid color-mix(in srgb, var(--pa) 35%, #fff); border-radius: 4mm; padding: 5mm 8mm; }
  .ps-menu h2 { justify-content: center; border: 0; font-size: 15pt; }
  .ps-menu h3 { margin: 4mm 0 1.5mm; font-size: 8pt; letter-spacing: .2em; text-transform: uppercase; color: var(--pa); }
  .ps-dish { margin: 0 0 1.5mm; }
  .ps-dish span { color: #6b6474; font-size: 9pt; }
  .ps-legend { margin: 4mm 0 0; font-size: 8pt; color: #6b6474; }
  .ps-timeline { list-style: none; margin: 0; padding: 0 0 0 2mm; display: block; }
  .ps-timeline > li + li { margin-top: 2.2mm; }
  .ps-timeline li { display: flex; gap: 4mm; align-items: flex-start; padding-left: 5mm; border-left: 1.5px solid color-mix(in srgb, var(--pa) 45%, #fff); position: relative; break-inside: avoid; }
  .ps-timeline li::before { content: ""; position: absolute; left: -1.9mm; top: 1.4mm; width: 2.6mm; height: 2.6mm; border-radius: 50%; background: var(--pa); }
  .ps-timeline b { flex: none; min-width: 13mm; font: 600 11pt var(--font-display); color: var(--pa); }
  .ps-timeline em { color: #6b6474; font-size: 9pt; }
  .ps-timeline.is-big { gap: 4.5mm; max-width: 150mm; margin: 0 auto; font-size: 11pt; }
  .ps-timeline.is-big b { font-size: 14pt; min-width: 17mm; }
  .ps-ic { flex: none; width: 6mm; height: 6mm; color: var(--pa); font-size: 12pt; line-height: 1; }
  .ps-ic .icon { width: 6mm; height: 6mm; }
  .ps-sum { margin: 3mm 0 0; font-size: 9.5pt; text-align: right; }
  .ps-foot { display: flex; justify-content: space-between; margin-top: 8mm; padding-top: 2mm; border-top: .6px solid #e4dfe9; font-size: 7.5pt; color: #9a93a3; letter-spacing: .04em; }
}

/* Dymek z opisem przełącznika (np. chipsy ankiet) */
[data-tip] { position: relative; }
[data-tip]::after { content: attr(data-tip); position: absolute; left: 0; bottom: calc(100% + 8px); z-index: 30; width: max-content; max-width: min(270px, 78vw); padding: .5rem .7rem; border-radius: 10px; background: var(--text); color: var(--surface); font: 400 .78rem/1.4 var(--font-body); text-align: left; white-space: normal; box-shadow: 0 8px 24px -10px rgba(0,0,0,.4); opacity: 0; transform: translateY(4px); pointer-events: none; transition: opacity .15s, transform .15s; }
[data-tip]:hover::after, [data-tip]:focus-visible::after { opacity: 1; transform: none; transition-delay: .25s; }
.chips > form:last-child [data-tip]::after, .chips > form:nth-last-child(2) [data-tip]::after { left: auto; right: 0; }
@media (hover: none) { [data-tip]::after { display: none; } }
.st-mini strong { white-space: nowrap; }
@media (max-width: 720px) { .st-hero { flex-direction: column; align-items: stretch; } .st-hero-deco .d2 { right: 20px; top: 20px; } }
@media print { .passkey-nudge, .toast, [data-toast] { display: none !important; } }
/* Jednorazowe animacje danych (pierścienie, paski, listy) także przy systemowym „ogranicz ruch” –
   właściciel ma wyłączone efekty w Windows, a o te animacje prosił; zapętlone ozdobniki zostają tylko bez ograniczenia. */
@media (prefers-reduced-motion: reduce) {
  .wc-prog, .st-ring .r-prog { animation: ring-in 1.2s cubic-bezier(.3,.7,.2,1) .2s both; }
  .st-donut .seg { animation: st-ring-in 1.1s cubic-bezier(.3,.7,.2,1) .2s both; }
  .stat-bar b, .st-meter b { transform-origin: left; animation: grow-x .9s cubic-bezier(.2,.7,.2,1) .3s both; }
  .st-bars li { animation: st-in .45s ease-out both; animation-delay: calc(var(--i, 0) * 60ms); }
  .st-hours i, .st-days i { transform-origin: bottom; animation: st-up .7s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(var(--i, 0) * 25ms + 150ms); }
  .dash-task-list li { animation: fade-up .45s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(var(--i, 0) * 80ms + 200ms); }
  .bw-badge { animation: pop-in .5s cubic-bezier(.2,.7,.2,1) .6s both; }
  .st-card, .dash-stats .stat { transition: transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s; }
  .st-card:hover, .dash-stats a.stat:hover { transform: translateY(-2px); }
}
.sp-archtop { width: 24px; height: 30px; border-radius: 12px 12px 2px 2px; }
.sp-scallop { width: 30px; height: 26px; background: radial-gradient(circle at 50% 50%, var(--accent) 3.4px, transparent 3.6px) -3px -3px / 6px 6px, linear-gradient(var(--accent), var(--accent)) 3px 3px / 24px 20px no-repeat; background-color: transparent; }

/* Kreator QR: kategorie emotikon */
/* kategorie zawijane i przyklejone u góry panelu; emotikony przewija sam panel (bez drugiego, wewnętrznego paska) */
.qde-emo-cats { position: sticky; top: -1px; z-index: 2; display: flex; flex-wrap: wrap; gap: .3rem; margin: .3rem -.2rem 0; padding: .45rem .2rem; background: var(--surface); border-bottom: 1px solid var(--line); }
.qde-emo-cats .chip { flex: none; padding: .24rem .6rem; font-size: .75rem; }
.qde-emoji[hidden] { display: none; }
.qde-emoji { content-visibility: auto; contain-intrinsic-size: auto 300px; }
.qde-emoji button { aspect-ratio: 1; line-height: 1; touch-action: manipulation; }

/* ---------- Szaty panelu 2026 ---------- */
.panel-japandi {
  --bg: #f5f1ea; --surface: #fbf8f3; --surface-2: #ece5da;
  --text: #2b2724; --muted: #8a8075; --line: #e2d9cc; --gold-line: #d3c6b3;
  --accent: #8a7a66; --accent-strong: #5e5244; --accent-soft: #ece3d6;
  --orn: #8a7a66; --orn-o: 0; --btn-a: #4a4038; --btn-b: #2b2724; --btn-edge: #2b2724;
  --hover: #efe8dd; --nav-text: #2b2724; --nav-icon: #a89c8d; --input-bg: #fbf8f3; --input-line: #ddd2c2;
  --font-display: "Josefin Sans", "Inter", sans-serif; --radius: 6px;
}
.panel-japandi .welcome { background: radial-gradient(circle at 88% 50%, transparent 0 46px, rgba(43,39,36,.7) 48px 53px, transparent 55px), linear-gradient(160deg, #ece5da, #f5f1ea) !important; }
.panel-bauhaus {
  --bg: #f7f3ea; --surface: #ffffff; --surface-2: #efe9dc;
  --text: #1b1b1b; --muted: #5f5f5f; --line: #1b1b1b; --gold-line: #1b1b1b;
  --accent: #e63946; --accent-strong: #b5202c; --accent-soft: #fbe0e2;
  --orn: #1d3fa8; --orn-o: 0; --btn-a: #e63946; --btn-b: #c4252f; --btn-edge: #1b1b1b;
  --hover: #f1ebde; --nav-text: #1b1b1b; --nav-icon: #1d3fa8; --input-bg: #ffffff; --input-line: #1b1b1b;
  --font-display: "Montserrat", "Inter", sans-serif; --radius: 0px;
}
.panel-bauhaus .card, .panel-bauhaus .stat, .panel-bauhaus .kpi { border: 2px solid #1b1b1b !important; box-shadow: 5px 5px 0 #e63946 !important; border-radius: 0 !important; }
.panel-bauhaus .stat:nth-child(3n+2), .panel-bauhaus .kpi:nth-child(3n+2) { box-shadow: 5px 5px 0 #1d3fa8 !important; }
.panel-bauhaus .stat:nth-child(3n), .panel-bauhaus .kpi:nth-child(3n) { box-shadow: 5px 5px 0 #f2b705 !important; }
.panel-bauhaus .welcome { background: radial-gradient(circle at 92% 30%, #e63946 0 40px, transparent 41px), linear-gradient(#1d3fa8, #1d3fa8) 84% 100% / 46px 46px no-repeat, #fff !important; }
.panel-tablica {
  color-scheme: dark;
  --bg: #2b3832; --surface: #33433b; --surface-2: #3a4b42;
  --text: #f5f1e6; --muted: #c3cbbf; --line: #4b5c53; --gold-line: #7a5232;
  --accent: #f6d38a; --accent-strong: #ffe3a8; --accent-soft: #3d4a3b; --on-accent: #2b3832;
  --orn: #f6d38a; --orn-o: .4; --btn-a: #f6d38a; --btn-b: #e2b864; --btn-edge: #e2b864; --btn-text: #2b3832;
  --side-bg: rgba(43, 56, 50, .96); --bar-bg: rgba(43, 56, 50, .92);
  --hover: rgba(246, 211, 138, .08); --nav-text: #eae5d7; --nav-icon: #a4b0a6; --input-bg: #26322c; --input-line: #51625a;
  --ok: #a8dca0; --ok-soft: #2f4a36; --warn: #f0c870; --warn-soft: #4a4430; --danger: #f2a39a; --danger-soft: #4a3030;
  --shadow: none; --font-display: "Amatic SC", "Cormorant Garamond", serif;
}
.panel-tablica .card, .panel-tablica .stat, .panel-tablica .kpi { border: 2px dashed rgba(245,241,230,.28) !important; }
.panel-tablica h1, .panel-tablica .card h2 { font-weight: 700; letter-spacing: .03em; }
.panel-mrok {
  color-scheme: dark;
  --bg: #1a0d12; --surface: #24131a; --surface-2: #2e1820;
  --text: #f3e6dd; --muted: #c3a99e; --line: #43242e; --gold-line: #6b4a2a;
  --accent: #d9b26f; --accent-strong: #ecc98a; --accent-soft: #3a2620; --on-accent: #1a0d12;
  --orn: #b0304e; --orn-o: .5; --btn-a: #e2bf7e; --btn-b: #c79a52; --btn-edge: #c79a52; --btn-text: #1a0d12;
  --side-bg: rgba(26, 13, 18, .96); --bar-bg: rgba(26, 13, 18, .92);
  --hover: rgba(217, 178, 111, .07); --nav-text: #ecdcd2; --nav-icon: #9a7a72; --input-bg: #160a0f; --input-line: #4a2a34;
  --ok: #a8dca0; --ok-soft: #2a3324; --warn: #f0c870; --warn-soft: #3d3320; --danger: #f2a39a; --danger-soft: #3d2222;
  --shadow: none; --font-display: "Playfair Display", Georgia, serif;
}
.panel-mrok .welcome { background: radial-gradient(circle at 100% 0, #8e1b35 0 40px, #5a0d1e 41px 70px, transparent 71px), linear-gradient(160deg, #2e1820, #1a0d12) !important; }
.panel-opal {
  --bg: #fbf9fd; --surface: #ffffff; --surface-2: #f3eef9;
  --text: #3b3448; --muted: #7f7690; --line: #e7dff2; --gold-line: #d9cdea;
  --accent: #a78bcb; --accent-strong: #7d61a6; --accent-soft: #efe7f8;
  --orn: #a78bcb; --orn-o: .35; --btn-a: #b79ad8; --btn-b: #8f73bb; --btn-edge: #8a6db5;
  --hover: #f4eefb; --nav-text: #3b3448; --nav-icon: #b5a8c8; --input-bg: #ffffff; --input-line: #ddd2ec;
  --font-display: "Cormorant Garamond", Georgia, serif; --radius: 22px;
}
.panel-opal .welcome { background: linear-gradient(135deg, #fdf7ff, #e6f1ff 35%, #ffeef4 65%, #eafff4) !important; }
.panel-witraz {
  --bg: #fbf8f1; --surface: #ffffff; --surface-2: #f1ece0;
  --text: #1f2033; --muted: #5d5f73; --line: #d8d3c4; --gold-line: #1f2033;
  --accent: #2b4fa8; --accent-strong: #1d3a85; --accent-soft: #e3e9f7;
  --orn: #c62828; --orn-o: .4; --btn-a: #3a60bd; --btn-b: #2b4fa8; --btn-edge: #1f2033;
  --hover: #f1ede2; --nav-text: #1f2033; --nav-icon: #8f92a8; --input-bg: #ffffff; --input-line: #cfc9b8;
  --font-display: "Playfair Display", Georgia, serif;
}
.panel-witraz .card, .panel-witraz .stat, .panel-witraz .kpi { border: 2px solid #1f2033 !important; }
.panel-witraz .welcome { background: repeating-conic-gradient(from -90deg at 100% 100%, #c62828 0 12deg, #1f2033 12deg 13deg, #2b4fa8 13deg 25deg, #1f2033 25deg 26deg, #f2a900 26deg 38deg, #1f2033 38deg 39deg, #1f6f4a 39deg 51deg, #1f2033 51deg 52deg) right / 34% 100% no-repeat, #fff !important; }
.panel-riso {
  --bg: #f6f1e7; --surface: #fffcf5; --surface-2: #efe7d8;
  --text: #0b5f97; --muted: #4f86ad; --line: #cfdbe6; --gold-line: #ff48b0;
  --accent: #ff48b0; --accent-strong: #d81b86; --accent-soft: #ffe0f1;
  --orn: #0b5f97; --orn-o: 0; --btn-a: #ff48b0; --btn-b: #e0208f; --btn-edge: #0b5f97;
  --hover: #f0e8da; --nav-text: #0b5f97; --nav-icon: #7fa6c4; --input-bg: #fffcf5; --input-line: #b9cde0;
  --font-display: "Montserrat", "Inter", sans-serif; --radius: 0px;
}
.panel-riso .card, .panel-riso .stat, .panel-riso .kpi { border: 2px solid #0b5f97 !important; box-shadow: 5px 5px 0 #ff48b0 !important; border-radius: 0 !important; }
.panel-riso .welcome { background: radial-gradient(circle at 92% 10%, rgba(255,72,176,.8) 0 54px, transparent 55px), #fffcf5 !important; }
.panel-kino {
  color-scheme: dark;
  --bg: #111111; --surface: #1b1b1b; --surface-2: #232323;
  --text: #f4f4f4; --muted: #b5b5b5; --line: #2f2f2f; --gold-line: #5a4d14;
  --accent: #f5c518; --accent-strong: #ffd84a; --accent-soft: #2e2a14; --on-accent: #111111;
  --orn: #f5c518; --orn-o: 0; --btn-a: #ffd84a; --btn-b: #f5c518; --btn-edge: #d9ab00; --btn-text: #111111;
  --side-bg: rgba(17, 17, 17, .96); --bar-bg: rgba(17, 17, 17, .92);
  --hover: rgba(245, 197, 24, .07); --nav-text: #e6e6e6; --nav-icon: #8a8a8a; --input-bg: #0c0c0c; --input-line: #3a3a3a;
  --ok: #a8dca0; --ok-soft: #22331f; --warn: #f0c870; --warn-soft: #3a3320; --danger: #f2a39a; --danger-soft: #3d2222;
  --shadow: none; --font-display: "Montserrat", "Inter", sans-serif;
}
.panel-kino .welcome { background: repeating-linear-gradient(180deg, transparent 0 7px, rgba(255,255,255,.8) 7px 15px, transparent 15px 22px) 6px 0 / 10px 100% no-repeat, linear-gradient(90deg, #000 0 22px, #1b1b1b 22px) !important; padding-left: 2.4rem; }
.panel-typo {
  --bg: #f4f0e8; --surface: #f8f5ef; --surface-2: #ece6da;
  --text: #2f2a24; --muted: #7a6f62; --line: #ddd4c5; --gold-line: #cbbd9f;
  --accent: #9a7b4f; --accent-strong: #7a5f38; --accent-soft: #ece2d2;
  --orn: #9a7b4f; --orn-o: .35; --btn-a: #a8895b; --btn-b: #86683c; --btn-edge: #7a5f38;
  --hover: #eee8dc; --nav-text: #2f2a24; --nav-icon: #b0a38e; --input-bg: #faf8f3; --input-line: #d9cfbd;
  --font-display: "Cormorant Garamond", Georgia, serif; --radius: 6px;
}
.panel-typo .card, .panel-typo .stat, .panel-typo .kpi { border-color: transparent !important; box-shadow: inset 1px 1px 3px rgba(0,0,0,.08), inset -1px -1px 1px rgba(255,255,255,.9) !important; }
.panel-typo h1 { text-shadow: 0 1px 0 rgba(255,255,255,.85), 0 -1px 0 rgba(0,0,0,.15); }
.panel-zielnik {
  --bg: #fbf7ef; --surface: #fffdf8; --surface-2: #f2ebdd;
  --text: #3d3328; --muted: #7f705f; --line: #e6dccb; --gold-line: #dcc9a8;
  --accent: #b5677b; --accent-strong: #8f4a5c; --accent-soft: #f3e1e5;
  --orn: #7d8a5a; --orn-o: .5; --btn-a: #c87b8f; --btn-b: #a85a6e; --btn-edge: #9a5064;
  --hover: #f5eee2; --nav-text: #3d3328; --nav-icon: #b4a48c; --input-bg: #fffdf8; --input-line: #e0d3bd;
  --font-display: "Dancing Script", cursive;
}
.panel-zielnik .welcome { background: radial-gradient(circle at 92% 24%, #d98fa3 0 7px, transparent 8px), radial-gradient(circle at 95% 18%, #e8b84d 0 3px, transparent 4px), radial-gradient(circle at 86% 70%, #a8b7d8 0 6px, transparent 7px), radial-gradient(ellipse 4px 10px at 90% 46%, #9aa86f 98%, transparent), linear-gradient(160deg, #f3ead9, #fbf7ef) !important; }

/* Lista gości na telefonie: karty zamiast szerokiej tabeli (bez przewijania na boki) */
@media (max-width: 760px) {
  .guest-table, .guest-table tbody { display: block; width: 100%; }
  .guest-table thead { display: none; }
  .table-wrap:has(> .guest-table) { overflow: visible; }
  .guest-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name name" "group table" "contact contact" "inv rsvp" "act act"; gap: .45rem .75rem; align-items: center; padding: .85rem .95rem; margin: 0 0 .65rem; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
  .guest-table tr[hidden] { display: none; }
  .guest-table td { display: block; padding: 0; border: 0; min-width: 0; background: none !important; }
  .guest-table td:empty { display: none; }
  .guest-table .g-name { grid-area: name; line-height: 1.45; overflow-wrap: anywhere; }
  .guest-table .g-name strong { font-size: 1.05rem; }
  .guest-table .g-group, .guest-table .g-table { font-size: .86rem; color: var(--muted); }
  .guest-table .g-group { grid-area: group; } .guest-table .g-table { grid-area: table; text-align: right; }
  .guest-table td[data-label]::before { content: attr(data-label) ": "; color: var(--muted); }
  .guest-table .g-group { color: var(--text); }
  .guest-table .g-contact { grid-area: contact; overflow-wrap: anywhere; color: var(--muted); }
  .guest-table .inv-status { grid-area: inv; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; }
  .guest-table .g-rsvp { grid-area: rsvp; text-align: right; }
  .guest-table .g-rsvp br { display: none; }
  .guest-table .g-rsvp .muted { display: block; }
  .guest-table .actions { grid-area: act; display: flex; justify-content: flex-end; gap: .5rem; padding-top: .55rem; border-top: 1px dashed var(--line); }
}
/* Oś czasu konta (Pakiet, edycja ślubu w adminie) */
.acct-tl { list-style: none; margin: .4rem 0 0; padding: 0; position: relative; }
.acct-tl::before { content: ""; position: absolute; left: 17px; top: 10px; bottom: 10px; width: 2px; background: linear-gradient(var(--accent-soft), var(--line)); border-radius: 2px; }
.acct-tl-item { position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: .8rem; padding: 0 0 1.05rem; }
.acct-tl-dot { position: relative; z-index: 1; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--surface); border: 2px solid var(--accent); color: var(--accent-strong); }
.acct-tl-dot .icon { width: 17px; height: 17px; }
.acct-tl-body { min-width: 0; padding-top: .1rem; }
.acct-tl-date { margin: 0; font-size: .8rem; color: var(--muted); display: flex; flex-wrap: wrap; gap: .2rem .55rem; align-items: baseline; }
.acct-tl-rel { font-weight: 600; color: var(--accent-strong); }
.acct-tl-title { margin: .1rem 0 0; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.acct-tl-text { margin: .2rem 0 0; font-size: .88rem; color: var(--muted); line-height: 1.45; }
.acct-tl-item.tone-key .acct-tl-dot { background: var(--accent); color: var(--on-accent); }
.acct-tl-item.tone-warn .acct-tl-dot { border-color: var(--warn); color: var(--warn); background: var(--warn-soft); }
.acct-tl-item.tone-warn .acct-tl-rel { color: var(--warn); }
.acct-tl-item.tone-danger .acct-tl-dot { border-color: var(--danger); color: var(--danger); background: var(--danger-soft); }
.acct-tl-item.tone-danger .acct-tl-rel { color: var(--danger); }
.acct-tl-item.tone-notice .acct-tl-dot { width: 26px; height: 26px; margin: 5px; border-width: 1.5px; border-style: dashed; color: var(--muted); border-color: var(--muted); }
.acct-tl-item.tone-notice .acct-tl-dot .icon { width: 13px; height: 13px; }
.acct-tl-item.tone-notice .acct-tl-title { font-weight: 500; font-size: .92rem; }
.acct-tl-item.is-past .acct-tl-dot { background: var(--ok-soft); border-color: var(--ok); color: var(--ok); }
.acct-tl-item.is-past.tone-notice .acct-tl-dot { border-style: solid; }
.acct-tl-item.is-past .acct-tl-rel { color: var(--muted); font-weight: 500; }
.acct-tl-item.is-past .acct-tl-title { color: color-mix(in srgb, var(--text) 78%, var(--muted)); }
.acct-tl-now { position: relative; margin: -.2rem 0 1rem; padding-left: 0; }
.acct-tl-now::after { content: ""; position: absolute; left: 44px; right: 0; top: 50%; border-top: 2px dashed var(--accent); opacity: .45; }
.acct-tl-now-label { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .75rem .3rem .45rem; border-radius: 999px; background: var(--accent); color: var(--on-accent); font-size: .8rem; font-weight: 600; box-shadow: 0 0 0 4px var(--surface); }
.acct-tl-now-label .icon { width: 15px; height: 15px; }
.acct-tl-now + .acct-tl-item .acct-tl-dot { box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent); }
.billing-grid > div > .card + .card { margin-top: 1rem; }

/* Kod promocyjny */
.promo-form { display: flex; gap: .5rem; flex-wrap: wrap; }
.promo-form input { flex: 1 1 12rem; min-width: 0; text-transform: uppercase; letter-spacing: .08em; font-weight: 600; }
.promo-code { font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; letter-spacing: .06em; }

/* Przypomnienia (admin) */
.notice-rule-head { display: flex; justify-content: space-between; align-items: center; gap: .75rem; flex-wrap: wrap; }
.notice-rule-head h2 { margin: 0; }
.notice-rule.is-off { opacity: .7; }
.notice-rule.is-new { border-style: dashed; }
.notice-channels { display: flex; flex-wrap: wrap; gap: .3rem 1rem; align-items: center; }
.notice-channels .prop-label { width: 100%; }
.notice-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.notice-remove { margin-left: auto; color: var(--danger); }
.notices-help summary { cursor: pointer; font-size: .9rem; color: var(--accent-strong); }
.notices-form > .card + .card, .notices-form > .card { margin-bottom: 1rem; }
.sticky-save { position: sticky; bottom: calc(env(safe-area-inset-bottom) + 12px); z-index: 5; display: flex; justify-content: flex-end; margin: 0 0 1.2rem; pointer-events: none; }
.sticky-save .btn { pointer-events: auto; box-shadow: 0 8px 24px -10px rgba(0, 0, 0, .35); }

/* Szyfrowanie zdjęć gości */
.enc-notice { margin: 0 0 1rem; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.enc-notice .enc-mini[open], .enc-notice [data-enc-wrap] { flex-basis: 100%; }
.enc-mini summary { display: inline-flex; gap: .35rem; align-items: center; padding: .25rem .7rem; border-radius: 999px; background: color-mix(in srgb, var(--ok-soft) 70%, var(--surface)); color: var(--muted); font-size: .8rem; cursor: pointer; list-style: none; }
.enc-mini summary::-webkit-details-marker { display: none; }
.enc-mini summary .icon { width: 13px; height: 13px; color: var(--ok); }
.enc-mini-more { text-decoration: underline; text-underline-offset: 2px; opacity: .8; }
.enc-mini[open] .enc-mini-more { display: none; }
.enc-mini p { margin: .4rem 0 0; color: var(--muted); font-size: .82rem; line-height: 1.45; }
.enc-unlock { display: flex; flex-wrap: wrap; gap: .5rem; align-items: flex-end; margin-top: .6rem; padding: .8rem .9rem; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.enc-unlock label { flex: 1 1 14rem; margin: 0; }
.enc-unlock [data-enc-msg] { width: 100%; margin: 0; }
.enc-ok { display: flex; gap: .4rem; align-items: center; margin: .6rem 0 0; color: var(--ok); }
.enc-ok .icon { width: 16px; height: 16px; flex: 0 0 auto; }
.enc-card.is-on { border-color: color-mix(in srgb, var(--ok) 35%, var(--line)); }
.enc-card .badge .icon { width: 13px; height: 13px; vertical-align: -2px; }
.enc-how { margin: .4rem 0 .8rem; padding-left: 1.1rem; color: var(--muted); }
.enc-how li + li { margin-top: .25rem; }
.enc-warn { display: flex; gap: .55rem; align-items: flex-start; padding: .7rem .85rem; border-radius: 12px; background: var(--warn-soft); color: var(--text); font-size: .9rem; line-height: 1.45; }
.enc-warn > .icon { flex: 0 0 auto; width: 18px; height: 18px; color: var(--warn); margin-top: .1rem; }
.enc-pw-out { margin: .6rem 0 0; padding: .6rem .8rem; border-radius: 10px; background: var(--accent-soft); font-family: ui-monospace, Consolas, monospace; font-size: 1.05rem; letter-spacing: .04em; overflow-wrap: anywhere; user-select: all; }
.enc-zip-status { margin: -.4rem 0 .8rem; font-weight: 600; color: var(--accent-strong); }
.media-thumb.is-enc { position: relative; display: grid; place-items: center; min-height: 120px; background: var(--accent-soft); }
.media-thumb.is-enc img { width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .35s ease; }
.media-thumb.is-enc.enc-ready img { opacity: 1; }
.media-thumb.is-enc img:not([src]) { position: absolute; inset: 0; }
.enc-badge { position: absolute; top: 6px; left: 6px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: rgba(0, 0, 0, .45); color: #fff; }
.enc-badge .icon { width: 13px; height: 13px; }
.media-thumb.enc-locked::after { content: "Wpisz hasło, aby zobaczyć"; position: absolute; inset: auto 6px 6px; padding: .2rem .4rem; border-radius: 8px; background: rgba(0, 0, 0, .5); color: #fff; font-size: .7rem; text-align: center; }
.media-thumb.is-file.is-enc { gap: .25rem; }
.media-thumb.is-busy::after { content: attr(data-progress); position: absolute; inset: auto 6px 6px; color: #fff; font-size: .75rem; background: rgba(0, 0, 0, .5); border-radius: 8px; padding: .1rem .35rem; }
.lb-wait { color: #fff; font-size: 1rem; text-align: center; margin: auto; }
.lb-vid-err { margin: auto; max-width: min(420px, calc(100vw - 32px)); padding: 1.4rem 1.3rem; border-radius: 18px; background: rgba(255, 255, 255, .96); color: #222; text-align: center; display: grid; gap: .6rem; justify-items: center; }
.lb-vid-err p { margin: 0; }
.lb-vid-err-t { font-weight: 700; font-size: 1.02rem; }
.lb-vid-err-s { font-size: .9rem; color: #555; }
.lb-vid-err .info-tip { color: #666; vertical-align: -5px; }
.lb-dl { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); padding: .45rem 1rem; border-radius: 999px; background: rgba(255, 255, 255, .9); color: #222; font-weight: 600; font-size: .85rem; text-decoration: none; }
.enc-card .row { display: flex; flex-wrap: wrap; gap: .5rem; }
.enc-card .row .btn { white-space: normal; text-align: left; }
.enc-know { margin: .8rem 0; border: 1px solid var(--line); border-radius: 12px; padding: .55rem .8rem; background: var(--surface); }
.enc-know summary { cursor: pointer; font-weight: 600; font-size: .92rem; display: flex; align-items: center; gap: .4rem; }
.enc-know summary .icon { width: 16px; height: 16px; color: var(--accent-strong); }
.enc-know ul { margin: .6rem 0 .2rem; padding-left: 1.1rem; line-height: 1.5; }
.enc-know li + li { margin-top: .35rem; }

/* Wiadomość do komunikatorów */
.chat-preview { display: flex; }
.chat-bubble { max-width: 92%; padding: .65rem .8rem .7rem; border-radius: 12px 12px 12px 4px; background: #dcf8c6; color: #1f2c21; font: .92rem/1.45 system-ui, sans-serif; white-space: pre-wrap; overflow-wrap: anywhere; box-shadow: 0 1px 1px rgba(0, 0, 0, .08); }
.send-table .actions { display: flex; flex-wrap: wrap; gap: .35rem; justify-content: flex-end; }
/* Wysyłka na telefonie: karty zamiast szerokiej tabeli */
@media (max-width: 760px) {
  .send-table, .send-table tbody { display: block; width: 100%; }
  .send-table thead { display: none; }
  .table-wrap:has(> .send-table) { overflow: visible; }
  .send-table tr { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .3rem .7rem; align-items: center; padding: .8rem .9rem; margin: 0 0 .65rem; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
  .send-table td { display: block; padding: 0; border: 0; min-width: 0; background: none !important; }
  .send-table .s-check { grid-row: 1; }
  .send-table .s-name { grid-row: 1; overflow-wrap: anywhere; }
  .send-table .s-email, .send-table .s-phone, .send-table .s-inv { grid-column: 1 / -1; overflow-wrap: anywhere; }
  .send-table td[data-label]::before { content: attr(data-label) ": "; color: var(--muted); }
  .send-table .actions { grid-column: 1 / -1; justify-content: flex-start; padding-top: .5rem; margin-top: .2rem; border-top: 1px dashed var(--line); }
  .send-table .actions .btn { flex: 1 1 auto; justify-content: center; }
}

/* ===== Runda 49: porządek wizualny panelu ===== */

/* Kotwice (#lokalizacja, #szyfrowanie) nie chowają się pod paskiem na górze */
.panel-main [id] { scroll-margin-top: 84px; }

/* Wiersze ustawień: ikona – opis – przełącznik (zamiast małych przycisków pod tekstem) */
.set-rows { padding-top: .35rem; padding-bottom: .35rem; }
.set-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .9rem; padding: .95rem 0; margin: 0; }
.set-row { border-top: 1px solid var(--line); }
.set-rows > .set-row:first-child, .set-group + .set-row { border-top: 0; }
.set-group { margin: 0; padding: 1.3rem 0 .15rem; border-top: 1px solid var(--line); font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-family: var(--font-body); }
.set-group:first-child { padding-top: .6rem; border-top: 0; }
.set-row-txt strong .info-tip { margin: -3px 0 -3px .15rem; vertical-align: -5px; }
.set-on { color: var(--ok); font-weight: 600; }
.set-row-ic.is-ok { background: var(--ok-soft); color: var(--ok); }
.set-row-ic.is-warn { background: var(--warn-soft); color: var(--warn); }
.set-badge { display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .7rem; font-size: .78rem; }
.set-badge .icon { width: 13px; height: 13px; }
.set-acts { display: flex; gap: .4rem; }
.set-extra { margin: -.2rem 0 1rem calc(42px + .9rem); }
.set-extra .enc-warn { margin: 0 0 .7rem; }
.set-extra .form { display: grid; gap: .75rem; }
.set-extra.enc-unlock { margin-top: -.2rem; }
/* Dymek „i”: przycisk info_tip(), dymek .info-pop rysuje app.js */
.info-tip { display: inline-grid; place-items: center; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--muted); cursor: pointer; vertical-align: middle; }
.info-tip .icon { width: 16px; height: 16px; }
.info-tip:hover, .info-tip.is-open { color: var(--accent-strong); background: var(--accent-soft); }
.info-tip:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.info-pop { position: fixed; z-index: 1000; max-width: min(320px, calc(100vw - 24px)); padding: .65rem .8rem; border-radius: 12px; background: var(--text); color: var(--surface); font: 400 .8rem/1.45 var(--font-body); box-shadow: 0 10px 30px -12px rgba(0, 0, 0, .45); opacity: 0; transform: translateY(4px); transition: opacity .15s, transform .15s; pointer-events: none; }
.info-pop.is-on { opacity: 1; transform: none; pointer-events: auto; }
.info-pop p { margin: 0; }
.info-pop p + p { margin-top: .45rem; }
.set-row-ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--accent-soft); color: var(--accent-strong); }
.set-row-ic .icon { width: 20px; height: 20px; }
.set-row-txt { display: grid; gap: .2rem; min-width: 0; }
.set-row-txt strong { font-size: .98rem; line-height: 1.3; }
.set-row-txt .small { line-height: 1.45; }
.set-switch { position: relative; flex: none; width: 58px; height: 32px; padding: 0; border: 0; border-radius: 999px; background: color-mix(in srgb, var(--muted) 30%, var(--surface)); cursor: pointer; transition: background .2s; }
.set-switch::before { content: ""; position: absolute; top: 3px; left: 3px; width: 26px; height: 26px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: transform .25s cubic-bezier(.2, .7, .2, 1); }
.set-switch.is-on { background: var(--accent); }
.set-switch.is-on::before { transform: translateX(26px); }
.set-switch:focus-visible { outline: 0; box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 30%, transparent); }
.set-switch-txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
@media (max-width: 640px) {
  .set-row { grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: .75rem; }
  .set-row-ic { width: 38px; height: 38px; }
  .set-switch { margin-top: .2rem; }
  .set-extra { margin-left: 0; }
  .set-acts .btn span { display: none; }
}

/* Brakujące pole: czerwona ramka i drgnięcie przy próbie wysłania */
label.check.is-invalid, .check.is-invalid, .switch-row.is-invalid { margin: .2rem 0; padding: .65rem .8rem !important; border-radius: 14px; background: var(--danger-soft); box-shadow: inset 0 0 0 2px var(--danger); color: var(--danger); animation: ui-shake .45s; }
label.check.is-invalid > input[type="checkbox"]:not(:checked) { box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent); background: color-mix(in srgb, var(--danger) 35%, var(--surface)); }
input.is-invalid, select.is-invalid, textarea.is-invalid { border-color: var(--danger) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 20%, transparent) !important; animation: ui-shake .45s; }
@keyframes ui-shake { 20%, 60% { transform: translateX(-5px); } 40%, 80% { transform: translateX(5px); } }
@media (prefers-reduced-motion: reduce) { .is-invalid { animation: none !important; } }
.form-msg { margin: .2rem 0 0; font-size: .9rem; color: var(--muted); }
.form-msg:empty { display: none; }
.form-msg.is-error { padding: .6rem .8rem; border-radius: 12px; background: var(--danger-soft); color: var(--danger); font-weight: 500; }

/* Formularz szyfrowania: równe, wygodne przyciski */
.enc-card .enc-gen { justify-self: start; }
.enc-card .enc-consent { display: flex; align-items: center; gap: .8rem; padding: .7rem .8rem; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2, var(--surface)); }
.enc-card .enc-consent > span { flex: 1; font-size: .92rem; }
.enc-card .enc-submit { justify-self: start; min-width: 240px; }
@media (max-width: 640px) {
  .enc-card .enc-gen, .enc-card .enc-submit { width: 100%; justify-content: center; }
}

/* Małe przyciski i filtry: na telefonie wygodne do kliknięcia palcem */
.btn-tiny { min-height: 30px; }
@media (max-width: 760px), (pointer: coarse) {
  .btn-tiny { min-height: 36px; padding: .3rem .7rem; font-size: .8rem; border-radius: 10px; }
  .btn-small { min-height: 40px; padding: .4rem .9rem; }
  .chip { min-height: 36px; padding: .4rem .9rem; }
  .cm-btn { min-height: 36px; min-width: 36px; justify-content: center; }
  .task-tick { width: 32px; height: 32px; }
  .subtask .task-tick { width: 28px; height: 28px; }
  .gb-react { min-height: 36px; }
  .icon-btn { width: 42px; height: 42px; }
}

/* Galeria pary: podpis zdjęcia w dwóch wierszach, równe przyciski z ikonami */
.gallery-item figcaption { display: grid; gap: .45rem; padding: .55rem .6rem .6rem; }
.gi-who { display: grid; min-width: 0; line-height: 1.25; }
.gi-who strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .88rem; font-weight: 600; }
.gi-who span { font-size: .75rem; color: var(--muted); }
.gi-acts { display: flex; align-items: center; gap: .35rem; }
.gi-acts form.inline { display: flex; gap: .35rem; margin-left: auto; }
.gi-acts .cm-btn { min-height: 34px; min-width: 34px; padding: 0 .45rem; border: 1px solid var(--line); border-radius: 10px; }
.btn.btn-ic { width: 34px; min-height: 34px; padding: 0; justify-content: center; }
.btn.btn-ic .icon { width: 16px; height: 16px; }
@media (max-width: 760px), (pointer: coarse) { .btn.btn-ic, .gi-acts .cm-btn { width: 38px; min-width: 38px; min-height: 38px; } }

/* Ozdoby szaty tylko na całej stronie: w miniaturkach szat (pt-preview itp.) iskierki zostają w ramce,
   inaczej każda miniaturka dokładała własną warstwę na cały ekran i tło robiło się „hałaśliwe” */
.ui-glamour:not(body)::before { position: absolute; opacity: calc(var(--orn-o) * .5); }

/* ===== Galeria pary: nowy układ górnej części (runda 50) ===== */
.gal-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin: 0 0 1rem; }
.gal-kpi { display: flex; align-items: center; gap: .8rem; padding: .95rem 1rem; border-radius: var(--radius, 16px); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.04)); min-width: 0; }
.gal-kpi-ic { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 13px; background: var(--accent-soft); color: var(--accent-strong); }
.gal-kpi-ic .icon { width: 21px; height: 21px; }
.gal-kpi-txt { display: grid; gap: .1rem; min-width: 0; flex: 1; }
.gal-kpi-txt strong { font-size: 1.12rem; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gal-kpi-txt > span { font-size: .8rem; color: var(--muted); }
.gal-bar { display: block; height: 5px; margin-top: .35rem; border-radius: 99px; background: var(--surface-2, color-mix(in srgb, var(--muted) 15%, transparent)); overflow: hidden; }
.gal-bar b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #fff)); }
.gal-note { display: flex; align-items: center; gap: .4rem; margin: -.4rem 0 1rem; }

.gal-sec-head, .enc-card > h2 { display: flex; align-items: flex-start; gap: .9rem; margin: 0 0 1.2rem; }
.gal-sec-head h2 { margin: .1rem 0 .25rem; font-size: 1.25rem; }
.gal-sec-head p { margin: 0; max-width: 46em; }
.gal-sec-ic { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border-radius: 14px; background: var(--accent-soft); color: var(--accent-strong); }
.gal-sec-ic .icon { width: 22px; height: 22px; }
.enc-card > h2 { align-items: center; font-size: 1.25rem; }
.enc-card > h2 > .icon { box-sizing: content-box; width: 22px; height: 22px; padding: 12px; border-radius: 14px; background: var(--accent-soft); color: var(--accent-strong); }

.gal-share-grid { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 1.6rem; align-items: start; }
.gal-qr { display: grid; gap: .8rem; justify-items: stretch; }
.gal-qr-frame { display: grid; place-items: center; aspect-ratio: 1; padding: 14px; border-radius: 20px; background: #fff; border: 1px solid var(--line); box-shadow: 0 10px 30px -18px rgba(30, 20, 60, .35); }
.gal-qr-frame .qr, .gal-qr-frame .qr canvas, .gal-qr-frame .qr img, .gal-qr-frame .qr svg { display: block; width: 100% !important; height: auto !important; max-width: 100%; image-rendering: pixelated; }
.gal-qr-pw { font-size: .85rem; }
.gal-share-main { display: grid; gap: .7rem; min-width: 0; }
.gal-label { display: flex; align-items: center; gap: .4rem; font-weight: 600; font-size: .9rem; margin: 0; }
.gal-label .icon { color: var(--accent); }
.gal-label .muted { font-weight: 400; }
.gal-url { display: flex; align-items: center; gap: .5rem; padding: .35rem .35rem .35rem .9rem; border-radius: 14px; background: var(--surface-2, var(--accent-soft)); border: 1px solid var(--line); min-width: 0; }
.gal-url-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 500 .9rem ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--text); }
.btn.gal-btn { min-height: 44px; padding: .5rem 1.05rem; font-size: .92rem; border-radius: 12px; gap: .45rem; }
.gal-acts { display: flex; flex-wrap: wrap; gap: .6rem; }
.gal-pw { display: grid; gap: .5rem; margin-top: .6rem; padding-top: 1.1rem; border-top: 1px solid var(--line); }
.gal-pw p { margin: 0; }
.gal-input-group { display: flex; gap: .5rem; }
.gal-input-group input { flex: 1; min-width: 0; min-height: 44px; margin: 0; }
.gal-danger { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .5rem; padding: .85rem 1rem; border-radius: 14px; border: 1px dashed color-mix(in srgb, var(--danger) 35%, var(--line)); background: color-mix(in srgb, var(--danger-soft) 45%, transparent); }
.gal-danger > span { display: grid; gap: .1rem; }
.gal-danger strong { font-size: .92rem; }

@media (max-width: 760px) {
  .gal-kpis { grid-template-columns: 1fr 1fr; }
  .gal-kpi:last-child { grid-column: 1 / -1; }
  .gal-share-grid { grid-template-columns: 1fr; gap: 1.2rem; }
  .gal-qr { max-width: 220px; width: 100%; justify-self: center; }
}
@media (max-width: 640px) {
  .gal-kpi { padding: .8rem; gap: .65rem; }
  .gal-kpi-ic { width: 38px; height: 38px; border-radius: 11px; }
  .gal-kpi-txt strong { font-size: 1rem; }
  .gal-sec-head { gap: .75rem; }
  .gal-sec-head h2, .enc-card > h2 { font-size: 1.12rem; }
  .gal-acts .btn { flex: 1 1 0; justify-content: center; }
  .gal-danger { flex-direction: column; align-items: stretch; text-align: left; }
  .gal-danger .btn { justify-content: center; }
  .gal-url { padding-left: .75rem; }
  .gal-url .btn { padding: .5rem .8rem; }
}

/* ===== Pulpit: żywe odliczanie i nowe kafelki liczników (runda 51) ===== */
.welcome .welcome-count.wc-live { flex-direction: column; align-items: stretch; gap: .7rem; padding-left: 0; min-width: 300px; font-family: var(--font-body); font-size: .72rem; text-transform: uppercase; letter-spacing: .14em; color: var(--muted); }
.welcome .welcome-count.wc-live::before { display: none; }
.cd-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
.cd-unit { position: relative; display: grid; justify-items: center; gap: .15rem; padding: .7rem .3rem .55rem; border-radius: 16px; background: linear-gradient(180deg, var(--surface), color-mix(in srgb, var(--accent) 9%, var(--surface))); border: 1px solid color-mix(in srgb, var(--accent) 20%, var(--line)); box-shadow: 0 10px 22px -16px color-mix(in srgb, var(--accent) 60%, transparent); overflow: hidden; }
.cd-unit::after { content: ""; position: absolute; left: 10%; right: 10%; top: 50%; height: 1px; background: color-mix(in srgb, var(--accent) 12%, transparent); }
.cd-num { display: block; font: 700 clamp(1.7rem, 3vw, 2.3rem)/1 var(--font-body); color: var(--accent-strong); font-variant-numeric: tabular-nums lining-nums; letter-spacing: -.02em; text-transform: none; }
.cd-lbl { font-size: .66rem; letter-spacing: .12em; color: var(--muted); }
.cd-d { background: linear-gradient(160deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #fff)); border-color: transparent; }
.cd-d .cd-num, .cd-d .cd-lbl { color: #fff; }
.cd-d::after { background: rgba(255, 255, 255, .25); }
.cd-num.is-tick { animation: cd-roll .45s cubic-bezier(.2, .8, .2, 1); }
@keyframes cd-roll { 0% { transform: translateY(-55%); opacity: 0; filter: blur(2px); } 100% { transform: none; opacity: 1; filter: none; } }
.cd-s .cd-num { color: var(--accent); }
.cd-road { position: relative; height: 8px; margin: .55rem 4px .1rem; border-radius: 99px; background: color-mix(in srgb, var(--accent) 13%, transparent); }
.cd-road i { position: absolute; inset: 0 auto 0 0; width: var(--p); border-radius: inherit; background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 45%, #fff), var(--accent)); background-size: 200% 100%; animation: cd-flow 3s linear infinite; }
@keyframes cd-flow { to { background-position: -200% 0; } }
.cd-road b { position: absolute; left: var(--p); top: 50%; display: grid; place-items: center; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%; background: var(--surface); color: #e0567f; box-shadow: 0 3px 10px -2px rgba(224, 86, 127, .5); animation: cd-beat 1s ease-in-out infinite; }
.cd-road b .icon { width: 14px; height: 14px; fill: currentColor; }
@keyframes cd-beat { 0%, 100% { transform: scale(1); } 15% { transform: scale(1.22); } 30% { transform: scale(1); } 45% { transform: scale(1.12); } }
.wc-live .wc-label { font-size: .68rem; }
.cd-today, .cd-after { display: grid; justify-items: center; gap: .2rem; padding: 1rem 1.4rem; border-radius: 18px; background: linear-gradient(160deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #fff)); color: #fff; text-transform: none; letter-spacing: 0; }
.cd-today strong, .cd-after strong { font: 700 2.2rem/1 var(--font-body); }
.cd-today .icon { width: 28px; height: 28px; animation: cd-beat 1s ease-in-out infinite; }
.cd-after span { font-size: .85rem; opacity: .9; }
@media (max-width: 760px) {
  .welcome .welcome-count.wc-live { min-width: 0; width: 100%; margin-top: 1rem; }
  .cd-grid { gap: .4rem; }
  .cd-unit { padding: .6rem .2rem .5rem; border-radius: 14px; }
}
@media (prefers-reduced-motion: reduce) { .cd-num.is-tick, .cd-road i, .cd-road b, .cd-today .icon { animation: none; } }

/* Kafelki liczników: ikona po lewej, liczba po prawej, opis pod spodem */
.dash-stats .stat { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "ico num" "lbl lbl" "bar bar"; align-items: center; column-gap: .75rem; row-gap: .55rem; padding: 1rem 1.05rem 1.05rem; }
.dash-stats .stat .stat-ico { grid-area: ico; margin: 0; width: 42px; height: 42px; border-radius: 13px; }
.dash-stats .stat .stat-ico .icon { width: 21px; height: 21px; }
.dash-stats .stat .stat-num { grid-area: num; justify-self: end; text-align: right; font-size: 1.85rem; line-height: 1; white-space: nowrap; }
.dash-stats .stat .stat-label { grid-area: lbl; font-size: .84rem; padding-top: .55rem; border-top: 1px solid color-mix(in srgb, var(--k) 14%, var(--line)); }
.dash-stats .stat .stat-bar { grid-area: bar; top: 0; margin-top: 0; }
@media (max-width: 640px) { .dash-stats .stat .stat-num { font-size: 1.6rem; } .dash-stats .stat .stat-ico { width: 38px; height: 38px; } }
.cd-unit::after { display: none; }
.welcome .wc-live .wc-label { display: block; width: 100%; max-width: none; text-align: center; line-height: 1.5; }
@media (min-width: 761px) { .welcome:has(.wc-live) { align-items: center; } }
.stats.dash-stats { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
@media (max-width: 640px) { .stats.dash-stats { grid-template-columns: 1fr 1fr; } }
.welcome .welcome-count.wc-live { min-width: 340px; }
@media (max-width: 760px) { .welcome .welcome-count.wc-live { min-width: 0; } }

/* ===== Lista gości (runda 52): zwijane formularze, kafelki-filtry, lista kart ===== */
.g-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; margin-bottom: 1rem; }
.g-fold { padding: 0; overflow: hidden; }
.g-fold > summary { display: flex; align-items: center; gap: .85rem; padding: 1rem 1.15rem; cursor: pointer; list-style: none; }
.g-fold > summary::-webkit-details-marker { display: none; }
.g-fold > summary > span:nth-child(2) { display: grid; gap: .1rem; flex: 1; min-width: 0; }
.g-fold > summary strong { font-size: 1rem; }
.g-fold > summary small { color: var(--muted); font-size: .8rem; }
.g-fold-ic { display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 13px; background: var(--accent-soft); color: var(--accent-strong); }
.g-fold-ic .icon { width: 20px; height: 20px; }
.g-fold-chev { flex: none; width: 18px; height: 18px; color: var(--muted); transition: transform .25s; }
.g-fold[open] .g-fold-chev { transform: rotate(90deg); }
.g-fold[open] > summary { border-bottom: 1px solid var(--line); }
.g-fold > form { padding: 1.1rem 1.15rem 1.2rem; margin: 0; }
.g-form-acts { margin-top: .4rem; }
.g-form-acts .btn { min-height: 44px; }
.g-tools:has(.g-fold[open]) { grid-template-columns: 1fr; }

.g-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.g-kpis .stat { font: inherit; text-align: left; cursor: pointer; width: 100%; }
.g-kpis .stat .stat-num small { font-size: .55em; color: var(--muted); font-weight: 500; }
.g-kpis .stat.is-on { border-color: var(--k); box-shadow: 0 0 0 2px color-mix(in srgb, var(--k) 35%, transparent); }
.g-kpis .stat.st-all { grid-column: 1 / -1; cursor: default; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: .3rem .9rem; min-height: 0; text-align: left; }
.g-kpis .stat.st-all .stat-num { order: 2; flex: none; }
.g-kpis .stat.st-all .stat-label { order: 3; margin: 0; border: 0; padding: 0; }
@media (max-width: 640px) { .g-kpis .stat:last-child:nth-child(odd):not(.st-all) { grid-column: auto; } }

.g-card { padding: 0; overflow: hidden; }
.g-toolbar { display: grid; gap: .8rem; padding: 1.1rem 1.15rem .9rem; border-bottom: 1px solid var(--line); }
.g-search { position: relative; display: block; margin: 0; }
.g-search .icon { position: absolute; left: .9rem; top: 50%; width: 18px; height: 18px; margin-top: -9px; color: var(--muted); pointer-events: none; }
.g-search input { width: 100%; min-height: 46px; padding-left: 2.6rem; margin: 0; border-radius: 14px; }
.g-chips { display: flex; gap: .45rem; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.g-chips::-webkit-scrollbar { display: none; }
.g-chips .chip { flex: none; white-space: nowrap; }
.g-chips .chip b { margin-left: .2rem; padding: 0 .4rem; border-radius: 99px; background: color-mix(in srgb, var(--muted) 14%, transparent); font-weight: 600; font-size: .75em; }
.g-chips .chip.is-on b { background: color-mix(in srgb, var(--accent) 22%, transparent); }

.g-head, .g-item { display: grid; grid-template-columns: minmax(0, 2.3fr) minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, .85fr) auto; gap: 1rem; align-items: center; padding: .85rem 1.15rem; }
.g-head { padding-top: .6rem; padding-bottom: .6rem; background: var(--surface-2, color-mix(in srgb, var(--accent) 4%, var(--surface))); font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.g-list { list-style: none; margin: 0; padding: 0; }
.g-item { position: relative; border-top: 1px solid var(--line); transition: background .15s; }
.g-item:first-child { border-top: 0; }
.g-item:hover { background: color-mix(in srgb, var(--accent) 4%, transparent); }
.g-item::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: transparent; }
.g-item.is-yes::before { background: var(--ok); }
.g-item.is-no::before { background: color-mix(in srgb, var(--danger) 60%, transparent); }
.g-who { display: flex; align-items: center; gap: .8rem; min-width: 0; }
.g-ava { display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 50%; font: 600 .86rem var(--font-body); letter-spacing: .02em; color: var(--c1); background: var(--c2); }
.g-ava.tone-0 { --c1: #6d4ae8; --c2: #ece7fe; } .g-ava.tone-1 { --c1: #c2416b; --c2: #fbe6ee; } .g-ava.tone-2 { --c1: #2f7d62; --c2: #e1f3eb; }
.g-ava.tone-3 { --c1: #b5651d; --c2: #fbeedd; } .g-ava.tone-4 { --c1: #2b6aa8; --c2: #e2eefa; } .g-ava.tone-5 { --c1: #8a5a9e; --c2: #f3e8f7; }
.g-id { display: grid; gap: .2rem; min-width: 0; }
.g-name { display: flex; align-items: center; flex-wrap: wrap; gap: .3rem; font-size: .97rem; line-height: 1.3; }
.g-name .badge { font-size: .68rem; }
.g-sub { display: flex; flex-wrap: wrap; gap: .15rem .7rem; font-size: .78rem; color: var(--muted); min-width: 0; }
.g-sub > span { display: inline-flex; align-items: center; gap: .25rem; min-width: 0; }
.g-sub .icon { width: 12px; height: 12px; flex: none; }
.g-sub .g-group { padding: .05rem .5rem; border-radius: 99px; background: var(--accent-soft); color: var(--accent-strong); font-weight: 500; }
.g-mail { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block !important; }
.g-note { font-size: .78rem; font-style: italic; color: var(--text); opacity: .75; }
.g-inv, .g-rsvp { display: grid; justify-items: start; gap: .2rem; min-width: 0; }
.g-inv small, .g-rsvp small { font-size: .72rem; color: var(--muted); }
.g-seat { display: inline-flex; align-items: center; gap: .35rem; font-size: .86rem; font-weight: 500; min-width: 0; }
.g-seat .icon { width: 16px; height: 16px; color: var(--accent); flex: none; }
.g-seat span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-seat.is-none { color: var(--muted); font-weight: 400; }
.g-seat.is-none .icon { color: var(--muted); opacity: .6; }
.g-acts { display: flex; gap: .35rem; justify-content: flex-end; }
.g-acts form.inline { display: flex; }
.g-none { display: flex; align-items: center; justify-content: center; gap: .4rem; padding: 1.6rem 1rem; margin: 0; }
.g-empty { display: grid; justify-items: center; gap: .4rem; padding: 2.2rem 1rem; text-align: center; }
.g-empty p { margin: 0; }

@media (max-width: 980px) {
  .g-tools { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .g-kpis { grid-template-columns: 1fr 1fr !important; }
  .g-head { display: none; }
  .g-toolbar { padding: 1rem; }
  /* Karta gościa: imię + akcje w pierwszym wierszu, pod spodem statusy jako plakietki */
  .g-item { display: flex; flex-wrap: wrap; align-items: center; column-gap: .4rem; row-gap: .65rem; padding: 1rem 1rem 1rem 1.05rem; }
  .g-who { flex: 1 1 0; min-width: 0; align-items: flex-start; }
  .g-acts { flex: none; align-self: flex-start; }
  .g-inv, .g-rsvp, .g-seat { display: inline-flex; align-items: center; }
  .g-inv small, .g-rsvp small { display: none; }
  .g-item > .g-inv { flex-basis: auto; height: auto; overflow: visible; margin: 0 0 0 54px; }
  .g-item::after { content: ""; order: 1; flex-basis: 100%; height: 0; }
  .g-who, .g-acts { order: 0; }
  .g-inv, .g-rsvp, .g-seat { order: 2; }
  .g-seat { padding: .2rem .6rem; border-radius: 99px; background: color-mix(in srgb, var(--muted) 10%, transparent); font-size: .78rem; }
  .g-mail { max-width: 170px; }
}
.g-tools > .card { margin: 0; }
@media (max-width: 760px) {
  .g-tools { grid-template-columns: 1fr 1fr; gap: .7rem; }
  .g-tools:has(.g-fold[open]) { grid-template-columns: 1fr; }
  .g-fold > summary { padding: .85rem .8rem; gap: .6rem; }
  .g-fold:not([open]) > summary small, .g-fold:not([open]) .g-fold-chev { display: none; }
  .g-fold:not([open]) > summary strong { font-size: .9rem; line-height: 1.25; }
  .g-fold-ic { width: 38px; height: 38px; border-radius: 11px; }
}
.g-chips { flex-wrap: nowrap; }
.g-meta { display: contents; }
.g-mail { display: inline-flex !important; max-width: 240px; }
.g-mail > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
@media (max-width: 760px) {
  .g-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; flex-basis: 100%; order: 2; padding-left: 54px; }
  .g-item > .g-meta > .g-inv { margin: 0; }
  .g-item::after { display: none; }
  .g-mail { max-width: 200px; }
}

/* ===== Runda 53: lista gości przy średniej szerokości, podpowiedź przewijania filtrów, równe kafelki ===== */
.dash-stats .stat { grid-template-rows: auto 1fr auto; }
.dash-stats .stat .stat-label { align-self: start; }
.g-chips { padding-right: 2.5rem; scroll-padding-inline: 0 2.5rem; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 2.5rem), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 2.5rem), transparent); }
@media (min-width: 761px) { .g-chips { flex-wrap: wrap; overflow: visible; padding-right: 0; -webkit-mask-image: none; mask-image: none; } }
.g-card { container: glist / inline-size; }
@container glist (max-width: 860px) and (min-width: 600px) {
  .g-head { display: none; }
  .g-item { display: flex; flex-wrap: wrap; align-items: center; column-gap: .6rem; row-gap: .6rem; }
  .g-who { flex: 1 1 0; min-width: 0; }
  .g-acts { flex: none; }
  .g-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; flex-basis: 100%; order: 2; padding-left: 54px; }
  .g-inv, .g-rsvp { display: inline-flex; align-items: center; gap: .35rem; }
  .g-seat { padding: .2rem .6rem; border-radius: 99px; background: color-mix(in srgb, var(--muted) 10%, transparent); font-size: .8rem; }
}
@media (max-width: 760px) { .g-toolbar { padding-bottom: .75rem; } }
/* Harmonogram na telefonie: przyciski nagłówka zawijają się, akcje punktu w jednym rzędzie (same ikony) */
.page-head > .row { flex-wrap: wrap; }
@media (max-width: 480px) {
  .tl-actions { flex-wrap: nowrap; gap: .3rem; }
  .tl-actions .tl-move { display: flex; gap: .3rem; }
  .tl-actions .btn-tiny { width: 36px; padding: 0; justify-content: center; }
  .tl-actions a.btn-tiny { font-size: 0; gap: 0; }
  .tl-actions .btn-tiny .icon { width: 16px; height: 16px; }
}

/* ===== Runda 54: admin – terminy jako +dni, zużycie miejsca i SMS; powiadomienia PUSH pary ===== */
.adm-offset { display: flex; align-items: center; gap: .45rem; }
.adm-offset b { font-size: 1.1rem; color: var(--muted); font-weight: 600; }
.adm-offset input { width: 7.5rem; flex: none; margin: 0; }
.adm-offset span { font-size: .85rem; color: var(--muted); }
.adm-dates [data-offset-out] { display: block; margin-top: .25rem; font-weight: 600; color: var(--accent-strong); }
.adm-presets { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: -.2rem; }
.adm-presets .chip { font-size: .78rem; }
.adm-usage { margin-bottom: 1rem; }
.adm-usage .stat-num small { font-size: .55em; color: var(--muted); font-weight: 500; }
.use-cell { display: grid; gap: .25rem; min-width: 7.5rem; }
.use-bar { display: block; height: 6px; border-radius: 99px; background: color-mix(in srgb, var(--muted) 16%, transparent); overflow: hidden; }
.use-bar b { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.use-cell.is-warn .use-bar b { background: var(--warn); }
.use-cell.is-bad .use-bar b { background: var(--danger); }
.push-card .push-enable { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: .4rem 0 1rem; }
.push-card .push-enable .form-msg { flex-basis: 100%; margin: 0; }
.push-card .push-enable .form-msg:empty { display: none; }
.push-devices { list-style: none; margin: 0 0 .8rem; padding: 0; border: 1px solid var(--line); border-radius: 16px; }
.push-devices li { display: flex; align-items: center; gap: .75rem; padding: .7rem .85rem; }
.push-devices li + li { border-top: 1px solid var(--line); }
.push-dev-ic { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 12px; background: var(--accent-soft); color: var(--accent-strong); }
.push-dev-txt { display: grid; flex: 1; min-width: 0; }
.push-dev-txt small { font-size: .78rem; }
.push-settings { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
@media (max-width: 640px) {
  .adm-offset input { width: 6rem; }
}
.adm-terms { display: grid; gap: .15rem; min-width: 9.5rem; } .adm-terms .icon { width: 13px; height: 13px; vertical-align: -.15em; } .adm-terms .badge { margin-left: .25rem; }
.upload-msg { margin: .8rem 0 0; padding: .75rem .9rem; border-radius: 12px; background: color-mix(in srgb, var(--warn) 14%, var(--surface)); color: var(--text); font-size: .9rem; line-height: 1.45; border: 1px solid color-mix(in srgb, var(--warn) 40%, transparent); }
.qr-reprint { display: flex; gap: .9rem; align-items: flex-start; margin: 0 0 1rem; padding: 1rem 1.1rem; border-radius: 18px; background: color-mix(in srgb, var(--warn) 12%, var(--surface)); border: 1px solid color-mix(in srgb, var(--warn) 45%, transparent); }
.qr-reprint.is-danger { background: color-mix(in srgb, var(--danger) 10%, var(--surface)); border-color: color-mix(in srgb, var(--danger) 45%, transparent); }
.qr-reprint-ic { display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 13px; background: var(--surface); color: var(--warn); }
.qr-reprint.is-danger .qr-reprint-ic { color: var(--danger); }
.qr-reprint-body { min-width: 0; flex: 1; }
.qr-reprint-body ul { margin: .4rem 0; padding-left: 1.1rem; font-size: .9rem; }
.qr-reprint-body p { margin: .2rem 0 .6rem; }
.qr-reprint-acts { display: flex; flex-wrap: wrap; gap: .5rem; }
.pp-enc-warn, .pp-enc-ok { display: flex; gap: .5rem; align-items: flex-start; max-width: 900px; margin: .6rem auto; padding: .7rem .9rem; border-radius: 12px; font-size: .9rem; background: #fff4e0; color: #5a3d00; }
.pp-enc-ok { background: #e8f6ee; color: #1d5a3a; }
/* Komentarze na telefonie: dolny pasek nawigacji nie może przykrywać pola wpisywania */
body.cm-open .tabbar, body.cm-open .panel-tabbar { display: none !important; }
.cm-panel { max-height: min(80vh, 680px); max-height: min(85dvh, 680px); }
@media (max-width: 720px) { .cm-panel { width: 100%; } .cm-row textarea { font-size: 16px; } }
/* Admin: domyślne ustawienia kont */
.defaults-card { margin-bottom: 1.2rem; }
.defaults-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.defaults-grid > label { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .8rem; margin: 0; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.def-ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--accent-soft); color: var(--accent-strong); }
.def-ic.is-danger { background: color-mix(in srgb, var(--danger) 12%, var(--surface)); color: var(--danger); }
.def-ic .icon { width: 20px; height: 20px; }
.def-txt { display: grid; gap: .1rem; min-width: 0; }
.def-txt strong { font-size: .95rem; }
.def-txt small { color: var(--muted); font-size: .8rem; font-weight: 400; }
.defaults-grid .adm-offset input { width: 6.2rem; }
@media (max-width: 760px) {
  .defaults-grid { grid-template-columns: 1fr; }
  .defaults-grid > label { grid-template-columns: auto minmax(0, 1fr); }
  .defaults-grid .adm-offset { grid-column: 1 / -1; }
}
/* Administrator na koncie pary */
.imp-bar { position: sticky; top: .5rem; z-index: 40; display: flex; align-items: center; gap: .8rem; margin: 0 0 1rem; padding: .7rem .9rem; border-radius: 16px; background: #2b2118; color: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.2); }
.imp-ic { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 12px; background: rgba(255,255,255,.12); }
.imp-txt { display: grid; flex: 1; min-width: 0; }
.imp-txt strong { font-size: .92rem; }
.imp-txt small { font-size: .78rem; opacity: .75; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.imp-bar .btn { flex: none; background: #fff; color: #2b2118; border-color: #fff; }
.adm-row-acts { display: inline-flex; gap: .35rem; align-items: center; }
@media (max-width: 640px) { .imp-bar { flex-wrap: wrap; top: 4.2rem; } .imp-bar .btn { flex-basis: 100%; justify-content: center; } }

/* ===== Marka Weselia.pl ===== */
.wl-logo { display: inline-flex; align-items: center; gap: .42em; line-height: 1; white-space: nowrap; }
.wl-mark { width: 1.6em; height: 1.6em; flex: none; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
a:hover > .wl-logo .wl-mark { transform: rotate(-10deg) scale(1.06); }
.wl-word { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; letter-spacing: -.01em; color: inherit; }
.wl-tld { color: #b08a4e; }
.brand .wl-app { font-size: 1.5rem; }
.ui-glamour .brand .wl-word { font-weight: 600; }
.sidenav-made { display: flex; align-items: center; padding: .7rem .4rem .1rem; color: var(--muted); text-decoration: none; opacity: .8; transition: opacity .2s; }
.sidenav-made:hover { opacity: 1; }
.wl-xs { font-size: 1.05rem; }
@media (max-width: 900px) { .sidenav-made { width: 100%; justify-content: center; } }

/* ===== Lista ślubów w panelu admina (karty) ===== */
.wl-kpis { margin-bottom: 1rem; }
.wl-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin: 0 0 1rem; }
.wl-search { flex: 1 1 260px; max-width: 420px; }
.wl-chips { margin: 0; }
.wl-chips .chip b { font-weight: 600; color: var(--text); opacity: .75; }
.wl { display: grid; gap: .8rem; }
.wl-card { --c1: #a8875a; --c2: #f3ebdf; position: relative; display: grid; grid-template-columns: minmax(220px, 1.25fr) minmax(230px, 1.3fr) minmax(200px, 1fr) auto; align-items: center; gap: 1.1rem 1.6rem;
  padding: 1.05rem 1.25rem 1.05rem 1.4rem; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); overflow: hidden;
  transition: border-color .25s, box-shadow .25s, transform .25s; }
.wl-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--ok); opacity: .85; }
.wl-card.is-download::before { background: var(--warn); }
.wl-card.is-none::before { background: color-mix(in srgb, var(--muted) 55%, transparent); }
.wl-card.is-none { background: color-mix(in srgb, var(--surface) 92%, var(--muted)); }
.wl-card:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); box-shadow: 0 14px 34px -26px rgba(60, 40, 15, .55); transform: translateY(-1px); }
.wl-card.tone-1 { --c1: #c2416b; --c2: #fbe6ee; } .wl-card.tone-2 { --c1: #2f7d62; --c2: #e1f3eb; }
.wl-card.tone-3 { --c1: #3d6fb0; --c2: #e4edf8; } .wl-card.tone-4 { --c1: #8a5bb0; --c2: #f0e7f8; } .wl-card.tone-5 { --c1: #b0662f; --c2: #f8ebe0; }
.wl-who { display: flex; align-items: center; gap: .85rem; min-width: 0; }
.wl-mono { flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--c2); color: var(--c1); font: 600 1.05rem/1 var(--font-display); letter-spacing: .02em;
  box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--c1) 30%, transparent); }
.wl-name { display: grid; gap: .18rem; min-width: 0; }
.wl-title { color: var(--text); font-weight: 600; font-size: 1rem; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wl-title:hover { color: var(--accent-strong); }
.wl-mail { display: inline-flex; align-items: center; gap: .3rem; min-width: 0; color: var(--muted); font-size: .82rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wl-mail .icon { flex: none; width: 13px; height: 13px; }
.wl-badges { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .15rem; }
.wl-badges .badge { font-size: .7rem; }
.badge-trial { background: color-mix(in srgb, #3d6fb0 14%, transparent); color: #3d6fb0; }
.wl-lbl { display: block; color: var(--muted); font-size: .7rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.wl-lbl strong { color: var(--text); font-size: .86rem; letter-spacing: 0; text-transform: none; }
.wl-date { display: grid; gap: .2rem; }
.wl-date strong { font-size: .95rem; }
.wl-rel { display: inline-flex; align-items: center; gap: .3rem; width: fit-content; padding: .12rem .55rem; border-radius: 99px; background: color-mix(in srgb, var(--muted) 12%, transparent); color: var(--muted); font-size: .74rem; font-weight: 500; }
.wl-rel.is-future { background: var(--accent-soft); color: var(--accent-strong); }
.wl-rel .icon { width: 12px; height: 12px; }
.wl-life { display: grid; gap: .45rem; min-width: 0; }
.wl-track { position: relative; height: 8px; border-radius: 99px; background: color-mix(in srgb, var(--muted) 14%, transparent); }
.wl-fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 99px; background: linear-gradient(90deg, color-mix(in srgb, var(--ok) 55%, transparent), var(--ok)); }
.wl-fill.is-dl { background: color-mix(in srgb, var(--warn) 55%, transparent); border-radius: 0 99px 99px 0; }
.wl-pin { position: absolute; top: 50%; display: grid; place-items: center; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: var(--surface); color: #c2416b; box-shadow: 0 0 0 1.5px currentColor; }
.wl-pin .icon { width: 10px; height: 10px; }
.wl-now { position: absolute; top: -4px; bottom: -4px; width: 2px; margin-left: -1px; border-radius: 2px; background: var(--text); }
.wl-now::after { content: "dziś"; position: absolute; top: -15px; left: 50%; transform: translateX(-50%); font-size: .6rem; font-weight: 600; color: var(--muted); letter-spacing: .04em; }
.wl-steps { display: flex; flex-wrap: wrap; gap: .2rem .9rem; color: var(--muted); font-size: .78rem; }
.wl-steps span { display: inline-flex; align-items: center; gap: .3rem; }
.wl-steps .icon { width: 13px; height: 13px; }
.wl-life .wl-lbl { margin-bottom: 1.05rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wl-use { display: grid; gap: .5rem; min-width: 0; }
.wl-meter { display: grid; gap: .25rem; }
.wl-m-head { display: flex; align-items: center; gap: .35rem; color: var(--muted); font-size: .78rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wl-m-head b { color: var(--text); font-weight: 600; }
.wl-m-head .icon { flex: none; width: 14px; height: 14px; color: var(--accent); }
.wl-meter .use-bar { height: 5px; }
.wl-meter.is-warn .use-bar b { background: var(--warn); }
.wl-meter.is-bad .use-bar b { background: var(--danger); }
.wl-acts { display: flex; flex-direction: column; align-items: stretch; gap: .4rem; }
.wl-acts .btn { justify-content: center; white-space: nowrap; }
.wl-acts form { margin: 0; }
.wl-acts form .btn { width: 100%; }
/* data ślubu pod nazwiskami, cykl konta, wykorzystanie i przyciski obok */
@media (min-width: 861px) {
  .wl-date { grid-column: 1; grid-row: 2; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; padding-left: calc(48px + .85rem); }
  .wl-life { grid-column: 2; grid-row: 1 / span 2; }
  .wl-use { grid-column: 3; grid-row: 1 / span 2; }
  .wl-acts { grid-column: 4; grid-row: 1 / span 2; }
}
@media (max-width: 860px) {
  .wl-card { grid-template-columns: 1fr 1fr; gap: .9rem 1.2rem; padding: 1rem 1rem 1rem 1.2rem; }
  .wl-who { grid-column: 1 / -1; grid-row: 1; }
  .wl-date { grid-column: 1 / -1; grid-row: 2; padding-left: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; }
  .wl-life { grid-column: 1 / -1; grid-row: 3; }
  .wl-use { grid-column: 1 / -1; grid-row: 4; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
  .wl-acts { grid-column: 1 / -1; grid-row: 5; flex-direction: row; }
  .wl-acts > * { flex: 1; }
  .wl-acts .btn { min-height: 44px; }
}
@media (max-width: 520px) {
  .wl-use { grid-template-columns: 1fr; }
  .wl-search { max-width: none; }
  .wl-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%; }
  .wl-chips .chip { flex: none; }
}

/* ===== Edycja ślubu w panelu admina: sekcja „Para młoda” ===== */
.ws-sec-head { display: flex; align-items: flex-start; gap: .85rem; margin: 0 0 1.1rem; padding-bottom: .9rem; border-bottom: 1px solid var(--line); }
.ws-sec-head h2 { margin: 0; font-size: 1.2rem; }
.ws-sec-head p { margin: .15rem 0 0; color: var(--muted); font-size: .84rem; }
.ws-sec-ic { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--accent-soft); color: var(--accent-strong); }
.ws-sec-ic .icon { width: 21px; height: 21px; }
.ws-sec-ic.tone-pink { background: #fbe6ee; color: #c2416b; }
.ws-couple { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: end; gap: .8rem; }
.ws-amp { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: .55rem; border-radius: 50%; background: #fbe6ee; color: #c2416b; }
.ws-amp .icon { width: 18px; height: 18px; }
.ws-couple label { margin-bottom: 0; }
.ws-couple + label { margin-top: 1rem; }
.ws-lbl { display: inline-flex; align-items: center; gap: .35rem; }
.ws-lbl .icon { width: 15px; height: 15px; color: var(--accent); }
@media (max-width: 640px) {
  .ws-couple { grid-template-columns: 1fr; gap: .6rem; }
  .ws-amp { display: none; }
}

/* ===== Edycja ślubu: „Czas aktywności i galeria” jako trzy etapy ===== */
.ws-sec-gap { margin-top: 1.8rem; }
.ws-sec-ic.tone-green { background: #e1f3eb; color: #2f7d62; }
.tm-flow { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: stretch; gap: .5rem; }
.tm-step { --c: var(--ok); --cs: color-mix(in srgb, var(--ok) 11%, var(--surface)); position: relative; display: flex !important; flex-direction: column; gap: .55rem; margin: 0 !important;
  padding: .95rem 1rem 1rem; border-radius: 16px; background: var(--cs); border: 1px solid color-mix(in srgb, var(--c) 28%, var(--line)); }
.tm-step::before { content: ""; position: absolute; left: 1rem; right: 1rem; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: var(--c); opacity: .8; }
.tm-step.is-dl { --c: var(--warn); --cs: color-mix(in srgb, var(--warn) 10%, var(--surface)); }
.tm-step.is-del { --c: var(--danger); --cs: color-mix(in srgb, var(--danger) 8%, var(--surface)); }
.tm-head { display: flex; align-items: center; gap: .5rem; font-weight: 600; font-size: .9rem; color: var(--text); }
.tm-ic { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; background: var(--surface); color: var(--c); box-shadow: 0 0 0 1px color-mix(in srgb, var(--c) 25%, transparent); }
.tm-ic .icon { width: 16px; height: 16px; }
.tm-k { display: none; }
.tm-step input { margin: 0; background: var(--surface); }
.tm-days { display: flex; align-items: center; gap: .45rem; }
.tm-days b { color: var(--c); font-size: 1.15rem; font-weight: 600; }
.tm-days input { width: 6rem; flex: none; text-align: center; font-weight: 600; }
.tm-days span { font-size: .8rem; color: var(--muted); line-height: 1.25; }
.tm-out { display: inline-flex !important; align-items: center; gap: .3rem; width: fit-content; margin: 0 !important; padding: .2rem .65rem; border-radius: 99px; background: var(--surface);
  color: var(--c) !important; font-size: .82rem; font-weight: 600; box-shadow: 0 0 0 1px color-mix(in srgb, var(--c) 25%, transparent); }
.tm-out:empty { display: none !important; }
.tm-hint { font-size: .78rem; color: var(--muted); line-height: 1.35; }
.tm-arrow { display: grid; place-items: center; color: color-mix(in srgb, var(--muted) 70%, transparent); }
.tm-arrow .icon { width: 20px; height: 20px; }
.tm-presets { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: .85rem 0 0 !important; }
.tm-presets-lbl { display: inline-flex; align-items: center; gap: .3rem; margin-right: .2rem; font-size: .78rem; font-weight: 600; color: var(--muted); }
.tm-presets-lbl .icon { width: 14px; height: 14px; color: var(--accent); }
.tm-presets .chip { gap: .25rem; font-size: .78rem; }
.tm-presets .chip .icon { width: 12px; height: 12px; }
.tm-sep { opacity: .45; }
.tm-opts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-top: 1.1rem; }
.tm-opt { display: flex !important; flex-direction: column; gap: .5rem; margin: 0 !important; padding: .9rem 1rem; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); }
.tm-opt select, .tm-opt input:not(.switch) { margin: 0; }
.tm-opt-row { display: flex; align-items: center; gap: .55rem; font-size: .9rem; }
.tm-opt-ic { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; background: var(--accent-soft); color: var(--accent-strong); }
.tm-opt-ic .icon { width: 16px; height: 16px; }
.tm-opt-switch { flex-direction: row; align-items: center; gap: .75rem; cursor: pointer; }
.tm-opt-txt { flex: 1; display: grid; gap: .15rem; font-size: .9rem; }
.tm-opt-txt small { color: var(--muted); font-size: .78rem; line-height: 1.35; }
.tm-opt-switch .switch { flex: none; }
.tm-unit { display: flex; align-items: center; gap: .5rem; }
.tm-unit input { flex: 1; min-width: 0; }
.tm-unit span { font-weight: 600; color: var(--muted); }
.tm-usage { display: grid; gap: .25rem; }
.tm-usage small { color: var(--muted); font-size: .76rem; }
.tm-usage.is-warn .use-bar b { background: var(--warn); }
.tm-usage.is-bad .use-bar b { background: var(--danger); }
.tm-note { display: flex; gap: .55rem; align-items: flex-start; margin: 1rem 0 1.2rem; padding: .75rem .9rem; border-radius: 14px; background: color-mix(in srgb, var(--accent-soft) 70%, transparent); color: var(--muted); font-size: .82rem; line-height: 1.5; }
.tm-note .icon { flex: none; width: 16px; height: 16px; margin-top: .15rem; color: var(--accent); }
.tm-note strong { color: var(--danger); font-weight: 600; }
@media (max-width: 980px) {
  .tm-flow { grid-template-columns: 1fr; }
  .tm-arrow { transform: rotate(90deg); height: 18px; }
  .tm-opts { grid-template-columns: 1fr; }
}

/* ===== Galeria: pobieranie w paczkach ===== */
.gal-dl-lead { display: flex; gap: .55rem; align-items: flex-start; margin: 0 0 1rem; padding: .75rem .9rem; border-radius: 14px; background: var(--accent-soft); font-size: .9rem; line-height: 1.5; }
.gal-dl-lead .icon { flex: none; width: 18px; height: 18px; margin-top: .15rem; color: var(--accent-strong); }
.gal-dl-parts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); gap: .6rem; margin: 0; padding: 0; list-style: none; }
.gal-dl-parts li { display: flex; align-items: center; gap: .8rem; padding: .75rem .8rem .75rem .9rem; border-radius: 14px; border: 1px solid var(--line); background: var(--surface); }
.gal-dl-n { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--accent-soft); color: var(--accent-strong); font-weight: 700; }
.gal-dl-n .icon { width: 20px; height: 20px; }
.gal-dl-txt { flex: 1; display: grid; gap: .1rem; min-width: 0; }
.gal-dl-txt small { color: var(--muted); font-size: .8rem; }
.gal-dl-parts .btn { flex: none; }
.gal-dl-tips { display: grid; gap: .35rem; margin: 1rem 0 0; padding: 0; list-style: none; color: var(--muted); font-size: .82rem; }
.gal-dl-tips li { display: flex; gap: .45rem; align-items: flex-start; }
.gal-dl-tips .icon { flex: none; width: 15px; height: 15px; margin-top: .15rem; color: var(--accent); }
/* Pobieranie: jeden główny przycisk, reszta w plakietkach i rozwijanych sekcjach */
.gal-dl-hero { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.2rem; border-radius: 18px; background: var(--accent-soft); }
.gal-dl-hero-ic { display: grid; place-items: center; flex: none; width: 54px; height: 54px; border-radius: 16px; background: var(--surface); color: var(--accent-strong); }
.gal-dl-hero-ic .icon { width: 26px; height: 26px; }
.gal-dl-hero-txt { flex: 1; min-width: 0; }
.gal-dl-hero-txt h2 { margin: 0 0 .2rem; font-size: 1.25rem; }
.gal-dl-hero-txt p { margin: 0; color: var(--muted); font-size: .9rem; font-variant-numeric: tabular-nums; }
.gal-dl-main { flex: none; }
.gal-dl-status { margin: .6rem 0 0; }
.gal-dl-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .85rem 0 0; }
.gal-dl-chips:empty { display: none; }
.gal-dl-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .7rem; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); font-size: .8rem; }
.gal-dl-chip .icon { width: 14px; height: 14px; color: var(--accent); }
.gal-dl-chip.is-enc .icon { color: var(--ok); }
.gal-dl > .gal-dl-parts { margin-top: 1rem; }
.gal-dl-more { margin-top: .9rem; border-top: 1px solid var(--line); padding-top: .75rem; }
.gal-dl-more summary { display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; list-style: none; color: var(--accent-strong); font-size: .88rem; font-weight: 600; }
.gal-dl-more summary::-webkit-details-marker { display: none; }
.gal-dl-more summary .icon { width: 16px; height: 16px; transition: transform .2s; }
.gal-dl-more[open] summary .icon { transform: rotate(90deg); }
.gal-dl-more > p { margin: .5rem 0 .6rem; }
.gal-dl-more .gal-dl-tips { margin-top: .6rem; }
.gb-head-acts { gap: .5rem; flex-wrap: wrap; }
@media (max-width: 520px) {
  .gal-dl-parts li { flex-wrap: wrap; }
  .gal-dl-parts .btn { width: 100%; justify-content: center; }
  .gal-dl-hero { flex-wrap: wrap; padding: 1rem; }
  .gal-dl-hero-ic { width: 46px; height: 46px; }
  .gal-dl-hero-txt h2 { font-size: 1.1rem; }
  .gal-dl-main { width: 100%; justify-content: center; }
}

/* ===== Logowanie: zapamiętanie urządzenia i odcisk palca / twarz ===== */
.auth-remember { margin: .2rem 0 .3rem; font-size: .92rem; }
.passkey-login .btn.is-ready { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 35%, transparent); animation: pk-ready 1.6s ease-in-out 3; }
@keyframes pk-ready { 50% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--accent) 12%, transparent); } }

/* ===== Szata graficzna: przeglądanie strzałkami w podglądzie ===== */
.ts-stage { position: relative; display: flex; align-items: center; justify-content: center; gap: .4rem; }
.ts-stage .ts-device { flex: none; margin: 0; }
.ts-nav { flex: none; display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); color: var(--text);
  box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .35); cursor: pointer; transition: transform .15s, background-color .15s, border-color .15s; -webkit-tap-highlight-color: transparent; }
.ts-nav .icon { width: 22px; height: 22px; }
.ts-nav:hover { border-color: var(--accent); color: var(--accent-strong); }
.ts-nav:active { transform: scale(.92); }
.ts-nav[hidden] { display: none; }
.ts-count { margin: -.3rem 0 0; text-align: center; min-height: 1.2em; font-variant-numeric: tabular-nums; }

/* ===== Galeria pary: zakładki, pasek filtrów, siatka ===== */
.gal-tabs { position: sticky; top: 0; z-index: 6; display: flex; gap: .3rem; margin: 0 0 1.1rem; padding: .3rem; border-radius: 16px; background: color-mix(in srgb, var(--surface) 92%, transparent);
  border: 1px solid var(--line); box-shadow: 0 10px 24px -20px rgba(0, 0, 0, .4); overflow-x: auto; scrollbar-width: none; backdrop-filter: blur(8px); }
.gal-tabs::-webkit-scrollbar { display: none; }
.gal-tabs button { flex: 1 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 44px; padding: .45rem .95rem; border: 0; border-radius: 12px;
  background: transparent; color: var(--muted); font: 600 .9rem var(--font-body); white-space: nowrap; cursor: pointer; transition: background-color .2s, color .2s; }
.gal-tabs button .icon { width: 17px; height: 17px; }
.gal-tabs button b { min-width: 1.6em; padding: .05rem .45rem; border-radius: 99px; background: color-mix(in srgb, var(--muted) 14%, transparent); font-size: .74rem; }
.gal-tabs button:hover { color: var(--text); }
.gal-tabs button.is-on { background: var(--accent-soft); color: var(--accent-strong); }
.gal-tabs button.is-on b { background: var(--accent); color: var(--on-accent, #fff); }
.gal-tabs-wrap.is-ready .gal-pane:not(.is-active) { display: none; }
.gal-pane > .card:first-child, .gal-pane > section:first-child { margin-top: 0; }
.gal-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; margin: 0 0 .9rem; }
.gal-chips { margin: 0; }
.gal-chips .chip b { font-weight: 600; opacity: .7; }
.gal-search { flex: 0 1 260px; }
.gal-search input { min-height: 42px; }
.gal-page-note { margin: -.4rem 0 .8rem; }
#gal-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .9rem; }
#gal-grid .gallery-item { position: relative; border-radius: 16px; transition: transform .2s, box-shadow .2s, border-color .2s; }
#gal-grid .gallery-item:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); box-shadow: 0 16px 30px -22px rgba(0, 0, 0, .45); }
#gal-grid .media-thumb img { transition: transform .4s; }
#gal-grid .gallery-item:hover .media-thumb img { transform: scale(1.04); }
#gal-grid .gallery-item.is-hidden { opacity: 1; }
#gal-grid .gallery-item.is-hidden .media-thumb { filter: grayscale(.7); opacity: .55; }
.gi-flag { position: absolute; top: .5rem; left: .5rem; z-index: 2; display: inline-flex; align-items: center; gap: .25rem; padding: .2rem .55rem; border-radius: 99px;
  background: rgba(20, 16, 12, .72); color: #fff; font-size: .72rem; font-weight: 600; pointer-events: none; }
.gi-flag .icon { width: 12px; height: 12px; }
.gi-flag.is-book { background: color-mix(in srgb, var(--accent) 88%, #000); }
#gal-grid .gal-filter-empty { grid-column: 1 / -1; }
@media (max-width: 640px) {
  .gal-tabs { margin-left: -.25rem; margin-right: -.25rem; }
  .gal-tabs button { flex: 0 0 auto; padding: .45rem .75rem; font-size: .84rem; }
  .gal-tabs button span { display: inline; }
  .gal-search { flex: 1 1 100%; }
  .gal-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%; }
  .gal-chips .chip { flex: none; }
  #gal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
}
@media (max-width: 640px) {
  /* zakładki galerii: 4 równe kolumny, ikona nad podpisem; przyklejone pod górnym paskiem telefonu (62 px) */
  .gal-tabs { top: 62px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .2rem; padding: .25rem; overflow: visible; margin-left: 0; margin-right: 0; }
  .gal-tabs button { position: relative; flex-direction: column; gap: .15rem; min-height: 54px; padding: .35rem .2rem; font-size: .7rem; line-height: 1.15; white-space: normal; text-align: center; }
  .gal-tabs button .icon { width: 19px; height: 19px; }
  .gal-tabs button b { position: absolute; top: .2rem; right: .25rem; min-width: 0; padding: 0 .35rem; font-size: .62rem; }
  /* liczniki w jednym zwartym rzędzie */
  .panel-main .gal-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; }
  .panel-main .gal-kpis .gal-kpi { grid-column: auto; }
  .gal-kpi { padding: .6rem .55rem; gap: .4rem; flex-direction: column; align-items: flex-start; }
  .gal-kpi-ic { display: none; }
  .gal-kpi-txt strong { font-size: .95rem; }
  .gal-kpi-txt > span { font-size: .7rem; line-height: 1.25; }
}
/* Plan sali w poziomie na telefonie: ekran jest niski – plan mieści się nad dolnym menu (większy widok: pełny ekran) */
@media (max-width: 860px) and (max-height: 500px) {
  .seating-editor { min-height: 0; }
  .seating-editor .seat-stage { min-height: 120px; }
}

/* ---------- Wydarzenia (RSVP na poprawiny, nocleg…), kto odpowiada, mapy, przypomnienia ---------- */
.ev-switch { border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line)); border-radius: 14px; padding: .8rem 1rem !important; margin-bottom: 1rem !important; background: var(--accent-soft); }
.ev-box { border: 1px solid var(--line); border-radius: 14px; padding: .9rem 1rem .4rem; margin: 0 0 1rem; }
.ev-box legend { font-size: .9rem; font-weight: 600; padding: 0 .35rem; display: inline-flex; gap: .35rem; align-items: center; }
.ev-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 .8rem; }
.ev-grid .ev-place { grid-column: 1 / -1; }
.map-check { display: flex; align-items: center; gap: .35rem; margin: -.3rem 0 .6rem; }
.map-check-link { display: inline-flex; align-items: center; gap: .3rem; margin: -.35rem 0 .5rem; color: var(--accent-strong); }
.map-btns { display: inline-flex; flex-wrap: wrap; gap: .35rem; margin-top: .45rem; }
.map-btns .btn { min-height: 34px; }
.tl-place { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: .2rem; border-bottom: 1px dotted currentColor; }
.tl-place .icon { width: .85em; height: .85em; }
.tl-place:hover { color: var(--accent-strong); }

.aud-picker { border: 0; padding: 0; margin: .4rem 0 1rem; }
.aud-picker legend { font-size: .9rem; font-weight: 600; margin-bottom: .45rem; display: inline-flex; gap: .35rem; align-items: center; }
.aud-opts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.aud-opt { margin: 0 !important; cursor: pointer; }
.aud-opt input { position: absolute; opacity: 0; pointer-events: none; }
.aud-opt span { display: flex; flex-direction: column; gap: .2rem; height: 100%; padding: .75rem .85rem; border: 1px solid var(--line); border-radius: 14px; transition: border-color .15s, background .15s; }
.aud-opt small { color: var(--muted); font-size: .78rem; font-weight: 400; line-height: 1.35; }
.aud-opt input:checked + span { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 1px var(--accent) inset; }
.aud-opt input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.guest-pick { margin-top: .7rem; border: 1px solid var(--line); border-radius: 14px; padding: .7rem; max-height: 420px; overflow: auto; overscroll-behavior: contain; }
.gp-bar { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; position: sticky; top: -.7rem; background: var(--surface); padding: .1rem 0 .6rem; z-index: 1; }
.gp-bar input[type="search"] { flex: 1 1 180px; margin: 0; }
.gp-count { font-size: .82rem; color: var(--muted); }
.gp-group + .gp-group { margin-top: .6rem; }
.gp-group-head { display: flex; justify-content: space-between; align-items: center; gap: .5rem; font-size: .85rem; padding: .3rem 0; border-bottom: 1px solid var(--line); margin-bottom: .35rem; }
.gp-group-head .chip { padding: .15rem .55rem; font-size: .74rem; }
.gp-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .1rem .6rem; }
.gp-item { display: flex !important; align-items: center; gap: .5rem; margin: 0 !important; padding: .35rem .3rem; border-radius: 8px; cursor: pointer; font-size: .9rem; font-weight: 400; }
.gp-item:hover { background: var(--surface-2); }
.gp-item input { width: 18px; height: 18px; margin: 0; flex: none; accent-color: var(--accent); }

.ev-presets-head { display: flex; gap: .8rem; align-items: flex-start; margin-bottom: .8rem; }
.ev-presets-head h2 { margin: 0 0 .2rem; }
.ev-presets-head p { margin: 0; }
.preset-card.is-event { border-style: solid; background: var(--surface); }
.poll-icon.is-event { background: color-mix(in srgb, var(--ok) 14%, transparent); color: var(--ok); }
.ev-tag { display: inline-block; font-size: .68rem; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); padding: .05rem .4rem; border-radius: 6px; margin-right: .2rem; vertical-align: 1px; }
.ev-when { display: flex; flex-wrap: wrap; gap: .25rem .8rem; align-items: center; margin: .3rem 0 0; color: var(--text); line-height: 1.5; }
.ev-when .icon { width: .95em; height: .95em; color: var(--accent); vertical-align: -2px; }
.ev-when a { color: inherit; }
.poll-rate { margin: .3rem 0 0; }
.poll-card.is-event { border-left: 3px solid color-mix(in srgb, var(--ok) 55%, transparent); }

.ev-section { margin-top: 1.4rem; }
.ev-section-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; }
.ev-section-head h2 { margin: 0; display: inline-flex; gap: .4rem; align-items: center; font-size: 1.15rem; }
.ev-section > .muted { margin: .3rem 0 .8rem; }

.guest-route h2 { display: flex; gap: .4rem; align-items: center; font-size: 1.05rem; }
.route-row { display: flex; flex-wrap: wrap; gap: .4rem .8rem; align-items: center; padding: .6rem 0; border-top: 1px solid var(--line); }
.route-txt { flex: 1 1 160px; display: flex; flex-direction: column; min-width: 0; }
.route-row .map-btns { margin: 0; }

.silent-list { list-style: none; margin: .5rem 0 0; padding: 0; }
.silent-list li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .4rem .8rem; padding: .55rem 0; border-top: 1px solid var(--line); }
.silent-name { display: flex; flex-direction: column; gap: .1rem; min-width: 0; flex: 1 1 200px; }
.silent-name .badge { align-self: flex-start; margin-top: .15rem; }
.silent-act { display: flex; gap: .35rem; flex-wrap: wrap; }

.rem-head { display: flex; gap: .8rem; align-items: flex-start; }
.rem-head h2 { margin: 0 0 .2rem; }
.rem-head p { margin: 0; }
.rem-status { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin: 1rem 0 .4rem; }
.rem-stat { border: 1px solid var(--line); border-radius: 12px; padding: .6rem .75rem; display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.rem-stat small { color: var(--muted); font-size: .76rem; }
.rem-stat strong { font-size: .95rem; font-weight: 600; }
.rem-stat.is-warn { border-color: color-mix(in srgb, var(--warn) 35%, var(--line)); background: var(--warn-soft); }
.rem-stat.is-ok { border-color: color-mix(in srgb, var(--ok) 30%, var(--line)); background: var(--ok-soft); }
.rem-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 .9rem; margin-top: .6rem; }
.rem-grid small { display: block; font-weight: 400; margin-top: .2rem; }
.rem-channels { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; margin: .2rem 0 .9rem; }
.rem-channels .check { display: inline-flex; align-items: center; gap: .35rem; margin: 0; }
.rem-channels .is-off { color: var(--muted); }
.rem-preview { background: var(--surface-2); border-radius: 12px; padding: .7rem .85rem; margin: -.2rem 0 1rem; line-height: 1.5; overflow-wrap: anywhere; }
.rem-list { margin-top: 1rem; border-top: 1px solid var(--line); padding-top: .6rem; }
.rem-list summary { cursor: pointer; display: flex; gap: .5rem; align-items: center; padding: .3rem 0; }

.db-backup { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: space-between; align-items: center; border: 1px solid var(--line); border-radius: 14px; padding: .8rem 1rem; margin: .4rem 0 1rem; }
.db-backup > div { flex: 1 1 260px; }

@media (max-width: 640px) {
  .aud-opts, .rem-status { grid-template-columns: 1fr; }
  .ev-grid, .rem-grid { grid-template-columns: 1fr; }
  .gp-list { grid-template-columns: 1fr; }
  .gp-item { padding: .5rem .3rem; }
  .guest-pick { max-height: 60vh; }
  .ev-presets-head .kpi-icon, .rem-head .kpi-icon { display: none; }
  .silent-act .btn, .map-btns .btn { min-height: 38px; }
}
@media (max-width: 640px) {
  .rem-status { gap: .35rem; }
  .rem-stat { flex-direction: row; justify-content: space-between; align-items: baseline; gap: .6rem; padding: .5rem .7rem; }
  .rem-stat strong { text-align: right; font-size: .9rem; }
}
@media (max-width: 640px) { .rem-stat small { white-space: nowrap; } }
.db-access { border-top: 1px solid var(--line); padding-top: .7rem; }
.db-access summary { cursor: pointer; padding: .3rem 0; }
.db-access form { margin-top: .8rem; }

/* ---------- Pakiety w panelu, ofercie i zakupie (2026-10-19) ---------- */
.plan-h { display: flex; align-items: center; gap: .45rem; }
.plan-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1.2rem 0 .4rem; align-items: stretch; }
.plan-card { position: relative; display: flex !important; flex-direction: column; gap: .25rem; margin: 0 !important; padding: 1.4rem 1.2rem 1.1rem; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); font-weight: 400; transition: border-color .15s, box-shadow .15s, transform .15s; }
.plan-card.is-hl { border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); }
.plan-badge { position: absolute; top: -.7rem; left: 1rem; padding: .18rem .6rem; border-radius: 999px; background: var(--accent); color: var(--on-accent, #fff); font-size: .72rem; font-weight: 600; white-space: nowrap; }
.plan-name { font-size: .78rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-strong); }
.plan-price { display: flex; align-items: baseline; gap: .45rem; flex-wrap: wrap; }
.plan-price strong { font: 600 2.1rem/1.1 var(--font-display); color: var(--text); }
.plan-price small { color: var(--muted); font-size: .76rem; }
.plan-month { font-size: .82rem; color: var(--muted); }
.plan-desc { font-size: .88rem; margin-top: .2rem; }
.plan-list { list-style: none; margin: .8rem 0 1rem; padding: .8rem 0 0; border-top: 1px dashed var(--line); display: grid; gap: .4rem; font-size: .86rem; }
.plan-list li { display: flex; gap: .4rem; align-items: center; }
.plan-list .icon { flex: none; width: 15px; height: 15px; color: var(--ok); }
.plan-card .btn { margin-top: auto; }
.plan-cards.is-picker .plan-card { cursor: pointer; }
.plan-cards.is-picker .plan-card:hover { border-color: var(--accent); }
.plan-card input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.plan-pick { margin-top: auto; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; padding: .5rem; border-radius: 999px; border: 1px solid var(--line); font-size: .85rem; color: var(--muted); }
.plan-pick .icon { width: 14px; height: 14px; opacity: 0; }
.plan-card:has(input:checked) { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent) inset; background: color-mix(in srgb, var(--accent) 5%, var(--surface)); }
.plan-card:has(input:checked) .plan-pick { background: var(--accent); border-color: var(--accent); color: var(--on-accent, #fff); }
.plan-card:has(input:checked) .plan-pick .icon { opacity: 1; }
.plan-card:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.billing-plans .plan-cards { margin-top: 1.4rem; }
@media (max-width: 860px) {
  .plan-cards { grid-template-columns: 1fr; gap: 1.1rem; }
}
.adm-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: .8rem; margin: .4rem 0 1rem; }
.adm-plan { border: 1px solid var(--line); border-radius: 14px; padding: .7rem .9rem .3rem; margin: 0; min-width: 0; }
.adm-plan legend { font-weight: 600; padding: 0 .3rem; }
.adm-plan-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 .6rem; }
.adm-plan-grid .wide, .adm-plan-grid label:first-child { grid-column: 1 / -1; }
@media (max-width: 1100px) { .adm-plans { grid-template-columns: 1fr; } }
.plan-pick .pp-on { display: none; align-items: center; gap: .35rem; }
.plan-pick .pp-on .icon { opacity: 1; }
.plan-card:has(input:checked) .plan-pick .pp-on { display: inline-flex; }
.plan-card:has(input:checked) .plan-pick .pp-off { display: none; }
@media (max-width: 860px) {
  .plan-cards.is-picker .plan-list { display: none; }
  .plan-cards.is-picker .plan-card { padding: 1.1rem 1rem .9rem; }
  .plan-cards.is-picker .plan-pick { margin-top: .6rem; }
}

/* ---------- Ostatnia aktywność pary i gości (admin) ---------- */
.wl-seen { display: inline-flex; align-items: center; gap: .4rem; margin-top: .3rem; font-size: .76rem; color: var(--muted); }
.wl-seen i { width: 8px; height: 8px; border-radius: 50%; background: color-mix(in srgb, var(--muted) 45%, transparent); flex: none; }
.wl-seen.is-now { color: var(--ok); font-weight: 600; }
.wl-seen.is-now i { background: var(--ok); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 20%, transparent); }
.wl-seen.is-recent i { background: var(--warn); }
.adm-activity { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; padding: .9rem 1rem; }
.adm-act { display: flex; gap: .7rem; align-items: flex-start; min-width: 0; }
.adm-act > div { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.adm-act small { color: var(--muted); font-size: .76rem; }
.adm-act strong { font-size: .98rem; }
.adm-act-ic { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; flex: none; background: var(--accent-soft); color: var(--accent); }
.adm-act-ic .icon { width: 18px; height: 18px; }
.adm-act-dot { width: 14px; height: 14px; margin: 11px; border-radius: 50%; flex: none; background: color-mix(in srgb, var(--muted) 45%, transparent); }
.adm-act.is-now .adm-act-dot { background: var(--ok); box-shadow: 0 0 0 5px color-mix(in srgb, var(--ok) 18%, transparent); }
.adm-act.is-recent .adm-act-dot { background: var(--warn); }
.adm-act.is-now strong { color: var(--ok); }
@media (max-width: 760px) { .adm-activity { grid-template-columns: 1fr; } }

/* ---------- Statystyki: sekcje-karty, równa siatka kafli (2026-10-19) ---------- */
.sv-sec { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.3rem 1.4rem 1.4rem; margin: 1.2rem 0; scroll-margin-top: 4.5rem; }
.sv-head { display: flex; align-items: center; gap: .8rem; margin-bottom: 1.1rem; padding-bottom: .9rem; border-bottom: 1px solid var(--line); }
.sv-head h2 { margin: 0; font-size: 1.2rem; }
.sv-head p { margin: .1rem 0 0; color: var(--muted); font-size: .86rem; }
.sv-head-ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--accent-soft); color: var(--accent); flex: none; }
.sv-head-ic .icon { width: 20px; height: 20px; }
.st-grid.sv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin: 0; }
.st-grid.sv-grid.c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.st-card.sv-tile { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: 1fr auto; align-items: start; gap: .1rem .8rem; padding: .95rem 1rem; box-shadow: none; background: color-mix(in srgb, var(--surface-2) 45%, var(--surface)); }
.st-card.sv-tile::after { display: none; }
.sv-ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--surface); border: 1px solid var(--line); font-size: 1.35rem; line-height: 1; grid-row: 1; }
.sv-txt { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.sv-txt > strong { font: 600 1.6rem/1.15 var(--font-display); }
.sv-txt > strong.st-name { font-size: 1.12rem; line-height: 1.25; }
.sv-txt > span { font-weight: 500; font-size: .9rem; }
.sv-txt > small { color: var(--muted); font-size: .78rem; line-height: 1.35; }
.sv-tile > .st-meter { grid-column: 1 / -1; margin-top: .55rem; }
.sv-tile.is-ok .sv-ic { border-color: color-mix(in srgb, var(--ok) 35%, var(--line)); }
.sv-tile.is-gold .sv-ic { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }
.st-card.sv-tile.st-card-ring { grid-template-columns: auto minmax(0, 1fr); align-items: center; }
.sv-panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin-top: .9rem; }
.sv-panel { border: 1px solid var(--line); border-radius: 14px; padding: 1rem 1.1rem; min-width: 0; }
.sv-panel h3 { margin: 0 0 .7rem; font-size: 1rem; }
.sv-panel.sv-wide { grid-column: 1 / -1; margin-top: .9rem; }
.sv-sec > .sv-panel.st-empty, .sv-sec > .sv-panel.sv-wide { margin-top: .9rem; }
.sv-note { margin: .4rem 0 0; }
@media (max-width: 1100px) {
  .st-grid.sv-grid.c4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .st-grid.sv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sv-panels { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .sv-sec { padding: 1rem .9rem 1.1rem; border-radius: 16px; }
  .sv-head { gap: .6rem; margin-bottom: .8rem; padding-bottom: .7rem; }
  .sv-head-ic { width: 36px; height: 36px; }
  .st-grid.sv-grid, .st-grid.sv-grid.c4 { grid-template-columns: 1fr; gap: .55rem; }
  .st-card.sv-tile { padding: .75rem .8rem; }
  .sv-ic { width: 38px; height: 38px; font-size: 1.15rem; }
  .sv-txt > strong { font-size: 1.35rem; }
}

/* ---------- Menu weselne: karta jak w restauracji (2026-10-19) ---------- */
.mn-diets .diet-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.mn-diets .diet-tile { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: .1rem .45rem; padding: .7rem .85rem; }
.mn-diets .diet-tile small { flex-basis: 100%; }
.mn-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr); gap: 1.2rem; align-items: start; margin-top: 1.2rem; }
.mn-form { position: sticky; top: 1rem; }
.mn-form h2 { display: flex; align-items: center; gap: .4rem; }
.mn-card { padding: clamp(.8rem, 2vw, 1.2rem); background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 5%, var(--surface)), var(--surface)); }
.mn-frame { position: relative; padding: clamp(1.6rem, 4vw, 2.6rem) clamp(1rem, 4vw, 2.6rem); border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 10px; outline: 1px solid color-mix(in srgb, var(--accent) 25%, transparent); outline-offset: 5px; text-align: center; }
.mn-head { margin-bottom: 1.4rem; }
.mn-orn { display: block; font-size: 1.8rem; line-height: 1; color: var(--accent); }
.mn-kicker { margin: .5rem 0 0; font-size: .74rem; letter-spacing: .22em; text-transform: uppercase; color: var(--accent-strong); }
.mn-title { margin: .25rem 0 .1rem; font: 600 clamp(1.9rem, 4vw, 2.5rem)/1.1 var(--font-display); letter-spacing: .01em; }
.mn-date { margin: 0; font-style: italic; color: var(--muted); font-size: .9rem; }
.mn-course { display: flex; align-items: center; gap: .8rem; margin: 1.6rem 0 .8rem; font: 600 .82rem/1.2 var(--font-body); letter-spacing: .2em; text-transform: uppercase; color: var(--accent-strong); }
.mn-course-name { display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; }
.mn-course-emo { font-size: 1rem; letter-spacing: 0; }
.mn-line { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 55%, transparent), transparent); }
.mn-items { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.mn-items li { position: relative; display: flex; justify-content: center; padding: .55rem 2.6rem; border-radius: 10px; transition: background .15s; }
.mn-items li:hover { background: color-mix(in srgb, var(--accent) 6%, transparent); }
.mn-dish { display: flex; flex-direction: column; align-items: center; gap: .2rem; }
.mn-dish-name { font: 600 1.15rem/1.3 var(--font-display); }
.mn-dish-desc { font-style: italic; color: var(--muted); font-size: .9rem; line-height: 1.4; max-width: 34em; }
.mn-tags { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem; margin-top: .15rem; }
.mn-tag { font-size: .7rem; padding: .08rem .45rem; border-radius: 999px; background: color-mix(in srgb, var(--accent) 9%, var(--surface)); border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent); color: var(--text); white-space: nowrap; }
.mn-act { position: absolute; right: .3rem; top: 50%; transform: translateY(-50%); display: flex; gap: .1rem; opacity: 0; transition: opacity .15s; }
.mn-items li:hover .mn-act, .mn-items li:focus-within .mn-act { opacity: 1; }
.mn-empty { margin: 1rem auto; max-width: 28em; }
@media (hover: none) { .mn-act { opacity: 1; } }
@media (max-width: 900px) {
  .mn-layout { grid-template-columns: 1fr; }
  .mn-form { position: static; order: -1; }
}
@media (max-width: 640px) {
  .mn-items li { flex-direction: column; align-items: center; padding: .5rem .2rem; }
  .mn-act { position: static; transform: none; justify-content: center; margin-top: .2rem; }
  .mn-course { gap: .5rem; letter-spacing: .14em; }
}
.mn-head .mn-title, .mn-card h2.mn-title { display: block; text-align: center; justify-content: center; }
.mn-card h3.mn-course { justify-content: center; }

/* ---------- Pokaz slajdów (2026-10-19) ---------- */
.sl-hero { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1.4rem 1.8rem; align-items: center; padding: 1.4rem 1.6rem; }
.sl-screen { position: relative; display: flex; flex-direction: column; align-items: center; }
.sl-screen-in { display: grid; place-items: center; width: 150px; height: 96px; border-radius: 12px; background: linear-gradient(135deg, #2b2622, #463a30); border: 5px solid #1d1916; color: #f1dfb8; box-shadow: var(--shadow); }
.sl-screen-in .icon { width: 34px; height: 34px; }
.sl-hero.is-on .sl-screen-in { background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 70%, #2b2622), #2b2622); }
.sl-stand { width: 46px; height: 10px; margin-top: 2px; border-radius: 0 0 8px 8px; background: #1d1916; }
.sl-hero-main h2 { margin: .45rem 0 .6rem; }
.sl-state { display: inline-flex; align-items: center; gap: .3rem; }
.sl-state .icon { width: 13px; height: 13px; }
.sl-link { display: flex; gap: .4rem; max-width: 560px; }
.sl-link input { margin: 0; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .86rem; }
.sl-cta { margin: .7rem 0 .4rem; }
.sl-steps { margin: .6rem 0 .4rem; padding-left: 1.2rem; color: var(--text); display: grid; gap: .15rem; }
.sl-steps kbd { padding: 0 .35rem; border: 1px solid var(--line); border-radius: 5px; background: var(--surface-2); font-size: .8em; }
.sl-warn { display: flex; gap: .35rem; align-items: flex-start; margin: .2rem 0 0; }
.sl-warn .icon { flex: none; width: 15px; height: 15px; margin-top: .1rem; color: var(--accent); }
.sl-qr { display: flex; flex-direction: column; align-items: center; gap: .45rem; padding: .8rem; border: 1px solid var(--line); border-radius: 16px; background: #fff; max-width: 170px; text-align: center; }
.sl-qr .qr { margin: 0; }
.sl-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; align-items: start; margin-top: 1.2rem; }
.sl-box h2 { display: flex; align-items: center; gap: .55rem; font-size: 1.05rem; margin: 0 0 .9rem; }
.sl-box-ic { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--accent-soft); color: var(--accent); }
.sl-box-ic .icon { width: 17px; height: 17px; }
.sl-sw { padding: .65rem 0 !important; }
.sl-sw strong { display: inline-flex; align-items: center; gap: .35rem; font-size: .92rem; }
.sl-sw strong .icon { width: 15px; height: 15px; color: var(--accent); }
.sl-note { display: flex; gap: .35rem; align-items: flex-start; margin: .7rem 0 0; }
.sl-note .icon { flex: none; width: 14px; height: 14px; margin-top: .15rem; }
.sl-polls { border: 1px solid var(--line); border-radius: 12px; padding: .5rem .8rem .3rem; margin: .8rem 0 0; }
.sl-polls legend { font-size: .86rem; font-weight: 600; padding: 0 .3rem; }
.sl-actions { position: sticky; bottom: .8rem; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: 1rem; padding: .8rem 1rem; box-shadow: var(--shadow); }
.sl-actions-sp { flex: 1; }
@media (max-width: 1100px) {
  .sl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sl-hero { grid-template-columns: minmax(0, 1fr) auto; }
  .sl-screen { display: none; }
}
@media (max-width: 760px) {
  .sl-grid { grid-template-columns: 1fr; }
  .sl-hero { grid-template-columns: 1fr; padding: 1.1rem; }
  .sl-qr { flex-direction: row; max-width: none; text-align: left; }
  .sl-actions { bottom: calc(var(--tabbar-h, 64px) + .6rem); }
  .sl-actions .btn { flex: 1 1 auto; }
  .sl-actions-sp { display: none; }
}

/* ===== Konto pary (/panel/account) ===== */
.ac-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem 1.5rem; align-items: center; }
.ac-who { display: flex; gap: 1rem; align-items: center; min-width: 0; }
.ac-who h2 { margin: 0 0 .15rem; }
.ac-who p { margin: 0; overflow-wrap: anywhere; }
.ac-ava { display: grid; place-items: center; width: 56px; height: 56px; flex: none; border-radius: 16px; background: var(--accent); color: var(--on-accent); font-weight: 600; font-size: 1.1rem; letter-spacing: .02em; }
.ac-more { justify-self: end; }
.ac-dates { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.ac-date { display: flex; flex-direction: column; gap: .1rem; padding: .75rem .9rem; border: 1px solid var(--line); border-radius: 12px; background: var(--accent-soft); }
.ac-date small { color: var(--muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; }
.ac-date strong { font-size: 1.05rem; }
.ac-date span { color: var(--muted); font-size: .8rem; }
.ac-date.is-warn { border-color: color-mix(in srgb, #c0392b 45%, var(--line)); background: color-mix(in srgb, #c0392b 8%, var(--surface, transparent)); }
.ac-hero .ac-more { grid-column: 1 / -1; justify-self: start; }
.ac-nav { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 .25rem; }
.ac-nav a { display: inline-flex; align-items: center; gap: .35rem; padding: .4rem .8rem; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; font-size: .9rem; color: inherit; }
.ac-nav a:hover { background: var(--accent-soft); color: var(--accent-strong); }
.ac-nav .icon { color: var(--accent); }
.ac-h { display: flex; align-items: center; gap: .5rem; margin: 1.6rem 0 .7rem; font-size: 1.15rem; scroll-margin-top: 80px; }
.ac-h .icon { color: var(--accent); }
.ac-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.ac-grid > .card { margin: 0; min-width: 0; }
.ac-grid > .card:only-child, .ac-grid > #slub { grid-column: 1 / -1; }
.ac-grid > .card h2 .icon { color: var(--accent); }
.ac-promo { margin-top: 1.6rem; }
#slub, #telefon, #powiadomienia, #kod { scroll-margin-top: 80px; }
@media (max-width: 760px) {
  .ac-grid, .ac-dates { grid-template-columns: 1fr; }
  .ac-ava { width: 46px; height: 46px; border-radius: 13px; }
  .ac-nav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: -2px; }
  .ac-nav a { flex: none; }
  .ac-dates { gap: .5rem; }
  .ac-date { flex-direction: row; flex-wrap: wrap; align-items: baseline; column-gap: .5rem; }
  .ac-date small { width: 100%; }
}
.ac-first { margin-top: 1rem; }

/* ===== Ankiety: zapis jednym kliknięciem, wybrana odpowiedź na zielono ===== */
:root { --pick: #2e9a5a; --pick-soft: #e4f5ea; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --pick: #5fcf8a; --pick-soft: #1c3326; } }
:root[data-theme="dark"] { --pick: #5fcf8a; --pick-soft: #1c3326; }
.poll-answer.is-auto .poll-submit { display: none; }
.poll-answer.is-busy .poll-choices { opacity: .75; pointer-events: none; }
.poll-choice.is-saved input + span, .invitation .poll-choice.is-saved input + span { border-color: var(--pick); background: var(--pick-soft); color: var(--text); font-weight: 600; box-shadow: inset 0 0 0 1px var(--pick); }
.poll-choice.is-saved input + span .tick, .invitation .poll-choice.is-saved input + span .tick { background: var(--pick); border-color: var(--pick); color: #fff; }
.poll-choice.is-pop span { animation: pick-pop .45s cubic-bezier(.2,.8,.2,1.2); }
@keyframes pick-pop { 0% { transform: scale(.97); } 55% { transform: scale(1.025); } 100% { transform: none; } }
.poll-hint { margin: 0 0 .35rem; }
.poll-saved { display: flex; align-items: center; gap: .4rem; margin: .2rem 0 .4rem; color: var(--pick); font-weight: 600; font-size: .9rem; }
.poll-saved[hidden] { display: none; }
.poll-saved .icon { width: 1.1rem; height: 1.1rem; }
.poll-saved.is-err { color: var(--danger, #b0473f); }

/* ===== „Będę!” – animacje do wyboru (serca, konfetti, fajerwerki, płatki, złoto, balony, obrączki) i karta ===== */
.cel-layer { position: fixed; inset: 0; z-index: 9999; pointer-events: none; overflow: hidden; transition: background .6s ease; }
.cel-cv { position: absolute; inset: 0; width: 100%; height: 100%; }
.cel-layer.is-night { background: rgba(12, 10, 30, .62); animation: cel-night .5s ease both; }
@keyframes cel-night { from { background: rgba(12, 10, 30, 0); } }
.cel-layer.is-out { background: transparent; }
.cel-layer.is-out .cel-cv, .cel-layer.is-out .cel-rings { opacity: 0; transition: opacity .6s; }
/* Karta na środku: znak ✓ rysuje się kreską, emotka stylu wskakuje w róg */
.cel-note { position: absolute; left: 50%; top: 50%; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: .3rem; box-sizing: border-box;
  width: min(330px, calc(100vw - 40px)); padding: 1.5rem 1.4rem 1.25rem; border-radius: 26px; text-align: center; color: #2d261f; cursor: pointer; pointer-events: auto;
  background: rgba(255, 255, 255, .94); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 26px 70px -14px rgba(0, 0, 0, .4), 0 0 0 1px rgba(255, 255, 255, .6) inset;
  transform: translate(-50%, -50%) scale(.82); opacity: 0; animation: cel-in .7s cubic-bezier(.2, 1.2, .3, 1) .25s forwards; }
.cel-s-fireworks .cel-note, .cel-s-rings .cel-note { top: 64%; }
.cel-note strong { font-family: var(--f, inherit); font-size: 1.35rem; line-height: 1.2; font-weight: 600; }
.cel-note small { color: #7a7166; font-size: .85rem; }
.cel-note-ic { position: relative; width: 66px; height: 66px; margin-bottom: .35rem; }
.cel-note-ic svg { width: 100%; height: 100%; fill: none; stroke: var(--c); stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; }
.cel-note-ic circle { stroke-dasharray: 151; stroke-dashoffset: 151; animation: cel-draw .7s ease-out .45s forwards; }
.cel-note-ic path { stroke-dasharray: 40; stroke-dashoffset: 40; animation: cel-draw .45s ease-out 1s forwards; }
.cel-note-ic::before { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: color-mix(in srgb, var(--c) 12%, transparent); transform: scale(0); animation: cel-pop .5s cubic-bezier(.2, 1.4, .3, 1) .9s forwards; }
.cel-note-ic i { position: absolute; right: -10px; bottom: -6px; font-style: normal; font-size: 1.6rem; line-height: 1; transform: scale(0) rotate(-30deg); animation: cel-pop .55s cubic-bezier(.2, 1.6, .3, 1) 1.25s forwards; }
@keyframes cel-in { to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
@keyframes cel-draw { to { stroke-dashoffset: 0; } }
@keyframes cel-pop { to { transform: scale(1) rotate(0); } }
.cel-layer.is-out .cel-note { animation: none; opacity: 0; transform: translate(-50%, -46%) scale(.94); transition: opacity .5s, transform .5s; }
/* Obrączki: wlatują z boków, splatają się, błysk */
.cel-rings { position: absolute; left: 50%; top: 34%; width: 0; height: 0; z-index: 1; }
.cel-rings svg { position: absolute; width: 118px; height: 118px; margin: -59px 0 0 -59px; overflow: visible; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .25)); }
.cel-rings circle { fill: none; stroke: #e2b44f; stroke-width: 7; }
.cel-rings path { fill: #eaf7ff; stroke: #9bc3d8; stroke-width: 1.5; stroke-linejoin: round; }
.cel-ring-a { animation: cel-ring-a 1s cubic-bezier(.2, .8, .25, 1.15) forwards; }
.cel-ring-b { animation: cel-ring-b 1s cubic-bezier(.2, .8, .25, 1.15) .08s forwards; transform: translateX(60vw); }
@keyframes cel-ring-a { from { transform: translateX(-60vw) rotate(-260deg); } to { transform: translateX(-24px) rotate(0); } }
@keyframes cel-ring-b { from { transform: translateX(60vw) rotate(260deg); } to { transform: translateX(24px) rotate(0); } }
.invitation { --pick: #2e9a5a; --pick-soft: #e4f5ea; }

/* ===== Wysyłka zaproszeń (/panel/send) ===== */
.sd-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.sd-kpi { display: flex; gap: .7rem; align-items: center; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); min-width: 0; }
.sd-kpi > div { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.sd-kpi small { color: var(--muted); font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; }
.sd-kpi strong { font-size: 1.35rem; line-height: 1.2; }
.sd-kpi strong span { font-size: .85rem; color: var(--muted); font-weight: 500; }
.sd-kpi-sub { font-size: .78rem; color: var(--muted); }
a.sd-kpi-sub { color: var(--accent-strong); }
.sd-kpi-ic { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 12px; background: var(--accent-soft); color: var(--accent-strong); }
.sd-kpi.is-ok .sd-kpi-ic { background: var(--ok-soft); color: var(--ok); }
.sd-kpi.is-warn .sd-kpi-ic { background: var(--warn-soft); color: var(--warn); }
.sd-kpi.is-bad .sd-kpi-ic { background: var(--danger-soft); color: var(--danger); }
.sd-bar { display: block; height: 5px; margin-top: .35rem; border-radius: 9px; background: var(--surface-2); overflow: hidden; }
.sd-bar b { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.sd-kpi.is-warn .sd-bar b { background: var(--warn); }
.sd-kpi.is-bad .sd-bar b { background: var(--danger); }

.sd-card { padding: 0; overflow: clip; }
.sd-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; padding: 1rem 1.1rem .4rem; }
.sd-head h2 { margin: 0; }
.sd-channels { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.sd-ch { margin: 0 !important; cursor: pointer; font-weight: 500; }
.sd-ch input { position: absolute; opacity: 0; pointer-events: none; }
.sd-ch > span { display: inline-flex; align-items: center; gap: .35rem; padding: .45rem .8rem; border: 1.5px solid var(--line); border-radius: 999px; font-size: .9rem; transition: background .15s, border-color .15s, color .15s; }
.sd-ch > span small { color: var(--muted); font-size: .75rem; }
.sd-ch .icon { width: 1rem; height: 1rem; }
.sd-ch input:checked + span { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-strong); font-weight: 600; }
.sd-ch input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.sd-ch.is-off { opacity: .55; cursor: not-allowed; }

.sd-tools { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; padding: .5rem 1.1rem .8rem; }
.sd-search { position: relative; flex: 1 1 220px; margin: 0 !important; }
.sd-search .icon { position: absolute; left: .75rem; top: 50%; transform: translateY(-50%); color: var(--muted); width: 1rem; height: 1rem; }
.sd-search input { width: 100%; padding-left: 2.2rem; border-radius: 999px; margin: 0; }
.sd-filters { display: flex; gap: .3rem; flex-wrap: wrap; }
.sd-filters button { display: inline-flex; align-items: center; gap: .35rem; padding: .4rem .75rem; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--text); font: inherit; font-size: .85rem; cursor: pointer; }
.sd-filters button b { font-weight: 600; font-size: .75rem; padding: .05rem .4rem; border-radius: 999px; background: var(--surface-2); color: var(--muted); }
.sd-filters button.is-on { background: var(--text); border-color: var(--text); color: var(--surface); }
.sd-filters button.is-on b { background: color-mix(in srgb, var(--surface) 22%, transparent); color: var(--surface); }

.sd-table-wrap { border-top: 1px solid var(--line); }
.sd-table { width: 100%; border-collapse: collapse; }
.sd-table th { position: sticky; top: 0; z-index: 1; background: var(--surface-2); text-align: left; font-size: .74rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); padding: .55rem .7rem; border-bottom: 1px solid var(--line); }
.sd-table td { padding: .6rem .7rem; border-bottom: 1px solid var(--line); vertical-align: middle; }
.sd-table tbody tr { cursor: pointer; transition: background .12s; }
.sd-table tbody tr:hover { background: color-mix(in srgb, var(--accent-soft) 45%, transparent); }
.sd-table tbody tr.is-sel { background: var(--accent-soft); }
.sd-table tbody tr:last-child td { border-bottom: 0; }
.sd-c { width: 44px; text-align: center !important; padding-left: 1.1rem !important; }
.sd-c input { width: 1.15rem; height: 1.15rem; accent-color: var(--accent); cursor: pointer; }
.sd-who { display: flex; align-items: center; gap: .65rem; min-width: 0; }
.sd-who > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.sd-who strong { font-weight: 600; }
.sd-who small { color: var(--muted); font-size: .78rem; }
.sd-ava { display: grid; place-items: center; width: 36px; height: 36px; flex: none; border-radius: 50%; background: var(--accent-soft); color: var(--accent-strong); font-size: .78rem; font-weight: 600; }
.sd-contact { font-size: .82rem; }
.sd-ct { display: flex; align-items: center; gap: .35rem; color: var(--muted); max-width: 240px; }
.sd-ct em { font-style: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sd-ct .icon { width: .9rem; height: .9rem; flex: none; opacity: .5; }
.sd-ct.is-on { color: var(--text); }
.sd-ct.is-on .icon { color: var(--ok); opacity: 1; }
.sd-ct:not(.is-on) em { font-style: italic; opacity: .7; }
.sd-status { white-space: nowrap; }
.sd-pill { display: inline-flex; align-items: center; gap: .25rem; padding: .18rem .55rem; border-radius: 999px; font-size: .75rem; font-weight: 600; background: var(--surface-2); color: var(--muted); margin: .1rem .15rem .1rem 0; }
.sd-pill .icon { width: .8rem; height: .8rem; }
.sd-pill.is-inv, .sd-pill.is-yes { background: var(--ok-soft); color: var(--ok); }
.sd-pill.is-no { background: var(--danger-soft); color: var(--danger); }
.sd-pill.is-wait { background: var(--warn-soft); color: var(--warn); }
.sd-pill.is-email { background: var(--accent-soft); color: var(--accent-strong); }
.sd-pill.is-sms { background: var(--ok-soft); color: var(--ok); }
.sd-a { text-align: right !important; white-space: nowrap; padding-right: 1.1rem !important; }
.sd-act { display: inline-flex; align-items: center; justify-content: center; gap: .3rem; height: 34px; min-width: 34px; padding: 0 .55rem; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--text); font: inherit; font-size: .82rem; cursor: pointer; transition: background .12s, border-color .12s; }
.sd-act:hover { border-color: var(--accent); color: var(--accent-strong); }
.sd-act .icon { width: .95rem; height: .95rem; }
.sd-act.is-main { background: var(--accent); border-color: var(--accent); color: var(--on-accent); font-weight: 600; padding: 0 .75rem; }
.sd-act.is-main:hover { background: var(--accent-strong); color: var(--on-accent); }
.sd-none { padding: 1rem 1.1rem; margin: 0; }
.sd-sendbar { position: sticky; bottom: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .75rem 1.1rem; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(6px); }
.sd-sel { font-size: .9rem; color: var(--muted); }
.sd-card.has-sel .sd-sel { color: var(--text); font-weight: 600; }

.sd-rem { margin-top: 1rem; }
.sd-rem-top { display: flex; align-items: center; gap: .8rem; }
.sd-rem-txt { flex: 1; min-width: 0; }
.sd-rem-txt h2 { margin: 0 0 .15rem; }
.sd-rem-txt p { margin: 0; color: var(--muted); font-size: .9rem; }
.sd-rem-ic { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 14px; background: var(--surface-2); color: var(--muted); }
.sd-rem-ic.is-on { background: var(--ok-soft); color: var(--ok); }
.sd-rem-ic.is-warn { background: var(--warn-soft); color: var(--warn); }
.sd-rem-line { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 1rem 0 .3rem; padding: .8rem .9rem; border-radius: 14px; background: var(--surface-2); font-size: .95rem; }
.sd-rem-line input[type=number] { width: 4.2rem; text-align: center; margin: 0; }
.sd-rem-line input[type=date] { width: auto; margin: 0; }
.sd-rem-by { margin-left: .2rem; }
.sd-rem-note { margin: .3rem 0 .6rem; }
.sd-rem-more { margin: 0 0 .8rem; }
.sd-rem-more summary { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; color: var(--accent-strong); font-weight: 600; font-size: .9rem; }
.sd-rem-more[open] summary { margin-bottom: .5rem; }
.sd-rem-btns { margin-top: .2rem; }

.sd-log { margin-top: 1rem; }
.sd-log > summary { display: flex; align-items: center; gap: .5rem; cursor: pointer; list-style: none; }
.sd-log > summary::-webkit-details-marker { display: none; }
.sd-log > summary h2 { margin: 0; }
.sd-log-t { width: 100%; border-collapse: collapse; margin-top: .6rem; font-size: .88rem; }
.sd-log-t td { padding: .45rem .4rem; border-top: 1px solid var(--line); vertical-align: middle; }
.sd-log-t td:first-child { width: 1%; white-space: nowrap; }
.sd-log-t small { display: block; }
.sd-err { color: var(--danger); }
.sd-log-when { color: var(--muted); white-space: nowrap; width: 1%; }
.sd-log-st { width: 1%; color: var(--ok); }
.sd-log-t tr.is-fail .sd-log-st { color: var(--danger); }

@media (max-width: 900px) {
  .sd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .sd-kpi { padding: .7rem .75rem; gap: .55rem; }
  .sd-kpi-ic { width: 34px; height: 34px; border-radius: 10px; }
  .sd-kpi strong { font-size: 1.15rem; }
  .sd-head, .sd-tools { padding-left: .9rem; padding-right: .9rem; }
  .sd-filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%; }
  .sd-filters button { flex: none; }
  .sd-table thead { display: none; }
  .sd-table, .sd-table tbody { display: block; }
  .sd-table tr { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: .35rem .5rem; align-items: center; padding: .7rem .9rem; border-bottom: 1px solid var(--line); }
  .sd-table td { display: block; padding: 0; border: 0; }
  .sd-c { padding-left: 0 !important; width: auto; }
  .sd-who { grid-column: 2; }
  .sd-a { grid-column: 3; grid-row: 1; padding-right: 0 !important; }
  .sd-a .is-main span { display: none; }
  .sd-contact, .sd-status { grid-column: 2 / -1; }
  .sd-contact { display: flex; flex-wrap: wrap; gap: .1rem .8rem; }
  .sd-ct { max-width: 100%; }
  .sd-sendbar { padding: .65rem .9rem; bottom: calc(var(--tabbar-h, 64px) + env(safe-area-inset-bottom, 0px)); }
  .sd-rem-line { font-size: .9rem; }
}

/* Galeria pary: pobranie pojedynczego pliku z rozmiarem */
.gi-dl { display: inline-flex; align-items: center; gap: .3rem; min-height: 34px; padding: 0 .55rem; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--text); font: inherit; font-size: .78rem; font-weight: 600; text-decoration: none; cursor: pointer; white-space: nowrap; font-variant-numeric: tabular-nums; }
.gi-dl .icon { width: .95rem; height: .95rem; color: var(--accent-strong); }
a.gi-dl:hover, button.gi-dl:hover { border-color: var(--accent); color: var(--accent-strong); }
.gi-dl.is-size { cursor: default; color: var(--muted); font-weight: 500; }
.gi-dl.is-size .icon { color: var(--muted); }
.gi-dl.is-busy { position: relative; pointer-events: none; opacity: .8; }
.gi-dl.is-busy[data-progress]::after { content: attr(data-progress); margin-left: .2rem; color: var(--accent-strong); }
@media (max-width: 760px), (pointer: coarse) { .gi-dl { min-height: 38px; } }
.gi-acts { flex-wrap: wrap; } @media (max-width: 760px) { .gi-dl { flex: 1 1 100%; justify-content: center; } }

/* Historia wysyłki – wiersze rozwijane z podglądem wysłanej treści */
.sd-log > summary.sd-log-head { display: flex; align-items: center; gap: .55rem; cursor: pointer; list-style: none; }
.sd-log > summary.sd-log-head::-webkit-details-marker { display: none; }
.sd-log-title { font-family: var(--font-display); font-size: 1.45rem; font-weight: 600; line-height: 1.2; }
.sd-log-count { display: inline-grid; place-items: center; min-width: 1.6rem; height: 1.6rem; padding: 0 .45rem; border-radius: 999px; background: var(--accent-soft); color: var(--accent-strong); font-size: .8rem; font-weight: 700; line-height: 1; }
.sd-log-chev { margin-left: auto; display: grid; place-items: center; color: var(--muted); transition: transform .2s; }
.sd-log[open] > .sd-log-head .sd-log-chev { transform: rotate(180deg); }
.sd-log-hint { margin: .4rem 0 .5rem; }
.sd-log-list { border-top: 1px solid var(--line); }
.sd-log-row { border-bottom: 1px solid var(--line); }
.sd-log-row > summary { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto 22px; gap: .6rem; align-items: center; padding: .55rem .2rem; cursor: pointer; list-style: none; font-size: .9rem; }
.sd-log-row > summary::-webkit-details-marker { display: none; }
.sd-log-row > summary:hover { background: color-mix(in srgb, var(--accent-soft) 45%, transparent); }
.sd-log-row[open] > summary { background: var(--accent-soft); }
.sd-log-row .sd-pill { justify-self: start; margin: 0; }
.sd-log-who { display: flex; flex-direction: column; min-width: 0; }
.sd-log-who strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sd-log-who small { color: var(--muted); font-size: .76rem; }
.sd-log-who .sd-err { color: var(--danger); }
.sd-log-row .sd-log-when { color: var(--muted); white-space: nowrap; font-size: .82rem; font-variant-numeric: tabular-nums; }
.sd-log-row .sd-log-st { display: grid; place-items: center; color: var(--ok); }
.sd-log-row.is-fail .sd-log-st { color: var(--danger); }
.sd-log-row .sd-log-st .icon { width: 1.05rem; height: 1.05rem; }
.sd-log-body { padding: .6rem .3rem .9rem; }
.sd-log-body p { margin: .4rem 0 0; }
.sd-log-sms { max-width: 420px; padding: .65rem .85rem; border-radius: 16px 16px 16px 4px; background: var(--ok-soft); line-height: 1.45; overflow-wrap: anywhere; }
.sd-log-mail { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); overflow: hidden; }
.sd-log-subj { margin: 0 !important; padding: .55rem .8rem; background: var(--surface-2); border-bottom: 1px solid var(--line); font-size: .9rem; }
.sd-log-text { padding: .7rem .8rem; line-height: 1.5; font-size: .9rem; overflow-wrap: anywhere; max-height: 320px; overflow: auto; }
@media (max-width: 560px) {
  .sd-log-row > summary { grid-template-columns: auto minmax(0, 1fr) 22px; }
  .sd-log-row .sd-log-when { grid-column: 2; grid-row: 2; font-size: .75rem; }
  .sd-log-row .sd-log-st { grid-column: 3; grid-row: 1 / span 2; }
}

/* Lista gości: uchwyt przeciągania i widok według grup */
.g-head, .g-item { grid-template-columns: 26px minmax(0, 2.3fr) minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, .85fr) auto; }
.g-grip { display: grid; place-items: center; width: 26px; height: 34px; margin-left: -.4rem; padding: 0; border: 0; border-radius: 8px; background: none; color: var(--muted); cursor: grab; touch-action: none; }
.g-grip:hover { color: var(--accent-strong); background: var(--accent-soft); }
.g-grip .icon { width: 1.05rem; height: 1.05rem; }
.g-grip.is-off { cursor: default; opacity: .45; }
.g-grip.is-off:hover { background: none; color: var(--muted); }
.g-item.is-comp { background: color-mix(in srgb, var(--accent-soft) 35%, transparent); }
.g-list.is-sorting { user-select: none; -webkit-user-select: none; }
.g-list.is-sorting .g-grip { cursor: grabbing; }
.g-item.is-dragging { position: relative; z-index: 3; background: var(--surface); box-shadow: 0 10px 26px -12px rgba(0, 0, 0, .35); outline: 2px solid var(--accent); outline-offset: -2px; border-radius: 12px; }
.g-viewbar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; width: 100%; }
.g-view button { display: inline-flex; align-items: center; gap: .3rem; }
.g-view .icon { width: 1rem; height: 1rem; }
.g-dnd-hint { display: inline-flex; align-items: center; gap: .3rem; }
.g-dnd-hint .icon { width: .95rem; height: .95rem; }
.g-saved { margin-left: auto; color: var(--ok); font-weight: 600; }
.g-saved.is-err { color: var(--danger); }
.g-grp-head { display: flex; align-items: center; gap: .6rem; padding: .7rem 1.15rem .55rem; border-top: 1px solid var(--line); background: var(--surface-2); position: sticky; top: 0; z-index: 2; }
.g-grp-head[hidden] { display: none; }
.g-grp-name { font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; }
.g-grp-count { font-size: .78rem; color: var(--muted); }
.g-grp-yes { font-size: .74rem; font-weight: 600; padding: .1rem .5rem; border-radius: 999px; background: var(--ok-soft); color: var(--ok); }
.g-list.is-grouped .g-item:first-child, .g-list.is-grouped .g-grp-head + .g-item { border-top: 0; }
/* Zwijane grupy */
.g-grp-head { cursor: pointer; user-select: none; -webkit-user-select: none; min-height: 48px; }
.g-grp-head:hover { background: color-mix(in srgb, var(--accent-soft) 60%, var(--surface-2)); }
.g-grp-head:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.g-grp-chev { flex: none; width: 9px; height: 9px; margin: 0 .2rem 0 .1rem; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg) translate(-2px, -2px); transition: transform .2s; }
.g-grp-head.is-folded .g-grp-chev { transform: rotate(-45deg); }
.g-grp-head.is-folded { border-bottom: 0; }
.g-list:not(.is-searching) .g-item.g-fold-hide { display: none; }
.g-fold-all { display: inline-flex; gap: .3rem; flex-wrap: wrap; }
.g-fold-all[hidden] { display: none; }
.g-fold-all .icon { width: .95rem; height: .95rem; }
/* Formularz gościa: grupa z listy, przyjęcie, rodzina */
.g-grp-pick { display: grid; gap: .5rem; min-width: 0; }
.g-grp-new[hidden] { display: none; }
.g-recept > span { display: grid; gap: .15rem; }
.g-recept small { font-weight: 400; color: var(--muted); font-size: .78rem; line-height: 1.35; }
.g-comp-note { display: flex; align-items: center; gap: .4rem; }
.g-fam { border: 1px solid var(--line); border-radius: 14px; padding: .8rem .9rem .9rem; margin: .4rem 0 .9rem; min-width: 0; }
.g-fam legend { display: inline-flex; align-items: center; gap: .4rem; padding: 0 .35rem; font-weight: 600; }
.g-fam legend .icon { width: 1.05rem; height: 1.05rem; color: var(--accent-strong); }
.g-fam > p { margin: 0 0 .6rem; }
.g-fam-list { display: grid; gap: .55rem; }
.g-fam-list:empty { display: none; }
.g-fam-row { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) auto; gap: .5rem; align-items: end; padding: .6rem .65rem; border-radius: 12px; background: var(--surface-2); }
.g-fam-row label { margin: 0; min-width: 0; }
.g-fam-row .btn-ic { align-self: end; }
.g-fam-add { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .6rem; }
.g-cer { display: inline-flex; align-items: center; gap: .2rem; padding: .05rem .45rem; border-radius: 999px; background: var(--warn-soft); color: var(--warn); font-weight: 600; font-size: .72rem; }
.g-cer .icon { width: .85rem; height: .85rem; }
@media (max-width: 560px) {
  .g-fam { padding: .7rem .65rem .75rem; }
  .g-fam-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .g-fam-row .btn-ic { grid-column: 1 / -1; justify-self: end; min-width: 44px; min-height: 44px; }
}
@media (max-width: 760px) {
  .g-grip { width: 30px; height: 40px; margin-left: -.5rem; order: 0; }
  .g-meta { padding-left: 84px; }
  .g-grp-head { padding: .65rem 1rem .5rem; top: 56px; }
  .g-saved { margin-left: 0; }
}

/* Wklejanie listy gości – podgląd */
.imp-preview { margin: .6rem 0 .2rem; padding: .75rem .85rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2); }
.imp-preview[hidden] { display: none; }
.imp-sum { margin: 0 0 .4rem; font-size: .9rem; }
.imp-wrap { max-height: 280px; overflow: auto; border-radius: 8px; background: var(--surface); border: 1px solid var(--line); }
.imp-t { width: 100%; border-collapse: collapse; font-size: .82rem; }
.imp-t th { position: sticky; top: 0; background: var(--surface-2); text-align: left; padding: .35rem .5rem; font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.imp-t td { padding: .35rem .5rem; border-top: 1px solid var(--line); white-space: nowrap; }
.imp-grp { display: inline-block; padding: .05rem .45rem; border-radius: 999px; background: var(--accent-soft); color: var(--accent-strong); font-size: .76rem; font-weight: 600; }

/* =====================================================================
   Panel administratora – układ biznesowy (layouts/admin.php)
   Własne tokeny: neutralne szarości + granat, czcionka bez szeryfów, bez ozdób paneli par
   ===================================================================== */
body.layout-admin {
  --bg: #f4f6f9; --surface: #ffffff; --surface-2: #f2f4f7; --text: #101828; --muted: #667085; --line: #e4e7ec;
  --accent: #2563eb; --accent-strong: #1d4ed8; --accent-soft: #eaf1fe; --on-accent: #fff;
  --ok: #15803d; --ok-soft: #e8f6ec; --warn: #b54708; --warn-soft: #fef4e6; --danger: #c01c28; --danger-soft: #fdecec;
  --radius: 12px; --radius-sm: 8px; --shadow: 0 1px 2px rgba(16, 24, 40, .05);
  --font-display: var(--font-body); --gold-line: var(--line);
  --side-w: 248px;
  background: var(--bg); color: var(--text); font-size: 14.5px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body.layout-admin {
    --bg: #0b1220; --surface: #111a2b; --surface-2: #162034; --text: #e6eaf2; --muted: #94a0b8; --line: #243149;
    --accent: #5b8def; --accent-strong: #8fb0f5; --accent-soft: #1a2a4a; --on-accent: #fff;
    --ok: #4cc27a; --ok-soft: #13301f; --warn: #f0a24b; --warn-soft: #36270f; --danger: #f07178; --danger-soft: #3a1619;
    --shadow: 0 1px 2px rgba(0, 0, 0, .35);
  }
}
body.layout-admin h1, body.layout-admin h2, body.layout-admin h3 { font-family: var(--font-body); letter-spacing: -.01em; }
body.layout-admin h1 { font-size: 1.55rem; font-weight: 700; }
body.layout-admin h2 { font-size: 1.08rem; font-weight: 650; }
body.layout-admin h3 { font-size: .95rem; font-weight: 650; }
body.layout-admin .card { border-radius: var(--radius); box-shadow: var(--shadow); border: 1px solid var(--line); background: var(--surface); }
body.layout-admin .btn { border-radius: 8px; }
body.layout-admin .badge { border-radius: 6px; font-weight: 600; }
body.layout-admin .icon-title { color: var(--accent); }
body.layout-admin .page-sub { color: var(--muted); }
body.layout-admin a:not(.btn) { color: var(--accent-strong); }

.adm-shell { display: grid; grid-template-columns: var(--side-w) minmax(0, 1fr); min-height: 100vh; }
.adm-side { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; gap: .4rem; padding: 1rem .8rem; background: #0f172a; color: #cbd5e1; overflow-y: auto; }
.adm-brand { display: flex; align-items: center; gap: .65rem; padding: .35rem .5rem .9rem; margin-bottom: .2rem; border-bottom: 1px solid rgba(255,255,255,.08); color: #fff !important; text-decoration: none; }
.adm-brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: #2563eb; color: #fff; flex: none; }
.adm-brand-mark .icon { width: 18px; height: 18px; }
.adm-brand-txt { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.adm-brand-txt strong { font-size: .95rem; }
.adm-brand-txt small { font-size: .72rem; color: #94a3b8; }
.adm-nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.adm-nav-h { margin: .9rem .6rem .3rem; font-size: .66rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #64748b; }
.adm-nav a { display: flex; align-items: center; gap: .65rem; padding: .5rem .65rem; border-radius: 8px; color: #cbd5e1 !important; text-decoration: none; font-weight: 500; font-size: .9rem; }
.adm-nav a .icon { width: 17px; height: 17px; color: #94a3b8; flex: none; }
.adm-nav a:hover { background: rgba(255,255,255,.06); color: #fff !important; }
.adm-nav a.is-on { background: rgba(37, 99, 235, .22); color: #fff !important; }
.adm-nav a.is-on .icon { color: #93b4ff; }
.adm-side-foot { display: flex; flex-direction: column; gap: .5rem; padding-top: .8rem; border-top: 1px solid rgba(255,255,255,.08); }
.adm-user { display: flex; align-items: center; gap: .55rem; padding: 0 .4rem; min-width: 0; }
.adm-user-ava { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #1e293b; color: #e2e8f0; font-size: .75rem; font-weight: 700; flex: none; }
.adm-user-mail { font-size: .78rem; color: #94a3b8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-logout { display: flex; align-items: center; gap: .55rem; width: 100%; padding: .5rem .65rem; border: 0; border-radius: 8px; background: none; color: #cbd5e1; font: inherit; font-size: .88rem; cursor: pointer; }
.adm-logout:hover { background: rgba(255,255,255,.06); color: #fff; }
.adm-logout .icon { width: 17px; height: 17px; }
.adm-main { min-width: 0; padding: 1.6rem 2rem 2.5rem; max-width: 1240px; width: 100%; }
.adm-foot { margin-top: 2.5rem; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .8rem; color: var(--muted); }
body.layout-admin .passkey-nudge { bottom: 1rem; }
@media (max-width: 900px) {
  .adm-shell { grid-template-columns: 1fr; }
  .adm-side { position: sticky; top: 0; z-index: 40; height: auto; flex-direction: row; align-items: center; gap: .5rem; padding: .5rem .6rem; overflow: visible; }
  .adm-brand { border: 0; padding: 0; margin: 0; }
  .adm-brand-txt small, .adm-nav-h, .adm-user { display: none; }
  .adm-brand-txt strong { display: none; }
  .adm-nav { flex-direction: row; flex: 1; overflow-x: auto; scrollbar-width: none; gap: 2px; }
  .adm-nav::-webkit-scrollbar { display: none; }
  .adm-nav a { flex: none; padding: .45rem .6rem; font-size: .82rem; }
  .adm-side-foot { padding: 0; border: 0; flex-direction: row; }
  .adm-logout { width: auto; padding: .45rem; }
  .adm-logout span { display: none; }
  .adm-main { padding: 1.1rem 1rem 2rem; }
}

/* ===== Admin: wspólne elementy (kody, przypomnienia, ustawienia) ===== */
.layout-admin .mono { font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; letter-spacing: .02em; }
.layout-admin .ac-chev { width: 18px; height: 18px; margin-left: auto; color: var(--muted); transition: transform .2s; flex: none; }
.layout-admin details[open] > summary .ac-chev { transform: rotate(180deg); }
.layout-admin details > summary { list-style: none; }
.layout-admin details > summary::-webkit-details-marker { display: none; }

/* Kody promocyjne */
.ac-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.ac-kpi { display: flex; flex-direction: column; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.ac-kpi small { font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.ac-kpi strong { font-size: 1.55rem; line-height: 1.25; }
.ac-kpi span { font-size: .8rem; color: var(--muted); }
.ac-new { padding: 0; margin-bottom: 1rem; }
.ac-new > summary { display: flex; align-items: center; gap: .75rem; padding: .85rem 1rem; cursor: pointer; }
.ac-new > summary small { display: block; color: var(--muted); font-size: .8rem; }
.ac-new-ic { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: var(--accent-soft); color: var(--accent-strong); flex: none; }
.ac-new-form { padding: 0 1rem 1rem; border-top: 1px solid var(--line); }
.ac-new-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .2rem .9rem; margin: .9rem 0 .4rem; }
.ac-new-grid .wide { grid-column: span 2; }
.ac-list { padding: 0; overflow: hidden; }
.ac-tools { padding: .8rem 1rem; border-bottom: 1px solid var(--line); }
.ac-tools .g-search { max-width: 360px; }
.ac-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.ac-table th { text-align: left; padding: .6rem 1rem; font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); background: var(--surface-2); border-bottom: 1px solid var(--line); }
.ac-table td { padding: .7rem 1rem; border-bottom: 1px solid var(--line); vertical-align: middle; }
.ac-table tbody tr:last-child td { border-bottom: 0; }
.ac-table tbody tr:hover { background: color-mix(in srgb, var(--accent-soft) 40%, transparent); }
.ac-table tr.is-off td { color: var(--muted); }
.ac-table small { display: block; font-size: .76rem; color: var(--muted); }
.ac-code-row { display: inline-flex; align-items: center; gap: .35rem; }
.ac-code strong { font-size: .92rem; padding: .15rem .45rem; border-radius: 6px; background: var(--surface-2); border: 1px solid var(--line); }
.ac-copy { display: inline-grid; place-items: center; width: 26px; height: 26px; border: 0; border-radius: 6px; background: none; color: var(--muted); cursor: pointer; }
.ac-copy:hover { background: var(--accent-soft); color: var(--accent-strong); }
.ac-copy .icon { width: 14px; height: 14px; }
.ac-tag { color: var(--accent-strong) !important; font-weight: 600; }
.ac-uses { font-variant-numeric: tabular-nums; }
.ac-bar { display: block; width: 110px; height: 5px; margin: .3rem 0 .1rem; border-radius: 9px; background: var(--surface-2); overflow: hidden; }
.ac-bar b { display: block; height: 100%; background: var(--accent); border-radius: inherit; }
.ac-act { text-align: right; white-space: nowrap; }
.ac-act .icon { width: 14px; height: 14px; }
.ac-none { padding: 1rem; margin: 0; }

/* REST API: klucz i dokumentacja */
.api-card { margin-bottom: 1rem; }
.api-card h2 { display: flex; align-items: center; gap: .45rem; }
.api-card code { font-size: .86em; padding: .1em .35em; border-radius: 5px; background: var(--surface-2); border: 1px solid var(--line); overflow-wrap: anywhere; }
.api-kpi-date { font-size: 1.1rem !important; }
.api-newkey { padding: .9rem 1rem; margin-bottom: .9rem; border: 1.5px solid var(--accent); border-radius: var(--radius); background: var(--accent-soft); }
.api-newkey p { margin: 0 0 .6rem; }
.api-keyrow { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.api-keyrow code { font-size: .95rem; padding: .4rem .6rem; background: var(--surface); word-break: break-all; }
.api-steps, .api-rules { margin: .2rem 0 .2rem 1.2rem; padding: 0; display: grid; gap: .45rem; }
.api-method { display: inline-block; padding: .15rem .5rem; margin-right: .3rem; border-radius: 6px; background: var(--accent); color: var(--on-accent, #fff); font: 700 .75rem/1.4 var(--font-body); letter-spacing: .04em; }
.api-method.get { background: var(--ok, #2e7d4f); color: #fff; }
.api-h { font-size: .95rem; margin: 1.1rem 0 .4rem; }
.api-pre-wrap { position: relative; }
.api-pre { margin: 0; padding: .9rem 1rem; border-radius: 10px; background: #0f172a; color: #e2e8f0; font: .82rem/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: pre-wrap; word-break: break-word; overflow-x: auto; }
.api-copy { position: absolute; top: .45rem; right: .45rem; color: #e2e8f0; border-color: rgba(255,255,255,.25); }
.api-table td:first-child { white-space: nowrap; }
.api-test { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); display: grid; gap: .5rem; }
.api-test-row { display: flex; gap: .5rem; align-items: center; }
.api-test-row input { flex: 1; min-width: 0; margin: 0; }
.api-test-row .btn { flex: none; }
.api-test p { margin: 0; }
.api-card textarea { font: inherit; line-height: 1.5; }
.api-table td { vertical-align: top; }
@media (max-width: 700px) {
  .api-table thead { display: none; }
  .api-table tr { display: block; padding: .6rem 0; border-bottom: 1px solid var(--line); }
  .api-table td { display: block; padding: .15rem .8rem; border: 0; }
  .api-pre { font-size: .75rem; }
}

/* Przypomnienia */
.nt-top .nt-status { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; margin: .7rem 0 .2rem; font-size: .88rem; color: var(--muted); }
.nt-top .nt-status span { display: inline-flex; align-items: center; gap: .35rem; }
.nt-top .nt-status .icon { width: 15px; height: 15px; }
.nt-help { margin-top: .6rem; }
.nt-help summary { display: inline-flex; align-items: center; gap: .3rem; cursor: pointer; font-size: .85rem; font-weight: 600; color: var(--accent-strong); }
.nt-help .icon { width: 15px; height: 15px; }
.nt-h { margin: 1.3rem 0 .6rem; }
.nt-rules { display: flex; flex-direction: column; gap: .5rem; }
.nt-rule { padding: 0; margin: 0; }
.nt-rule > summary { display: flex; align-items: center; gap: .8rem; padding: .8rem 1rem; cursor: pointer; }
.nt-rule > summary:hover { background: color-mix(in srgb, var(--accent-soft) 35%, transparent); }
.nt-rule.is-off > summary .nt-title strong { color: var(--muted); }
.nt-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--line); flex: none; box-shadow: 0 0 0 3px var(--surface-2); }
.nt-dot.is-on { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-soft); }
.nt-dot.is-add { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--accent-soft); color: var(--accent-strong); box-shadow: none; }
.nt-dot.is-add .icon { width: 16px; height: 16px; }
.nt-title { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.nt-title strong { font-size: .95rem; }
.nt-title small { font-size: .8rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nt-chips { display: flex; gap: .3rem; flex: none; }
.nt-ch { padding: .12rem .45rem; border-radius: 6px; font-size: .72rem; font-weight: 600; background: var(--surface-2); color: var(--muted); opacity: .6; text-decoration: line-through; }
.nt-ch.is-on { background: var(--accent-soft); color: var(--accent-strong); opacity: 1; text-decoration: none; }
.nt-body { padding: .3rem 1rem 1rem; border-top: 1px solid var(--line); }
.nt-grid { display: grid; grid-template-columns: 1.2fr .8fr 1.2fr; gap: .2rem .9rem; margin-top: .6rem; }
.nt-ch-row { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: .3rem; }
.nt-chk { margin: 0 !important; cursor: pointer; font-weight: 500; }
.nt-chk input { position: absolute; opacity: 0; pointer-events: none; }
.nt-chk > span { display: inline-flex; align-items: center; gap: .3rem; padding: .4rem .65rem; border: 1px solid var(--line); border-radius: 8px; font-size: .85rem; }
.nt-chk .icon { width: 15px; height: 15px; }
.nt-chk input:checked + span { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-strong); font-weight: 600; }
.nt-chk input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.nt-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; padding-top: .7rem; margin-top: .3rem; border-top: 1px dashed var(--line); }
.nt-remove { margin-left: auto !important; color: var(--danger); font-size: .85rem; }
.nt-test { margin-top: .5rem; }
.nt-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1.4rem; align-items: start; }
.nt-tablebox { padding: 0; overflow: hidden; }
.nt-box-head { display: flex; align-items: center; gap: .5rem; padding: .85rem 1rem; border-bottom: 1px solid var(--line); }
.nt-box-head h2 { margin: 0; display: flex; align-items: center; gap: .4rem; font-size: 1rem; }
.nt-box-head h2 .icon { color: var(--accent); width: 17px; height: 17px; }
.nt-run { margin: 0 0 0 auto; }
.nt-tablebox > p { padding: 1rem; margin: 0; }
.nt-table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.nt-table th { text-align: left; padding: .5rem 1rem; font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); background: var(--surface-2); }
.nt-table td { padding: .55rem 1rem; border-top: 1px solid var(--line); vertical-align: top; }
.nt-table small { display: block; font-size: .76rem; color: var(--muted); }
.nt-table td:last-child { text-align: right; white-space: nowrap; }

/* Ustawienia: sekcje zwijane */
.set-sum { display: inline-flex; align-items: center; gap: .35rem; padding: .4rem .75rem; border-radius: 8px; font-size: .85rem; font-weight: 600; }
.set-sum .icon { width: 16px; height: 16px; }
.set-sum.is-ok { background: var(--ok-soft); color: var(--ok); }
.set-sum.is-warn { background: var(--warn-soft); color: var(--warn); }
.set-list { display: flex; flex-direction: column; gap: .6rem; }
.set-sec { padding: 0; margin: 0; scroll-margin-top: 1rem; }
.set-sec > summary { display: flex; align-items: center; gap: .85rem; padding: .95rem 1.1rem; cursor: pointer; }
.set-sec > summary:hover { background: color-mix(in srgb, var(--accent-soft) 35%, transparent); }
.set-ic { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: var(--accent-soft); color: var(--accent-strong); flex: none; }
.set-ic .icon { width: 19px; height: 19px; }
.set-sec.is-warn .set-ic { background: var(--warn-soft); color: var(--warn); }
.set-txt { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.set-txt strong { font-size: 1rem; }
.set-txt small { font-size: .82rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.set-sec[open] .set-txt small { white-space: normal; }
.set-state { display: inline-flex; align-items: center; gap: .3rem; padding: .22rem .55rem; border-radius: 6px; font-size: .75rem; font-weight: 600; flex: none; }
.set-state .icon { width: 14px; height: 14px; }
.set-state.is-ok { background: var(--ok-soft); color: var(--ok); }
.set-state.is-warn { background: var(--warn-soft); color: var(--warn); }
.set-body { padding: .4rem 1.1rem 1.2rem; border-top: 1px solid var(--line); }
.set-body > p:first-child { margin-top: .7rem; }
@media (max-width: 900px) {
  .ac-new-grid { grid-template-columns: 1fr 1fr; }
  .nt-grid { grid-template-columns: 1fr 1fr; }
  .nt-grid .nt-channels { grid-column: 1 / -1; }
  .nt-cols { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .ac-kpis { grid-template-columns: 1fr 1fr 1fr; gap: .4rem; }
  .ac-kpi { padding: .6rem .65rem; } .ac-kpi strong { font-size: 1.2rem; } .ac-kpi span { display: none; }
  .ac-new-grid, .nt-grid { grid-template-columns: 1fr; }
  .ac-new-grid .wide { grid-column: auto; }
  .ac-table thead { display: none; }
  .ac-table, .ac-table tbody, .ac-table tr, .ac-table td { display: block; }
  .ac-table tr { padding: .75rem 1rem; border-bottom: 1px solid var(--line); }
  .ac-table td { padding: .15rem 0; border: 0; }
  .ac-table td[data-label]::before { content: attr(data-label) ": "; color: var(--muted); font-size: .8rem; }
  .ac-act { text-align: left; padding-top: .4rem !important; }
  .nt-chips { display: none; }
  .set-state { display: none; }
  .set-sec > summary { padding: .85rem .9rem; }
  .set-body { padding: .3rem .9rem 1rem; }
}
@media (max-width: 900px) {
  .adm-shell { grid-template-columns: minmax(0, 1fr); }
  .adm-side, .adm-nav { min-width: 0; }
  .adm-main { overflow-x: clip; }
}

/* Panel admina: wybrany ręcznie motyw (admin-theme.js ustawia <html data-theme>) */
:root[data-theme="dark"] body.layout-admin {
  --bg: #0b1220; --surface: #111a2b; --surface-2: #162034; --text: #e6eaf2; --muted: #94a0b8; --line: #243149;
  --accent: #5b8def; --accent-strong: #8fb0f5; --accent-soft: #1a2a4a; --on-accent: #fff;
  --ok: #4cc27a; --ok-soft: #13301f; --warn: #f0a24b; --warn-soft: #36270f; --danger: #f07178; --danger-soft: #3a1619;
  --shadow: 0 1px 2px rgba(0, 0, 0, .35);
}
:root[data-theme="dark"]:has(body.layout-admin) { color-scheme: dark; }
:root[data-theme="light"]:has(body.layout-admin) { color-scheme: light; }
.adm-theme { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; padding: 3px; border-radius: 9px; background: rgba(255, 255, 255, .06); }
.adm-theme button { display: grid; place-items: center; height: 30px; border: 0; border-radius: 7px; background: none; color: #94a3b8; cursor: pointer; }
.adm-theme button:hover { color: #fff; }
.adm-theme button.is-on { background: rgba(255, 255, 255, .14); color: #fff; }
.adm-theme .icon { width: 16px; height: 16px; }
@media (max-width: 900px) {
  .adm-theme { grid-template-columns: repeat(3, 28px); padding: 2px; }
  .adm-theme button { height: 28px; }
}

/* Panel admina: menu u góry (poziomy pasek) na każdej szerokości ekranu */
.adm-shell { display: block; min-height: 100vh; }
.adm-side { position: sticky; top: 0; z-index: 40; height: auto; flex-direction: row; align-items: center; gap: 1rem; padding: 0 1.5rem; min-height: 60px; overflow: visible; box-shadow: 0 1px 0 rgba(255, 255, 255, .06); }
.adm-brand { border: 0; padding: 0; margin: 0; flex: none; }
.adm-brand-txt small { display: block; }
.adm-nav { flex-direction: row; align-items: center; flex: 1; min-width: 0; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.adm-nav::-webkit-scrollbar { display: none; }
.adm-nav-h { display: none; }
.adm-nav a { flex: none; padding: .45rem .7rem; font-size: .88rem; white-space: nowrap; }
.adm-side-foot { flex-direction: row; align-items: center; gap: .6rem; padding: 0; border: 0; flex: none; }
.adm-user-mail { display: none; }
.adm-user { padding: 0; }
.adm-user-ava { cursor: default; }
.adm-logout { width: auto; padding: .45rem .6rem; }
.adm-main { max-width: 1240px; margin: 0 auto; padding: 1.6rem 2rem 2.5rem; }
@media (max-width: 1100px) {
  .adm-brand-txt { display: none; }
  .adm-logout span { display: none; }
}
@media (max-width: 900px) {
  .adm-side { gap: .5rem; padding: .45rem .6rem; min-height: 0; }
  .adm-user { display: none; }
  .adm-nav a { padding: .45rem .6rem; font-size: .82rem; }
  .adm-main { padding: 1.1rem 1rem 2rem; }
}
.adm-nav-sep { flex: none; width: 1px; height: 20px; margin: 0 .4rem; background: rgba(255, 255, 255, .14); }
.adm-user { text-decoration: none; border-radius: 50%; }
.adm-user .adm-user-ava { width: 32px; height: 32px; background: #1e293b; border: 1px solid rgba(255, 255, 255, .12); transition: background .15s; }
.adm-user:hover .adm-user-ava, .adm-user.is-on .adm-user-ava { background: #2563eb; color: #fff; }
@media (max-width: 1400px) { .adm-brand-txt small { display: none; } }
@media (max-width: 900px) { .adm-user { display: flex; } }
@media (max-width: 900px) {
  .adm-side { flex-wrap: wrap; row-gap: .35rem; padding: .5rem .7rem .4rem; }
  .adm-side-foot { margin-left: auto; }
  .adm-nav { order: 3; flex: 1 1 100%; margin: 0 -.2rem; padding-bottom: .1rem; }
  .adm-nav-sep { height: 16px; margin: 0 .2rem; }
}

/* Pasek menu admina w kolorach motywu (jasny: biały, ciemny: granat) */
body.layout-admin .adm-side { background: var(--surface); color: var(--text); border-bottom: 1px solid var(--line); box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
body.layout-admin .adm-brand { color: var(--text) !important; }
body.layout-admin .adm-brand-txt small { color: var(--muted); }
body.layout-admin .adm-nav a { color: var(--muted) !important; }
body.layout-admin .adm-nav a .icon { color: var(--muted); }
body.layout-admin .adm-nav a:hover { background: var(--surface-2); color: var(--text) !important; }
body.layout-admin .adm-nav a.is-on { background: var(--accent-soft); color: var(--accent-strong) !important; font-weight: 600; }
body.layout-admin .adm-nav a.is-on .icon { color: var(--accent); }
body.layout-admin .adm-nav-sep { background: var(--line); }
body.layout-admin .adm-theme { background: var(--surface-2); border: 1px solid var(--line); }
body.layout-admin .adm-theme button { color: var(--muted); }
body.layout-admin .adm-theme button:hover { color: var(--text); }
body.layout-admin .adm-theme button.is-on { background: var(--surface); color: var(--accent-strong); box-shadow: 0 1px 2px rgba(16, 24, 40, .12); }
body.layout-admin .adm-user .adm-user-ava { background: var(--surface-2); color: var(--text); border-color: var(--line); }
body.layout-admin .adm-user:hover .adm-user-ava, body.layout-admin .adm-user.is-on .adm-user-ava { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
body.layout-admin .adm-logout { color: var(--muted); }
body.layout-admin .adm-logout:hover { background: var(--surface-2); color: var(--text); }
body.layout-admin .adm-user .adm-user-ava { transition: none; }

/* REST API: parametry i kody odpowiedzi jako karty (czytelne na każdej szerokości) */
.api-params { margin: .5rem 0 0; display: grid; gap: .5rem; }
.api-param { padding: .7rem .9rem; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.api-param dt { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; font-weight: 600; }
.api-param dd { margin: .3rem 0 0; font-size: .9rem; line-height: 1.5; overflow-wrap: anywhere; }
.api-type { font-size: .8rem; font-weight: 500; color: var(--muted); }
.api-param-row { display: grid; grid-template-columns: 3.6rem minmax(0, 1fr); gap: .8rem; align-items: baseline; }
.api-param-row dd { margin: 0; }
.api-vars { list-style: none; margin: .2rem 0 .9rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .35rem .9rem; font-size: .88rem; }
.api-vars li { display: flex; align-items: baseline; gap: .5rem; }
.api-vars code { flex: none; }
.api-vars span { color: var(--muted); }
.api-pre-wrap .api-pre { padding-top: 2.7rem; }
.api-card .row { flex-wrap: wrap; }

/* Panel admina na telefonie: menu rozwijane przyciskiem, karty zamiast ściśniętych tabel, łamanie długich e-maili */
.adm-menu-btn { display: none; }
@media (max-width: 760px) {
  .adm-side { flex-wrap: wrap; align-items: center; gap: .55rem; padding: .55rem .8rem; }
  .adm-menu-btn { display: inline-flex; align-items: center; gap: .55rem; flex: 1; min-width: 0; height: 44px; padding: 0 .85rem; border: 1px solid var(--line); border-radius: 11px;
    background: var(--surface-2); color: var(--text); font: 600 1rem/1 var(--font-body); cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .adm-menu-btn > .icon { width: 19px; height: 19px; flex: none; color: var(--muted); }
  .adm-menu-here { display: inline-flex; align-items: center; gap: .45rem; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .adm-menu-here .icon { width: 18px; height: 18px; flex: none; color: var(--accent); }
  .adm-menu-btn .adm-menu-chev { margin-left: auto; transform: rotate(90deg); transition: transform .2s; }
  .adm-side.is-menu-open .adm-menu-chev { transform: rotate(-90deg); }
  .adm-side.is-menu-open .adm-menu-btn { border-color: var(--accent); }
  .adm-nav, .adm-side-foot { display: none; }
  .adm-side.is-menu-open .adm-nav { display: flex; order: 3; flex: 1 1 100%; flex-direction: column; align-items: stretch; gap: 2px; margin: 0; padding: .35rem;
    border: 1px solid var(--line); border-radius: 14px; background: var(--surface); max-height: calc(100dvh - 150px); overflow-y: auto; }
  .adm-side.is-menu-open .adm-nav-h { display: block; margin: .7rem .7rem .25rem; font-size: .7rem; color: var(--muted); }
  .adm-side.is-menu-open .adm-nav-h:first-child { margin-top: .35rem; }
  .adm-nav-sep { display: none !important; }
  .adm-nav a { min-height: 48px; padding: .75rem .8rem; font-size: 1rem; box-sizing: border-box; }
  .adm-nav a .icon { width: 20px; height: 20px; }
  .adm-side.is-menu-open .adm-side-foot { display: flex; order: 4; flex: 1 1 100%; align-items: center; gap: .6rem; padding: .1rem .2rem .3rem; }
  .adm-side.is-menu-open .adm-user { display: flex; align-items: center; gap: .5rem; flex: 1 1 0; min-width: 0; border-radius: 10px; color: var(--text); text-decoration: none; }
  .adm-side.is-menu-open .adm-user-ava { flex: none; }
  .adm-side.is-menu-open .adm-user-mail { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .88rem; }
  .adm-side.is-menu-open .adm-side-foot form { flex: none; }
  .adm-main { padding: 1rem .9rem 2rem; }
  body.layout-admin input, body.layout-admin select, body.layout-admin textarea { font-size: 16px; } /* iPhone nie powiększa strony przy wpisywaniu */
  .layout-admin .page-head { flex-wrap: wrap; gap: .7rem; }
  .layout-admin .page-head h1 { font-size: 1.45rem; }
  .layout-admin .badge { white-space: normal; }
  .table-cards tr { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .table-cards td, .layout-admin .pay-main, .layout-admin .pay-main > span, .layout-admin .kv dd { overflow-wrap: anywhere; }
  .layout-admin .pay { flex-wrap: wrap; row-gap: .35rem; }
  .layout-admin .pay-main { flex: 1 1 100%; }
  .nt-top .nt-status { flex-direction: column; gap: .55rem; }
  .nt-top .nt-status span { flex-wrap: wrap; }
  .nt-table, .nt-table tbody { display: block; }
  .nt-table thead { display: none; }
  .nt-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .35rem .8rem; padding: .8rem 1rem; border-top: 1px solid var(--line); }
  .nt-table td { display: block; padding: 0; border: 0; overflow-wrap: anywhere; }
  .nt-table td.nt-state { grid-column: 2; grid-row: 1; text-align: right; }
  .nt-table td[data-label] { grid-column: 1 / -1; }
  .nt-table td[data-label]::before { content: attr(data-label); display: block; margin-bottom: .1rem; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
  .ac-kpis { grid-template-columns: 1fr; gap: .5rem; }
  .ac-kpi { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: .1rem .6rem; padding: .7rem .9rem; }
  .ac-kpi small { flex: 1 1 100%; }
  .ac-kpi strong { font-size: 1.3rem; }
  .api-test-row { flex-wrap: wrap; }
  .api-test-row .btn { width: 100%; justify-content: center; }
  .api-param-row { grid-template-columns: 1fr; gap: .2rem; }
  .payments-filter { flex-wrap: wrap; overflow: visible; border-radius: 16px; }
  .layout-admin .adm-main .row { flex-wrap: wrap; }
}

/* ===== Kalkulator alkoholu (/panel/alkohol) ===== */
.alc { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.alc-form { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.alc-sec { margin: 0; }
.alc-sec h2 { display: flex; align-items: center; gap: .45rem; font-size: 1.1rem; margin: 0 0 .8rem; }
.alc-sec h2 .icon { color: var(--accent); }
.alc-src, .alc-prof { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin-bottom: .7rem; }
.alc-opt { margin: 0 !important; cursor: pointer; }
.alc-opt input { position: absolute; opacity: 0; pointer-events: none; }
.alc-opt > span { display: flex; flex-direction: column; align-items: center; gap: .1rem; height: 100%; padding: .75rem .5rem; border: 1.5px solid var(--line); border-radius: 14px; text-align: center; transition: border-color .15s, background .15s; }
.alc-opt > span b { font-size: 1.5rem; line-height: 1.2; }
.alc-opt > span strong { font-size: 1.05rem; }
.alc-src .alc-opt > span strong { font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.alc-opt > span small { font-size: .74rem; color: var(--muted); font-weight: 400; line-height: 1.25; }
.alc-opt input:checked + span { border-color: var(--accent); background: var(--accent-soft); }
.alc-opt input:checked + span strong { color: var(--accent-strong); }
.alc-opt input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.alc-own[hidden] { display: none; }
.alc-own input { max-width: 160px; }
.alc-range { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .2rem .6rem; margin: .5rem 0 .3rem !important; }
.alc-range input[type=range] { grid-column: 1 / -1; width: 100%; accent-color: var(--accent); margin: .2rem 0 0; }
.alc-range output { font-weight: 700; color: var(--accent-strong); font-variant-numeric: tabular-nums; }
.alc-prices { margin-top: .8rem; }
.alc-prices summary { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; font-weight: 600; color: var(--accent-strong); }
.alc-price-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 .8rem; margin-top: .6rem; }
.alc-res { position: sticky; top: 1rem; display: flex; flex-direction: column; gap: .8rem; min-width: 0; }
.alc-sum { margin: 0; }
.alc-sum-h { margin: 0 0 .6rem; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.alc-items { display: flex; flex-direction: column; }
.alc-item { display: flex; align-items: center; gap: .75rem; padding: .6rem 0; border-top: 1px solid var(--line); }
.alc-item:first-child { border-top: 0; }
.alc-em { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--accent-soft); font-size: 1.35rem; flex: none; }
.alc-it { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.alc-it strong { font-weight: 500; font-size: .92rem; }
.alc-it strong b { font-size: 1.3rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.alc-it small { color: var(--muted); font-size: .78rem; line-height: 1.3; }
.alc-cost { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; font-size: .9rem; }
.alc-total { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 0 .5rem; margin-top: .6rem; padding-top: .8rem; border-top: 2px solid var(--line); }
.alc-total span { font-weight: 600; }
.alc-total strong { font-size: 1.5rem; color: var(--accent-strong); font-variant-numeric: tabular-nums; }
.alc-total small { grid-column: 1 / -1; color: var(--muted); font-size: .8rem; text-align: right; }
.alc-note { margin: .6rem 0 .8rem; color: var(--muted); }
.alc-actions { display: flex; flex-direction: column; gap: .45rem; }
.alc-saved { margin: .5rem 0 0; color: var(--ok); font-weight: 600; min-height: 1.2em; }
.alc-how { margin: 0; }
.alc-how summary { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; font-weight: 600; }
.alc-own label, .alc-price label { display: block; margin: .5rem 0 .25rem; font-weight: 600; font-size: .9rem; }
.alc-who { margin: .2rem 0 .4rem; padding: .55rem .75rem; border-radius: 12px; background: var(--accent-soft); font-size: .88rem; }
.alc-who strong { color: var(--accent-strong); font-variant-numeric: tabular-nums; }
.alc-side { display: flex; flex-direction: column; align-items: flex-end; gap: .3rem; flex: none; }
.alc-step { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.alc-step button { width: 36px; height: 32px; border: 0; background: var(--surface); color: var(--text); font: 600 1.1rem/1 var(--font-body); cursor: pointer; touch-action: manipulation; }
.alc-step button + button { border-left: 1px solid var(--line); }
.alc-step button:hover:not(:disabled) { background: var(--accent-soft); color: var(--accent-strong); }
.alc-step button:disabled { opacity: .35; cursor: default; }
.alc-item.is-adj .alc-it strong b { color: var(--accent-strong); }
.alc-it small em { font-style: normal; color: var(--accent-strong); font-weight: 600; }
.alc-reset { display: inline-flex; align-items: center; gap: .35rem; margin: .4rem 0 0; padding: .3rem 0; border: 0; background: none; color: var(--accent-strong); font-weight: 600; cursor: pointer; }
.alc-reset[hidden] { display: none; }
.alc-extra { display: flex; flex-direction: column; gap: .5rem; margin: .2rem 0 .7rem; }
.alc-extra:empty { display: none; }
.alc-x { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; align-items: center; gap: .45rem; }
.alc-x input { margin: 0; }
.alc-x-n { display: inline-flex; align-items: center; gap: .3rem; font-size: .8rem; color: var(--muted); white-space: nowrap; }
.alc-x-n input { width: 4.6rem; }
.alc-x-del { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--muted); font-size: 1.2rem; line-height: 1; cursor: pointer; }
.alc-x-del:hover { color: var(--danger, #b3261e); border-color: currentColor; }
@media (max-width: 560px) {
  .alc-x { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; padding-bottom: .5rem; border-bottom: 1px solid var(--line); }
  .alc-x-name { grid-column: 1 / -1; }
  .alc-x-n input { width: 100%; min-width: 0; }
}
@media (max-width: 900px) {
  .alc { grid-template-columns: 1fr; }
  .alc-res { position: static; order: -1; }
}
@media (max-width: 480px) {
  .alc-src, .alc-prof { gap: .35rem; }
  .alc-opt > span { padding: .6rem .3rem; }
  .alc-price-grid { grid-template-columns: 1fr; }
}
@media print {
  .alc-form, .alc-actions, .alc-how, .alc-saved, .alc-step, .alc-reset, .page-sub { display: none !important; }
  .alc { display: block; }
}

/* Budżet: wydatek „za osobę” */
.bf-per { margin: .2rem 0 .8rem; }
.bf-mode { display: inline-flex; gap: 0; padding: 3px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-2, var(--surface)); margin-bottom: .6rem; }
.bf-mode label { margin: 0 !important; cursor: pointer; }
.bf-mode input { position: absolute; opacity: 0; pointer-events: none; }
.bf-mode span { display: inline-flex; align-items: center; gap: .35rem; padding: .45rem .9rem; border-radius: 999px; font-weight: 600; font-size: .88rem; color: var(--muted); }
.bf-mode input:checked + span { background: var(--accent); color: var(--on-accent, #fff); }
.bf-mode input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.bf-person { display: none; padding: .8rem .9rem; border: 1px solid var(--line); border-radius: 14px; }
form:has([name="cost_mode"][value="person"]:checked) .bf-person { display: block; }
form:has([name="cost_mode"][value="person"]:checked) .bf-fixed { display: none; }
.bf-person > p:first-child { margin-top: 0; }
.bf-ages { border: 0; padding: 0; margin: .4rem 0 .6rem; }
.bf-ages legend { font-weight: 600; font-size: .9rem; margin-bottom: .35rem; display: flex; align-items: center; gap: .3rem; }
.bf-ages .chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.bf-age { margin: 0 !important; cursor: pointer; }
.bf-age input { position: absolute; opacity: 0; pointer-events: none; }
.bf-age span { display: inline-flex; align-items: center; gap: .3rem; padding: .4rem .75rem; border: 1.5px solid var(--line); border-radius: 999px; font-size: .86rem; }
.bf-age b { font-variant-numeric: tabular-nums; color: var(--muted); font-weight: 600; }
.bf-age input:checked + span { border-color: var(--accent); background: var(--accent-soft); }
.bf-age input:checked + span b { color: var(--accent-strong); }
.bf-age input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.bf-sum { margin: .5rem 0 0; padding: .55rem .75rem; border-radius: 12px; background: var(--accent-soft); font-size: .92rem; }
.bf-sum strong { color: var(--accent-strong); }
.exp-per { display: flex; align-items: center; gap: .35rem; color: var(--accent-strong); font-weight: 600; }

/* Lista gości: grupy wieku */
.ag-list { display: flex; flex-direction: column; gap: .45rem; margin: .3rem 0 .7rem; }
.ag-row { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr) auto auto; align-items: center; gap: .5rem; }
.ag-row input[type="text"] { margin: 0; }
.ag-row .ag-emo { text-align: center; font-size: 1.15rem; padding-inline: .2rem; }
.ag-row .check { margin: 0; white-space: nowrap; font-size: .85rem; }
.ag-fixed { font-size: .78rem; color: var(--muted); white-space: nowrap; }
.ag-del { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--muted); font-size: 1.2rem; line-height: 1; cursor: pointer; }
.ag-row.is-gone { opacity: .45; }
.ag-row.is-gone input[type="text"] { text-decoration: line-through; }
@media (max-width: 560px) {
  .ag-row { grid-template-columns: 3rem minmax(0, 1fr) auto; }
  .ag-row > :nth-child(3) { grid-column: 2; }
}
@media print {
  /* Arkusz „Lista zakupów” kalkulatora alkoholu */
  .ps-alc .ps-tile { min-width: 24mm; }
  .ps-alc .ps-tile b { font-size: 14pt; }
  .ps-shop td { vertical-align: middle; }
  .ps-shop td:first-child { width: 5mm; padding-right: 0; }
  .ps-shop .ps-box { display: block; width: 4.2mm; height: 4.2mm; margin: 0; border-width: 1.4px; }
  .ps-shop .ps-em { font-size: 12pt; }
  .ps-shop .ps-qty { white-space: nowrap; }
  .ps-shop .ps-qty b { font: 600 14pt/1 var(--font-display); color: var(--pa); margin-right: .6mm; }
  .ps-shop .ps-r, .ps-table th.ps-r { text-align: right; white-space: nowrap; }
  .ps-shop tfoot td { padding: 2.6mm 2.5mm; font: 600 11pt var(--font-display); border-top: 1.5px solid var(--pa); border-bottom: 0; }
  .ps-shop tfoot td:last-child { color: var(--pa); font-size: 13pt; }
  .ps-facts { list-style: none; margin: 0; padding: 0; display: block; font-size: 9pt; }
  .ps-facts li { display: flex; justify-content: space-between; gap: 4mm; padding: 1.3mm 0; border-bottom: .5px dotted #d9d2e0; }
  .ps-facts li span { color: #6b6474; }
  .ps-facts li b { font-weight: 600; text-align: right; }
  .ps-hint { margin: 2mm 0 0; padding: 2.5mm 3.5mm; border-radius: 2.5mm; background: color-mix(in srgb, var(--pa) 7%, #fff); border-left: 1.2mm solid var(--pa); font-size: 8.5pt; color: #4a4452; }
}

/* ---------- Panel gościa: strona startowa (gh-*) ---------- */
.gh-hero { text-align: center; margin: .2rem 0 1.1rem; }
.gh-hero .gh-hello { font-family: var(--font-display); font-size: 1.9rem; line-height: 1.15; margin: 0 0 .15rem; }
.gh-hero p { margin: 0; }
.gh-sec { display: flex; align-items: center; gap: .4rem; margin: 1.4rem 0 .6rem; font-family: var(--font-body); font-size: .74rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--muted); }
.gh-sec .icon { width: 15px; height: 15px; }
.gh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: .6rem; }
.gh-tile { display: flex; align-items: center; gap: .75rem; min-height: 64px; padding: .7rem .75rem; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); color: var(--text); text-decoration: none; transition: border-color .15s, transform .15s; }
.gh-tile:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }
.gh-tile:active { transform: scale(.985); }
.gh-ic { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--accent-soft); color: var(--accent-strong, var(--accent)); }
.gh-ic .icon { width: 21px; height: 21px; }
.gh-t { flex: 1; min-width: 0; display: grid; gap: .1rem; }
.gh-t strong { font-size: .96rem; line-height: 1.25; }
.gh-t small { color: var(--muted); font-size: .8rem; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gh-go { flex: none; width: 18px !important; height: 18px !important; color: var(--muted); opacity: .6; }
.gh-todo { display: grid; gap: .5rem; margin-bottom: .6rem; }
.gh-todo .gh-sec { margin-top: .4rem; margin-bottom: .1rem; color: var(--accent-strong, var(--accent)); }
.gh-tile.is-todo { border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); background: color-mix(in srgb, var(--accent) 7%, var(--surface)); }
.gh-tile.is-todo .gh-ic { background: var(--accent); color: var(--on-accent); }
.gh-tile.is-todo .gh-t small { color: var(--text); opacity: .8; white-space: normal; }
.gh-cta { display: flex; align-items: center; gap: .9rem; margin: .9rem 0 .2rem; padding: 1rem 1.1rem; border-radius: 20px; background: var(--accent); color: var(--on-accent); text-decoration: none; }
.gh-cta > span:not(.gh-cta-ic) { flex: 1; display: grid; gap: .1rem; }
.gh-cta strong { font-size: 1.08rem; }
.gh-cta small { opacity: .85; font-size: .82rem; }
.gh-cta-ic { flex: none; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 14px; background: color-mix(in srgb, var(--on-accent) 18%, transparent); }
.gh-cta-ic .icon { width: 26px; height: 26px; }
.gh-cta .gh-go { color: var(--on-accent); opacity: .8; }

/* Galeria gościa: podpis w jednym wierszu – kto i kiedy po lewej, komentarz i kosz obok siebie po prawej */
.gallery-item figcaption.gi-row { display: flex; align-items: center; gap: .4rem; padding: .45rem .5rem .45rem .65rem; }
.gi-row .gi-who { flex: 1; }
.gi-row .gi-acts { flex: none; gap: .3rem; }
.gi-row .gi-acts form.inline { margin-left: 0; }
.gi-row .gi-acts .cm-btn, .gi-row .btn.btn-ic { width: auto; min-width: 34px; min-height: 34px; padding: 0 .4rem; border: 1px solid var(--line); border-radius: 10px; }
.gi-row [data-tip]::after { left: auto; right: 0; }
.enc-notice .enc-unl-btn { min-height: 30px; padding: .2rem .7rem; font-size: .8rem; }

/* Panel gościa: wspólny nagłówek stron, wybór „Tak / Nie” z ikonami */
.gp-head { margin-bottom: .9rem; }
.gp-head h1 { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.gp-head h1 .info-tip { width: 26px; height: 26px; }
.gp-lead { margin: -.4rem 0 .9rem; }
.up-who { margin: .2rem 0 .8rem; display: flex; align-items: center; gap: .2rem; flex-wrap: wrap; }
.choice span { display: flex; flex-direction: column; align-items: center; gap: .4rem; padding: 1rem .6rem; border-radius: 16px; transition: background .15s, border-color .15s, color .15s; }
.choice .ch-ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--surface-2, var(--accent-soft)); font-style: normal; }
.choice .ch-ic .icon { width: 20px; height: 20px; }
.choice input[value="yes"]:checked + span { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.choice input[value="yes"]:checked + span .ch-ic { background: color-mix(in srgb, var(--on-accent) 20%, transparent); }
.choice input[value="no"]:checked + span { border-color: var(--text); background: var(--surface-2, var(--surface)); color: var(--text); }
/* Pobieranie galerii: zielony pasek postępu w tle bloku, na koniec cały blok zielony z „Gotowe” */
.gal-dl-hero { position: relative; overflow: hidden; isolation: isolate; transition: background-color .3s; }
.gal-dl-hero::before { content: ""; position: absolute; inset: 0 auto 0 0; z-index: -1; width: var(--p, 0%); background: color-mix(in srgb, var(--ok) 38%, var(--surface)); transition: width .35s ease; }
.gal-dl-hero:not(.is-busy):not(.is-done)::before { width: 0; }
.gal-dl-hero.is-busy .gal-dl-hero-txt p { font-variant-numeric: tabular-nums; }
.gal-dl-hero.is-busy .gal-dl-main { min-width: 7.5rem; justify-content: center; font-variant-numeric: tabular-nums; opacity: 1; }
.gal-dl-hero.is-done { background: color-mix(in srgb, var(--ok) 22%, var(--surface)); }
.gal-dl-hero.is-done::before { width: 100%; background: color-mix(in srgb, var(--ok) 22%, var(--surface)); }
.gal-dl-hero.is-done .gal-dl-hero-ic { background: var(--ok); color: #fff; }
.gal-dl-hero.is-done h2 { color: var(--ok); }
.gal-dl-hero.is-err { background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.gal-dl-status.is-err { color: var(--danger); }
/* „Dobrze wiedzieć”: małe karty z ikonami zamiast listy wskazówek */
.gal-dl-tipcards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: .5rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.gal-dl-tipcards li { display: flex; align-items: center; gap: .6rem; padding: .65rem .75rem; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); color: var(--muted); font-size: .82rem; line-height: 1.35; }
.gal-dl-tipcards li > span { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: var(--accent-soft); color: var(--accent-strong, var(--accent)); }
.gal-dl-tipcards .icon { width: 17px; height: 17px; }

/* Wybierak emoji z pełnej palety (emoji-picker.js): okienko przy przycisku, na telefonie panel od dołu */
.emo-pop { position: fixed; z-index: 1200; width: 352px; max-width: calc(100vw - 20px); height: 400px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); color: var(--text); box-shadow: 0 18px 50px -18px rgba(0, 0, 0, .45); overflow: hidden; }
.emo-pop[hidden] { display: none; }
.emo-pop.is-sheet { left: 0 !important; right: 0; bottom: 0; top: auto !important; width: 100%; max-width: none; height: min(62vh, 480px); border-radius: 22px 22px 0 0; padding-bottom: env(safe-area-inset-bottom); }
.emo-back { position: fixed; inset: 0; z-index: 1199; background: rgba(0, 0, 0, .35); display: none; }
.emo-back.is-on { display: block; }
.emo-head { display: flex; gap: .4rem; align-items: center; padding: .6rem .6rem .4rem; }
.emo-head input { flex: 1; min-width: 0; margin: 0; padding: .55rem .8rem; border-radius: 12px; font-size: .92rem; }
.emo-x { flex: none; width: 36px; height: 36px; border: 0; border-radius: 10px; background: var(--surface-2, var(--accent-soft)); color: var(--muted); cursor: pointer; font-size: .95rem; }
.emo-tabs { display: flex; gap: .1rem; padding: 0 .4rem .35rem; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.emo-tabs button { flex: 1 0 auto; min-width: 34px; height: 34px; border: 0; border-radius: 9px; background: none; font-size: 1.15rem; cursor: pointer; }
.emo-tabs button:hover { background: var(--accent-soft); }
.emo-body { flex: 1; overflow-y: auto; padding: .2rem .45rem .6rem; overscroll-behavior: contain; }
.emo-body h4 { position: sticky; top: 0; z-index: 1; margin: 0; padding: .45rem .25rem .3rem; background: var(--surface); font: 700 .7rem/1 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.emo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(38px, 1fr)); }
.emo-grid button { aspect-ratio: 1; border: 0; border-radius: 10px; background: none; font-size: 1.45rem; line-height: 1; cursor: pointer; padding: 0; font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif; }
.emo-grid button:hover, .emo-grid button:focus-visible { background: var(--accent-soft); outline: 0; }
.emo-none { margin: 1.2rem .5rem; text-align: center; color: var(--muted); font-size: .9rem; }
/* mały „+” obok gotowych emoji */
.emo-plus { display: inline-grid; place-items: center; width: 36px; height: 36px; border: 1px dashed color-mix(in srgb, var(--accent) 55%, var(--line)); border-radius: 50%; background: var(--surface); color: var(--accent-strong, var(--accent)); cursor: pointer; font-size: 1.15rem; font-weight: 600; line-height: 1; padding: 0; }
.emo-plus:hover { background: var(--accent-soft); }.ip-card .ip-all { margin: -.2rem 0 .5rem auto; display: grid; }

/* Kafle gościa mają też klasy .tile/.tile-accent/.tile-icon, żeby działały reguły szat z themes.css – układ ustawiony jawnie */
.gh-tile.tile, .gh-cta.tile { flex-direction: row; text-align: left; font-weight: 400; box-shadow: none; gap: .75rem; }
.gh-tile.tile { padding: .7rem .75rem; border-radius: 16px; }
.gh-cta.tile { padding: 1rem 1.1rem; border-radius: 20px; grid-column: auto; }
.gh-ic .tile-icon, .gh-cta-ic .tile-icon { width: 21px !important; height: 21px !important; }
.gh-cta-ic .tile-icon { width: 26px !important; height: 26px !important; }

/* ---------- Układy przycisków zależne od szaty (body.gl-*) ---------- */
/* Ikony: jak ekran telefonu – okrągłe ikony z podpisem */
.gl-icons .gh-grid { grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 1.1rem .5rem; }
.gl-icons .gh-grid .gh-tile { flex-direction: column; align-items: center; text-align: center; gap: .45rem; min-height: 0; padding: .2rem; border: 0; background: none; }
.gl-icons .gh-grid .gh-ic { width: 64px; height: 64px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); }
.gl-icons .gh-grid .gh-ic .tile-icon { width: 27px !important; height: 27px !important; }
.gl-icons .gh-grid .gh-t strong { font-size: .8rem; font-weight: 600; }
.gl-icons .gh-grid .gh-t small, .gl-icons .gh-grid .gh-go { display: none; }
/* Karty: dwie kolumny dużych kart, ikona na górze */
.gl-cards .gh-grid { grid-template-columns: repeat(auto-fill, minmax(min(46%, 200px), 1fr)); }
.gl-cards .gh-grid .gh-tile { position: relative; flex-direction: column; align-items: flex-start; justify-content: space-between; min-height: 130px; padding: .9rem; border-radius: 22px; }
.gl-cards .gh-grid .gh-ic { width: 48px; height: 48px; border-radius: 16px; }
.gl-cards .gh-grid .gh-t strong { font-size: 1rem; }
.gl-cards .gh-grid .gh-go { position: absolute; top: .9rem; right: .8rem; }
/* Bąbelki: pigułki, które same się układają */
.gl-bubbles .gh-grid { display: flex; flex-wrap: wrap; gap: .5rem; }
.gl-bubbles .gh-grid .gh-tile { flex: 0 1 auto; min-height: 0; padding: .35rem 1rem .35rem .35rem; border-radius: 999px; gap: .5rem; }
.gl-bubbles .gh-grid .gh-ic { width: 36px; height: 36px; border-radius: 50%; }
.gl-bubbles .gh-grid .gh-ic .tile-icon { width: 18px !important; height: 18px !important; }
.gl-bubbles .gh-grid .gh-t strong { font-size: .9rem; white-space: nowrap; }
.gl-bubbles .gh-grid .gh-t small, .gl-bubbles .gh-grid .gh-go { display: none; }
.gl-bubbles .gh-cta.tile, .gl-bubbles .gh-tile.is-todo { border-radius: 999px; }
/* Mozaika (bento): kafle różnej wielkości */
.gl-bento .gh-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(92px, auto); grid-auto-flow: dense; }
.gl-bento .gh-grid .gh-tile { flex-direction: column; align-items: flex-start; justify-content: space-between; border-radius: 18px; padding: .85rem; }
/* mozaika bez dziur: szeroki kafel, wysoki tylko gdy obok zmieszczą się dwa kolejne, osierocony ostatni rozciągnięty */
.gl-bento .gh-grid .gh-tile:nth-child(5n+1), .gl-bento .gh-grid .gh-tile:nth-child(5n), .gl-bento .gh-grid .gh-tile:nth-child(5n+2):last-child { grid-column: span 2; flex-direction: row; align-items: center; }
.gl-bento .gh-grid .gh-tile:nth-child(5n+2):nth-last-child(n+3) { grid-row: span 2; }
.gl-bento .gh-grid .gh-tile:nth-child(5n+2):nth-last-child(n+3) .gh-ic { width: 56px; height: 56px; }
.gl-bento .gh-grid .gh-go { display: none; }
.gl-bento .gh-grid .gh-tile:nth-child(5n+1) .gh-go { display: block; }
@media (min-width: 760px) {
  .gl-bento .gh-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .gl-bento .gh-grid .gh-tile:nth-child(5n+2):nth-last-child(3) { grid-row: auto; }
  .gl-bento .gh-grid .gh-tile:nth-child(5n+2):nth-last-child(3) .gh-ic { width: 44px; height: 44px; }
  .gl-bento .gh-grid .gh-tile:nth-child(5n+1):nth-last-child(4) { grid-column: auto; flex-direction: column; align-items: flex-start; }
  .gl-bento .gh-grid .gh-tile:nth-child(5n+1):nth-last-child(4) .gh-go { display: none; }
}
/* Bilety: kafel z wycięciami po bokach i perforacją za ikoną */
.gl-tickets .gh-grid .gh-tile, .gl-tickets .gh-tile.is-todo { position: relative; border-radius: 12px; overflow: visible; }
.gl-tickets .gh-grid .gh-tile::before, .gl-tickets .gh-grid .gh-tile::after { content: ""; position: absolute; top: 50%; width: 16px; height: 16px; margin-top: -8px; border-radius: 50%; background: var(--bg); border: 1px solid var(--line); }
.gl-tickets .gh-grid .gh-tile::before { left: -9px; clip-path: inset(0 0 0 50%); }
.gl-tickets .gh-grid .gh-tile::after { right: -9px; clip-path: inset(0 50% 0 0); }
.gl-tickets .gh-grid .gh-ic { margin-right: .25rem; }
.gl-tickets .gh-grid .gh-t { padding-left: .8rem; border-left: 2px dashed var(--line); }
.gl-tickets .gh-grid .gh-t strong { text-transform: uppercase; letter-spacing: .06em; font-size: .86rem; }
/* Polaroidy: przekrzywione odbitki z podpisem */
.gl-polaroid .gh-grid { grid-template-columns: repeat(auto-fill, minmax(min(44%, 170px), 1fr)); gap: 1rem .8rem; }
.gl-polaroid .gh-grid .gh-tile { flex-direction: column; align-items: stretch; gap: .55rem; padding: .55rem .55rem .8rem; border-radius: 4px; background: #fff; color: #2b2622; box-shadow: 0 8px 18px -12px rgba(0, 0, 0, .45); }
.gl-polaroid .gh-grid .gh-tile:nth-child(odd) { transform: rotate(-1.6deg); }
.gl-polaroid .gh-grid .gh-tile:nth-child(even) { transform: rotate(1.3deg); }
.gl-polaroid .gh-grid .gh-tile:active { transform: scale(.98); }
.gl-polaroid .gh-grid .gh-ic { width: 100%; height: 86px; border-radius: 2px; }
.gl-polaroid .gh-grid .gh-ic .tile-icon { width: 32px !important; height: 32px !important; }
.gl-polaroid .gh-grid .gh-t { text-align: center; }
.gl-polaroid .gh-grid .gh-t strong { font-family: var(--font-script, var(--font-display)); font-size: 1.15rem; font-weight: 600; }
.gl-polaroid .gh-grid .gh-t small { color: #7a716a; }
.gl-polaroid .gh-grid .gh-go { display: none; }
/* Mini-podgląd układu na karcie szaty w panelu */
.tp-lay { display: inline-flex; align-items: center; gap: .25rem; margin-left: .3rem; padding: .05rem .45rem; border-radius: 999px; background: var(--accent-soft); color: var(--accent-strong, var(--accent)); font-size: .7rem; font-weight: 600; }
/* Miniatury układu przycisków na kartach szat (panel → Szata graficzna) */
.theme-preview .tp-tile { display: flex; align-items: center; justify-content: center; gap: .3rem; min-width: 0; }
.theme-preview .tp-tile .icon { width: 13px; height: 13px; flex: none; }
.theme-preview .tp-tile span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.theme-preview .tp-tiles.tp-l-list { grid-template-columns: 1fr; gap: .3rem; }
.theme-preview .tp-tiles.tp-l-list .tp-tile { justify-content: flex-start; padding: .35rem .5rem; }
.theme-preview .tp-tiles.tp-l-list .tp-tile:nth-child(4) { display: none; }
.theme-preview .tp-tiles.tp-l-icons { grid-template-columns: repeat(3, 1fr); }
.theme-preview .tp-tiles.tp-l-icons .tp-tile:not(.accent) { flex-direction: column; background: none; border: 0; box-shadow: none; padding: 0; font-size: .62rem; }
.theme-preview .tp-tiles.tp-l-icons .tp-tile:not(.accent) .icon { width: 30px; height: 30px; padding: 8px; box-sizing: border-box; border-radius: 50%; background: var(--surface); border: 1px solid var(--line); color: var(--accent); }
.theme-preview .tp-tiles.tp-l-cards .tp-tile:not(.accent) { flex-direction: column; align-items: flex-start; padding: .45rem; }
.theme-preview .tp-tiles.tp-l-cards .tp-tile:not(.accent) .icon { color: var(--accent); width: 16px; height: 16px; }
.theme-preview .tp-tiles.tp-l-cards { grid-template-columns: repeat(3, 1fr); }
.theme-preview .tp-tiles.tp-l-bento { grid-template-columns: 2fr 1fr 1fr; grid-auto-rows: 1.7rem; }
.theme-preview .tp-tiles.tp-l-bento .tp-tile.accent { grid-column: auto; grid-row: span 2; flex-direction: column; align-items: flex-start; justify-content: flex-end; padding: .35rem .45rem; }
.theme-preview .tp-tiles.tp-l-bento .tp-tile:not(.accent) { padding: 0; }
.theme-preview .tp-tiles.tp-l-bento .tp-tile:not(.accent) span { display: none; }
.theme-preview .tp-tiles.tp-l-bento .tp-tile:nth-child(4) { grid-column: span 2; }
.theme-preview .tp-tiles.tp-l-bubbles { display: flex; flex-wrap: wrap; justify-content: center; gap: .3rem; }
.theme-preview .tp-tiles.tp-l-bubbles .tp-tile { border-radius: 999px; padding: .3rem .6rem; }
.theme-preview .tp-tiles.tp-l-tickets { grid-template-columns: 1fr; gap: .3rem; }
.theme-preview .tp-tiles.tp-l-tickets .tp-tile { justify-content: flex-start; padding: .3rem .5rem; border-radius: 6px; position: relative; -webkit-mask: radial-gradient(circle 5px at 0 50%, #0000 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle 5px at 100% 50%, #0000 98%, #000) right / 51% 100% no-repeat; mask: radial-gradient(circle 5px at 0 50%, #0000 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle 5px at 100% 50%, #0000 98%, #000) right / 51% 100% no-repeat; }
.theme-preview .tp-tiles.tp-l-tickets .tp-tile .icon { padding-right: .35rem; border-right: 1px dashed currentColor; }
.theme-preview .tp-tiles.tp-l-tickets .tp-tile:nth-child(4) { display: none; }
.theme-preview .tp-tiles.tp-l-polaroid { grid-template-columns: repeat(3, 1fr); padding: .7rem .6rem; }
.theme-preview .tp-tiles.tp-l-polaroid .tp-tile:not(.accent) { flex-direction: column; background: #fff; color: #333; border: 0; border-radius: 2px; padding: .25rem .25rem .35rem; box-shadow: 0 2px 5px rgba(0,0,0,.18); font-family: var(--font-script, cursive); font-weight: 400; font-size: .7rem; }
.theme-preview .tp-tiles.tp-l-polaroid .tp-tile:not(.accent) .icon { width: 100%; height: 22px; padding: 4px; box-sizing: border-box; background: var(--accent-soft); color: var(--accent); border-radius: 1px; }
.theme-preview .tp-tiles.tp-l-polaroid .tp-tile:nth-child(2) { transform: rotate(-4deg); }
.theme-preview .tp-tiles.tp-l-polaroid .tp-tile:nth-child(3) { transform: rotate(3deg); }
.theme-preview .tp-tiles.tp-l-polaroid .tp-tile:nth-child(4) { transform: rotate(-2deg); }
.gh-cta.tile strong, .gh-cta.tile small { color: inherit; }
.gh-ic .tile-icon { color: inherit; }
/* szaty z kolorowymi kaflami: kółko ikony półprzezroczyste, ikona w kolorze kafla */
.theme-fiesta .gh-grid .gh-ic, .theme-popart .gh-grid .gh-tile:nth-child(3n+1) .gh-ic, .theme-popart .gh-grid .gh-tile:nth-child(3n+2) .gh-ic { background: rgba(255, 255, 255, .22); }
.theme-fiesta .gh-grid .gh-tile:nth-child(6n+3) .gh-ic { background: rgba(0, 0, 0, .08); }
.layout-guest .gh-cta .gh-cta-ic .tile-icon { color: inherit; }
.theme-preview .tp-tiles.tp-l-bento .tp-tile.accent span { white-space: normal; line-height: 1.1; font-size: .66rem; }

/* Pakiet: zakup jednym kliknięciem i wynik płatności po powrocie z bramki */
.billing-consent { margin: .8rem 0 0; padding: .6rem .8rem; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2, var(--surface)); }
.billing-consent:has(input:checked) { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }
.billing-safe { display: flex; align-items: center; gap: .4rem; margin: .4rem 0 0; }
.billing-safe .icon { width: 15px; height: 15px; flex: none; }
.pay-result { display: flex; align-items: center; gap: .8rem; margin: 0 0 1rem; padding: .9rem 1.1rem; border-radius: 16px; border: 1px solid; }
.pay-result > div { display: grid; gap: .1rem; }
.pay-result span:not(.pay-result-ic) { font-size: .9rem; opacity: .85; }
.pay-result-ic .icon { width: 30px; height: 30px; }
.pay-result.is-ok { background: #e8f6ee; border-color: #9fd5b4; color: #17603a; }
.pay-result.is-wait { background: #eef3fb; border-color: #b8cbe8; color: #23446f; }
.pay-result.is-wait .pay-result-ic .icon { animation: spin 1s linear infinite; }
.pay-result.is-bad { background: #fdeeee; border-color: #efb9b9; color: #8a2424; }
.card form.billing-buy, form.billing-buy { background: none; padding: 0; border: 0; border-radius: 0; box-shadow: none; text-align: left; }
.billing-consent span { text-align: left; }

/* Logowanie: link „Nie pamiętasz hasła?” i strona przypomnienia */
.auth-pw-row { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; }
.auth-pw-row a { font-weight: 500; }
.reset-tips { list-style: none; padding: 0; margin: 0 0 1.2rem; display: grid; gap: .55rem; }
.reset-tips li { display: flex; gap: .5rem; align-items: flex-start; }
.reset-tips .icon { width: 16px; height: 16px; flex: none; margin-top: .15rem; color: var(--accent); }

/* ---------- Panel admina: dziennik błędów (/admin/logs) ---------- */
.lg-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin-bottom: .8rem; }
.lg-stat { display: flex; flex-direction: column; gap: .1rem; padding: .8rem 1rem; color: var(--text); text-decoration: none; }
.lg-stat strong { font-size: 1.6rem; font-weight: 600; line-height: 1.1; }
.lg-stat span { font-size: .8rem; color: var(--muted); }
.lg-stat.is-bad strong { color: var(--danger); }
.lg-filters { display: grid; gap: .5rem; padding: .8rem 1rem; margin-bottom: 1rem; }
.lg-filters .chips { margin: 0; }
.lg-filters .chip { text-decoration: none; }
.lg-filters .chip.is-on { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-strong); }
.lg-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.lg-row select { flex: 0 0 auto; width: auto; margin: 0; }
.lg-row input[type="search"] { flex: 1 1 200px; min-width: 0; margin: 0; }
.lg-h { font-size: 1rem; margin: 1.1rem 0 .5rem; }
.lg-badge { display: inline-block; padding: .12rem .5rem; border-radius: 999px; font: 600 .7rem var(--font-body); letter-spacing: .02em; white-space: nowrap; }
.lg-err { background: var(--danger-soft); color: var(--danger); }
.lg-warn { background: var(--warn-soft); color: var(--warn); }
.lg-slow { background: var(--accent-soft); color: var(--accent-strong); }
.lg-muted { background: var(--surface-2); color: var(--muted); }
.lg-groups { padding: .3rem 0; }
.lg-group { display: flex; gap: .7rem; align-items: flex-start; padding: .6rem 1rem; color: var(--text); text-decoration: none; border-top: 1px solid var(--line); }
.lg-group:first-child { border-top: 0; }
.lg-group:hover { background: var(--surface-2); }
.lg-n { flex: 0 0 auto; min-width: 2.6rem; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--accent-strong); }
.lg-gmain { display: grid; gap: .2rem; min-width: 0; }
.lg-msg { overflow-wrap: anywhere; }
.lg-gmain small, .lg-where { overflow-wrap: anywhere; }
.lg-list { display: grid; gap: .45rem; }
.lg-entry { padding: 0; }
.lg-entry summary { display: grid; gap: .25rem; padding: .7rem 1rem; cursor: pointer; list-style: none; }
.lg-entry summary::-webkit-details-marker { display: none; }
.lg-entry[open] summary { border-bottom: 1px solid var(--line); }
.lg-top { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; font-size: .8rem; color: var(--muted); }
.lg-status { font-weight: 600; color: var(--text); }
.lg-id { margin-left: auto; font-size: .75rem; background: var(--surface-2); padding: .1rem .4rem; border-radius: 6px; }
.lg-dl { display: grid; grid-template-columns: minmax(110px, max-content) minmax(0, 1fr); gap: .3rem .9rem; margin: 0; padding: .8rem 1rem; font-size: .85rem; }
.lg-dl dt { color: var(--muted); }
.lg-dl dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.lg-pre { margin: 0 1rem 1rem; padding: .7rem .8rem; max-height: 340px; overflow: auto; background: var(--surface-2); border-radius: var(--radius-sm); font-size: .74rem; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.lg-empty { display: flex; align-items: center; gap: .5rem; padding: 1rem; color: var(--ok); }
.lg-php { margin-top: 1rem; padding: 0; }
.lg-php > summary { padding: .8rem 1rem; cursor: pointer; display: flex; align-items: center; gap: .5rem; font-weight: 500; }
.lg-php > p { margin: 0 1rem .6rem; }
.lg-php > .lg-pre { margin-top: 0; }
.lg-files { display: flex; flex-wrap: wrap; gap: .4rem; padding: 0 1rem 1rem; }
.lg-files .chip { text-decoration: none; }
@media (max-width: 760px) {
  .lg-stats { gap: .4rem; }
  .lg-stat { padding: .6rem .7rem; }
  .lg-stat strong { font-size: 1.3rem; }
  .lg-dl { grid-template-columns: minmax(0, 1fr); gap: .1rem; }
  .lg-dl dd { margin-bottom: .45rem; }
  .lg-id { margin-left: 0; }
}