/* ============================================================
   AITAS my-account redesign — v3.7.4 (2026-07-28)
   Scope: .aitas-acc.aitas-scope (cabinet + auth surfaces + the two R3 blocks
          on the order-received page) + body.woocommerce-account globals
          (BOTH auth states).
   Design family: checkout v1.5.0 (aitas-checkout.css, marker aco150).
   The LOGIN CARD lives in css/aitas-login.css (sitewide, .aac-lc/.aac-pop) —
   it must render on pages this file never loads on.
   Marker token (survives minification): --aitas-acc-marker
   v3.6.0 (owner feedback round 7): the stripe is the TWO TABS and nothing else
   — «Назад» and «До магазину» are deleted with every rule that served only them
   (--util / --back / --shop and the ≤1160 tightening) — and the pair is pinned
   on phones too: --aac-hdr follows the theme header (64px at ≥992, 56px below,
   measured live), the ≤640 rule that made the stripe static is gone, and at
   ≤640 the chips wear short labels («Замовлення» / «Профіль») so each holds one
   line. The password disclosure summary loses its label and dots; the ≤640
   row-action button gets symmetric 18px insets and a 44px touch height; a
   receipt fragment landing into an open panel animates the panel's height
   instead of jumping. The four files (inc + this stylesheet + the JS +
   form-edit-account) carry one version between them, so a served marker can
   never describe a stale asset. css/aitas-login.css is NOT in this round: its
   body is unchanged, so its own pop marker stays at the round that last edited
   it (R11) while its ?ver rides the shared constant — that asset's marker is
   deliberately NOT in the v3.6.0 lockstep, and this file must never mention the
   token, or a "zero stale tokens" grep on the served body would read it here.
   v3.6.1 (lockstep + one fix): the ONLY declaration change in this file is that
   the reduced-motion `.aac-det{transition:none}` override moved from the
   skeleton block near the top to immediately after the `.aac-det` rule it
   overrides. Both are 0,1,0, so at its old position the base transition simply
   won the cascade and a reduce visitor got the full .28s panel glide anyway —
   dead since R7, found gating v3.6.0. css/aitas-login.css stays out of this
   round's marker lockstep for the same reason it stayed out of the last one:
   not one of its bytes changes.
   v3.6.2 (owner feedback, quick polish): four changes, all in this file except
   the collapse glide. W1 — the stripe is no box at rest (transparent fill,
   transparent border colour, no shadow; the 1px border stays in the box model
   so the sticky transition still moves nothing) and frosted glass when stuck
   (the page colour at 72% over a 10px blur, with a near-opaque @supports
   fallback). W2 — the ≤640 ledger row is ONE template: the media column is a
   stated 38px instead of `auto`, exactly one thumbnail renders whatever the
   order holds, and the «+N» overflow tile becomes a badge on that thumbnail's
   corner, so the text column starts at the same x in every row. W3 — the two
   stripe chips are equal-width (flex:1 1 0, capped at 200px) with the label
   unclipped, which is what «Профіль» needed to keep its «ь». W4 — the ≤640
   waybill copy chip centres its content; the ghost keeps owning the width, so
   «Скопійовано» still costs zero geometry. css/aitas-login.css stays out of the
   lockstep again — still not one of its bytes.
   v3.6.3 (owner feedback round 9): four more, all here except the class the JS
   now supplies. W1 — the frosted band suspends its backdrop-filter for the
   lifetime of a collapse glide; re-blurring a backdrop that is moving 130px a
   frame misses raster deadlines on phone GPUs and the top of the screen flashes
   white. W2 — the «Профіль» chip takes 2px of asymmetric padding: the cluster
   is geometrically centred and optically a hair right, because the trailing «ь»
   carries no visual weight. W3 — at ≤640 the total and the status chip share
   one line at the foot of the row (sum left, chip right) through a wrapper that
   desktop flattens away with display:contents, so the four-column grid above
   this breakpoint is untouched by construction. W4 — the chevron leaves the now
   occupied middle of the row for the № line and grows to 18px. And once more,
   css/aitas-login.css does not change a byte.
   v3.6.4 (owner feedback round 10, one declaration set): the ≤640 foot line
   stops pushing the total and the status chip to opposite edges — the pair
   rides as ONE centred cluster, 14px apart, in the same box as before (the
   −16px chevron-reserve bleed stays, so the centring box still matches the
   action button's span). Nothing else moves; the JS and inc ride the lockstep
   with their bytes otherwise unchanged, and css/aitas-login.css — still not a
   byte.
   v3.7.0 (owner feedback round 11): a minor bump, because the JS beside this
   file stops being a single-open accordion. W1 — the ≤640 order thumbnail goes
   38px→56px and stops floating in the middle of the rows it spans
   (align-self:start puts its top edge on the «№ …» line); the media column and
   the skeleton follow it, so the row is still ONE template and the text column
   simply starts 18px further in — at 390px the widest sum+status pairs now wrap
   to two centred lines, which is R14's flex-wrap degrade working, not a
   regression to fix. W2 — the R14-W1 `is-gliding` blur suspension leaves the
   ≤991 block: below 992px a collapse is now a single-frame cut in the JS (the
   glide's ~130px/frame traversal is what iOS painted white tiles into) and
   nothing at that width glides at all. W3 — several order panels may be open at
   once, which removes the forced-close motion this stylesheet's glide rules
   were written for; the desktop glide keeps its live blur. And still not one
   byte of css/aitas-login.css.
   v3.7.1 (same round, caller's review catch): the 56px tile confines itself
   to grid row 1 and the foot line takes the full card width — v3.7.0's
   narrowed column sat within a few px of the widest sum+chip clusters and
   near-identical rows wrapped or not by subpixels (mixed templates, the R13
   complaint). Lockstep bump; js/inc byte-inert; login css untouched.
   v3.7.2 (owner feedback round 12): a JS-only round — this file rides the
   lockstep with its marker and version bumped and no rule touched. The phone's
   «Сховати» stops handing Safari a reflow and a scroll jump in one transaction
   (that pairing, not the motion, is what painted the white band over the navy
   stripe): the page now scrolls to the row natively with the panel still open,
   and folds it once the page has stopped. A touch collapse also stops restoring
   focus to the row's link — no outline is suppressed here or anywhere, the
   restore simply skips coarse pointers, which is what drew the ring around a
   parked row on iOS. css/aitas-login.css: still not a byte.
   ============================================================ */
.aitas-acc{
  --aac-navy:#000D2E;
  --aac-bg:#F8FBFF;
  --aac-ink:#232323;
  --aac-ink2:#1A2230;
  --aac-blue:#4F9AD0;
  --aac-deep:#1D80C7;
  --aac-tint:#EDF3F9;
  --aac-line:#E2ECF5;
  --aac-line2:#D5DEEA;
  --aac-muted:#9AA6B6;
  --aac-label:#808696;
  --aac-green:#3DCC3B;
  --aac-green-t:#23A021;
  --aac-red:#E23B3B;
  /* status-chip TEXT tokens: the chips are 11.5px small text, so WCAG AA needs
     ≥4.5:1 against their own tint. The display tokens above fail there
     (#1D80C7 on #EDF3F9 = 3.78, #23A021 on the .14-alpha green = 3.08,
     #808696 on #F1F4F8 = 3.30). Same hue, darker text, tints untouched. */
  --aac-chip-blue:#17699F;   /* 5.28:1 on #EDF3F9 */
  --aac-chip-green:#197718;  /* 5.10:1 on rgb(228,248,228) */
  --aac-chip-steel:#646A7C;  /* 4.89:1 on #F1F4F8 */
  --aac-chip-red:#C33A3A;    /* 4.77:1 on #FDF1F1 — already AA */
  --aac-sh-card:0 1px 2px rgba(16,24,40,.05);
  --aac-sh-cta:0 8px 20px rgba(47,127,209,.4);
  --aac-sh-pop:0 24px 60px rgba(0,13,46,.28);
  --aitas-acc-marker:aac375;
  /* the theme header is position:sticky, top:0 and does not resize on scroll.
     It is NOT one height: 64px at ≥992px and 56px below that (measured live
     2026-07-27 at 1366 / 1024 / 992 / 991 / 768 / 390 — the theme's own header
     breakpoint is 991/992). The ≤991 override lives with the responsive rules;
     every scroll-into-view in the JS reads the result off the DOM via
     pinBottom(), so neither this file nor that one restates a pixel twice. */
  --aac-hdr:64px;
  --aac-pin:10px;
  color:var(--aac-ink);
  font-size:16px;
  line-height:1.45;
}

/* ---------- typography leak reset ----------
   crypt.css:404 `.entry-content p,.entry-content li,.entry-content ul{margin:15px 0}`
   (0,1,1) and crypt.css:1570 `.page .entry-content .container_block ul{list-style:disc;
   padding:5px 0 5px 25px}` (0,3,1) both out-rank redesign classes — the whole cabinet
   renders inside .entry-content > .container_block. Measured live 2026-07-25: the nav
   rail's <li>s carried margin:15px 0 (76px item pitch instead of 42). Every vertical
   rhythm in this file comes from flex/grid gaps, so the reset is total. */
.aitas-acc p,.aitas-acc ul,.aitas-acc ol,.aitas-acc li,.aitas-acc dl,.aitas-acc dd,.aitas-acc address,.aitas-acc figure,.aitas-acc fieldset{margin:0!important}
.aitas-acc ul,.aitas-acc ol{padding:0!important;list-style:none!important}

/* ---------- page frame ---------- */
/* page.php prints its own page-title band (.post_item h1, crypt 55/45 centered) for
   page 201 — every account surface renders its own head instead, both auth states. */
body.woocommerce-account .post_item{display:none}
/* bundle `.woocommerce-account #primary{margin-top:-100px}` (+ a -50px mobile variant)
   pulled the 2021 markup up under the sticky header — 0,2,1 beats both. */
body.woocommerce-account #primary{margin-top:0}
/* bundle floats notices into an absolute 50%-wide box (top:100px;right:0) */
body.woocommerce-account .woocommerce-notices-wrapper{position:static!important;width:auto!important;top:auto!important;right:auto!important;margin:0!important}

