/* [cc 16.10] site26 · sx-detasare.css: portat din site-sectiuni/sectiuni/detasare-b.css (05.10, #58 „Cântarul”), clasele sx-detasare-*, totul sub .sx-detasare, doar px.
   Obiectul principal: un cântar cu talere, desenat ca o gravură, pe care stau „celulele” din Calcul Detașare, cu înălțimea proporțională cu suma:
   c11 în stânga; c12 + c13 (+ suplimentara) în dreapta. Masa, alături, pe masă. Deasupra, panglica deplasării 1187, cu butoanele zilelor.
   Stări (din JS): .sx-detasare-js = scena fixată · .sx-detasare-motion = cu mișcare · .sx-detasare-geo = geometria trece pe stilul CSS (tranziții pe
   transform / y / height, fără buclă requestAnimationFrame) · .is-armed = intrarea așteaptă · [data-state] = de | fr | plus · .has-gap (pe svg) = golul roșu.
   Fără JS, la tipărire și la mișcare redusă: starea finală (plus), desenată.
   Teme: cântarul, panglica și hârtiile urmează pagina; fragmentele din program (ferestrele, mesajul din aplicație, ferestrele browserului, rândul
   cu plafonul) rămân deschise pe ambele teme, cu gradul ferestrei de pe pagina 1 pe negru. */

.sx-detasare {
  /* gravura */
  --sx-detasare-line: #283442;
  --sx-detasare-fine: rgba(40, 52, 66, .5);
  --sx-detasare-hatch: rgba(40, 52, 66, .36);
  --sx-detasare-metal: #f9f7f2;
  --sx-detasare-brass-a: #f2e8cd; --sx-detasare-brass-b: #d8c38e;
  --sx-detasare-shine: rgba(255, 255, 255, .75);
  --sx-detasare-floor: rgba(29, 39, 51, .16); --sx-detasare-floor-0: rgba(29, 39, 51, 0);
  --sx-detasare-table: rgba(29, 39, 51, .18);
  --sx-detasare-glow: rgba(255, 255, 255, .62);
  /* greutățile: rolurile, nu decorul */
  --sx-detasare-min: #2b3644; --sx-detasare-min-ink: #f4f2ec;           /* c11, minimul cerut */
  --sx-detasare-pay: #1a74a2; --sx-detasare-pay-ink: #ffffff;           /* c12 (în program, celula e bg-primary) */
  --sx-detasare-sal: #dcebf6; --sx-detasare-sal-line: #1a74a2; --sx-detasare-sal-ink: #134f70;   /* c13 */
  --sx-detasare-min-hi: #3d4b5c; --sx-detasare-pay-hi: #2486b8; --sx-detasare-pay-lo: #176a95; --sx-detasare-sal-hi: #edf5fb;   /* volumul greutăților */
  --sx-detasare-w-shadow: drop-shadow(0 1.4px 1.2px rgba(23, 32, 43, .2));
  --sx-detasare-sup: #1a74a2; --sx-detasare-sup-bg: #cfe3f2;            /* suplimentara (tot bg-primary în program) */
  --sx-detasare-red: #c8372d; --sx-detasare-red-t: #ad2a20; --sx-detasare-red-soft: rgba(200, 55, 45, .13); --sx-detasare-on-red: #ffffff;
  --sx-detasare-meal: #9c5c10; --sx-detasare-meal-soft: rgba(156, 92, 16, .10);
  /* panglica cursei */
  --sx-detasare-band: #fbfaf6; --sx-detasare-band-line: rgba(29, 39, 51, .15); --sx-detasare-band-shadow: rgba(23, 32, 43, .07);
  --sx-detasare-seam: rgba(29, 39, 51, .2); --sx-detasare-hatch2: rgba(29, 39, 51, .075); --sx-detasare-c-ink: #5b6672;
  --sx-detasare-post-bg: #d6e7f1; --sx-detasare-post-ink: #0f4f73;
  --sx-detasare-brk-del: #bcc4ce; --sx-detasare-bp: #1a74a2; --sx-detasare-dayhl: rgba(26, 116, 162, .17);
  --sx-detasare-pk-bg: #ffffff; --sx-detasare-pk-line: rgba(29, 39, 51, .17);
  /* hârtia tipărită (rămâne hârtie și pe tema închisă) */
  --sx-detasare-paper: #fffefb; --sx-detasare-paper-ink: #22282e; --sx-detasare-paper-mute: #56606b; --sx-detasare-paper-rule: rgba(29, 39, 51, .16);
  --sx-detasare-paper-acc: #1a74a2; --sx-detasare-paper-hl: hsl(204 80% 45% / .17);
  --sx-detasare-paper-drop: drop-shadow(0 0 .6px rgba(29, 39, 51, .35)) drop-shadow(0 14px 20px rgba(23, 32, 43, .13));
  /* fragmentele din program */
  --sx-detasare-card: #ffffff;
  --sx-detasare-card-shadow:
    0 0 0 1px rgba(28, 38, 50, .06),
    0 1px 2px rgba(28, 38, 50, .05),
    0 6px 14px -4px rgba(28, 38, 50, .07),
    0 22px 44px -12px rgba(28, 38, 50, .12);
  --sx-detasare-th: #f4f5f7; --sx-detasare-grid: #dfe3e8; --sx-detasare-stripe: #f8f9fa; --sx-detasare-cell: #1d2733;
  --sx-detasare-track: rgba(29, 39, 51, .075);
  --sx-detasare-pri: #1a74a2; --sx-detasare-pri-ink: #ffffff;
  --sx-detasare-mark: hsl(204 80% 45% / .17);
  --sx-detasare-warn: hsl(46 92% 87%); --sx-detasare-warn-ink: #4b380b;
  --sx-detasare-input: #ffffff; --sx-detasare-input-line: #b9c3cd; --sx-detasare-input-ink: #1d2733;
  --sx-detasare-sys: #ffffff; --sx-detasare-sys-ink: #1f1f1f; --sx-detasare-sys-ok: #0b57d0; --sx-detasare-sys-ok-ink: #ffffff; --sx-detasare-sys-line: #c4c7c5; --sx-detasare-sys-in: #747775;
  --sx-detasare-sys-shadow: 0 0 0 1px rgba(0, 0, 0, .08), 0 4px 10px rgba(23, 32, 43, .10), 0 24px 48px -14px rgba(23, 32, 43, .34);
  overflow-x: clip;
}
/* tema închisă: gravura, panglica, butoanele și hârtiile; fragmentele din program rămân deschise (insulele de mai jos) */
html[data-theme="dark"] .sx-detasare {
  --sx-detasare-line: #d6d6d6; --sx-detasare-fine: rgba(214, 214, 214, .42); --sx-detasare-hatch: rgba(214, 214, 214, .3);
  --sx-detasare-metal: #1a1a1a; --sx-detasare-brass-a: #7d6c45; --sx-detasare-brass-b: #54472b; --sx-detasare-shine: rgba(255, 240, 200, .28);
  --sx-detasare-floor: rgba(0, 0, 0, .55); --sx-detasare-floor-0: rgba(0, 0, 0, 0); --sx-detasare-table: rgba(255, 255, 255, .12); --sx-detasare-glow: rgba(122, 170, 212, .075);
  --sx-detasare-min: #b9b9b9; --sx-detasare-min-ink: #111111; --sx-detasare-min-hi: #cfcfcf;
  --sx-detasare-pay: #7aaad4; --sx-detasare-pay-ink: #0b1620; --sx-detasare-pay-hi: #92bce2; --sx-detasare-pay-lo: #6c9fcc;
  --sx-detasare-sal: #23303b; --sx-detasare-sal-line: #7aaad4; --sx-detasare-sal-ink: #d4e6f5; --sx-detasare-sal-hi: #2c3b48;
  --sx-detasare-w-shadow: drop-shadow(0 1.6px 1.4px rgba(0, 0, 0, .55));
  --sx-detasare-sup: #8fbbe2; --sx-detasare-sup-bg: #1d2a35;
  --sx-detasare-red: #ee6a57; --sx-detasare-red-t: #f4907f; --sx-detasare-red-soft: rgba(238, 106, 87, .16); --sx-detasare-on-red: #1b0d0a;
  --sx-detasare-meal: #d4a855; --sx-detasare-meal-soft: rgba(212, 168, 85, .14);
  --sx-detasare-band: #141414; --sx-detasare-band-line: rgba(255, 255, 255, .1); --sx-detasare-band-shadow: rgba(0, 0, 0, .4);
  --sx-detasare-seam: rgba(255, 255, 255, .13); --sx-detasare-hatch2: rgba(255, 255, 255, .055); --sx-detasare-c-ink: #a8a8a8;
  --sx-detasare-post-bg: #22384a; --sx-detasare-post-ink: #d3e6f5;
  --sx-detasare-brk-del: #555555; --sx-detasare-bp: #7aaad4; --sx-detasare-dayhl: rgba(122, 170, 212, .2);
  --sx-detasare-pk-bg: #161616; --sx-detasare-pk-line: rgba(255, 255, 255, .12);
  --sx-detasare-paper: #e6e2d9; --sx-detasare-paper-ink: #1f2429; --sx-detasare-paper-mute: #4d5660; --sx-detasare-paper-rule: rgba(29, 39, 51, .17);
  --sx-detasare-paper-hl: hsl(204 80% 45% / .2);
  --sx-detasare-paper-drop: drop-shadow(0 0 .6px rgba(0, 0, 0, .6)) drop-shadow(0 22px 26px rgba(0, 0, 0, .55));
  --sx-detasare-card-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 2px 6px rgba(0, 0, 0, .35), 0 30px 60px -20px rgba(0, 0, 0, .8);
  --sx-detasare-sys-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 30px 60px -16px rgba(0, 0, 0, .85);
  --sx-detasare-track: rgba(255, 255, 255, .08);
}
/* insulele programului: tokenii din tema deschisă (pe negru, site27 face --sx-ink alb) */
.sx-detasare :is(.sx-detasare-win, .sx-detasare-msg, .sx-detasare-dlg, .sx-detasare-strip) {
  --sx-panel: #fff; --sx-surface: #fff; --sx-bg1: hsl(40 10% 97%); --sx-ink: #1d2733; --sx-ink2: #4f5b68; --sx-ink3: #637080;
  --sx-hair: rgba(23, 32, 43, .10); --sx-hair-strong: #d6dce4; --sx-accent: #142a3e; --sx-accent-text: #142a3e; --sx-accent-ink: #fff; --sx-focus: #142a3e; --sx-ok: #27764c;
  --sx-detasare-track: rgba(29, 39, 51, .075); --sx-detasare-red: #c8372d; --sx-detasare-red-t: #ad2a20; --sx-detasare-on-red: #ffffff; --sx-detasare-c-ink: #5b6672;
  color-scheme: light;
}
html[data-theme="dark"] .sx-detasare :is(.sx-detasare-win, .sx-detasare-msg, .sx-detasare-dlg, .sx-detasare-strip) { filter: brightness(.92) contrast(1.06); }
.sx-detasare b, .sx-detasare strong { word-spacing: -0.02em; }
/* base.css strânge spațierea pe ORICE element (body *): copiii textelor cu spațiere proprie o moștenesc de la părinte */
.sx-detasare :is(.sx-detasare-key, .sx-detasare-key-meal, .sx-detasare-legend, .sx-detasare-k, .sx-detasare-read, .sx-detasare-ann, .sx-detasare-foot-c, .sx-detasare-day, .sx-detasare-src, .sx-detasare-msg, .sx-detasare-trip) * { letter-spacing: inherit; word-spacing: inherit; }

