/* Panel sklepu – ten sam system wyglądu co strona (docs/08-system-wygladu.md): styl Apple + róże.
   Inter (tekst), Archivo ściśnięte (nagłówki) z odręcznym wyróżnieniem Caveat w <em>, IBM Plex Mono (etykiety),
   zaokrąglone kafle, przyciski-pigułki, miękkie cienie, grafiki 3D z serii (img/). Komputer: menu boczne; telefon/tablet: dolny pasek. */
@font-face { font-family: 'Inter'; font-weight: 400 800; font-display: swap; src: url(../assets/fonts/Inter-latin-opt.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Inter'; font-weight: 400 800; font-display: swap; src: url(../assets/fonts/Inter-ext-opt.woff2) format('woff2'); unicode-range: U+0100-017F; }
@font-face { font-family: 'Archivo'; font-weight: 700 800; font-stretch: 72% 112%; font-display: swap; src: url(../assets/fonts/Archivo-latin-opt.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Archivo'; font-weight: 700 800; font-stretch: 72% 112%; font-display: swap; src: url(../assets/fonts/Archivo-ext-opt.woff2) format('woff2'); unicode-range: U+0100-017F; }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 600; font-display: swap; src: url(../assets/fonts/IBMPlexMono-latin-600.woff2) format('woff2'); unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 600; font-display: swap; src: url(../assets/fonts/IBMPlexMono-latin-ext-600.woff2) format('woff2'); unicode-range: U+0100-02BA; }
@font-face { font-family: 'Caveat'; font-weight: 700; font-display: swap; src: url(../assets/fonts/Caveat-latin-opt.woff2) format('woff2'); unicode-range: U+0000-00FF, U+2000-206F; }
@font-face { font-family: 'Caveat'; font-weight: 700; font-display: swap; src: url(../assets/fonts/Caveat-ext-opt.woff2) format('woff2'); unicode-range: U+0100-017F; }

:root {
  --g: #1d1b20; --g2: #2b2830; --g3: #3d3943; --ink2: #48444e; --ink3: #6e6a73;
  --pink: #f16f9d; --pink6: #e14f86; --pink7: #c73a70; --pink3: #f5b5ce; --pink1: #fde8f0; --pink05: #fff5f9;
  --lilac: #b9b6db; --lilac2: #ddcde5; --lilac1: #f1ecf6;
  --bg: #f7f4f2; --bg2: #f2eef0; --white: #fff;
  --line: rgba(29, 27, 32, .1); --line2: rgba(29, 27, 32, .18);
  --ok: #1f6b49; --ok1: #e3f4ec; --warn: #7a4b00; --warn1: #fff1d9; --err: #b0233a; --err1: #fbe8eb; --blue: #1f5a96; --blue1: #e7f0fb; --vio: #574aa3; --vio1: #efeaf8;
  --r-sm: 14px; --r: 22px; --r-lg: 30px;
  --sh: 0 1px 2px rgba(20, 18, 23, .04), 0 14px 34px -14px rgba(20, 18, 23, .16);
  --sh-lg: 0 2px 6px rgba(20, 18, 23, .06), 0 30px 70px -20px rgba(20, 18, 23, .3);
  --f: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; --f-d: 'Archivo', 'Inter', sans-serif; --f-m: 'IBM Plex Mono', ui-monospace, Consolas, monospace; --f-h: 'Caveat', 'Segoe Print', cursive;
  --side: 256px; --tab: 66px; --ease: cubic-bezier(.2, .8, .2, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; min-height: 100vh; font: 400 16.5px/1.5 var(--f); color: var(--g); background: var(--bg); -webkit-font-smoothing: antialiased; overflow-x: clip; }
img { max-width: 100%; }
a { color: var(--pink7); text-underline-offset: .18em; }
a:hover { color: var(--pink6); }
button { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--pink3); outline-offset: 2px; }
code { font: .88em var(--f-m); background: var(--bg2); padding: .1em .35em; border-radius: 6px; }
[hidden] { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.muted { color: var(--ink3); }
.i { width: 1.15em; height: 1.15em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* tło: delikatna poświata róż/liliowy u góry (jak hero strony) */
.glow { position: fixed; inset: 0 0 auto; height: 520px; pointer-events: none; z-index: -1;
  background: radial-gradient(60% 70% at 85% -10%, rgba(241, 111, 157, .16), transparent 70%), radial-gradient(50% 60% at 30% -20%, rgba(185, 182, 219, .28), transparent 70%); }

/* ---------- typografia ---------- */
h1, h2, h3 { margin: 0; font-family: var(--f-d); font-weight: 800; font-stretch: 80%; letter-spacing: -.005em; line-height: .98; }
h1 { font-size: clamp(2.1rem, 1.5rem + 2.1vw, 3.25rem); overflow-wrap: anywhere; }
h2 { font-size: 1.45rem; }
h1 em, h2 em { font-family: var(--f-h); font-style: normal; font-weight: 700; font-stretch: normal; font-size: 1.12em; color: var(--pink6); letter-spacing: 0; line-height: .8; }
.kicker { margin: 0 0 .55rem; font: 600 .76rem/1.3 var(--f-m); letter-spacing: .12em; text-transform: uppercase; color: var(--pink7); }
.kicker--sm { font-size: .7rem; margin-bottom: .45rem; }
.hint { display: block; margin: .1rem 0 1rem; font-size: .9rem; line-height: 1.45; color: var(--ink3); }
small { font-size: .86em; }

/* ---------- przyciski ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 50px; padding: 0 1.45rem; border: 0; border-radius: 999px; background: var(--g); color: #fff; font: 600 1rem/1.1 var(--f); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background .2s, transform .2s var(--ease), box-shadow .2s; }
.btn:hover { background: var(--g3); color: #fff; }
.btn:active { transform: scale(.97); }
.btn--pink { background: var(--pink); color: var(--g); box-shadow: 0 8px 22px -10px rgba(225, 79, 134, .7); }
.btn--pink:hover { background: var(--pink6); color: var(--g); }
.btn--ghost { background: rgba(255, 255, 255, .6); color: var(--g); box-shadow: inset 0 0 0 1.5px var(--line2); }
.btn--ghost:hover { background: #fff; color: var(--g); box-shadow: inset 0 0 0 1.5px var(--g); }
.btn--danger { background: transparent; color: var(--err); box-shadow: inset 0 0 0 1.5px rgba(176, 35, 58, .35); }
.btn--danger:hover { background: var(--err1); color: var(--err); }
.btn--danger-fill { background: var(--err); color: #fff; } .btn--danger-fill:hover { background: #8f1a2e; }
.btn--sm { min-height: 44px; padding: 0 1.05rem; font-size: .93rem; }
.btn--lg { min-height: 56px; padding: 0 1.9rem; font-size: 1.05rem; }
.btn--block { width: 100%; }
.btn .i { width: 1.1em; height: 1.1em; }
.iconbtn { display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none; border: 0; border-radius: 50%; background: var(--bg); color: var(--g); cursor: pointer; font-size: 1.3rem; line-height: 1; transition: background .2s; }
.iconbtn:hover { background: var(--pink1); color: var(--pink7); }
.chip { display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; padding: 0 .95rem; border: 0; border-radius: 999px; background: var(--bg); color: var(--ink2); font: 600 .88rem/1 var(--f); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background .2s, color .2s; }
.chip:hover, .chip.is-on { background: var(--pink1); color: var(--pink7); }
.chip .i { width: 1em; height: 1em; }
.chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.chips--pick { margin: -.4rem 0 1rem; }
.chips__lbl { align-self: center; font-size: .86rem; color: var(--ink3); margin-right: .2rem; }

/* odznaki i statusy */
.tag { display: inline-flex; align-items: center; padding: .22rem .6rem; border-radius: 999px; background: var(--bg2); color: var(--ink2); font-size: .76rem; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.tag--pink { background: var(--pink1); color: var(--pink7); } .tag--lilac { background: var(--vio1); color: var(--vio); } .tag--blue { background: var(--blue1); color: var(--blue); }
.tag--red { background: var(--err1); color: var(--err); } .tag--dark { background: var(--g); color: #fff; } .tag--plain { background: transparent; padding-left: 0; color: var(--ink3); font-weight: 500; }
.st { display: inline-flex; align-items: center; gap: .45rem; padding: .32rem .8rem .32rem .65rem; border-radius: 999px; font-size: .86rem; font-weight: 700; line-height: 1.2; white-space: nowrap; }
.st i { width: .55rem; height: .55rem; border-radius: 50%; background: currentColor; flex: none; }
.st small { font-weight: 500; opacity: .85; }
.st--nowe { background: var(--pink1); color: var(--pink7); } .st--nowe i { background: var(--pink); box-shadow: 0 0 0 3px rgba(241, 111, 157, .25); }
.st--oplacone { background: var(--vio1); color: var(--vio); }
.st--wyslane { background: var(--blue1); color: var(--blue); }
.st--zrealizowane { background: var(--ok1); color: var(--ok); }
.st--anulowane { background: var(--err1); color: var(--err); }

/* ---------- układ: menu boczne (komputer) / belka + dolny pasek (telefon, tablet) ---------- */
.top { position: fixed; inset: 0 auto 0 0; width: var(--side); z-index: 20; display: flex; flex-direction: column; gap: 1.6rem; padding: 1.6rem 1rem 1.2rem; background: rgba(255, 255, 255, .72); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); border-right: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: .55rem; min-height: 44px; padding: 0 .55rem; text-decoration: none; }
.brand img { display: block; height: 36px; width: auto; }
.brand__tag { padding: .2rem .55rem; border-radius: 999px; background: var(--pink1); color: var(--pink7); font: 600 .68rem/1.2 var(--f-m); letter-spacing: .1em; text-transform: uppercase; }
.nav { display: grid; gap: .25rem; }
.nav__a { position: relative; display: flex; align-items: center; gap: .8rem; min-height: 52px; padding: .4rem .9rem .4rem .55rem; border-radius: 16px; color: var(--ink2); font-weight: 600; text-decoration: none; transition: background .2s, color .2s; }
.nav__a:hover { background: rgba(255, 255, 255, .9); color: var(--g); }
.nav__a[aria-current] { background: var(--g); color: #fff; box-shadow: 0 10px 24px -14px rgba(20, 18, 23, .8); }
.nav__a__ic, .tab__ic { width: 34px; height: 34px; object-fit: contain; flex: none; transition: transform .25s var(--ease); }
.nav__a:hover .nav__a__ic { transform: scale(1.08) rotate(-4deg); }
.badge-n { min-width: 1.5rem; height: 1.5rem; padding: 0 .4rem; margin-left: auto; display: inline-grid; place-items: center; border-radius: 999px; background: var(--pink); color: var(--g); font-size: .78rem; font-weight: 800; }
.top__foot { margin-top: auto; display: grid; gap: .3rem; }
.top__foot form { margin: 0; }
.top__shop, .top__out { display: flex; align-items: center; gap: .75rem; width: 100%; min-height: 48px; padding: .3rem .9rem .3rem .6rem; border: 0; border-radius: 14px; background: none; color: var(--ink2); font-weight: 600; font-size: .95rem; text-decoration: none; cursor: pointer; }
.top__shop:hover, .top__out:hover { background: rgba(255, 255, 255, .9); color: var(--g); }
.top__shop img { width: 30px; height: 30px; }
.top__shop .i { margin-left: auto; width: 1em; opacity: .6; }
.top__out .i { width: 30px; padding: 4px; }
.tabbar { display: none; }
@media (min-width: 1080px) { body.has-nav { background: linear-gradient(90deg, rgba(255, 255, 255, .55) calc(var(--side) - 1px), var(--line) calc(var(--side) - 1px), var(--line) var(--side), var(--bg) var(--side)); } }
.main { margin-left: var(--side); max-width: none; padding: 2.4rem clamp(1rem, 2.6vw, 3rem) 6rem; }
body.is-auth .main { margin: 0 auto; max-width: none; padding: 0; }

@media (max-width: 1079px) {
  .top { position: sticky; inset: 0 0 auto; width: auto; height: auto; flex-direction: row; align-items: center; gap: .6rem; padding: .55rem max(.9rem, env(safe-area-inset-left)) .55rem max(1rem, env(safe-area-inset-left)); border-right: 0; border-bottom: 1px solid var(--line); }
  .brand { padding: 0; } .brand img { height: 30px; }
  .nav { display: none; }
  .top__foot { margin: 0 0 0 auto; display: flex; gap: .2rem; }
  .top__shop, .top__out { width: auto; min-height: 44px; padding: 0 .7rem; font-size: .9rem; }
  .top__shop img { width: 26px; height: 26px; }
  .top__shop .i { display: none; }
  .top__out .i { width: 24px; padding: 2px; }
  .tabbar { position: fixed; inset: auto 0 0; z-index: 25; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .1rem; padding: .35rem .3rem calc(.35rem + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .86); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); border-top: 1px solid var(--line); }
  .tab { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1rem; min-height: 56px; padding: .2rem 0; border-radius: 16px; color: var(--ink3); font-size: .62rem; white-space: nowrap; letter-spacing: -.01em; font-weight: 600; text-decoration: none; text-align: center; line-height: 1.1; }
  .tab__ic { width: 30px; height: 30px; padding: 2px; border-radius: 12px; }
  .tab[aria-current] { color: var(--g); }
  .tab[aria-current] .tab__ic { background: var(--pink1); box-shadow: 0 0 0 4px var(--pink1); }
  .tab .badge-n { position: absolute; top: 2px; left: calc(50% + 6px); margin: 0; min-width: 1.25rem; height: 1.25rem; font-size: .7rem; }
  .main { margin-left: 0; padding: 1.6rem max(1rem, env(safe-area-inset-left)) calc(var(--tab) + 4.5rem + env(safe-area-inset-bottom)); }
}
@media (max-width: 520px) { .top__shop span, .top__out span { display: none; } .top__shop, .top__out { padding: 0; width: 44px; justify-content: center; } }

/* ---------- nagłówek widoku ---------- */
.back { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; margin: -.6rem 0 .3rem -.4rem; padding: 0 .7rem 0 .4rem; border-radius: 999px; color: var(--ink2); font-weight: 600; font-size: .95rem; text-decoration: none; }
.back:hover { background: #fff; color: var(--g); }
.head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; margin-bottom: 1.8rem; }
.head__txt { min-width: 0; flex: 1 1 26rem; }
.head__act { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.head__lead { max-width: 46rem; margin: .9rem 0 0; font-size: 1.08rem; color: var(--ink2); }
.pill-kpi { display: inline-flex; align-items: center; gap: .6rem; margin: 0; padding: .45rem 1.1rem .45rem .5rem; border-radius: 999px; background: #fff; box-shadow: var(--sh); color: var(--ink2); font-weight: 600; }
.pill-kpi img { width: 34px; height: 34px; }
.pill-kpi b { color: var(--pink7); margin-left: .25rem; }

/* ---------- karty ---------- */
.card { position: relative; display: block; margin-bottom: 1.25rem; padding: clamp(1.15rem, 2.4vw, 1.75rem); background: #fff; border-radius: var(--r); box-shadow: var(--sh); color: inherit; min-width: 0; }
.card__h { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.1rem; min-height: 44px; }
.card__ic { width: 46px; height: 46px; object-fit: contain; flex: none; margin: -.3rem 0; filter: drop-shadow(0 6px 8px rgba(225, 79, 134, .18)); }
.card__h h2 { flex: 1; min-width: 0; }
.card__side { margin-left: auto; flex: none; }
.count { font: 600 .8rem var(--f-m); color: var(--ink3); }
.more { display: inline-flex; align-items: center; gap: .3rem; margin-top: .9rem; min-height: 44px; font-weight: 600; text-decoration: none; }
.h3 { margin: 1.2rem 0 .5rem; font-size: 1.1rem; }

/* komunikaty */
.flash { display: flex; align-items: center; gap: .75rem; margin: 0 0 1.4rem; padding: .85rem .6rem .85rem 1.1rem; border-radius: 18px; background: #fff; box-shadow: var(--sh); font-weight: 600; animation: pop .45s var(--ease); }
.flash > .i { width: 1.6rem; height: 1.6rem; padding: .3rem; border-radius: 50%; flex: none; }
.flash span { flex: 1; min-width: 0; }
.flash--ok > .i { background: var(--ok1); color: var(--ok); }
.flash--warn { background: var(--warn1); } .flash--warn > .i { background: #fff; color: var(--warn); }
.flash--err { background: var(--err1); color: var(--err); } .flash--err > .i { background: #fff; }
.flash__x { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border: 0; border-radius: 50%; background: transparent; cursor: pointer; color: inherit; opacity: .6; }
.flash__x:hover { opacity: 1; background: rgba(0, 0, 0, .05); }
@keyframes pop { from { opacity: 0; transform: translateY(-8px) scale(.98); } }
.alerts { display: grid; gap: .6rem; margin-bottom: 1.4rem; }
.alert { display: flex; align-items: center; gap: .75rem; margin: 0 0 1rem; padding: .9rem 1rem; border-radius: 18px; font-size: .96rem; line-height: 1.4; text-decoration: none; color: inherit; }
.alerts .alert { margin: 0; }
.alert > .i:first-child { width: 1.4rem; height: 1.4rem; flex: none; }
.alert > span { flex: 1; min-width: 0; }
.alert > .i:last-child:not(:first-child) { opacity: .5; }
a.alert:hover { color: inherit; filter: brightness(.98); }
.alert--warn { background: var(--warn1); color: var(--warn); }
.alert--err { background: var(--err1); color: var(--err); }
.alert--info { background: var(--vio1); color: var(--vio); }

/* puste stany */
.empty { text-align: center; padding: clamp(2rem, 5vw, 3.5rem) 1.5rem; }
.empty img { width: 150px; height: auto; margin: 0 auto .6rem; display: block; filter: drop-shadow(0 18px 20px rgba(225, 79, 134, .2)); }
.empty__t { margin: 0 0 .3rem; font: 800 1.5rem/1.05 var(--f-d); font-stretch: 80%; }
.empty p { color: var(--ink2); margin: .3rem auto 1.1rem; max-width: 30rem; }
.empty--inline { display: flex; align-items: center; gap: 1.2rem; text-align: left; padding: .4rem 0; }
.empty--inline img { width: 96px; margin: 0; }
.empty--inline p { margin: .2rem 0 0; }
.empty--filter { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: 2rem 1rem; color: var(--ink3); font-weight: 600; }
.empty--filter img { width: 90px; margin: 0; }
.empty--filter[hidden] { display: none; }

/* ---------- PULPIT ---------- */
.kpis { display: grid; grid-template-columns: 1.25fr 1.25fr 1fr 1fr; gap: 1rem; margin-bottom: 1.6rem; }
.kpi { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; min-height: 178px; padding: 1.2rem 1.3rem 1.25rem; border-radius: var(--r); color: var(--g); text-decoration: none; box-shadow: var(--sh); isolation: isolate; transition: transform .3s var(--ease), box-shadow .3s; }
.kpi:hover { color: var(--g); transform: translateY(-3px); box-shadow: var(--sh-lg); }
.kpi--pink { background: linear-gradient(150deg, #ffe3ee, #fff6fa 70%); }
.kpi--lilac { background: linear-gradient(150deg, #e9e3f7, #faf8fd 70%); }
.kpi--blue { background: linear-gradient(150deg, #e3edf9, #f9fbfe 70%); }
.kpi--warm { background: linear-gradient(150deg, #f3ece6, #fffdfb 70%); }
.kpi__img { position: absolute; z-index: -1; top: -.4rem; right: -.6rem; width: 112px; height: 112px; object-fit: contain; transform: rotate(6deg); transition: transform .4s var(--ease); filter: drop-shadow(0 14px 16px rgba(60, 30, 60, .14)); }
.kpi:hover .kpi__img { transform: rotate(0) scale(1.06); }
.kpi__label { font: 600 .72rem/1.3 var(--f-m); letter-spacing: .1em; text-transform: uppercase; color: var(--ink2); max-width: 62%; }
.kpi__num { margin: .2rem 0 .15rem; font: 800 2.9rem/1 var(--f-d); font-stretch: 78%; letter-spacing: -.01em; white-space: nowrap; }
.kpi--warm .kpi__num { font-size: 2.2rem; }
.kpi__sub { font-size: .9rem; color: var(--ink2); font-weight: 500; }
.dash { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.todos { list-style: none; margin: 0 -.6rem; padding: 0; }
.todos li + li { border-top: 1px solid var(--line); }
.todo { display: grid; grid-template-columns: auto minmax(0, 1.1fr) minmax(0, 1fr) auto 1.2rem; gap: .5rem 1rem; align-items: center; min-height: 64px; padding: .7rem .6rem; border-radius: 16px; color: inherit; text-decoration: none; }
.todo:hover { background: var(--pink05); color: inherit; }
.todo__st { display: flex; flex-direction: column; align-items: flex-start; gap: .25rem; }
.todo__who b, .todo__who small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.todo__who small, .todo__what { color: var(--ink3); font-size: .88rem; }
.todo__what { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.todo__sum { font-weight: 800; white-space: nowrap; }
.todo > .i { color: var(--ink3); }
.quick { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; margin-bottom: 1.25rem; }
.quick a { display: flex; align-items: center; gap: .65rem; min-height: 64px; padding: .6rem .8rem; border-radius: 18px; background: #fff; box-shadow: var(--sh); color: var(--g); font-weight: 700; font-size: .95rem; line-height: 1.2; text-decoration: none; transition: transform .25s var(--ease); }
.quick a:hover { transform: translateY(-2px); color: var(--g); }
.quick img { width: 40px; height: 40px; flex: none; }
.quick small { display: block; color: var(--ink3); font-weight: 500; }
.minis { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.minis a { display: flex; align-items: center; gap: .8rem; min-height: 56px; padding: .3rem .4rem; margin: 0 -.4rem; border-radius: 14px; color: inherit; text-decoration: none; }
.minis a:hover { background: var(--pink05); }
.minis b { display: block; font-size: .95rem; line-height: 1.25; }
.mini { display: grid; place-items: center; width: 52px; height: 52px; flex: none; border-radius: 14px; background: var(--pink05); overflow: hidden; }
.mini img { width: 100%; height: 100%; object-fit: contain; }
.mini .noimg { width: 70%; height: 70%; }
.stock { display: block; font-size: .84rem; color: var(--ink3); font-weight: 600; }
.stock--low { color: var(--warn); } .stock--out { color: var(--err); }
.mchips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .45rem; }
.mchips li { display: inline-flex; align-items: center; gap: .45rem; padding: .35rem .45rem .35rem .8rem; border-radius: 999px; background: var(--bg); font-weight: 600; font-size: .9rem; }
.mchips b { padding: .15rem .55rem; border-radius: 999px; background: var(--pink1); color: var(--pink7); font-size: .82rem; }

/* płatności online (Przelewy24) */
.p24 { display: flex; gap: 1rem; align-items: flex-start; padding: 1rem 1.1rem; border-radius: 18px; background: var(--bg); }
.p24__ic { width: 56px; height: 56px; flex: none; }
.p24__body { min-width: 0; }
.p24__name { margin: 0; font-weight: 700; } .p24__name span { font-weight: 500; color: var(--ink3); }
.p24__state { display: inline-flex; align-items: center; gap: .45rem; margin: .35rem 0 .2rem; padding: .25rem .75rem .25rem .6rem; border-radius: 999px; font-size: .88rem; font-weight: 700; }
.p24__state i { width: .55rem; height: .55rem; border-radius: 50%; background: currentColor; }
.p24--off .p24__state { background: #fff; color: var(--ink2); }
.p24--wait .p24__state { background: var(--warn1); color: var(--warn); }
.p24--ok .p24__state { background: var(--ok1); color: var(--ok); }
.p24--ok { background: linear-gradient(150deg, #e7f6ee, #f8fcfa); }
.p24__txt { margin: .35rem 0 0; font-size: .93rem; color: var(--ink2); }
.p24__err { margin: .5rem 0 0; padding: .45rem .7rem; border-radius: 10px; background: #fff; font: .8rem/1.4 var(--f-m); color: var(--warn); overflow-wrap: anywhere; }
.p24__chk { margin: .4rem 0 0; font-size: .8rem; color: var(--ink3); }
.p24 .tag { margin-top: .4rem; }
.p24--compact .p24__name { display: none; }
.p24--compact { align-items: center; }
.card--p24 .card__h { margin-bottom: .8rem; }

/* ---------- ZAMÓWIENIA ---------- */
.toolbar { display: flex; flex-wrap: wrap; gap: .8rem 1rem; align-items: center; justify-content: space-between; margin-bottom: 1.1rem; }
.tabs { display: flex; flex-wrap: wrap; gap: .4rem; }
.tabs a, .tabs button { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; padding: 0 1rem; border: 0; border-radius: 999px; background: #fff; color: var(--ink2); font-weight: 600; font-size: .94rem; text-decoration: none; box-shadow: var(--sh); cursor: pointer; }
.tabs i { width: .5rem; height: .5rem; border-radius: 50%; background: var(--lilac); }
.tab--nowe i { background: var(--pink); } .tab--oplacone i { background: #8f7fd6; } .tab--wyslane i { background: #4d8fd6; } .tab--zrealizowane i { background: #3aa776; } .tab--anulowane i { background: #d0465a; }
.tabs b { min-width: 1.6em; padding: .1rem .45rem; border-radius: 999px; background: var(--bg); color: var(--g); font-size: .78rem; text-align: center; }
.tabs [aria-current] { background: var(--g); color: #fff; } .tabs [aria-current] b { background: var(--pink); color: var(--g); }
.search { position: relative; display: flex; align-items: center; flex: 0 1 20rem; min-width: 14rem; }
.search .i { position: absolute; left: 1rem; color: var(--ink3); pointer-events: none; }
.search input { width: 100%; min-height: 46px; padding: 0 1rem 0 2.75rem; border: 0; border-radius: 999px; background: #fff; box-shadow: var(--sh); font: inherit; }
.search input:focus { outline: 0; box-shadow: 0 0 0 3px var(--pink1), var(--sh); }
.card--table { padding: .4rem .6rem; }
.orders { width: 100%; border-collapse: separate; border-spacing: 0; }
.orders th { padding: .9rem .8rem .6rem; text-align: left; font: 600 .7rem var(--f-m); letter-spacing: .1em; text-transform: uppercase; color: var(--ink3); }
.orders td { padding: .95rem .8rem; border-top: 1px solid var(--line); vertical-align: middle; }
.orders tbody tr { cursor: pointer; transition: background .15s; }
.orders tbody tr:hover td { background: var(--pink05); }
.orders tbody tr:hover td:first-child { border-radius: 14px 0 0 14px; } .orders tbody tr:hover td:last-child { border-radius: 0 14px 14px 0; }
.orders td small { display: block; margin-top: .15rem; color: var(--ink3); font-size: .84rem; }
.orders .o-nr a { display: inline-block; padding: .55rem 0; margin: -.55rem 0; color: var(--g); text-decoration: none; font-variant-numeric: tabular-nums; white-space: nowrap; }
.orders .o-who small { max-width: 15rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.orders .o-what span { display: block; max-width: 22rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.orders .tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .35rem; }
.orders .o-sum { white-space: nowrap; font-variant-numeric: tabular-nums; }
.orders .o-st { text-align: right; }
.orders .o-st .tag { margin: .3rem 0 0; }
.orders tr[hidden] { display: none; }

/* szczegóły zamówienia */
.steps { list-style: none; display: flex; margin: 1.2rem 0 0; padding: 0; max-width: 34rem; }
.steps li { position: relative; flex: 1; display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; font-size: .8rem; font-weight: 600; color: var(--ink3); }
.steps li::before { content: ''; position: absolute; top: .45rem; left: 1rem; right: 0; height: 3px; border-radius: 3px; background: var(--line); }
.steps li:last-child { flex: none; } .steps li:last-child::before { display: none; }
.steps i { position: relative; width: 1rem; height: 1rem; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 3px var(--line2); }
.steps .is-done::before, .steps .is-done i { background: var(--pink); box-shadow: none; }
.steps .is-done { color: var(--ink2); }
.steps .is-now { color: var(--g); }
.steps .is-now i { background: var(--g); box-shadow: 0 0 0 5px var(--pink1); }
.next { display: flex; align-items: center; gap: 1rem 2rem; flex-wrap: wrap; margin-bottom: 1.4rem; padding: 1.2rem 1.4rem; border-radius: var(--r); background: linear-gradient(120deg, var(--g) 0%, var(--g2) 60%, #4a3448 100%); color: #fff; box-shadow: var(--sh-lg); }
.next .kicker { color: var(--pink3); margin-bottom: .3rem; }
.next__txt { flex: 1 1 22rem; min-width: 0; }
.next__txt p:last-child { margin: 0; line-height: 1.5; }
.next__txt b { color: #fff; } .next a { color: var(--pink3); }
.next__form { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: 0; flex: 0 1 auto; }
.next__form small { flex-basis: 100%; color: rgba(255, 255, 255, .6); font-size: .8rem; padding-left: .4rem; }
.next__form .field { margin: 0; flex: 1 1 15rem; }
.next__form input { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .25); color: #fff; }
.next__form input::placeholder { color: rgba(255, 255, 255, .55); }
.next__btn { white-space: normal; text-align: center; }
.ord { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.ord__side { position: sticky; top: 1.5rem; }
.lines { list-style: none; margin: 0; padding: 0; }
.line { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto auto; gap: .4rem 1rem; align-items: center; padding: .75rem 0; border-top: 1px solid var(--line); }
.line:first-child { border-top: 0; padding-top: 0; }
.line__txt b { display: block; line-height: 1.3; }
.line__txt small { display: block; color: var(--ink3); }
.line__qty { color: var(--ink2); font-size: .92rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.line__sum { white-space: nowrap; font-variant-numeric: tabular-nums; }
.personal { display: inline-block; margin-top: .35rem; padding: .3rem .65rem; border-radius: 10px; background: var(--pink1); font-size: .9rem; }
.totals { margin: .6rem 0 0; padding-top: .6rem; border-top: 1px solid var(--line); }
.totals div { display: flex; justify-content: space-between; gap: 1rem; padding: .3rem 0; color: var(--ink2); }
.totals dd { margin: 0; white-space: nowrap; font-variant-numeric: tabular-nums; }
.totals .sum { margin-top: .3rem; padding-top: .6rem; border-top: 1px dashed var(--line2); color: var(--g); font-weight: 800; font-size: 1.15rem; }
.who { margin: 0 0 .9rem; } .who b { display: block; font-size: 1.15rem; } .who span { color: var(--ink2); }
.contact { display: flex; flex-wrap: wrap; gap: .5rem; }
.contact .btn { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.note { margin-top: 1rem; padding: .9rem 1rem; border-radius: 16px; background: var(--pink05); }
.note p:last-child { margin: 0; }
.facts { margin: 0; display: grid; gap: .2rem; }
.facts > div { display: grid; grid-template-columns: 10.5rem minmax(0, 1fr); gap: .8rem; padding: .7rem 0; border-top: 1px solid var(--line); }
.facts > div:first-child { border-top: 0; padding-top: 0; }
.facts dt { display: flex; align-items: center; gap: .55rem; font-weight: 700; color: var(--ink2); align-self: start; }
.facts dt img { width: 36px; height: 36px; flex: none; }
.facts dd { margin: 0; display: grid; gap: .1rem; padding-top: .35rem; }
.facts dd span { color: var(--ink2); font-size: .94rem; }
.consents { margin-top: 1rem; padding: .9rem 1rem; border-radius: 16px; background: var(--bg); }
.consents ul { margin: 0; padding-left: 1.1rem; font-size: .93rem; } .consents .hint { margin: .4rem 0 0; }
.design__name { margin: -.4rem 0 .8rem; font-weight: 700; }
.dprev { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0 0 1rem; }
.dprev img { width: 170px; max-width: 100%; height: auto; border-radius: 14px; background: var(--bg); box-shadow: 0 0 0 1px var(--line); display: block; }
.dspec { margin: 0; }
.dspec > div { display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: .8rem; padding: .55rem 0; border-top: 1px solid var(--line); }
/* wymiary z kreatora: tabelka na całą szerokość karty (nagłówek nad nią) – wewnętrzne elementy bez stylu wierszy .dspec */
.dspec > div.dspec__wide { grid-template-columns: minmax(0, 1fr); gap: .45rem; }
.dspec dt { color: var(--ink3); font-weight: 600; } .dspec dd { margin: 0; }
.dfiles { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; }
.dfiles small { display: block; color: var(--ink3); }
.card--status { background: linear-gradient(180deg, #fff, #fffafc); }
.stform .field { margin-bottom: .9rem; }
.stform__act { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .3rem; }
.acts { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.1rem; } .acts form { margin: 0; }
.hist { list-style: none; margin: 0; padding: 0; }
.hist li { position: relative; display: flex; gap: .8rem; padding: 0 0 .9rem; }
.hist li::before { content: ''; position: absolute; left: .34rem; top: 1.1rem; bottom: 0; width: 2px; background: var(--line); }
.hist li:last-child::before { display: none; }
.hist__dot { width: .75rem; height: .75rem; margin-top: .35rem; flex: none; border-radius: 50%; background: var(--lilac); }
.hist__dot.st--nowe { background: var(--pink); } .hist__dot.st--oplacone { background: #8f7fd6; } .hist__dot.st--wyslane { background: #4d8fd6; } .hist__dot.st--zrealizowane { background: #3aa776; } .hist__dot.st--anulowane { background: #d0465a; }
.hist small { display: block; color: var(--ink3); font-size: .82rem; }
.mailed { display: inline-block; margin-left: .25rem; padding: .05rem .5rem; border-radius: 999px; background: var(--vio1); color: var(--vio); font-size: .76rem; font-weight: 600; }

/* ---------- formularze ---------- */
.field { display: grid; gap: .4rem; align-content: start; margin: 0 0 1.05rem; min-width: 0; }
.field > span:first-child { font-weight: 600; font-size: .94rem; color: var(--ink2); }
.field > span:first-child small { font-weight: 500; color: var(--ink3); }
.field .hint { margin: 0; font-size: .85rem; }
:where(input:not([type=checkbox]):not([type=file]):not([type=hidden]), select, textarea) { width: 100%; min-height: 50px; padding: .75rem .95rem; font: inherit; font-size: 1rem; color: var(--g); background: #fff; border: 1px solid var(--line2); border-radius: var(--r-sm); transition: border-color .2s, box-shadow .2s; -webkit-appearance: none; appearance: none; }
textarea { min-height: 96px; resize: vertical; line-height: 1.5; }
select { padding-right: 2.6rem; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1b20' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right .9rem center / 1.1rem; cursor: pointer; }
:where(input, select, textarea):focus { outline: 0; border-color: var(--pink6); box-shadow: 0 0 0 4px var(--pink1); }
input::placeholder, textarea::placeholder { color: #a39fa8; }
input.is-bad { border-color: var(--err); box-shadow: 0 0 0 4px var(--err1); }
input.is-good { border-color: #3aa776; }
.unit { position: relative; display: block; }
.unit input { padding-right: 2.6rem; }
.unit i { position: absolute; right: .95rem; top: 50%; transform: translateY(-50%); font-style: normal; color: var(--ink3); font-weight: 600; pointer-events: none; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
/* przełącznik (prawdziwy checkbox – działa z klawiaturą i czytnikiem ekranu) */
.tgl { display: flex; align-items: center; gap: .8rem; min-height: 48px; margin: 0 0 .5rem; cursor: pointer; font-weight: 600; color: var(--g); line-height: 1.3; }
.tgl small { font-weight: 500; color: var(--ink3); }
.tg { -webkit-appearance: none; appearance: none; position: relative; width: 52px; height: 32px; flex: none; margin: 0; border-radius: 999px; background: #d9d5dc; cursor: pointer; transition: background .25s; }
.tg::before { content: ''; position: absolute; top: 3px; left: 3px; width: 26px; height: 26px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, .2); transition: transform .3s var(--ease); }
.tg:checked { background: var(--pink); }
.tg:checked::before { transform: translateX(20px); }
.tg:focus-visible { outline: 3px solid var(--pink3); outline-offset: 2px; }
.reveal { margin: .4rem 0 0; padding: 1rem 1rem .1rem; border-radius: 18px; background: var(--pink05); }
.reveal[hidden] { display: none; }
.more-opts summary { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; cursor: pointer; font-weight: 600; color: var(--ink2); list-style: none; }
.more-opts summary::-webkit-details-marker { display: none; }
.more-opts summary::after { content: '+'; display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--bg); font-weight: 700; }
.more-opts[open] summary::after { content: '−'; }
.more-opts[open] summary { margin-bottom: .4rem; }
.pass { position: relative; display: block; }
.pass input { padding-right: 3.4rem; }
.pass__eye { position: absolute; right: 3px; top: 3px; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 12px; background: transparent; color: var(--ink3); cursor: pointer; }
.pass__eye:hover, .pass__eye.is-on { color: var(--pink7); background: var(--pink05); }
.ok-line { display: flex; gap: .55rem; align-items: center; margin: .2rem 0 0; padding: .7rem .9rem; border-radius: 14px; background: var(--ok1); color: var(--ok); font-size: .94rem; }
.hint--box { align-self: end; margin: 0 0 1.05rem; padding: .85rem 1rem; border-radius: var(--r-sm); background: var(--bg); }
.bar { position: sticky; bottom: 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; margin: .4rem -1rem 0; padding: .9rem 1rem calc(.9rem + env(safe-area-inset-bottom)); background: linear-gradient(rgba(247, 244, 242, 0), var(--bg) 35%); }
.bar__dirty { font-size: .9rem; font-weight: 600; color: var(--pink7); }
@media (max-width: 1079px) { .bar { bottom: calc(var(--tab) + env(safe-area-inset-bottom)); padding-bottom: .9rem; } }
.danger { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin: 2rem 0 0; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.danger .hint { margin: 0; }

/* produkt: formularz + podgląd */
.pform { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: 0 1.25rem; align-items: start; }
.pform__side { position: sticky; top: 1.5rem; grid-column: 2; grid-row: 1; }
.pform__main { grid-column: 1; grid-row: 1; min-width: 0; }
.pform .bar { grid-column: 1 / -1; }
.card--preview { padding: 1.1rem; }
.pv { position: relative; display: grid; gap: .3rem; margin-bottom: 1rem; }
.pv__img { display: grid; place-items: center; aspect-ratio: 1; border-radius: 18px; overflow: hidden; background: linear-gradient(160deg, var(--pink1), var(--lilac1)); }
.pv__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.pv__img img[width="120"] { width: 46%; height: auto; mix-blend-mode: normal; opacity: .7; }
.pv__badges { position: absolute; top: .7rem; left: .7rem; display: flex; gap: .35rem; }
.pv__new, .pv__off { padding: .25rem .6rem; border-radius: 999px; background: var(--g); color: #fff; font-size: .74rem; font-weight: 700; }
.pv__off { background: var(--pink); color: var(--g); }
.pv__new[hidden], .pv__off[hidden] { display: none; }
.pv__name { margin-top: .5rem; font-size: 1.05rem; line-height: 1.25; overflow-wrap: anywhere; }
.pv__price b { font-size: 1.1rem; } .pv__price s { color: var(--ink3); margin-left: .3rem; }
.pics { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: .8rem; }
.pics:empty { display: none; }
.pics[hidden] { display: none; }
.pic { position: relative; border-radius: 18px; overflow: hidden; background: #fff; aspect-ratio: 1; box-shadow: inset 0 0 0 1px var(--line), 0 6px 16px -10px rgba(20, 18, 23, .25); }
.pic > img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity .2s, filter .2s; }
.pic__main { position: absolute; top: .5rem; left: .5rem; display: none; padding: .2rem .6rem; border-radius: 999px; background: var(--g); color: #fff; font-size: .72rem; font-weight: 700; }
.pics:not(.pics--new) .pic:first-child .pic__main { display: block; }
.pic__tools { position: absolute; inset: auto .4rem .4rem; display: flex; justify-content: space-between; gap: .3rem; }
.pic__tools .iconbtn { width: 40px; height: 40px; background: rgba(255, 255, 255, .92); box-shadow: 0 2px 8px rgba(0, 0, 0, .12); }
.pic__tools .iconbtn:first-child { margin-right: auto; }
.iconbtn--del { position: relative; } .iconbtn--del input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.iconbtn--del:hover { background: var(--err1); color: var(--err); }
.pic__gone { position: absolute; inset: 0 0 auto; display: none; padding: .5rem .6rem; background: var(--err); color: #fff; font-size: .78rem; font-weight: 700; line-height: 1.25; }
.pic.is-del > img, .pic.is-del .pic__frame img { opacity: .35; filter: grayscale(1); }
.pic.is-del .pic__gone { display: block; } .pic.is-del .pic__main { display: none !important; }
.pic.is-del .iconbtn--del { background: var(--err); color: #fff; }
.pic__new { position: absolute; inset: auto .5rem .5rem; padding: .2rem .55rem; border-radius: 999px; background: var(--pink); color: var(--g); font-size: .72rem; font-weight: 700; width: max-content; }
.pics--new .pic__x { position: absolute; top: .4rem; right: .4rem; width: 40px; height: 40px; background: rgba(255, 255, 255, .92); }
.drop { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem; min-height: 160px; padding: 1.2rem; border: 2px dashed var(--pink3); border-radius: 20px; background: var(--pink05); text-align: center; cursor: pointer; transition: background .2s, border-color .2s; }
.drop:hover, .drop.is-over { background: var(--pink1); border-color: var(--pink6); }
.drop input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.drop img { width: 60px; height: 60px; }
.drop__t { font-weight: 800; font-size: 1.1rem; }
.drop__s { font-size: .88rem; color: var(--ink3); max-width: 24rem; }
.pics--new { margin-top: 1rem; }
.pic__bad { display: grid; place-items: center; height: 100%; padding: .8rem; text-align: center; font-size: .82rem; color: var(--err); overflow-wrap: anywhere; }
.vhead, .vrow { display: grid; grid-template-columns: minmax(0, 1fr) 8.5rem 44px; gap: .5rem; align-items: center; }
.vhead { font: 600 .7rem var(--f-m); letter-spacing: .1em; text-transform: uppercase; color: var(--ink3); margin-bottom: .4rem; }
.vhead[hidden] { display: none; }
.vrow { margin-bottom: .5rem; }
.chips--sizes { margin: 0 0 1rem; }
.field--stock { margin-top: 1.2rem; }
[data-vars]:not(:empty) ~ .field--stock { opacity: .55; }

/* produkty: siatka */
.pgrid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr)); gap: 1rem; }
.pcard { position: relative; border-radius: var(--r); background: #fff; box-shadow: var(--sh); transition: transform .3s var(--ease), box-shadow .3s; }
.pcard:hover { transform: translateY(-3px); box-shadow: var(--sh-lg); }
.pcard[hidden] { display: none; }
.pcard__link { display: block; color: inherit; text-decoration: none; padding: .55rem .55rem 1rem; }
.pcard__link:hover { color: inherit; }
.pcard__img { display: grid; place-items: center; aspect-ratio: 1; border-radius: 16px; overflow: hidden; background: linear-gradient(160deg, var(--pink1), var(--lilac1)); }
.pcard__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.pcard__img .noimg { width: 50%; height: auto; mix-blend-mode: normal; opacity: .7; }
.pcard.is-off .pcard__img { filter: grayscale(.7); opacity: .65; }
.pcard__badges { position: absolute; top: 1rem; left: 1rem; display: flex; flex-wrap: wrap; gap: .3rem; max-width: calc(100% - 4.5rem); }
.pcard__body { display: grid; gap: .15rem; padding: .8rem .45rem 0; }
.pcard__cat { font: 600 .68rem/1.3 var(--f-m); letter-spacing: .08em; text-transform: uppercase; color: var(--ink3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pcard__name { font-size: 1.02rem; line-height: 1.25; overflow-wrap: anywhere; }
.pcard__price { margin-top: .15rem; } .pcard__price b { font-size: 1.05rem; } .pcard__price s { color: var(--ink3); font-size: .88rem; }
.pcard .stock { margin-top: .2rem; }
.pcard__vis { position: absolute; top: .9rem; right: .9rem; margin: 0; }
.pcard__vis .iconbtn { background: rgba(255, 255, 255, .92); box-shadow: 0 2px 8px rgba(0, 0, 0, .1); }
.pcard.is-off .pcard__vis .iconbtn { background: var(--g); color: #fff; }
.pcard--add a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem; height: 100%; min-height: 15rem; padding: 1.2rem; border: 2px dashed var(--pink3); border-radius: var(--r); background: var(--pink05); color: var(--g); text-decoration: none; text-align: center; }
.pcard--add { box-shadow: none; background: transparent; }
.pcard--add b { font-size: 1.1rem; } .pcard--add span { font-size: .9rem; color: var(--ink3); }
.pcard--add a:hover { background: var(--pink1); color: var(--g); }

/* ---------- CENY I MARŻE ---------- */
.mform { max-width: none; }
.card--all { background: linear-gradient(140deg, #fff 40%, var(--pink05)); }
.mall { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.4rem; }
.pct { margin: 0; }
.stepper { display: inline-flex; align-items: center; gap: .3rem; padding: 3px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line2); }
.stepper:focus-within { box-shadow: inset 0 0 0 1.5px var(--pink6), 0 0 0 4px var(--pink1); }
.stepper input:not([type=checkbox]) { width: 5.6rem; min-height: 44px; padding: 0 .2rem; border: 0; border-radius: 0; background: transparent; text-align: right; font: 800 1.35rem var(--f-d); font-stretch: 85%; box-shadow: none !important; }
.stepper input::placeholder { font: 500 .78rem var(--f); color: var(--ink3); text-align: right; }
.stepper i { font-style: normal; font-weight: 700; color: var(--ink3); margin-right: .2rem; }
.stepper .iconbtn { width: 40px; height: 40px; font-size: 1.25rem; font-weight: 700; }
.card--all .stepper input:not([type=checkbox]) { font-size: 1.7rem; width: 6rem; }
.presets { display: flex; flex-wrap: wrap; gap: .35rem; }
.presets .chip { min-height: 40px; padding: 0 .75rem; font-size: .84rem; }
@media (pointer: coarse) { .presets .chip, .chip { min-height: 44px; } }
.mrows { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .8rem; }
.mrow { display: grid; grid-template-columns: 10rem minmax(0, 1fr) minmax(0, 17.5rem); gap: 1rem 1.4rem; align-items: center; padding: 1.1rem 1.3rem; border-radius: var(--r); background: #fff; box-shadow: var(--sh); }
.mrow__who b { display: block; font: 800 1.35rem/1 var(--f-d); font-stretch: 82%; }
.mrow__who small { display: block; margin-top: .3rem; font: 600 .72rem var(--f-m); letter-spacing: .06em; color: var(--ink3); text-transform: uppercase; }
.mrow__set { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.mrow__ex { display: flex; align-items: center; gap: .7rem; padding: .5rem .7rem .5rem .5rem; border-radius: 16px; background: var(--bg); min-width: 0; }
.mini--ex { width: 54px; height: 54px; background: #fff; }
.mini--ex img { mix-blend-mode: multiply; }
.mrow__ex-txt { min-width: 0; display: grid; gap: .1rem; }
.mrow__ex-txt > small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink3); font-size: .78rem; }
.mrow__ex-txt > span { display: flex; align-items: center; flex-wrap: wrap; gap: .3rem; font-variant-numeric: tabular-nums; }
.mrow__ex-txt s { color: var(--ink3); font-size: .88rem; }
.mrow__ex-txt .i { width: .9em; color: var(--ink3); }
.mrow__ex-txt b { color: var(--pink7); font-size: 1.05rem; }
.mrow__ex-txt b.is-same { color: var(--g); }
.mrow.is-own { box-shadow: inset 0 0 0 2px var(--pink3), var(--sh); }
.info-row { display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; align-items: center; justify-content: space-between; margin: .4rem 0 0; }
.info { display: flex; gap: .6rem; margin: 0; font-size: .92rem; color: var(--ink2); }
.info .i { margin-top: .15rem; color: var(--vio); }

/* ---------- USTAWIENIA ---------- */
.sform { max-width: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 34rem), 1fr)); gap: 0 1.25rem; align-items: start; }
.sform > .bar, .sform > input[type=hidden] { grid-column: 1 / -1; }
.ships { display: grid; gap: .7rem; margin-bottom: 1.2rem; }
.ship { display: grid; grid-template-columns: 56px minmax(0, 1fr) 8.5rem auto; gap: .4rem 1rem; align-items: end; padding: .9rem 1rem; border-radius: 18px; background: var(--bg); }
.ship__ic { width: 56px; height: 56px; align-self: center; }
.ship .field { margin: 0; }
.ship__on { margin: 0; align-self: end; min-height: 50px; }

/* ---------- okna (potwierdzenie, podgląd e-maila) ---------- */
.modal { width: min(28rem, calc(100vw - 2rem)); padding: 1.6rem; border: 0; border-radius: var(--r-lg); background: #fff; color: var(--g); box-shadow: var(--sh-lg); }
.modal::backdrop { background: rgba(29, 27, 32, .45); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.modal[open] { animation: pop .3s var(--ease); }
.modal form { margin: 0; }
.modal__t { margin: 0 0 1.4rem; font-size: 1.1rem; font-weight: 600; line-height: 1.45; }
.modal__act { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .6rem; }
.modal--mail { width: min(46rem, calc(100vw - 2rem)); height: min(52rem, calc(100vh - 2rem)); padding: 0; overflow: hidden; }
.modal--mail[open] { display: flex; flex-direction: column; }
.modal__bar { display: flex; align-items: center; gap: .6rem; padding: .6rem .6rem .6rem 1.2rem; border-bottom: 1px solid var(--line); }
.modal__bar b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.modal--mail iframe { flex: 1; width: 100%; border: 0; background: var(--bg); }

/* ---------- logowanie ---------- */
.auth { min-height: 100vh; display: grid; place-items: center; padding: 2rem 1rem; }
.auth:not(.auth--login) { max-width: 30rem; margin: 0 auto; text-align: left; place-items: stretch; align-content: center; }
.auth__art { display: block; width: 110px; height: 110px; margin-bottom: .8rem; }
.auth--login { position: relative; overflow: hidden; }
.auth__card { position: relative; z-index: 1; width: min(27rem, 100%); padding: clamp(1.6rem, 5vw, 2.4rem); border-radius: var(--r-lg); background: rgba(255, 255, 255, .88); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); box-shadow: var(--sh-lg); }
.auth__logo { display: block; height: 40px; width: auto; margin-bottom: 1.6rem; }
.auth h1 { font-size: clamp(2.3rem, 1.8rem + 2vw, 3rem); }
.auth__lead { margin: .8rem 0 1.4rem; color: var(--ink2); }
.auth__form { margin-top: .4rem; }
.auth__form .tgl { margin: .2rem 0 1rem; font-size: .95rem; }
.auth__help { margin: 1.3rem 0 0; font-size: .86rem; color: var(--ink3); line-height: 1.45; }
.auth__props { position: absolute; inset: 0; pointer-events: none; }
.prop { position: absolute; width: clamp(130px, 17vw, 230px); height: auto; filter: drop-shadow(0 30px 30px rgba(120, 50, 90, .18)); animation: float 7s ease-in-out infinite; }
.prop--a { left: calc(50% - 32rem); top: 18%; transform: rotate(-10deg); }
.prop--b { right: calc(50% - 33rem); top: 9%; transform: rotate(9deg); animation-delay: -2s; }
.prop--c { right: calc(50% - 27rem); bottom: 10%; width: clamp(100px, 12vw, 170px); transform: rotate(-6deg); animation-delay: -4s; }
@keyframes float { 50% { translate: 0 -14px; } }
.hash { min-height: 96px; margin-bottom: .8rem; font: .85rem/1.4 var(--f-m) !important; word-break: break-all; }
@media (max-width: 1000px) { .prop--a, .prop--c { display: none; } .prop--b { right: -30px; top: -10px; width: 150px; opacity: .9; } }
@media (max-width: 520px) { .prop--b { width: 120px; right: -36px; top: -18px; } .auth { place-items: start center; padding-top: 4.5rem; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* ---------- tablet i telefon ---------- */
@media (max-width: 1240px) {
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mrow { grid-template-columns: 9rem minmax(0, 1fr); }
  .mrow__ex { grid-column: 1 / -1; }
}
@media (max-width: 1079px) {
  .dash, .ord { grid-template-columns: minmax(0, 1fr); }
  .ord__side, .pform__side { position: static; }
  .pform { grid-template-columns: minmax(0, 1fr); }
  .pform__side { grid-column: 1; grid-row: auto; }
  .pform__main { grid-row: auto; }
  .card--preview { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: 0 1rem; align-items: center; }
  .card--preview .kicker { grid-column: 1 / -1; }
  .card--preview .pv { grid-row: span 2; margin: 0; }
  .card--preview .pv__name { font-size: .95rem; }
  .card--preview .pv__badges { top: .4rem; left: .4rem; }
  .quick { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .quick a { flex-direction: column; text-align: center; justify-content: center; min-height: 96px; font-size: .88rem; }
}
@media (max-width: 760px) {
  h2 { font-size: 1.3rem; }
  .head { margin-bottom: 1.3rem; }
  .head__act { width: 100%; }
  .head__act .btn { flex: 1 1 auto; }
  .kpis { gap: .7rem; }
  .kpi { min-height: 150px; padding: 1rem; }
  .kpi__img { width: 84px; height: 84px; right: -.8rem; }
  .kpi__label { font-size: .64rem; max-width: 70%; }
  .kpi__num { font-size: 2.3rem; } .kpi--warm .kpi__num { font-size: 1.45rem; }
  .kpi__sub { font-size: .8rem; }
  .quick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .todo { grid-template-columns: minmax(0, 1fr) auto; gap: .35rem .8rem; }
  .todo__st { grid-column: 1; flex-direction: row; flex-wrap: wrap; }
  .todo__sum { grid-column: 2; grid-row: 1; }
  .todo__who { grid-column: 1 / -1; }
  .todo__what { grid-column: 1 / -1; white-space: normal; }
  .todo > .i { display: none; }
  .empty--inline { flex-direction: column; text-align: center; }
  .toolbar { flex-direction: column; flex-wrap: nowrap; align-items: stretch; }
  .tabs { flex-wrap: nowrap; overflow-x: auto; margin: 0 -1rem; padding: .3rem 1rem .6rem; scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs a, .tabs button { flex: none; }
  .search { flex: 1 1 auto; min-width: 0; }
  .next { padding: 1.1rem; }
  .next__form { width: 100%; }
  .next__btn { flex: 1 1 100%; }
  .line { grid-template-columns: 48px minmax(0, 1fr) auto; }
  .line__qty { grid-column: 2; grid-row: 2; }
  .line__sum { grid-column: 3; grid-row: 1 / span 2; }
  .facts > div, .dspec > div { grid-template-columns: minmax(0, 1fr); gap: .2rem; }
  .facts dd { padding-top: 0; padding-left: calc(36px + .55rem); }
  .grid2 { grid-template-columns: minmax(0, 1fr); }
  .pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
  .pcard__link { padding: .4rem .4rem .8rem; }
  .pcard__body { padding: .6rem .3rem 0; }
  .pcard__badges { top: .75rem; left: .75rem; }
  .pcard__vis { top: .7rem; right: .7rem; }
  .pcard--add a { min-height: 12rem; }
  .vhead, .vrow { grid-template-columns: minmax(0, 1fr) 6.5rem 44px; }
  .mrow { grid-template-columns: minmax(0, 1fr); gap: .8rem; padding: 1rem; }
  .mall { flex-direction: column; align-items: flex-start; }
  .ship { grid-template-columns: 48px minmax(0, 1fr); align-items: center; }
  .ship__ic { width: 48px; height: 48px; grid-row: span 1; }
  .ship__name { grid-column: 2; }
  .ship__price { grid-column: 1 / span 2; }
  .ship__on { grid-column: 1 / span 2; }
  .steps { max-width: none; }
  .steps li { font-size: .72rem; }
  .bar .btn { flex: 1 1 auto; }
  .modal--mail { width: 100vw; height: 100dvh; max-width: none; max-height: none; border-radius: 0; margin: 0; }
}
@media (max-width: 380px) {
  .kpi__num { font-size: 2rem; }
  .card--preview { grid-template-columns: 6.5rem minmax(0, 1fr); }
}
.head__st { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .7rem; margin-top: .9rem; }
.head__st .st { font-size: .95rem; padding: .45rem 1rem .45rem .8rem; }
.head__sum { font: 800 1.5rem/1 var(--f-d); font-stretch: 85%; }
/* lista zamówień jako karty: telefon i tablet; na wąskim komputerze bez kolumny „Produkty” */
@media (min-width: 1080px) and (max-width: 1320px) { .orders th:nth-child(3), .orders .o-what { display: none; } }
@media (max-width: 1079px) {
  /* lista zamówień jako karty */
  .card--table { padding: 0; background: transparent; box-shadow: none; }
  .orders thead { display: none; }
  .orders, .orders tbody { display: block; }
  .orders tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .2rem .8rem; margin-bottom: .7rem; padding: 1rem 1.1rem; border-radius: 20px; background: #fff; box-shadow: var(--sh); }
  .orders tbody tr:hover td { background: transparent; }
  .orders td { display: block; padding: 0; border: 0; min-width: 0; }
  .orders .o-st { grid-column: 1 / -1; grid-row: 1; text-align: left; display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; margin-bottom: .5rem; }
  .orders .o-st .tag { margin: 0; }
  .orders .o-nr { grid-column: 1; grid-row: 2; }
  .orders .o-sum { grid-column: 2; grid-row: 2; text-align: right; }
  .orders .o-who { grid-column: 1 / -1; grid-row: 3; margin-top: .4rem; }
  .orders .o-who small { overflow: hidden; text-overflow: ellipsis; }
  .orders .o-what { grid-column: 1 / -1; grid-row: 4; margin-top: .3rem; color: var(--ink2); font-size: .92rem; }
  .orders .o-what span { max-width: none; white-space: normal; }
}
@media (min-width: 640px) and (max-width: 1079px) { .orders tbody { display: grid; grid-template-columns: 1fr 1fr; gap: 0 .8rem; } }
.mrow__ex--none { margin: 0; align-items: flex-start; padding: .7rem .9rem; font-size: .86rem; line-height: 1.4; color: var(--ink2); }
.mrow__ex--none .i { margin-top: .1rem; color: var(--vio); }
@media (max-width: 760px) { .v-pulpit .head__act .btn--ghost { display: none; } }
.tab__ic { width: 32px; height: 32px; padding: 0; }
@media (max-width: 1079px) { .pform__side { order: -1; } }
@media (max-width: 760px) {
  .chips--pick { flex-wrap: nowrap; overflow-x: auto; margin-left: -1.15rem; margin-right: -1.15rem; padding: 0 1.15rem .3rem; scrollbar-width: none; }
  .chips--pick::-webkit-scrollbar { display: none; }
  .chips--pick .chip { flex: none; }
}
.tgl small { white-space: nowrap; }
.mrow__ex-txt > span { flex-wrap: nowrap; white-space: nowrap; } .mrow__ex-txt > span small { font-size: .74rem; color: var(--ink3); }

/* ---------- pulpit: cienka linia „sklep działa sam” (bez kart) – różowe kroki są po Waszej stronie ---------- */
.flow { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .2rem; margin: -.6rem 0 1.6rem; padding: 0; }
.flow__s { display: inline-flex; align-items: center; gap: .4rem; padding: .25rem .75rem .25rem .3rem; border-radius: 99px; font-size: .88rem; font-weight: 600; color: var(--ink2); }
.flow__img { width: 30px; height: 30px; object-fit: contain; }
.flow__s--you { background: var(--pink1); color: var(--pink7); }
.flow__s:not(:last-child)::after { content: ""; width: .35rem; height: .35rem; margin-left: .45rem; border-top: 1.5px solid var(--ink3); border-right: 1.5px solid var(--ink3); transform: rotate(45deg); opacity: .5; }
@media (max-width: 640px) { .flow { gap: .2rem 0; margin-top: -.3rem; } .flow__s { font-size: .8rem; padding-right: .5rem; } .flow__img { width: 24px; height: 24px; } }
.kpis--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 760px) { .kpis--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .kpis--3 .kpi:last-child { grid-column: 1 / -1; } }
.empty--slim { padding: .6rem 0; gap: 1rem; } .empty--slim .empty__t { margin: 0; font-size: 1.15rem; }
.lowstock { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.lowstock__t { display: flex; align-items: center; gap: .5rem; margin: 0 0 .6rem; font: 600 .74rem/1.3 var(--f-m); letter-spacing: .1em; text-transform: uppercase; color: var(--warn); }
.lowstock .minis { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .4rem 1rem; }

/* ---------- marże: masowo + pojedynczo (08.11.2026) – kolejność marż, „co się zmieniło”, wyszukiwarka modeli, własne marże ---------- */

.mlevels { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin: 0 0 1.2rem; }
.mlevels .i { width: .9em; color: var(--ink3); }
.msec { margin: 2.2rem 0 .9rem; font: 800 clamp(1.5rem, 2.4vw, 2rem)/1.05 var(--f-d); font-stretch: 78%; }
.msec .kicker { display: block; margin-bottom: .35rem; }
.msec em { font: 700 1.2em/1 var(--f-h); font-style: normal; color: var(--pink6); }
.mres { border: 1px solid var(--pink3); margin-bottom: 1.2rem; }
.mres p { margin: .3rem 0 .6rem; }
.mres__warn { display: flex; gap: .6rem; align-items: flex-start; padding: .7rem .9rem; border-radius: var(--r-sm); background: var(--warn1); color: var(--warn); }
.mres__warn .i { margin-top: .15rem; }
.mres__l { list-style: none; margin: 0 0 .4rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.mres__l li { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .4rem .3rem .7rem; border-radius: 999px; background: var(--bg); font-size: .88rem; }
.mrow__own { margin-top: .45rem; text-decoration: none; }
.mkeep { margin: 0 0 1rem; padding: .9rem 1.1rem; border-radius: var(--r); background: var(--lilac1); }
.mkeep p { display: flex; gap: .55rem; margin: 0 0 .6rem; } .mkeep p .i { margin-top: .2rem; color: var(--vio); }
.mpick__f { display: grid; grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); gap: .6rem; margin-bottom: .6rem; }
.mpick__f .field { margin: 0; }
.mpick__state { margin: .2rem 0 .6rem; font-size: .9rem; }
.mlist { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.mitem { display: grid; grid-template-columns: auto 48px minmax(0, 1fr) auto auto auto; align-items: center; gap: .8rem; padding: .55rem .7rem; border-radius: 16px; background: var(--bg); border: 1px solid transparent; }
.mitem.is-sel { background: var(--pink05); border-color: var(--pink3); }
.mitem .mini { width: 48px; height: 48px; }
.mitem__t { min-width: 0; } .mitem__t b, .mitem__t small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mitem__t small { color: var(--ink3); font-size: .8rem; }
.mitem__c { font-variant-numeric: tabular-nums; white-space: nowrap; font-size: .92rem; } .mitem__c s { color: var(--ink3); } .mitem__c b { color: var(--pink7); }
.mitem__edit { list-style: none; padding: .6rem .7rem .7rem; margin-top: -.3rem; border-radius: 0 0 16px 16px; background: var(--pink05); border: 1px solid var(--pink3); border-top: 0; }
.mone { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.mone .field, .mbulk .field { margin: 0; }
.mone .stepper input, .mbulk .stepper input { width: 5.5rem; }
.mpick__more { margin: .8rem auto 0; display: flex; }
.mbulk { position: sticky; bottom: 1rem; z-index: 5; margin-top: 1rem; padding: .9rem 1rem; border-radius: var(--r); background: var(--g); color: #fff; box-shadow: var(--sh-lg); }
.mbulk__row { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; }
.mbulk__n { flex: 1 1 14rem; } .mbulk__n b { font-size: 1.15rem; }
.mbulk .stepper { background: #fff; color: var(--g); }
.mbulk .btn--ghost { color: #fff; border-color: rgba(255, 255, 255, .35); }
.linkbtn { border: 0; background: none; padding: 0 .2rem; color: var(--pink3); text-decoration: underline; text-underline-offset: .18em; cursor: pointer; font-size: .9rem; }
.mbulk__manual { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .8rem; margin: .8rem 0 0; padding: .6rem .8rem; border-radius: var(--r-sm); background: rgba(255, 241, 217, .14); color: #ffe2ad; font-size: .92rem; }
.mbulk__manual .tgl { color: #fff; }
.mowns { list-style: none; margin: .4rem 0 0; padding: 0; display: grid; gap: .45rem; }
.mown { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto auto auto; align-items: center; gap: .8rem; padding: .5rem .6rem; border-radius: 14px; background: var(--bg); }
.mown .mini { width: 44px; height: 44px; }
.mown__t { min-width: 0; } .mown__t b, .mown__t small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .mown__t small { color: var(--ink3); font-size: .8rem; }
.mown__p { display: grid; justify-items: end; gap: .15rem; } .mown__p small { color: var(--ink3); font-size: .76rem; white-space: nowrap; }
.mown__c { font-variant-numeric: tabular-nums; white-space: nowrap; font-size: .9rem; } .mown__c s { color: var(--ink3); } .mown__c b { color: var(--pink7); } .mown__c .i { width: .85em; color: var(--ink3); vertical-align: -.1em; }
.mown form { margin: 0; }
.mbatch summary { cursor: pointer; font-weight: 600; color: var(--pink7); margin: .2rem 0 .3rem; }
@media (max-width: 900px) {
  .mpick__f { grid-template-columns: 1fr 1fr; } .mpick__q { grid-column: 1 / -1; }
  .mitem { grid-template-columns: auto 44px minmax(0, 1fr) auto; row-gap: .4rem; }
  .mitem__m { grid-column: 3; } .mitem__c { grid-column: 3 / 4; } .mitem [data-edit] { grid-column: 4; grid-row: 1 / span 2; }
  .mown { grid-template-columns: 44px minmax(0, 1fr) auto; } .mown__c { grid-column: 2; } .mown__p { grid-column: 3; grid-row: 1; } .mown form { grid-column: 3; }
}
@media (max-width: 1079px) { .mbulk { bottom: calc(var(--tab) + env(safe-area-inset-bottom) + .6rem); } }
.mkeep .tgl, .mbulk__manual .tgl { align-items: flex-start; min-width: 0; } .mkeep .tgl > span, .mbulk__manual .tgl > span { white-space: normal; min-width: 0; }
.mkeep .tgl small, .mbulk__manual .tgl small { display: block; white-space: normal; }

/* szeroki ekran: dostawcy w dwóch kolumnach, dashboard szerzej (08.11.2026 – panel na całą szerokość) */
@media (min-width: 1700px) {
  .mrows { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mrow { grid-template-columns: 9rem minmax(0, 1fr); } .mrow__ex { grid-column: 1 / -1; }
  .dash { grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr); }
}
/* ustawienia: karta Dostawa na całą szerokość (nazwy dostaw muszą być czytelne), na szerokim ekranie dostawy obok siebie */
.sform > .card:has(.ships) { grid-column: 1 / -1; }
@media (min-width: 1500px) { .ships { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; } .ships .ship { margin: 0; } }
.mkeep { padding: .5rem 1rem; } .mkeep .tgl { margin: 0; }
.sform { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: row dense; }
@media (max-width: 1000px) { .sform { grid-template-columns: minmax(0, 1fr); } }


/* ---------- marże v3 (08.11.2026): zakładki, dostawcy w jednej karcie, wyraźny pasek zaznaczonych ---------- */
.mtabs { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1.4rem; padding: .35rem; border-radius: 999px; background: #fff; box-shadow: var(--sh); width: fit-content; max-width: 100%; }
.mtab { display: inline-flex; align-items: center; gap: .5rem; min-height: 48px; padding: 0 1.2rem 0 .7rem; border: 0; border-radius: 999px; background: transparent; font-weight: 700; font-size: 1rem; color: var(--ink2); cursor: pointer; transition: background .2s, color .2s; }
.mtab img { width: 30px; height: 30px; object-fit: contain; }
.mtab:hover { background: var(--bg); color: var(--g); }
.mtab.is-on { background: var(--g); color: #fff; }
.mtab__n { min-width: 1.5rem; padding: .05rem .45rem; border-radius: 99px; background: var(--pink); color: #fff; font-size: .78rem; text-align: center; }
@media (max-width: 640px) { .mtabs { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); border-radius: 22px; } .mtab { justify-content: center; padding: 0 .4rem; flex-direction: column; gap: .1rem; min-height: 64px; font-size: .86rem; border-radius: 18px; } .mtab__n { position: absolute; margin: -2.6rem 0 0 2.6rem; } .mtab { position: relative; } }
.mres { margin-bottom: 1rem; padding: .9rem 1.2rem; } .mres .card__h { margin-bottom: .2rem; } .mres .card__h img { width: 32px; height: 32px; }
/* masowo: jedna karta, wiersz na dostawcę */
.msup { list-style: none; margin: 0 0 1rem; padding: .4rem; border-radius: var(--r-lg); background: #fff; box-shadow: var(--sh); display: grid; }
.msup__r { display: grid; grid-template-columns: minmax(10rem, 1fr) auto minmax(0, 1.3fr); align-items: center; gap: .8rem 1.4rem; padding: .85rem 1rem; border-radius: 20px; }
.msup__r + .msup__r { border-top: 1px solid var(--line); border-radius: 0; }
.msup__r--all { background: linear-gradient(120deg, var(--pink05), #fff 70%); border-radius: 20px !important; grid-template-columns: minmax(10rem, 1fr) auto minmax(0, 1.3fr); }
.msup__r--all .presets { justify-self: start; }
.msup__r.is-own .stepper { box-shadow: 0 0 0 2px var(--pink3); }
.msup__who b { display: block; font: 800 1.2rem/1.1 var(--f-d); font-stretch: 82%; }
.msup__who small { display: block; margin-top: .2rem; color: var(--ink3); font-size: .82rem; }
.msup__own { color: var(--pink7); font-weight: 600; }
.msup .field { margin: 0; }
.msup .stepper input { width: 4.6rem; }
.msup__ex { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.msup__ex .mini { width: 40px; height: 40px; flex: none; }
.msup__ex-t { min-width: 0; display: grid; } .msup__ex-t small { color: var(--ink3); font-size: .78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msup__ex-t span { font-variant-numeric: tabular-nums; } .msup__ex-t s { color: var(--ink3); font-size: .88rem; } .msup__ex-t b { color: var(--pink7); } .msup__ex-t b.is-same { color: var(--g); } .msup__ex-t .i { width: .85em; color: var(--ink3); vertical-align: -.1em; }
.msup__ex--none { color: var(--ink3); font-size: .86rem; }
.mbar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.2rem; } .mbar .tgl { margin: 0; min-height: 0; } .mbar__when { margin-left: auto; font-size: .86rem; }
@media (max-width: 900px) {
  .msup__r, .msup__r--all { grid-template-columns: minmax(0, 1fr) auto; }
  .msup__ex, .msup__r--all .presets { grid-column: 1 / -1; }
}
/* pojedynczo */
.mpick__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: .2rem 0 .6rem; }
.mpick__state { margin: 0; color: var(--ink3); font-size: .9rem; }
.mpick__all { color: var(--pink7); font-weight: 700; font-size: .92rem; }
body.has-mbulk .main { padding-bottom: 12rem; }
/* pasek zaznaczonych: pływający, wyraźny – grafit z różową poświatą, wjeżdża od dołu */
.mbulk { position: fixed; z-index: 30; left: calc(var(--side) + clamp(1rem, 2.6vw, 3rem)); right: clamp(1rem, 2.6vw, 3rem); bottom: calc(1.1rem + env(safe-area-inset-bottom, 0px)); margin: 0; padding: .9rem 1rem .9rem 1.2rem; border-radius: 28px; color: #fff;
  background: radial-gradient(60% 160% at 0% 50%, rgba(241, 111, 157, .45), transparent 70%), radial-gradient(40% 140% at 100% 0%, rgba(185, 182, 219, .3), transparent 70%), var(--g);
  box-shadow: 0 0 0 1px rgba(241, 111, 157, .55), 0 24px 60px -12px rgba(20, 18, 23, .55), 0 0 40px -6px rgba(241, 111, 157, .55); animation: mbulk-in .35s var(--ease) both; }
@keyframes mbulk-in { from { transform: translateY(120%); opacity: 0; } to { transform: none; opacity: 1; } }
.mbulk__in { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1rem; }
.mbulk__n { display: flex; align-items: center; gap: .8rem; margin-right: auto; min-width: 0; }
.mbulk__n > b { display: grid; place-items: center; min-width: 3.2rem; height: 3.2rem; padding: 0 .6rem; border-radius: 99px; background: var(--pink); color: var(--g); font: 800 1.45rem/1 var(--f-d); font-stretch: 85%; box-shadow: 0 6px 18px -4px rgba(241, 111, 157, .8); }
.mbulk__n > span { display: grid; gap: .1rem; font-weight: 700; font-size: 1.05rem; }
.mbulk__links { display: flex; gap: .8rem; } .mbulk .linkbtn { color: var(--pink3); font-size: .86rem; padding: 0; }
.mbulk__pct { margin: 0; } .mbulk__pct .stepper { background: #fff; color: var(--g); height: 52px; } .mbulk__pct input { width: 4.4rem; font-size: 1.35rem !important; font-weight: 800; text-align: right; }
.mbulk__go { min-height: 52px; padding-inline: 1.6rem; font-size: 1.05rem; box-shadow: 0 10px 26px -8px rgba(241, 111, 157, .9); }
.mbulk__rm { min-height: 52px; background: transparent; color: #fff; border: 1.5px solid rgba(255, 255, 255, .35); }
.mbulk__rm:hover { border-color: #fff; background: rgba(255, 255, 255, .08); color: #fff; }
.mbulk__manual { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .8rem; margin: .7rem 0 0; padding: .5rem .8rem; border-radius: 14px; background: rgba(255, 225, 160, .14); color: #ffe2ad; font-size: .9rem; }
.mbulk__manual .tgl { margin: 0; min-height: 0; color: #fff; }
.mbulk .is-bad { box-shadow: 0 0 0 3px var(--pink) inset; }
@media (max-width: 1079px) { .mbulk { left: .6rem; right: .6rem; bottom: calc(var(--tab) + env(safe-area-inset-bottom, 0px) + .5rem); border-radius: 24px; padding: .8rem; } }
@media (max-width: 640px) {
  .mbulk__in { display: grid; grid-template-columns: auto 1fr; gap: .6rem; }
  .mbulk__n { grid-column: 1 / -1; margin: 0; } .mbulk__n > b { min-width: 2.8rem; height: 2.8rem; font-size: 1.25rem; }
  .mbulk__go { width: 100%; padding-inline: 1rem; }
  .mbulk__rm { grid-column: 1 / -1; min-height: 44px; }
}
/* własne */
.iconbtn--rm { width: 40px; height: 40px; color: var(--ink3); } .iconbtn--rm:hover { color: var(--err); background: var(--err1); }
.mbulk .stepper input:not([type=checkbox]) { width: 4.4rem; font-size: 1.35rem; font-weight: 800; text-align: right; } .mbulk .stepper input::placeholder { color: #b9b4bd; } .mbulk__manual .tgl { align-items: center; } .mbulk__manual .tgl > span { white-space: nowrap; }
@media (max-width: 640px) {
  .mitem { grid-template-columns: auto 44px minmax(0, 1fr) auto; grid-template-areas: "chk img t btn" "chk img m btn" "chk img c btn"; row-gap: .2rem; column-gap: .6rem; padding: .55rem .6rem; }
  .mitem__chk { grid-area: chk; } .mitem .mini { grid-area: img; } .mitem__t { grid-area: t; } .mitem__m { grid-area: m; } .mitem__c { grid-area: c; font-size: .86rem; } .mitem [data-edit] { grid-area: btn; grid-row: auto; grid-column: auto; padding: 0 .8rem; }
  .mitem__chk .tg { transform: scale(.82); transform-origin: left center; }
  .mitem__m .tag { font-size: .72rem; }
  .mpick__top { align-items: flex-start; } .mpick__state { font-size: .82rem; } .mpick__all { white-space: nowrap; }
  .mbulk__in { display: flex; flex-wrap: wrap; gap: .55rem; }
  .mbulk__n { flex: 1 1 auto; order: 0; } .mbulk__n > span { font-size: .95rem; }
  .mbulk__rm { order: 1; grid-column: auto; min-height: 38px; padding: 0 .85rem; font-size: .84rem; }
  .mbulk__pct { order: 2; } .mbulk__pct .stepper { height: 48px; }
  .mbulk__go { order: 3; flex: 1 1 8rem; min-height: 48px; width: auto; }
  .mbulk__manual { margin-top: .5rem; padding: .35rem .6rem; font-size: .82rem; }
}
@media (max-width: 640px) {
  .flow { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(-1 * clamp(1rem, 2.6vw, 3rem)); padding-inline: clamp(1rem, 2.6vw, 3rem); -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .flow::-webkit-scrollbar { display: none; }
  .flow__s { flex: none; }
  .kpis--3 .kpi { min-height: 132px; }
  .kpis--3 .kpi:last-child .kpi__img { width: 84px; }
  .mbulk__rm { order: 4; }
}

/* ---------- ustawienia: dostawa odzieży z hurtowni (koszt paczki do pracowni i próg bez dopłaty, netto) ---------- */
.sform > .card--sups { grid-column: 1 / -1; }
.card__note { display: block; max-width: 22rem; color: var(--ink3); font-size: .84rem; line-height: 1.35; text-align: right; }
.sups { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 27rem), 1fr)); gap: .6rem .8rem; }
.sup { display: grid; grid-template-columns: minmax(5.5rem, 1fr) minmax(0, 8rem) minmax(0, 8rem) auto; gap: .3rem .7rem; align-items: end; padding: .75rem .8rem .75rem 1rem; border-radius: 16px; background: var(--bg); }
.sup .field { margin: 0; }
.sup .field > span:first-child { font-size: .8rem; }
.sup .tgl { margin: 0; min-height: 50px; }
.sup__n { align-self: center; font-size: 1rem; }
.sup.is-off .sup__n, .sup.is-off .field { opacity: .55; }
@media (max-width: 1079px) { .card__note { display: none; } }
@media (max-width: 520px) {
  .sup { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .sup .tgl { grid-column: 2; grid-row: 1; justify-self: end; min-height: 44px; }
}

/* zamówienie: odzież do zamówienia w hurtowniach (projekty z kreatora) */
.buy { list-style: none; display: grid; gap: .7rem; margin: 0; padding: 0; }
.buy > li { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; padding: .8rem 1rem; border-radius: 16px; background: var(--bg); }
.buy > li > b { font-size: 1.02rem; }
.buy ul { list-style: none; flex-basis: 100%; display: grid; gap: .25rem; margin: .1rem 0 0; padding: 0; color: var(--ink2); }
.buy ul li { padding-left: 1rem; position: relative; overflow-wrap: anywhere; }
.buy ul li::before { content: ''; position: absolute; left: 0; top: .6em; width: 6px; height: 6px; border-radius: 50%; background: var(--pink, #f16f9d); }

/* karta klienta z kontem */
.tag--green { background: #e9f6ef; color: #1f6b49; }
.stack { display: grid; gap: .6rem; margin: 0 0 1rem; }
.stack .btn { justify-content: center; }
@media (min-width: 1080px) { .orders--k th { display: table-cell !important; } } .orders--k .o-nr small { white-space: normal; }

/* film produktu (12.11.2026): podgląd obecnego / nowego filmu, pasek przygotowania */
.vid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .5rem .6rem; margin: 0 0 1rem; padding: .6rem; border-radius: 18px; background: #fff; box-shadow: inset 0 0 0 1px var(--line), 0 6px 16px -10px rgba(20, 18, 23, .25); }
.vid[hidden] { display: none; }
.vid video { grid-column: 1 / -1; width: 100%; max-height: 360px; border-radius: 12px; background: #1d1b20; object-fit: contain; }
.vid__meta { font: 600 .82rem/1.3 var(--f-m); color: var(--g2, #5b5560); letter-spacing: .02em; padding-left: .2rem; }
.vid__del, .vid__x { position: relative; justify-self: end; }
.vid__x { width: 40px; height: 40px; font-size: 1.4rem; line-height: 1; }
.vid__new { position: absolute; left: 1.1rem; top: 1.1rem; padding: .25rem .6rem; border-radius: 999px; background: var(--pink); color: #fff; font-size: .76rem; font-weight: 700; }
.vid .pic__gone { border-radius: 18px 18px 0 0; }
.vid.is-del video { opacity: .35; filter: grayscale(1); }
.vid.is-del .pic__gone { display: block; }
.vid.is-del .iconbtn--del { background: var(--err); color: #fff; }
.vprog { display: grid; gap: .45rem; margin: 0 0 1rem; padding: .8rem 1rem; border-radius: 14px; background: var(--pink05); font-weight: 600; font-size: .92rem; }
.vprog[hidden] { display: none; }
.vprog__bar { height: 8px; border-radius: 999px; background: var(--pink1); overflow: hidden; }
.vprog__bar i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--pink), var(--pink6)); transition: width .25s; }
.vprog.is-ok { background: var(--ok1); color: var(--ok); } .vprog.is-ok .vprog__bar { display: none; }
.vprog.is-err { background: var(--err1); color: var(--err); } .vprog.is-err .vprog__bar { display: none; }
form.is-busy .bar .btn:first-child { opacity: .55; pointer-events: none; }

/* 13.11.2026: kategorie – wybór jednym stuknięciem (pigułki), nowa kategoria, lista w Ustawieniach */
.catpick { border: 0; padding: 0; margin: 0 0 1rem; min-width: 0; }
.catpick legend { padding: 0; margin-bottom: .45rem; font-weight: 600; }
.catpick legend small { font-weight: 400; opacity: .7; }
.catpick__list { display: flex; flex-wrap: wrap; gap: .45rem; }
.catpick__opt { position: relative; cursor: pointer; }
.catpick__opt input { position: absolute; opacity: 0; pointer-events: none; }
.catpick__opt span { display: inline-flex; align-items: center; min-height: 40px; padding: .45rem .95rem; border: 1.5px solid #e2dce6; border-radius: 999px; background: #fff; font-size: .95rem; transition: background .2s, border-color .2s; }
.catpick__opt input:checked + span { border-color: #1d1b20; background: #1d1b20; color: #fff; }
.catpick__opt input:focus-visible + span { outline: 3px solid #e14f86; outline-offset: 2px; }
.catpick__new { display: inline-flex; align-items: center; gap: .35rem; min-height: 40px; padding: .45rem .95rem; border: 1.5px dashed #c9bfd0; border-radius: 999px; background: none; font: inherit; font-size: .95rem; cursor: pointer; }
.catpick__new svg { width: 16px; height: 16px; }
.catpick__add { display: grid; gap: .3rem; margin-top: .7rem; }
.catpick__add input { width: 100%; padding: .7rem .9rem; border: 1.5px solid #e2dce6; border-radius: 12px; font: inherit; }
.catpick .hint { display: block; margin-top: .55rem; }
.cats { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .5rem; }
.cat { display: grid; grid-template-columns: auto 1fr auto auto; gap: .6rem; align-items: center; padding: .45rem .55rem; border-radius: 14px; background: #faf7fb; }
.cat__move { display: flex; gap: .2rem; }
.cat__name { min-width: 0; width: 100%; padding: .6rem .8rem; border: 1.5px solid #e2dce6; border-radius: 10px; background: #fff; font: inherit; }
.cat__n { font-size: .85rem; opacity: .7; white-space: nowrap; }
.cat:has(input[name="cat_del[]"]:checked) .cat__name { text-decoration: line-through; opacity: .5; }
/* podgląd wyglądu zdjęć – te same zasady co w sklepie (sklep.css → [data-look]) */
.pv__img[data-look] img:not([width="120"]) { mix-blend-mode: normal; }
.pv__img[data-look="fill"] img:not([width="120"]) { object-fit: cover; }
.pv__img[data-look="fit"] { background: #fff; box-shadow: inset 0 0 0 1px #e7e1ee; }
.pv__img[data-look="fit"] img:not([width="120"]) { object-fit: contain; padding: 0; }
.pv__img[data-look="soft"] img:not([width="120"]) { object-fit: contain; padding: 4%; mix-blend-mode: multiply; }
/* wygląd zdjęć w sklepie – trzy kafle z podglądem głównego zdjęcia */
.looks { margin: 1.2rem 0 0; padding: 0; border: 0; min-width: 0; }
.looks__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.look { position: relative; display: grid; gap: .55rem; align-content: start; padding: .55rem .55rem .75rem; border-radius: var(--r-sm); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line2); cursor: pointer; transition: box-shadow .15s, background .15s; }
.look:hover { box-shadow: inset 0 0 0 1.5px var(--ink3); }
.look input { position: absolute; opacity: 0; pointer-events: none; }
.look:has(input:checked) { background: var(--pink05); box-shadow: inset 0 0 0 2px var(--g); }
.look:has(input:focus-visible) { outline: 3px solid var(--pink6); outline-offset: 2px; }
.look__pv { display: grid; place-items: center; aspect-ratio: 1; overflow: hidden; border-radius: 10px; background: linear-gradient(160deg, var(--pink1), var(--lilac1)); }
.look__pv img { width: 100%; height: 100%; }
.look__pv img:not([data-look-img]) { width: 40%; height: auto; opacity: .6; }
.look__pv[data-look="fill"] img[data-look-img] { object-fit: cover; }
.look__pv[data-look="fit"] { background: #fff; box-shadow: inset 0 0 0 1px #e7e1ee; }
.look__pv[data-look="fit"] img[data-look-img] { object-fit: contain; padding: 6%; }
.look__pv[data-look="soft"] img[data-look-img] { object-fit: contain; padding: 6%; mix-blend-mode: multiply; }
.look__t { display: grid; gap: .15rem; padding: 0 .2rem; }
.look__t b { font-size: .95rem; }
.look__t small { color: var(--ink3); font-size: .8rem; line-height: 1.35; }
@media (max-width: 520px) { .looks__list { grid-template-columns: minmax(0, 1fr); } .look { grid-template-columns: 84px minmax(0, 1fr); align-items: center; } }
.catsel select { min-height: 46px; padding: 0 2.4rem 0 1.1rem; border: 0; border-radius: 999px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231d1b20' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat right 1rem center; box-shadow: var(--sh); font: inherit; appearance: none; max-width: 100%; }
@media (max-width: 640px) { .cat { grid-template-columns: auto 1fr auto; } .cat__n { display: none; } }

/* Apaczka – wysyłka przy zamówieniu i ustawienia (13.11.2026): kafle zamiast pigułek – przewoźnik z ceną, paczka z wymiarami,
   przełącznik nadania, na dole koszt i przycisk; te same kafle w Ustawieniach */
.apz-k { display: block; font: 600 .72rem/1.2 var(--f-m); letter-spacing: .1em; text-transform: uppercase; color: var(--ink3); margin-bottom: .2rem; }
.apz-dest { display: flex; align-items: center; gap: .9rem; padding: .85rem 1rem; margin-bottom: 1.3rem; border-radius: var(--r-sm); background: var(--bg); }
.apz-dest img { width: 48px; height: 48px; flex: none; }
.apz-dest b { display: block; font-size: 1.05rem; }
.apz-dest div > span:last-child { color: var(--ink2); }
.apz-sec { margin: 0 0 1.25rem; border: 0; padding: 0; min-width: 0; }
.apz-h { margin: 0 0 .55rem; padding: 0; font: 700 .95rem/1.3 var(--f); color: var(--g); }
.apz-h small { font-weight: 500; color: var(--ink3); }
/* kafle wyboru (przewoźnik) */
.apz-tiles { display: grid; grid-template-columns: minmax(0, 1fr); gap: .45rem; }
.apz-tiles--one { grid-template-columns: minmax(0, 1fr); }
.apz-tile { position: relative; display: flex; align-items: center; gap: .9rem; min-height: 60px; padding: .55rem 1rem .55rem .6rem; border-radius: var(--r-sm); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line2); cursor: pointer; transition: box-shadow .15s, background .15s; }
.apz-tile:hover { box-shadow: inset 0 0 0 1.5px var(--ink3); }
.apz-tile input, .apz-size input, .apz-seg input { position: absolute; opacity: 0; pointer-events: none; }
.apz-tile:has(input:checked) { background: var(--pink05); box-shadow: inset 0 0 0 2px var(--g); }
.apz-tile:has(input:focus-visible) { outline: 3px solid var(--pink6); outline-offset: 2px; }
.apz-tile__logo { display: grid; place-items: center; flex: none; width: 76px; height: 40px; padding: 4px 6px; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); }
.apz-logo { display: block; max-width: 100%; max-height: 26px; width: auto; height: auto; }
.apz-logo--inpost { max-height: 32px; } .apz-logo--dpd { max-height: 24px; } .apz-logo--gls { max-height: 22px; }
.apz-facts__carrier { display: flex; align-items: center; gap: .6rem; }
.apz-facts__carrier .apz-logo { max-height: 22px; max-width: 64px; }
.apz-tile__t { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .6rem; flex: 1; min-width: 0; }
.apz-tile__t b { font-size: 1rem; }
.apz-tile__t small { color: var(--ink3); font-size: .84rem; }
.apz-tile__p { flex: none; font: 800 1.08rem/1 var(--f-d); font-stretch: 85%; color: var(--g); white-space: nowrap; text-align: right; }
.apz-tile__p.is-na { font: 500 .8rem/1.2 var(--f); color: var(--ink3); }
.apz-tile__p.is-best::after { content: 'najtaniej'; display: block; margin-top: .25rem; font: 700 .68rem/1 var(--f); letter-spacing: .02em; color: var(--ok); }
.apz-dots { display: inline-block; width: 1.6rem; height: .5rem; border-radius: 99px; background: linear-gradient(90deg, var(--bg2) 0%, var(--lilac1) 50%, var(--bg2) 100%) 0 0 / 200% 100%; animation: apzSkel 1.1s linear infinite; }
@keyframes apzSkel { to { background-position: -200% 0; } }
/* wielkość paczki – trzy równe kafle */
.apz-sizes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; }
.apz-size { position: relative; cursor: pointer; }
.apz-size > span { display: grid; gap: .15rem; height: 100%; padding: .8rem .9rem; border-radius: var(--r-sm); background: #fff; box-shadow: inset 0 0 0 1.5px var(--line2); transition: box-shadow .15s, background .15s; }
.apz-size b { font-size: 1.02rem; }
.apz-size span span { font: 600 .8rem/1.3 var(--f-m); color: var(--ink2); white-space: nowrap; letter-spacing: -.02em; }
.apz-size small { color: var(--ink3); font-size: .82rem; }
.apz-size:hover > span { box-shadow: inset 0 0 0 1.5px var(--ink3); }
.apz-size input:checked + span { background: var(--pink05); box-shadow: inset 0 0 0 2px var(--g); }
.apz-size input:focus-visible + span { outline: 3px solid var(--pink6); outline-offset: 2px; }
/* waga + nadanie w jednym rzędzie */
.apz-row { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: 1rem; align-items: start; }
.apz-row .apz-h { display: block; margin: 0 0 .5rem; font-size: .95rem; color: var(--g); }
.apz-kg.field { gap: 0; }
.apz-row .field { margin: 0; }
.apz-pick { border: 0; padding: 0; margin: 0; min-width: 0; }
.apz-seg { display: inline-grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px; padding: 4px; border-radius: 999px; background: var(--bg2); max-width: 100%; }
.apz-seg label { position: relative; cursor: pointer; min-width: 0; }
.apz-seg span { display: flex; align-items: center; justify-content: center; min-height: 42px; padding: 0 1.1rem; border-radius: 999px; font-weight: 600; font-size: .92rem; color: var(--ink2); text-align: center; transition: background .15s, color .15s, box-shadow .15s; }
.apz-seg input:checked + span { background: #fff; color: var(--g); box-shadow: 0 1px 2px rgba(20, 18, 23, .08), 0 4px 12px -4px rgba(20, 18, 23, .18); }
.apz-seg input:focus-visible + span { outline: 3px solid var(--pink6); outline-offset: 1px; }
.apz-when { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); gap: .7rem; max-width: 32rem; margin: -.2rem 0 1.1rem; }
.apz-when .field { margin: 0; }
/* dół karty: koszt i przycisk */
.apz-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .9rem 1.2rem; margin-top: .4rem; padding-top: 1.1rem; border-top: 1px solid var(--line); }
.apz-foot__sum { display: grid; gap: .1rem; min-width: 0; }
.apz-foot__sum b { font: 800 1.7rem/1.05 var(--f-d); font-stretch: 80%; }
.apz-foot__sum small { color: var(--ink3); font-size: .86rem; }
.apz-foot__sum small.is-err { color: var(--err); font-weight: 600; }
.apz-foot--done { justify-content: flex-start; }
.apz-foot--done form { margin: 0; }
.apz-foot__end { margin-left: auto !important; }
/* wysłana */
.apz-sent { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .8rem; margin-bottom: 1rem; }
.apz-sent .apz-k { flex-basis: 100%; }
.apz-sent__nr { font: 700 1.4rem/1.2 var(--f-m); letter-spacing: .04em; }
.apz-sent__nr a { color: var(--pink7); }
.apz-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .55rem; margin: 0 0 1.1rem; }
.apz-facts div { padding: .7rem .85rem; border-radius: var(--r-sm); background: var(--bg); }
.apz-facts dt { font: 600 .72rem/1.2 var(--f-m); letter-spacing: .1em; text-transform: uppercase; color: var(--ink3); margin-bottom: .25rem; }
.apz-facts dd { margin: 0; font-weight: 600; }
.apz__code { font-family: var(--f-m); font-size: 1.3rem; letter-spacing: .08em; }
.apz-stat { display: flex; align-items: center; gap: .6rem; margin: 0 0 .6rem; font-weight: 700; }
.apz-stat i { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 4px var(--ok1); }
.apz-stat.is-off i { background: var(--err); box-shadow: 0 0 0 4px var(--err1); }
.card--apz .hint { margin-bottom: 1.2rem; }
@media (max-width: 640px) {
  .apz-sizes { grid-template-columns: minmax(0, 1fr); }
  .apz-size > span { grid-template-columns: auto 1fr; column-gap: .7rem; }
  .apz-size small { grid-column: 1 / -1; }
  .apz-row { grid-template-columns: minmax(0, 1fr); }
  .apz-seg { display: grid; width: 100%; }
  .apz-when { grid-template-columns: 1fr 1fr; } .apz-when label:first-child { grid-column: 1 / -1; }
  .apz-foot .btn { width: 100%; justify-content: center; }
  .apz-foot__end { margin-left: 0 !important; }
}

/* strefa upuszczania plików – ikona liniowa (grafika 3D jest w nagłówku karty, nie powtarzamy jej) */
.drop > .i { width: 40px; height: 40px; color: var(--pink6); }
.look__none { padding: 0 .6rem; color: var(--ink3); font-size: .78rem; text-align: center; }
.top__shop .i { width: 22px; height: 22px; }
/* wysyłka (Tomek, 13.11.2026): przewoźnik z wyboru klienta, paczka domyślna – zmiana schowana */
.apz-more { margin-top: .55rem; }
.apz-more > summary { display: inline-flex; align-items: center; gap: .35rem; min-height: 40px; color: var(--pink7); font-weight: 600; cursor: pointer; list-style: none; }
.apz-more > summary::-webkit-details-marker { display: none; }
.apz-more > summary::after { content: '+'; font-weight: 700; }
.apz-more[open] > summary::after { content: '–'; }
.apz-more > .apz-tiles { margin-top: .3rem; }
.apz-more--pkg { margin: -.4rem 0 1.1rem; }
.apz-more--pkg .apz-sizes { margin: .4rem 0 .8rem; }
.apz-more--pkg .apz-kg { max-width: 9.5rem; margin-bottom: .4rem; }
.apz-pkg__v { margin: 0; min-height: 42px; display: flex; align-items: center; font-weight: 600; }
.apz-logo--orlen { max-height: 34px; }

.card--apz .apz-row { grid-template-columns: minmax(0, 1fr) auto; }
.apz-pkg__v { display: block; min-height: 0; padding-top: .6rem; line-height: 1.4; }
@media (max-width: 640px) { .card--apz .apz-row { grid-template-columns: minmax(0, 1fr); } }

/* ustawienia dostawy pogrupowane po przewoźniku: logo tylko przy pierwszej usłudze */
.ship__logo { display: grid; place-items: center; width: 56px; height: 40px; padding: 4px 6px; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); box-sizing: border-box; }
.ship__logo .apz-logo { max-height: 24px; max-width: 100%; }
.ship__logo--none { box-shadow: none; background: none; }
.ship--same { margin-top: -.4rem; border-top: 0; }

/* kadr zdjęcia – ten sam sposób wyświetlania co w sklepie (sklep.css → img[data-crop]) */
img[data-crop] { object-fit: contain !important; padding: 0 !important; translate: var(--x, 0) var(--y, 0); scale: var(--s, 1); }
/* 13.11.2026: zdjęcie z kadrem zawsze dokładnie na kwadracie kafla (absolutnie, 100 × 100 %) – pionowe zdjęcie z telefonu w siatce
   z „place-items: center” było wyższe od kafla i przesunięcie liczyło się od innej ramki niż w oknie ustawienia */
.pv__img, .look__pv, .pic__frame, .cropdlg__frame { position: relative; }
img[data-crop] { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none; }
.pic__frame { position: relative; display: block; width: 100%; aspect-ratio: 1; overflow: hidden; border-radius: inherit; background: #fff; }
.pic__frame img { width: 100%; height: 100%; object-fit: contain; display: block; }
.pic__crop { position: absolute; top: .4rem; right: .4rem; width: 40px; height: 40px; background: rgba(255, 255, 255, .94); box-shadow: 0 2px 8px rgba(0, 0, 0, .14); }
.pic__frame { cursor: zoom-in; }
.pic.is-del .pic__crop { display: none; }
.cropdlg { width: min(560px, 94vw); max-height: 94vh; padding: 0; border: 0; border-radius: var(--r-lg); box-shadow: var(--sh-lg); overflow: auto; }
.cropdlg::backdrop { background: rgba(29, 27, 32, .45); }
.cropdlg__in { display: grid; gap: .9rem; padding: 1.2rem 1.3rem 1.3rem; }
.cropdlg__h { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.cropdlg__h h2 { margin: 0; font-size: 1.4rem; }
.cropdlg .hint { margin: 0; }
.cropdlg__frame { position: relative; width: min(420px, 100%); aspect-ratio: 1; margin: 0 auto; overflow: hidden; border-radius: 22px; background: #fff; box-shadow: inset 0 0 0 1px var(--line2); cursor: grab; touch-action: none; user-select: none; }
.cropdlg__frame.is-drag { cursor: grabbing; }
.cropdlg__frame[data-look="soft"] { background: radial-gradient(120% 90% at 50% 18%, #fff 0%, var(--pink05) 48%, var(--lilac1) 100%); }
.cropdlg__frame[data-look="soft"] img { mix-blend-mode: multiply; }
.cropdlg__frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.cropdlg__grid { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent calc(33.33% - .5px), rgba(255, 255, 255, .55) calc(33.33% - .5px), rgba(255, 255, 255, .55) calc(33.33% + .5px), transparent calc(33.33% + .5px), transparent calc(66.66% - .5px), rgba(255, 255, 255, .55) calc(66.66% - .5px), rgba(255, 255, 255, .55) calc(66.66% + .5px), transparent calc(66.66% + .5px)), linear-gradient(180deg, transparent calc(33.33% - .5px), rgba(255, 255, 255, .55) calc(33.33% - .5px), rgba(255, 255, 255, .55) calc(33.33% + .5px), transparent calc(33.33% + .5px), transparent calc(66.66% - .5px), rgba(255, 255, 255, .55) calc(66.66% - .5px), rgba(255, 255, 255, .55) calc(66.66% + .5px), transparent calc(66.66% + .5px)); opacity: 0; transition: opacity .2s; }
.cropdlg__frame.is-drag .cropdlg__grid { opacity: 1; }
.cropdlg__zoom { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .8rem; font-weight: 600; color: var(--ink2); }
.cropdlg__zoom input { width: 100%; accent-color: var(--pink6); }
.cropdlg__quick { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
.cropdlg__act { display: flex; justify-content: flex-end; gap: .6rem; }
.cropdlg__zoom input[type="range"] { min-height: 32px; height: 32px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }

/* pliki projektu w zamówieniu – kafle z podglądem (13.11.2026); szara szachownica: widać i białe, i czarne logo */
.dfiles { grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); gap: .7rem; }
.dfile { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: .85rem; align-items: start; padding: .6rem; border-radius: 18px; background: var(--bg); }
.dfile__prev { position: relative; display: grid; place-items: center; width: 128px; aspect-ratio: 1; padding: 8px; border: 0; border-radius: 13px; cursor: zoom-in; overflow: hidden;
  background: #8e939b repeating-conic-gradient(#9aa0a8 0 25%, #868b93 0 50%) 0 0 / 16px 16px; }
.dfile--karta .dfile__prev { background: #e9e7ec; }
.dfile__prev canvas, .dfile__prev img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; }
.dfile__prev canvas { opacity: 0; transition: opacity .25s; }
.dfile.is-ready .dfile__prev canvas { opacity: 1; }
.dfile--karta .dfile__prev canvas { box-shadow: 0 2px 8px rgba(0, 0, 0, .15); }
.dfile__wait { position: absolute; inset: 0; display: grid; place-items: center; padding: 6px; font: 500 .78rem/1.3 'IBM Plex Mono', monospace; font-style: normal; color: #fff; text-align: center; }
.dfile--karta .dfile__wait { color: var(--ink3); }
.dfile.is-ready .dfile__wait { display: none; }
.dfile__txt { display: grid; gap: .2rem; min-width: 0; align-content: start; }
.dfile__txt b { font-size: 1rem; color: var(--g); }
.dfile__txt small { display: block; color: var(--ink3); font-size: .86rem; line-height: 1.4; }
.dfile__txt .dfile__white { color: var(--g); background: var(--pink1); border-radius: 9px; padding: .3rem .5rem; }
.dfile__txt .dfile__white[hidden] { display: none; }
.dfile__name { font: 400 .74rem/1.35 'IBM Plex Mono', monospace; color: var(--ink3); overflow-wrap: anywhere; }
.dfiles .dfile__txt a.btn { display: inline-flex; justify-self: start; margin-top: .3rem; min-height: 40px; padding: 0 .9rem; background: #fff; }
@media (max-width: 420px) { .dfile { grid-template-columns: 96px minmax(0, 1fr); } .dfile__prev { width: 96px; } }
.dfdlg { width: min(1200px, 96vw); height: min(860px, 92vh); max-width: none; max-height: none; padding: 0; border: 0; border-radius: 22px; overflow: hidden; background: #fff; }
.dfdlg[open] { display: flex; flex-direction: column; }
.dfdlg::backdrop { background: rgba(20, 18, 24, .55); }
.dfdlg__bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .7rem .9rem; border-bottom: 1px solid var(--line); }
.dfdlg__bar b { margin-right: auto; font-size: 1.05rem; }
.dfdlg__stage { flex: 1; min-height: 0; display: grid; place-items: center; padding: 16px; overflow: auto; }
.dfdlg__stage[data-bg="szare"] { background: #8e939b repeating-conic-gradient(#9aa0a8 0 25%, #868b93 0 50%) 0 0 / 24px 24px; }
.dfdlg__stage[data-bg="ciemne"] { background: #1d1b20; }
.dfdlg__stage[data-bg="białe"] { background: #fff; }
.dfdlg__stage canvas, .dfdlg__stage img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
@media (max-width: 600px) { .dfdlg__bar b { flex-basis: 100%; } .dfdlg__bar .btn { min-height: 40px; padding: 0 .85rem; } }

/* ---------- dodawanie produktu krok po kroku (13.11.2026) ---------- */
.wiz { position: sticky; top: 0; z-index: 9; margin: 0 0 1rem; padding: .8rem 1rem .9rem; border-radius: 22px; background: rgba(255, 255, 255, .94); box-shadow: 0 0 0 1px var(--line), 0 10px 28px -18px rgba(60, 20, 45, .35); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); scroll-margin-top: .6rem; }
.pform:not(.is-wiz) .wiz { display: none; }
.wiz__now { margin: 0 0 .55rem; font: 600 .74rem/1.2 'IBM Plex Mono', monospace; letter-spacing: .06em; text-transform: uppercase; color: var(--pink7); }
.wiz__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .4rem; }
.wiz__steps button { width: 100%; min-height: 44px; padding: .35rem .5rem; border: 0; border-radius: 999px; background: var(--bg); color: var(--ink2); font: 600 .9rem/1.15 inherit; cursor: pointer; transition: background .2s, color .2s; }
.wiz__steps button span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wiz__steps button:hover:not(:disabled) { background: var(--pink1); color: var(--pink7); }
.wiz__steps button.is-done { background: var(--pink05); color: var(--g); box-shadow: inset 0 0 0 1.5px var(--pink3); }
.wiz__steps button[aria-current="step"] { background: var(--g); color: #fff; box-shadow: 0 8px 18px -10px rgba(29, 27, 32, .6); }
.wiz__steps button:disabled { background: transparent; color: var(--ink3); box-shadow: inset 0 0 0 1.5px var(--line2); cursor: not-allowed; }
@media (max-width: 1079px) { .wiz { position: static; } }
.wiz__line { display: block; height: 4px; margin-top: .7rem; border-radius: 4px; background: var(--bg2); overflow: hidden; }
.wiz__line i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--pink), var(--pink6)); transition: width .35s ease; }
@media (max-width: 760px) {
  .wiz { padding: .65rem .7rem .75rem; border-radius: 18px; }
  .wiz__steps { display: flex; overflow-x: auto; scrollbar-width: none; gap: .35rem; }
  .wiz__steps::-webkit-scrollbar { display: none; }
  .wiz__steps li { flex: none; }
  .wiz__steps button { width: auto; padding: .35rem .9rem; font-size: .86rem; }
}
.pform.is-wiz .wstep[hidden] { display: none; }
.wiz__need { margin: 0 0 1rem; padding: .7rem .9rem; border-radius: 14px; background: var(--pink1); color: var(--pink7); font-weight: 600; }
.wiz__need[hidden] { display: none; }
/* pasek na dole: Wstecz / Dalej / Zapisz */
.wizbar [hidden] { display: none !important; }
.wizbar [data-wiz-next] .ico, .wizbar [data-wiz-prev] .ico { width: 18px; height: 18px; }
.pform.is-last .wizbar [data-wiz-next] { display: none; }
/* podgląd z boku: kategoria jak na karcie w sklepie */
.pv__cat { margin-top: .55rem; font: 500 .7rem/1.2 'IBM Plex Mono', monospace; letter-spacing: .08em; text-transform: uppercase; color: var(--ink3); }
.pv__cat + .pv__name { margin-top: .1rem; }
/* nowe zdjęcia – ten sam kafel co zapisane (kadr, kolejność, usuwanie) */
.pics .pic__main { display: none !important; }
.pics .pic.is-first .pic__main { display: block !important; }
.pic--new .pic__new { inset: .5rem auto auto .5rem; }
.pic--new.is-first .pic__new { display: none; }
.pic--new .pic__tools { inset: auto .4rem .4rem auto; justify-content: flex-end; }
.pic--new .pic__tools .iconbtn:first-child { margin-right: 0; }
.pic--new.is-bad .pic__frame { display: none; }
/* krok „Podgląd i publikacja” */
.card--wizpv .hint { margin-bottom: .9rem; }
.wizpv__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .6rem; margin: 0 0 .8rem; }
.seg { display: inline-flex; gap: .25rem; padding: .25rem; border-radius: 999px; background: var(--bg); }
.seg button { min-height: 40px; padding: 0 1rem; border: 0; border-radius: 999px; background: none; color: var(--ink2); font: 600 .9rem inherit; cursor: pointer; }
.seg button[aria-pressed="true"] { background: #fff; color: var(--g); box-shadow: 0 2px 8px rgba(29, 27, 32, .12); }
.wizpv__frame { position: relative; overflow: hidden; border-radius: 18px; background: var(--bg2); box-shadow: inset 0 0 0 1px var(--line); }
.wizpv__frame iframe { display: block; border: 0; background: #fff; transform-origin: 0 0; }
.wizpv__wait { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(247, 244, 242, .85); font-weight: 600; color: var(--ink2); }
.wizpv__wait[hidden] { display: none; }
.wizpv__checks { list-style: none; margin: 1rem 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: .45rem; }
.wizpv__checks li { padding: .55rem .8rem; border-radius: 12px; background: var(--bg); font-size: .92rem; line-height: 1.35; color: var(--ink2); }
.wizpv__checks li.is-warn { background: var(--pink1); color: var(--pink7); font-weight: 600; }
.wizpv__checks s { color: var(--ink3); }
.wizpv__go { display: flex; flex-wrap: wrap; gap: .6rem; }
.wizpv__go .ico { width: 20px; height: 20px; }
@media (max-width: 600px) { .wizpv__go .btn { flex: 1 1 100%; } .wizpv__bar .seg { flex: 1 1 100%; } .seg button { flex: 1; } }
/* okno ustawienia zdjęcia: siatka (trójpodział), linie środka (różowe, gdy produkt stoi na środku), margines bezpieczny */
.cropdlg__h .kicker { margin: 0 0 .2rem; }
.cropdlg__safe, .cropdlg__mid { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .2s; }
.cropdlg__safe { inset: 8%; border: 1.5px dashed rgba(241, 111, 157, .55); border-radius: 12px; }
.cropdlg__mid i { position: absolute; background: rgba(29, 27, 32, .28); }
.cropdlg__mid i:first-child { left: 50%; top: 0; bottom: 0; width: 1px; translate: -.5px 0; }
.cropdlg__mid i:last-child { top: 50%; left: 0; right: 0; height: 1px; translate: 0 -.5px; }
.cropdlg__frame.is-grid .cropdlg__grid, .cropdlg__frame.is-grid .cropdlg__safe, .cropdlg__frame.is-grid .cropdlg__mid, .cropdlg__frame.is-drag .cropdlg__mid { opacity: 1; }
.cropdlg__frame.is-grid .cropdlg__grid { background: linear-gradient(90deg, transparent calc(33.33% - .5px), rgba(29, 27, 32, .14) calc(33.33% - .5px), rgba(29, 27, 32, .14) calc(33.33% + .5px), transparent calc(33.33% + .5px), transparent calc(66.66% - .5px), rgba(29, 27, 32, .14) calc(66.66% - .5px), rgba(29, 27, 32, .14) calc(66.66% + .5px), transparent calc(66.66% + .5px)), linear-gradient(180deg, transparent calc(33.33% - .5px), rgba(29, 27, 32, .14) calc(33.33% - .5px), rgba(29, 27, 32, .14) calc(33.33% + .5px), transparent calc(33.33% + .5px), transparent calc(66.66% - .5px), rgba(29, 27, 32, .14) calc(66.66% - .5px), rgba(29, 27, 32, .14) calc(66.66% + .5px), transparent calc(66.66% + .5px)); }
.cropdlg__frame.is-snapx .cropdlg__mid i:first-child, .cropdlg__frame.is-snapy .cropdlg__mid i:last-child { background: var(--pink6); box-shadow: 0 0 0 1px rgba(241, 111, 157, .35); }
.cropdlg__frame.is-snapx .cropdlg__mid, .cropdlg__frame.is-snapy .cropdlg__mid { opacity: 1; }
.cropdlg__gridtg { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: 0 .4rem; font-weight: 600; color: var(--ink2); cursor: pointer; }
.cropdlg__gridtg .tg { width: 44px; height: 26px; }
.cropdlg__gridtg .tg::before { width: 20px; height: 20px; }
.cropdlg__gridtg .tg:checked::before { transform: translateX(18px); }
.cropdlg__quick .btn:disabled { opacity: .5; }

/* ---------- realizacje (14.11.2026): kafle jak na stronie /portfolio/ – 4 kolumny, wszystkie tej samej wielkości, kafel 4 : 4,4 ---------- */
.works__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem .9rem; }
.work { --meta: 5.4rem; display: flex; flex-direction: column; aspect-ratio: auto; overflow: visible; background: none; box-shadow: none; border-radius: 0; }
.work .pic__frame { flex: none; aspect-ratio: 4 / 4.4; border-radius: 18px; box-shadow: inset 0 0 0 1px var(--line), 0 6px 16px -10px rgba(20, 18, 23, .25); }
.work .pic__frame img:not([data-crop]) { object-fit: cover; }
.work .pic__tools { bottom: calc(var(--meta) + .4rem); }
.work .pic__gone, .work .work__off { border-radius: 18px 18px 0 0; }
.work__meta { display: grid; align-content: start; gap: .35rem; height: var(--meta); padding-top: .5rem; }
.work__meta input[type="text"], .work__meta input:not([type]) { min-height: 40px; padding: .4rem .7rem; font-size: .88rem; }
.work__hide { display: inline-flex; align-items: center; gap: .45rem; min-height: 32px; font-size: .86rem; font-weight: 600; color: var(--ink2); cursor: pointer; }
.work__hide input { width: 18px; height: 18px; accent-color: var(--pink6); }
.work__off { position: absolute; inset: 0 0 auto; display: none; padding: .45rem .6rem; background: var(--g); color: #fff; font-size: .78rem; font-weight: 700; }
.work.is-off .work__off { display: block; }
.work.is-off .pic__frame img { opacity: .45; }
.work.pic--new .pic__new { inset: .5rem auto auto .5rem; }
@media (max-width: 900px) { .works__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .work .pic__tools .iconbtn, .work .pic__crop { width: 36px; height: 36px; } }
/* okno ustawienia na telefonie: nic nie może poszerzać okna (dłuższe przyciski łamią się do nowej linii) */
.cropdlg__in { grid-template-columns: minmax(0, 1fr); }
.cropdlg__in > * { min-width: 0; }
.cropdlg__act { flex-wrap: wrap; }
.cropdlg__act .btn { flex: 1 1 auto; }
.cropdlg__frame { justify-self: center; }
@media (max-width: 480px) { .cropdlg__in { padding: 1rem .9rem 1.1rem; gap: .7rem; } .cropdlg__h h2 { font-size: 1.2rem; } .cropdlg .hint { font-size: .86rem; } .cropdlg__quick .btn { flex: 1 1 auto; } }

/* miniatury produktów w kokpicie = kafel w sklepie (14.11.2026): białe tło bez filtrów, kadr z okna zdjęcia */
.pcard__img, .mini { position: relative; }
.pcard__img { background: #fff; box-shadow: inset 0 0 0 1px var(--line); }
.pcard__img img:not(.noimg) { mix-blend-mode: normal; }

/* ---------- ustawienia sklepu (14.11.2026, „układ się porozjeżdżał”): jedna kolumna kart w stałej kolejności + spis sekcji ---------- */
.sform.sform--v2 { display: grid; grid-template-columns: minmax(0, 62rem) minmax(11rem, 14rem); grid-auto-flow: row; gap: 0 2rem; align-items: start; max-width: none; }
.sform--v2 .sform__main { grid-column: 1; grid-row: 1; min-width: 0; }
.sform--v2 > .bar { grid-column: 1 / -1; }
.snav { grid-column: 2; grid-row: 1; position: sticky; top: 1.5rem; padding: 1rem 1.1rem; border-radius: 22px; background: rgba(255, 255, 255, .8); box-shadow: 0 0 0 1px var(--line); }
.snav .kicker { margin: 0 0 .5rem; }
.snav ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .15rem; }
.snav a { display: flex; align-items: center; min-height: 40px; padding: .3rem .7rem; border-radius: 12px; color: var(--ink2); font-weight: 600; font-size: .93rem; text-decoration: none; }
.snav a:hover, .snav a.is-on { background: var(--pink1); color: var(--pink7); }
.sanchor { display: block; position: relative; top: -1rem; scroll-margin-top: 1rem; }
.sform--v2 .card { margin-bottom: 1.25rem; }
.sform--v2 .ships { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 1279px) {
  .sform.sform--v2 { grid-template-columns: minmax(0, 1fr); }
  .sform--v2 .sform__main { grid-row: auto; }
  .snav { grid-column: 1; grid-row: auto; position: static; margin: 0 0 1rem; padding: .6rem .7rem; }
  .snav .kicker { display: none; }
  .snav ol { display: flex; gap: .35rem; overflow-x: auto; scrollbar-width: none; }
  .snav ol::-webkit-scrollbar { display: none; }
  .snav li { flex: none; }
  .snav a { min-height: 40px; padding: .3rem .9rem; border-radius: 999px; background: var(--bg); white-space: nowrap; }
}
/* płatności: Przelewy24 na górze, pod nim przelew tradycyjny */
.card--pay .p24 { margin-bottom: 1.2rem; }
.card--pay .apz-h { margin-top: 0; }
/* wysyłki: stan podłączenia + krótko, jak to działa (bez gabarytów – zrezygnowaliśmy) */
.apz-ok { margin: 0 0 1.2rem; padding: 1rem 1.1rem; border-radius: 18px; background: linear-gradient(150deg, #e7f6ee, #f8fcfa); }
.apz-ok .apz-stat { margin: 0 0 .7rem; }
.apz-info { margin: 0; display: grid; gap: 0; }
.apz-info > div { display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: .8rem; padding: .55rem 0; border-top: 1px solid rgba(29, 27, 32, .08); }
.apz-info > div:first-child { border-top: 0; }
.apz-info dt { font-weight: 700; color: var(--g); }
.apz-info dd { margin: 0; color: var(--ink2); line-height: 1.45; }
.apz-info dd small { display: block; margin-top: .15rem; color: var(--ink3); font-size: .82rem; }
@media (max-width: 640px) { .apz-info > div { grid-template-columns: minmax(0, 1fr); gap: .15rem; } }
/* kategorie: dwie kolumny na szerokiej karcie */
.sform--v2 .cats { grid-template-columns: repeat(auto-fill, minmax(min(100%, 24rem), 1fr)); gap: .5rem .9rem; }
.sform--v2 .cat { grid-template-columns: auto minmax(0, 1fr) auto auto; gap: .45rem; }
.sform--v2 .cat__n { font-size: .78rem; }

/* ---------- kokpit na telefonie (14.11.2026, „intuicyjny i łatwy w obsłudze, nic na siebie nie zachodzi”) ---------- */
.wiz__steps .wiz__s { display: none; }
@media (max-width: 640px) {
  /* kroki produktu: wszystkie 5 w jednym rzędzie, krótkie nazwy */
  .wiz__steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .25rem; overflow: visible; }
  .wiz__steps li { min-width: 0; }
  .wiz__steps button { width: 100%; padding: .3rem .2rem; font-size: .8rem; }
  .wiz__steps .wiz__l { display: none; }
  .wiz__steps .wiz__s { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  /* pasek na dole: jeden rząd – Wstecz (sama strzałka), Dalej, Zapisz; „Anuluj” jest w strzałce „Produkty” u góry */
  .wizbar { flex-wrap: nowrap; gap: .45rem; }
  .wizbar .btn { flex: 1 1 auto; min-height: 50px; padding: 0 .9rem; font-size: .95rem; }
  .wizbar .wizbar__prev { flex: 0 0 50px; padding: 0; justify-content: center; }
  .wizbar__prev span, .wizbar__cancel, .bar .bar__more { display: none !important; }
  .wizbar [data-wiz-save] { flex: 0 1 auto; }
  .bar__dirty { display: none !important; }
  /* dostawa w ustawieniach: logo + nazwa w jednym rzędzie, cena i włącznik obok siebie w drugim */
  .ship { grid-template-columns: 44px minmax(0, 1fr) auto; gap: .45rem .7rem; padding: .8rem; }
  .ship__ic { width: 44px; height: 44px; grid-row: span 2; align-self: start; }
  .ship__logo { width: 44px; height: 34px; }
  .ship__name { grid-column: 2 / -1; }
  .ship__price { grid-column: 2; }
  .ship__on { grid-column: 3; align-self: end; min-height: 46px; }
  .ship__on span { font-size: .85rem; }
  .ship--same .ship__ic { grid-row: span 2; }
}
/* produkt na telefonie i tablecie: najpierw kroki i ich treść, podgląd „Tak zobaczy go klient” pod spodem, pasek zawsze ostatni */
@media (max-width: 1079px) {
  .pform.is-wiz .pform__side { order: 1; }
  .pform.is-wiz .bar { order: 2; }
  .pform.is-wiz .wiz { margin-top: 0; }
}