/* Shared tokens cover every customer and administration screen. */
:root {
  font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 16px; line-height: 1.5; font-synthesis: none;
  -webkit-text-size-adjust: 100%; color-scheme: dark;
  color: var(--text); background: var(--canvas);
  --canvas: #10141b; --surface: #181e28; --surface-subtle: #1e2632; --surface-raised: #263141;
  --text: #edf1f7; --text-secondary: #c7d0de; --muted: #a3b0c2;
  --line: #303c4e; --line-strong: #56667e;
  --accent: #c43a32; --accent-hover: #d64138; --accent-text: #ff998d; --accent-soft: #392623;
  --success: #8ce0b5; --success-soft: #17382d;
  --danger: #ffaaa0; --danger-soft: #3b2529; --danger-line: #74404a; --danger-solid: #a83130;
  --warning: #f2ce8c; --warning-soft: #352e20; --warning-line: #675738;
  --info-soft: #213044; --chart: #6f95bc; --focus: #96c6ff; --notice: #214735;
  --backdrop: #050910b8; --shadow: 0 8px 32px #0000001f;
  --radius: 14px; --gutter: 28px; --content-width: 1440px;
}
:root[data-theme="light"] {
  color-scheme: light;
  --canvas: #f3f5f8; --surface: #ffffff; --surface-subtle: #f5f7fa; --surface-raised: #eaf0f5;
  --text: #202c3a; --text-secondary: #39495c; --muted: #5e6c7e;
  --line: #dce3ec; --line-strong: #a0aec1;
  --accent: #c43a32; --accent-hover: #ae302a; --accent-text: #aa3029; --accent-soft: #fcece9;
  --success: #176341; --success-soft: #e6f5ec;
  --danger: #a22b28; --danger-soft: #fcecea; --danger-line: #dda8a6;
  --warning: #775013; --warning-soft: #fff6e5; --warning-line: #dfc58f;
  --info-soft: #eaf3fa; --chart: #638eb3; --focus: #2469b4;
  --shadow: 0 5px 22px #2739580a;
}

/* Text must stay inside its own column, including long articles and addresses. */
* { box-sizing: border-box; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
a { color: inherit; }
button, a, input, select, textarea { touch-action: manipulation; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .55; }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
:where(h1, h2, h3, p, a, span, strong, small, td, th, label, summary) { overflow-wrap: anywhere; }
h1 { margin: 0 0 8px; font-size: clamp(25px, 2.5vw, 32px); line-height: 1.25; }
h2 { margin: 0 0 20px; font-size: 21px; line-height: 1.35; }
h3 { margin: 0 0 10px; font-size: 16px; line-height: 1.5; }
p { margin: 0 0 14px; }
p:last-child { margin-bottom: 0; }
img { max-width: 100%; }
small, .muted { color: var(--muted); }
small { font-size: 13px; line-height: 1.5; }
.eyebrow { font-size: 12px; letter-spacing: .1em; color: var(--accent-text); font-weight: 700; }
[hidden] { display: none !important; }

/* Shared page geometry. */
.header {
  display: flex;
  align-items: center;
  gap: 24px;
  position: sticky;
  top: 0;
  z-index: 20;
  padding: 14px max(var(--gutter), calc((100% - var(--content-width)) / 2));
  background: var(--surface);
  border-bottom: 1px solid var(--line);
}
.brand { flex: 0 0 166px; }
.brand img { display: block; width: 100%; }
.desktop-nav { display: flex; align-items: center; gap: 2px; flex: 1; min-width: 0; }
.nav-link { padding: 11px 10px; border-radius: 7px; font-size: 14px; text-decoration: none; white-space: nowrap; }
.nav-link.active, .nav-link:hover { background: var(--accent-soft); color: var(--accent-text); }
.header-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; font-size: 14px; }
.profile-link { max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.cart-link { font-weight: 650; text-decoration: none; }
.count:empty { display: none; }
.count { border-radius: var(--radius); padding: 2px 7px; background: var(--accent); color: #fff; font-size: 12px; }
#menu-toggle { display: none; }
.main, .footer {
  width: calc(100% - var(--gutter) * 2);
  max-width: var(--content-width);
  margin-inline: auto;
}
.main { min-height: calc(100vh - 180px); padding-block: 32px 56px; }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.page-heading > :first-child { flex: 1; min-width: 0; }
.page-heading > .row { flex: 0 1 auto; justify-content: flex-end; }
.page-heading p { max-width: 70ch; margin: 0; }
.panel {
  container: panel / inline-size;
  min-width: 0;
  padding: 24px;
  margin-bottom: 24px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.row { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.stack { display: grid; gap: 16px; }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 24px; }
.grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
:where(.row, .grid, .cart-layout, .catalog-layout, .product-row, .order-card, .cart-line, .stock-row, .summary-line) > * { min-width: 0; }
.toolbar { margin-bottom: 20px; }
.footer { display: flex; justify-content: space-between; gap: 16px; padding-block: 16px 40px; font-size: 13px; color: var(--muted); }
.footer > a { margin-right: 48px; }

/* Forms and actions use the same baseline, height and spacing. */
.button, .icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  max-width: 100%;
  padding: 10px 16px;
  border: 1px solid var(--accent);
  border-radius: 8px;
  background: var(--accent);
  color: #fff;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  overflow-wrap: anywhere;
}
.button.secondary { background: var(--surface); color: var(--text); border-color: var(--line-strong); }
.button.danger { background: var(--danger-soft); color: var(--danger); border-color: var(--danger-line); }
.icon-button { min-width: 44px; padding: 8px 10px; border-color: var(--line); background: var(--surface); color: var(--text-secondary); }
.text-link { color: var(--accent-text); text-decoration: underline; text-underline-offset: 3px; }
.full-width { width: 100%; }
.field { display: flex; flex-direction: column; gap: 8px; min-width: 0; margin: 0 0 18px; font-size: 14px; }
.field > span { font-weight: 600; }
input, select, textarea {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--surface);
  color: var(--text);
  font-size: 16px;
  line-height: 1.5;
}
select { text-overflow: ellipsis; }
input[type=file] { padding: 8px; }
input[type=file]::file-selector-button { margin-right: 10px; padding: 3px 8px; }
input[type=checkbox], input[type=radio] { flex: 0 0 20px; width: 20px; height: 20px; min-height: 20px; margin: 0; accent-color: var(--accent); }
textarea { min-height: 112px; resize: vertical; }
.check { display: flex; gap: 10px; align-items: center; min-height: 44px; font-size: 14px; }
.filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; gap: 16px; }
.filters .field { margin: 0; }
.filters .field-search { grid-column: span 2; }
.filter-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding-top: 4px; }
.filter-actions .check { margin-right: auto; }
.filter-actions > .text-link { padding: 10px 4px; font-size: 14px; }
.catalog-search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 16px; }
.catalog-search-row .field { margin: 0; }
.catalog-filter-options { margin-top: 16px; }
.catalog-filter-options summary { color: var(--text-secondary); font-size: 14px; font-weight: 600; }
.catalog-filter-options[open] summary { margin-bottom: 12px; }
#find-equipment { grid-template-columns: minmax(0, 1fr) auto; margin-bottom: 20px; }
#find-equipment .field { grid-column: auto; }
.form-panel { max-width: 800px; }
.form-panel form, #portal-settings { max-width: 720px; }
.badge { display: inline-block; max-width: 100%; padding: 5px 9px; border-radius: 6px; font-size: 12px; font-weight: 650; line-height: 1.5; background: var(--surface-raised); color: var(--text-secondary); }
.badge.good { background: var(--success-soft); color: var(--success); }
.badge.bad { background: var(--danger-soft); color: var(--danger); }

