/* geist-switch 2026-10-17: font and weights mapped by scratchpad/switch-to-geist.py */
/* Minimal shares Alda's product cards, typography, palette and global masthead. */
body.pl-page:has(.pl-minimal) { padding-top: 0; }
body.sn-ready .pl.pl-minimal { padding-top: var(--sn-height); }
.mi-main { padding: 0 var(--sn-gutter) 90px; }
.mi-head { display: flex; align-items: flex-end; justify-content: space-between; padding: 42px 0 30px; gap: 24px; }
.mi-back { font-size: 12px; color: var(--alda-muted) !important; }
.mi-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; font-size:12px; color:var(--alda-muted); line-height:1.5; }
.mi-breadcrumb a { color:inherit; }
.mi-breadcrumb a:hover { color:var(--alda-red); }
.mi-breadcrumb [aria-current=page] { color:var(--alda-ink); }
.mi-head h1 { font-size: clamp(44px,4.5vw,68px); letter-spacing: -.055em; line-height: 1.1; margin-top: 12px; font-weight: 500; }
.mi-head sup { font-size: 13px; letter-spacing: 0; vertical-align: top; display: inline-block; margin: 10px 0 0 14px; color: var(--alda-muted); }
.mi-head .pl-cats { gap: 20px; padding-bottom: 4px; }
.mi-head .pl-cats a { border: 0; border-radius: 0; padding: 6px 0; color: var(--alda-muted); background: none; font-size: 13px; }
.mi-head .pl-cats a.is-here { color: var(--alda-ink); box-shadow: 0 1px var(--alda-red); }
.mi-toolbar { position: sticky; top: var(--sn-height); z-index: 5; display: flex; align-items: center; gap: 24px; min-height: 64px; background: var(--alda-paper); border-block: 1px solid #22222220; }
.mi-toolbar button,.mi-reset { background: none; color: var(--alda-ink); border: 0; cursor: pointer; font: inherit; }
.mi-open { display: flex; align-items: center; gap: 12px; padding: 15px 0; font-size: 14px !important; }
.mi-open > span:last-child { font-size: 19px; margin-left: 14px; }
/* ink, not red: red is an accent only, never a filled badge (2026-10-13) */
.mi-badge { background: var(--alda-ink); color: var(--alda-paper); min-width: 20px; height: 20px; border-radius: 50%; font-size: 11px; display: inline-grid; place-items: center; }
.mi-badge[hidden] { display: none; }
.mi-count { color: var(--alda-muted); font-size: 12px; margin-left: auto; }
.mi-density { display: flex; gap: 3px; }
.mi-density button { width: 36px; height: 36px; font-size: 23px; color: #888b81; border-radius: 6px; }
.mi-density button[aria-pressed=true] { color: var(--alda-ink); background: #e7e9df; }
.mi-active { display: flex; flex-wrap: wrap; gap: 8px; }
.mi-active:not(:empty) { padding: 16px 0; }
.mi-active button { border: 1px solid #22222224; border-radius: 20px; background: transparent; padding: 5px 12px; font: inherit; font-size: 12px; cursor: pointer; }
.mi-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); column-gap: 18px; row-gap: 42px; padding-top: 18px; }
.mi-grid[data-density="2"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
.mi-grid[data-density="4"] { grid-template-columns: repeat(4,minmax(0,1fr)); }
.pl-minimal .pc { border: 0; border-radius: 0; background: none; box-shadow: none; min-width: 0; }
.pl-minimal .pc[hidden] { display: none !important; }
/* A square frame (2026-10-14; it was 1 / 1.05): every card's picture is a product's square PDP main view, filled edge to
   edge (.has-photography below), and a frame of any other shape cut the photograph - the tri-ply kadai's handles were
   sliced at both card edges. The one render card left (tri-ply-saute-pan, no photograph yet) shares the frame so a row
   keeps one height. scratchpad/check-white-heroes.mjs measures every listing card for a trimmed photograph. */
.pl-minimal .pc-art { border-radius: 10px; background: var(--alda-paper); aspect-ratio: 1 / 1; overflow: hidden; }
.pl-minimal .pc-img { width: 86%; height: 86%; left: 7%; top: 7%; object-fit: contain; mix-blend-mode: multiply; filter: none; }
.pl-minimal .pc-art > a { display: block; width: 100%; height: 100%; }
.pl-minimal .pc-badges,.pl-minimal .pc-meta .ok { display: none; }
.pl-minimal .pc-body { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; padding: 15px 2px 0; }
.pl-minimal .pc-name { font-size: 15px; line-height: 1.35; font-weight: 500; letter-spacing: -.02em; }
.pl-minimal .pc-price { font-size: 13px; line-height: 1.55; white-space: nowrap; }
.pl-minimal .pc-meta { grid-column: 1 / -1; font-size: 11px; color: var(--alda-muted); display: flex; justify-content: space-between; gap: 8px; margin: 0; }
.pl-minimal .pc-meta span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mi-empty { padding: 100px 20px; text-align: center; }
.mi-empty h2 { font-size: 30px; letter-spacing: -.04em; }
.mi-empty p { margin: 12px 0; color: #777; }
.mi-reset { text-decoration: underline; }
.mi-dialog { position: fixed; inset: 0 0 0 auto; width: min(480px,100%); height: 100dvh; max-height: 100dvh; max-width: 100%; margin: 0; padding: 0; background: var(--alda-paper); color: var(--alda-ink); border: 0; border-radius: 22px 0 0 22px; font: 500 14px/1.45 Geist,Arial,sans-serif; box-shadow: -20px 0 70px #17191120; }
.mi-dialog[open] { display: flex; flex-direction: column; animation: mi-slide .38s cubic-bezier(.2,.7,.2,1); }
.mi-dialog::backdrop { background: #16181160; }
.mi-dialog *, .mi-dialog *::before { box-sizing: border-box; }
.mi-dialog-head { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; padding: 30px 30px 24px; border-bottom: 1px solid #22222220; }
.mi-dialog-head span { font-size: 9px; letter-spacing: .14em; color: var(--alda-muted); }
.mi-dialog-head h2 { font-size: 29px; font-weight: 500; letter-spacing: -.04em; margin: 7px 0 0; }
.mi-dialog-head button { background: none; border: 1px solid #22222225; border-radius: 50%; width: 36px; height: 36px; font-size: 23px; cursor: pointer; }
.mi-dialog-body { padding: 0 30px 24px; overflow: auto; flex: 1; min-height: 0; overscroll-behavior: contain; }
.mi-group { border-bottom: 1px solid #22222220; }
.mi-group summary { cursor: pointer; display: flex; justify-content: space-between; align-items: center; list-style: none; padding: 23px 0; font-size: 14px; }
.mi-group summary::-webkit-details-marker { display: none; }
.mi-group summary > span { font-size: 20px; font-weight: 400; }
.mi-group[open] summary > span { transform: rotate(45deg); }
.mi-options { display: grid; grid-template-columns: 1fr 1fr; padding-bottom: 23px; gap: 8px; }
.mi-options label { position: relative; display: flex; align-items: center; gap: 8px; cursor: pointer; min-height: 46px; padding: 10px; border: 1px solid #22222225; border-radius: 8px; font-size: 12px; }
.mi-options label:has(input:checked) { background: #e8eadf; border-color: var(--alda-ink); }
.mi-options label:has(input:disabled) { opacity: .4; }
.mi-options input { appearance: auto; position: static; opacity: 1; width: 13px; height: 13px; margin: 0; accent-color: var(--alda-ink); flex-shrink: 0; }
.mi-options small { margin-left: auto; color: var(--alda-muted); font-size: 10px; }
.mi-sort { grid-template-columns: 1fr; }
.mi-price-note { font-size: 11px; color: var(--alda-muted); padding: 20px 0 0; margin: 0; }
.mi-dialog-foot { flex-shrink: 0; padding: 18px 30px max(18px,env(safe-area-inset-bottom)); border-top: 1px solid #22222220; background: var(--alda-paper); }
.mi-dialog-foot button { font: inherit; cursor: pointer; width: 100%; min-height: 46px; border: 0; }
.mi-apply { display: flex; align-items: center; justify-content: space-between; padding: 0 20px; background: var(--alda-ink); color: var(--alda-paper); border-radius: 24px; }
.mi-clear { background: none; color: var(--alda-muted); font-size: 12px !important; text-decoration: underline; }
.mi-dialog :focus-visible,.pl-minimal :focus-visible { outline: 2px solid var(--alda-ink); outline-offset: 3px; }
html:has(.mi-dialog[open]) { overflow: hidden; }
@keyframes mi-slide { from { transform: translateX(100%); } to { transform: translateX(0); } }
@media(max-width:700px) {
 .mi-head { align-items: flex-start; flex-direction: column; gap: 20px; padding: 28px 6px 22px; }
 .mi-head h1 { font-size: 46px; }
 .mi-toolbar { gap: 10px; }
 .mi-open { font-size: 12px !important; }
 .mi-open > span:last-child { margin-left: 0; }
 .mi-count { font-size: 10px; }
 .mi-density { gap: 0; }
 .mi-density button { width: 30px; }
 .mi-grid { gap: 28px 10px; }
 .mi-grid[data-density="3"],.mi-grid[data-density="4"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .mi-grid[data-density="2"] { grid-template-columns: 1fr; }
 .mi-density button[data-density="4"] { display: none; }
 .pl-minimal .pc-body { grid-template-columns: 1fr; gap: 3px; padding-top: 10px; }
 .pl-minimal .pc-name { font-size: 13px; }
 .pl-minimal .pc-price { font-size: 12px; }
 .pl-minimal .pc-meta { font-size: 10px; flex-wrap: wrap; }
 .mi-dialog { border-radius: 0; }
 .mi-dialog-head { padding: 22px; }
 .mi-dialog-body { padding-inline: 22px; }
 .mi-dialog-foot { padding-inline: 22px; }
}
@media(prefers-reduced-motion:reduce) { .mi-dialog[open] { animation: none; } .pl-minimal * { transition: none !important; } }
.pl-minimal .pc-img { position: absolute; }
/* Keep the first row's names and prices in view on a typical laptop. */
.mi-head { padding-top: 26px; padding-bottom: 24px; }
.mi-head h1 { font-size: clamp(44px,4vw,60px); }
.mi-options label { font-weight: 500; }
@media(max-width:700px) { .pl-minimal .pc-price { justify-self: start; } }
.mi-coming { min-height: 320px; background: var(--alda-paper); border-radius: 10px; padding: 30px; display: flex; flex-direction: column; justify-content: space-between; }
.mi-coming > span { font-size: 11px; letter-spacing: .04em; color: var(--alda-muted); }
.mi-coming h2 { font-size: clamp(28px,3vw,46px); letter-spacing: -.04em; }
.mi-density[hidden] { display: none; }
.mi-open:disabled { cursor: default; color: var(--alda-muted); }
.mi-density svg { display: block; margin: auto; width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1; }
/* Supplied product photographs retain their original framing and colours. */
.pl-minimal .pc.has-photography .pc-img,.pl-minimal .pc.has-photography .pc-alt { width:100%;height:100%;left:0;top:0;object-fit:cover;mix-blend-mode:normal;filter:none; }
/* the product photograph is never trimmed: it fills the square frame exactly, and a photograph of any other shape would
   sit whole inside it rather than lose its edges (2026-10-14); the in-use photograph on hover is a scene and fills it */
.pl-minimal .pc.has-photography .pc-img { object-fit:contain; }
.pl-minimal .pc.has-photography .pc-alt { object-fit:cover; }

/* ---------- Filter & sort, refined (2026-09-27) ----------
   The trigger joins the header's button family (40px, 8px corner, hairline, stroke icon, red on
   hover). The dialog is a side sheet on desktop and a bottom sheet on phones; sort comes first as
   chips (minimal.js moves it up and opens it); filters are chips with live counts; each group shows
   a chevron, not a "+" that turned into a second close, and how many of its options are picked;
   Clear and Show sit in one sticky row. */
.mi-toolbar .mi-open { gap: 8px; height: 40px; min-height: 40px; padding: 0 14px 0 12px !important; border: 1px solid #22222229; border-radius: 8px; background: var(--alda-paper); color: var(--alda-ink); font-size: 14px !important; transition: color .2s, border-color .2s; }
.mi-toolbar .mi-open::before { content: ''; flex: none; width: 17px; height: 17px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M2.5 4.5h5.5M11.5 4.5h2M2.5 11.5h2M8 11.5h5.5'/%3E%3Ccircle cx='9.8' cy='4.5' r='1.6'/%3E%3Ccircle cx='6.2' cy='11.5' r='1.6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M2.5 4.5h5.5M11.5 4.5h2M2.5 11.5h2M8 11.5h5.5'/%3E%3Ccircle cx='9.8' cy='4.5' r='1.6'/%3E%3Ccircle cx='6.2' cy='11.5' r='1.6'/%3E%3C/svg%3E") center / contain no-repeat; }
.mi-toolbar .mi-open > span[aria-hidden="true"] { display: none; }
.mi-toolbar .mi-open:hover:not(:disabled) { color: var(--alda-red); border-color: var(--alda-red); }
.mi-toolbar .mi-open .mi-badge { width: auto; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 100px; font-size: 11px; font-variant-numeric: tabular-nums; }
.mi-toolbar .mi-open:disabled { height: auto; padding: 15px 0 !important; border-color: transparent; background: none; }
.mi-toolbar .mi-open:disabled::before { display: none; }

.mi-dialog { width: min(440px, 100%); }
.mi-dialog::backdrop { background: #1618115c; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.mi-dialog[open]::backdrop { animation: mi-fade .3s ease; }
@keyframes mi-fade { from { opacity: 0; } to { opacity: 1; } }
.mi-dialog-head { padding: 24px 26px 18px; }
.mi-dialog-head h2 { font-size: 26px; }
.mi-dialog-head button { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 8px; border: 1px solid #22222229; background: var(--alda-paper); color: var(--alda-ink); font-size: 20px; line-height: 1; transition: color .2s, border-color .2s; }
.mi-dialog-head button:hover { color: var(--alda-red); border-color: var(--alda-red); }
.mi-dialog-body { display: flex; flex-direction: column; padding: 4px 26px 20px; scrollbar-width: thin; scrollbar-color: #22222230 transparent; }
.mi-dialog-body::-webkit-scrollbar { width: 6px; }
.mi-dialog-body::-webkit-scrollbar-thumb { background: #22222230; border-radius: 6px; }
/* a group's row: its name, how many are picked, and - while it is closed - which ones (adidas, Yami) */
.mi-group summary { display: grid; grid-template-columns: auto auto 1fr 12px; align-items: center; column-gap: 10px; padding: 18px 0; font-size: 15px; }
.mi-group summary > .mi-gt, .mi-group[open] summary > .mi-gt { grid-column: 1; font-size: 15px; font-weight: 500; transform: none; transition: color .2s; }
.mi-group summary > .mi-sel { grid-column: 2; grid-row: 1; }
.mi-group summary > .mi-sum, .mi-group[open] summary > .mi-sum { grid-column: 1 / 4; grid-row: 2; margin-top: 4px; overflow: hidden; font-size: 12px; font-weight: 500; color: var(--alda-muted); white-space: nowrap; text-overflow: ellipsis; transform: none; }
.mi-group[open] summary > .mi-sum, .mi-sum[hidden] { display: none; }
.mi-group summary > span:last-child { grid-column: 4; grid-row: 1; justify-self: end; width: 8px; height: 8px; font-size: 0; border-right: 1.4px solid currentColor; border-bottom: 1.4px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .35s cubic-bezier(.2,.7,.2,1); }
.mi-group[open] summary > span:last-child { transform: translateY(2px) rotate(-135deg); }
.mi-group summary:hover .mi-gt { color: var(--alda-red); }
.mi-sel { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 100px; background: var(--alda-ink); color: var(--alda-paper); font-size: 11px; font-variant-numeric: tabular-nums; }
.mi-sel[hidden] { display: none; }
/* the picks so far, removable in place (Walmart's "Selected filters") */
.mi-picked { padding: 16px 0 18px; border-bottom: 1px solid #22222220; }
.mi-picked[hidden] { display: none; }
.mi-picked-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--alda-muted); }
.mi-picked-clear { padding: 0; border: 0; background: none; color: var(--alda-ink); font: inherit; font-size: 12px; letter-spacing: 0; text-transform: none; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.mi-picked-clear:hover { color: var(--alda-red); }
.mi-picked-row { display: flex; flex-wrap: wrap; gap: 6px; }
.mi-chip { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px 0 13px; border: 0; border-radius: 100px; background: var(--alda-ink); color: var(--alda-paper); font: inherit; font-size: 12px; cursor: pointer; transition: background .2s; }
.mi-chip::after { content: ''; width: 9px; height: 9px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M2 2l6 6M8 2 2 8'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M2 2l6 6M8 2 2 8'/%3E%3C/svg%3E") center / contain no-repeat; }
.mi-chip:hover { background: var(--alda-red); }
.mi-chip:hover::after { background: #ff4d6a; }
.mi-options { display: flex; flex-wrap: wrap; gap: 8px; padding-bottom: 20px; }
.mi-options label { gap: 8px; min-height: 38px; padding: 0 14px; border: 1px solid #22222224; border-radius: 100px; background: var(--alda-paper); font-size: 13px; transition: background .2s, color .2s, border-color .2s; }
/* a filter chip says what a tap does: "+" to add, a tick once it's in (HelloFresh) */
.mi-options:not(.mi-sort) label::before { content: ''; flex: none; width: 10px; height: 10px; margin-left: -2px; background: currentColor; opacity: .7; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M5 1.5v7M1.5 5h7'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round'%3E%3Cpath d='M5 1.5v7M1.5 5h7'/%3E%3C/svg%3E") center / contain no-repeat; }
.mi-options:not(.mi-sort) label:has(input:checked)::before { opacity: 1; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.8 5.3 4 7.4l4.2-4.8'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.8 5.3 4 7.4l4.2-4.8'/%3E%3C/svg%3E"); }
/* the applied filters on the page, and one way to drop them all */
.mi-active button { display: inline-flex; align-items: center; height: 32px; padding: 0 13px; border: 1px solid #22222224; border-radius: 100px; background: var(--alda-paper); font-size: 12px; transition: border-color .2s, color .2s; }
.mi-active button:hover { border-color: var(--alda-red); color: var(--alda-red); }
.mi-active .mi-active-clear { border-color: transparent; background: none; text-decoration: underline; text-underline-offset: 3px; }
.mi-options label:hover { border-color: var(--alda-ink); }
.mi-options input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.mi-options label:has(input:checked) { background: var(--alda-ink); border-color: var(--alda-ink); color: var(--alda-paper); }
.mi-options label:has(input:checked) small { color: #f5f6f1a6; }
.mi-options label:has(input:focus-visible) { border-color: var(--alda-ink); box-shadow: inset 0 0 0 .5px var(--alda-ink), inset 0 0 0 2px var(--alda-paper); }
.mi-options label:has(input:disabled) { opacity: .35; cursor: default; }
.mi-options label:has(input:disabled):hover { border-color: #22222224; }
.mi-options small { margin-left: 0; font-size: 11px; font-variant-numeric: tabular-nums; }
.mi-sort label small { display: none; }
.mi-price-note { margin: 16px 0 0; font-size: 12px; color: var(--alda-muted); }
.mi-dialog-foot { display: flex; align-items: center; gap: 10px; padding: 14px 26px max(14px, env(safe-area-inset-bottom)); }
.mi-dialog-foot .mi-clear { order: -1; flex: none; width: auto; min-height: 48px; padding: 0 18px; border: 1px solid #22222229; border-radius: 100px; background: transparent; color: var(--alda-ink); font-size: 13px !important; text-decoration: none; transition: border-color .2s, opacity .2s; }
.mi-dialog-foot .mi-clear:hover:not(:disabled) { border-color: var(--alda-red); color: var(--alda-red); }
.mi-dialog-foot .mi-clear:disabled { opacity: .4; cursor: default; }
.mi-dialog-foot .mi-apply { flex: 1; width: auto; }
@media (max-width: 700px) {
  .mi-dialog { inset: auto 0 0 0; width: 100%; height: auto; max-height: 90dvh; border-radius: 22px 22px 0 0; box-shadow: 0 -20px 60px #17191124; }
  .mi-dialog[open] { animation: mi-rise .42s cubic-bezier(.2,.7,.2,1); }
  .mi-dialog-head { position: relative; padding: 26px 20px 14px; }
  .mi-dialog-head::before { content: ''; position: absolute; top: 9px; left: 50%; width: 36px; height: 4px; margin-left: -18px; border-radius: 4px; background: #2222222a; }
  .mi-dialog-head h2 { font-size: 22px; }
  .mi-dialog-body { padding: 4px 20px 16px; }
  .mi-dialog-foot { padding-inline: 20px; }
}
@keyframes mi-rise { from { transform: translateY(100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { .mi-dialog[open], .mi-dialog[open]::backdrop { animation: none; } }

/* ---------- The sale (2026-10-11) ----------
   A card on sale shows its selling price with that size's MRP struck beside it (site.css .pr), and the discount as a
   small tag in the art's corner: red text, never a red fill. The tag keeps a surface of its own because the hover
   swaps in an in-use photograph, and that surface is the house panel (var(--alda-paper)): the brand red on it is 4.53:1 (AA),
   where on the page cream it would be 4.32:1 and on the art's own ground 4.06:1. The Sale listing adds a line of
   intro under its title, and a calm note with the way back to the shop when nothing is on sale. */
.pl-minimal .pc-off { position: absolute; top: 12px; left: 12px; z-index: 2; display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 100px; background: var(--ac-panel, var(--alda-paper)); box-shadow: inset 0 0 0 1px #2222220f; font-size: 12px; line-height: 1; pointer-events: none; }
.pl-minimal .pc-off .pr-off { font-size: inherit; }
.pl-minimal .pc-price .pr.is-sale { justify-content: flex-end; column-gap: .4em; }
/* the struck MRP: site.css's own size and weight (at least 12px, 400 - legible under its strike at 1x), restated here
   only because plp.css's older '.pc-price s' rule (.85em) outranks site.css's '.pr-was' */
.pl-minimal .pc-price .pr-was { margin-left: 0; font-size: max(.86em, 12px); font-weight: 500; }
/* A card's name and meta may shrink below their longest line (the meta line ellipsises), so a long name never pushes
   the card wider than its column (the Outer-Lid cooker did at 320px, by 17px). */
.pl-minimal .pc-body { grid-template-columns: minmax(0,1fr) auto; }
/* Where the price sits is decided by the card's column width alone (the sale review, 2026-10-11), never by what the
   card holds - so every card in a row lays out the same way at every density and width. A column of 290px or more
   keeps the price beside the name: next to today's widest price ('from 3,290' with 3,690 struck, the Outer-Lid cooker)
   the name still gets about 10em. A narrower column puts every card's price under its name, left-aligned, rather than
   squeezing names into a sliver. Phones (700px and under) always stack them (above and below). */
.pl-minimal .pc { container: pc / inline-size; }
@container pc (max-width: 289.98px) {
  .pl-minimal .pc-body { grid-template-columns: minmax(0,1fr); }
  .pl-minimal .pc-price { justify-self: start; }
  .pl-minimal .pc-price .pr.is-sale { justify-content: flex-start; }
}
.mi-intro { margin: 10px 0 0; max-width: 46ch; font-size: 15px; line-height: 1.45; letter-spacing: -.01em; color: var(--alda-muted); }
.mi-toolbar[hidden] { display: none; }
/* the Sale that follows Shopify (minimal.js, 2026-11-04): the note while nothing is on sale, and the filter values and
   groups that nothing on sale carries */
:is(.mi-none, .mi-intro, .mi-group, .mi-options label)[hidden] { display: none; }
.mi-none { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 96px 20px 120px; border-top: 1px solid #22222220; text-align: center; }
.mi-none h2 { margin: 0; font-size: clamp(28px,3vw,40px); font-weight: 500; letter-spacing: -.04em; line-height: 1.1; }
.mi-none p { margin: 0 0 12px; color: var(--alda-muted); }
@media (max-width: 700px) {
  .pl-minimal .pc-body { grid-template-columns: minmax(0,1fr); }
  .pl-minimal .pc-off { top: 8px; left: 8px; height: 22px; padding: 0 8px; font-size: 11px; }
  .pl-minimal .pc-price .pr.is-sale { justify-content: flex-start; }
  .mi-intro { font-size: 14px; }
  .mi-none { padding: 64px 12px 90px; }
}
/* ---------- focus: Option C, "Grouped card" (2026-10-13; site.css "focus: Option C") ----------
   Never a red ring. Filter & sort, the applied filters, the dialog's close and Clear, and the chips: a 1.5px ink inner
   edge (a chosen chip - ink - shows a cream line inside it). The ink chips of the picks so far: a 2px cream line inside.
   The shelf tabs above the grid: a 2px ink underline. A card: the 2px ink ring on its photograph's frame (the link
   inside it is clipped by the frame's overflow, so the frame draws the ring); its name is a text link (site.css).
   Groups in the dialog are rows: the tint and the ink bar (site.css). */
.mi-toolbar .mi-open:focus-visible { outline: 0; color: var(--alda-ink); border-color: var(--alda-ink); box-shadow: inset 0 0 0 .5px var(--alda-ink); }
.mi-active button:not(.mi-active-clear):focus-visible, .mi-dialog-head button:focus-visible, .mi-dialog-foot .mi-clear:focus-visible { outline: 0; border-color: var(--alda-ink); box-shadow: inset 0 0 0 .5px var(--alda-ink); }
.mi-dialog .mi-chip:focus-visible { outline: 2px solid var(--alda-paper); outline-offset: -4px; }
.mi-head .pl-cats a:focus-visible { outline: 0; color: var(--alda-ink); box-shadow: 0 2px var(--alda-ink); }
.pl-minimal .pc-art > a:focus-visible { outline: 0; }
.pl-minimal .pc-art:has(> a:focus-visible) { outline: 2px solid var(--alda-ink); outline-offset: 3px; }
