/* Visual v1.2 — page-body skin; approved v1.7 geometry is retained except
   the explicitly permitted +6px for wrapped nine-digit prices at 375–389px.
   Shared HF v1.4 and B logos remain byte-identical. Slab v1.1 is a review candidate.
   No content, grid, asset or data-contract changes. */
.page-main {
  --visual-ink:#171714;
  --visual-muted:#62625e;
  --visual-rule:#deded8;
  --visual-control:#85857f;
  --visual-accent:#ffd400;
  --visual-accent-soft:#fff8d6;
  --visual-focus:#075bc7;
  color:var(--visual-ink);
}
.page-main .breadcrumb { color:var(--visual-muted); }
.page-main .breadcrumb a { color:#4b4b46; text-decoration-color:#92928b; }
.page-main .page-title,.page-main .card-name,.page-main .card-price { color:var(--visual-ink); }
.page-main .card-identity,.page-main .price-label,.page-main .metric-line,.page-main .page-nav p { color:var(--visual-muted); }

.page-main .search-panel input[type="search"] {
  border-color:var(--visual-control);
  background:#fff;
  box-shadow:inset 0 1px 2px #17171405;
}
.page-main .search-panel input::placeholder { color:var(--visual-muted); opacity:1; }
.page-main .search-panel button,.page-main .page-next {
  color:var(--visual-ink);
  background:var(--visual-accent);
  border-color:#877100;
  box-shadow:0 1px 1px #1717140a;
}
.page-main .sort-grid { border-color:var(--visual-control); background:#fff; }
.page-main .sort-grid a { color:var(--visual-ink); border-color:var(--visual-rule); }
.page-main .sort-grid a[aria-current="page"] {
  background:var(--visual-accent);
  box-shadow:inset 0 -3px var(--visual-ink);
}
.page-main .card-article {
  border-color:var(--visual-rule);
  background:#fff;
  box-shadow:0 2px 8px #17171408;
}
.page-main .metric-line b { color:var(--visual-accent); background:#171714; }
.page-main .detail-cta,.page-main .result-summary a,.page-main .page-prev {
  color:var(--visual-ink);
  border-color:var(--visual-control);
  background:#fafaf7;
}
.page-main .empty-state { color:var(--visual-ink); border-color:var(--visual-control); background:#fafaf7; }
.page-main .empty-state p,.page-main .radar-status,.page-main .image-fallback { color:var(--visual-muted); }

/* Source: shared slab v1.1 clear-case surface. Geometry and compact 10px
   label copy stay v1.7; the source 3.7cqw micro-type is NOT shrunk into this list. */
.page-main .slab {
  position:relative;
  isolation:isolate;
  border-radius:4%;
  outline-color:#8d999d;
  background:linear-gradient(108deg,#fcfdfdee 0%,#dce3e6b8 3%,#ffffffea 5%,#e4eaed7a 9%,#fcfdfdaa 16%,#e5e9eb8a 84%,#fff 94%,#d6dfe2d9 98%,#fff 100%);
  box-shadow:inset 0 0 0 1px #8d999d,inset 0 0 0 3px #fff,0 4px 9px #1c262816;
}
.page-main .slab::before,.page-main .slab::after {
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-1;
}
.page-main .slab::before { inset:1.2% 2%; border-radius:3%; box-shadow:inset 0 0 0 1px #adb9bd,0 0 0 1px #ffffffbf; }
.page-main .slab::after { inset:2.25% 3.65%; border-radius:2.5%; box-shadow:inset 0 0 0 1px #b5c0c488,0 0 0 1px #ffffffd6; }
.page-main .psa-case-label {
  color:#171714;
  background:#fff;
  outline-color:#c92230;
  box-shadow:0 0 0 2px #fff,0 0 0 2.5px #cbd2d6;
}
.page-main .psa-case-label b { color:#b51d29; }
.page-main .card-image-slot {
  outline-style:solid;
  outline-color:#aebbbe;
  background:#f4f5f4;
  box-shadow:inset 0 0 2px #7b898a40;
}
.page-main .card-mount { background:#f4f5f4; }

/* Coordinates, axis order, radius, stroke widths and label metrics are inherited. */
.page-main .radar-grid polygon,.page-main .radar-grid line { stroke:#85857f; }
.page-main .radar-value { fill:#ffd40055; stroke:#373224; }
.page-main .radar-labels { fill:var(--visual-ink); }

@media (hover:hover) {
  .page-main .search-panel button:hover,.page-main .page-next:hover { background:#f3ca00; }
  .page-main .sort-grid a:not([aria-current="page"]):hover,
  .page-main .detail-cta:hover,.page-main .result-summary a:hover,.page-main .page-prev:hover { background:var(--visual-accent-soft); }
  .page-main .card-name:hover { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
}
/* The existing 3px focus outline and inset sort focus remain unchanged. */

/* User-authorized exception, 2026-09-06. A 20px price remains 20px.
   Two lines gain 3px each; the affected card grows naturally by 6px. */
@media (min-width:375px) and (max-width:389px) {
  .page-main .card-price.is-wrapped-nine-digit-price { line-height:27px; }
}

/* v1.6: adopted sort A, independent faces. Link/ID/DOM order and query
   behavior remain inherited. No card, slab, radar or shared HF changes. */
.page-main .sort-grid {
  gap:4px;
  border:0;
  border-radius:0;
  background:transparent;
}
.page-main .sort-grid a {
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  border-radius:4px;
  background:transparent;
  color:var(--visual-ink);
  font-size:11px;
  font-weight:500;
  line-height:1.4;
  white-space:nowrap;
  overflow-wrap:normal;
  box-shadow:none;
}
.page-main .sort-grid a > span {
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-width:0;
  height:32px;
  padding:0 1px;
  border:1px solid #d7d7d0;
  border-radius:4px;
  background:#fff;
  white-space:nowrap;
}
.page-main .sort-grid a br { display:none; }
.page-main .sort-grid a[aria-current="page"] {
  background:transparent;
  box-shadow:none;
  font-weight:700;
}
.page-main .sort-grid a[aria-current="page"] > span {
  background:var(--visual-accent);
  border-color:var(--visual-ink);
}
@media (min-width:375px) {
  .page-main .sort-grid a { font-size:12px; }
}
@media (min-width:768px) {
  .page-main .sort-grid a > span { height:40px; }
}
@media (min-width:1024px) {
  .page-main .sort-grid a { font-size:13px; }
}
@media (hover:hover) {
  .page-main .sort-grid a:not([aria-current="page"]):hover { background:transparent; }
  .page-main .sort-grid a:not([aria-current="page"]):hover > span { background:var(--visual-accent-soft); }
}
/* The adopted reference separates the compact face from the touch target.
   Non-overlapping 44px anchor rows apply only to coarse-pointer devices. */
@media (pointer:coarse) {
  .page-main .sort-grid a { height:44px; }
}