/* Rows adapt to the available panel width, including dashboard columns. */
.catalog-layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); align-items: start; gap: 24px; }
.category-sidebar { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.category-sidebar > summary { padding: 16px; font-size: 16px; font-weight: 700; }
.category-nav { padding: 0 8px 12px; }
.category-nav ul { list-style: none; margin: 0; padding: 0; }
.category-nav li { margin: 2px 0; }
.category-row { display: flex; align-items: flex-start; min-width: 0; padding-left: calc(var(--depth, 0) * 10px); }
.category-toggle, .category-toggle-spacer { flex: 0 0 36px; width: 36px; height: 44px; }
.category-toggle { border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: 22px; }
.category-toggle:hover { background: var(--surface-raised); }
.category-link { display: block; flex: 1; min-width: 0; padding: 11px 8px; border-radius: 7px; font-size: 14px; line-height: 1.5; text-decoration: none; }
.category-link.active { background: var(--accent-soft); color: var(--accent-text); font-weight: 650; }
.category-link:hover { background: var(--surface-subtle); }
.category-path { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0 0 20px; }
.category-path .category-link { flex: 0 1 auto; padding: 4px 0; background: none; }
.category-path .category-link:not(.active) { color: var(--muted); text-decoration: underline; }
.product-row {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  grid-template-areas: "photo name" "price price" "stocks stocks";
  align-items: start;
  gap: 16px;
  padding: 24px 0;
  border-bottom: 1px solid var(--line);
}
.product-row:first-child { padding-top: 0; }
.product-row:last-child { padding-bottom: 0; border-bottom: 0; }
.product-row > :first-child { grid-area: photo; }
.product-row > :nth-child(2) { grid-area: name; }
.product-row > .price-block { grid-area: price; }
.product-row > .stocks { grid-area: stocks; }
.product-name { display: inline-block; font-size: 15px; line-height: 1.55; font-weight: 650; text-decoration: none; }
.product-name:hover { color: var(--accent-text); }
.product-row p { margin: 8px 0 12px; }
.product-image { flex: 0 0 auto; width: 56px; height: 56px; object-fit: contain; border: 1px solid var(--line); border-radius: 8px; }
.image-placeholder { display: flex; align-items: center; justify-content: center; background: var(--surface-subtle); color: var(--muted); font-size: 18px; font-weight: 700; }
.price { font-size: 20px; line-height: 1.4; font-weight: 750; font-variant-numeric: tabular-nums; }
.retail { margin-top: 6px; font-size: 13px; color: var(--muted); }
.stocks { display: grid; gap: 10px; }
.stock-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px; border-radius: 8px; background: var(--surface-subtle); font-size: 14px; }
.stock-row .button { padding-inline: 12px; }
.stock-details { display: block; margin-top: 4px; color: var(--muted); line-height: 1.5; }
.stock-name { display: block; margin-bottom: 4px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.positive { color: var(--success); }
.product-photo { display: block; width: 100%; max-height: 420px; object-fit: contain; border-radius: 10px; }
.product-photo.image-placeholder { height: 280px; display: flex; }
.product-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; font-size: 14px; }
.product-specs > div { padding-block: 10px; border-bottom: 1px solid var(--line); }
.product-specs strong { display: block; margin-top: 6px; }
.buy-box { position: sticky; top: 100px; align-self: start; }
.quantity-result { background: var(--surface-subtle); padding: 16px; margin-block: 16px; border-radius: 8px; }
.order-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
  align-items: start;
}
.order-card:last-child { border-bottom: 0; padding-bottom: 0; }
.order-card a { font-weight: 700; text-decoration: none; }
.order-card p { margin: 4px 0 0; }
.order-card .order-info { font-size: 14px; }
.order-total { font-variant-numeric: tabular-nums; }
.order-card .badges { display: flex; flex-wrap: wrap; gap: 6px; }
@container panel (min-width: 380px) {
  .order-card { grid-template-columns: minmax(0, 1fr) auto; column-gap: 20px; }
  .order-card > .order-total { grid-column: 2; grid-row: 1; text-align: right; max-width: 230px; }
  .order-card > .order-info, .order-card > .badges { grid-column: 1 / -1; }
}
@container panel (min-width: 800px) {
  .order-card { grid-template-columns: 150px minmax(0, 1fr) minmax(120px, 180px) 170px; align-items: center; gap: 24px; }
  .order-card > .order-info, .order-card > .badges, .order-card > .order-total { grid-column: auto; grid-row: auto; }
}
@container panel (min-width: 600px) {
  .product-row { grid-template-columns: 56px minmax(0, 1fr) minmax(130px, 180px); grid-template-areas: "photo name price" ". stocks stocks"; gap: 20px; }
  .product-row .price-block { text-align: right; }
}
@container panel (min-width: 980px) {
  .product-row { grid-template-columns: 56px minmax(0, 1fr) 160px 310px; grid-template-areas: "photo name price stocks"; align-items: start; gap: 24px; }
}