.aitas-acc{max-width:1240px;margin:0 auto;padding:6px 20px 72px}
.aac-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 18px}
.aac-head__t{min-width:0}
/* crypt.css `.page .post_item h1` / `.page .container_block h1` (0,2,1) центрує
   і ставить 55/45 — обидві властивості потребують !important */
.aac-h1{font-weight:900;font-size:30px;line-height:1.2;margin:14px 0 0!important;color:var(--aac-ink);text-align:left!important}
.aac-h1 .aac-chip{vertical-align:middle;margin-left:10px;position:relative;top:-2px}
.aac-lede{font-size:14.5px;color:var(--aac-label);line-height:1.5;margin:7px 0 0!important;max-width:52ch}
.aac-head__a{flex:none}
.aac-eyebrow{display:block;font-size:10.5px;font-weight:700;letter-spacing:.95px;text-transform:uppercase;color:var(--aac-label)}
.aac-head .aac-eyebrow{margin-bottom:2px}
.aac-card>.aac-eyebrow:first-child{margin-bottom:13px}
.aac-back{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:var(--aac-label);text-decoration:none}
.aac-back:hover{color:var(--aac-deep)}
.aac-back .aac-ic{width:14px;height:14px}
/* v3.0.0: the rail is gone, so the cabinet is ONE column of cards capped at a
   comfortable reading measure — a 1240px-wide ledger row put the status chip a
   whole screen away from the total it belongs to. */