/* ---------- 1. Antetul (o coloană: eticheta, titlul, faptele; lede-ul îl scoate site27) ---------- */
.sx-detasare svg { display: inline; }   /* final.css din site27 pune svg{display:block}; iconițele stau în rând, ca în site-sectiuni */
.sx-detasare .sx-detasare-head { display: grid; gap: var(--sx-gap-head); justify-items: start; }
.sx-detasare .sx-detasare-head h2 { max-width: 15.5em; }
.sx-detasare .sx-detasare-lede { max-width: 46ch; }
.sx-detasare .sx-detasare-ex { margin: 26px 0 clamp(36px, 5vw, 64px); max-width: 72ch; font-size: 14px; line-height: 1.55; color: var(--sx-ink2); }
.sx-detasare .sx-detasare-ex b { font-weight: 600; color: var(--sx-ink); }

/* ---------- 2. Povestea: scena fixată + frontiera și pașii ---------- */
.sx-detasare .sx-detasare-story { position: relative; }
.sx-detasare .sx-detasare-pin { position: relative; }
@media (min-width: 960px) {
  .sx-detasare .sx-detasare-story { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); column-gap: clamp(40px, 5vw, 72px); align-items: start; }
  .sx-detasare.sx-detasare-js .sx-detasare-pin { position: sticky; top: var(--sx-detasare-top, 88px); }
}
@media (max-width: 959px) {
  .sx-detasare.sx-detasare-js .sx-detasare-pin {
    position: sticky; top: 0; z-index: 3; background: var(--sx-bg0);
    margin-inline: calc(var(--sx-gutter) * -1); padding: 9px var(--sx-gutter) 8px;
  }
  .sx-detasare.sx-detasare-js .sx-detasare-pin::after {
    content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 18px; pointer-events: none;
    background: linear-gradient(var(--sx-bg0), color-mix(in srgb, var(--sx-bg0) 0%, transparent));
  }
}

/* ---------- 3. Scena: panglica, citirea, cântarul, etichetele ---------- */
.sx-detasare .sx-detasare-scene {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "trip" "side" "fig" "keys"; row-gap: 12px; max-width: 520px; margin-inline: auto;
}
.sx-detasare .sx-detasare-trip { grid-area: trip; position: relative; z-index: 2; min-width: 0; }
.sx-detasare .sx-detasare-side { grid-area: side; min-width: 0; display: grid; justify-items: center; }
.sx-detasare .sx-detasare-fig { grid-area: fig; position: relative; margin: -6px 0 0; min-width: 0; }
.sx-detasare .sx-detasare-keys { grid-area: keys; }

/* 3.1 panglica deplasării: acolade, banda pe țări, zilele */
.sx-detasare .sx-detasare-trip { font-variant-numeric: tabular-nums; letter-spacing: 0; word-spacing: 0; }
.sx-detasare .sx-detasare-brk { position: relative; height: 21px; }
.sx-detasare .sx-detasare-br {
  position: absolute; bottom: 0; left: calc(var(--a) * 100% + 3px); width: calc(var(--w) * 100% - 6px); height: 6px;
  border: 1.25px solid var(--sx-detasare-brk-del); border-bottom: 0; border-radius: 4px 4px 0 0;
}
.sx-detasare .sx-detasare-br--post { border-color: var(--sx-detasare-bp); }
.sx-detasare .sx-detasare-br b {
  position: absolute; bottom: 8px; left: 50%; transform: translateX(-50%); white-space: nowrap;
  font-size: 11.5px; line-height: 1.15; font-weight: 500; color: var(--sx-ink2);
}
.sx-detasare .sx-detasare-br--post b { color: var(--sx-accent-text); font-weight: 600; }
.sx-detasare .sx-detasare-band { position: relative; height: 28px; margin-top: 3px; }
.sx-detasare .sx-detasare-band-p {
  position: absolute; inset: 0; border-radius: 6px; overflow: hidden; background: var(--sx-detasare-band);
  box-shadow: inset 0 0 0 1px var(--sx-detasare-band-line), 0 1px 2px var(--sx-detasare-band-shadow);
}
.sx-detasare .sx-detasare-c {
  position: absolute; top: 0; bottom: 0; left: calc(var(--a) * 100%); width: calc(var(--w) * 100%);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  font-size: 10px; font-weight: 600; letter-spacing: .06em; color: var(--sx-detasare-c-ink);
  background: repeating-linear-gradient(-55deg, var(--sx-detasare-hatch2) 0 1px, transparent 1px 5px);
}
.sx-detasare .sx-detasare-c + .sx-detasare-c { border-left: 1px dashed var(--sx-detasare-seam); }
.sx-detasare .sx-detasare-c--post {
  justify-content: flex-end; gap: 6px; padding-right: 8px; letter-spacing: 0;
  background: var(--sx-detasare-post-bg); color: var(--sx-detasare-post-ink);
}
.sx-detasare .sx-detasare-c--post b { font-size: 13px; font-weight: 700; letter-spacing: .03em; color: inherit; }
.sx-detasare .sx-detasare-c--post span { font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.sx-detasare .sx-detasare-dayhl {
  position: absolute; top: 0; bottom: 0; left: calc(var(--dd, .559592) * 100%); width: 6.3802%;
  background: var(--sx-detasare-dayhl); box-shadow: inset 0 -3px 0 var(--sx-accent);
}
.sx-detasare .sx-detasare-scene[data-state="de"] .sx-detasare-dayhl { --dd: .304386; }
.sx-detasare .sx-detasare-bp {
  position: absolute; top: -4px; bottom: -4px; left: calc(var(--x) * 100%); width: 1.5px; margin-left: -.75px;
  background: var(--sx-detasare-bp); border-radius: 1px;
}
.sx-detasare .sx-detasare-bp::before {
  content: ""; position: absolute; left: 50%; top: -3px; width: 6px; height: 6px; margin-left: -3px; border-radius: 50%;
  background: var(--sx-detasare-bp); box-shadow: 0 0 0 2px var(--sx-bg0);
}
/* zilele: capetele cursei și butoanele, sub zilele lor */
.sx-detasare .sx-detasare-pick { position: relative; height: 30px; margin-top: 8px; }
.sx-detasare .sx-detasare-t0, .sx-detasare .sx-detasare-t1 { position: absolute; top: 0; line-height: 30px; font-size: 11.5px; color: var(--sx-ink2); white-space: nowrap; }
.sx-detasare .sx-detasare-t0 { left: 0; }
.sx-detasare .sx-detasare-t1 { right: 0; }
.sx-detasare .sx-detasare-pk-g { position: absolute; inset: 0; }
.sx-detasare .sx-detasare-pk-g[hidden] { display: none; }
.sx-detasare .sx-detasare-pk {
  font: inherit; position: absolute; top: 0; height: 30px; padding: 0 10px; margin: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--sx-detasare-pk-line); border-radius: var(--sx-r-pill); background: var(--sx-detasare-pk-bg); color: var(--sx-ink);
  font-size: 12.5px; font-weight: 600; line-height: 1; letter-spacing: 0; word-spacing: 0; white-space: nowrap; cursor: pointer;
  font-variant-numeric: tabular-nums; -webkit-tap-highlight-color: transparent;
  transition: background-color var(--sx-t-fast) ease, border-color var(--sx-t-fast) ease, color var(--sx-t-fast) ease, transform var(--sx-t-fast) ease, box-shadow var(--sx-t-fast) ease;
}
.sx-detasare .sx-detasare-pk--14 { left: calc(33.6287% - 28px); width: 56px; }
.sx-detasare .sx-detasare-pair { position: absolute; top: 0; left: calc(59.1493% - 28px); display: flex; gap: 4px; }
.sx-detasare .sx-detasare-pair .sx-detasare-pk { position: relative; }
.sx-detasare .sx-detasare-pk--18 { width: 56px; }
/* vârful care arată ziua de pe bandă */
.sx-detasare :is(.sx-detasare-pk--14, .sx-detasare-pk--18)::before {
  content: ""; position: absolute; left: 50%; top: -4px; width: 7px; height: 7px; margin-left: -3.5px;
  background: inherit; border: inherit; border-right: 0; border-bottom: 0; border-radius: 1.5px 0 0 0; transform: rotate(45deg);
}
.sx-detasare .sx-detasare-pk:hover { border-color: var(--sx-accent-border); box-shadow: 0 1px 2px var(--sx-detasare-band-shadow); }
.sx-detasare .sx-detasare-pk:active { transform: translateY(1px); }
.sx-detasare .sx-detasare-pk[aria-pressed="true"] { background: var(--sx-accent); border-color: var(--sx-accent); color: var(--sx-accent-ink); box-shadow: none; }
.sx-detasare .sx-detasare-pk:focus-visible { outline: 2px solid var(--sx-focus); outline-offset: 2px; }