/* Checkout: name, quantity and amount retain space independently. */
.cart-layout { display: grid; grid-template-columns: minmax(0, 1fr) 350px; align-items: start; gap: 24px; }
.cart-line { display: grid; grid-template-columns: minmax(0, 1fr) 44px; grid-template-areas: "name name" "amount amount" "quantity remove"; align-items: center; gap: 12px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.cart-line-name { grid-area: name; }
.cart-line > .field { grid-area: quantity; max-width: 160px; margin: 0; }
.cart-line > .price { grid-area: amount; }
.cart-line > button { grid-area: remove; align-self: end; }
.cart-line p { margin: 6px 0 0; }
.summary { position: sticky; top: 100px; align-self: start; }
.summary-line { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin: 14px 0; font-size: 14px; }
.summary-line > strong { margin-left: auto; text-align: right; font-variant-numeric: tabular-nums; }
.summary-total { padding-top: 18px; border-top: 1px solid var(--line); font-size: 22px; font-weight: 750; }
.checkout-fixed { margin-top: 24px; }
@container panel (min-width: 620px) {
  .cart-line { grid-template-columns: minmax(0, 1fr) 116px 150px 44px; grid-template-areas: "name quantity amount remove"; gap: 20px; }
  .cart-line > .price { text-align: right; font-size: 18px; }
  .cart-line > button { align-self: center; }
}

/* Simple tables become labelled records when their own container is narrow. */
.table-wrap { container: table-area / inline-size; max-width: 100%; }
table { border-collapse: collapse; width: 100%; table-layout: fixed; font-size: 14px; }
th, td { padding: 14px 12px; border-bottom: 1px solid var(--line); vertical-align: top; text-align: left; }
th { font-size: 13px; font-weight: 650; background: var(--surface-subtle); color: var(--muted); }
td p { margin: 0 0 6px; }
td .field { margin: 0; }
.cell-label { display: none; }
.cell-value { min-width: 0; }
.nowrap { font-variant-numeric: tabular-nums; }
.empty { padding: 32px 16px; text-align: center; color: var(--muted); }
@media screen {
  @container table-area (max-width: 640px) {
    table[data-responsive], table[data-responsive] tbody { display: block; width: 100%; }
    table[data-responsive] thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); }
    table[data-responsive] tbody tr { display: block; padding: 14px 0; border-bottom: 1px solid var(--line); }
    table[data-responsive] tbody tr:first-child { padding-top: 0; }
    table[data-responsive] td { display: grid; grid-template-columns: minmax(80px, .75fr) minmax(0, 1.5fr); gap: 12px; align-items: baseline; padding: 7px 0; border: 0; }
    table[data-responsive] .cell-label { display: block; color: var(--muted); font-size: 13px; font-weight: 500; }
    table[data-responsive] .cell-value { font-size: 14px; }
    table[data-responsive] td.cell-primary { display: block; }
    table[data-responsive] td.cell-primary .cell-label { margin-bottom: 6px; }
    table[data-responsive] td.cell-primary .cell-value { font-weight: 650; }
    table[data-responsive] td:has(.field) { display: block; }
    table[data-responsive] td:has(.field) .cell-label { display: none; }
  }
}