.aitas-acc{max-width:1240px}
.aac-content{min-width:0;max-width:920px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
.aitas-acc--auth .aac-content{max-width:none}

/* ---------- the pinned control stripe (R8-B → R10-W3) ----------
   R7 stacked these routes in three groups over 144px; R8 compressed them to one
   72px row of two-line controls; R10 makes them what they always were — four
   words and four glyphs:

     [Мої замовлення] [⚙ Налаштування профілю] │ [⌂ На головну] [🏪 До магазину]

   One 44px chip each, one radius, one 10px gap, all four LEFT-anchored, with a
   1px hairline separating the two panes of this document from the two ways out
   of it. The trailing space stays empty: a set of controls reads from one edge,
   and pushing half of them to the far side of a 920px card made two groups look
   like two unrelated toolbars. Hierarchy is FILL and INK, as before — the tabs
   are bordered panels (the active one tinted), the exits are quiet and
   border-less until hovered. Band height 72 → 58px (6 + 44 + 6 + 2 borders).

   Pinning: the theme header is position:sticky/top:0/64px and does not resize on
   scroll, and the ancestor chain from .aitas-acc up to <body> carries no
   overflow, transform, filter or contain (measured — a sticky child here
   resolves against the viewport). The card sticks at 64 + 10px of air; the
   ::before paints that 10px band in the page canvas so the ledger scrolls under
   a solid edge instead of appearing in the gap. Nothing in the JS restates the
   band's height — pinBottom() reads it from the DOM, so every scroll-into-view
   followed it down to 58px for free. */
.aac-stripe{position:sticky;top:calc(var(--aac-hdr) + var(--aac-pin));z-index:6}
.aac-stripe::before{
  content:"";position:absolute;left:-24px;right:-24px;top:calc(0px - var(--aac-pin) - 2px);height:calc(var(--aac-pin) + 3px);
  background:var(--aac-bg);pointer-events:none
}
/* .aac-card.aac-top, not .aac-top: .aac-card's own 22/24 padding is declared
   later in this file and would otherwise win the 0,1,0 tie by source order. */
/* R12-W3: the band holds the two pane tabs, centred, 10px apart. With «Назад»
   and «До магазину» deleted there is no second group to space away from, so the
   container's own gap is the whole of the spacing and the flex centring is the
   whole of the placement. */
/* R13-W1: at rest the band is not a box at all — the two chips sit on the page
   canvas and the card around them is invisible. The 1px border STAYS in the box
   model and only its colour goes transparent: the sticky transition may not
   change the geometry by a pixel, or everything below jumps by exactly that
   difference. Same reason background is animated rather than swapped. */
.aac-card.aac-top{
  position:relative;display:flex;align-items:center;justify-content:center;gap:10px;padding:6px 12px;border-radius:14px;
  background:transparent;border-color:transparent;box-shadow:none;
  transition:box-shadow .18s, border-color .18s, background .18s
}
/* stuck: the band becomes frosted glass — the page colour itself (#F8FBFF =
   --aac-bg) at 72% over a 10px blur, so the ledger reads THROUGH the stripe
   while staying legible under it. The chips keep their own white / tinted fills
   and carry the legibility; the frost only has to say "this is floating". No
   border colour and no geometry change here either. */
.aac-stripe.is-stuck .aac-card.aac-top{
  background:rgba(248,251,255,.72);
  backdrop-filter:blur(10px) saturate(1.15);
  -webkit-backdrop-filter:blur(10px) saturate(1.15);
  box-shadow:0 8px 22px rgba(16,24,40,.08);
  border-color:transparent
}
/* no backdrop-filter (older WebKit, blur disabled): the frost degrades to a
   near-opaque wash of the same colour — the list stops showing through, and
   nothing else about the band changes. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .aac-stripe.is-stuck .aac-card.aac-top{background:rgba(248,251,255,.97)}
}

/* one control family: same 44px height, same radius, same gap, one line of text.
   The 34px icon tile treatment is gone with the captions it balanced — at chip
   size a bare 17px glyph beside 14px/600 text is the whole affordance. */
.aac-nav{
  display:flex;align-items:center;gap:9px;min-width:0;height:44px;padding:0 13px;
  border:1px solid transparent;border-radius:12px;background:transparent;text-decoration:none!important;
  font-size:14px;font-weight:600;line-height:1;white-space:nowrap;
  transition:border-color .15s, background .15s, color .15s
}
.aac-nav .aac-ic{width:17px;height:17px}
.aac-nav b{font-size:14px;font-weight:600;line-height:1;min-width:0;overflow:hidden;text-overflow:ellipsis;color:inherit}

/* the two tabs — bordered panels, the "where am I / where can I go" affordance */
.aac-nav--tab{border-color:var(--aac-line);background:#fff;color:var(--aac-ink2)}
.aac-nav--tab .aac-ic{color:var(--aac-label)}
.aac-nav--tab:hover{border-color:var(--aac-line2);background:#FCFDFF}
.aac-nav--tab:hover .aac-ic{color:var(--aac-deep)}
/* the active tokens are R8's, unchanged: --aac-deep border + ink on --aac-tint.
   The inset ring is what makes a 1px border read as a 2px selection without
   changing the box by a pixel — no height change is allowed here. */
.aac-nav--tab.is-on{background:var(--aac-tint);border-color:var(--aac-deep);box-shadow:inset 0 0 0 1px var(--aac-deep);color:var(--aac-deep)}
.aac-nav--tab.is-on .aac-ic,.aac-nav--tab.is-on b{color:var(--aac-deep)}
.aac-nav--me{margin-left:0}
/* each tab ships both labels; the wide one is the default and the ≤640 rule
   swaps them. Two spans instead of one is what keeps the choice in CSS — a
   JS-rewritten label would flicker on every pane swap and lie to a crawler. */
.aac-nav__s{display:none}

/* R11-W3 deleted the hairline divider and the util wrapper; R12-W3 deletes the
   last two controls that used them — «Назад» and «До магазину». Every rule that
   served only those two chips (the quiet utility weight and the two side
   margins that opened the 24px around the tab pair) is deleted with the markup,
   and so is the ≤1160 tier, which existed only to tighten those margins. No
   selector in this file targets a control the cabinet no longer renders. */

/* ---------- the two panes (R8-A) ----------
   Both cabinet surfaces live in one document; the hidden one keeps its DOM (and
   therefore its loaded rows, its open receipt and everything typed into the
   form) so the swap costs nothing and loses nothing. */
.aac-panes{display:flex;flex-direction:column;min-width:0}
.aac-pane{display:flex;flex-direction:column;gap:14px;min-width:0}
.aac-pane[hidden]{display:none}

/* ---------- atoms ---------- */
.aac-card{background:#fff;border:1px solid var(--aac-line);border-radius:14px;box-shadow:var(--aac-sh-card);padding:22px 24px}
.aac-card--flush{padding:0;overflow:hidden}
.aac-h2{font-size:18px;font-weight:800;margin:0 0 12px!important;color:var(--aac-ink);text-align:left!important;line-height:1.3}
.aac-h3{font-size:15px;font-weight:700;margin:0!important;color:var(--aac-ink);text-align:left!important;line-height:1.3}
.aac-micro{font-size:12.5px;color:var(--aac-muted);line-height:1.55;margin:0!important}
.aac-ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.aac-note{background:var(--aac-tint);border-radius:10px;padding:12px 14px;font-size:13.5px;color:var(--aac-ink2);line-height:1.5}
.aac-note a{color:var(--aac-deep);font-weight:600}
.aac-hr{height:1px;background:var(--aac-line);margin:14px 0}

/* buttons — theme a/button globals fight bare classes; pin the essentials */
.aac-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 22px;
  background:var(--aac-blue);color:#fff!important;font-weight:700;font-size:15px;border-radius:12px;border:0;
  cursor:pointer;font-family:inherit;text-decoration:none!important;line-height:1;transition:filter .15s, transform .05s;
  box-shadow:var(--aac-sh-cta);white-space:nowrap
}
.aac-btn:hover{filter:brightness(1.06);color:#fff!important}
.aac-btn:active{transform:translateY(1px)}
.aac-btn:disabled{opacity:.55;cursor:default}
.aac-btn--wide{width:100%}
.aac-btn--ghost{background:#fff;color:var(--aac-ink2)!important;border:1px solid var(--aac-line2);box-shadow:none;font-weight:600}
.aac-btn--ghost:hover{filter:none;border-color:var(--aac-deep);color:var(--aac-deep)!important;background:#fff}
.aac-btn--tint{background:var(--aac-tint);color:var(--aac-deep)!important;box-shadow:none;border:1px solid rgba(29,128,199,.22);font-weight:700}
.aac-btn--tint:hover{filter:none;background:var(--aac-tint);border-color:var(--aac-deep);color:var(--aac-deep)!important}
.aac-btn--sm{height:36px;padding:0 12px;font-size:13px;border-radius:9px;gap:6px}
.aac-btn--sm .aac-ic{width:15px;height:15px}
.aac-linkish{color:var(--aac-deep);font-weight:600;font-size:13.5px;background:none;border:0;cursor:pointer;text-decoration:none;padding:0;font-family:inherit}
.aac-linkish:hover{text-decoration:underline;color:var(--aac-deep)}

/* status chips */
.aac-chip{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:700;line-height:1.25;white-space:nowrap;letter-spacing:.2px}
.aac-chip--completed{background:rgba(61,204,59,.14);color:var(--aac-chip-green)}
.aac-chip--processing,.aac-chip--on-hold{background:var(--aac-tint);color:var(--aac-chip-blue)}
.aac-chip--pending{background:#F1F4F8;color:var(--aac-chip-steel)}
.aac-chip--cancelled,.aac-chip--failed,.aac-chip--refunded{background:#FDF1F1;color:var(--aac-chip-red)}

/* label / value pairs — the receipt + address content grid */
.aac-kv{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px}
.aac-kv--one{grid-template-columns:1fr}
.aac-kv__k{display:block;font-size:10.5px;font-weight:700;letter-spacing:.95px;text-transform:uppercase;color:var(--aac-label);margin-bottom:3px}
.aac-kv__v{display:block;font-size:14.5px;color:var(--aac-ink);line-height:1.45;font-weight:600;overflow-wrap:anywhere}
.aac-kv__v small{display:block;font-size:13px;font-weight:400;color:var(--aac-label);margin-top:2px}
.aac-kv__i{grid-column:span 1;min-width:0}
.aac-kv__i--wide{grid-column:1/-1}

/* ---------- orders ledger ----------
   v3.0.0 (R6-C): the ledger's content x-edge is now the SAME 24px every other
   card uses (it was 18px, so the one card that carries the most content was
   also the one out of step), and the right gutter is 24 + a 16px chevron lane.
   The status column is right-aligned so the chip's right edge sits one 14px
   gap from the total instead of a 104px column away — the owner's «status chip
   too far from the sum». Every column is a FIXED width: each row is its own
   grid, so an `auto` column would resolve per row and the chips and totals
   would stagger from row to row. */
/* R7-C1: the row-button centring, as arithmetic rather than as taste.
   The act column is the last one, the chevron owns the right gutter, and the
   owner wants the button centred between the SUM column's right edge and the
   CHEVRON's left edge. With G = column gap, A = act width, PR = row
   padding-right and a 16px chevron inset 16px from the row's right edge:

       act centre  = rowRight − PR − A/2
       sum right   = rowRight − PR − A − G
       chevron left= rowRight − 32
       midpoint    = rowRight − (PR + A + G + 32) / 2

   Setting the two equal gives PR = G + 32 = 46px, independently of A — so the
   rule holds for «Повторити» and «Відслідкувати» alike, and for any future
   label, as long as the button is centred inside its column. Measured offset:
   0.00px on every row. */
/* R8-C: the ledger opts OUT of the browser's own scroll anchoring. Measured
   before the fix: a panel collapsing ABOVE the viewport moved the row under the
   cursor by −525px and Chromium compensated for none of it (scroll anchoring
   suppresses itself for changes it did not select an anchor inside). The JS pins
   an explicit anchor element across every open/collapse/append instead, and two
   compensators fighting over the same scroll is worse than one doing the job. */
.aac-ledger__list{overflow-anchor:none}
.aac-ledger__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 46px 13px 24px;border-bottom:1px solid var(--aac-line);background:#fff}
.aac-ledger__count{font-size:12.5px;color:var(--aac-muted);font-weight:600}
.aac-oitem+.aac-oitem>.aac-orow{border-top:1px solid var(--aac-line)}
.aac-orow{
  position:relative;display:grid;align-items:center;gap:8px 14px;padding:13px 46px 13px 24px;
  grid-template-columns:128px minmax(0,1fr) 116px 116px 132px;transition:background .15s;cursor:pointer
}
.aac-orow:hover{background:#FCFDFF}
.aac-oitem.is-open>.aac-orow{background:#F6FAFE}
.aac-orow__go{position:absolute;inset:0;z-index:1;border-radius:0}
/* R7-C3: the chevron points DOWN (collapsed) and UP (expanded) — the row is an
   expander now, not a link to somewhere else. Absolutely positioned, so the
   five content columns keep their exact widths. */
.aac-orow__chev{
  position:absolute;right:16px;top:50%;width:16px;height:16px;margin-top:-8px;color:var(--aac-line2);
  display:flex;align-items:center;justify-content:center;transition:color .15s, transform .24s cubic-bezier(.2,.75,.3,1)
}
.aac-orow__chevic{width:16px;height:16px;stroke-width:2.2}
.aac-orow:hover .aac-orow__chev{color:var(--aac-deep)}
.aac-oitem.is-open .aac-orow__chev{color:var(--aac-deep);transform:rotate(180deg)}
/* position:relative for the ≤640 overflow BADGE, which is absolutely placed on
   the corner of the single thumbnail that survives there — see the ≤640 block.
   Desktop keeps the tile in flow and never uses the containing block. */
.aac-orow__thumbs{position:relative;display:flex;align-items:center;gap:5px}
.aac-orow__thumbs img{width:40px!important;height:40px!important;object-fit:contain;border:1px solid var(--aac-line);border-radius:9px;background:var(--aac-tint);padding:2px;display:block;margin:0}
/* overflow tile: the row caps at three thumbnails, so orders with more said
   nothing about the rest. Same 40px tile geometry, text via attr() so the
   mobile rule (one thumbnail fewer) can carry its own count. */
.aac-orow__more{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:40px;height:40px;border:1px solid var(--aac-line);border-radius:9px;background:var(--aac-tint);
  /* chip-steel, not --aac-label: 12.5px on the tint needs AA (#808696 = 3.26:1) */
  font-size:12.5px;font-weight:800;color:var(--aac-chip-steel);line-height:1;letter-spacing:-.2px
}
.aac-orow__more::after{content:attr(data-more)}
.aac-orow__mid{min-width:0;display:flex;flex-direction:column;gap:2px}
.aac-orow__num{font-weight:800;font-size:15px;color:var(--aac-ink);line-height:1.3}
.aac-orow__num span{font-weight:500;color:var(--aac-muted);font-size:13px;margin-left:7px}
.aac-orow__meta{font-size:12.5px;color:var(--aac-label);line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aac-orow__st{min-width:0;display:flex;justify-content:flex-end}
.aac-orow__sum{font-size:16.5px;font-weight:900;color:var(--aac-ink);text-align:right;white-space:nowrap}
/* R14-W3: one wrapper, two lives. Desktop flattens it away — st and sum stay
   the grid items in columns 3/4 they have been since R2. ≤640 turns it into
   the row's foot line: sum left where the status chip used to sit, chip
   right-aligned on the same line (owner, round 9). */
.aac-orow__foot{display:contents}
/* centre, not flex-end — see the arithmetic above the row rule */
.aac-orow__act{position:relative;z-index:2;display:flex;justify-content:center}

/* ---------- infinite scroll (R7-C2) ----------
   The pager («Сторінка 1 з 2» + two buttons) is gone. What is left is a
   sentinel that is a REAL anchor to the native paged URL: JavaScript hijacks
   it, an IntersectionObserver fires it on approach, and without either it is
   still a working «next page» link. */
.aac-more{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 24px 18px;border-top:1px solid var(--aac-line)}
.aac-more__b{min-width:190px}
.aac-more__b[hidden]{display:none}
.aac-more.is-busy .aac-more__b{opacity:.55;pointer-events:none}
.aac-more__end{font-size:12.5px;color:var(--aac-muted);font-weight:600}
.aac-more__end[hidden]{display:none}
/* skeleton rows while a batch is in flight: the list must not collapse upward
   under the visitor's scroll position while the request runs */
.aac-skel{display:grid;align-items:center;gap:8px 14px;padding:13px 46px 13px 24px;border-top:1px solid var(--aac-line);
  grid-template-columns:128px minmax(0,1fr) 116px 116px 132px}
.aac-skel span{display:block;height:12px;border-radius:6px;background:linear-gradient(90deg,#EEF3F8 25%,#F7FAFD 37%,#EEF3F8 63%);background-size:400% 100%;animation:aacShim 1.3s ease infinite}
.aac-skel span:first-child{height:40px;border-radius:9px}
.aac-skelwrap{display:block}
/* the same shimmer inside a panel that is still loading its receipt */
.aac-skel__l{display:block;height:11px;border-radius:6px;margin:3px 0;background:linear-gradient(90deg,#EEF3F8 25%,#F7FAFD 37%,#EEF3F8 63%);background-size:400% 100%;animation:aacShim 1.3s ease infinite}
@keyframes aacShim{0%{background-position:100% 0}100%{background-position:0 0}}
@media(prefers-reduced-motion:reduce){
  .aac-skel span,.aac-skel__l{animation:none}
  /* v3.6.1: `.aac-det{transition:none}` USED to sit here and never applied — the
     rule it overrides is declared further down at the same specificity (0,1,0),
     so the later declaration won and a reduce visitor still got the .28s glide.
     It now lives immediately after that rule; see the panel block below. */
  .aac-orow__chev{transition:color .15s}
}

/* empty state */
.aac-empty{text-align:center;padding:40px 24px}
.aac-empty__ic{width:40px;height:40px;fill:none;stroke:var(--aac-deep);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin:0 auto;display:block;opacity:.75}
/* 0,2,0 like .aac-fsub p: __t/__d are <p>, so the 0,1,1 typography reset
   (.aitas-acc p{margin:0!important}) beat these at 0,1,0 — the empty state
   stacked gap-less with the copy flush-left (v3.7.5, found at the prod port:
   no stage test user ever had 0 orders, so no round rendered this screen). */
.aitas-acc .aac-empty__t{font-size:16.5px;font-weight:800;margin:12px 0 4px!important;color:var(--aac-ink)}
.aitas-acc .aac-empty__d{color:var(--aac-label);font-size:13.5px;margin:0 auto 18px!important;max-width:38ch;line-height:1.5}

/* ---------- the expanding receipt panel (R7-D) ----------
   The separate order page is gone: the receipt lives under its own ledger row.

   Height animation without measuring anything: a one-row grid whose track goes
   0fr → 1fr. The inner element clips, so no max-height guess can ever be wrong
   for a 12-item order, and the easing is the design family's own
   (cubic-bezier(.2,.75,.3,1), the cart/popup curve).

   Content is x-aligned to the ledger's own 24px card edge — the same x the
   eyebrow, the thumbnails and every row start from. */
.aac-det{
  display:grid;grid-template-rows:0fr;background:var(--aac-bg);border-top:1px solid var(--aac-line);
  transition:grid-template-rows .28s cubic-bezier(.2,.75,.3,1), opacity .22s linear
}
.aac-det[hidden]{display:none}
.aac-det.is-open{grid-template-rows:1fr}
/* v3.7.3→v3.7.4: the phone fold's first act — the receipt GHOSTS while the
   native scroll rides up (opacity is compositor work, zero layout, so pairing
   it with the scroll cannot re-trigger the sticky-band flash the R17 split
   fixed). v3.7.3 faded to 0 and the owner read the empty panel as «becomes
   white then collapses» — a void is its own artifact. .45 keeps the receipt's
   structure visible but clearly dismissed; the arrival fold (slowed below for
   this tier) then closes a ghost, not a void and not a second full animation.
   Added by scrollThenFold(), removed by expand() — a reopened receipt
   un-ghosts with its own opening. Desktop never carries the class. */
.aac-det.is-fading{opacity:.45}
/* v3.7.4: the phone fold itself breathes — 280ms read as «collapses quickly»
   after the calm native ride (owner, round 13/14). Same curve family, more
   air. MUST sit before the reduced-motion override below: same specificity,
   source order is what lets reduce still win. is-snap (0,2,0) also still
   wins — a rapid second press stays a one-frame land. */
@media(max-width:991px){
  .aac-det{transition:grid-template-rows .42s cubic-bezier(.3,.65,.25,1), opacity .25s linear}
}
/* v3.6.1: reduce means reduce. This override is a twin of the base rule's
   specificity (0,1,0), so it only wins by coming AFTER it — which is exactly
   what it was not doing while it lived up in the §skeleton reduced-motion block.
   With the transition gone the panel lands its end state in the toggle's own
   frame and the JS glide driver degrades to a single correction, which is the
   behaviour the reduced-motion contract asks for. */
@media(prefers-reduced-motion:reduce){.aac-det{transition:none}}
/* R10-W5.5: rapid-succession snap. A second toggle inside 380ms lands its end
   state in ONE frame instead of animating out of a transition that is still
   running — mid-transition geometry is what the anchor loop was measuring its
   baselines against, and the ±500px/frame correction bursts came from exactly
   that. The class is added around the mutation and removed once the end state
   has painted, so a single click is byte-identical to before. */
.aac-det.is-snap{transition:none}
.aac-det__in{overflow:hidden;min-height:0}
/* R12-W2: a receipt that lands in an already-open panel used to appear at full
   opacity in the frame the skeleton left, which is the «gray/white nothing then
   it just pops up» half of the complaint. 120ms is short enough to read as the
   content arriving rather than as an animation of its own. The JS adds the class
   on the swap and takes it off when the fade ends; a panel that opened WITH its
   content (the idle warm, the common case now) never sees it. */
.aac-rc.is-in{animation:aacRcIn .12s ease both}
@keyframes aacRcIn{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.aac-rc.is-in{animation:none}}
.aac-rc{padding:18px 24px 20px}
/* the unreachable standalone page (kept for contract, see view-order.php) */
.aac-rc__page .aac-rc{padding:0}

/* R10-W1: the head band (.aac-rc__head / .aac-rc__copy and its ghost track) is
   GONE. The panel opens on its contents; the timestamp rides the «Склад
   замовлення» eyebrow instead of a band of its own, and the waybill chip moved
   into «Доставка» (see the .aac-trk block below). The № copy chip is deleted
   outright — the row header the visitor clicked states the number 40px above,
   and a chip is not worth a whole band to re-state it.

   The eyebrow row: label left, timestamp right, aligned on their BASELINES so
   the 10.5px caps and the 13px date sit on one line rather than on one box
   centre. The timestamp's right edge is the content grid's own right edge — the
   same x every line-item price is flushed to. */
.aac-rc__eyerow{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap}
.aac-rc__when{font-size:13px;color:var(--aac-muted);font-weight:600;min-width:0;text-align:right}

/* bands, not cards: a card inside a panel inside a card is the "block inside
   separated from the block in the back" the owner has complained about twice */
.aac-rc__sec+.aac-rc__sec{margin-top:16px;padding-top:16px;border-top:1px solid var(--aac-line)}
.aac-rc__sec>.aac-eyebrow{margin-bottom:11px}
/* the eyebrow is wrapped now — the section's own 11px rhythm moves to the row */
.aac-rc__sec>.aac-rc__eyerow{margin-bottom:11px}

/* line items — the R6-D 168px cards shrank to receipt rows: «especially the
   images… they have no need to be this big». Two per row at desktop so a
   six-item order is three lines instead of six. */
.aac-lines{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:8px 16px}
.aac-line{
  display:flex;align-items:center;gap:12px;min-width:0;padding:8px;border-radius:11px;
  border:1px solid transparent;background:#fff;text-decoration:none!important;color:var(--aac-ink);
  transition:border-color .15s, box-shadow .15s
}
a.aac-line:hover{border-color:var(--aac-deep);box-shadow:0 2px 10px rgba(16,24,40,.07)}
.aac-line__ph{
  width:56px;height:56px;flex:none;display:flex;align-items:center;justify-content:center;
  background:var(--aac-tint);border-radius:9px;overflow:hidden;padding:4px
}
.aac-line__ph img{width:100%!important;height:100%!important;max-width:100%;object-fit:contain;display:block;margin:0;border:0;border-radius:0}
.aac-line__ph:empty{background:#F1F4F8}
.aac-line__x{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.aac-line__n{
  font-size:13.5px;font-weight:600;line-height:1.3;color:var(--aac-ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}
.aac-line__v{font-size:11.5px;color:var(--aac-muted);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aac-line__q{font-size:12px;color:var(--aac-label);line-height:1.35}
.aac-line__p{font-size:14.5px;font-weight:900;color:var(--aac-ink);line-height:1.25;white-space:nowrap;flex:none;text-align:right}
.aac-line__p .woocommerce-Price-amount{font-weight:inherit}

/* R9-W1: the foot band (.aac-rc__f / .aac-rc__money / .aac-sum__*) is GONE. The
   sum is stated once, in the ledger row header that is on screen above the open
   panel, and the parcel moved into the head band. The panel ends at its last
   fact and then at its actions — nothing carries a total any more. */

/* R10-W4: the act-l/act-r band is gone. It sat one order-level DECISION beside
   the way out of a panel and made the two read as a pair of equal choices.

   The decision keeps a row of its own — left-anchored on the panel's content x,
   rendered only when there IS one («Замовити ще раз» on a completed order,
   «Скасувати замовлення» on one that can still be stopped; mutually exclusive by
   status, so it never holds both). The two-step confirm swaps in place inside
   .aac-cancel, and at this width the question and its two answers fit the same
   36px line the trigger occupied — the row height does not move through the
   swap. */
.aac-rc__do{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;margin-top:14px}

/* …and «Сховати» becomes the panel's closing EDGE: the full width of the
   content, under a hairline, centred and quiet. A strip you can hit anywhere
   reads as "this closes"; the 36px ghost button in the corner read as one more
   control among the controls beside it. Same `data-aac-hide` hook, so the
   chevron, the row click, ESC and this all end in collapseUX(). */
.aac-rc__hide{
  display:flex;align-items:center;justify-content:center;gap:8px;height:44px;
  /* the negative margins mirror .aac-rc's own padding (18px 24px 20px desktop,
     14px 18px 16px ≤640) so the strip IS the panel's closing edge and its
     bottom radius meets the card corners — change one, change both */
  margin:14px -24px -20px;width:calc(100% + 48px);
  padding:0;border:0;border-top:1px solid var(--aac-line);border-radius:0 0 12px 12px;
  background:none;cursor:pointer;font-family:inherit;font-size:13.5px;font-weight:600;
  color:var(--aac-label);line-height:1;transition:background .15s, color .15s
}
.aac-rc__hide:hover{background:#F1F5FA;color:var(--aac-ink2)}
.aac-rc__hide-ic{width:14px;height:14px;transform:rotate(180deg)}

/* order updates timeline */
.aac-tl{display:flex;flex-direction:column;gap:14px}
.aac-tl li{position:relative;padding:0 0 0 20px}
.aac-tl li::before{content:"";position:absolute;left:0;top:5px;width:9px;height:9px;border-radius:50%;background:var(--aac-tint);border:2px solid var(--aac-deep)}
.aac-tl li::after{content:"";position:absolute;left:4px;top:18px;bottom:-16px;width:1px;background:var(--aac-line)}
.aac-tl li:last-child::after{display:none}
.aac-tl time{font-size:12px;color:var(--aac-muted);display:block;margin-bottom:2px}
.aac-tl__b{font-size:14px;line-height:1.5;color:var(--aac-ink2)}
.aac-tl__b p{margin:0!important}

/* ---------- Nova Poshta tracking, inside «Доставка» (R3 → R9-W1 → R10-W1) ----
   One 36px line — glyph, digits, copy icon — beside «Трекінг». The carrier
   caption «Нова Пошта · Експрес-накладна» that used to sit above the number is
   the control's `title` and part of its aria-label: at chip size the digits ARE
   the identification, the carrier is already stated in «Доставка», and a
   two-line card in a row of one-line identifiers read as clutter.
   The whole chip is the copy control (a <button>, so it is a tab stop and
   answers Enter and Space for free); the confirmation swaps the DIGITS' text
   and ink only.

   R10-W1 moved the pair out of the panel's head band and INTO the «Доставка»
   kv pair, directly under the address line — a waybill is a fact about the
   delivery, so it reads with the delivery. Nothing about the chip changed; it
   is ~300px wide and the kv column is ~423px, so the pair still fits one line.
   The 10px is measured from the address `small` above it. */
.aac-trk{display:flex;align-items:center;gap:8px;min-width:0}
.aac-kv__i>.aac-trk{margin-top:10px}
.aac-trk__cp{
  display:inline-flex;align-items:center;gap:9px;height:36px;padding:0 11px;min-width:0;
  border:1px solid var(--aac-line);border-radius:10px;background:#fff;cursor:pointer;font-family:inherit;
  text-align:left;transition:border-color .15s, background .15s
}
.aac-trk__cp:hover{border-color:var(--aac-deep);background:#F6FAFE}
.aac-trk__tic{width:16px;height:16px;flex:none;color:var(--aac-deep)}
/* the digits and their ghost share one grid cell, so the RESTING number owns the
   width and «Скопійовано» cannot resize the control it is confirming — the R8
   zero-geometry-shift contract, carried over to the compact chip */
.aac-trk__nline{display:grid;min-width:0}
.aac-trk__nline>*{grid-area:1/1;min-width:0}
/* tabular figures: a 14-digit number read in chunks by a human, so the digits
   must not shimmy between glyph widths. Ghost and number share every metric —
   they have to, or the ghost stops owning the width. */
.aac-trk__ghost,.aac-trk__n{
  font-size:14px;font-weight:900;letter-spacing:.04em;line-height:1.25;
  font-variant-numeric:tabular-nums;white-space:nowrap
}
.aac-trk__ghost{visibility:hidden;pointer-events:none}
.aac-trk__n{color:var(--aac-ink);overflow:hidden;text-overflow:ellipsis;transition:color .15s}
.aac-trk__cpic{flex:none;color:var(--aac-line2);display:flex;transition:color .15s}
.aac-trk__cpic .aac-ic{width:16px;height:16px}
.aac-trk__cp:hover .aac-trk__cpic{color:var(--aac-deep)}
/* copied: digits + glyph go green, geometry untouched */
.aac-trk__cp.is-done{border-color:var(--aac-green-t);background:rgba(61,204,59,.06)}
.aac-trk__cp.is-done .aac-trk__n,.aac-trk__cp.is-done .aac-trk__cpic{color:var(--aac-green-t)}
.aac-trk__cp.is-fail{border-color:var(--aac-red);background:#FDF1F1}
.aac-trk__cp.is-fail .aac-trk__n,.aac-trk__cp.is-fail .aac-trk__cpic{color:#C33A3A}
/* copy confirmation on the №-chip: same contract, ink only */
.aac-btn.is-done{border-color:var(--aac-green-t)!important;color:var(--aac-green-t)!important;background:rgba(61,204,59,.08)}
.aac-btn.is-fail{border-color:var(--aac-red)!important;color:#C33A3A!important;background:#FDF1F1}

/* ---------- cancel an order (R8-D4) ----------
   Quiet until it is asked for, and never a native confirm(): the question and
   its two answers replace the trigger in place, so the decision stays inside the
   receipt it is about. Danger ink only on the button that actually cancels. */
.aac-btn--quiet{background:#fff;color:var(--aac-label)!important;border:1px solid var(--aac-line);box-shadow:none;font-weight:600}
.aac-btn--quiet:hover{filter:none;background:#FDF1F1;border-color:rgba(226,59,59,.45);color:#C33A3A!important}
.aac-btn--danger{background:#C33A3A;color:#fff!important;border:0;box-shadow:none;font-weight:700}
.aac-btn--danger:hover{filter:brightness(1.08);color:#fff!important}
.aac-cancel{display:inline-flex;align-items:center;min-width:0}
.aac-cancel__c{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.aac-cancel__c[hidden]{display:none}
.aac-cancel__q{font-size:12.5px;font-weight:700;color:#8C2626;line-height:1.3}

/* ---------- sign out, UNDER the settings card (R8-B3 → R9-W3 → R10-W2.4) ------
   Outside the card, so the card ends with exactly one button and that button is
   the one that saves. No divider of its own: the card's own edge is already the
   separation, and a second hairline 14px under the first is noise.
   R10 CENTRES it. Left-aligned on the card's content x it read as one more form
   control that had escaped the form; centred and alone under a finished document
   it reads as what it is — the way off the page. The 14px rides on top of the
   pane's own 14px flex gap. */
.aac-signout{display:flex;justify-content:center;margin-top:14px}
.aac-signout__b{height:46px;width:fit-content;min-width:238px}

/* ---------- addresses ---------- */
.aac-addr{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.aac-addr__card{display:flex;flex-direction:column;gap:12px}
.aac-addr__hint{display:block;margin-top:5px!important}
.aac-addr__body{display:flex;flex-direction:column;gap:10px;flex:1}
.aac-addr__name{font-size:15.5px;font-weight:800;color:var(--aac-ink);line-height:1.3}
.aac-addr__lines{display:flex;flex-direction:column;gap:7px}
.aac-addr__l{display:flex;gap:9px;align-items:flex-start;font-size:14px;color:var(--aac-ink2);line-height:1.45}
.aac-addr__l .aac-ic{width:16px;height:16px;color:var(--aac-muted);margin-top:1px}
.aac-addr__l b{font-weight:600}
.aac-addr__l span{overflow-wrap:anywhere}
.aac-addr__foot{display:flex;align-items:center;gap:10px;padding-top:12px;border-top:1px solid var(--aac-line)}
.aac-addr__empty{background:var(--aac-tint);border-radius:10px;padding:14px;font-size:13.5px;color:var(--aac-label);line-height:1.5;flex:1;display:flex;flex-direction:column;justify-content:center}

/* ---------- forms: reset kit (fought-and-won set from aitas-checkout.css) ----------
   !important throughout: WC core .woocommerce form .form-row rules (up to 0,3,1),
   bootstrap reboot label and the stacked select2 skins all load before this file
   and out-rank bare scoped classes (sixth leak class, kb\theme-frontend.md). */
.aitas-acc .form-row{margin:0!important;padding:0!important;width:100%!important;float:none!important;display:block}
.aitas-acc .form-row::before,.aitas-acc .form-row::after{content:none}
.aitas-acc .woocommerce-input-wrapper{display:block}
.aitas-acc .required{color:var(--aac-red);text-decoration:none;border:0}
.aitas-acc label .optional{display:none}
.aitas-acc .input-text,.aitas-acc select,.aitas-acc textarea{font-family:inherit}
/* height/padding !important: WC core `.woocommerce form .form-row .input-text
   {padding:.5em}` (0,3,1) out-ranks 0,2,0 rules — 37px boxes measured 2026-07-24 */
.aitas-acc input.input-text,.aitas-acc textarea.input-text{
  height:54px!important;border:1px solid var(--aac-line2)!important;border-radius:12px!important;padding:19px 14px 4px!important;
  background:#fff;outline:none;transition:border .15s, box-shadow .15s;width:100%;font:inherit;color:var(--aac-ink);box-shadow:none
}
.aitas-acc input.input-text:focus,.aitas-acc textarea.input-text:focus{border-color:var(--aac-deep)!important;box-shadow:0 0 0 3px rgba(29,128,199,.14)}
/* a theme global paints placeholders full ink — the floating-label inputs carry a
   single-space placeholder, so this only matters where a real prompt is shown */
.aitas-acc input.input-text::placeholder,.aitas-acc textarea.input-text::placeholder{color:var(--aac-muted)!important;opacity:1!important}
.aitas-acc .form-row.woocommerce-invalid input.input-text{border-color:var(--aac-red)!important;box-shadow:0 0 0 3px rgba(226,59,59,.10)}
.aitas-acc .form-row.woocommerce-validated input.input-text{border-color:var(--aac-line2)!important}

/* floating-label field (anchor parity: checkout .aco-ffld) */
.aac-ffld{position:relative}
/* WC core `.woocommerce form .form-row label{line-height:2}` (0,3,1) doubles the box */
.aitas-acc .aac-ffld>label,.aitas-acc .aac-fld>label{line-height:1.2!important}
.aitas-acc .aac-ffld>label{
  position:absolute;left:15px;top:27px;transform:translateY(-50%);color:var(--aac-muted);font-size:15px;font-weight:400!important;
  pointer-events:none;transition:all .15s;margin:0!important;padding:0!important;z-index:2;white-space:nowrap;
  max-width:calc(100% - 30px);overflow:hidden;text-overflow:ellipsis;text-transform:none!important;letter-spacing:0!important
}
.aitas-acc .aac-ffld:focus-within>label,
.aitas-acc .aac-ffld.has-val>label{top:12px;transform:none;font-size:11.5px;font-weight:700!important;color:var(--aac-label);letter-spacing:.3px}
/* CSS-native float for eventless values (autofill/prefill/JS sets): inputs carry
   placeholder=" ". Chromium does NOT invalidate :has()+:placeholder-shown on
   programmatic sets (checkout 2026-07-21) — the JS sweep in aitas-account.js is
   primary, these rules cover engines that do invalidate. */
.aitas-acc .aac-ffld:has(input.input-text:not(:placeholder-shown))>label{top:12px;transform:none;font-size:11.5px;font-weight:700!important;color:var(--aac-label);letter-spacing:.3px}
.aitas-acc .aac-ffld.has-val input.input-text{border-color:var(--aac-line2)!important}
/* Chrome applies :-webkit-autofill before any event — the no-op animation fires
   animationstart, which the JS routes to the float sweep */
@keyframes aacAutofill{from{opacity:.999}}
.aitas-acc .aac-ffld input.input-text:-webkit-autofill{animation:aacAutofill .01s}

/* plain top-label field (selects — anchor parity: checkout .aco-fld) */
.aitas-acc .aac-fld>label{
  font-size:12.5px!important;color:var(--aac-label)!important;font-weight:700!important;display:block;
  margin:0 0 6px!important;padding:0!important;text-transform:none!important;letter-spacing:.2px!important
}
/* width !important: WC core ships `select.country_to_state--single{width:auto}`
   for single-country shops — measured 116px live 2026-07-25.
   :not(.select2-hidden-accessible) is load-bearing: select2 hides the original
   <select> with width/height:1px!important at 0,1,0, so an !important width on
   a 0,1,1 selector inflates the hidden node and it overflowed the 390px
   viewport by 41px (measured live before this carve). */
.aitas-acc select:not(.select2-hidden-accessible){
  height:54px!important;border:1px solid var(--aac-line2)!important;border-radius:12px!important;padding:0 38px 0 14px!important;background-color:#fff;
  outline:none;width:100%!important;font-family:inherit;font-size:15px!important;font-weight:400!important;color:var(--aac-ink);appearance:none;-webkit-appearance:none;
  /* !important on the whole background set: a supplier `background:` shorthand
     wiped the chevron (computed background-image:none, measured live) */
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239AA6B6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-position:right 12px center!important;background-size:16px!important
}
.aitas-acc select:not(.select2-hidden-accessible):focus{border-color:var(--aac-deep)!important;box-shadow:0 0 0 3px rgba(29,128,199,.14)}

/* select2 (state field + the R4 Nova-Poshta pickers) — four stacked skins load
   before this file. Height is pinned to the 54px text-input geometry so mixed
   rows read as one control set. */
.aitas-acc .select2-container{width:100%!important;max-width:100%;min-height:54px}
.aitas-acc .select2-container .select2-selection--single{height:54px;border:1px solid var(--aac-line2);border-radius:12px;background:#fff;outline:none;transition:border .15s, box-shadow .15s}
.aitas-acc .select2-container--focus .select2-selection--single,
.aitas-acc .select2-container--open .select2-selection--single{border-color:var(--aac-deep);box-shadow:0 0 0 3px rgba(29,128,199,.14)}
.aitas-acc .select2-container .select2-selection--single .select2-selection__rendered{line-height:52px!important;padding:0 24px 0 14px!important;margin:0!important;color:var(--aac-ink);font-size:15px}
.aitas-acc .select2-container .select2-selection--single .select2-selection__arrow{height:52px!important;right:8px;top:0!important;left:auto!important}
.aitas-acc .select2-container .select2-selection--single .select2-selection__arrow b{border-color:var(--aac-muted) transparent transparent transparent;top:50%!important;right:auto!important}
.aitas-acc .select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent var(--aac-muted) transparent}
body.woocommerce-account .select2-dropdown{border:1px solid #E2ECF5;border-radius:12px;box-shadow:var(--aac-sh-pop,0 24px 60px rgba(0,13,46,.28));overflow:hidden}
/* the city picker is a SEARCH select2 (R4) — its search box is a control, not
   decoration; same geometry as the checkout's (aitas-checkout.css aco150) */
body.woocommerce-account .select2-search--dropdown{padding:8px}
body.woocommerce-account .select2-search--dropdown .select2-search__field{
  border:1px solid #D5DEEA;border-radius:8px;height:38px;padding:0 12px;outline:none;font-size:15px;width:100%;box-sizing:border-box
}
body.woocommerce-account .select2-results__option{padding:11px 14px;font-size:14.5px}
body.woocommerce-account .select2-results__option--highlighted[aria-selected]{background:#EDF3F9;color:#1A2230}
body.woocommerce-account .select2-results__option[aria-selected=true]{background:#EDF3F9}

/* field grid + form sections */
.aac-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.aac-form>*{grid-column:1/-1;min-width:0}
.aac-form>.form-row-first,.aac-form>.form-row-last,.aac-form>.aac-col{grid-column:span 1}
/* GENERAL sibling, not adjacent: the settings form carries a hidden
   account_display_name input and a do_action() between its sections, and an
   `+` combinator silently lost the gap the moment anything sat between two
   .aac-fsec elements (measured on stage 2026-07-26: «АДРЕСА ДОСТАВКИ» started
   at the exact pixel the e-mail field ended, margin-top 0). */
.aac-fsec~.aac-fsec{margin-top:26px}
.aac-fsec__h{display:block;font-size:10.5px;font-weight:700;letter-spacing:.95px;text-transform:uppercase;color:var(--aac-label);margin:0 0 11px}
/* R10-W2.2: the "these details prefill checkout" line is a SUBTITLE of «Контактні
   дані», so it renders under that header instead of at the bottom of the card
   beside the save button — where it explained fields the reader had already
   filled in and finished with. 60ch keeps it to two lines at 12.5px. The header
   tightens to 6px only when a subtitle actually follows it (:has, already used in
   this file for the mobile thumb stack). */
.aac-fsec__h:has(+.aac-fsec__sub){margin-bottom:6px}
/* 0,2,0: the typography reset's `.aitas-acc p{margin:0!important}` is 0,1,1.
   R11-W4.1: the 60ch cap is GONE. It broke the sentence over two lines and left
   a ragged 250px of white to the right of it, inside a card whose every other
   row runs the full content width — the line now spans that row and reads as
   one. It still wraps naturally wherever the row is narrower than the copy. */
.aitas-acc .aac-fsec__sub{margin:0 0 11px!important}
/* R11-W4.2: the save button CENTRES. Right-anchored it read as the trailing end
   of a toolbar; the card commits exactly one thing, and that commit belongs on
   the card's own axis — the same axis «Вийти з акаунту» sits on directly below.
   The band's hairline is unchanged. */
.aac-fsub{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:20px;padding-top:18px;border-top:1px solid var(--aac-line);flex-wrap:wrap}
.aac-fsub .aac-micro{max-width:44ch}
.aitas-acc .aac-fsub p{margin:0!important}
.aac-card--form form{margin:0}

/* receiver block (R6-B) — revealed, not created, so a mistaken untick loses
   nothing; the server is what decides whether it is persisted.

   R7-B6: the row used to sit flush against the field block above it (its
   `margin-top:14px!important` lost the cascade to the later, equally specific
   `label.aac-check{margin:0!important}` — measured gap 0.00px above, 29.91px
   below). It lives in a fixed 47px band now and is centred in it: 14.75px of
   air on each side, and the band's height is exactly the 47.5px the two old
   gaps already occupied, so nothing below it moves. The gap under the band is
   owned by the revealed receiver box (24px) instead of by the security
   section's own margin — hence the adjacency reset. */
.aac-rcptband{display:flex;align-items:center;min-height:47px}
.aitas-acc label.aac-rcpt__t{margin:0!important}
.aac-rcpt{margin:0 0 24px}
.aac-rcpt[hidden]{display:none}
.aitas-acc .aac-rcpt .aac-micro{margin-top:10px!important}

/* R8-B5: the two «Повернутися до замовлень» rows are gone with their rules — the
   stripe is pinned, so «Мої замовлення» is on screen at every scroll position
   and two more copies of it were noise, not redundancy. */

/* checkbox rows */
.aitas-acc label.aac-check{display:inline-flex;align-items:center;gap:9px;font-size:13.5px!important;color:var(--aac-ink2)!important;text-transform:none!important;font-weight:600!important;line-height:1.3!important;margin:0!important;padding:0!important;cursor:pointer}
.aitas-acc .aac-check input[type=checkbox]{width:17px!important;height:17px!important;min-height:0!important;accent-color:var(--aac-deep);margin:0!important;flex:none;padding:0!important}
/* a static-label field that resolves to a text input (no state list) keeps the
   plain control geometry — the floating-label paddings would strand its value */
.aitas-acc .aac-fld input.input-text{padding:0 14px!important}

/* ---------- profile: password disclosure ----------
   Deliberately NOT a bordered box: R1 styled this toggle exactly like a select
   and it read as a form control (affordance lie). It is a row of facts and a
   link.

   R11-W4.3: it lives INSIDE «Контактні дані» now, directly under the 2×2 field
   grid — the «Безпека» section that used to wrap it (its own eyebrow, its own
   hairline, its own 24/20px band) is deleted, markup and rules together. 18px
   of air is the grid's own 12px rhythm plus the step that says "different kind
   of row", and it is what the mock measures. */
.aitas-acc .aac-fsec .aac-pwd{margin-top:18px}
/* R12-W4: the summary holds the CTA and nothing else — the «Пароль» label, the
   ••••••• stand-in and the three rules that styled that block are deleted with
   the markup. flex-start, so the link starts at the row's own x, which is the
   field grid's left edge; there is no second block left to align a baseline
   against, and no margin that assumed one. */
.aac-pwd>summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:flex-start;padding:0;user-select:none
}
.aac-pwd>summary::-webkit-details-marker{display:none}
/* R9-W3: a LINK, not a button. The card is allowed exactly one button — the one
   that saves — and this control neither saves nor navigates: it opens a
   disclosure. Accent ink + the chevron say "there is more here" without adding
   a third button chrome to a card that already had one too many. Same accent
   token as .aac-btn--tint / .aac-linkish; details/summary semantics unchanged. */
.aac-pwd__cta{
  display:inline-flex;align-items:center;gap:7px;line-height:1.3;
  font-size:13.5px;font-weight:600;color:var(--aac-deep);background:none;border:0;padding:0;white-space:nowrap
}
.aac-pwd>summary:hover .aac-pwd__cta{text-decoration:underline}
.aac-pwd__cta::after{content:"";width:7px;height:7px;border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;transform:rotate(45deg);margin-top:-3px;transition:transform .2s}
.aac-pwd[open] .aac-pwd__cta::after{transform:rotate(225deg);margin-top:2px}
.aac-pwd__body{padding:16px 0 2px}
.aac-pwd__body .aac-micro{margin-top:10px!important}

/* ---------- auth surfaces ----------
   v3.0.0: the login card is a 424px column centred on the page, so the
   password-recovery surfaces that link to it take the same column and the same
   width — three screens of one flow that used to sit at three different
   x-origins and two different widths. */
.aitas-acc--auth{max-width:424px}
.aitas-acc--auth .aac-head{margin-bottom:16px}
.aac-auth{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.aac-auth--solo{grid-template-columns:minmax(0,1fr)}
.aac-auth__card{padding:22px 24px}
.aac-auth__d{font-size:13px;color:var(--aac-label);line-height:1.5;margin:0 0 16px!important}
.aac-auth__fields{display:flex;flex-direction:column;gap:12px}
.aac-auth__row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px}
.aitas-acc .aac-auth__submit{margin-top:14px!important}
.aitas-acc .aac-auth__card form>.aac-micro{margin-top:12px!important}
.aac-benes{display:flex;flex-direction:column;gap:7px;margin:14px 0 16px!important;padding-bottom:16px!important;border-bottom:1px solid #D3E1EE!important}
.aac-benes li{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--aac-ink2);line-height:1.4}
.aac-benes .aac-ic{width:15px;height:15px;margin-top:2px;color:var(--aac-green-t);stroke-width:2.4}
.aac-auth__foot{margin-top:14px;font-size:13px;color:var(--aac-label)}
.aac-auth__foot a{color:var(--aac-deep);font-weight:700;text-decoration:none}
.aac-auth__foot a:hover{text-decoration:underline}
.aitas-acc .aac-auth__legal{font-size:12px;color:var(--aac-muted);line-height:1.5;margin:12px 0 0!important}
.aac-auth__legal a{color:var(--aac-deep)}
.aitas-acc .woocommerce-privacy-policy-text p{font-size:12px!important;color:var(--aac-muted);line-height:1.5;margin:12px 0 0!important}
.aitas-acc .woocommerce-privacy-policy-text a{color:var(--aac-deep)}
/* Turnstile mount point (R2b): the widget renders `interaction-only`, so it is
   a 0-height node until Cloudflare actually needs to challenge. A CSS-only test
   (:has(iframe)) is wrong — the iframe exists at zero size even when silent,
   which would pay 12px for nothing on prod's real keys. The auth JS measures
   offsetHeight and toggles .is-shown, so the gap is paid only when a challenge
   is actually painted. */
.aac-cap{margin:0}
.aac-cap:empty{display:none}
.aac-cap.is-shown{margin-top:12px}
.aac-cap iframe{max-width:100%}
/* honeypot: off-screen, never display:none (a bot that reads the cascade would
   skip a hidden field; a real user can neither see nor tab into this one) */
.aac-hp{position:absolute!important;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}

/* lost-password confirmation */
.aac-sent{text-align:center}
.aac-sent__ic{width:46px;height:46px;border-radius:50%;background:var(--aac-tint);color:var(--aac-deep);display:inline-flex;align-items:center;justify-content:center;margin-bottom:12px}
.aac-sent__ic .aac-ic{width:22px;height:22px}
.aac-sent__t{font-size:17px;font-weight:800;color:var(--aac-ink);margin:0 0 6px!important}
.aac-sent__d{font-size:14px;color:var(--aac-label);line-height:1.55;margin:0 0 18px!important}
.aac-sent .aac-micro{margin-top:12px!important}

/* OTP panel — the login card's copy lives in css/aitas-login.css; these rules
   still own the R3 guest claim card on the order-received page */
.aac-otp__step{display:none;flex-direction:column;gap:12px}
.aac-otp__step.is-on{display:flex}
.aac-otp__sent{font-size:13.5px;color:var(--aac-ink2);line-height:1.5}
.aac-otp__sent b{font-weight:700}
.aac-code{display:flex;gap:8px}
.aac-code input{
  flex:1;min-width:0;height:56px!important;text-align:center;font-size:21px!important;font-weight:800;color:var(--aac-ink);
  border:1px solid var(--aac-line2)!important;border-radius:11px!important;background:#fff;padding:0!important;font-family:inherit;
  -moz-appearance:textfield
}
.aac-code input:focus{border-color:var(--aac-deep)!important;box-shadow:0 0 0 3px rgba(29,128,199,.14);outline:none}
.aac-otp.is-err .aac-code input{border-color:var(--aac-red)!important;background:#FEF7F7}
/* the error lines are populated by JS — empty means no error, so :empty gates
   the reveal and the .is-err class only paints the boxes */
.aitas-acc .aac-otp__err{display:none;font-size:13px;color:#C33A3A;font-weight:600;line-height:1.4;margin:0!important}
.aitas-acc .aac-otp.is-err .aac-otp__err:not(:empty){display:block}
.aitas-acc .aac-otp__eerr{font-size:13px;color:#C33A3A;font-weight:600;line-height:1.4;margin:0!important}
.aitas-acc .aac-otp__eerr[hidden]{display:none}
.aac-otp__resend{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--aac-label)}
.aac-otp__resend button{font-size:13px}
.aac-otp__resend button:disabled{color:var(--aac-muted);cursor:default;text-decoration:none;font-weight:600}
.aac-btn.is-busy{opacity:.7;cursor:progress}

/* ---------- order-received page blocks (R3) ----------
   Two roots live on the thankyou page — the «Ваша інформація» fact card and the
   guest claim card. They are NOT the cabinet page frame: they sit inside the
   legacy .container/.row grid as ordinary col-12 children, so the root drops the
   cabinet's own width/padding and only carries the design tokens + the
   typography leak reset (.entry-content wraps this surface too). */
/* each root is the only child of its own .col-12, so no :last-child carve here —
   the bottom margin IS the separation from the legacy block that follows */
.aitas-acc--ord{max-width:none;padding:0;margin:0 0 24px}
/* a readonly claim e-mail is a stated fact, not an editable control */
.aitas-acc .aac-ffld--ro input.input-text[readonly]{background:var(--aac-tint);color:var(--aac-ink2);cursor:default}
.aitas-acc .aac-ffld--ro input.input-text[readonly]:focus{border-color:var(--aac-line2)!important;box-shadow:none}

/* guest claim card: full card width like its neighbours, with the pitch and the
   claim form as two columns — a narrow card floating under two page-wide blocks
   read as an afterthought, which is the opposite of what this offer is */
.aac-offer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:22px 34px;align-items:start}
.aac-offer__t,.aac-offer__f{min-width:0}
.aac-offer__t .aac-eyebrow{margin-bottom:5px}
.aitas-acc .aac-offer .aac-auth__d{margin:6px 0 0!important}
/* in the login card this list ends with a divider before the form below it;
   here it ends a column, so the divider would fence off nothing */
.aitas-acc .aac-offer .aac-benes{margin:14px 0 0!important;padding-bottom:0!important;border-bottom:0!important}
.aac-offer .aac-otp__step{gap:14px}
.aitas-acc .aac-offer .aac-sent__d{margin-bottom:16px!important}

/* ---------- WC notices inside the cabinet ---------- */
.aitas-acc .woocommerce-notices-wrapper:not(:empty){margin-bottom:14px!important}
/* WC core paints a WooCommerce-font glyph via ::before at an absolute 21/14 —
   it lands on top of the notice border in this padding scheme */
.aitas-acc .woocommerce-error::before,.aitas-acc .woocommerce-message::before,
.aitas-acc .woocommerce-info::before{content:none!important;display:none!important}
/* keep a notice the width of the card it belongs to on the auth surfaces */
.aitas-acc--auth .woocommerce-notices-wrapper{max-width:468px}
.aitas-acc .woocommerce-message,.aitas-acc div.woocommerce-info,.aitas-acc ul.woocommerce-error,.aitas-acc div.woocommerce-error{
  border-radius:12px;padding:13px 16px;margin:0 0 12px!important;font-size:14px;line-height:1.5;list-style:none;
  background:rgba(61,204,59,.10);border:1px solid rgba(35,160,33,.30);color:#1E6E1D
}
.aitas-acc div.woocommerce-info{background:var(--aac-tint);border-color:rgba(29,128,199,.30);color:var(--aac-ink2)}
.aitas-acc ul.woocommerce-error,.aitas-acc div.woocommerce-error{background:#FDF1F1;border-color:rgba(226,59,59,.35);color:#8C2626}
.aitas-acc ul.woocommerce-error li{margin:3px 0!important;padding:0}
.aitas-acc ul.woocommerce-error li a,.aitas-acc .woocommerce-error a{color:#8C2626;font-weight:700}
.aitas-acc .woocommerce-message a.button,.aitas-acc div.woocommerce-info a.button{display:none}
.aac-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* keyboard focus: a theme global sets outline:none on every interactive element
   (measured live) — the cabinet restores a visible ring for keyboard users only */
.aitas-acc a:focus-visible,.aitas-acc button:focus-visible,.aitas-acc summary:focus-visible,
.aitas-acc input:focus-visible,.aitas-acc select:focus-visible,.aitas-acc [tabindex]:focus-visible{
  outline:2px solid var(--aac-deep)!important;outline-offset:2px
}
.aitas-acc .aac-orow__go:focus-visible{outline-offset:-3px}

/* ---------- responsive ---------- */
/* the theme header is 56px below its own 991/992 breakpoint, not 64 (measured
   live 2026-07-27). The stripe's sticky offset is derived from this token and
   pinBottom() reads the result back off the DOM, so one line moves the pin, the
   `?open=` placement and the switch-open glide together. */
@media(max-width:991px){
  .aitas-acc{--aac-hdr:56px}
  /* R16-W2: nothing glides below 992px any more — the collapse takes a
     single-frame cut and multi-open removed the open-side glide — so R14-W1's
     `is-gliding` blur suspension was unreachable here and is gone. The desktop
     glide keeps its live backdrop-filter by design. */
}
@media(max-width:900px){
  /* R12-W3: two chips, one row, centred — the base flex rule already does that,
     so the 2×2 grid R11 needed for four controls is deleted rather than
     re-tuned. Only the padding tightens. */
  .aac-card.aac-top{padding:6px 10px}
  .aac-nav{justify-content:center}
}
@media(max-width:1060px){
  .aac-orow{grid-template-columns:128px minmax(0,1fr) 116px 116px}
  .aac-orow__act{grid-column:2/-1;justify-content:flex-start;padding-top:2px}
  .aac-skel{grid-template-columns:128px minmax(0,1fr) 116px 116px}
}
@media(max-width:980px){
  .aac-auth{grid-template-columns:1fr}
}
@media(max-width:760px){
  .aac-addr{grid-template-columns:1fr}
  .aac-kv{grid-template-columns:1fr;gap:14px}
  .aac-form{grid-template-columns:1fr}
  .aac-form>.form-row-first,.aac-form>.form-row-last,.aac-form>.aac-col{grid-column:1/-1}
  .aac-offer{grid-template-columns:1fr;gap:18px}
}
@media(max-width:640px){
  .aitas-acc{padding:4px 14px 56px}
  .aac-card{padding:16px 18px;border-radius:12px}
  .aac-auth__card{padding:18px}
  .aac-h1{font-size:23px;margin-top:10px!important}
  .aac-head__a{width:100%}
  .aac-head__a .aac-btn{width:100%}
  .aac-h2{font-size:16.5px}
  .aac-head{margin-bottom:14px}
  /* R12-W3: the stripe IS pinned on a phone now (owner, round 7). R8 left it in
     normal flow on the judgment that a phone scrolls back cheaply; with two
     chips the band is 60px and it buys the pane swap at every scroll position.
     --aac-pin:0 parks it flush under the 56px header — that is the whole of the
     offset, and the ::before canvas patch has no gap left to paint, so it stays
     off here (it is inset −24px on each side, which at 390px would reach past
     the viewport and open a horizontal scroll). */
  .aitas-acc{--aac-pin:0px}
  .aac-stripe::before{content:none}
  .aac-card.aac-top{padding:8px;gap:8px}
  /* one line per chip is the point of the short labels: nowrap can stay, the
     control keeps the 44px it had, and «Налаштування профілю» stops wrapping to
     two lines because it is no longer the string being rendered. */
  /* R13-W3: the two chips share the band equally (flex:1 1 0 off a zero basis,
     so their content lengths stop deciding their widths) and cap at 200px so a
     tablet-width phone does not stretch them across the card. justify-content
     is the ≤900 rule's, still applying here — icon+label ride centred in
     whatever width the pair resolves to. */
  .aac-nav{min-height:44px;padding:5px 10px;gap:8px;flex:1 1 0;max-width:200px}
  /* the base rule clips with an ellipsis; on an equal-width chip the label
     (~100px with its icon) cannot reach the ~134px the narrowest supported
     phone gives it, so the only thing overflow:hidden was still doing was
     shaving the subpixel tail off «Профіль»'s «ь». */
  .aac-nav b{font-size:12.5px;line-height:1.2;overflow:visible}
  /* R14-W2: geometrically centred, optically a hair right — the trailing «ь»
     carries no visual weight. 2px of asymmetric padding re-centres the cluster
     for the eye without moving the chip box (owner, round 9). */
  .aac-nav--me{padding-left:8px;padding-right:12px}
  /* the label swap — server-rendered pair, CSS picks, no JS and no reflow of
     anything else */
  .aac-nav__l{display:none}
  .aac-nav__s{display:inline}
  /* order row → compact block; every cell keeps content, no dead bands.
     R12-W5: the two paddings become tokens because the action button needs the
     difference between them and nothing should state 34 or 18 twice. The right
     one is the chevron's reserve, the left one is the row's content x. */
  .aac-ledger__head{padding:11px 34px 11px 18px}
  /* R13-W2: `auto` made the media column as wide as whatever that particular
     order happened to render — 38px for one thumbnail, 80px for two or for a
     thumbnail plus the «+N» tile — so the text of every row started at a
     different x and the list read as four different templates. The column is
     the ONE thumbnail's width now, stated once, and every row below is the same
     row. R16-W1: that thumbnail is 56px (owner, round 11) — a bigger tile
     comfortably filling the left of the box, the same one-template argument,
     and the text column simply starts 18px further in. */
  .aac-orow{--aac-rowl:18px;--aac-rowr:34px;grid-template-columns:56px minmax(0,1fr);gap:7px 12px;padding:13px var(--aac-rowr) 13px var(--aac-rowl)}
  /* R14-W4: the chevron leaves the (now occupied) middle of the row and sits on
     the № line — 18px box centred on the number's 19.5px line (13px row padding
     + half line). Bigger per owner, round 9. */
  .aac-orow__chev{right:12px;top:13px;margin-top:0;width:18px;height:18px}
  .aac-orow__chevic{width:18px;height:18px}
  .aac-skel{grid-template-columns:56px minmax(0,1fr);gap:7px 12px;padding:13px 34px 13px 18px}
  .aac-more{padding:14px 18px 16px}
  .aac-more__b{width:100%;min-width:0}
  /* ONE thumbnail at 390px, unconditionally — the count of products is already
     spelled out in the meta line («N товарів»), so a second tile bought nothing
     and cost the single row template W2 is about. */
  .aac-orow__thumbs{gap:4px}
  .aac-orow__thumbs img:nth-child(2),.aac-orow__thumbs img:nth-child(3){display:none}
  .aac-orow__num{display:flex;flex-wrap:wrap;gap:0 8px}
  .aac-orow__num span{margin-left:0}
  .aac-orow__meta{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  /* R16-W1 / v3.7.1: the tile's top edge sits on the «№ …» line. The base
     rule's align-items:center is what floated it mid-row; `start` parks it on
     the grid area's top = the row's 13px padding line = the number's box top.
     v3.7.1: the tile owns ROW 1 ALONE (was 1/3) — its 56px min-content sizes
     row 1 to at least the tile, so the foot line below always clears it and
     can take the full card width. `mid` pins to start for the same reason:
     in a tile-tall first row the number must stay on the tile's top line, not
     float to its middle (owner rounds 10-11: one template, every row). */
  .aac-orow__thumbs{grid-row:1/2;align-self:start}
  .aac-orow__mid{align-self:start}
  .aac-orow__thumbs img{width:56px!important;height:56px!important}
  /* the overflow counter stops being a TILE in the media column — a tile is a
     second column, and this breakpoint has exactly one. It becomes a badge on
     the corner of the thumbnail, out of flow, so a row with more items is the
     same row as a row without. data-more-m is already the count for one visible
     tile (see orders.php), which is exactly what it has to read now.
     v3.7.1: TOP-right corner (owner, round 11) — the foot line now passes under
     the tile, and a bottom badge would crowd the sum riding beneath it. */
  .aac-orow__more{
    position:absolute;right:-7px;top:-7px;width:auto;min-width:21px;height:19px;padding:0 5px;
    font-size:10px;font-weight:800;color:#fff;background:var(--aac-deep);
    border:2px solid #fff;border-radius:999px;
    display:inline-flex;align-items:center;justify-content:center;z-index:1
  }
  .aac-orow__more::after{content:attr(data-more-m)}
  /* R14-W3 / R15 / v3.7.1: the foot line. Grid auto-flow lands the wrapper at
     row 2 — and with the tile confined to row 1 (v3.7.1) it spans BOTH columns:
     the −16px right margin bleeds into the chevron's reserve exactly as the
     action button does, so the centring box IS the card's content width and
     the cluster centres on the card's true centre. That width is also the fix
     for v3.7.0's mixed rows: the 56px tile had narrowed the old column-2 box
     to ~190px, right at the widest sum+chip clusters' size, so near-identical
     rows wrapped or not by a few subpixels. Full width fits every real cluster
     on one line; only a true-narrow phone (≤~340) still wraps, both lines
     centred. R15 (owner, round 10): one centred cluster, 14px apart. */
  .aac-orow__foot{
    display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 14px;min-width:0;
    grid-column:1/3;margin-right:calc(var(--aac-rowl) - var(--aac-rowr))
  }
  .aac-orow__foot .aac-orow__sum{order:-1;text-align:left;font-size:16px}
  .aac-orow__foot .aac-orow__st{min-width:0}
  /* R12-W5: the button was inset 18px on the left and 34px on the right — the
     row's chevron reserve, which the chevron needs and a full-width control does
     not. The cell bleeds back into that reserve by exactly the difference, so
     both insets read 18px and the button is symmetric under the content above
     it. One rule, both variants («Трекінг» and «Повторити» are the same chip),
     and the same 3px top gap whichever one renders. 44px, not the desktop 36:
     this is the row's only touch target. */
  .aac-orow__act{grid-column:1/-1;order:4;justify-content:stretch;padding:3px 0 0;margin-right:calc(var(--aac-rowl) - var(--aac-rowr))}
  .aac-orow__act .aac-btn{width:100%;height:44px}
  /* receipt panel: one line item per row, and the foot stacks */
  .aac-rc{padding:14px 18px 16px}
  .aac-lines{grid-template-columns:minmax(0,1fr);gap:6px}
  .aac-line{padding:6px;gap:10px}
  .aac-line__ph{width:50px;height:50px}
  /* R10-W1: the eyebrow pair wraps — «СКЛАД ЗАМОВЛЕННЯ» owns its line and the
     timestamp drops UNDER it, left-aligned (a right-flushed date on a 358px
     content width reads as a stray column). */
  .aac-rc__eyerow{gap:2px}
  .aac-rc__when{flex:1 1 100%;text-align:left}
  /* R10-W4: the decision row stacks; the closing strip re-mirrors this
     breakpoint's tighter .aac-rc padding (change one, change both) */
  .aac-rc__hide{margin:14px -18px -16px;width:calc(100% + 36px)}
  .aac-rc__do{flex-direction:column;align-items:stretch;gap:8px}
  /* 44px, not the 36px desktop --sm: these are the receipt's touch targets (the
     R2 lanes measured 36px chips as under the comfortable band) */
  .aac-rc__do .aac-btn{width:100%;height:44px}
  .aac-cancel,.aac-cancel__c{width:100%;flex-direction:column;align-items:stretch}
  .aac-cancel__q{margin-bottom:2px}
  .aac-fsub{flex-direction:column;align-items:stretch}
  .aac-fsub .aac-btn{width:100%}
  /* R11-W4.5 (queued polish item, retired here): the disclosure's summary is a
     tap target like any other and gets the comfortable 44px on a phone. Desktop
     is untouched — the row is 36px there by design, and a pointer does not need
     the band. */
  .aac-pwd>summary{min-height:44px}
  /* full-width button inset to the card's content x on BOTH sides (1px border +
     18px padding in here), which is also what keeps it centred */
  .aac-signout{margin-left:19px;margin-right:19px}
  .aac-signout__b{width:100%;min-width:0;height:48px}
  .aac-code input{height:50px!important;font-size:19px!important}
  /* tracking: the copy chip keeps its row, «Трекінг» goes full width under it
     (side by side they would each fall under the comfortable tap width) */
  .aac-trk{width:100%;gap:8px;flex-wrap:wrap}
  /* R13-W4: full width here, so the content has to be told where to sit — the
     desktop chip is shrink-wrapped and never had to. The nline grid keeps the
     ghost-width contract untouched: «Скопійовано» still swaps inside the
     resting number's width, so centring costs zero geometry shift. */
  .aac-trk__cp{width:100%;height:44px;justify-content:center}
  .aac-trk__go{width:100%;height:44px}
}