/* Atlas components — shared across every administrative workspace.
   Foundation owns tokens, navigation and the dashboard. Module sheets own
   their layouts. Checkout content is rendered in its separately styled frame. */

/* Small layout primitives */
.row { display:flex; align-items:center; gap:10px; min-width:0; }
.row.wrap, .wrap.row { flex-wrap:wrap; }
.spread { justify-content:space-between; }
.spacer { flex:1; }
.full { grid-column:1 / -1; }
.muted { color:var(--muted); }
.text-success { color:var(--green); }
.text-danger { color:var(--red); }
.mono, .numeric, .large-amount { font-variant-numeric:tabular-nums; }
.break-all, pre.wrap { overflow-wrap:anywhere; white-space:pre-wrap; }
.grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(0,1fr); gap:20px; margin-bottom:20px; }
.grid.equal { grid-template-columns:repeat(2,minmax(0,1fr)); }
.card { min-width:0; border:1px solid var(--line); border-radius:var(--radius,14px); background:var(--card); box-shadow:var(--shadow); overflow:hidden; }
.pad { padding:22px; }
.card-head { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:20px 22px 0; min-width:0; }
.card-head h2 { margin:0; font-size:14px; line-height:1.5; font-weight:650; }
.card-head small { display:block; margin-top:4px; font-size:11px; line-height:1.6; color:var(--muted); }
.card-head > div { min-width:0; }
.card-head > .btn { flex-shrink:0; }
.card-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:14px 22px; border-top:1px solid var(--line); background:var(--card); }
.section-heading { margin:26px 0 14px; }
.divider { height:1px; border:0; background:var(--line); margin:24px 0; }
.large-amount { font-size:32px; line-height:1.2; letter-spacing:-1px; font-weight:650; overflow-wrap:anywhere; }
.context-row { display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; margin:16px 0; color:var(--muted); font-size:11px; }
.context-row small { overflow-wrap:anywhere; }
.stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:22px; min-width:0; }
.stat { min-width:0; padding:20px; border:1px solid var(--line); border-radius:14px; background:var(--card); box-shadow:var(--shadow); }
.stat .label { display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--muted); font-size:11px; line-height:1.5; font-weight:500; }
.stat .label .icon { width:15px; height:15px; color:var(--muted); }
.stat strong { display:block; margin:11px 0 6px; color:var(--text); font-size:28px; line-height:1.2; font-weight:600; letter-spacing:-.85px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.stat small { display:block; font-size:11px; line-height:1.55; color:var(--muted); }
.stat .mini { display:block; width:70px; height:20px; margin-top:10px; }
.chart { width:100%; height:240px; overflow:visible; }
.chart text { fill:var(--muted); font:10px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.chart .gridline { stroke:var(--line); stroke-width:1; }
.chart-legend, .gateway-legend { display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin-top:14px; color:var(--muted); font-size:11px; }
.chart-legend i { display:inline-block; width:6px; height:6px; margin-right:5px; border-radius:50%; background:var(--primary); }
.metric-bars { display:grid; gap:18px; }
.home-batches { margin:22px 0; }
.home-batches .card-head { padding-bottom:18px; border-bottom:1px solid var(--line); }
.home-batch { padding:18px 22px; border-bottom:1px solid var(--line); }
.home-batch:last-child { border-bottom:0; }
.home-batch > .row { margin:10px 0; }
.home-batch > .row:first-child { margin-top:0; }
.home-batch > .row:last-child { margin-bottom:0; }
.home-batch > .row:first-child strong { font-size:13px; font-weight:600; }
.home-batch small { display:block; margin-top:3px; color:var(--muted); font-size:11px; }
.countdown-large { margin:14px 0; font-size:34px; line-height:1.2; letter-spacing:-1px; font-weight:600; font-variant-numeric:tabular-nums; }
.health-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.health-item { padding:16px; border:1px solid var(--line); border-radius:10px; background:var(--soft); }
.health-item strong { display:block; margin-top:8px; font-size:19px; font-weight:600; }
.gateway-row { padding:16px 22px; border-bottom:1px solid var(--line); }
.gateway-row:last-child { border-bottom:0; }
.gateway-name { font-size:12px; font-weight:550; }
.gateway-foot { display:flex; justify-content:space-between; gap:12px; margin-top:6px; color:var(--muted); font-size:10px; }
.gateway-breakdown { display:grid; gap:20px; }
.gateway-breakdown .row strong { font-size:13px; font-weight:600; }
.gateway-breakdown small { display:block; margin-top:7px; color:var(--muted); font-size:11px; }
.gateway-chart { height:245px; }
.revenue-kind { padding:12px 0; border-bottom:1px solid var(--line); font-size:12px; }
.revenue-kind:last-child { border-bottom:0; }
.revenue-kind strong small { display:block; margin-top:3px; font-size:10px; font-weight:400; }
.demo-strip { display:flex; align-items:center; gap:10px; padding:10px 13px; margin-bottom:20px; border:1px solid color-mix(in srgb,var(--amber) 20%,var(--line)); border-radius:9px; background:var(--amber-bg); color:var(--amber); font-size:11px; }
.demo-strip > span { flex:1; min-width:0; }
.onboarding { display:flex; align-items:center; gap:16px; padding:20px; margin-bottom:22px; border:1px solid var(--line); border-radius:12px; background:var(--card); }
.onboarding > div { flex:1; min-width:0; }
.onboarding p { margin-top:5px; color:var(--muted); font-size:12px; line-height:1.6; }
.preview-frame { display:block; width:100%; height:570px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.preview-frame.mobile { width:390px; max-width:100%; margin-inline:auto; }

/* Actions */
.btn, .icon-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  min-height:36px; padding:8px 12px; border:1px solid var(--line); border-radius:8px;
  background:var(--card); color:var(--text); font:inherit; font-size:12px; line-height:1.35;
  font-weight:550; text-decoration:none; text-align:center; cursor:pointer; vertical-align:middle;
  box-shadow:0 1px 2px rgb(15 23 42 / 3%); white-space:nowrap; touch-action:manipulation;
  transition:background 180ms ease,border-color 180ms ease,box-shadow 180ms ease,color 180ms ease,transform 180ms ease;
}
.btn:hover, .icon-btn:hover { background:var(--soft); border-color:color-mix(in srgb,var(--muted) 35%,var(--line)); }
.btn:active:not(:disabled), .icon-btn:active:not(:disabled) { transform:translateY(1px); }
.btn.primary { background:var(--primary); border-color:var(--primary); color:#fff; box-shadow:0 1px 2px rgb(40 30 100 / 12%); }
.btn.primary:hover { background:color-mix(in srgb,var(--primary) 88%,#15152a); border-color:color-mix(in srgb,var(--primary) 88%,#15152a); }
html[data-theme=dark] .btn.primary { background:#6d5de6; border-color:#6d5de6; color:#fff; }
html[data-theme=dark] .btn.primary:hover { background:#6655dc; border-color:#6655dc; }
.btn.danger { color:var(--red); }
.btn.danger:hover { background:var(--red-bg); border-color:color-mix(in srgb,var(--red) 25%,var(--line)); }
.btn.link { color:var(--primary); border-color:transparent; background:transparent; box-shadow:none; padding-inline:4px; }
.btn.link:hover { background:var(--hover); }
.btn.small { min-height:30px; padding:5px 9px; font-size:11px; }
.btn .icon { width:15px; height:15px; flex-shrink:0; }
.icon-btn { width:34px; min-width:34px; height:34px; min-height:34px; padding:0; flex-shrink:0; }
.icon-btn .icon { width:16px; height:16px; }
.btn:disabled, .icon-btn:disabled, button[aria-disabled=true] { opacity:.48; cursor:not-allowed; transform:none; box-shadow:none; }
.btn[aria-busy=true] { cursor:wait; }
.row-link { display:inline; border:0; border-radius:3px; background:none; padding:0; color:var(--text); font:inherit; font-weight:550; text-align:left; text-decoration:none; cursor:pointer; overflow-wrap:anywhere; }
.row-link:hover { color:var(--primary); text-decoration:underline; text-underline-offset:3px; }
:is(button,a,summary,input,select,textarea,[tabindex]):focus-visible { outline:2px solid var(--primary); outline-offset:3px; }

/* Status, money and compact indicators */
.badge { display:inline-flex; align-items:center; gap:5px; max-width:100%; border-radius:20px; padding:3px 8px; background:var(--soft); color:var(--muted); font-size:10px; line-height:1.5; font-weight:550; vertical-align:middle; white-space:nowrap; }
.badge:not(:has(svg))::before { content:""; width:5px; height:5px; flex-shrink:0; border-radius:50%; background:currentColor; opacity:.8; }
.badge .icon { width:12px; height:12px; }
.badge.green { background:var(--green-bg); color:var(--green); }
.badge.red { background:var(--red-bg); color:var(--red); }
.badge.amber { background:var(--amber-bg); color:var(--amber); }
.badge.purple { background:var(--hover); color:var(--primary); }
.reporting-money { display:inline-flex; flex-direction:column; align-items:flex-start; gap:2px; max-width:100%; font-variant-numeric:tabular-nums; }
.reporting-money > strong { color:var(--text); font-size:13px; line-height:1.4; font-weight:600; white-space:nowrap; }
.reporting-money > small { color:var(--muted); font-size:10px; line-height:1.5; white-space:normal; overflow-wrap:anywhere; }
.reporting-money.fx-missing > strong { color:var(--amber); }
.large-amount .reporting-money > strong { font-size:inherit; font-weight:inherit; letter-spacing:inherit; }
.large-amount .reporting-money > small { font-size:12px; font-weight:400; letter-spacing:0; }
.reporting-note { color:var(--muted); font-size:11px; line-height:1.65; margin:16px 0; }
.reporting-currency { display:flex; flex-direction:column; justify-content:center; gap:4px; padding:8px 12px; border:1px solid var(--line); border-radius:8px; background:var(--soft); }
.reporting-currency small { font-size:10px; color:var(--muted); }
.reporting-currency strong { font-size:12px; font-weight:600; }
.progress { height:5px; border-radius:20px; overflow:hidden; background:var(--soft); margin-top:10px; }
.progress > span { display:block; height:100%; min-width:0; max-width:100%; border-radius:inherit; background:var(--primary); transition:width 180ms ease; }
.batch-progress { min-width:120px; }
.live-status { display:inline-flex; align-items:center; gap:6px; font-size:10px; font-weight:550; color:var(--muted); white-space:nowrap; }
.live-status i { width:6px; height:6px; border-radius:50%; background:var(--muted); }
.live-status.connected i { background:var(--green); box-shadow:0 0 0 3px var(--green-bg); }
.live-status small { font-size:10px; }
.draft-indicator, #draft-state { display:inline-flex; align-items:center; gap:6px; color:var(--muted); font-size:11px; line-height:1.5; }
.draft-indicator::before { content:""; width:5px; height:5px; border-radius:50%; background:var(--green); }

/* Forms: native controls retain their keyboard and assistive behavior. */
input, select, textarea {
  width:100%; min-width:0; min-height:38px; padding:9px 11px;
  border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--text);
  font:inherit; font-size:13px; line-height:1.4; box-shadow:0 1px 2px rgb(15 23 42 / 2%);
  transition:border-color 180ms ease,box-shadow 180ms ease;
}
/* Reserve the same end gutter in filters, dialogs and the compact mode picker.
   The select stays native for keyboard/touch interaction; only its arrow is drawn. */
select:not([multiple]):not([size]), select:not([multiple])[size="1"] {
  -webkit-appearance:none; appearance:none; padding-inline-end:36px;
  background-image:var(--select-chevron); background-repeat:no-repeat;
  background-position:right 11px center; background-size:14px 14px;
  text-overflow:ellipsis;
}
input::placeholder, textarea::placeholder { color:var(--muted); opacity:1; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent); }
input:disabled, select:disabled, textarea:disabled { background-color:var(--soft); color:var(--muted); cursor:not-allowed; }
input[readonly], textarea[readonly] { background:var(--soft); }
input[type=number] { font-variant-numeric:tabular-nums; }
input[type=date], input[type=time], input[type=datetime-local] { min-width:0; max-width:100%; -webkit-min-logical-width:0; font-variant-numeric:tabular-nums; }
input::-webkit-date-and-time-value { min-height:1.4em; text-align:left; }
input::-webkit-calendar-picker-indicator { cursor:pointer; margin:0; padding:2px; }
textarea { resize:vertical; min-height:112px; line-height:1.65; }
input[type=checkbox], input[type=radio] { width:17px; height:17px; min-height:17px; padding:0; border-radius:4px; box-shadow:none; flex-shrink:0; accent-color:var(--primary); cursor:pointer; }
input[type=radio] { border-radius:50%; }
input[type=color] { min-height:40px; height:40px; padding:5px; cursor:pointer; }
input[type=range] { min-height:28px; padding:0; box-shadow:none; accent-color:var(--primary); }
input[type=file] { max-width:100%; padding:7px; overflow:hidden; font-size:12px; background:var(--soft); box-shadow:none; }
input[type=file]::file-selector-button { border:1px solid var(--line); border-radius:5px; background:var(--card); color:var(--text); padding:6px 9px; margin-right:9px; font:inherit; cursor:pointer; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 18px; }
.field { display:block; min-width:0; color:var(--text); font-size:12px; font-weight:550; line-height:1.5; }
.field input, .field select, .field textarea { display:block; margin-top:7px; font-weight:400; }
.field small { display:block; margin-top:6px; color:var(--muted); font-size:11px; font-weight:400; line-height:1.6; overflow-wrap:anywhere; }
.field.full { grid-column:1 / -1; }
.check { display:flex; align-items:flex-start; gap:9px; min-width:0; min-height:30px; font-size:12px; line-height:1.65; font-weight:400; cursor:pointer; }
.check input { margin:2px 0 0; }
.check > span { min-width:0; overflow-wrap:anywhere; }
.check small { display:block; color:var(--muted); font-size:11px; }
.form-section { border-top:1px solid var(--line); margin-top:26px; padding:24px 0 0; }
.form-section > h3 { margin-bottom:16px; }
.form-section > p { margin:0 0 16px; color:var(--muted); font-size:12px; line-height:1.65; }
.form-error, .inline-error, [data-field-error] { color:var(--red); font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.inline-error, [data-field-error] { margin-top:7px; }
.form-error:empty { display:none; }
.form-error:not(:empty) { padding:12px 14px; margin-top:18px; border:1px solid color-mix(in srgb,var(--red) 20%,var(--line)); border-radius:8px; background:var(--red-bg); }
:is(input,select,textarea)[aria-invalid=true] { border-color:var(--red); }
:is(input,select,textarea)[aria-invalid=true]:focus { box-shadow:0 0 0 3px color-mix(in srgb,var(--red) 12%,transparent); }
.shop-checkboxes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0; padding:16px; border:1px solid var(--line); border-radius:10px; }
.shop-checkboxes legend { padding:0 6px; color:var(--muted); font-size:12px; }
.shop-checkboxes .check { grid-column:auto; }
.switch-row { display:flex; justify-content:space-between; align-items:center; gap:20px; width:100%; min-height:44px; padding:10px 0; border:0; border-radius:6px; background:transparent; color:var(--text); font:inherit; font-size:12px; text-align:left; cursor:pointer; }
.switch-row > span:first-child { min-width:0; flex:1; }
.v09-switch-state { width:76px; flex-shrink:0; color:var(--muted); font-size:10px; text-align:right; }
.switch-row > span:first-child small { display:block; color:var(--muted); font-size:11px; line-height:1.6; margin-top:4px; }
.switch-row:hover { background:var(--soft); }
.toggle { display:block; width:34px; height:20px; flex-shrink:0; border-radius:20px; background:color-mix(in srgb,var(--muted) 35%,var(--line)); position:relative; transition:background 180ms ease; }
.toggle::after { content:""; position:absolute; width:14px; height:14px; left:3px; top:3px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgb(0 0 0 / 14%); transition:transform 180ms ease; }
.toggle.on, .switch-row[aria-checked=true] .toggle { background:var(--primary); }
.toggle.on::after, .switch-row[aria-checked=true] .toggle::after { transform:translateX(14px); }

/* Toolbars, filters and navigation within a view */
.toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:20px; min-width:0; }
.toolbar > .row { min-width:0; }
.toolbar input, .toolbar select { width:auto; min-width:0; max-width:100%; min-height:36px; font-size:12px; }
.toolbar .field input, .toolbar .field select { width:100%; }
.toolbar .date { display:flex; align-items:center; flex-wrap:wrap; gap:8px; min-width:0; }
.toolbar .date input { max-width:180px; }
.filters-v06 { display:flex; align-items:flex-end; padding:18px; border:1px solid var(--line); border-radius:12px; background:var(--card); }
.filter-fields { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; width:100%; min-width:0; }
.filter-fields .field { min-width:0; font-size:11px; }
.filter-fields input, .filter-fields select { width:100%; min-width:0; max-width:100%; margin-top:6px; }
.filters-v06 > .row { display:flex; width:100%; flex-wrap:wrap; gap:8px; padding-top:2px; }
.filters-v06 > .row > .field { min-width:min(210px,100%); margin-left:auto; }
.v09-filter-panel { min-width:0; border:1px solid var(--line); border-radius:12px; margin-bottom:20px; background:var(--card); }
.v09-filter-panel > summary { display:flex; align-items:center; gap:9px; min-height:44px; padding:11px 16px; list-style:none; cursor:pointer; font-size:12px; font-weight:550; border-radius:11px; }
.v09-filter-panel > summary::-webkit-details-marker { display:none; }
.v09-filter-panel > summary > small { color:var(--muted); font-size:11px; font-weight:400; }
.v09-filter-panel > summary > .icon:first-child { width:15px; height:15px; color:var(--muted); }
.v09-filter-panel > summary > .icon:last-child { width:14px; height:14px; margin-left:auto; transition:transform 180ms ease; }
.v09-filter-panel[open] > summary > .icon:last-child { transform:rotate(180deg); }
.v09-filter-panel > .filters-v06, .v09-filter-panel > .home-filters { margin:0; border:0; border-top:1px solid var(--line); border-radius:0 0 11px 11px; padding:18px 16px; }
.v09-filter-count { display:inline-grid; place-items:center; min-width:19px; height:19px; border-radius:5px; background:var(--hover); color:var(--primary); font-size:10px; }
.tabs { display:flex; align-items:center; gap:24px; min-width:0; overflow-x:auto; border-bottom:1px solid var(--line); margin-bottom:22px; scrollbar-width:none; }
.tabs::-webkit-scrollbar { display:none; }
.tabs > :is(button,a) { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:43px; flex-shrink:0; padding:10px 0; border:0; border-bottom:2px solid transparent; border-radius:0; background:transparent; box-shadow:none; color:var(--muted); font:inherit; font-size:12px; font-weight:500; white-space:nowrap; cursor:pointer; text-decoration:none; }
.tabs > :is(button,a):hover { color:var(--text); }
.tabs > :is(button,a).active, .tabs > :is(button,a)[aria-selected=true] { color:var(--primary); border-bottom-color:var(--primary); font-weight:600; }
.tabs > :is(button,a):focus-visible { outline-offset:-3px; }

/* Dense on desktop, a labeled card layout on narrow screens. */
.table-wrap { max-width:100%; min-width:0; overflow:auto; scrollbar-width:thin; scrollbar-color:var(--line) transparent; overscroll-behavior-x:contain; }
.table { width:100%; border-collapse:collapse; text-align:left; white-space:nowrap; font-variant-numeric:tabular-nums; }
.table th { padding:12px 18px; background:var(--soft); border-bottom:1px solid var(--line); color:var(--muted); font-size:11px; line-height:1.5; font-weight:550; text-align:left; }
.table td { padding:14px 18px; border-bottom:1px solid var(--line); font-size:12px; line-height:1.55; vertical-align:middle; }
.table tbody tr:last-child td { border-bottom:0; }
.table tbody tr { transition:background 180ms ease; }
.table tbody tr:hover { background:color-mix(in srgb,var(--soft) 70%,var(--card)); }
.table .numeric { text-align:right; }
.table .numeric .reporting-money { align-items:flex-end; }
.table strong { font-weight:550; }
.table small { display:block; max-width:300px; margin-top:4px; font-size:10px; line-height:1.55; color:var(--muted); white-space:normal; overflow-wrap:anywhere; }
.table td > .row { gap:7px; }
.table td .btn { min-height:32px; padding:6px 9px; font-size:11px; }
.table td code { font-size:11px; overflow-wrap:anywhere; }
.table td .reporting-money > strong { font-size:13px; font-weight:600; }
.table td .reporting-money > small { margin-top:0; }
.table .actions-cell { text-align:right; }
.table .actions-cell > .row { justify-content:flex-end; }
.table-tools { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; padding:14px 18px; border-bottom:1px solid var(--line); }
.table-tools input { max-width:300px; min-height:34px; font-size:12px; }
.table-foot { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:12px 18px; border-top:1px solid var(--line); color:var(--muted); background:var(--card); font-size:11px; line-height:1.6; }
.table-image { width:40px; height:40px; object-fit:cover; border:1px solid var(--line); border-radius:7px; background:var(--soft); }
.unread-row { background:color-mix(in srgb,var(--primary) 4%,var(--card)); }
[data-density=compact] .table td { padding-block:10px; }
[data-density=comfortable] .table td { padding-block:18px; }
.pagination { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:16px; color:var(--muted); font-size:11px; }
.pagination > div { display:flex; align-items:center; gap:8px; min-width:0; }
.pagination > small { font-size:11px; line-height:1.6; }
.pagination .btn { min-width:36px; }
.pagination select { width:auto; min-width:64px; min-height:34px; font-size:12px; }
.v09-order-expand { display:none; }

/* Record identity, detail lists and products */
.details-list { display:grid; gap:0; font-size:12px; }
.detail-row { display:flex; align-items:flex-start; justify-content:space-between; gap:22px; padding:10px 0; min-width:0; border-bottom:1px solid var(--line); line-height:1.6; }
.detail-row:last-child { border-bottom:0; }
.detail-row > span:first-child { color:var(--muted); flex:0 1 42%; }
.detail-row > strong { min-width:0; flex:0 1 58%; font-weight:500; text-align:right; overflow-wrap:anywhere; }
.detail-row > strong .row { justify-content:flex-end; }
.order-product { display:flex; align-items:center; gap:10px; min-width:150px; max-width:260px; white-space:normal; }
.order-product > div { min-width:0; }
.order-product img, .product-placeholder { display:grid; place-items:center; width:38px; height:42px; flex-shrink:0; border:1px solid var(--line); border-radius:7px; background:var(--soft); object-fit:cover; }
.order-product strong { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; color:var(--text); font-size:11px; line-height:1.5; font-weight:550; }
.order-product small { margin-top:3px; }
.product-name { max-width:300px; white-space:normal; overflow-wrap:anywhere; }
.product-row { display:flex; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid var(--line); font-size:12px; min-width:0; }
.product-row:last-child { border-bottom:0; }
.product-row > div { min-width:0; flex:1; }
.product-row img { width:48px; height:48px; flex-shrink:0; border:1px solid var(--line); border-radius:8px; background:var(--soft); object-fit:cover; }
.product-row strong { font-size:12px; font-weight:550; overflow-wrap:anywhere; }
.product-row small { display:block; margin-top:4px; color:var(--muted); font-size:11px; }
.timeline { margin:18px 0 0 5px; padding-left:21px; border-left:1px solid var(--line); }
.timeline > div { position:relative; padding:0 0 22px; font-size:12px; line-height:1.6; }
.timeline > div:last-child { padding-bottom:0; }
.timeline > div::before { content:""; position:absolute; width:7px; height:7px; left:-25px; top:6px; border-radius:50%; background:var(--primary); box-shadow:0 0 0 3px var(--card); }
.timeline small { display:block; margin-top:4px; font-size:11px; color:var(--muted); }

/* Connections and the setup wizard */
.connection-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.connection-title { display:flex; align-items:center; gap:12px; margin-bottom:20px; min-width:0; }
.connection-title > div:nth-child(2) { min-width:0; flex:1; }
.connection-title h2 { margin:0; font-size:14px; font-weight:600; line-height:1.5; overflow-wrap:anywhere; }
.connection-title small { display:block; margin-top:4px; font-size:11px; color:var(--muted); overflow-wrap:anywhere; }
.connection-title .badge { flex-shrink:0; }
.provider-logo { display:grid; place-items:center; width:36px; height:36px; flex-shrink:0; background:var(--hover); color:var(--primary); border-radius:10px; font-size:23px; line-height:1; font-weight:750; font-style:italic; }
.gateway-card { overflow:visible; position:relative; }
.gateway-card .card-actions { border-radius:0 0 13px 13px; }
.gateway-dot { display:inline-block; width:7px; height:7px; flex-shrink:0; border-radius:50%; background:var(--gateway-color,var(--primary)); }
.gateway-label { display:inline-flex; align-items:center; gap:7px; min-width:0; max-width:100%; }
.gateway-summary { display:grid; grid-template-columns:minmax(100px,.9fr) minmax(0,1.5fr); gap:11px 16px; font-size:12px; line-height:1.6; }
.gateway-summary > span { color:var(--muted); }
.gateway-summary > strong { text-align:right; font-weight:500; overflow-wrap:anywhere; }
.gateway-switches { margin-top:18px; padding-top:10px; border-top:1px solid var(--line); }
.gateway-technical { margin-top:12px; padding-top:10px; border-top:1px solid var(--line); }
.gateway-technical > summary { min-height:34px; align-content:center; color:var(--muted); font-size:11px; cursor:pointer; }
.gateway-technical .details-list { margin-top:6px; }
.provider-choice { margin-bottom:20px; padding:18px; border:1px solid var(--line); border-radius:10px; background:var(--soft); }
.provider-choice strong { font-size:17px; font-weight:600; }
.provider-choice p { margin-top:6px; color:var(--muted); font-size:12px; line-height:1.7; }
.wizard-steps { display:flex; gap:0; list-style:none; padding:0; margin:0 0 26px; border-bottom:1px solid var(--line); }
.wizard-steps li { display:flex; align-items:center; gap:8px; flex:1; min-width:0; padding:0 8px 15px; border-bottom:2px solid transparent; color:var(--muted); font-size:11px; line-height:1.5; }
.wizard-steps li > span { display:grid; place-items:center; width:23px; height:23px; flex-shrink:0; border:1px solid var(--line); border-radius:50%; font-size:10px; background:var(--card); }
.wizard-steps li.current { color:var(--primary); border-bottom-color:var(--primary); font-weight:600; }
.wizard-steps li.current > span { border-color:var(--primary); background:var(--primary); color:#fff; }
html[data-theme=dark] .wizard-steps li.current > span { background:#6d5de6; border-color:#6d5de6; }
.wizard-steps li.done { color:var(--green); }
.wizard-steps li.done > span { background:var(--green-bg); border-color:var(--green-bg); }
.install-steps, .setup-steps { margin:14px 0; padding-left:22px; color:var(--muted); font-size:12px; line-height:1.75; }
.install-steps li, .setup-steps li { padding-left:4px; margin:10px 0; }
.setup-steps li::marker { color:var(--primary); font-weight:650; }
.shipping-row { display:grid; grid-template-columns:minmax(0,1fr) 110px minmax(0,1fr) 34px; align-items:center; gap:9px; margin-bottom:10px; }
.shipping-row input { font-size:12px; }

/* Feedback and empty states */
.notice { padding:14px 16px; margin:18px 0; border:1px solid var(--line); border-radius:10px; background:var(--soft); color:var(--muted); font-size:12px; line-height:1.7; overflow-wrap:anywhere; }
.notice.warning { color:var(--amber); background:var(--amber-bg); border-color:color-mix(in srgb,var(--amber) 18%,var(--line)); }
.notice.error { color:var(--red); background:var(--red-bg); border-color:color-mix(in srgb,var(--red) 18%,var(--line)); }
.notice.success { color:var(--green); background:var(--green-bg); border-color:color-mix(in srgb,var(--green) 18%,var(--line)); }
.notice code { font-size:11px; white-space:normal; overflow-wrap:anywhere; }
.notice p + p { margin-top:8px; }
.notice .btn { margin-top:8px; }
.notice .row .btn { margin-top:0; }
.empty, .error-state, .loading-state { padding:48px 24px; text-align:center; color:var(--muted); }
.empty .empty-icon { display:grid; place-items:center; width:44px; height:44px; margin:0 auto 16px; border:1px solid var(--line); border-radius:12px; background:var(--soft); color:var(--muted); }
.empty h3, .error-state h3 { color:var(--text); font-size:14px; line-height:1.5; font-weight:600; margin:0 0 6px; }
.empty p, .error-state p { max-width:390px; margin:0 auto 18px; color:var(--muted); font-size:12px; line-height:1.7; }
.empty .btn, .error-state .btn { margin:0 3px; }
.loading-state { display:flex; align-items:center; justify-content:center; gap:12px; font-size:12px; }
.loading-spinner { display:inline-block; width:19px; height:19px; flex-shrink:0; border:2px solid var(--line); border-top-color:var(--primary); border-radius:50%; animation:atlas-component-spin 800ms linear infinite; }
.code { padding:15px; margin:14px 0; max-width:100%; max-height:340px; overflow:auto; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--text); font:11px/1.75 ui-monospace,SFMono-Regular,Consolas,monospace; white-space:pre-wrap; overflow-wrap:anywhere; tab-size:2; }
pre, code { tab-size:2; }
.draft-indicator + .notice { margin-top:10px; }

/* Menus remain outside cards rather than being clipped by them. */
.v09-action-menu { position:relative; margin-left:auto; flex-shrink:0; }
.v09-action-menu > summary { display:grid; place-items:center; width:34px; height:34px; border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--muted); font-size:15px; line-height:1; letter-spacing:0; list-style:none; cursor:pointer; }
.v09-action-menu > summary::-webkit-details-marker { display:none; }
.v09-action-menu[open] > summary { background:var(--hover); color:var(--primary); border-color:var(--primary); }
.v09-action-menu-panel { position:absolute; z-index:65; right:0; top:calc(100% + 6px); display:grid; gap:2px; min-width:190px; max-width:min(290px,calc(100vw - 36px)); padding:6px; border:1px solid var(--line); border-radius:10px; background:var(--card); box-shadow:var(--elevated); }
.v09-action-menu-panel .btn { justify-content:flex-start; border:0; box-shadow:none; min-height:36px; background:transparent; font-size:12px; font-weight:500; text-align:left; white-space:normal; }
.v09-action-menu-panel .btn:hover { background:var(--soft); }
.v09-action-menu-panel .btn.danger:hover { background:var(--red-bg); }
.organization-options { display:grid; gap:8px; }
.organization-option { display:flex; align-items:center; gap:12px; width:100%; padding:14px; border:1px solid var(--line); border-radius:10px; background:var(--card); color:var(--text); text-align:left; cursor:pointer; }
.organization-option > span:nth-child(2) { flex:1; min-width:0; }
.organization-option strong { display:block; font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.organization-option small { display:block; font-size:11px; margin-top:4px; color:var(--muted); overflow-wrap:anywhere; }
.organization-option.selected { border-color:var(--primary); background:var(--hover); }

/* Native dialogs: header/footer stay visible; only the body scrolls. */
dialog { width:min(660px,calc(100vw - 48px)); max-width:calc(100vw - 48px); max-height:calc(100dvh - 64px); margin:auto; padding:0; border:1px solid var(--line); border-radius:16px; background:var(--card); color:var(--text); box-shadow:0 24px 80px rgb(10 15 30 / 20%); overflow:hidden; }
dialog:not([open]) { display:none; }
dialog[open] { display:flex; flex-direction:column; animation:atlas-component-dialog 180ms ease both; }
dialog::backdrop { background:rgb(12 15 25 / 42%); backdrop-filter:blur(3px); }
dialog.wide { width:min(1040px,calc(100vw - 48px)); max-width:calc(100vw - 48px); }
dialog.drawer { width:min(630px,100vw); max-width:100vw; height:100dvh; max-height:100dvh; margin:0 0 0 auto; border-radius:16px 0 0 16px; border-right:0; }
dialog > form { display:flex; flex-direction:column; flex:1; min-height:0; margin:0; overflow:hidden; }
.dialog-head { display:flex; align-items:center; justify-content:space-between; flex-shrink:0; min-width:0; gap:18px; padding:20px 24px; border-bottom:1px solid var(--line); background:var(--card); }
.dialog-head h2 { margin:0; min-width:0; font-size:17px; line-height:1.4; font-weight:650; letter-spacing:-.35px; overflow-wrap:anywhere; }
.dialog-head .icon-btn { border-color:transparent; background:var(--soft); }
.dialog-body { flex:1; min-height:0; min-width:0; overflow:auto; overscroll-behavior:contain; padding:24px; scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
.dialog-body > .subtitle:first-child { margin-top:0; margin-bottom:20px; }
.dialog-body p, .dialog-body li { font-size:12px; line-height:1.7; }
.dialog-body small { line-height:1.65; }
.dialog-body .table-wrap { max-width:100%; }
.dialog-body .table td code { display:block; max-width:220px; white-space:normal; }
.dialog-foot { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; flex-shrink:0; gap:9px; padding:15px 24px; border-top:1px solid var(--line); background:var(--card); }
.dialog-foot .spacer { flex:1; }
.dialog-foot .btn { min-height:38px; }
.dialog-body .stats { margin-bottom:20px; }
.dialog-body .stat { min-height:110px; padding:17px; }
.dialog-body .stat strong { font-size:26px; }

/* Universal command palette */
.v09-command-dialog { width:min(640px,calc(100vw - 40px)); margin:min(15vh,120px) auto auto; border-radius:14px; }
.v09-command-input { display:flex; align-items:center; gap:12px; padding:15px 18px; border-bottom:1px solid var(--line); }
.v09-command-input > .icon { width:18px; height:18px; color:var(--muted); }
.v09-command-input input { flex:1; min-width:0; min-height:34px; padding:4px 0; border:0; background:transparent; box-shadow:none; font-size:14px; }
.v09-command-input input:focus { box-shadow:none; }
.v09-command-close { min-height:27px; padding:3px 6px; flex-shrink:0; border:1px solid var(--line); border-radius:5px; background:var(--soft); color:var(--muted); font:inherit; font-size:10px; cursor:pointer; }
.v09-command-state { padding:13px 18px 6px; color:var(--muted); font-size:11px; font-weight:500; }
.v09-command-results { min-height:0; max-height:min(52dvh,430px); overflow:auto; padding:4px 7px 9px; overscroll-behavior:contain; scrollbar-width:thin; }
.v09-command-results > button { display:flex; align-items:center; gap:11px; width:100%; min-height:58px; padding:10px 11px; border:0; border-radius:8px; background:transparent; color:var(--text); text-align:left; cursor:pointer; }
.v09-command-results > button:hover, .v09-command-results > button[aria-selected=true] { background:var(--hover); }
.v09-command-result-icon { display:grid; place-items:center; width:32px; height:32px; flex-shrink:0; border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--muted); }
.v09-command-results > button[aria-selected=true] .v09-command-result-icon { color:var(--primary); border-color:color-mix(in srgb,var(--primary) 20%,var(--line)); }
.v09-command-results > button > span:nth-child(2) { flex:1; min-width:0; }
.v09-command-results strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:550; }
.v09-command-results small { display:block; margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; color:var(--muted); }
.v09-command-result-type { font-size:10px; color:var(--muted); flex-shrink:0; }
.v09-command-enter { visibility:hidden; color:var(--primary); }
.v09-command-results > button[aria-selected=true] .v09-command-enter { visibility:visible; }
.v09-command-empty { padding:32px 18px; color:var(--muted); font-size:12px; text-align:center; line-height:1.7; }
.v09-command-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; padding:11px 18px; border-top:1px solid var(--line); background:var(--soft); color:var(--muted); font-size:10px; }

/* Non-blocking feedback */
#toast { position:fixed; z-index:250; bottom:24px; left:50%; max-width:min(520px,calc(100vw - 32px)); padding:12px 16px; border:1px solid var(--line); border-radius:10px; background:var(--text); color:var(--card); box-shadow:var(--elevated); font-size:12px; line-height:1.55; text-align:center; opacity:0; transform:translate(-50%,14px); pointer-events:none; transition:opacity 180ms ease,transform 180ms ease; overflow-wrap:anywhere; }
#toast.show { opacity:1; transform:translate(-50%,0); }
#sale-notifications { position:fixed; z-index:100; top:82px; right:24px; display:flex; flex-direction:column; gap:10px; width:min(360px,calc(100vw - 32px)); pointer-events:none; }
.sale-notification { display:flex; align-items:center; gap:12px; min-width:0; padding:16px; border:1px solid var(--line); border-radius:12px; background:var(--card); box-shadow:var(--elevated); pointer-events:auto; animation:atlas-component-arrive 180ms ease both; }
.sale-check { display:grid; place-items:center; width:32px; height:32px; flex-shrink:0; border-radius:50%; background:var(--green-bg); color:var(--green); }
.sale-check .icon { width:16px; height:16px; }
.sale-notification > div { flex:1; min-width:0; }
.sale-notification strong, .sale-amount { display:block; font-size:17px; font-weight:650; letter-spacing:-.35px; font-variant-numeric:tabular-nums; }
.sale-notification strong span, .sale-label { display:block; color:var(--muted); font-size:10px; font-weight:450; letter-spacing:0; }
.sale-notification p { margin:4px 0 0; color:var(--muted); font-size:11px; line-height:1.55; overflow-wrap:anywhere; }
.sale-notification .icon-btn { align-self:flex-start; border:0; background:transparent; color:var(--muted); width:28px; min-width:28px; height:28px; min-height:28px; }
.notification-count { margin-left:auto; color:var(--primary); font-size:10px; }
.notification-bell { position:relative; }
.notification-bell > span { position:absolute; top:-2px; right:-2px; min-width:16px; border:2px solid var(--card); border-radius:20px; background:var(--primary); color:#fff; font-size:8px; line-height:1.5; text-align:center; padding:0 3px; }
html[data-theme=dark] .notification-bell > span { background:#6d5de6; }

/* Initial load and refresh: the data footprint remains stable. */
.v09-load-concealed { display:none!important; }
.v09-load-state { margin-bottom:20px; }
.v09-refresh-state { display:flex; align-items:center; gap:9px; position:sticky; top:82px; z-index:20; width:fit-content; max-width:100%; padding:10px 13px; border:1px solid var(--line); border-radius:9px; background:var(--card); color:var(--muted); box-shadow:var(--shadow); font-size:11px; }
.v09-refresh-state .loading-spinner { width:13px; height:13px; }
.v09-load-error { display:flex; align-items:center; gap:15px; padding:20px; border:1px solid color-mix(in srgb,var(--red) 25%,var(--line)); border-radius:12px; background:var(--card); }
.v09-load-error-icon { display:grid; place-items:center; width:36px; height:36px; flex-shrink:0; border-radius:10px; background:var(--red-bg); color:var(--red); }
.v09-load-error > div:nth-child(2) { flex:1; min-width:0; }
.v09-load-error h3 { margin:0 0 5px; color:var(--text); font-size:13px; font-weight:600; }
.v09-load-error p, .v09-load-error small { color:var(--muted); font-size:11px; line-height:1.6; overflow-wrap:anywhere; }
.v09-load-error small { display:block; margin-top:4px; }
.v09-load-error > .btn { margin-left:auto; flex-shrink:0; }
.v09-skeleton-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:20px; }
.v09-skeleton-summary > div { display:flex; flex-direction:column; gap:17px; min-height:136px; padding:22px; border:1px solid var(--line); border-radius:14px; background:var(--card); }
.skeleton, .v09-skeleton i, .v09-skeleton b { display:block; height:9px; width:65%; border-radius:4px; background:var(--soft); animation:atlas-component-skeleton 1600ms ease-in-out infinite alternate; }
.v09-skeleton b { height:25px; width:55%; }
.v09-skeleton-summary > div > i:last-child { width:80%; }
.v09-skeleton-table { padding:2px 22px; border:1px solid var(--line); border-radius:14px; background:var(--card); }
.v09-skeleton-table > div { display:grid; grid-template-columns:36px minmax(0,1fr) 90px; align-items:center; gap:18px; padding:22px 0; border-bottom:1px solid var(--line); }
.v09-skeleton-table > div:last-child { border-bottom:0; }
.v09-skeleton-table > div > i:first-child { width:36px; height:36px; border-radius:8px; }
.v09-skeleton-table > div > i:last-child { width:70px; justify-self:end; }
.v09-skeleton-table span { display:flex; flex-direction:column; gap:10px; }
.v09-skeleton-table span > b { width:40%; height:11px; }
.v09-skeleton-table span > i { width:60%; height:8px; }

/* Adaptation, without changing the underlying action or record order. */
@media (max-width:1150px) {
  .filter-fields { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .connection-grid { gap:16px; }
  .gateway-summary { grid-template-columns:minmax(80px,.8fr) minmax(0,1.4fr); gap:10px 12px; }
}
@media (max-width:950px) {
  .grid, .grid.equal { grid-template-columns:1fr; }
  .connection-grid { grid-template-columns:1fr; }
  .filter-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .health-grid { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .btn, .btn.small, .icon-btn { min-height:44px; font-size:12px; }
  .btn { padding:10px 12px; white-space:normal; }
  .btn.small { padding:9px 10px; }
  .icon-btn { width:44px; min-width:44px; height:44px; padding:0; }
  .card { border-radius:12px; }
  .pad { padding:18px; }
  .card-head { padding:18px 18px 0; gap:10px; }
  .card-head h2 { font-size:14px; }
  .card-head small { font-size:11px; }
  .card-actions { padding:12px 18px; gap:8px; }
  .card-actions > .btn { flex:1 1 auto; }
  .grid, .grid.equal { gap:16px; margin-bottom:16px; }
  .stats { gap:10px; margin-bottom:18px; }
  .stat { padding:17px 15px; border-radius:12px; }
  .stat .label { font-size:11px; }
  .stat strong { font-size:25px; margin-top:12px; }
  .stat small { font-size:10px; }
  .home-batches { margin:18px 0; }
  .home-batch { padding:17px 18px; }
  .home-batch > .row { flex-wrap:wrap; }
  .home-batch > .row:last-child { align-items:flex-start; flex-direction:column; gap:12px; }
  .home-batch > .row:last-child > .row { flex-wrap:wrap; width:100%; }
  .home-batch .row > .btn { flex:1; }
  .chart, .gateway-chart { height:215px; }
  .gateway-breakdown .row { flex-wrap:wrap; gap:10px; }
  .gateway-row { padding:15px 18px; }
  .demo-strip { align-items:flex-start; flex-wrap:wrap; }
  .demo-strip .btn { flex:1 1 100%; }
  .onboarding { align-items:flex-start; flex-wrap:wrap; padding:18px; }
  .onboarding .btn { width:100%; }
  input, select, textarea, .field input, .field select, .field textarea { min-height:44px; padding:11px; font-size:16px; }
  input[type=checkbox], input[type=radio] { width:19px; height:19px; min-height:19px; padding:0; }
  input[type=color] { height:44px; padding:5px; }
  input[type=range] { padding:0; }
  input[type=file] { padding:7px; font-size:12px; }
  input[type=file]::file-selector-button { min-height:32px; }
  .field { font-size:12px; }
  .field small { font-size:11px; line-height:1.65; }
  .form-grid { grid-template-columns:1fr; gap:18px; }
  .check { min-height:44px; gap:10px; align-items:flex-start; font-size:12px; padding-block:5px; }
  .check input { margin-top:1px; }
  .form-section { margin-top:22px; padding-top:20px; }
  .shop-checkboxes { grid-template-columns:1fr; padding:14px; gap:6px; }
  .switch-row { min-height:52px; gap:16px; font-size:12px; }
  .toggle { width:38px; height:23px; }
  .toggle::after { width:17px; height:17px; }
  .toggle.on::after, .switch-row[aria-checked=true] .toggle::after { transform:translateX(15px); }
  .toolbar { align-items:stretch; gap:12px; margin-bottom:16px; }
  .toolbar > .row { width:100%; flex-wrap:wrap; gap:8px; }
  .toolbar > .row > .btn { flex:1 1 auto; }
  .toolbar input, .toolbar select { min-height:44px; font-size:16px; width:100%; }
  .toolbar > .field { flex:1; min-width:0; }
  .toolbar .date { width:100%; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .toolbar .date input { width:100%; max-width:100%; }
  .toolbar .date > span { grid-column:1/-1; }
  .filters-v06 { padding:14px; }
  .filter-fields, .filters-v06 .filter-fields, .home-filters .filter-fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 10px; }
  .filter-fields .field { display:flex; flex-direction:column; justify-content:flex-end; font-size:11px; }
  .filter-fields input, .filter-fields select { width:100%; min-width:0; max-width:100%; }
  .filters-v06 > .row > .field { margin:4px 0 0; flex:1 1 100%; min-width:0; }
  .filters-v06 > .row > .btn { flex:1 1 calc(50% - 8px); }
  .v09-filter-panel { margin-bottom:16px; }
  .v09-filter-panel > summary { min-height:48px; padding:12px 14px; flex-wrap:wrap; gap:7px; }
  .v09-filter-panel > summary > small { flex:1 1 50%; font-size:10px; }
  .v09-filter-panel > .filters-v06, .v09-filter-panel > .home-filters { padding:14px; }
  .tabs { gap:22px; margin-bottom:18px; }
  .tabs > :is(button,a) { min-height:46px; font-size:12px; }
  .table-wrap { overflow:auto; }
  .table:not(.responsive-table) { min-width:520px; }
  .table:not(.responsive-table) td, .table:not(.responsive-table) th { padding:12px; }
  .responsive-table { display:block; min-width:0; white-space:normal; }
  .responsive-table thead { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%); white-space:nowrap; }
  .responsive-table tbody { display:block; width:100%; }
  .responsive-table tbody tr { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:15px 14px; padding:18px; border-bottom:1px solid var(--line); background:var(--card); }
  .responsive-table tbody tr:last-child { border-bottom:0; }
  .responsive-table tbody tr:hover { background:var(--card); }
  .responsive-table td, [data-density=compact] .responsive-table td, [data-density=comfortable] .responsive-table td { display:block; min-width:0; padding:0; border:0; text-align:left; white-space:normal; overflow-wrap:anywhere; font-size:12px; line-height:1.6; }
  .responsive-table td::before { content:attr(data-label); display:block; margin:0 0 5px; color:var(--muted); font-size:10px; line-height:1.5; font-weight:450; }
  .responsive-table td:first-child { grid-column:1 / -1; padding-bottom:11px; border-bottom:1px solid var(--line); color:var(--text); font-size:13px; }
  .responsive-table td:first-child::before { display:none; }
  .responsive-table td:first-child .row-link { font-size:13px; font-weight:600; }
  .responsive-table td[colspan] { grid-column:1/-1; }
  .responsive-table td.actions-cell { grid-column:1 / -1; display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding-top:4px; text-align:left; }
  .responsive-table td.actions-cell::before { display:none; }
  .responsive-table td.actions-cell > .row { width:100%; justify-content:flex-start; flex-wrap:wrap; }
  .responsive-table td.actions-cell > .btn, .responsive-table td.actions-cell > .row > .btn { flex:1 1 auto; }
  .responsive-table td .btn { min-height:44px; font-size:12px; padding:10px 12px; }
  .responsive-table td small { max-width:100%; font-size:11px; line-height:1.55; }
  .responsive-table td .badge { font-size:10px; white-space:normal; overflow-wrap:anywhere; }
  .responsive-table td > .row { flex-wrap:wrap; gap:8px; }
  .responsive-table .numeric .reporting-money { align-items:flex-start; }
  .responsive-table .reporting-money > strong { font-size:15px; }
  .responsive-table .order-product { min-width:0; max-width:100%; }
  .responsive-table .order-product img, .responsive-table .product-placeholder { width:36px; height:40px; }
  .responsive-table .gateway-label { align-items:flex-start; white-space:normal; font-size:12px; }
  .responsive-table .gateway-dot { margin-top:6px; }
  .table-foot { padding:12px 18px; font-size:11px; }
  .table-tools { padding:12px 14px; }
  .table-tools input { max-width:none; min-height:44px; font-size:16px; }
  .pagination { align-items:flex-start; flex-direction:column; gap:10px; }
  .pagination > div { width:100%; justify-content:space-between; gap:8px; }
  .pagination .btn { flex:1; min-height:44px; }
  .pagination select { min-height:44px; font-size:16px; }
  .pagination > small { font-size:11px; }
  body[data-route=operations] .responsive-table tbody tr.operation-row { grid-template-columns:minmax(0,1fr) minmax(90px,auto); grid-template-areas:"identity amount" "status amount" "customer customer" "product product" "monthly monthly" "expand expand"; gap:8px 12px; }
  body[data-route=operations] .operation-row > td.v09-order-identity { grid-area:identity; padding:0; border:0; }
  body[data-route=operations] .v09-order-identity .row-link { display:inline-block; line-height:1.6; overflow-wrap:anywhere; }
  body[data-route=operations] .operation-row > td.v09-order-status { grid-area:status; }
  body[data-route=operations] .operation-row > td.v09-order-amount { grid-area:amount; max-width:145px; text-align:right; }
  body[data-route=operations] .v09-order-amount .reporting-money { align-items:flex-end; }
  body[data-route=operations] .v09-order-amount .reporting-money > strong { font-size:18px; line-height:1.3; letter-spacing:-.4px; }
  body[data-route=operations] .v09-order-amount .reporting-money > small { font-size:10px; }
  body[data-route=operations] .operation-row > td.v09-order-customer { grid-area:customer; margin-top:4px; }
  body[data-route=operations] .operation-row > td.v09-order-product { grid-area:product; padding-top:5px; }
  body[data-route=operations] .operation-row > td.v09-order-monthly { grid-area:monthly; color:var(--muted); font-size:11px; }
  body[data-route=operations] .v09-order-monthly::before { display:inline; content:attr(data-label) ": "; margin-right:4px; }
  body[data-route=operations] .v09-order-monthly small { display:inline; margin-left:5px; font-size:10px; }
  body[data-route=operations] .operation-row > td:is(.v09-order-identity,.v09-order-status,.v09-order-amount,.v09-order-customer,.v09-order-product,.v09-order-expand)::before { display:none; }
  body[data-route=operations] .operation-row > td.v09-order-extra { display:none; grid-column:1 / -1; }
  body[data-route=operations] .operation-row.v09-expanded { grid-template-areas:"identity amount" "status amount" "customer customer" "product product" "monthly monthly"; }
  body[data-route=operations] .operation-row.v09-expanded > td.v09-order-extra { display:block; grid-area:auto; grid-column:1 / -1; padding-top:12px; margin-top:4px; border-top:1px solid var(--line); }
  body[data-route=operations] .operation-row > td.v09-order-expand { display:block; grid-area:expand; grid-column:1 / -1; }
  body[data-route=operations] .operation-row.v09-expanded > td.v09-order-expand { grid-area:auto; grid-column:1 / -1; }
  .v09-order-expand button { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; min-height:44px; padding:7px 0; border:0; border-radius:5px; background:none; color:var(--primary); font:inherit; font-size:11px; font-weight:550; text-align:left; cursor:pointer; }
  .v09-order-expand .icon { width:14px; height:14px; transition:transform 180ms ease; }
  .v09-expanded .v09-order-expand .icon { transform:rotate(180deg); }
  .detail-row { gap:14px; }
  .detail-row > span:first-child { flex-basis:38%; font-size:11px; }
  .detail-row > strong { flex-basis:62%; font-size:12px; }
  .product-row { align-items:flex-start; gap:10px; }
  .product-row img { width:42px; height:42px; }
  .product-row > strong { font-size:12px; }
  .connection-grid { gap:14px; }
  .connection-title { align-items:flex-start; gap:11px; margin-bottom:18px; flex-wrap:wrap; }
  .connection-title h2 { font-size:14px; }
  .connection-title .badge { max-width:100%; white-space:normal; }
  .gateway-summary { grid-template-columns:minmax(80px,.8fr) minmax(0,1.4fr); gap:11px 12px; font-size:12px; }
  .gateway-technical > summary { min-height:44px; font-size:12px; }
  .v09-action-menu > summary { width:44px; height:44px; }
  .v09-action-menu-panel { min-width:210px; }
  .v09-action-menu-panel .btn { min-height:44px; }
  .wizard-steps { margin-bottom:22px; gap:4px; }
  .wizard-steps li { flex-direction:column; gap:7px; padding:0 1px 12px; text-align:center; font-size:10px; overflow-wrap:anywhere; }
  .wizard-steps li > span { width:24px; height:24px; }
  .shipping-row { grid-template-columns:minmax(0,1fr) 90px 44px; }
  .shipping-row .shipping-description { grid-column:1 / 3; }
  .notice { padding:13px 14px; font-size:12px; line-height:1.65; }
  .notice .row { align-items:flex-start; flex-wrap:wrap; }
  .empty, .error-state, .loading-state { padding:36px 20px; }
  .empty .btn, .error-state .btn { min-height:44px; }
  .code { padding:12px; font-size:11px; }
  dialog, dialog.wide, dialog.drawer { width:calc(100vw - 16px); max-width:calc(100vw - 16px); max-height:calc(100dvh - 24px); margin:auto; height:auto; inset:0; border:1px solid var(--line); border-radius:14px; }
  dialog.drawer { width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; margin:0; border:0; border-radius:0; }
  .dialog-head { gap:12px; padding:15px 18px; }
  .dialog-head h2 { font-size:16px; line-height:1.45; }
  .dialog-head .icon-btn { width:44px; height:44px; min-width:44px; min-height:44px; }
  .dialog-body { padding:20px 18px; overflow-x:hidden; }
  .dialog-body p, .dialog-body li { font-size:12px; }
  .dialog-foot { padding:12px 18px calc(12px + env(safe-area-inset-bottom)); gap:8px; }
  .dialog-foot .spacer { display:none; }
  .dialog-foot > .btn { flex:1 1 auto; min-width:0; min-height:44px; font-size:12px; }
  .dialog-foot > .btn.primary { flex-basis:100%; }
  .dialog-foot > :is(small,p) { flex-basis:100%; }
  .dialog-body .stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .dialog-body .stat { padding:14px; min-height:112px; }
  .dialog-body .stat strong { font-size:23px; }
  .dialog-body .responsive-table tbody tr { padding:16px 14px; }
  .v09-command-dialog { width:calc(100vw - 20px); max-width:calc(100vw - 20px); height:auto; max-height:calc(100dvh - 88px); margin:68px auto auto; }
  .v09-command-input { padding:12px 14px; gap:9px; }
  .v09-command-input input { font-size:16px; min-height:40px; }
  .v09-command-close { min-width:44px; min-height:44px; }
  .v09-command-results { max-height:55dvh; }
  .v09-command-results > button { min-height:64px; padding:11px 10px; }
  .v09-command-result-type { max-width:58px; font-size:9px; text-align:right; white-space:normal; }
  .v09-command-enter { display:none; }
  .v09-command-footer > span:first-child { display:none; }
  #toast { bottom:calc(82px + env(safe-area-inset-bottom)); max-width:calc(100vw - 28px); padding:12px 14px; font-size:12px; }
  #sale-notifications { top:auto; bottom:calc(82px + env(safe-area-inset-bottom)); right:12px; width:calc(100vw - 24px); max-height:40dvh; overflow:auto; }
  .sale-notification { padding:13px; gap:10px; }
  .sale-notification strong { font-size:16px; }
  .sale-notification .icon-btn { width:44px; min-width:44px; height:44px; min-height:44px; }
  .v09-refresh-state { top:72px; font-size:11px; }
  .v09-load-error { flex-wrap:wrap; align-items:flex-start; padding:16px; gap:12px; }
  .v09-load-error > .btn { margin-left:48px; }
  .v09-skeleton-summary { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
  .v09-skeleton-summary > div { padding:18px; min-height:120px; gap:15px; }
  .v09-skeleton-table { padding:0 16px; }
  .v09-skeleton-table > div { grid-template-columns:32px minmax(0,1fr) 50px; gap:12px; padding:22px 0; }
  .v09-skeleton-table > div > i:first-child { width:32px; height:32px; }
  .v09-skeleton-table > div > i:last-child { width:45px; }
  .v09-skeleton-table span > b { width:60%; }
  .v09-skeleton-table span > i { width:85%; }
}
@media (max-width:380px) {
  .pad { padding:15px; }
  .card-head { padding:16px 15px 0; }
  .card-actions { padding:12px 15px; }
  .filters-v06 { padding:12px; }
  .filter-fields, .filters-v06 .filter-fields, .home-filters .filter-fields { grid-template-columns:1fr; column-gap:8px; }
  .filter-fields input, .filter-fields select { padding-inline:8px; }
  .responsive-table tbody tr { padding:16px 14px; gap:13px 10px; }
  .dialog-head { padding:13px 15px; }
  .dialog-body { padding:18px 15px; }
  .dialog-foot { padding-inline:15px; }
  .gateway-summary { grid-template-columns:minmax(75px,.8fr) minmax(0,1.4fr); }
  .wizard-steps li { font-size:9px; }
}

@keyframes atlas-component-spin { to { transform:rotate(360deg); } }
@keyframes atlas-component-dialog { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@keyframes atlas-component-arrive { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@keyframes atlas-component-skeleton { from { opacity:.55; } to { opacity:1; } }
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior:auto!important; transition-duration:0.01ms!important; animation-duration:0.01ms!important; animation-iteration-count:1!important; }
  .loading-spinner { animation:none; border-right-color:var(--primary); }
  .skeleton, .v09-skeleton i, .v09-skeleton b { animation:none; }
}
@media (forced-colors:active) {
  select:not([multiple]):not([size]), select:not([multiple])[size="1"] { -webkit-appearance:auto; appearance:auto; background-image:none; }
  .badge, .btn, .icon-btn, .toggle { border:1px solid ButtonText; }
  .toggle.on { background:Highlight; }
  .progress > span { background:Highlight; }
}
@media print {
  dialog::backdrop, #toast, #sale-notifications, .v09-order-expand, .v09-action-menu, .pagination { display:none!important; }
  .table-wrap { overflow:visible; }
  .table { white-space:normal; }
  .responsive-table .v09-order-extra { display:table-cell!important; }
  .card { box-shadow:none; break-inside:avoid; }
}
.sr-only { position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%); white-space:nowrap; border:0; }
[hidden], .responsive-table [hidden] { display:none!important; }

/* Contextual operation tools share one calm, predictable action bar. */
.v10-table-tools{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:20px 0 16px}.v10-table-tools>.spacer{flex:1}.v10-table-tools>.row{gap:8px}
.v10-advanced-filters{grid-column:1/-1;border-top:1px solid var(--line);padding-top:5px}.v10-advanced-filters>summary{cursor:pointer;min-height:42px;display:flex;align-items:center;font-size:12px;color:var(--muted);gap:8px}.v10-advanced-filters>summary::before{content:'+';font-size:16px}.v10-advanced-filters[open]>summary::before{content:'−'}.v10-advanced-filters[open]{padding-bottom:10px}
@media(min-width:761px){.operation-row .v09-order-customer{min-width:145px}.operation-row .v09-order-customer small{white-space:nowrap}}
@media(max-width:760px){.v10-table-tools{gap:12px;margin:17px 0}.v10-table-tools>.spacer{display:none}.v10-table-tools>.row{width:100%}.v10-table-tools>.row:last-child{padding-top:12px;border-top:1px solid var(--line)}.v10-table-tools>.row:last-child .btn{flex:1;white-space:normal}}