/* Dashboard and supporting content. */
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 24px 0; }
.stat { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); text-decoration: none; }
.stat strong { display: block; margin: 10px 0; font-size: 30px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.stat span { color: var(--muted); font-size: 14px; }
.timeline { padding-left: 22px; margin: 10px; border-left: 2px solid var(--line); list-style: none; }
.timeline li { position: relative; padding-bottom: 22px; }
.timeline li::before { position: absolute; content: ""; left: -29px; top: 6px; width: 10px; height: 10px; border: 2px solid var(--surface); border-radius: 50%; background: var(--muted); }
.timeline .current::before { background: var(--accent); }
.timeline small { display: block; margin-top: 4px; }
.alert { padding: 16px; margin-bottom: 20px; border: 1px solid var(--warning-line); border-radius: 8px; background: var(--warning-soft); color: var(--warning); overflow-wrap: anywhere; }
.alert.error { background: var(--danger-soft); border-color: var(--danger-line); color: var(--danger); }
.message { margin-bottom: 12px; padding: 16px; border-radius: 8px; background: var(--surface-subtle); overflow-wrap: anywhere; }
.message.manager { background: var(--info-soft); }
.message p { margin: 8px 0; white-space: pre-wrap; }
.tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.tabs a { display: block; padding: 10px 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); text-decoration: none; font-size: 14px; }
.tabs a.active { background: var(--accent); color: #fff; }
.list-row { padding: 20px 0; border-bottom: 1px solid var(--line); }
.list-row:first-child { padding-top: 0; }
.list-row:last-child { border-bottom: 0; padding-bottom: 0; }
.list-row .row + .row { margin-top: 12px; }
.list-row > .badge + .button { margin: 12px 0 0 12px; }
summary { cursor: pointer; min-height: 44px; padding-block: 10px; }
.pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; margin: 24px 0; }
.progress-chart { display: flex; align-items: end; gap: 12px; min-height: 150px; padding-top: 16px; }
.progress-chart > div { flex: 1; min-width: 0; text-align: center; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.progress-chart i { display: block; width: 80%; min-height: 2px; margin: 6px auto; border-radius: 5px 5px 0 0; background: var(--chart); }
.details-label { font-size: 13px; color: var(--muted); }

/* Dialogs scroll internally; the title and close action remain reachable. */
.dialog { width: min(760px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 0; overflow-y: auto; overscroll-behavior: contain; border: 0; border-radius: 14px; box-shadow: 0 25px 80px #0004; }
.dialog::backdrop { background: var(--backdrop); }
.dialog-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; position: sticky; top: 0; z-index: 2; padding: 20px 24px; border-bottom: 1px solid var(--line); background: var(--surface); }
.dialog-heading h2 { min-width: 0; margin: 0; }
.dialog-heading button { flex: 0 0 auto; }
.dialog-body { min-width: 0; padding: 24px; }
.dialog .grid { gap: 16px; }
body:has(dialog[open]) { overflow: hidden; }
#notices { position: fixed; top: 88px; right: 20px; z-index: 100; max-width: min(440px, calc(100% - 40px)); }
.notice { padding: 16px 20px; margin-bottom: 10px; border-radius: 8px; background: var(--notice); color: #fff; box-shadow: 0 5px 30px #0002; overflow-wrap: anywhere; }
.notice.error { background: var(--danger-solid); }
.loading { padding: 40px; text-align: center; color: var(--muted); }
.support-button { flex: 0 0 auto; padding: 8px 12px; min-height: 44px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--text-secondary); font-size: 14px; font-weight: 650; }
.bottom-nav { display: none; }
.mobile-menu { padding: 12px var(--gutter); background: var(--surface); border-bottom: 1px solid var(--line); }
.mobile-menu:not([hidden]) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.mobile-menu .nav-link { white-space: normal; }
.auth { width: min(100%, 520px); margin: 6vh auto; padding: 20px; }
.auth h1 { font-size: 28px; }
.auth-logo { width: 230px; margin-bottom: 24px; }
.auth form { margin: 24px 0; }
.auth form .button { width: 100%; }
.auth .row { justify-content: space-between; }
.auth .panel { padding: 28px; }
.skip-link { position: fixed; top: -100px; }
.skip-link:focus { top: 5px; left: 10px; z-index: 100; padding: 12px; background: var(--surface); }
.quote-page { max-width: 960px; min-width: 0; margin: 32px auto; padding: 40px; background: var(--surface); }
.quote-page .product-image { width: 48px; height: 48px; }
.print-actions { margin-bottom: 28px; }

@media (max-width: 1279px) {
  .desktop-nav { display: none; }
  #menu-toggle { display: inline-flex; }
}
@media (max-width: 1099px) {
  .cart-layout { grid-template-columns: minmax(0, 1fr); }
  .summary { position: static; }
  .catalog-layout { grid-template-columns: 250px minmax(0, 1fr); gap: 20px; }
  .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 899px) {
  :root { --gutter: 20px; }
  .catalog-layout { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .category-nav { max-height: 60dvh; overflow-y: auto; overscroll-behavior: contain; }
  .grid { grid-template-columns: minmax(0, 1fr); }
  .grid.three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .buy-box { position: static; }
  .page-heading { flex-wrap: wrap; gap: 16px; }
  .page-heading > .row { justify-content: flex-start; }
}
@media (max-width: 599px) {
  :root { --gutter: 16px; }
  body { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  .header { gap: 12px; padding-block: 12px; }
  .brand { flex-basis: 142px; }
  .header .cart-link, .header .count, .profile-link { display: none; }
  .main { padding-block: 24px 40px; }
  h2 { font-size: 19px; margin-bottom: 18px; }
  .page-heading { display: block; margin-bottom: 24px; }
  .page-heading > .row { margin-top: 16px; }
  .page-heading > .row > .button { flex: 1 1 130px; }
  .panel { padding: 18px; margin-bottom: 20px; }
  .grid, .grid.three { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .filters { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .filters .field-search { grid-column: auto; }
  .filter-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .filter-actions .check { grid-column: 1 / -1; }
  .filter-actions > .button { width: 100%; }
  .filters > .button { width: 100%; }
  #find-equipment { grid-template-columns: minmax(0, 1fr); }
  .stock-row { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px; }
  .stock-row .button { width: 100%; }
  .price { font-size: 20px; }
  .stats { gap: 12px; }
  .stat { padding: 16px; }
  .stat strong { font-size: 27px; }
  .stat span { font-size: 13px; }
  .summary-total { font-size: 22px; }
  .tabs { gap: 6px; }
  .tabs a { flex: 1 1 auto; text-align: center; padding-inline: 10px; }
  .footer { display: grid; padding-block: 16px 64px; gap: 12px; }
  .bottom-nav { display: flex; position: fixed; inset: auto 0 0; z-index: 40; padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); min-height: 64px; border-top: 1px solid var(--line); background: var(--surface); }
  .bottom-nav a { flex: 1; min-width: 0; padding: 12px 3px; border-radius: 7px; text-decoration: none; text-align: center; font-size: 12px; }
  .bottom-nav a.active { color: var(--accent-text); background: var(--accent-soft); font-weight: 700; }
  .dialog { width: calc(100% - 16px); max-height: calc(100dvh - 16px); border-radius: var(--radius); }
  .dialog-body, .dialog-heading { padding: 18px; }
  .dialog-heading { gap: 12px; }
  .dialog-heading h2 { font-size: 18px; }
  .dialog-body form > button[type=submit] { width: 100%; }
  .mobile-menu:not([hidden]) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quote-page { margin: 0; padding: 20px 16px; }
  .quote-page h1 { font-size: 24px; }
  .auth { margin-block: 16px; padding: 16px; }
  .auth .panel { padding: 20px; }
  .auth .row { align-items: flex-start; }
  .progress-chart { gap: 6px; }
}
@media (max-width: 359px) {
  :root { --gutter: 12px; }
  .panel { padding: 16px; }
  .stats { grid-template-columns: minmax(0, 1fr); }
}

/* PDF and paper retain real tables, regardless of the preview viewport. */
@media print {
  :root { font-size: 11pt; }
  body { background: #fff; padding: 0; }
  .header, .footer, .bottom-nav, .support-button, .print-actions, #notices, .skip-link { display: none !important; }
  .main, .quote-page { width: 100%; max-width: none; margin: 0; padding: 0; }
  .panel, .table-wrap { container-type: normal; }
  .quote-page table { width: 100%; }
  th, td { padding: 8px 6px; }
  a { text-decoration: none; }
  tr, img { break-inside: avoid; }
  @page { margin: 15mm; }
}

/* Product photographs retain their proportions, including tall/long ceramic pieces. */
.photo-zoom { display: block; width: 100%; padding: 0; background: #fff; border: 0; cursor: zoom-in; }
.photo-hint { margin: 8px 0 0; font-size: 13px; }
[data-photo][aria-pressed="true"] { outline: 2px solid var(--accent-text); outline-offset: 2px; }
.photo-dialog { width: min(1100px, calc(100vw - 24px)); }
.photo-dialog .enlarged-photo { max-height: 75dvh; background: #fff; }
.photo-choice { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.photo-choice > button { grid-column: 2; justify-self: start; }
#photo-search .field { flex: 1 1 220px; }

/* Payment and contacts stay visible before secondary order actions. */
.order-overview { display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:24px; align-items:start; }
.order-money { display:flex; flex-wrap:wrap; gap:18px 32px; }
.order-money span { color:var(--muted); font-size:13px; }
.order-money strong { display:block; color:var(--text); font-size:22px; margin-top:4px; }
.order-money span:first-child strong { color:var(--accent-text); font-size:28px; }
.order-primary-actions small { color:var(--muted); line-height:1.5; }
.finance-stats { grid-template-columns:repeat(3,minmax(0,1fr)); margin-bottom:20px; }
.contact-links { display:flex; flex-wrap:wrap; gap:8px 20px; margin-top:10px; }
.contact-links a { overflow-wrap:anywhere; }
.start-help { border-top:1px solid var(--line); padding-top:16px; margin-top:20px; font-size:14px; }
.start-help summary { font-weight:650; cursor:pointer; }
.start-steps { padding-left:24px; }
@media(max-width:599px) {
 .brand { flex:1 1 125px; min-width:0; }
 .header-actions { flex:0 0 auto; gap:8px; }
 .support-button { padding-inline:10px; font-size:13px; }
 .main { padding-top:20px; }
 .catalog-filters { margin-bottom:12px; }
 .catalog-filter-options { margin-top:12px; }
 .category-path { margin-bottom:12px; }
 .product-row { gap:10px; padding-block:18px; }
 .order-overview { grid-template-columns:minmax(0,1fr); gap:16px; }
 .order-overview-panel { margin-top:16px; }
 .order-money { gap:12px 20px; }
 .order-money strong { font-size:19px; }
 .order-money span:first-child { flex-basis:100%; }
 .order-money span:first-child strong { font-size:26px; }
 .order-primary-actions { flex-direction:column; }
 .finance-stats { grid-template-columns:minmax(0,1fr); }
}

.catalog-favorite { display:block; margin-top:8px; }
@media(max-width:599px) {
 .catalog-page .page-heading .muted { display:none; }
 .catalog-page .page-heading { margin-bottom:16px; }
 .catalog-page .price-block { position:relative; padding-right:50px; }
 .catalog-page .catalog-favorite { position:absolute; top:0; right:0; width:44px; height:44px; margin:0; padding:0; font-size:0; }
 .catalog-favorite::before { content:'☆'; font-size:24px; }
 .catalog-favorite[data-enabled=false]::before { content:'★'; }
}

/* The shared shell leaves a stable workspace across catalogue, orders and finance. */
.ui-icon { flex: 0 0 auto; width: 20px; height: 20px; vertical-align: middle; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
html { scroll-padding-top: 100px; }
body { background: var(--canvas); }
button, a, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }
:where(button, .button, .nav-link, .category-link, .tabs a) { transition: background-color .16s ease, border-color .16s ease, color .16s ease; }
.button:hover:not(:disabled) { background: var(--accent-hover); border-color: var(--accent-hover); }
.button.secondary:hover, .icon-button:hover, .support-button:hover { background: var(--surface-raised); border-color: var(--line-strong); color: var(--text); }
.button.danger:hover { background: var(--danger-soft); border-color: var(--danger); }
input:hover, select:hover, textarea:hover { border-color: var(--muted); }
input:focus, select:focus, textarea:focus { border-color: var(--focus); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
input:-webkit-autofill { -webkit-text-fill-color: var(--text); box-shadow: 0 0 0 1000px var(--surface-subtle) inset; }
.header { min-height: 78px; gap: 20px; background: var(--surface); }
.header-context { display: grid; flex: 0 1 175px; min-width: 0; gap: 2px; }
.header-context > span:last-child { font-weight: 650; font-size: 15px; }
.header-context .eyebrow { margin: 0; font-size: 9px; letter-spacing: .13em; color: var(--muted); }
.header-search { display: flex; align-items: center; flex: 1 1 240px; min-width: 140px; max-width: 430px; gap: 10px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-subtle); color: var(--muted); }
.header-search:focus-within { border-color: var(--focus); }
.header-search input { border: 0; background: transparent; min-height: 42px; padding: 8px 0; font-size: 13px; outline: none; }
kbd { flex: 0 0 auto; padding: 2px 5px; border: 1px solid var(--line); border-radius: 4px; font: 10px system-ui, sans-serif; white-space: nowrap; color: var(--muted); }
.header-actions { gap: 8px; }
.cart-link, .profile-link, .support-button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 10px; border-radius: 9px; font-size: 13px; color: var(--text-secondary); }
.cart-link { background: var(--surface-subtle); border: 1px solid var(--line); }
.profile-link { max-width: 120px; }
.profile-link span { overflow: hidden; text-overflow: ellipsis; }
.support-button { font-weight: 600; }
.count { flex: 0 0 auto; min-width: 19px; height: 19px; padding: 1px 5px; font-size: 10px; line-height: 17px; }
#quick-search { display: none; }
.app-sidebar { display: none; }
.mobile-menu { width: min(360px, calc(100% - 24px)); max-height: calc(100dvh - 24px); margin: 12px 12px 12px auto; padding: 0; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); color: var(--text); overflow-y: auto; box-shadow: var(--shadow); }
.mobile-menu::backdrop { background: var(--backdrop); }
.mobile-menu:not([hidden]) { display: flex; flex-direction: column; gap: 0; }
.mobile-menu-heading { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.mobile-menu nav { display: grid; gap: 4px; padding: 14px; }
.nav-link { display: flex; align-items: center; gap: 12px; min-height: 46px; padding: 11px 14px; font-size: 14px; border-radius: 10px; }
.nav-link .ui-icon { color: var(--muted); }
.nav-link.active .ui-icon { color: var(--accent-text); }
.mobile-menu-footer { padding: 18px; border-top: 1px solid var(--line); font-size: 14px; }
.mobile-menu-footer small { display: block; margin-top: 4px; }
.panel { box-shadow: var(--shadow); }
.page-heading h1 { font-size: clamp(26px, 2.3vw, 34px); letter-spacing: -.025em; }
.page-heading .muted { font-size: 14px; }
.page-heading { margin-bottom: 24px; }
.footer { align-items: center; border-top: 1px solid var(--line); }
.footer .row { gap: 24px; }
.footer .icon-button { border: 0; padding-inline: 0; background: transparent; font-size: 13px; }
.loading { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 240px; }
.loading-spinner { width: 22px; height: 22px; border: 2px solid var(--line); border-top-color: var(--accent-text); border-radius: 50%; animation: loading-spin .7s linear infinite; }
@keyframes loading-spin { to { transform: rotate(360deg); } }
.tabs a.active { color: #fff; border-color: var(--accent); }
.badge { border: 1px solid var(--line); border-radius: 20px; padding: 4px 10px; }
.badge.good { border-color: var(--success-soft); }
.badge.bad { border-color: var(--danger-line); }
.stat { position: relative; border-radius: var(--radius); box-shadow: var(--shadow); padding: 22px; }
.stat::before { content: ''; display: block; width: 28px; height: 3px; margin-bottom: 18px; border-radius: 3px; background: var(--accent-text); }
.stat strong { font-size: clamp(26px, 2.1vw, 34px); letter-spacing: -.035em; }
.stats > .stat:nth-child(2)::before { background: var(--success); }
.stats > .stat:nth-child(3)::before { background: var(--chart); }
.stat:hover { border-color: var(--line-strong); }
.order-card { gap: 14px; }
.order-card a { color: var(--text); }
.order-total strong { font-size: 18px; }
.order-overview-panel { border-top: 3px solid var(--accent); }
.order-primary-actions .button { min-height: 48px; }
.cart-line-name .product-name { font-size: 16px; }
#cart-summary { position: sticky; top: 102px; }
.dialog { color: var(--text); background: var(--surface); border: 1px solid var(--line); box-shadow: 0 24px 90px #0006; }
.dialog-heading { background: var(--surface); }
.dialog-body > p { color: var(--text-secondary); }
.contact-links a { color: var(--accent-text); }
.notice { border: 1px solid #47705b; }
.notice.error { border-color: #be6b65; }

/* Products put buying information before secondary details. */
.catalog-layout { grid-template-columns: 220px minmax(0, 1fr); gap: 20px; }
.category-sidebar { position: sticky; top: 102px; overflow: hidden; }
.category-sidebar > summary { font-size: 14px; padding-inline: 16px; border-bottom: 1px solid var(--line); }
.category-nav { max-height: calc(100dvh - 190px); overflow: auto; scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; padding-top: 8px; }
.category-row { padding-left: calc(var(--depth, 0) * 7px); }
.category-link { font-size: 13px; padding-block: 10px; }
.category-toggle, .category-toggle-spacer { flex-basis: 28px; width: 28px; }
.category-path { font-size: 12px; }
.category-path .category-link { font-size: 12px; }
.catalog-filters { padding: 18px 20px; }
.catalog-filters .field > span { font-size: 13px; }
.catalog-filter-options summary { display: flex; align-items: center; font-size: 13px; list-style: none; }
.catalog-filter-options summary::before { content: '+'; font-size: 20px; margin-right: 8px; color: var(--muted); }
.catalog-filter-options[open] summary::before { content: '−'; }
.catalog-filter-options summary::-webkit-details-marker { display: none; }
.product-row { grid-template-columns: 72px minmax(0, 1fr); padding-block: 22px; gap: 14px 18px; }
.product-row .product-image { width: 72px; height: 72px; }
.product-image:not(.image-placeholder), .product-photo:not(.image-placeholder) { background: #fff; }
.image-placeholder { background: var(--surface-raised); color: var(--muted); }
.product-name { font-size: 15px; line-height: 1.5; }
.product-row p { margin: 6px 0 0; }
.product-row .price { font-size: 23px; letter-spacing: -.025em; }
.catalog-favorite { min-height: 36px; font-size: 12px; background: transparent; }
.stock-row { border: 1px solid var(--line); border-radius: 10px; padding: 12px; gap: 8px 12px; }
.stock-row > span { display: grid; gap: 3px; }
.stock-name { margin-bottom: 0; font-size: 12px; }
.stock-details { margin-top: 0; font-size: 11px; line-height: 1.5; }
.stock-row .button { font-size: 12px; min-height: 40px; padding: 8px 12px; }
.product-specs strong { color: var(--text); }
.product-specs > div { color: var(--muted); }
@container panel (min-width: 600px) {
 .product-row { grid-template-columns: 72px minmax(0,1fr) 150px; grid-template-areas: 'photo name price' '. stocks stocks'; gap: 18px; }
 .product-row .price-block { text-align: right; }
 .product-row .stocks { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .stock-row { grid-template-columns: minmax(0,1fr); }
 .stock-row .button { width: 100%; }
}
@container panel (min-width: 1100px) {
 .product-row { grid-template-columns: 80px minmax(0,1fr) 150px 340px; grid-template-areas: 'photo name price stocks'; }
 .product-row .stocks { grid-template-columns: minmax(0,1fr); }
 .stock-row { grid-template-columns: minmax(0,1fr) auto; }
 .stock-row .button { width: auto; }
}

/* Sign-in shares the visual language and remains focused on access. */
.auth { margin-block: 5vh; }
.auth-top { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.auth-top .brand { flex: 0 1 210px; }
.auth-login { width: min(100%, 1080px); }
.auth-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,450px); gap: 64px; align-items: center; }
.auth-intro { padding-block: 24px; }
.auth-intro .eyebrow { font-size: 11px; }
.auth-intro h2 { font-size: clamp(34px,4vw,52px); line-height: 1.15; letter-spacing: -.045em; margin: 22px 0; }
.auth-intro > p:not(.eyebrow) { color: var(--muted); font-size: 16px; }
.auth-benefits { display: grid; gap: 24px; margin-top: 44px; }
.auth-benefits > div { display: flex; align-items: center; gap: 16px; }
.auth-benefits .ui-icon { width: 24px; height: 24px; color: var(--accent-text); }
.auth-benefits strong { display: block; font-size: 14px; font-weight: 600; }
.auth-benefits small { display: block; margin-top: 3px; font-size: 13px; }
.auth-form-panel { margin-bottom: 0; padding: 32px !important; }
.auth-form-panel h1 { font-size: 27px; }
.auth-footnote { margin-top: 32px; color: var(--muted); font-size: 12px; }
.auth .start-help { color: var(--text-secondary); font-size: 13px; }

@media(min-width:1200px) {
 .app-shell { padding-left: 236px; }
 .app-sidebar { display: flex; position: fixed; inset: 0 auto 0 0; z-index: 25; width: 236px; flex-direction: column; gap: 0; padding: 26px 16px 18px; background: var(--surface); border-right: 1px solid var(--line); }
 .app-sidebar > .brand { flex: 0 0 auto; width: 190px; margin: 2px 6px 36px; }
 .sidebar-caption { color: var(--muted); font-size: 9px; letter-spacing: .11em; margin: 0 12px 14px; }
 .app-sidebar nav { display: grid; gap: 5px; overflow-y: auto; scrollbar-width: thin; }
 .app-sidebar .nav-link { font-size: 13px; }
 .sidebar-bottom { margin-top: auto; padding-top: 28px; }
 .sidebar-shortcut { display: flex; gap: 10px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--text-secondary); text-decoration: none; font-size: 12px; }
 .sidebar-shortcut > :last-child { margin-left: auto; width: 15px; }
 .sidebar-account { display: flex; gap: 10px; align-items: center; min-width: 0; margin-top: 18px; padding: 10px 8px; text-decoration: none; }
 .avatar { flex: 0 0 36px; display: grid; place-items: center; height: 36px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-raised); color: var(--accent-text); font-size: 14px; font-weight: 700; }
 .sidebar-account > :last-child { min-width: 0; }
 .sidebar-account strong { display: block; max-width: 144px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; }
 .sidebar-account small { display: block; margin-top: 3px; font-size: 10px; }
 .header-brand, #menu-toggle { display: none; }
}
@media(min-width:1200px) and (max-width:1399px) {
 .header-context { flex-basis: 140px; }
 .header-action-label, .profile-link span { display: none; }
 .header-search { min-width: 180px; }
}
@media(max-width:1199px) {
 .header-context { display: none; }
 .header .brand { flex: 0 0 158px; }
 #menu-toggle { display: inline-flex; }
 .header-search { max-width: none; }
 .header-action-label, .profile-link { display: none; }
 #cart-summary { position: static; }
}
@media(max-width:899px) {
 .catalog-layout { grid-template-columns: minmax(0,1fr); }
 .category-sidebar { position: static; }
 .category-nav { max-height: 60dvh; }
 .header-search { display: none; }
 #quick-search { display: inline-flex; }
 .auth-layout { grid-template-columns: minmax(0,1fr); gap: 28px; max-width: 500px; margin: auto; }
 .auth-intro { display: none; }
 .auth-login { max-width: 560px; }
 .auth-footnote { text-align: center; }
}
@media(max-width:599px) {
 .header { min-height: 66px; padding: 10px var(--gutter); gap: 8px; }
 .header .brand { flex: 1 1 125px; min-width: 90px; max-width: 156px; }
 .header-actions { gap: 6px; }
 .header-actions .icon-button, .header-actions .support-button { width: 40px; min-width: 40px; min-height: 44px; padding: 8px; border-radius: 9px; }
 #quick-search, .header .cart-link { display: none; }
 .header-actions .ui-icon { width: 19px; height: 19px; }
 .bottom-nav { gap: 4px; background: var(--surface); padding-top: 7px; padding-bottom: calc(7px + env(safe-area-inset-bottom)); }
 .bottom-nav a { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px 3px; font-size: 10px; line-height: 1.4; min-height: 48px; }
 .bottom-nav .ui-icon { width: 20px; height: 20px; }
 .bottom-nav .count { position: absolute; top: 2px; left: calc(50% + 5px); }
 .main { padding-top: 22px; }
 .page-heading h1 { font-size: 27px; }
 .page-heading > .row { gap: 8px; margin-top: 12px; }
 .page-heading .button { font-size: 12px; padding-inline: 10px; }
 .catalog-filters { padding: 14px; }
 .catalog-search-row { gap: 8px; }
 .catalog-search-row .field > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
 .catalog-filter-options { margin-top: 7px; }
 .catalog-page .toolbar { gap: 4px; align-items: flex-start; margin-bottom: 12px; }
 .catalog-page .toolbar small { font-size: 11px; }
 .category-path { gap: 0 7px; }
 .category-sidebar > summary { padding: 10px 14px; font-size: 13px; }
 .panel { box-shadow: none; }
 .product-row { grid-template-columns: 64px minmax(0,1fr); gap: 12px; }
 .product-row .product-image { width: 64px; height: 64px; }
 .product-row .product-name { font-size: 14px; }
 .product-row .price-block { display: flex; flex-direction: column; padding-right: 50px; gap: 0; }
 .product-row .price { font-size: 23px; }
 .stock-row { padding: 10px 12px; gap: 9px; }
 .stock-row .button { min-height: 44px; }
 .stock-name { font-size: 12px; }
 .stock-row strong { font-size: 14px; }
 .stats { margin-top: 18px; gap: 10px; }
 .stat { padding: 16px; }
 .stat::before { margin-bottom: 12px; }
 .footer .row { gap: 18px; }
 .auth-top { margin-bottom: 24px; }
 .auth-top .brand { flex-basis: 190px; }
 .auth-form-panel { padding: 24px 20px !important; }
 .auth-form-panel h1 { font-size: 24px; }
 .auth .row { gap: 14px; }
}
@media(prefers-reduced-motion:reduce) {
 *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media print {
 :root, :root[data-theme] { color-scheme: light; --canvas:#fff; --surface:#fff; --surface-subtle:#f5f7fa; --surface-raised:#eaf0f5; --text:#202c3a; --text-secondary:#39495c; --muted:#5e6c7e; --line:#dce3ec; --line-strong:#a0aec1; --accent-text:#aa3029; --success:#176341; --success-soft:#e6f5ec; --danger:#a22b28; --danger-soft:#fcecea; --warning:#775013; --warning-soft:#fff6e5; }
 .app-shell { padding: 0; }
 .app-sidebar, .mobile-menu { display: none !important; }
 .panel, .stat { box-shadow: none; }
 #cart-summary, .category-sidebar { position: static; }
 .quote-page { color: var(--text); }
}
.active-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: -8px 0 18px; }
.filter-chip { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--text-secondary); font-size: 12px; text-decoration: none; }
.filter-chip span { min-width: 0; }
.filter-chip strong { font-weight: 600; }
.filter-chip .ui-icon { width: 14px; height: 14px; color: var(--muted); }
.filter-chip:hover { border-color: var(--accent-text); }
button[aria-busy=true]::after { content: ''; flex: 0 0 14px; width: 14px; height: 14px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: loading-spin .7s linear infinite; }
@media(max-width:599px) { .active-filters { margin: 0 0 12px; gap: 6px; } .filter-chip { min-height: 36px; font-size: 11px; } }
@media(prefers-reduced-motion:reduce) { button[aria-busy=true]::after { animation: none; } }
.price, .retail { overflow-wrap: anywhere; }
.header-search-submit { display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 32px; padding: 0; color: var(--text-secondary); background: transparent; border: 0; border-radius: 6px; }
.header-search-submit:hover { background: var(--surface-raised); }
@media(max-width:599px) {
 .finance-stats { grid-template-columns: minmax(0,1fr); gap: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; }
 .finance-stats .stat { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); gap: 12px; align-items: center; padding: 13px 14px; background: var(--surface-subtle); border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; }
 .finance-stats .stat:last-child { border-bottom: 0; }
 .finance-stats .stat::before { display: none; }
 .finance-stats .stat span { font-size: 12px; }
 .finance-stats .stat strong { margin: 0; text-align: right; font-size: 20px; letter-spacing: -.025em; }
}