/* 3.2 citirea diferenței */
.sx-detasare .sx-detasare-day { font-size: 14px; font-weight: 600; color: var(--sx-ink); letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.sx-detasare.sx-detasare-js .sx-detasare-day { display: none; }
.sx-detasare .sx-detasare-read { display: inline-flex; align-items: baseline; gap: 10px; }
.sx-detasare .sx-detasare-read-k { font-size: 13px; color: var(--sx-ink2); letter-spacing: -0.01em; word-spacing: 0; white-space: nowrap; }
.sx-detasare .sx-detasare-read-k i, .sx-detasare .sx-detasare-code {
  font-style: normal; font-family: var(--sx-f-mono); font-size: 10.5px; letter-spacing: .05em; word-spacing: 0;
  color: var(--sx-ink2); background: var(--sx-detasare-track); border-radius: 4px; padding: 1px 5px;
}
.sx-detasare .sx-detasare-read-v {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 27px; font-weight: 600; line-height: 1; letter-spacing: -0.025em; word-spacing: 0; color: var(--sx-ink);
  font-variant-numeric: tabular-nums; transition: color .25s ease, opacity .4s var(--sx-ease);
}
.sx-detasare .sx-detasare-read-v output { font: inherit; color: inherit; }
.sx-detasare .sx-detasare-tri-i { display: block; flex: 0 0 auto; width: 19px; height: 19px; overflow: visible; }
.sx-detasare .sx-detasare-tri-b { fill: var(--sx-detasare-red); stroke: var(--sx-detasare-red); stroke-width: 1.5; stroke-linejoin: round; }
.sx-detasare .sx-detasare-tri-x { fill: none; stroke: var(--sx-detasare-on-red); stroke-width: 1.8; stroke-linecap: round; }
.sx-detasare .sx-detasare-tri-d { fill: var(--sx-detasare-on-red); }
.sx-detasare .sx-detasare-read .sx-detasare-tri-i { display: none; }
.sx-detasare .sx-detasare-read.is-neg .sx-detasare-read-v { color: var(--sx-detasare-red-t); }
.sx-detasare .sx-detasare-read.is-neg .sx-detasare-tri-i { display: block; }
.sx-detasare .sx-detasare-scene.is-armed .sx-detasare-read-v { opacity: 0; }

/* 3.3 cântarul */
.sx-detasare .sx-detasare-fig::before {
  content: ""; position: absolute; left: 6%; right: 6%; top: 2%; height: 74%; z-index: 0; pointer-events: none;
  background: radial-gradient(closest-side, var(--sx-detasare-glow), transparent);
}
.sx-detasare .sx-detasare-svg { position: relative; z-index: 1; display: block; width: 100%; max-width: 520px; height: auto; margin-inline: auto; overflow: hidden; }
.sx-detasare .sx-detasare-svg text { letter-spacing: 0; word-spacing: 0; font-family: var(--sx-f-sans); }
.sx-detasare .sx-detasare-svg .sx-detasare-m { fill: var(--sx-detasare-metal); stroke: var(--sx-detasare-line); stroke-width: 1; stroke-linejoin: round; }
.sx-detasare .sx-detasare-svg .sx-detasare-fine { fill: none; stroke: var(--sx-detasare-fine); stroke-width: .55; }
.sx-detasare .sx-detasare-svg .sx-detasare-hatch { fill: url(#sx-detasare-hatch); stroke: none; }
.sx-detasare .sx-detasare-svg .sx-detasare-hl { stroke: var(--sx-detasare-hatch); stroke-width: .5; }
.sx-detasare .sx-detasare-svg .sx-detasare-ink { fill: var(--sx-detasare-line); }
.sx-detasare .sx-detasare-svg .sx-detasare-tick { fill: none; stroke: var(--sx-detasare-line); stroke-width: .75; stroke-linecap: round; }
.sx-detasare .sx-detasare-svg .sx-detasare-tick--0 { stroke-width: 1.1; }
.sx-detasare .sx-detasare-svg .sx-detasare-plate { fill: url(#sx-detasare-brass); stroke: var(--sx-detasare-line); stroke-width: 1; }
.sx-detasare .sx-detasare-svg .sx-detasare-shine { fill: none; stroke: var(--sx-detasare-shine); stroke-width: .7; stroke-linecap: round; }
.sx-detasare .sx-detasare-svg .sx-detasare-br-a { stop-color: var(--sx-detasare-brass-a); }
.sx-detasare .sx-detasare-svg .sx-detasare-br-b { stop-color: var(--sx-detasare-brass-b); }
.sx-detasare .sx-detasare-svg .sx-detasare-floor { fill: url(#sx-detasare-floor-g); }
.sx-detasare .sx-detasare-svg .sx-detasare-fl-a { stop-color: var(--sx-detasare-floor); }
.sx-detasare .sx-detasare-svg .sx-detasare-fl-b { stop-color: var(--sx-detasare-floor-0); }
.sx-detasare .sx-detasare-svg .sx-detasare-table { fill: none; stroke: var(--sx-detasare-table); stroke-width: .8; }
/* greutățile */
.sx-detasare .sx-detasare-w { filter: var(--sx-detasare-w-shadow); }
.sx-detasare .sx-detasare-w rect { stroke-width: .9; }
.sx-detasare [data-w="c11"] rect { fill: url(#sx-detasare-g11); stroke: var(--sx-detasare-min); }
.sx-detasare [data-w="c12"] rect { fill: url(#sx-detasare-g12); stroke: var(--sx-detasare-pay-lo); }
.sx-detasare [data-w="c13"] rect { fill: url(#sx-detasare-g13); stroke: var(--sx-detasare-sal-line); }
.sx-detasare .sx-detasare-g11-a { stop-color: var(--sx-detasare-min-hi); }
.sx-detasare .sx-detasare-g11-b { stop-color: var(--sx-detasare-min); }
.sx-detasare .sx-detasare-g12-a { stop-color: var(--sx-detasare-pay-hi); }
.sx-detasare .sx-detasare-g12-b { stop-color: var(--sx-detasare-pay-lo); }
.sx-detasare .sx-detasare-g13-a { stop-color: var(--sx-detasare-sal-hi); }
.sx-detasare .sx-detasare-g13-b { stop-color: var(--sx-detasare-sal); }
.sx-detasare [data-w="c14"] rect { fill: url(#sx-detasare-hatch-s); stroke: var(--sx-detasare-sup); }
.sx-detasare .sx-detasare-hs-bg { fill: var(--sx-detasare-sup-bg); }
.sx-detasare .sx-detasare-hs { stroke: var(--sx-detasare-sup); stroke-width: 1.1; }
.sx-detasare .sx-detasare-st-k { font-family: var(--sx-f-mono) !important; font-size: 8.4px; letter-spacing: .06em !important; fill-opacity: .74; }
.sx-detasare .sx-detasare-st-v { font-size: 13.5px; font-weight: 600; text-anchor: end; font-variant-numeric: tabular-nums; }
.sx-detasare [data-w="c11"] text { fill: var(--sx-detasare-min-ink); }
.sx-detasare [data-w="c12"] text { fill: var(--sx-detasare-pay-ink); }
.sx-detasare [data-w="c13"] text { fill: var(--sx-detasare-sal-ink); }
/* golul și triunghiul (ca în program: fa-exclamation-triangle, roșu) */
.sx-detasare .sx-detasare-gap { fill: var(--sx-detasare-red-soft); stroke: var(--sx-detasare-red); stroke-width: 1; stroke-dasharray: 3 2.4; opacity: 0; transition: opacity .25s ease; }
.sx-detasare .sx-detasare-gtri { opacity: 0; transition: opacity .25s ease; }
.sx-detasare .has-gap .sx-detasare-gap, .sx-detasare .has-gap .sx-detasare-gtri { opacity: 1; }
.sx-detasare .sx-detasare-gtri-b { fill: var(--sx-detasare-red); stroke: var(--sx-detasare-red); stroke-width: 1.2; stroke-linejoin: round; }
.sx-detasare .sx-detasare-gtri-x { fill: none; stroke: var(--sx-detasare-on-red); stroke-width: 1.5; stroke-linecap: round; }
.sx-detasare .sx-detasare-gtri-d { fill: var(--sx-detasare-on-red); }
/* masa, pe masă */
.sx-detasare .sx-detasare-meal rect { fill: var(--sx-detasare-meal-soft); stroke: var(--sx-detasare-meal); stroke-width: .9; stroke-dasharray: 2.6 2; }
.sx-detasare .sx-detasare-meal-t { fill: var(--sx-detasare-meal); font-size: 8.8px; font-style: italic; text-anchor: middle; }

/* 3.4 etichetele de sub talere (lat) */
.sx-detasare .sx-detasare-keys {
  position: relative; z-index: 1; display: grid; grid-template-columns: 55% 45%; max-width: 520px; width: 100%; margin: 0 auto;
}
.sx-detasare .sx-detasare-key { margin: 0; display: grid; gap: 9px; align-content: start; }
.sx-detasare .sx-detasare-key--l { padding: 0 14px 0 3.5%; }
.sx-detasare .sx-detasare-key--r { padding-left: 7.4%; }
.sx-detasare .sx-detasare-key > div { display: grid; gap: 2px; }
.sx-detasare .sx-detasare-key dt { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 7px; font-size: 13.5px; line-height: 1.35; font-weight: 500; color: var(--sx-ink); letter-spacing: -0.012em; word-spacing: 0; }
.sx-detasare .sx-detasare-key dd { margin: 0 0 0 18px; font-size: 12.5px; line-height: 1.45; color: var(--sx-ink2); font-variant-numeric: tabular-nums; letter-spacing: -0.005em; word-spacing: 0; }
.sx-detasare .sx-detasare-sw { flex: 0 0 auto; display: inline-block; width: 11px; height: 11px; border-radius: 3px; transform: translateY(1px); }
.sx-detasare [data-k="c11"] .sx-detasare-sw { background: var(--sx-detasare-min); }
.sx-detasare [data-k="c12"] .sx-detasare-sw { background: var(--sx-detasare-pay); }
.sx-detasare [data-k="c13"] .sx-detasare-sw { background: var(--sx-detasare-sal); box-shadow: inset 0 0 0 1px var(--sx-detasare-sal-line); }
.sx-detasare [data-k="c14"] .sx-detasare-sw { background: repeating-linear-gradient(-45deg, var(--sx-detasare-sup) 0 1.2px, var(--sx-detasare-sup-bg) 1.2px 3.4px); box-shadow: inset 0 0 0 1px var(--sx-detasare-sup); }
.sx-detasare [data-k="masa"] .sx-detasare-sw { background: var(--sx-detasare-meal-soft); border: 1px dashed var(--sx-detasare-meal); }
.sx-detasare .sx-detasare-key-meal {
  grid-column: 1 / -1; display: flex; align-items: baseline; gap: 7px; margin: 12px 0 0; padding: 9px 0 0 3.5%;
  border-top: 1px dashed var(--sx-hair-strong); font-size: 12.5px; line-height: 1.45; color: var(--sx-ink2); letter-spacing: -0.005em; word-spacing: 0;
}
.sx-detasare .sx-detasare-key-meal b { font-weight: 500; color: var(--sx-ink); }
.sx-detasare .sx-detasare-scene:not([data-state="plus"]) [data-k="c14"] { display: none; }

/* 3.5 legenda scurtă (sub 960, lângă cântar) */
.sx-detasare .sx-detasare-legend {
  display: none; list-style: none; margin: 0; padding: 0; gap: 6px;
  font-size: 12px; line-height: 1.25; color: var(--sx-ink2); letter-spacing: -0.01em; word-spacing: 0;
}
.sx-detasare .sx-detasare-legend li { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.sx-detasare .sx-detasare-legend .sx-detasare-sw { transform: none; width: 10px; height: 10px; }

/* 3.6 sub 960: scena de sus = panglica + [cântarul | citirea și legenda], sub 300 px */
@media (max-width: 959px) {
  .sx-detasare .sx-detasare-scene {
    grid-template-columns: minmax(0, 1fr) 102px; grid-template-areas: "trip trip" "fig side";
    column-gap: 10px; row-gap: 8px; max-width: 540px;
  }
  .sx-detasare .sx-detasare-fig { margin: 0; align-self: center; }
  .sx-detasare .sx-detasare-keys { display: none; }
  .sx-detasare .sx-detasare-side { justify-items: start; align-content: center; gap: 14px; }
  .sx-detasare .sx-detasare-legend { display: grid; }
  .sx-detasare .sx-detasare-read { display: grid; gap: 4px; }
  .sx-detasare .sx-detasare-read-v { font-size: 21px; gap: 5px; }
  .sx-detasare .sx-detasare-tri-i { width: 16px; height: 16px; }
  .sx-detasare .sx-detasare-st-v { font-size: 16.5px; }
  .sx-detasare .sx-detasare-st-k { display: none; }
  .sx-detasare .sx-detasare-meal-t { font-size: 11.5px; }
  .sx-detasare .sx-detasare-brk { height: 18px; }
  .sx-detasare .sx-detasare-br b { font-size: 10.5px; bottom: 7px; }
  .sx-detasare .sx-detasare-band { height: 24px; }
  .sx-detasare .sx-detasare-c { font-size: 9px; letter-spacing: .03em; }
  .sx-detasare .sx-detasare-c--post { gap: 4px; padding-right: 6px; }
  .sx-detasare .sx-detasare-c--post b { font-size: 11.5px; }
  .sx-detasare .sx-detasare-c--post span { font-size: 10.5px; }
  .sx-detasare .sx-detasare-pick { height: 28px; margin-top: 7px; }
  .sx-detasare .sx-detasare-pk { height: 28px; font-size: 12px; }
  .sx-detasare .sx-detasare-t0, .sx-detasare .sx-detasare-t1 { line-height: 28px; font-size: 11px; }
  .sx-detasare .sx-detasare-y { display: none; }
}

/* ---------- 4. Frontiera și pașii ---------- */
.sx-detasare .sx-detasare-flow { position: relative; z-index: 1; min-width: 0; }
.sx-detasare .sx-detasare-intro, .sx-detasare .sx-detasare-step-in { display: grid; gap: 14px; justify-items: start; }
.sx-detasare :is(.sx-detasare-intro, .sx-detasare-step-in) > * { max-width: 100%; }
.sx-detasare .sx-detasare-steps { list-style: none; margin: 64px 0 0; padding: 0; position: relative; z-index: 1; }
.sx-detasare:not(.sx-detasare-js) .sx-detasare-flow { margin-top: 40px; }
.sx-detasare .sx-detasare-step { position: relative; }
.sx-detasare .sx-detasare-step + .sx-detasare-step { margin-top: 64px; }
.sx-detasare .sx-detasare-k { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; font-size: 13.5px; line-height: 1.4; color: var(--sx-ink2); letter-spacing: -0.008em; word-spacing: 0; font-variant-numeric: tabular-nums; }
.sx-detasare .sx-detasare-k span + span::before { content: "·"; margin: 0 8px; color: var(--sx-ink2); }
.sx-detasare .sx-detasare-k-d { font-weight: 600; color: var(--sx-ink); }
.sx-detasare :is(.sx-detasare-intro, .sx-detasare-step) h3 { font-size: 22px; line-height: 1.22; letter-spacing: -0.016em; text-wrap: balance; }
.sx-detasare .sx-detasare-p { font-size: 16px; line-height: 1.6; color: var(--sx-ink2); max-width: 46ch; text-wrap: pretty; }
.sx-detasare .sx-detasare-p b { color: var(--sx-ink); }
.sx-detasare .sx-detasare-p--2 { margin-top: 10px; }
@media (min-width: 960px) {
  .sx-detasare.sx-detasare-js .sx-detasare-steps { margin-top: clamp(96px, 14vh, 150px); }
  .sx-detasare.sx-detasare-js .sx-detasare-step + .sx-detasare-step { margin-top: clamp(96px, 14vh, 150px); }
  .sx-detasare.sx-detasare-js .sx-detasare-step:last-child { padding-bottom: clamp(32px, 7vh, 80px); }
  .sx-detasare.sx-detasare-js .sx-detasare-step.is-on .sx-detasare-k::before {
    content: ""; flex: 0 0 auto; width: 7px; height: 7px; margin-right: 9px; border-radius: 50%; background: var(--sx-accent);
    box-shadow: 0 0 0 4px var(--sx-accent-soft);
  }
}
@media (max-width: 959px) {
  .sx-detasare .sx-detasare-intro { padding-top: 28px; }
  .sx-detasare.sx-detasare-js .sx-detasare-steps { margin-top: 52px; }
  .sx-detasare.sx-detasare-js .sx-detasare-step + .sx-detasare-step { margin-top: 60px; }
}
/* pe lat, pașii care nu sunt la rând: fragmentul se stinge, textul rămâne citibil (pe telefon nu: acolo pasul
   pornește de la titlu, iar fragmentul pasului de dinainte e încă cel citit) */
@media (min-width: 960px) {
  .sx-detasare.sx-detasare-js :is(.sx-detasare-frag, .sx-detasare-dlgs, .sx-detasare-strip) { transition: opacity .45s var(--sx-ease); }
  .sx-detasare.sx-detasare-js .sx-detasare-step:not(.is-on) :is(.sx-detasare-frag, .sx-detasare-dlgs, .sx-detasare-strip) { opacity: .42; }
}

/* mesajul de frontieră, din aplicația șoferului */
.sx-detasare .sx-detasare-msg {
  width: min(100%, 352px); padding: 10px 14px 12px; border-radius: 12px; background: var(--sx-detasare-card); color: var(--sx-ink);
  box-shadow: var(--sx-detasare-card-shadow); letter-spacing: 0; word-spacing: 0;
}
.sx-detasare .sx-detasare-msg-h { display: flex; align-items: center; gap: 7px; margin-bottom: 5px; font-size: 11.5px; line-height: 1.3; color: var(--sx-ink2); white-space: nowrap; }
.sx-detasare .sx-detasare-msg-h time { margin-left: auto; color: var(--sx-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.sx-detasare .sx-detasare-msg-i { width: 14px; height: 14px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sx-detasare .sx-detasare-msg-b { font-size: 13px; line-height: 1.45; font-weight: 500; color: var(--sx-ink); }

/* ---------- 5. Fragmentele din program (desenate, cifre fictive) ---------- */
.sx-detasare .sx-detasare-frag { container-type: inline-size; display: grid; gap: 14px; width: 100%; margin-top: 4px; }
.sx-detasare .sx-detasare-win { background: var(--sx-detasare-card); border-radius: 12px; box-shadow: var(--sx-detasare-card-shadow); overflow: hidden; color: var(--sx-detasare-cell); }
.sx-detasare .sx-detasare-win, .sx-detasare .sx-detasare-win *, .sx-detasare .sx-detasare-dlg, .sx-detasare .sx-detasare-dlg *,
.sx-detasare .sx-detasare-sheet, .sx-detasare .sx-detasare-sheet *, .sx-detasare .sx-detasare-papers, .sx-detasare .sx-detasare-papers *,
.sx-detasare .sx-detasare-strip, .sx-detasare .sx-detasare-strip * { letter-spacing: 0; word-spacing: 0; }
.sx-detasare .sx-detasare-win-h { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 9px; padding: 10px 14px; border-bottom: 1px solid var(--sx-detasare-grid); font-size: 12.5px; line-height: 1.35; }
.sx-detasare .sx-detasare-win-h b { font-weight: 600; color: var(--sx-ink); }
.sx-detasare .sx-detasare-win-m { margin-left: auto; font-size: 11.5px; color: var(--sx-ink2); font-variant-numeric: tabular-nums; }
.sx-detasare .sx-detasare-tag { font-size: 10.5px; font-weight: 500; line-height: 1.5; padding: 1px 8px; border-radius: var(--sx-r-pill); background: var(--sx-detasare-track); color: var(--sx-ink2); white-space: nowrap; }
.sx-detasare .sx-detasare-win-h--modal { justify-content: center; text-align: center; padding: 11px 38px; position: relative; }
.sx-detasare .sx-detasare-win-h--modal b { color: var(--sx-accent-text); font-weight: 600; }
.sx-detasare .sx-detasare-x { position: absolute; right: 12px; top: 50%; transform: translateY(-52%); font-size: 22px; line-height: 1; font-weight: 300; color: var(--sx-ink2); }
.sx-detasare .sx-detasare-win-b { padding: 12px 14px 14px; }

.sx-detasare .sx-detasare-t { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 12px; line-height: 1.3; font-variant-numeric: tabular-nums; }
.sx-detasare .sx-detasare-t th, .sx-detasare .sx-detasare-t td { border: 1px solid var(--sx-detasare-grid); padding: 5px 6px; }
.sx-detasare .sx-detasare-t th {
  background: var(--sx-detasare-th); vertical-align: bottom; text-align: left; font-size: 9.6px; line-height: 1.25; font-weight: 600;
  color: var(--sx-ink2); overflow-wrap: break-word; hyphens: manual;
}
.sx-detasare .sx-detasare-t th i { font-style: normal; color: var(--sx-ink); white-space: nowrap; }
.sx-detasare .sx-detasare-t td { text-align: right; white-space: nowrap; color: var(--sx-detasare-cell); }
.sx-detasare .sx-detasare-t td:nth-child(-n+2) { text-align: left; }
/* lățimile coloanelor (table-layout: fixed le ia din antet) */
/* raportul tipărit: 5 coloane; sub 420 px fără „Începând cu Data de” */
.sx-detasare .sx-detasare-t--set th:nth-child(1) { width: 23%; }
.sx-detasare .sx-detasare-t--set th:nth-child(2) { width: 19%; }
.sx-detasare .sx-detasare-t--set th:nth-child(3) { width: 17%; }
.sx-detasare .sx-detasare-t--set th:nth-child(4) { width: 19%; }
.sx-detasare .sx-detasare-t--set th:nth-child(5) { width: 22%; }
.sx-detasare .sx-detasare-t--set td.c-d { text-align: center; }
/* Calcul Detașare și fereastra salvată: c12 și c13 stau pe cântar; în tabel apar doar de la 560 px în sus */
.sx-detasare .sx-detasare-t--calc :is(.c-12, .c-13), .sx-detasare .sx-detasare-t--saved .c-12 { display: none; }
.sx-detasare .sx-detasare-t--calc th:nth-child(1) { width: 22%; }
.sx-detasare .sx-detasare-t--calc th:nth-child(2) { width: 10%; }
.sx-detasare .sx-detasare-t--calc th { width: 21%; }
.sx-detasare .sx-detasare-t--calc th:last-child { width: 26%; }
.sx-detasare .sx-detasare-t--saved th:nth-child(1) { width: 20%; }
.sx-detasare .sx-detasare-t--saved th:nth-child(2) { width: 9%; }
.sx-detasare .sx-detasare-t--saved th { width: 16%; }
.sx-detasare .sx-detasare-t--saved th:nth-child(5) { width: 20%; }
.sx-detasare .sx-detasare-t--saved th:last-child { width: 19%; }
.sx-detasare .sx-detasare-t--saved th, .sx-detasare .sx-detasare-t--saved td { border-left: 0; border-right: 0; }
@container (min-width: 560px) {
  .sx-detasare .sx-detasare-t--calc :is(th.c-12, th.c-13) { display: table-cell; width: 13%; }
  .sx-detasare .sx-detasare-t--calc :is(td.c-12, td.c-13) { display: table-cell; }
  .sx-detasare .sx-detasare-t--calc th { width: 13%; }
  .sx-detasare .sx-detasare-t--calc th:nth-child(1) { width: 18%; }
  .sx-detasare .sx-detasare-t--calc th:nth-child(2) { width: 8%; }
  .sx-detasare .sx-detasare-t--calc th:last-child { width: 22%; }
  .sx-detasare .sx-detasare-t--saved :is(th.c-12, td.c-12) { display: table-cell; }
  .sx-detasare .sx-detasare-t--saved th { width: 13%; }
  .sx-detasare .sx-detasare-t--saved th:nth-child(5) { width: 17%; }
}
@container (max-width: 420px) {
  .sx-detasare .sx-detasare-t--set .c-d { display: none; }
  .sx-detasare .sx-detasare-t--set th:nth-child(1) { width: 29%; }
  .sx-detasare .sx-detasare-t--set th:nth-child(3), .sx-detasare .sx-detasare-t--set th:nth-child(4) { width: 22%; }
  .sx-detasare .sx-detasare-t--set th:nth-child(5) { width: 27%; }
  .sx-detasare .sx-detasare-t--calc th:nth-child(1) { width: 24%; }
  .sx-detasare .sx-detasare-t--calc th:nth-child(2) { width: 10%; }
  .sx-detasare .sx-detasare-t--calc th { width: 20%; }
  .sx-detasare .sx-detasare-t--calc th:last-child { width: 26%; }
  .sx-detasare .sx-detasare-t--saved th:nth-child(1) { width: 24%; }
  .sx-detasare .sx-detasare-t--saved th:nth-child(2) { width: 9%; }
  .sx-detasare .sx-detasare-t--saved th { width: 15%; }
  .sx-detasare .sx-detasare-t--saved th:nth-child(5) { width: 18%; }
  .sx-detasare .sx-detasare-t--saved th:last-child { width: 19%; }
}
.sx-detasare .sx-detasare-t mark {
  color: inherit; padding: 1px 4px; margin: -1px -4px; border-radius: 4px;
  background: linear-gradient(var(--sx-detasare-mark), var(--sx-detasare-mark)) no-repeat 0 0 / 100% 100%;
}
/* triunghiul roșu din Calcul Detașare și inelul nostru (vocea sitului) */
.sx-detasare .sx-detasare-t td.c16 { position: relative; color: var(--sx-detasare-red-t); font-weight: 600; }
.sx-detasare .sx-detasare-t td.c16 .sx-detasare-tri-i { display: inline-block; width: 13px; height: 13px; margin-right: 5px; vertical-align: -2px; }
.sx-detasare .sx-detasare-ring { position: absolute; inset: 2px; border: 1.5px solid var(--sx-accent); border-radius: 6px; pointer-events: none; }
.sx-detasare .sx-detasare-t tr.is-neg td { background: transparent; }
/* fereastra salvată: c12 și suplimentara cu bg-primary, ca în program */
.sx-detasare .sx-detasare-t td.is-pri { background: var(--sx-detasare-pri); color: var(--sx-detasare-pri-ink); border-color: var(--sx-detasare-pri); }
.sx-detasare .sx-detasare-c14 { padding: 3px 5px; }
.sx-detasare .sx-detasare-in {
  display: inline-grid; grid-template-columns: auto 1px; align-items: center; column-gap: 1px; width: 100%; max-width: 70px; min-height: 22px;
  padding: 1px 5px; border-radius: 3px; background: var(--sx-detasare-input); border: 1px solid var(--sx-detasare-input-line); color: var(--sx-detasare-input-ink);
  font-weight: 600; justify-content: end;
}
.sx-detasare .sx-detasare-in > .i0, .sx-detasare .sx-detasare-in > .i9 { grid-area: 1 / 1; justify-self: end; }
.sx-detasare .sx-detasare-caret { grid-area: 1 / 2; width: 1px; height: 13px; background: currentColor; opacity: 0; }
.sx-detasare .sx-detasare-sw2 { display: inline-grid; justify-items: end; }
.sx-detasare .sx-detasare-sw2 > span { grid-area: 1 / 1; }
.sx-detasare .sx-detasare-in .i0, .sx-detasare .sx-detasare-sw2 .o, .sx-detasare .sx-detasare-dlg-in .i0 { opacity: 0; }
.sx-detasare .sx-detasare-win-f { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 10px 14px 12px; border-top: 1px solid var(--sx-detasare-grid); font-size: 11.5px; line-height: 1.35; }
.sx-detasare .sx-detasare-win-f b { flex: 1 1 100%; margin-bottom: 3px; font-weight: 600; color: var(--sx-ink); }
.sx-detasare .sx-detasare-bt {
  display: inline-flex; align-items: center; min-height: 26px; padding: 3px 10px; border-radius: 5px; white-space: nowrap;
  border: 1px solid var(--sx-detasare-grid); background: var(--sx-detasare-th); color: var(--sx-ink); font-size: 11.5px; font-weight: 500;
}
.sx-detasare .sx-detasare-bt--pri { background: var(--sx-detasare-pri); border-color: var(--sx-detasare-pri); color: var(--sx-detasare-pri-ink); }
.sx-detasare .sx-detasare-bt--dist { box-shadow: 0 0 0 3px var(--sx-detasare-mark); }

/* raportul din Setări: o tipăritură, nu o fereastră */
.sx-detasare .sx-detasare-sheet {
  position: relative; padding: 18px 18px 22px; background: var(--sx-detasare-paper); color: var(--sx-detasare-paper-ink);
  filter: var(--sx-detasare-paper-drop); transform: rotate(-.7deg); transform-origin: 30% 100%;
}
.sx-detasare .sx-detasare-sheet-t { margin: 0 auto 12px; max-width: 32em; text-align: center; font-size: 12.5px; line-height: 1.4; font-weight: 700; color: inherit; text-wrap: balance; }
.sx-detasare .sx-detasare-sheet .sx-detasare-t th { background: transparent; color: var(--sx-detasare-paper-mute); border-color: var(--sx-detasare-paper-rule); }
.sx-detasare .sx-detasare-sheet .sx-detasare-t td { background: transparent; color: var(--sx-detasare-paper-ink); border-color: var(--sx-detasare-paper-rule); }
.sx-detasare .sx-detasare-sheet .sx-detasare-t mark { background-image: linear-gradient(var(--sx-detasare-paper-hl), var(--sx-detasare-paper-hl)); }
.sx-detasare .sx-detasare-src { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 9px; margin-top: -2px; font-size: 12.5px; line-height: 1.4; color: var(--sx-ink2); letter-spacing: -0.004em; word-spacing: 0; }

/* adnotarea (vocea sitului) */
.sx-detasare .sx-detasare-ann { position: relative; padding-left: 17px; max-width: 42ch; font-size: 14.5px; line-height: 1.5; color: var(--sx-ink2); letter-spacing: -0.01em; word-spacing: -0.04em; text-wrap: pretty; }
.sx-detasare .sx-detasare-ann::before { content: ""; position: absolute; left: 1px; top: .5em; width: 7px; height: 7px; border-radius: 50%; background: var(--sx-accent); box-shadow: 0 0 0 3px var(--sx-accent-soft); }
.sx-detasare .sx-detasare-ann b { color: var(--sx-ink); }

/* distribuirea pe lună: prompt() și alert() din browser, una peste alta */
.sx-detasare .sx-detasare-dlgs { display: grid; width: 100%; padding: 2px 0 4px; }
.sx-detasare .sx-detasare-dlg {
  grid-area: 1 / 1; width: min(88%, 330px); padding: 16px 18px 14px; border-radius: 12px;
  background: var(--sx-detasare-sys); color: var(--sx-detasare-sys-ink); box-shadow: var(--sx-detasare-sys-shadow);
  font-family: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif; font-size: 13px; line-height: 20px;
}
.sx-detasare .sx-detasare-dlg p { color: var(--sx-detasare-sys-ink); font-variant-numeric: tabular-nums; }
.sx-detasare .sx-detasare-dlg--p { justify-self: start; align-self: start; }
.sx-detasare .sx-detasare-dlg--a { justify-self: end; align-self: start; margin-top: 92px; z-index: 1; }
.sx-detasare .sx-detasare-dlg-in {
  display: grid; margin-top: 10px; height: 32px; padding: 0 10px; align-items: center; border-radius: 4px;
  box-shadow: inset 0 0 0 2px var(--sx-detasare-sys-ok); background: var(--sx-detasare-sys);
}
.sx-detasare .sx-detasare-dlg-in > span { grid-area: 1 / 1; }
.sx-detasare .sx-detasare-dlg-b { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.sx-detasare .sx-detasare-dlg-b span { display: inline-flex; align-items: center; height: 30px; padding: 0 16px; border-radius: var(--sx-r-pill); font-size: 13px; font-weight: 600; }
.sx-detasare .sx-detasare-dlg-b .ok { background: var(--sx-detasare-sys-ok); color: var(--sx-detasare-sys-ok-ink); }
.sx-detasare .sx-detasare-dlg-b .no { color: var(--sx-detasare-sys-ok); box-shadow: inset 0 0 0 1px var(--sx-detasare-sys-line); }

/* rândul din program cu plafonul lunar (bg-warning) */
.sx-detasare .sx-detasare-strip { width: min(100%, 360px); margin-top: 2px; border-radius: 8px; overflow: hidden; background: var(--sx-detasare-card); box-shadow: var(--sx-detasare-card-shadow); }
.sx-detasare .sx-detasare-strip span { display: block; padding: 9px 13px; background: var(--sx-detasare-warn); color: var(--sx-detasare-warn-ink); font-size: 13px; line-height: 1.35; font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------- 6. Ce se mișcă în fragmente, doar cu .sx-detasare-motion (pornește când fragmentul se vede: .is-play) ---------- */
/* pasul 1: valorile de acoperit din salariu se subliniază */
.sx-detasare.sx-detasare-motion .sx-detasare-sheet:not(.is-play) .sx-detasare-t mark { background-size: 0% 100%; transition: none; }
.sx-detasare.sx-detasare-motion .sx-detasare-sheet.is-play .sx-detasare-t mark { transition: background-size .55s var(--sx-ease) .3s; }
.sx-detasare.sx-detasare-motion .sx-detasare-sheet.is-play .sx-detasare-t tr.is-fr mark { transition-delay: .55s; }
/* pasul 2: inelul în jurul diferenței cu triunghi */
.sx-detasare.sx-detasare-motion .sx-detasare-frag--calc:not(.is-play) .sx-detasare-ring { opacity: 0; transform: scale(.88, .7); transition: none; }
.sx-detasare.sx-detasare-motion .sx-detasare-frag--calc.is-play .sx-detasare-ring { transition: opacity .3s ease .4s, transform .5s var(--sx-ease) .4s; }
/* pasul 3: „0” devine „9”, totalul și diferența se refac pe loc */
.sx-detasare.sx-detasare-motion .sx-detasare-frag--saved:not(.is-play) :is(.sx-detasare-in .i9, .sx-detasare-sw2 .n) { opacity: 0; transition: none; }
.sx-detasare.sx-detasare-motion .sx-detasare-frag--saved:not(.is-play) :is(.sx-detasare-in .i0, .sx-detasare-sw2 .o) { opacity: 1; transition: none; }
.sx-detasare.sx-detasare-motion .sx-detasare-frag--saved:not(.is-play) .sx-detasare-bt--dist { box-shadow: none; transition: none; }
.sx-detasare.sx-detasare-motion .sx-detasare-frag--saved.is-play .sx-detasare-in .i0 { transition: opacity .01s linear .34s; }
.sx-detasare.sx-detasare-motion .sx-detasare-frag--saved.is-play .sx-detasare-in .i9 { transition: opacity .01s linear .4s; }
.sx-detasare.sx-detasare-motion .sx-detasare-frag--saved.is-play .sx-detasare-caret { animation: sx-detasare-caret 1s steps(1) 0s 2; }
.sx-detasare.sx-detasare-motion .sx-detasare-frag--saved.is-play .sx-detasare-sw2 > span { transition: opacity .01s linear .62s; }   /* schimb pe loc, nu cifre suprapuse */
.sx-detasare.sx-detasare-motion .sx-detasare-frag--saved.is-play .sx-detasare-swc { animation: sx-detasare-flash 1.3s ease-out .62s 1; }
.sx-detasare.sx-detasare-motion .sx-detasare-frag--saved.is-play .sx-detasare-bt--dist { transition: box-shadow .4s ease 1.05s; }
/* distribuirea pe lună: întrebarea, „36”, apoi răspunsul */
.sx-detasare.sx-detasare-motion .sx-detasare-dlgs:not(.is-play) .sx-detasare-dlg { opacity: 0; transform: translateY(10px) scale(.98); transition: none; }
.sx-detasare.sx-detasare-motion .sx-detasare-dlgs:not(.is-play) .sx-detasare-dlg-in .i36 { opacity: 0; transition: none; }
.sx-detasare.sx-detasare-motion .sx-detasare-dlgs:not(.is-play) .sx-detasare-dlg-in .i0 { opacity: 1; transition: none; }
.sx-detasare.sx-detasare-motion .sx-detasare-dlgs.is-play .sx-detasare-dlg--p { transition: opacity .35s var(--sx-ease) .15s, transform .5s var(--sx-ease) .15s; }
.sx-detasare.sx-detasare-motion .sx-detasare-dlgs.is-play .sx-detasare-dlg-in .i0 { transition: opacity .01s linear .62s; }
.sx-detasare.sx-detasare-motion .sx-detasare-dlgs.is-play .sx-detasare-dlg-in .i36 { transition: opacity .01s linear .68s; }
.sx-detasare.sx-detasare-motion .sx-detasare-dlgs.is-play .sx-detasare-dlg--a { transition: opacity .35s var(--sx-ease) 1.3s, transform .5s var(--sx-ease) 1.3s; }
/* panglica: ziua aleasă alunecă pe bandă */
.sx-detasare.sx-detasare-motion .sx-detasare-dayhl { transition: left .55s var(--sx-ease); }
@keyframes sx-detasare-caret { 0% { opacity: 1; } 50% { opacity: 0; } }
@keyframes sx-detasare-flash { 0% { background-color: var(--sx-detasare-mark); } 100% { background-color: transparent; } }

/* ---------- 7. Actele lunii: ordinul, fișa de venit, Centralizatorul ---------- */
.sx-detasare .sx-detasare-docs {
  display: grid; gap: 30px; margin-top: clamp(56px, 8vw, 104px); padding-top: clamp(36px, 4.5vw, 56px);
  border-top: 1px solid var(--sx-hair);
}
.sx-detasare .sx-detasare-docs-t h3 { font-size: 22px; line-height: 1.22; letter-spacing: -0.016em; margin-bottom: 14px; text-wrap: balance; }
.sx-detasare .sx-detasare-docs-t p { font-size: 16px; line-height: 1.6; color: var(--sx-ink2); max-width: 44ch; text-wrap: pretty; }
.sx-detasare .sx-detasare-docs-t p + p { margin-top: 10px; }
.sx-detasare .sx-detasare-docs-v { display: grid; gap: 16px; min-width: 0; container-type: inline-size; }
@media (min-width: 960px) {
  .sx-detasare .sx-detasare-docs { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); column-gap: clamp(40px, 5vw, 72px); align-items: start; }
  .sx-detasare .sx-detasare-docs-t { padding-top: 8px; position: sticky; top: 18vh; }
}
/* foile: Fisa Venit în spate, ordinul în față */
.sx-detasare .sx-detasare-papers { position: relative; padding: 4px 0 2px; }
.sx-detasare .sx-detasare-fv, .sx-detasare .sx-detasare-ord { background: var(--sx-detasare-paper); color: var(--sx-detasare-paper-ink); filter: var(--sx-detasare-paper-drop); }
.sx-detasare .sx-detasare-fv {
  position: relative; width: 58%; padding: 14px 18px 48px; transform: rotate(-2deg); transform-origin: 20% 100%;
  display: grid; gap: 5px; font-size: 11.5px; line-height: 1.4;
}
.sx-detasare .sx-detasare-fv-t { margin-bottom: 4px; text-align: center; font-size: 13px; font-weight: 700; color: inherit; }
.sx-detasare .sx-detasare-fv-r { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 4px; border-bottom: 1px solid var(--sx-detasare-paper-rule); }
.sx-detasare .sx-detasare-fv-r i { font-style: normal; color: var(--sx-detasare-paper-mute); }
.sx-detasare .sx-detasare-fv-r b { font-weight: 600; white-space: nowrap; color: inherit; font-variant-numeric: tabular-nums; }
.sx-detasare .sx-detasare-ord {
  position: relative; width: 84%; margin: -60px 0 0 16%; padding: 22px 26px 20px; transform: rotate(.5deg);
  font-size: 12px; line-height: 1.6;
}
.sx-detasare .sx-detasare-ord p { margin: 0; color: inherit; }
.sx-detasare .sx-detasare-ord b { font-weight: 700; color: inherit; }
.sx-detasare .sx-detasare-ord-t { display: grid; gap: 1px; text-align: center; font-size: 13.5px; line-height: 1.35; }
.sx-detasare .sx-detasare-ord-t span { font-size: 12.5px; }
.sx-detasare .sx-detasare-ord .sx-detasare-ord-d { margin: 9px 0 11px; text-align: center; font-variant-numeric: tabular-nums; }
.sx-detasare .sx-detasare-ord-p { text-indent: 2.4em; text-align: justify; hyphens: manual; }
.sx-detasare .sx-detasare-ord .sx-detasare-ord-c { margin-top: 6px; }
.sx-detasare .sx-detasare-ord .sx-detasare-ord-s { display: flex; justify-content: space-around; gap: 16px; margin-top: 20px; font-size: 11.5px; color: var(--sx-detasare-paper-mute); text-align: center; }
/* semnul nostru pe țări: detașarea (accent), delegarea (punctat); tipărit, ordinul are doar textul */
.sx-detasare .sx-detasare-cc { padding-bottom: 1px; background: repeating-linear-gradient(90deg, var(--sx-detasare-paper-mute) 0 3px, transparent 3px 5px) 0 100% / 100% 1.5px no-repeat; }
.sx-detasare .sx-detasare-cc.is-p { background: linear-gradient(var(--sx-detasare-paper-acc), var(--sx-detasare-paper-acc)) 0 100% / 100% 2px no-repeat; }
.sx-detasare .sx-detasare-oc { transition: opacity .2s ease; }
.sx-detasare .sx-detasare-cl.is-wait .sx-detasare-oc:not(.is-on) { opacity: 0; }
/* Centralizator Deplasări: rândul deplasării */
.sx-detasare .sx-detasare-acts { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; }
.sx-detasare .sx-detasare-ib {
  display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 8px; border-radius: 6px;
  border: 1px solid var(--sx-detasare-grid); font-size: 11.5px; font-weight: 600; color: var(--sx-ink);
}
.sx-detasare .sx-detasare-ib svg, .sx-detasare .sx-detasare-pr svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sx-detasare .sx-detasare-ib--xl svg { stroke: var(--sx-ok); }
.sx-detasare .sx-detasare-cent .sx-detasare-t { font-size: 12.5px; }
.sx-detasare .sx-detasare-cent .sx-detasare-t th { font-size: 10px; padding: 7px 8px; }
.sx-detasare .sx-detasare-cent .sx-detasare-t td { padding: 9px 8px; }
.sx-detasare .sx-detasare-cent .sx-detasare-t :is(th, td):first-child { border-left: 0; }
.sx-detasare .sx-detasare-cent .sx-detasare-t :is(th, td):last-child { border-right: 0; }
.sx-detasare .sx-detasare-cent .sx-detasare-t td { border-bottom: 0; }
.sx-detasare .sx-detasare-t--cent th:nth-child(1) { width: 8%; }
.sx-detasare .sx-detasare-t--cent th:nth-child(2) { width: 15%; }
.sx-detasare .sx-detasare-t--cent th:nth-child(3) { width: 19%; }
.sx-detasare .sx-detasare-t--cent th:nth-child(4) { width: 13%; }
.sx-detasare .sx-detasare-t--cent th:nth-child(5) { width: 14%; }
.sx-detasare .sx-detasare-t--cent th:nth-child(6) { width: 14%; }
.sx-detasare .sx-detasare-t--cent th:nth-child(7) { width: 17%; }
.sx-detasare .sx-detasare-t--cent td:nth-child(3) { text-align: left; }
.sx-detasare .sx-detasare-od { display: inline-flex; align-items: center; gap: 7px; }
.sx-detasare .sx-detasare-pr { display: inline-grid; place-items: center; width: 22px; height: 20px; border-radius: 5px; border: 1px solid var(--sx-detasare-grid); color: var(--sx-ink2); }
.sx-detasare .sx-detasare-t--cent .m-tot { font-weight: 700; }
.sx-detasare .sx-detasare-t--cent :is(.m-post, .m-del) span { padding-bottom: 2px; }
.sx-detasare .sx-detasare-t--cent .m-post span { background: linear-gradient(var(--sx-accent), var(--sx-accent)) 0 100% / 100% 2px no-repeat; }
.sx-detasare .sx-detasare-t--cent .m-del span { background: repeating-linear-gradient(90deg, var(--sx-detasare-c-ink) 0 3px, transparent 3px 5px) 0 100% / 100% 1.5px no-repeat; }
.sx-detasare .sx-detasare-ann--ord { margin-top: 4px; }
.sx-detasare .sx-detasare-src--cent { margin-top: -4px; font-size: 13px; }

/* ---------- 8. De știut ---------- */
.sx-detasare .sx-detasare-foot { display: grid; gap: 14px 56px; margin-top: clamp(52px, 6.5vw, 84px); }
.sx-detasare .sx-detasare-foot h3 { font-size: 16px; line-height: 1.3; }
.sx-detasare .sx-detasare-know { list-style: none; margin: 0; padding: 0; display: grid; }
.sx-detasare .sx-detasare-know li {
  position: relative; padding: 11px 0 11px 22px; border-top: 1px solid var(--sx-hair);
  font-size: 15px; line-height: 1.5; color: var(--sx-ink2); max-width: 64ch; text-wrap: pretty;
}
.sx-detasare .sx-detasare-know li:last-child { border-bottom: 1px solid var(--sx-hair); }
.sx-detasare .sx-detasare-know li::before {
  content: ""; position: absolute; left: 3px; top: calc(11px + .75em - 3.5px); width: 7px; height: 7px; border-radius: 50%;
  box-shadow: inset 0 0 0 1.5px var(--sx-ink2);
}
.sx-detasare .sx-detasare-foot-c { margin-top: 4px; font-size: 13px; line-height: 1.45; color: var(--sx-ink2); }
@media (min-width: 960px) {
  .sx-detasare .sx-detasare-foot { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); column-gap: clamp(40px, 5vw, 72px); align-items: start; }
  .sx-detasare .sx-detasare-foot h3 { padding-top: 11px; }
  .sx-detasare .sx-detasare-foot-c { grid-column: 2; }
}

/* ---------- 9. Coloana îngustă (960–1199), ecrane scunde și telefonul ---------- */
@media (min-width: 960px) and (max-width: 1199px) {
  .sx-detasare .sx-detasare-read-v { font-size: 25px; }
}
@media (min-width: 960px) and (max-height: 780px) {
  .sx-detasare .sx-detasare-svg { max-width: 410px; }
  .sx-detasare .sx-detasare-scene { row-gap: 9px; }
  .sx-detasare .sx-detasare-key { gap: 6px; }
  .sx-detasare .sx-detasare-key-meal { margin-top: 8px; padding-top: 7px; }
}
@media (max-width: 639px) {
  .sx-detasare .sx-detasare-pk { padding: 0 8px; }
  .sx-detasare .sx-detasare-pk--14 { left: calc(33.6287% - 25px); width: 50px; }
  .sx-detasare .sx-detasare-pk--18 { width: 50px; }
  .sx-detasare .sx-detasare-pair { left: calc(59.1493% - 25px); gap: 3px; }
  .sx-detasare .sx-detasare-c--thin { font-size: 0; }
  .sx-detasare :is(.sx-detasare-intro, .sx-detasare-step) h3 { font-size: 20px; }
  .sx-detasare .sx-detasare-p { font-size: 15.5px; }
  .sx-detasare .sx-detasare-win-h, .sx-detasare .sx-detasare-win-b, .sx-detasare .sx-detasare-win-f { padding-inline: 11px; }
  .sx-detasare .sx-detasare-win-h.sx-detasare-win-h--modal { padding-inline: 32px; }
  .sx-detasare .sx-detasare-x { right: 10px; }
  .sx-detasare .sx-detasare-t th, .sx-detasare .sx-detasare-t td { padding: 4px 4px; }
  .sx-detasare .sx-detasare-t { font-size: 11.5px; }
  .sx-detasare .sx-detasare-t th { font-size: 9.4px; }
  .sx-detasare .sx-detasare-sheet { padding: 14px 12px 16px; }
  .sx-detasare .sx-detasare-sheet-t { font-size: 12px; }
  .sx-detasare .sx-detasare-dlg { width: min(90%, 300px); padding: 14px 15px 12px; font-size: 12.5px; line-height: 19px; }
  .sx-detasare .sx-detasare-dlg--a { margin-top: 104px; }
  .sx-detasare .sx-detasare-docs-t h3 { font-size: 20px; }
  .sx-detasare .sx-detasare-docs-t p { font-size: 15.5px; }
  .sx-detasare .sx-detasare-fv { width: 84%; margin-left: 1%; padding: 12px 14px 40px; font-size: 11px; transform: rotate(-2deg); }
  .sx-detasare .sx-detasare-ord { width: 96%; margin: -44px 0 0 4%; padding: 18px 16px 16px; font-size: 11.5px; line-height: 1.55; transform: rotate(.4deg); }
  .sx-detasare .sx-detasare-ord-t { font-size: 12.5px; }
  .sx-detasare .sx-detasare-ord-t span { font-size: 11.5px; }
  .sx-detasare .sx-detasare-ord-p { text-align: left; text-indent: 1.4em; }
  .sx-detasare .sx-detasare-ord .sx-detasare-ord-s { font-size: 10.5px; }
  /* Centralizatorul, întors: etichetele din program pe stânga, valorile pe dreapta */
  .sx-detasare .sx-detasare-t--cent thead { display: none; }
  .sx-detasare .sx-detasare-t--cent, .sx-detasare .sx-detasare-t--cent tbody, .sx-detasare .sx-detasare-t--cent tr { display: block; width: 100%; }
  .sx-detasare .sx-detasare-cent .sx-detasare-t--cent td {
    display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 8px 12px;
    border: 0; border-bottom: 1px solid var(--sx-detasare-grid); text-align: right; white-space: nowrap;
  }
  .sx-detasare .sx-detasare-cent .sx-detasare-t--cent td:last-child { border-bottom: 0; }
  .sx-detasare .sx-detasare-t--cent td::before { content: attr(data-l); font-size: 11.5px; font-weight: 600; color: var(--sx-ink2); text-align: left; white-space: normal; }
  .sx-detasare .sx-detasare-ib { padding: 0 7px; }
  .sx-detasare .sx-detasare-know li { font-size: 14.5px; }
  .sx-detasare .sx-detasare-step::before { display: none; }
}
@media (max-width: 340px) {
  .sx-detasare .sx-detasare-tm { display: none; }
  .sx-detasare .sx-detasare-scene { grid-template-columns: minmax(0, 1fr) 94px; }
  .sx-detasare .sx-detasare-legend { font-size: 11px; }
}

/* ---------- 10. Mișcare redusă: nimic nu se mișcă (base.css taie tranzițiile; aici și ce e scris pe loc) ---------- */
@media (prefers-reduced-motion: reduce) {
  .sx-detasare .sx-detasare-read-v, .sx-detasare .sx-detasare-gap, .sx-detasare .sx-detasare-gtri, .sx-detasare .sx-detasare-dayhl, .sx-detasare .sx-detasare-oc { transition: none !important; }
  .sx-detasare .sx-detasare-caret { animation: none !important; }
}
@media print {
  .sx-detasare .sx-detasare-pin { position: static !important; }
  .sx-detasare .sx-detasare-step:not(.is-on) :is(.sx-detasare-frag, .sx-detasare-dlgs, .sx-detasare-strip) { opacity: 1 !important; }
  .sx-detasare .sx-detasare-dlgs .sx-detasare-dlg { opacity: 1 !important; transform: none !important; }
  .sx-detasare .sx-detasare-cl .sx-detasare-oc { opacity: 1 !important; }
  .sx-detasare :is(.sx-detasare-in .i9, .sx-detasare-sw2 .n, .sx-detasare-dlg-in .i36) { opacity: 1 !important; }
  .sx-detasare :is(.sx-detasare-in .i0, .sx-detasare-sw2 .o, .sx-detasare-dlg-in .i0) { opacity: 0 !important; }
  .sx-detasare .sx-detasare-t mark { background-size: 100% 100% !important; }
  .sx-detasare .sx-detasare-ring { opacity: 1 !important; transform: none !important; }
}

/* ---------- 11. Mișcarea cântarului, în CSS (JS pune doar ținta: .sx-detasare-geo) ---------- */
.sx-detasare.sx-detasare-geo :is(.sx-detasare-beam, .sx-detasare-pan, .sx-detasare-gtri, .sx-detasare-st-k, .sx-detasare-st-v) { transform-box: view-box; transform-origin: 0 0; }
/* brațul și talerele: un arc amortizat (ca arcul din varianta veche: K 95, C 10,7), cu rezervă pentru browserele fără linear() */
.sx-detasare.sx-detasare-motion :is(.sx-detasare-beam, .sx-detasare-pan) {
  transition: transform 1s cubic-bezier(.34, 1.4, .64, 1);
  transition: transform 1s linear(0, 0.07, 0.238, 0.444, 0.65, 0.827, 0.963, 1.055, 1.107, 1.126, 1.121, 1.103, 1.077, 1.051, 1.027, 1.009, 0.996, 0.988, 0.984, 0.984, 0.986, 0.989, 0.993, 0.996, 1);
}
.sx-detasare.sx-detasare-motion :is(.sx-detasare-w rect, .sx-detasare-gap) { transition: y .65s cubic-bezier(.22, 1, .36, 1), height .65s cubic-bezier(.22, 1, .36, 1), opacity .25s ease; }
.sx-detasare.sx-detasare-motion :is(.sx-detasare-st-k, .sx-detasare-st-v) { transition: transform .65s cubic-bezier(.22, 1, .36, 1), opacity .2s ease; }
.sx-detasare.sx-detasare-motion .sx-detasare-gtri { transition: transform .65s cubic-bezier(.22, 1, .36, 1), opacity .25s ease; }
.sx-detasare .sx-detasare-w { transition: opacity .2s ease; }
.sx-detasare .sx-detasare-w.is-off { opacity: 0; }
.sx-detasare .sx-detasare-w.is-drop { animation: sx-detasare-drop .4s cubic-bezier(.55, 0, 1, .45) both; }
.sx-detasare .sx-detasare-w.is-lift { animation: sx-detasare-lift .26s cubic-bezier(.22, 1, .36, 1) both; }
@keyframes sx-detasare-drop { 0% { transform: translateY(-62px); opacity: 0; } 30% { opacity: 1; } 100% { transform: none; opacity: 1; } }
@keyframes sx-detasare-lift { from { transform: none; opacity: 1; } to { transform: translateY(-34px); opacity: 0; } }
.sx-detasare .sx-detasare-st-v.is-new { animation: sx-detasare-fadein .3s ease .03s both; }
@keyframes sx-detasare-fadein { from { opacity: 0; } to { opacity: 1; } }
.sx-detasare .sx-detasare-read-v output { transition: opacity .18s ease; }
.sx-detasare .sx-detasare-read-v output.is-fade { opacity: .1; }
@media (prefers-reduced-motion: reduce) {
  .sx-detasare .sx-detasare-w, .sx-detasare .sx-detasare-st-v { animation: none !important; }
}