/* Makiety panelu Sellero (kokpit, zamówienia, magazyn, wiadomości, marża, workflow, OSS).
   Źródło: partials/app-mock/styles.blade.php dołącza ten plik raz na stronę. */
.am { container-type: inline-size; position: relative; overflow: hidden; }
.am-screen {
    --am-w: 144;
    font-size: 6px;
    font-family: var(--font-sans); color: var(--am-ink); background: var(--am-chrome);
    line-height: 1.35; text-align: left; -webkit-font-smoothing: antialiased;
}
@supports (width: 1cqw) { .am-screen { font-size: calc(100cqw / var(--am-w)); } }
/* szerokość projektu w klasach, nie w style="": deklaracja inline wygrywała
   z @container i widok zamówień nie dostawał skali na telefon */
/* w hero mniej elementów, więc większa skala - liczby czytelne z daleka */
.am--compact .am-screen { --am-w: 64; }
.am--compact .am-search { display: none; }
.am--compact .am-top { grid-template-columns: 1fr auto; }
.am--light {
    --am-chrome: #FFFFFF; --am-bg: #F4F5F7; --am-card: #FFFFFF; --am-line: #E5E7EB; --am-line-2: #D9DCE1;
    --am-ink: #1B1C1F; --am-ink-2: #3F4248; --am-muted: #6B7079; --am-blue: #0B84D6; --am-blue-2: #13A4EC; --am-blue-soft: #E7F3FC;
    --am-green: #16A34A; --am-red: #DC2626;
}
.am--dark {
    --am-chrome: #2A2B2F; --am-bg: #1E1F22; --am-card: #25262A; --am-line: #34363B; --am-line-2: #3E4046;
    --am-ink: #ECEDEF; --am-ink-2: #C9CBD0; --am-muted: #9A9EA6; --am-blue: #1D8FE6; --am-blue-2: #1D8FE6; --am-blue-soft: rgba(29, 143, 230, .16);
    --am-green: #22C55E; --am-red: #F87171;
}
.am-ic { width: 1em; height: 1em; flex-shrink: 0; display: block; }
/* obrazki makiety mają własne wymiary w em - ogólne reguły sekcji (np. „img na
   całą szerokość”) nie mogą ich przejąć */
.am img { max-width: none; }

/* górny pasek */
.am-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 6.2em; padding: 0 2.4em; background: var(--am-chrome); }
.am-brand { display: flex; align-items: center; gap: 1.4em; }
.am .am-brand img { height: 3.6em; width: auto; display: block; }
.am-back { font-size: 2.2em; color: var(--am-muted); display: grid; }
.am-search {
    display: flex; align-items: center; gap: 1em; width: 44em; height: 4.2em; padding: 0 1.2em 0 1.4em;
    border: 1px solid var(--am-line-2); border-radius: .9em; background: var(--am-card); color: var(--am-muted);
}
.am--dark .am-search { background: #323338; }
.am-search .am-ic { font-size: 1.9em; }
.am-search span { font-size: 1.55em; flex: 1; }
.am-search kbd { font-family: var(--font-mono); font-size: 1.1em; padding: .25em .6em; border-radius: .45em; background: var(--am-bg); border: 1px solid var(--am-line); color: var(--am-muted); }
.am-top-tools { display: flex; align-items: center; justify-content: flex-end; gap: 1.7em; color: var(--am-ink-2); }
.am-tool { position: relative; font-size: 2.3em; display: grid; }
.am-tool--dot::after { content: ''; position: absolute; top: -.1em; right: -.12em; width: .34em; height: .34em; border-radius: 50%; background: #E0443E; }
.am-tool-count { position: absolute; top: -.62em; right: -.7em; font: 600 .42em/1 var(--font-mono); padding: .25em .4em; border-radius: .5em; background: var(--am-blue-soft); color: var(--am-blue); border: 1px solid var(--am-blue); }
.am-avatar { display: grid; place-items: center; width: 3.8em; height: 3.8em; border-radius: 50%; background: var(--am-blue); color: #fff; font: 700 1.45em/1 var(--font-sans); width: 2.6em; height: 2.6em; }

.am-body { display: grid; grid-template-columns: 26em minmax(0, 1fr); }
.am-body--full { grid-template-columns: minmax(0, 1fr); }

/* menu boczne */
.am-side { padding: 1.4em 1.6em 3em; background: var(--am-chrome); }
.am-side-item { display: flex; align-items: center; gap: 1.2em; height: 4.4em; padding: 0 1.2em; margin-bottom: .3em; border-radius: .9em; color: var(--am-ink-2); position: relative; }
.am-side-item .am-ic { font-size: 2.1em; color: var(--am-muted); }
.am-side-label { font-size: 1.55em; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-side-item.is-active { background: var(--am-blue-soft); color: var(--am-blue); }
.am-side-item.is-active .am-ic { color: var(--am-blue); }
/* „miecz świetlny”: niebieski panelu świeci jak w aktualnej wersji aplikacji
   (właściciel 14.09.2026) - jasny rdzeń i poświata w kolorze */
.am { --am-saber: 0 0 .3em rgba(19, 164, 236, .55), 0 0 .9em rgba(19, 164, 236, .22); }
.am-side-item.is-active::before { content: ''; position: absolute; left: 0; top: .7em; bottom: .7em; width: .3em; border-radius: .3em; background: linear-gradient(90deg, #BFE8FF, var(--am-blue-2)); box-shadow: var(--am-saber); }
.am-side-item.is-active { box-shadow: inset 0 0 0 1px rgba(19, 164, 236, .18); }
.am-side-group { display: flex; align-items: center; justify-content: space-between; margin: 2.6em 1.2em 1em; font-size: 1.5em; color: var(--am-muted); }
.am-side-group .am-ic { font-size: 1.1em; }
.am-side-item:nth-child(2) + .am-side-group { margin-top: 3.4em; }
.am-badge { font: 600 1.15em/1 var(--font-mono); padding: .4em .55em; border-radius: .45em; color: var(--am-blue); background: var(--am-blue-soft); border: 1px solid color-mix(in srgb, var(--am-blue) 40%, transparent); }
.am-badge--warn { color: #D97706; background: rgba(245, 158, 11, .12); border-color: rgba(245, 158, 11, .45); }

/* obszar główny */
.am-main { background: var(--am-bg); padding: 3em 3.2em 3.4em; border-top-left-radius: 2.4em; border: 1px solid var(--am-line); border-width: 1px 0 0 1px; min-width: 0; }
.am-body--full .am-main { border-radius: 0; border-left: 0; }
.am-h1 { font-family: var(--font-display); font-weight: 600; letter-spacing: -.02em; line-height: 1.15; }
.am-card { background: var(--am-card); border: 1px solid var(--am-line); border-radius: 1.2em; }
.am-muted { color: var(--am-muted); }
.am-btn { display: inline-flex; align-items: center; gap: .6em; padding: .75em 1.2em; border-radius: .7em; background: var(--am-blue-2); color: #fff; font-weight: 600; box-shadow: 0 .4em 1.2em -.6em rgba(19, 164, 236, .55); }
.am-btn .am-ic { font-size: 1.1em; }
.am-spark { display: block; width: 100%; height: auto; }
.am-spark path.am-spark-line { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; }
.am-up { color: var(--am-green); }
.am-down { color: var(--am-red); }
.am-num { font-variant-numeric: tabular-nums; }

/* ── kokpit ── */
.am-kp-head { display: flex; align-items: center; justify-content: space-between; }
.am-kp-head .am-h1 { font-size: 3em; }
.am-kp-head .am-ic { font-size: 2.2em; color: var(--am-blue); }
.am-progress { flex: 1; height: .85em; border-radius: 1em; background: #E9EBEF; overflow: hidden; }
.am-progress-fill { display: block; height: 100%; width: var(--am-progress, 77%); border-radius: inherit; background: linear-gradient(180deg, #BFE8FF, var(--am-blue-2) 55%); box-shadow: var(--am-saber); transition: width 1.4s cubic-bezier(.16,1,.3,1) .3s; }
.am-sec { margin-top: 3.2em; padding-bottom: 1.2em; border-bottom: 1px solid var(--am-line); }
.am-sec-t { font-size: 1.8em; font-weight: 600; font-family: var(--font-display); }
.am-sec-s { font-size: 1.35em; margin-top: .3em; }
.am-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.6em; margin-top: 2em; }
.am-kpi { padding: 1.8em 1.8em 0; overflow: hidden; display: flex; flex-direction: column; }
.am-kpi-l { display: flex; align-items: center; gap: .7em; font-size: 1.4em; color: var(--am-ink-2); }
.am-kpi-l .am-ic { font-size: 1.3em; color: var(--am-muted); }
.am-kpi-v { font-family: var(--font-display); font-size: 2.9em; font-weight: 600; letter-spacing: -.02em; margin-top: .35em; white-space: nowrap; }
.am-kpi-d { display: flex; align-items: center; gap: .4em; font-size: 1.3em; margin-top: .4em; }
.am-kpi-d .am-ic { font-size: 1.1em; }
.am-kpi .am-spark { margin: 1em -1.8em 0; width: calc(100% + 3.6em); }
.am-kpi--flat { padding-bottom: 1.8em; }
/* w kolumnie hero cztery kafelki obok siebie ucinały kwoty - dwa na dwa */
.am--compact .am-kpis, .am--compact .am-qa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* w hero tylko powitanie i dwie liczby z wykresem - bez karty konfiguracji, podpisu
   okresu i kafli bez wykresu (mniej drobnego tekstu w pierwszym ekranie) */
.am--compact :is(.am-sec-s, .am-kpi--flat) { display: none; }
.am--compact .am-kpi-v { font-size: 3.6em; }
.am--compact .am-kpi { padding: 2.2em 2.2em 0; }
.am--compact .am-kpi .am-spark { margin: 1.4em -2.2em 0; width: calc(100% + 4.4em); }
.am--compact .am-sec { margin-top: 2.6em; }
/* w hero bez szybkich akcji - makieta nie może być wyższa niż tekst obok */
.am--compact .am-qa-l, .am--compact .am-qa { display: none; }
.am-qa-l { font-size: 1.15em; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--am-muted); margin: 3em 0 1.2em; }
.am-qa { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.6em; }
.am-qa-i { display: flex; align-items: center; gap: 1.2em; padding: 1.3em 1.4em; }
.am-qa-ic { display: grid; place-items: center; width: 3.8em; height: 3.8em; border-radius: .9em; background: var(--am-blue-soft); color: var(--am-blue); flex-shrink: 0; }
.am-qa-ic .am-ic { font-size: 2em; }
.am-qa-t { font-size: 1.45em; font-weight: 600; white-space: nowrap; }
.am-qa-s { font-size: 1.2em; color: var(--am-muted); white-space: nowrap; }

/* ── kokpit 1:1 ze zrzutu aplikacji (25.09.2026) ──
   --am-w: 200, więc 1em = 1/200 szerokości makiety = 10 px zrzutu 2000 px. Każdy
   wymiar poniżej to piksele zmierzone na zrzucie podzielone przez 10. Kolory: próbki
   pikseli - motyw konta w limonce (Filament lime: 50 #F7FEE7, 100 #ECFCCB, 600 #65A30D,
   700 #4D7C0F), tło strony #F5F5F5, białe karty. Sora: nagłówki, liczby, menu;
   Inter: reszta; JetBrains Mono: nagłówki tabel, statusy, tagi, liczniki. */
.am--kokpit .am-screen { --am-w: 200; background: #fff; color: #1A1A1D; line-height: 1.3; }
.am--kokpit .am-ic { stroke-width: 1.5; }

.kp-top { position: relative; height: 6.6em; background: #fff; border-bottom: 1px solid #E9E9EB; }
.kp-back { position: absolute; left: 2.8em; top: 2.1em; font-size: 1em; color: #3F3F46; }
.kp-back .am-ic { width: 2.2em; height: 2.4em; }
.am .kp-logo { position: absolute; left: 6.4em; top: .45em; height: 5.7em; width: auto; }
.kp-search {
    position: absolute; left: 78.8em; top: 1.3em; width: 42.5em; height: 3.9em;
    display: flex; align-items: center; gap: 1em; padding: 0 1.2em 0 1.3em;
    border: 1px solid #DCDCE0; border-radius: .6em; background: #fff; color: #71717A;
}
.kp-search .am-ic { width: 1.8em; height: 1.8em; }
.kp-search span { font-size: 1.5em; flex: 1; }
.kp-search kbd { font: 500 1.1em/1 var(--font-mono); padding: .3em .5em; border-radius: .4em; background: #F4F4F5; border: 1px solid #E4E4E7; color: #71717A; }
.kp-tools { position: absolute; right: 1.7em; top: 1.6em; display: flex; align-items: center; gap: 1.8em; color: #3F3F46; }
.kp-tool { position: relative; display: grid; }
.kp-tool .am-ic { width: 2.1em; height: 2.1em; }
.kp-tool--dot::after { content: ''; position: absolute; top: -.35em; right: -.4em; width: .75em; height: .75em; border-radius: 50%; background: #E0443E; }
.kp-avatar { display: grid; place-items: center; width: 3.4em; height: 3.4em; border-radius: 50%; background: #65A30D; color: #fff; font: 700 1.35em/1 var(--font-sans); width: 2.52em; height: 2.52em; }

.kp-body { display: grid; grid-template-columns: 26.6em minmax(0, 1fr); }
.kp-side { position: relative; padding: 3.3em 2.8em 3em 1.6em; background: #fff; }
.kp-item { position: relative; display: flex; align-items: center; gap: 1.5em; height: 4.1em; padding: 0 .8em 0 1.1em; margin-bottom: .45em; border-radius: .4em; color: #27272A; }
.kp-item .am-ic { width: 2em; height: 2em; color: #71717A; }
.kp-item-l { flex: 1; font: 500 1.55em/1 var(--font-display); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kp-item.is-active { background: #ECFCCB; color: #4D7C0F; }
.kp-item.is-active .am-ic { color: #4D7C0F; }
.kp-item.is-active::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: .3em; border-radius: .4em 0 0 .4em; background: #65A30D; }
.kp-item--tree .am-ic { color: #A1A1AA; }
.kp-item--tree::after { content: ''; position: absolute; left: 2.1em; top: 2.95em; width: 1px; height: 1.9em; background: #D4D4D8; }
.kp-group { display: flex; align-items: center; justify-content: space-between; height: 2.4em; margin: 3.25em 0 1.45em; padding: 0 1em 0 .9em; font: 500 1.45em/1 var(--font-sans); color: #71717A; }
.kp-group .am-ic { width: 1.1em; height: 1.1em; }
.kp-badge { font: 500 1.2em/1 var(--font-mono); padding: .4em .55em; border-radius: .45em; color: #4D7C0F; background: #F7FEE7; box-shadow: inset 0 0 0 1px rgba(101, 163, 13, .3); }
.kp-scroll { position: absolute; width: .6em; border-radius: .3em; background: #C9C9CE; }
.kp-scroll--side { right: .2em; top: .2em; height: 44.7em; }
.kp-scroll--main { right: .4em; top: 19.6em; height: 50.8em; }

.kp-main { position: relative; padding: 1.5em 3.8em 0 2.7em; background: #F5F5F5; min-width: 0; }
.kp-sec { padding-bottom: .8em; border-bottom: 1px solid #E6E6E9; }
.kp-sec-t { font: 600 1.75em/1.3 var(--font-sans); letter-spacing: -.01em; }
.kp-sec-s { font-size: 1.5em; line-height: 1.35; margin-top: .3em; color: #52525B; }

.kp-card { position: relative; background: #fff; border: 1px solid #E8E8EC; border-radius: .8em; box-shadow: 0 1px 2px rgba(10, 10, 15, .04); overflow: hidden; }
.kp-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.4em; margin-top: 2.6em; }
.kp-kpi { height: 14.4em; padding: 2.4em 2.6em 0; }
.kp-kpi-l { display: flex; align-items: center; gap: .6em; font-size: 1.5em; line-height: 1.35; color: #3F3F46; }
.kp-kpi-l .am-ic { width: 1.2em; height: 1.2em; color: #71717A; }
.kp-kpi-v { font: 600 3.4em/1.15 var(--font-display); letter-spacing: -.02em; margin-top: .22em; white-space: nowrap; }
.kp-kpi-d { display: flex; align-items: center; gap: .35em; font-size: 1.5em; margin-top: .45em; color: #52525B; }
.kp-kpi-d .am-ic { width: 1.1em; height: 1.1em; }
.kp-up { color: #15803D; }
.kp-kpi .am-spark { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 2.2em; }
.kp-kpi .am-spark path.am-spark-line { stroke-width: 1.5; }

.kp-qa-l { font: 600 1.2em/1 var(--font-sans); letter-spacing: .1em; text-transform: uppercase; color: #52525B; margin: 2.8em 0 1.35em; }
.kp-qa { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.7em; }
.kp-qa-i { display: flex; align-items: center; gap: 1.3em; height: 7.5em; padding: 0 1.6em; }
.kp-qa-ic { display: grid; place-items: center; width: 4em; height: 4em; border-radius: .6em; background: #F1FADF; color: #65A30D; flex-shrink: 0; }
.kp-qa-ic .am-ic { width: 2em; height: 2em; }
.kp-qa-t { font: 500 1.5em/1.3 var(--font-sans); color: #1A1A1D; white-space: nowrap; }
.kp-qa-s { font-size: 1.3em; line-height: 1.35; margin-top: .15em; color: #52525B; white-space: nowrap; }

.kp-grid { display: grid; grid-template-columns: minmax(0, 124.5fr) minmax(0, 39.9fr); gap: 2.5em; margin-top: 2.5em; align-items: start; }
.kp-tbl-h { display: flex; align-items: center; height: 3.41em; padding: 0 1.47em; font: 600 1.7em/1 var(--font-sans); }
.kp-row { display: grid; grid-template-columns: 12.3em 12em 12.2em 22.5em 15.9em 10em minmax(0, 1fr) 21.4em; align-items: center; height: 6.7em; padding: 0 2.4em 0 2.5em; border-top: 1px solid #EFEFF1; }
.kp-thead { height: 4.8em; background: #F5F5F5; border-top: 1px solid #EBEBED; border-bottom: 1px solid #EBEBED; }
.kp-row.kp-thead + .kp-row { border-top: 0; }
.kp-thead span { display: inline-flex; align-items: center; gap: .6em; font: 500 1.1em/1 var(--font-mono); letter-spacing: .2em; text-transform: uppercase; color: #52525B; white-space: nowrap; }
.kp-thead .am-ic { width: 1.3em; height: 1.3em; stroke-width: 1.8; }
.kp-r { justify-self: end; text-align: right; }
.kp-no { font-size: 1.5em; }
.kp-ch { display: flex; align-items: center; gap: .75em; font: 500 1.1em/1 var(--font-mono); color: #52525B; }
.am .kp-ch img { width: 1.3em; height: 1.3em; border-radius: .2em; }
.kp-thumb { display: block; width: 3.4em; height: 3.2em; border-radius: .5em; }
.kp-tag { font: 500 1.1em/1 var(--font-mono); padding: .4em .6em; border-radius: .4em; color: #4D7C0F; background: #F7FEE7; box-shadow: inset 0 0 0 1px rgba(101, 163, 13, .25); white-space: nowrap; }
.kp-status { display: inline-flex; align-items: center; gap: .45em; font: 500 1.1em/1 var(--font-mono); padding: .4em .6em; border-radius: .4em; white-space: nowrap; }
.kp-status .am-ic { width: 1.25em; height: 1.25em; }
.kp-status--wait { color: #A15C1A; background: #FFF7E8; box-shadow: inset 0 0 0 1px rgba(217, 119, 6, .22); }
.kp-status--danger { color: #B4443A; background: #FEF2F2; box-shadow: inset 0 0 0 1px rgba(194, 69, 59, .2); }
.kp-ship { display: flex; align-items: center; gap: .9em; font-size: 1.3em; }
.kp-ship .am-flag { width: 1.3em; height: .9em; }
.kp-sum { font-size: 1.5em; font-weight: 600; }
.kp-date { font-size: 1.3em; white-space: nowrap; }
.kp-foot { height: 5em; background: #F5F5F5; }
.kp-foot .kp-r { font-size: 1.5em; color: #52525B; }
.kp-iss { height: 29.3em; }
.kp-iss-h { display: flex; align-items: center; height: 4.5em; padding: 0 2.5em; }
.kp-empty { display: flex; flex-direction: column; align-items: center; margin-top: 5em; }
.kp-empty-ic { display: grid; place-items: center; width: 4.8em; height: 4.8em; border-radius: 50%; background: #F0F0F1; color: #3F3F46; }
.kp-empty-ic .am-ic { width: 2.2em; height: 2.2em; }
.kp-empty b { margin-top: 1.25em; font: 600 1.7em/1.2 var(--font-display); letter-spacing: -.01em; }

/* ── zamówienia ── */
.am-crumb { display: flex; align-items: center; gap: .7em; font-size: 1.6em; color: var(--am-muted); }
.am-crumb .am-ic { font-size: 1em; }
.am-or-head { display: flex; align-items: center; justify-content: space-between; margin-top: .8em; }
.am-or-head .am-h1 { font-size: 3.8em; }
.am-or-actions { display: flex; align-items: center; gap: 1.8em; }
.am-or-actions .am-btn { font-size: 1.65em; padding: .75em 1.1em; }
.am-or-actions > .am-ic { font-size: 2.6em; color: var(--am-blue); }
.am-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.6em; margin-top: 3.4em; }
.am-stat { padding: 2.4em 2.8em 0; overflow: hidden; }
.am-stat-l { font-size: 1.65em; color: var(--am-ink-2); }
.am-stat-v { font-family: var(--font-display); font-size: 4em; font-weight: 600; letter-spacing: -.02em; margin-top: .2em; }
.am-stat .am-spark { margin: .6em -2.8em 0; width: calc(100% + 5.6em); }
.am-tabs { display: flex; gap: .6em; width: fit-content; margin: 3em auto 0; padding: .7em; border-radius: 1.2em; border: 1px solid var(--am-line); background: var(--am-card); }
.am-tab { display: flex; align-items: center; gap: .6em; padding: .55em .9em; border-radius: .9em; font-size: 1.55em; color: var(--am-ink-2); white-space: nowrap; }
.am-tab.is-active { background: #2F3136; color: var(--am-blue); }
.am--light .am-tab.is-active { background: var(--am-blue-soft); }
.am-tab-n { font: 600 .68em/1 var(--font-mono); padding: .35em .5em; border-radius: .4em; border: 1px solid var(--am-line-2); color: var(--am-ink-2); }
.am-tab-n--blue { color: var(--am-blue); border-color: rgba(29, 143, 230, .6); background: rgba(29, 143, 230, .1); }
.am-tab-n--yellow { color: #FACC15; border-color: rgba(250, 204, 21, .5); background: rgba(250, 204, 21, .08); }
.am-tab-n--green { color: #4ADE80; border-color: rgba(74, 222, 128, .45); background: rgba(74, 222, 128, .08); }
.am-tab-n--red { color: #F87171; border-color: rgba(248, 113, 113, .45); background: rgba(248, 113, 113, .08); }
.am-table { margin-top: 3em; overflow: hidden; }
.am-tb-bar { display: flex; justify-content: flex-end; padding: 1.4em 3em; border-bottom: 1px solid var(--am-line); }
.am-tb-ghost { display: flex; align-items: center; gap: .6em; padding: .7em 1.1em; border-radius: .7em; border: 1px solid var(--am-line-2); font-size: 1.65em; color: var(--am-ink); }
.am-tb-ghost .am-ic { font-size: 1.1em; }
.am-tb-filters { display: flex; align-items: center; justify-content: space-between; gap: 2em; padding: 1.6em 3em; }
.am-select { display: flex; align-items: center; border: 1px solid var(--am-line-2); border-radius: .8em; overflow: hidden; font-size: 1.65em; height: 2.9em; }
.am-select span { padding: 0 1em; color: var(--am-muted); }
.am-select span + span { border-left: 1px solid var(--am-line-2); color: var(--am-ink); display: flex; align-items: center; gap: 5em; }
.am-select .am-ic { font-size: .9em; }
.am-tb-right { display: flex; align-items: center; gap: 2em; color: var(--am-ink-2); }
.am-tb-search { display: flex; align-items: center; gap: .8em; width: 17em; height: 2.9em; padding: 0 1em; border: 1px solid var(--am-line-2); border-radius: .8em; font-size: 1.65em; color: var(--am-muted); }
.am-tb-search .am-ic { font-size: 1.1em; }
.am-tb-right > .am-ic { font-size: 2.3em; }
.am-cols { --am-cols: 3.2em 9.4em 12.6em minmax(0, 1fr) 12.2em 15.6em 9.4em 10.2em; }
.am-thead, .am-row { display: grid; grid-template-columns: var(--am-cols); align-items: center; column-gap: 1.2em; padding: 0 3em; }
/* rozmiar pisma na komórkach, nie na wierszu - kolumny w em muszą liczyć się
   tak samo w nagłówku i w wierszach, inaczej się rozjeżdżają */
.am-thead { height: 4.6em; background: #2F3035; }
.am--light .am-thead { background: #F0F1F4; }
.am-thead > span { font: 600 1.15em/1 var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--am-muted); white-space: nowrap; }
.am-rows { position: relative; }
.am-row { height: 6.6em; border-top: 1px solid var(--am-line); font-size: 1em; }
.am-row.is-new { animation: am-new 1.8s ease-out; }
@keyframes am-new {
    0% { background: rgba(29, 143, 230, .28); clip-path: inset(0 0 100% 0); }
    18% { clip-path: inset(0 0 0 0); }
    100% { background: transparent; }
}
.am-check { width: 1.9em; height: 1.9em; border-radius: .45em; border: 1px solid var(--am-line-2); }
.am-no { font: 600 1.45em/1 var(--font-mono); color: var(--am-ink); letter-spacing: .02em; }
.am-ch { display: flex; align-items: center; gap: .9em; min-width: 0; }
.am .am-ch img, .am .am-dl img { width: 2.3em; height: 2.3em; border-radius: .6em; flex-shrink: 0; display: block; }
.am-ch span { font-size: 1.45em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-prod { display: flex; align-items: center; gap: 1.2em; min-width: 0; }
.am-thumb { width: 4em; height: 4em; border-radius: .8em; flex-shrink: 0; background: var(--am-thumb, linear-gradient(135deg, #5B6170, #2F333B)); position: relative; overflow: hidden; }
.am-thumb::after { content: ''; position: absolute; inset: 22% 22%; border-radius: .35em; background: rgba(255, 255, 255, .22); }
.am-prod-t { font-size: 1.45em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--am-ink); }
.am-prod-s { font: 500 1.15em/1.3 var(--font-mono); color: var(--am-muted); margin-top: .25em; }
.am-prod > div { min-width: 0; }
.am-tag { display: inline-block; margin-left: .8em; font: 500 .9em/1 var(--font-sans); padding: .25em .55em; border-radius: .45em; border: 1px solid var(--am-line-2); color: var(--am-ink-2); vertical-align: 1px; }
.am-status { justify-self: start; white-space: nowrap; display: inline-flex; align-items: center; gap: .5em; font-size: 1.3em; font-weight: 600; padding: .35em .75em; border-radius: .6em; }
.am-status::before { content: ''; width: .55em; height: .55em; border-radius: 50%; background: currentColor; }
.am-status--ship { color: #4ADE80; background: rgba(74, 222, 128, .1); }
.am-status--pack { color: #60A5FA; background: rgba(96, 165, 250, .12); }
.am-status--wait { color: #FACC15; background: rgba(250, 204, 21, .1); }
.am--light .am-status--ship { color: #15803D; background: #DCFCE7; }
.am--light .am-status--pack { color: #1D4ED8; background: #DBEAFE; }
.am--light .am-status--wait { color: #A16207; background: #FEF9C3; }
.am-dl { display: flex; align-items: center; gap: .8em; min-width: 0; }
.am-dl span { font-size: 1.35em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--am-ink-2); }
.am-flag { width: 2em; height: 1.35em; border-radius: .25em; flex-shrink: 0; box-shadow: 0 0 0 1px rgba(0,0,0,.18); }
.am-flag--pl { background: linear-gradient(#fff 50%, #DC143C 50%); }
.am-flag--de { background: linear-gradient(#111 33.3%, #DD0000 33.3% 66.6%, #FFCE00 66.6%); }
.am-flag--fr { background: linear-gradient(90deg, #0055A4 33.3%, #fff 33.3% 66.6%, #EF4135 66.6%); }
.am-flag--cz { background: linear-gradient(#fff 50%, #D7141A 50%); position: relative; overflow: hidden; }
.am-flag--cz::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 55%; background: #11457E; clip-path: polygon(0 0, 100% 50%, 0 100%); }
.am-flag--ro { background: linear-gradient(90deg, #002B7F 33.3%, #FCD116 33.3% 66.6%, #CE1126 66.6%); }
.am-sum { font-size: 1.5em; font-weight: 600; text-align: right; white-space: nowrap; color: var(--am-ink); }
.am-date { font-size: 1.35em; color: var(--am-muted); white-space: nowrap; }

/* ── magazyn ── */
.am-stat--flat { padding-bottom: 2.4em; }
.am-warn { color: #D97706; }
.am-r { text-align: right; justify-self: end; }
.am-stock-cols { --am-cols: minmax(0, 1fr) 8em 9em 10em 10.5em 10.5em 10.5em 10.5em; }
.am-ch-h { display: inline-flex; align-items: center; gap: .5em; }
.am .am-ch-h img { width: 1.7em; height: 1.7em; border-radius: .4em; }
.am-qty { font: 600 1.55em/1 var(--font-sans); font-variant-numeric: tabular-nums; color: var(--am-ink); padding: .35em .5em; border-radius: .45em; }
.am-qty--low { color: #D97706; }
.am-qty--res { color: var(--am-muted); }
.am-qty.is-flash { animation: am-flash 1.4s ease-out; }
@keyframes am-flash { 0%, 30% { background: rgba(22, 163, 74, .2); color: #15803D; } 100% { background: transparent; } }
.am-main { position: relative; }
.am-toast {
    position: absolute; top: 2.6em; right: 3.2em; display: flex; align-items: center; gap: 1em; padding: 1.1em 1.6em 1.1em 1.1em;
    background: #fff; border: 1px solid var(--am-line); border-radius: 1.1em; box-shadow: 0 1.6em 3.2em -1.6em rgba(15, 23, 42, .35);
    opacity: 0; transform: translateY(-1em); transition: opacity .4s ease, transform .5s cubic-bezier(.16,1,.3,1);
}
.am-toast.is-show { opacity: 1; transform: none; }
.am .am-toast img { width: 2.8em; height: 2.8em; border-radius: .7em; }
.am-toast b { display: block; font-size: 1.45em; }
.am-toast span { display: block; font-size: 1.25em; color: var(--am-muted); }

/* ── wiadomości ── */
.am-msg-main { display: grid; grid-template-columns: 31em minmax(0, 1fr) 31em; gap: 2em; align-items: start; }
.am-msg-list { padding: 1.2em 0; }
.am-msg-list-h { display: flex; align-items: center; justify-content: space-between; padding: .4em 1.8em 1.2em; font-size: 1.6em; font-weight: 600; }
.am-msg-list-h .am-badge { font-size: .7em; }
.am-thread { position: relative; display: grid; grid-template-columns: 3em minmax(0, 1fr) auto; gap: 1.1em; align-items: center; padding: 1.2em 1.8em; border-top: 1px solid var(--am-line); }
.am-thread.is-active { background: var(--am-blue-soft); box-shadow: inset .25em 0 0 var(--am-blue); }
.am .am-thread img { width: 2.8em; height: 2.8em; border-radius: .7em; }
.am-thread-txt { min-width: 0; }
.am-thread-txt b { display: block; font-size: 1.4em; }
.am-thread-txt span { display: block; font-size: 1.25em; color: var(--am-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-thread-time { font-size: 1.15em; color: var(--am-muted); align-self: start; }
.am-thread-dot { position: absolute; right: 1.8em; bottom: 1.4em; width: .8em; height: .8em; border-radius: 50%; background: var(--am-blue); }
.am-conv { display: flex; flex-direction: column; min-height: 52em; }
.am-conv-h { display: flex; flex-direction: column; gap: .2em; padding: 1.8em 2.2em; border-bottom: 1px solid var(--am-line); }
.am-conv-h b { font-size: 1.7em; }
.am-conv-h span { font-size: 1.3em; }
.am-bubbles { flex: 1; display: flex; flex-direction: column; gap: 1.4em; padding: 2.2em; }
.am-bubble { max-width: 78%; padding: 1.1em 1.4em; border-radius: 1.2em 1.2em 1.2em .3em; background: #F1F2F5; }
.am-bubble p { font-size: 1.45em; line-height: 1.45; }
.am-bubble time { display: block; margin-top: .4em; font-size: 1.1em; color: var(--am-muted); }
.am-bubble--me { align-self: flex-end; background: var(--am-blue); color: #fff; border-radius: 1.2em 1.2em .3em 1.2em; }
.am-bubble--me time { color: rgba(255, 255, 255, .75); }
.am-bubble--new { opacity: 0; transform: translateY(1em) scale(.97); transition: opacity .45s ease, transform .5s cubic-bezier(.16,1,.3,1); }
.am-bubble--new.is-show { opacity: 1; transform: none; }
.am-compose { display: flex; align-items: center; justify-content: space-between; gap: 1em; margin: 0 2.2em 2.2em; padding: .8em .8em .8em 1.4em; border: 1px solid var(--am-line-2); border-radius: 1em; }
.am-compose > span:first-child { font-size: 1.4em; color: var(--am-muted); }
.am-compose .am-btn { font-size: 1.35em; }
.am-order-card { padding: 2em; }
.am-oc-h { font-size: 1.6em; margin-bottom: 1.1em; }
.am-oc-prod { display: flex; align-items: center; gap: 1.2em; padding-bottom: 1.6em; border-bottom: 1px solid var(--am-line); min-width: 0; }
.am-oc-prod > div { min-width: 0; }
.am-oc-facts { margin: 1.2em 0 0; }
.am-oc-facts > div { display: flex; align-items: center; justify-content: space-between; gap: 1em; padding: .9em 0; border-bottom: 1px solid var(--am-line); }
.am-oc-facts > div:last-child { border-bottom: 0; }
.am-oc-facts dt { font-size: 1.3em; color: var(--am-muted); }
.am-oc-facts dd { margin: 0; font-size: 1.35em; text-align: right; }
.am-oc-facts dd .am-status { font-size: .95em; }
.am-oc-dl { display: inline-flex; align-items: center; gap: .5em; }
.am .am-oc-dl img { width: 1.4em; height: 1.4em; border-radius: .35em; }
.am-mono { font-family: var(--font-mono); letter-spacing: .02em; }
/* wyróżnienie przy przybliżeniu: spokojna niebieska poświata, zapala się raz i stoi
   (pulsowanie „zamykało się” nienaturalnie - właściciel 14.09.2026) */
[data-am-spot].is-spot, .is-spot { position: relative; z-index: 2; box-shadow: 0 0 0 .14em rgba(108, 203, 255, .9), 0 0 1.2em rgba(19, 164, 236, .28), 0 2em 4em -2em rgba(15, 23, 42, .3); animation: am-spot .8s ease both; }
/* wyróżnienie przy przybliżeniu świeci niebieskim jak w aplikacji, zamiast zielonej obwódki */
@keyframes am-spot { from { box-shadow: 0 0 0 0 rgba(108, 203, 255, 0), 0 0 0 rgba(19, 164, 236, 0), 0 2em 4em -2em rgba(15, 23, 42, 0); } }

/* ── marża ── */
.am-mg-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 2.4em; margin-top: 3em; align-items: start; }
.am-mg-left, .am-mg-right { padding: 2.4em 2.6em; }
.am-mg-prod { margin-top: 1.4em; }
.am-mg-lines { display: flex; flex-direction: column; gap: 1.5em; margin-top: 1.8em; }
.am-mg-row { display: flex; justify-content: space-between; gap: 1em; font-size: 1.45em; }
.am-mg-row b { font-weight: 600; }
.am-mg-line--cost .am-mg-row b { color: var(--am-red); }
.am-mg-bar { display: block; height: .8em; margin-top: .6em; border-radius: 1em; background: #EEF0F3; overflow: hidden; }
.am-mg-bar i { display: block; height: 100%; width: var(--am-bar); border-radius: inherit; background: var(--am-blue); transform-origin: left center; }
.am-mg-line--cost .am-mg-bar i { background: #F59E8B; }
.js .am--margin:not(.is-played) .am-mg-bar i { transform: scaleX(0); }
.am--margin .am-mg-bar i { transition: transform .9s cubic-bezier(.16,1,.3,1) var(--am-delay, 0s); }
.am-mg-total { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: .2em 1em; margin-top: 2.4em; padding: 1.8em 2em; border-radius: 1.2em; background: #EAF7EF; border: 1px solid #BFE3CD; }
.am-mg-total span { font-size: 1.5em; font-weight: 600; color: #166534; }
.am-mg-total b { grid-row: span 2; font-family: var(--font-display); font-size: 3.4em; font-weight: 600; color: #15803D; letter-spacing: -.02em; }
.am-mg-total em { font-style: normal; font-size: 1.3em; }

/* ── automatyzacje: edytor przepływu ── */
.am-wf-grid { display: grid; grid-template-columns: minmax(0, 1fr) 24em; gap: 2em; margin-top: 3em; }
.am-wf-canvas {
    position: relative; aspect-ratio: 1000 / 600; overflow: hidden;
    background-color: #FBFDFF; background-image: radial-gradient(#A9D8F5 .09em, transparent .12em); background-size: 1.5em 1.5em;
}
.am-wf-lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.am-wf-line { fill: none; stroke: #B9C6D3; stroke-width: 1.6; vector-effect: non-scaling-stroke; }
/* droga zamówienia zapala się po kolei: jasny rdzeń i delikatna poświata */
.am-wf-glow {
    fill: none; stroke: #2BB0F0; stroke-width: 2.4; stroke-linecap: round; vector-effect: non-scaling-stroke;
    stroke-dasharray: 1; stroke-dashoffset: 1; filter: drop-shadow(0 0 2px rgba(19, 164, 236, .55));
    transition: stroke-dashoffset .7s cubic-bezier(.65, 0, .35, 1) var(--am-wf-delay, 0s);
}
.am--wf.is-played .am-wf-glow { stroke-dashoffset: 0; }
.am-wf-node {
    position: absolute; width: 19%; min-height: 18%; padding: 1.1em 1.2em; border-radius: .9em;
    background: #fff; border: 1px solid var(--am-line-2); box-shadow: 0 .8em 1.8em -1.2em rgba(15, 23, 42, .3);
    transition: border-color .4s ease var(--am-wf-delay, 0s), box-shadow .4s ease var(--am-wf-delay, 0s);
}
.am--wf.is-played .am-wf-node:not(.is-idle) { border-color: #7CCBF3; box-shadow: 0 0 0 .1em rgba(124, 203, 243, .35), 0 .8em 1.8em -1.2em rgba(15, 23, 42, .3); }
.am-wf-node.is-idle { opacity: .75; }
.am-wf-handle { position: absolute; top: 50%; width: .9em; height: .9em; margin-top: -.45em; border-radius: 50%; background: #fff; border: 1px solid #9FB0C0; }
.am-wf-handle--in { left: -.5em; }
.am-wf-handle--out { right: -.5em; }
.am-wf-node--trigger .am-wf-handle--in, .am-wf-node--doc .am-wf-handle--out { display: none; }
.am-wf-kind { display: flex; align-items: center; gap: .5em; font: 600 1em/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--am-muted); }
.am-wf-kind .am-ic { font-size: 1.5em; color: var(--am-blue); }
.am-wf-node--trigger .am-wf-kind .am-ic { color: #D97706; }
.am-wf-title { margin-top: .6em; font-size: 1.5em; font-weight: 600; color: var(--am-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-wf-sub { margin-top: .3em; font-size: 1.15em; color: var(--am-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-wf-ok {
    position: absolute; top: -.7em; right: -.7em; display: grid; place-items: center; width: 2em; height: 2em; border-radius: 50%;
    background: #16A34A; color: #fff; opacity: 0; transform: scale(.6); transition: opacity .3s ease calc(var(--am-wf-delay, 0s) + .2s), transform .35s cubic-bezier(.34, 1.56, .64, 1) calc(var(--am-wf-delay, 0s) + .2s);
}
.am-wf-ok .am-ic { font-size: 1.3em; stroke-width: 2.4; }
.am--wf.is-played .am-wf-ok { opacity: 1; transform: none; }
.am-wf-focus { position: absolute; left: 25%; top: 8%; width: 73%; height: 58%; border-radius: 1em; pointer-events: none; }
.am-wf-focus.is-spot { box-shadow: none; animation: none; }
.am-wf-zoom { position: absolute; left: 1.4em; bottom: 1.4em; display: grid; gap: .3em; }
.am-wf-zoom span { display: grid; place-items: center; width: 2.6em; height: 2.6em; border-radius: .5em; background: #fff; border: 1px solid var(--am-line); font-size: 1.1em; color: var(--am-ink-2); }
.am-wf-runs { padding: 2em 1.8em; }
.am-wf-run { display: grid; grid-template-columns: auto 1fr; gap: .35em 1em; padding: 1.3em 0; border-top: 1px solid var(--am-line); font-size: 1.25em; }
.am-wf-runs .am-sec-t + .am-wf-run { margin-top: 1.2em; }
.am-wf-run b { font-family: var(--font-mono); font-weight: 600; color: var(--am-ink); }
.am-wf-run span { grid-column: 1 / -1; color: var(--am-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am-wf-run em { justify-self: end; font-style: normal; font-size: .9em; color: #16A34A; }
.am-wf-run--new { max-height: 0; padding-block: 0; border-top-color: transparent; opacity: 0; overflow: hidden; transition: max-height .5s ease 1.6s, padding .5s ease 1.6s, opacity .4s ease 1.9s, border-color .4s ease 1.6s; }
.am-wf-run--new.is-show { max-height: 8em; padding-block: 1.3em; border-top-color: var(--am-line); opacity: 1; }

/* ewidencja OSS */
.am-oss-cols { --am-cols: minmax(0, 1fr) 15em 9em 13em 12em; }
.am-oss-period { font-size: 1.45em; font-weight: 600; padding: .55em .9em; border-radius: .7em; border: 1px solid var(--am-line-2); background: var(--am-card); color: var(--am-ink-2); }
.am--oss .am-or-actions { display: flex; align-items: center; gap: 1.2em; }
.am--oss .am-or-actions .am-btn { font-size: 1.45em; }
/* rozmiar pisma na komórkach, nie na wierszu - kolumny w em muszą zgadzać się z nagłówkiem */
.am-oss-table .am-row { height: 6.6em; }
.am-oss-table .am-row > span { font-size: 1.45em; }
.am-oss-country { display: flex; align-items: center; gap: .8em; color: var(--am-ink); }
.am-oss-code { font: 600 .8em/1 var(--font-mono); padding: .45em .5em; border-radius: .4em; background: var(--am-blue-soft); color: var(--am-blue); letter-spacing: .04em; }
.am-oss-rate { font: 500 .9em/1 var(--font-mono); padding: .35em .5em; border-radius: .4em; background: #F0F1F4; color: var(--am-ink-2); }
.am-oss-vat { font-weight: 600; color: var(--am-ink); }
.am--oss .am-toast { top: 15em; }
.am-oss-sum { background: #F7F8FA; font-weight: 600; color: var(--am-ink); }
.am--oss.is-played .am-oss-sum { animation: am-oss-ready 1.6s ease .6s both; }
@keyframes am-oss-ready { 0% { background: #F7F8FA; } 35% { background: #E3F4E8; } 100% { background: #F7F8FA; } }

/* węższe okno (telefon, tablet): bez menu bocznego i kilku kolumn, większa skala */
@container (max-width: 820px) {
    .am--orders .am-screen, .am--stock .am-screen, .am--msg .am-screen, .am--margin .am-screen, .am--oss .am-screen, .am--wf .am-screen { --am-w: 86; }
    :is(.am--orders, .am--stock, .am--msg, .am--margin, .am--oss, .am--wf) :is(.am-side, .am-search, .am-top-tools .am-tool:not(:last-of-type)) { display: none; }
    :is(.am--orders, .am--stock, .am--msg, .am--margin, .am--oss, .am--wf) .am-top { grid-template-columns: 1fr auto; }
    :is(.am--orders, .am--stock, .am--msg, .am--margin, .am--oss, .am--wf) .am-body { grid-template-columns: minmax(0, 1fr); }
    :is(.am--orders, .am--stock, .am--msg, .am--margin, .am--oss, .am--wf) .am-main { border-radius: 0; border-left: 0; padding: 2.4em 2.2em; }
    .am--orders .am-cols { --am-cols: 10em minmax(0, 1fr) 12.6em 9.6em; }
    .am-stock-cols { --am-cols: minmax(0, 1fr) 8em 9.5em 9.5em; }
    :is(.am--orders, .am--stock, .am--oss) .am-col-x { display: none; }
    :is(.am--orders, .am--stock, .am--oss) :is(.am-thead, .am-row) { padding: 0 2em; }
    .am-oss-cols { --am-cols: minmax(0, 1fr) 14em 8em 12em; }
    .am-wf-grid { grid-template-columns: minmax(0, 1fr); }
    .am-wf-runs { display: none; }
    .am--wf .am-or-actions .am-btn:first-child { display: none; }
    .am--oss .am-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4em; }
    .am--oss .am-stat:last-child { display: none; }
    .am--oss .am-stat { padding: 1.8em; }
    .am--oss .am-stat-v { font-size: 3.2em; }
    .am--oss .am-oss-period { display: none; }
    :is(.am--orders, .am--stock) .am-stats { gap: 1.4em; }
    :is(.am--orders, .am--stock) .am-stat { padding: 1.8em 1.8em 0; }
    .am--stock .am-stat--flat { padding-bottom: 1.8em; }
    .am--orders .am-stat .am-spark { margin: .6em -1.8em 0; width: calc(100% + 3.6em); }
    :is(.am--orders, .am--stock) .am-stat-v { font-size: 3.2em; }
    .am--orders :is(.am-tabs, .am-tb-filters, .am-tb-bar) { display: none; }
    :is(.am--orders, .am--stock) .am-table { margin-top: 2.4em; }
    .am-msg-main { grid-template-columns: minmax(0, 1fr); }
    .am-msg-list { display: none; }
    .am-conv { min-height: 0; }
    .am-mg-grid { grid-template-columns: minmax(0, 1fr); }
    .am-mg-left { display: none; }
    .am-toast { right: 2em; top: 2em; }
}
/* telefon (kadr ok. 350 px): przy --am-w 86 tekst tabel miał 4-6 px i makieta czytała
   się jak szum (przegląd 16.09.2026). Skala o jedną trzecią większa; układ z bloku
   wyżej zostaje, a to, co nie mieści się na dole kadru, przycina scena. */
@container (max-width: 480px) {
    .am--orders .am-screen, .am--stock .am-screen, .am--msg .am-screen, .am--margin .am-screen, .am--oss .am-screen, .am--wf .am-screen { --am-w: 66; }
}
@media (prefers-reduced-motion: reduce) {
    .am-progress-fill, .am-toast, .am-bubble--new, .am--margin .am-mg-bar i { transition: none; }
    .am-row.is-new, .am-qty.is-flash, .is-spot, .am--oss.is-played .am-oss-sum, .am-chs-bar i { animation: none; }
    .am-wf-glow, .am-wf-node, .am-wf-ok, .am-wf-run--new { transition: none; }
}

/* ── Panel 1:1 z demo.sellero.test (26.09.2026, właściciel: „przeanalizuj system, style, fonty,
   paddingi i przenieś 1:1 piksel w piksel, animacje powiększenia zostaw”). Pomiary z listy
   zamówień przy oknie 1440 px; --am-w: 144, więc 1em = 10 px panelu i każda liczba poniżej to
   piksele z panelu podzielone przez 10. Kolory to dokładne wartości z panelu (oklch, paleta
   zinc + niebieski tenanta demo). Fonty jak w panelu: Inter (tekst), Sora (nagłówki, menu,
   liczby), JetBrains Mono (nagłówki tabel, liczniki, tagi). Kokpit ma własny zestaw kp-*. */
.am--light {
    --am-chrome: #fff; --am-bg: oklch(0.985 0 89.876); --am-card: #fff;
    --am-line: oklch(0.932 0.005 286.295); --am-line-2: oklch(0.877 0.005 286.287);
    --am-ink: oklch(0.219 0.006 285.911); --am-ink-2: oklch(0.37 0.012 285.805);
    --am-muted: oklch(0.502 0.013 285.939); --am-muted-2: oklch(0.64 0.013 286.018);
    --am-blue: oklch(0.546 0.245 262.881); --am-blue-2: oklch(0.546 0.245 262.881); --am-blue-700: oklch(0.488 0.243 264.376);
    --am-blue-soft: oklch(0.97 0.014 254.604); --am-blue-100: oklch(0.932 0.032 255.585);
    --am-head-bg: oklch(0.967 0.001 286.375);
}
.am--light .am-screen { font-family: 'Inter', var(--font-sans); line-height: 1.43; color: var(--am-ink); }
.am--light .am-h1, .am--light .am-side-label, .am--light .am-side-group, .am--light .am-stat-v { font-family: 'Sora', var(--font-display); }

/* górny pasek: 64 px, logo 145×64 od x=56, wyszukiwarka 413×36 */
.am--light .am-top { height: 6.4em; padding: 0 1.6em 0 2em; grid-template-columns: 1fr 41.3em 1fr; }
.am--light .am-brand { gap: 0; }
.am--light .am-back { font-size: 2.4em; width: 1.5em; color: var(--am-muted); }
.am--light .am .am-brand img, .am--light .am-brand img { height: 6.4em; }
.am--light .am-search { width: 41.3em; height: 3.6em; padding: 0 1.2em; gap: .8em; border: 0; border-radius: .6em; box-shadow: 0 0 0 1px var(--am-line-2); color: var(--am-muted-2); }
.am--light .am-search .am-ic { font-size: 2em; }
.am--light .am-search span { font-size: 1.4em; }
.am--light .am-search kbd { font-size: 1.1em; }
.am--light .am-top-tools { gap: .2em; color: var(--am-muted); }
.am--light .am-tool { font-size: 2.4em; width: 1.5em; height: 1.5em; place-items: center; }
.am--light .am-tool--dot::after { display: none; }
.am--light .am-tool-count { top: -.2em; right: -.1em; font-size: .45em; font-weight: 500; padding: .15em .35em; border: 0; border-radius: .35em; box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--am-blue) 10%, transparent); }
.am--light .am-avatar { width: 2.286em; height: 2.286em; font-size: 1.4em; font-weight: 600; margin-left: .7em; background: var(--am-blue); }
.am--light .am-top-tools { gap: .2em; }

/* menu boczne: 260 px, pozycje 228×40 od x=16, ikona 24 px, etykieta Sora 14/500 */
.am--light .am-body { grid-template-columns: 26em minmax(0, 1fr); }
.am--light .am-side { padding: 3.2em 1.6em; }
.am--light .am-side-item { height: 4em; padding: 0 .8em; gap: 1.2em; margin-bottom: .4em; border-radius: .6em; box-shadow: none; }
.am--light .am-side-item::before { display: none; }
.am--light .am-side-item .am-ic { font-size: 2.4em; color: var(--am-muted-2); }
.am--light .am-side-label { font-size: 1.4em; font-weight: 500; line-height: 1.43; color: var(--am-ink-2); }
.am--light .am-side-item.is-active { background: var(--am-blue-100); box-shadow: none; }
.am--light .am-side-item.is-active .am-ic { color: var(--am-blue); }
.am--light .am-side-item.is-active .am-side-label { color: var(--am-blue-700); }
.am--light .am-side-group { margin: 2.4em .8em .8em; font-size: 1.4em; font-weight: 500; color: var(--am-muted); }
.am--light .am-side-item:nth-child(2) + .am-side-group { margin-top: 2.4em; }
.am--light .am-badge { font: 500 1.1em/1.333 'JetBrains Mono', var(--font-mono); padding: .364em .727em; border: 0; border-radius: .364em; color: var(--am-blue); background: var(--am-blue-soft); box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--am-blue) 10%, transparent); }
.am--light .am-badge--warn { color: oklch(0.555 0.163 48.998); background: oklch(0.987 0.022 95.277); box-shadow: inset 0 0 0 1px color-mix(in oklch, oklch(0.666 0.179 58.318) 10%, transparent); }

/* obszar główny: tło #fafafa, odstęp 24 px, okruszki 14 px, nagłówek Sora 30/36 */
.am--light .am-main { padding: 3.2em 2.4em 3.2em; border-top-left-radius: 1.2em; border-color: var(--am-line); }
.am--light .am-crumb { font-size: 1.4em; font-weight: 500; color: var(--am-muted); gap: .6em; }
.am--light .am-crumb .am-ic { font-size: 1.15em; color: var(--am-muted-2); }
.am--light .am-or-head { margin-top: .8em; }
.am--light .am-or-head .am-h1 { font-size: 3em; line-height: 1.2; font-weight: 600; letter-spacing: -.025em; }
.am--light .am-or-actions { gap: 1.6em; }
.am--light .am-or-actions .am-btn { font-size: 1.4em; font-weight: 500; padding: .571em .857em; gap: .43em; border-radius: .43em; background: var(--am-blue); box-shadow: none; }
.am--light .am-or-actions > .am-ic { font-size: 2.4em; color: var(--am-muted); }

/* karty statystyk 361×112, odstęp 24, ramka = pierścień 1 px zinc-200 */
.am--light .am-card { border: 0; border-radius: .8em; box-shadow: 0 0 0 1px var(--am-line); }
.am--light .am-stats { gap: 2.4em; margin-top: 3.2em; }
.am--light .am-stat { position: relative; padding: 2.4em; }
.am--light .am-stat-l { font-size: 1.4em; font-weight: 500; color: var(--am-muted); }
.am--light .am-stat-v { font-size: 3em; line-height: 1.2; font-weight: 600; letter-spacing: -.025em; margin-top: .267em; }
/* wykres jak w widżecie Filamenta: przyklejony do dolnej krawędzi karty, nie dokłada wysokości */
.am--light .am-stat .am-spark { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; width: 100%; height: 2.4em; }

/* zakładki: biała listwa z odstępem 8, pozycje 36 px, 14/500, liczniki JetBrains 11 */
.am--light .am-tabs { margin-top: 3.2em; padding: .8em; gap: .8em; border: 0; border-radius: .8em; background: #fff; box-shadow: 0 0 0 1px var(--am-line); }
.am--light .am-tab { height: 3.6em; padding: 0 1.2em; gap: .8em; border-radius: .6em; font-size: 1em; color: var(--am-muted); }
.am--light .am-tab { font-size: 1.4em; font-weight: 500; height: 2.571em; padding: 0 .857em; gap: .571em; border-radius: .43em; }
.am--light .am-tab.is-active { background: var(--am-bg); color: var(--am-blue-700); box-shadow: none; }
.am--light .am-tab-n { font: 500 .786em/1.333 'JetBrains Mono', var(--font-mono); letter-spacing: -.025em; padding: .18em .545em; border: 0; border-radius: .364em; color: oklch(0.442 0.015 285.786); background: var(--am-bg); box-shadow: inset 0 0 0 1px color-mix(in oklch, oklch(0.442 0.015 285.786) 10%, transparent); }
.am--light .am-tab-n--blue { color: var(--am-blue); background: var(--am-blue-soft); box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--am-blue) 10%, transparent); }
.am--light .am-tab-n--yellow { color: oklch(0.555 0.163 48.998); background: oklch(0.987 0.022 95.277); box-shadow: inset 0 0 0 1px color-mix(in oklch, oklch(0.666 0.179 58.318) 10%, transparent); }
.am--light .am-tab-n--green { color: oklch(0.527 0.123 155.01); background: oklch(0.968 0.012 157.003); box-shadow: inset 0 0 0 1px color-mix(in oklch, oklch(0.527 0.123 155.01) 10%, transparent); }
.am--light .am-tab-n--red { color: oklch(0.562 0.162 27.968); background: oklch(0.971 0.009 27.968); box-shadow: inset 0 0 0 1px color-mix(in oklch, oklch(0.562 0.162 27.968) 10%, transparent); }

/* tabela: nagłówek 57 (Eksport), pasek narzędzi 61, nagłówki kolumn 53 na zinc-100, wiersze 81 */
.am--light .am-table { margin-top: 2.4em; border-radius: .8em; }
.am--light .am-tb-bar { padding: 1.05em 2.4em; border-bottom: 1px solid var(--am-line); }
.am--light .am-tb-ghost { font-size: 1.4em; font-weight: 500; height: 2.571em; padding: 0 .857em; gap: .43em; border: 0; border-radius: .43em; color: var(--am-ink); box-shadow: 0 0 0 1px color-mix(in oklch, var(--am-ink) 10%, transparent); }
.am--light .am-tb-filters { padding: 1.2em 2.4em; border-bottom: 0; }
.am--light .am-select { height: 3.6em; width: 28em; font-size: 1em; border: 0; border-radius: .6em; box-shadow: 0 0 0 1px color-mix(in oklch, var(--am-ink) 10%, transparent); }
.am--light .am-select span { font-size: 1.4em; padding: 0 .857em; color: var(--am-muted); }
.am--light .am-select span + span { flex: 1; display: flex; align-items: center; justify-content: space-between; color: var(--am-ink); border-left-color: var(--am-line-2); }
.am--light .am-tb-right { gap: 1.6em; color: var(--am-muted-2); }
.am--light .am-tb-search { width: 21.1em; height: 3.6em; padding: 0 1.2em; gap: .8em; font-size: 1em; border: 0; border-radius: .6em; box-shadow: 0 0 0 1px color-mix(in oklch, var(--am-ink) 10%, transparent); color: var(--am-muted-2); }
.am--light .am-tb-search .am-ic { font-size: 2em; }
.am--light .am-tb-right > .am-ic { font-size: 2em; }
.am--light .am-cols { --am-cols: 5.2em 9em 10.8em minmax(0, 1fr) 13em 18em 11em 13em; }
.am--light .am-thead, .am--light .am-row { column-gap: 0; padding: 0; }
.am--light .am-thead { height: 5.3em; background: var(--am-head-bg); }
.am--light .am-thead > span { font: 500 1.1em/1.43 'JetBrains Mono', var(--font-mono); letter-spacing: .16em; color: var(--am-muted); padding: 0 1.09em; }
.am--light .am-thead > span:first-child { padding-left: 2.18em; }
.am--light .am-row { height: 8.1em; border-top: 1px solid var(--am-line); }
.am--light .am-row > * { padding: 0 1.2em; }
.am--light .am-check { width: 1.6em; height: 1.6em; margin-left: 1.2em; padding: 0; border: 0; border-radius: .4em; background: #fff; box-shadow: 0 0 0 1px color-mix(in oklch, var(--am-ink) 10%, transparent), 0 .1em .3em rgba(0, 0, 0, .1); }
.am--light .am-row > .am-check { margin-left: 2.4em; }
.am--light .am-no { font: 400 1.4em/1.71 'Inter', var(--font-sans); letter-spacing: 0; color: var(--am-ink); padding: 0 .857em; }
.am--light .am-ch span { font-size: 1.2em; line-height: 2; color: var(--am-ink); }
.am--light .am .am-ch img, .am--light .am-ch img { width: 1.8em; height: 1.8em; border-radius: .3em; }
.am--light .am-prod { gap: 1.2em; }
.am--light .am-thumb { width: 3.2em; height: 3.2em; border-radius: .6em; box-shadow: 0 0 0 1px #fff; }
.am--light .am-prod-t { font-size: 1.4em; line-height: 1.43; color: var(--am-ink); }
.am--light .am-prod-s { font: 500 1.1em/1.45 'JetBrains Mono', var(--font-mono); color: var(--am-muted); }
.am--light .am-tag { font: 500 1em/1.333 'JetBrains Mono', var(--font-mono); padding: .18em .545em; border: 0; border-radius: .364em; color: var(--am-blue); background: var(--am-blue-soft); box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--am-blue) 10%, transparent); }
/* status: odznaka panelu (JetBrains 11/500, zaokrąglenie 4, pierścień 10%) */
.am--light .am-status { font: 500 1.1em/1.333 'JetBrains Mono', var(--font-mono); letter-spacing: -.025em; padding: .364em .727em; border-radius: .364em; margin-left: 1.09em; }
.am--light .am-status::before { width: .5em; height: .5em; }
.am--light .am-status--ship { color: oklch(0.527 0.123 155.01); background: oklch(0.968 0.012 157.003); box-shadow: inset 0 0 0 1px color-mix(in oklch, oklch(0.527 0.123 155.01) 10%, transparent); }
.am--light .am-status--pack { color: var(--am-blue); background: var(--am-blue-soft); box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--am-blue) 10%, transparent); }
.am--light .am-status--wait { color: oklch(0.555 0.163 48.998); background: oklch(0.987 0.022 95.277); box-shadow: inset 0 0 0 1px color-mix(in oklch, oklch(0.666 0.179 58.318) 10%, transparent); }
.am--light .am-dl span { font-size: 1.4em; color: var(--am-ink-2); }
.am--light .am-flag { width: 2.1em; height: 1.4em; border-radius: .2em; }
.am--light .am .am-dl img, .am--light .am-dl img { width: 1.8em; height: 1.8em; border-radius: .3em; }
.am--light .am-sum { font-size: 1.4em; line-height: 1.71; font-weight: 600; color: var(--am-ink); }
.am--light .am-date { font-size: 1.2em; line-height: 1.333; color: var(--am-ink); }

/* ── Pozostałe widoki 1:1 z demo.sellero.test (26.09.2026, właściciel: „tak samo jak lista
   zamówień - odwzoruj realny stan pozostałych zakładek”). Ta sama skala: 1em = 10 px panelu
   przy oknie 1440 px. Wspólne: karta sekcji Filamenta (pierścień 1 px, zaokrąglenie 8,
   nagłówek Sora 16/600), blok filtrów, pola 36 px, odznaki JetBrains 11. ── */
.am--light .am-btn--light { background: oklch(0.623 0.214 259.815); }
.am--light .am-or-actions .am-btn .am-ic { font-size: 1.15em; }
.am--light .am-flt-l { display: block; font-size: 1.4em; font-weight: 500; line-height: 1.43; color: var(--am-ink); }
.am--light .am-flt-in { display: flex; align-items: center; justify-content: space-between; height: 2.571em; margin-top: .571em; padding: 0 .857em; font-size: 1.4em; color: var(--am-muted-2); border-radius: .43em; background: #fff; box-shadow: 0 0 0 1px color-mix(in oklch, var(--am-ink) 10%, transparent); }
.am--light .am-flt-in--sel { color: var(--am-muted-2); }
.am--light .am-flt-in .am-ic { font-size: 1.15em; color: var(--am-muted-2); }
.am--light .am-flt-in:not(.am-flt-in--sel) { color: var(--am-ink); }
.am--light .am-sec-card { overflow: hidden; }
.am--light .am-sec-card-h { display: flex; align-items: center; justify-content: space-between; padding: 1.6em 2.4em; border-bottom: 1px solid var(--am-line); }
.am--light .am-sec-card-h b { font: 600 1.6em/1.5 'Sora', var(--font-display); letter-spacing: -.025em; color: var(--am-ink); }
.am--light .am-sec-card-h .am-ic { font-size: 2em; color: var(--am-blue); }
.am--light .am-sec-card-b { padding: 2.4em; }
.am--light .am-check { display: block; }

/* magazyn: filtry 16/24, trzy pola po 345 z odstępem 24, dwupiętrowy nagłówek, wiersze 57 */
.am--light .am-st-table { margin-top: 3.2em; }
.am--light .am-flt { padding: 1.6em 2.4em 2.4em; border-bottom: 1px solid var(--am-line); }
.am--light .am-flt-h { display: flex; align-items: center; justify-content: space-between; }
.am--light .am-flt-h b { font: 600 1.6em/1.5 'Sora', var(--font-display); letter-spacing: -.025em; }
.am--light .am-flt-h span { font-size: 1.4em; font-weight: 500; color: oklch(0.562 0.162 27.968); }
.am--light .am-flt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.4em; margin-top: 1.6em; }
.am--light .am-st-cols { --am-cols: 5.2em minmax(0, 1fr) 12em 13em 12em 15em 17em 13.3em; }
.am--light .am-st-group { display: grid; grid-template-columns: 5.2em minmax(0, 1fr) 12em 57em 13.3em; height: 3.7em; background: var(--am-head-bg); border-top: 1px solid var(--am-line); }
.am--light .am-st-group-l { display: grid; place-items: center; font-size: 1.4em; font-weight: 600; border-inline: 1px solid var(--am-line); height: 100%; }
.am--light .am-st-group > span:first-child { display: block; }
.am--light .am-st-cols .am-thead > span { display: flex; align-items: center; gap: .4em; }
.am--light .am-st-cols .am-thead > span.am-r { justify-content: flex-end; }
.am--light .am-st-cols .am-thead u { text-decoration: underline dotted; text-underline-offset: .25em; }
.am--light .am-st-cols .am-thead .am-ic { font-size: 1.3em; }
.am--light .am-st-cols .am-thead > span:first-child { padding-left: 2.4em; }
.am--light .am-st-cols .am-row { height: 5.7em; }
.am--light .am-st-cols .am-row > span:first-child { padding-left: 2.4em; }
.am--light .am-st-cols .am-thumb { width: 3.2em; height: 3.2em; }
.am--light .am-st-wh { font-size: 1.4em; color: var(--am-ink); }
.am--light .am-pcs { font-size: 1.4em; font-weight: 600; line-height: 1.71; color: var(--am-muted); white-space: nowrap; }
.am--light .am-pcs b { font-weight: 600; padding: .1em .3em; border-radius: .3em; }
.am--light .am-pcs--low { color: oklch(0.555 0.163 48.998); }
.am--light .am-st-act { display: flex; align-items: center; justify-content: flex-end; gap: .43em; font-size: 1.4em; font-weight: 500; color: var(--am-blue); padding-right: 1.7em; }
.am--light .am-st-act .am-ic { font-size: 1.15em; }
.am--light .am-st-act .am-ic:last-child { margin-left: .8em; color: var(--am-muted-2); }
.am--light .am-st-sum { height: 5.3em !important; background: var(--am-head-bg); }
.am--light .am-st-sum > span:nth-child(2) { font-size: 1.4em; font-weight: 500; padding-left: .857em; }
.am--light .am-st-sum .am-pcs { font-weight: 500; }
.am--light.am--stock .am-toast { top: 12em; }

/* sprawy klientów: podmenu 228 + 24, tabela z paskiem „Aktywne filtry”, wychodzi za krawędź */
.am--light .am-cs-actions { gap: 1.2em; }
.am--light .am-cs-actions .am-tb-ghost { background: #fff; }
.am--light .am-cs-actions .am-btn { font-size: 1.4em; font-weight: 500; padding: .571em .857em; border-radius: .43em; background: var(--am-blue); box-shadow: none; }
.am--light .am-cs-grid { display: grid; grid-template-columns: 22.8em minmax(0, 1fr); gap: 2.4em; margin-top: 3.2em; align-items: start; }
.am--light .am-cs-nav { display: flex; flex-direction: column; gap: .4em; }
.am--light .am-cs-item { display: flex; align-items: center; gap: 1.2em; height: 4em; padding: 0 .8em; border-radius: .6em; font-size: 1em; color: var(--am-ink-2); }
.am--light .am-cs-item > :not(.am-ic):not(img):not(b) { font-size: 1.4em; }
.am--light .am-cs-item { font-size: 1.4em; font-weight: 500; height: 2.857em; padding: 0 .571em; gap: .857em; border-radius: .43em; }
.am--light .am-cs-item .am-ic { font-size: 1.71em; color: var(--am-muted-2); }
.am--light .am-cs-item.is-active { background: var(--am-blue-100); color: var(--am-blue-700); }
.am--light .am-cs-item.is-active .am-ic { color: var(--am-blue); }
.am--light .am-cs-item b { margin-left: auto; font-size: .786em; }
.am--light .am .am-cs-ch img, .am--light .am-cs-ch img { width: 1.71em; height: 1.71em; border-radius: .3em; }
.am--light .am-cs-group { display: flex; align-items: center; justify-content: space-between; margin: 1.714em .571em .286em; font-size: 1.4em; font-weight: 500; color: var(--am-muted); }
.am--light .am-cs-group .am-ic { font-size: 1.15em; }
.am--light .am-cs-table { margin-top: 0; }
.am--light .am-cs-bar { display: flex; align-items: center; justify-content: flex-end; gap: 1.6em; padding: 1.05em 2.4em; color: var(--am-muted-2); }
.am--light .am-cs-bar > .am-ic { font-size: 2em; }
.am--light .am-cs-filter { position: relative; display: grid; }
.am--light .am-cs-filter .am-ic { font-size: 2em; }
.am--light .am-cs-filter b { position: absolute; top: -.6em; right: -.7em; font: 500 .9em/1 'JetBrains Mono', var(--font-mono); padding: .2em .4em; border-radius: .35em; color: var(--am-blue); background: var(--am-blue-soft); box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--am-blue) 10%, transparent); }
.am--light .am-cs-active { display: flex; align-items: center; gap: 1.2em; padding: .8em 2.4em 1.2em; border-bottom: 1px solid var(--am-line); }
.am--light .am-cs-active span { font-size: 1.4em; font-weight: 500; color: var(--am-ink-2); }
.am--light .am-cs-active b { font: 500 1.1em/1.333 'JetBrains Mono', var(--font-mono); padding: .18em .545em; border-radius: .364em; color: var(--am-blue); background: var(--am-blue-soft); box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--am-blue) 10%, transparent); }
.am--light .am-cs-cols { --am-cols: 10.2em 14em 7em minmax(18em, 1fr) 13em 6.2em 6.2em 11em 19.8em; }
.am--light .am-cs-cols .am-thead { height: 5.2em; }
.am--light .am-cs-cols .am-thead > span { display: flex; align-items: center; gap: .3em; }
.am--light .am-cs-cols .am-thead .am-ic { font-size: 1.3em; }
.am--light .am-cs-cols .am-thead .am-ic:first-child:not(:last-child) { font-size: 1.6em; }
.am--light .am-cs-cols .am-row { height: 5.7em; }
.am--light .am-cs-cols .am-row > * { padding: 0 1.2em; }
.am--light .am-cs-cols .am-row > .am-no { padding: 0 1.2em; white-space: nowrap; }
.am--light .am-cs-cols .am-flag { display: block; }
.am--light .am-cs-who, .am--light .am-cs-title { font-size: 1.4em; color: var(--am-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am--light .am-cs-title { padding-inline: .857em !important; }
.am--light .am-cs-intent, .am--light .am-cs-lang, .am--light .am-oss-kind { display: inline-block; font: 500 1.1em/1.333 'JetBrains Mono', var(--font-mono); letter-spacing: -.025em; padding: .18em .545em; border-radius: .364em; color: oklch(0.442 0.015 285.786); background: var(--am-bg); box-shadow: inset 0 0 0 1px color-mix(in oklch, oklch(0.442 0.015 285.786) 10%, transparent); white-space: nowrap; }
.am--light .am-cs-cols .am-date { font-size: 1.2em; }
.am--light .am-cs-cols .am-row .am-status { margin-left: 0; }
.am-cs-new { max-height: 0; opacity: 0; overflow: hidden; border-top-color: transparent !important; transition: max-height .5s ease, opacity .4s ease .15s, background-color 1.6s ease 1s; }
.am--light .am-cs-new { height: 5.7em; }
.am-cs-new.is-show { max-height: 6em; opacity: 1; border-top-color: var(--am-line) !important; }
.am--light .am-cs-new.is-show { background: var(--am-blue-soft); }
.am--msg .am-cs-cols .am-row.am-cs-new.is-show { animation: am-cs-fade 2.4s ease 1.2s forwards; }
@keyframes am-cs-fade { to { background: #fff; } }

/* automatyzacje: płótno 940 + karta przebiegów 175, węzły jak fwe-node-card */
.am--light .am-wf-grid { grid-template-columns: minmax(0, 1fr) 17.5em; gap: 1.6em; margin-top: 3.2em; }
.am--light .am-wf-canvas { background-color: #fff; background-image: radial-gradient(oklch(0.871 0.006 286.286) .1em, transparent .12em); background-size: 2em 2em; }
.am--light .am-wf-line { stroke: color-mix(in oklab, oklch(0.623 0.214 259.815) 70%, transparent); stroke-width: 1.5; }
.am--light .am-wf-glow { stroke: #14B8A6; stroke-width: 2.5; filter: none; }
.am--light.am--wf .am-wf-line--untaken { transition: opacity .5s ease 1.2s, stroke-dasharray 0s 1.2s; }
.am--light.am--wf.is-played .am-wf-line--untaken { opacity: .35; stroke-dasharray: 4 3; }
.am--light .am-wf-node {
    --a-100: #DBEAFE; --a-200: #BFDBFE; --a-500: #3B82F6; --a-700: #1D4ED8;
    width: 19%; min-height: 0; padding: 0; border-radius: 1.2em; transform: translateY(-50%);
    background: #fff; border: 1.5px solid var(--a-200); box-shadow: 0 .1em .3em rgba(0, 0, 0, .1), 0 .1em .2em -.1em rgba(0, 0, 0, .1);
}
.am--light .am-wf-node--trigger { --a-100: #FEF3C7; --a-200: #FDE68A; --a-500: #F59E0B; --a-700: #B45309; }
.am--light .am-wf-node--cond { --a-100: #EDE9FE; --a-200: #DDD6FE; --a-500: #8B5CF6; --a-700: #6D28D9; }
.am--light .am-wf-node--doc { --a-100: #D1FAE5; --a-200: #A7F3D0; --a-500: #10B981; --a-700: #047857; }
.am--light.am--wf.is-played .am-wf-node:not(.is-idle) { border-color: var(--a-500); box-shadow: 0 0 .4em 0 rgba(20, 184, 166, .55), 0 0 1.2em -.2em rgba(20, 184, 166, .55); }
.am--light .am-wf-node.is-idle { opacity: 1; transition: opacity .5s ease 1.2s; }
.am--light.am--wf.is-played .am-wf-node.is-idle { opacity: .5; }
.am-wf-hd { display: flex; align-items: flex-start; gap: 1.2em; padding: 1.2em 1.6em; }
.am-wf-ic { display: grid; place-items: center; width: 3.6em; height: 3.6em; flex-shrink: 0; border-radius: .8em; background: var(--a-500); color: #fff; }
.am-wf-ic .am-ic { font-size: 2em; }
.am-wf-hd-t { min-width: 0; }
.am-wf-badge { display: inline-flex; padding: .2em .8em; border-radius: 99em; font-size: 1em; font-weight: 600; letter-spacing: .025em; background: var(--a-100); color: var(--a-700); }
.am--light .am-wf-title { margin-top: .3em; font-size: 1.4em; line-height: 1.3; font-weight: 600; color: oklch(0.13 0.028 261.692); white-space: normal; overflow: visible; }
.am-wf-bd { padding: 1em 1.6em; border-top: 1px solid var(--a-100); font-size: 1.2em; color: var(--am-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am--light .am-wf-handle { width: 1.4em; height: 1.4em; margin-top: -.7em; border: 0; background: #94A3B8; }
.am--light .am-wf-handle--in { left: -.7em; }
.am--light .am-wf-handle--out { right: -.7em; }
.am--light .am-wf-ok { display: none; }
.am-wf-ctrl { position: absolute; left: 1.2em; bottom: 1.2em; display: flex; flex-direction: column; gap: 1px; border-radius: .6em; overflow: hidden; box-shadow: 0 0 0 1px var(--am-line); }
.am-wf-ctrl span, .am-wf-ctrl-x { display: grid; place-items: center; width: 2.8em; height: 2.8em; background: #fff; color: var(--am-ink-2); }
.am-wf-ctrl .am-ic, .am-wf-ctrl-x .am-ic { font-size: 1.6em; }
.am-wf-ctrl-x { position: absolute; left: 4.6em; bottom: 1.2em; border-radius: .6em; box-shadow: 0 0 0 1px var(--am-line); }
.am--light .am-wf-zoom { display: none; }
.am-wf-map { position: absolute; right: 1.2em; bottom: 1.2em; width: 20em; height: 10.5em; border-radius: .6em; background: oklch(0.967 0.001 286.375); box-shadow: 0 0 0 1px var(--am-line); overflow: hidden; }
.am-wf-map i { position: absolute; width: 16%; height: 14%; border-radius: .3em; background: oklch(0.871 0.006 286.286); }
.am--light .am-wf-runs { padding: 0; }
.am-wf-runs-h { padding: 1.6em 2.4em; border-bottom: 1px solid var(--am-line); font: 600 1.6em/1.5 'Sora', var(--font-display); letter-spacing: -.025em; }
.am--light .am-wf-run { padding: 1.2em 1.6em; margin: 0; font-size: 1.2em; }
.am--light .am-wf-runs .am-wf-run:first-of-type, .am--light .am-wf-runs-h + .am-wf-run { margin-top: 0; border-top: 0; }
.am--light .am-wf-run em { color: #0D9488; }
.am--light .am-wf-run--new.is-show { padding-block: 1.2em; }

/* ewidencja OSS: nagłówek z podtytułem 18, karta „Kwartał” 112, zwinięta notka 80, tabela */
.am--light .am-oss-h1 { font-size: 3em; line-height: 1.2; font-weight: 600; letter-spacing: -.025em; }
.am--light .am-oss-sub { margin-top: .444em; font-size: 1.8em; line-height: 1.56; color: oklch(0.442 0.015 285.786); }
.am--light .am-oss-sec { margin-top: 3.2em; padding: 2.4em; }
.am--light .am-oss-note { display: flex; align-items: center; justify-content: space-between; gap: 2em; margin-top: 2.4em; padding: 1.6em 2.4em; }
.am--light .am-oss-note b { display: block; font: 600 1.6em/1.5 'Sora', var(--font-display); letter-spacing: -.025em; }
.am--light .am-oss-note span { display: block; font-size: 1.4em; color: var(--am-muted); }
.am--light .am-oss-note > .am-ic { font-size: 2em; color: var(--am-muted-2); }
.am--light .am-oss-table { margin-top: 2.4em; }
.am--light .am-oss-bar { display: flex; justify-content: flex-end; gap: 1.6em; padding: 1.8em 2.4em; color: var(--am-muted-2); font-size: 1em; }
.am--light .am-oss-bar .am-ic { font-size: 2em; }
.am--light .am-oss-cols { --am-cols: 18.6em 14em 8em 22em 19em 6.6em 7em 7.4em 6.4em 7.4em 14em; }
.am--light .am-oss-cols .am-thead { height: 4.4em; }
.am--light .am-oss-cols .am-thead > span:first-child { padding-left: 2.18em; }
.am--light .am-oss-table .am-oss-cols .am-row { height: 7.6em; }
.am--light .am-oss-table .am-oss-cols .am-row > span { font-size: 1em; padding: 0 1.2em; }
.am--light .am-oss-cols .am-row > span:first-child { padding-left: 2.4em; }
.am--light .am-oss-cols .am-row .am-num, .am--light .am-oss-country, .am--light .am-oss-day, .am--light .am-oss-qty, .am--light .am-oss-cur { font-size: 1.4em !important; color: var(--am-ink); }
.am--light .am-oss-from, .am--light .am-oss-prod, .am--light .am-oss-doc { display: flex; flex-direction: column; gap: .2em; min-width: 0; }
.am--light .am-oss-from b, .am--light .am-oss-prod b, .am--light .am-oss-doc b { font-size: 1.4em; font-weight: 400; color: var(--am-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am--light .am-oss-from span, .am--light .am-oss-prod span, .am--light .am-oss-doc span { font-size: 1.4em; color: var(--am-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.am--light .am-oss-prod span { font: 500 1.1em/1.45 'JetBrains Mono', var(--font-mono); }
.am-oss-new { max-height: 0; opacity: 0; overflow: hidden; border-top-color: transparent !important; transition: max-height .5s ease, opacity .4s ease .15s; }
.am-oss-new.is-show { max-height: 8em; opacity: 1; border-top-color: var(--am-line) !important; animation: am-oss-new 2.6s ease .4s both; }
@keyframes am-oss-new { 0%, 30% { background: var(--am-blue-soft); } 100% { background: #fff; } }
.am--light.am--oss .am-toast { top: 2.6em; }
.am--light .am-oss-qty, .am--light .am-oss-day { white-space: nowrap; }
.am--light .am-oss-cols .am-thead > span { white-space: nowrap; overflow: hidden; }

/* podgląd zamówienia: lewa kolumna 728, prawa 352, odstęp 24; analityka jak w panelu */
.am--light .am-mg-grid { grid-template-columns: minmax(0, 72.8em) minmax(0, 1fr); gap: 2.4em; margin-top: 3.2em; align-items: start; }
.am--light .am-mg-side { display: flex; flex-direction: column; gap: 2.4em; }
.am--light .am-mg-chart { position: relative; height: 22em; }
.am--light .am-mg-donut { display: block; width: 100%; height: 100%; }
.am--light .am-mg-donut circle { fill: none; stroke-width: 30; }
.js .am--light.am--margin:not(.is-played) .am-mg-donut circle { stroke-dasharray: 0 100; }
.am--light.am--margin .am-mg-donut circle { transition: stroke-dasharray .9s cubic-bezier(.16, 1, .3, 1) var(--am-delay, 0s); }
.am--light .am-mg-legend { position: absolute; right: 2%; top: 50%; transform: translateY(-50%); display: grid; gap: 1em; margin: 0; padding: 0; list-style: none; }
.am--light .am-mg-legend li { display: flex; align-items: center; gap: .5em; font-size: 1.2em; color: var(--am-ink-2); }
.am--light .am-mg-legend i { width: 2.1em; height: 1.2em; border-radius: .3em; }
.am--light .am-mg-cols { --am-cols: minmax(0, 1fr) 14.8em 23.8em; margin: 0 -2.4em -2.4em; }
.am--light .am-mg-cols .am-thead { height: 4.4em; }
.am--light .am-mg-cols .am-thead > span:first-child { padding-left: 2.18em; }
.am--light .am-mg-cols .am-row { height: 5.7em; }
.am--light .am-mg-cols .am-row > span { font-size: 1.4em; padding: 0 .857em; color: var(--am-ink); }
.am--light .am-mg-cols .am-row > span:first-child { padding-left: 1.714em; }
.am--light .am-mg-cols .am-row > span:last-child { padding-right: 1.714em; }
.am--light .am-mg-profit > span { font-weight: 600; }
.am--light .am-mg-profit b { font-weight: 600; color: oklch(0.527 0.123 155.01); }
.am--light .am-mg-facts { display: flex; flex-direction: column; }
.am--light .am-mg-facts .am-flt-l { color: var(--am-muted); font-weight: 500; }
.am--light .am-mg-facts .am-flt-l ~ .am-flt-l { margin-top: 1.2em; }
.am--light .am-mg-fact { display: flex; align-items: center; gap: .43em; margin-top: .3em; font-size: 1.4em; color: var(--am-ink); }
.am--light .am .am-mg-fact img, .am--light .am-mg-fact img { width: 1.29em; height: 1.29em; border-radius: .2em; }
.am--light .am-mg-fact .am-ic { font-size: 1.15em; color: var(--am-muted-2); }
.am--light .am-mg-facts .am-tag { margin: .4em 0 0; font-size: 1.1em; }

@container (max-width: 820px) {
    :is(.am--msg, .am--margin, .am--wf) .am-col-x { display: none; }
    .am--light .am-st-cols { --am-cols: minmax(0, 1fr) 9.5em 11em 12em; }
    .am--light .am-st-group { grid-template-columns: minmax(0, 1fr) 32.5em; }
    .am--light .am-st-cols .am-row > span:nth-child(2), .am--light .am-st-cols .am-thead > span:nth-child(2), .am--light .am-st-sum > span:nth-child(2) { padding-left: 2em; }
    .am--light .am-cs-grid { grid-template-columns: minmax(0, 1fr); }
    .am--light .am-cs-cols { --am-cols: 10em 14em minmax(0, 1fr) 10em; }
    .am--light .am-oss-cols { --am-cols: 10em minmax(0, 1fr) 8em 7em 7em; }
    .am--light .am-mg-grid { grid-template-columns: minmax(0, 1fr); }
    .am--light .am-oss-table { margin-top: 3.2em; }
}
@media (prefers-reduced-motion: reduce) {
    .am-cs-new, .am-oss-new, .am--light.am--margin .am-mg-donut circle, .am--light .am-wf-node.is-idle, .am--light.am--wf .am-wf-line--untaken { transition: none; }
    .am-oss-new.is-show, .am--msg .am-cs-cols .am-row.am-cs-new.is-show { animation: none; }
}