/* market — unified marketplace (2026-11-04).
   PUBLIC: hero type switch, directory bar (search · sort · chips · count · list|map), tiles, empty state, detail gallery.
   MEMBER: step-based listing forms (df-* conventions), dropzone + previews, status pills + timeline, "my listings" rows,
   category switch as a full-screen sheet on mobile. Loaded after pages.css (public) and after shell.css (app).
   Scope `:is(.mn-body,.sawalife-modular):not(#mk)` mirrors dashforms so it wins over legacy Tailwind/forms rules.
   Rollback: empty this file. */

/* ============================================================ PUBLIC ============================================================ */

/* --- hero: the chips row must never run over the hero image (desktop) nor hide chips (mobile) --- */
.mn-ph:has(.mn-mkt-switch) .mn-ph__extra{margin-top:1.25rem;max-width:100%}
.mn-mkt-switch{gap:.5rem;margin-inline:calc(var(--mn-gut)*-1);padding:0 var(--mn-gut) .25rem;scroll-padding-inline:var(--mn-gut);
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 2.5rem),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 2.5rem),transparent)}
.mn-mkt-switch .mn-chip{min-height:2.5rem}
.mn-mkt-switch .mn-chip.is-active{border-color:var(--mn-ink);color:var(--mn-ink);font-weight:600;background:var(--mn-surface)}
@media(min-width:768px){
  .mn-mkt-switch{margin-inline:0;padding:0;-webkit-mask-image:none;mask-image:none}
  /* image keeps to the right 40%, copy + chips to the left 56%: no overlap at any width */
  .mn-ph--img:has(.mn-mkt-switch) .mn-ph__img{width:42%}
  .mn-ph:has(.mn-mkt-switch) .mn-ph__copy{max-width:min(40rem,56%)}
  .mn-ph:has(.mn-mkt-switch) .mn-ph__extra{max-width:100%}
}
@media(min-width:1440px){.mn-ph:has(.mn-mkt-switch) .mn-ph__copy{max-width:min(44rem,56%)}}

/* --- directory bar: .mn-bar is ALSO a 4px progress bar in minimal.css — neutralise it (was the clipped "tab pill") --- */
.mn-bar.mk-bar{height:auto;border-radius:0;background:none;overflow:visible;display:grid;gap:.9rem;padding-bottom:1rem;margin-bottom:1.75rem;border-bottom:1px solid var(--mn-line)}
.mk-search{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"q go" "sort sort";gap:.6rem;align-items:center}
.mk-search__q{position:relative;display:flex;align-items:center;min-width:0;grid-area:q}
.mk-search__q .mn-i{position:absolute;left:.95rem;top:50%;transform:translateY(-50%);width:1.1rem;height:1.1rem;color:var(--mn-mute);pointer-events:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;z-index:1}
.mn-body main .mk-search__q input[type=search]{width:100%;min-height:2.9rem;margin:0;padding:.6rem 1rem .6rem 2.75rem!important;border:1px solid var(--mn-line-2);border-radius:var(--mn-r-pill)!important;background:var(--mn-field);color:var(--mn-ink);font:inherit;font-size:1rem;-webkit-appearance:none;appearance:none}
.mn-body main .mk-search__q input:focus{outline:none;border-color:var(--mn-brand);box-shadow:var(--mn-focus)}
.mk-search__sort{min-width:0;grid-area:sort}
.mn-body main .mk-search__sort select{width:100%;min-height:2.75rem;margin:0;padding:.45rem 2.2rem .45rem .95rem;border:1px solid var(--mn-line);border-radius:var(--mn-r-pill)!important;background-color:transparent;color:var(--mn-ink);font:inherit;font-size:.9rem}
.mk-search__go{grid-area:go;min-height:2.9rem;white-space:nowrap;width:auto!important}
@media(min-width:768px){
  .mk-search{grid-template-columns:minmax(0,1fr) minmax(12rem,15rem) auto;grid-template-areas:"q sort go"}
  .mk-search:not(:has(.mk-search__sort)){grid-template-columns:minmax(0,1fr) auto}
}
.mk-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:.45rem;margin-inline:calc(var(--mn-gut)*-1);padding:0 var(--mn-gut) .15rem;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 2.5rem),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 2.5rem),transparent)}
.mk-chips::-webkit-scrollbar{display:none}
.mk-chips .mn-chip{flex:none;white-space:nowrap;min-height:2.5rem}
.mk-chips .mn-chip.is-active{border-color:var(--mn-ink);color:var(--mn-ink);font-weight:600}
@media(min-width:1024px){.mk-chips{flex-wrap:wrap;overflow:visible;margin-inline:0;padding:0;-webkit-mask-image:none;mask-image:none}}
.mk-bar__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1rem;min-height:2.75rem}
.mk-count{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem 1rem;margin:0;font-size:.9rem;color:var(--mn-mute);font-variant-numeric:tabular-nums}
.mk-count__reset{color:var(--mn-brand-ink);font-weight:600;text-decoration:underline;text-underline-offset:3px;min-height:2.75rem;display:inline-flex;align-items:center}
.mk-bar__tools{display:flex;align-items:center;gap:.75rem;margin-left:auto}
.mk-fs.mn-fs{grid-template-columns:none}
@media(min-width:1024px){.mk-fs.mn-fs{display:block;margin-top:0}.mk-fs .mn-fs__form{display:flex;flex-wrap:wrap;align-items:end;gap:1rem}.mk-fs .mn-field{flex:0 1 16rem;min-width:0}}
.mk-notice{margin:0 0 1.75rem;max-width:52rem}

/* --- tiles: consistent ratio, calm placeholder art when a listing has no photo --- */
.mk-tiles{align-items:stretch}
.mn-tile__img.is-placeholder img{filter:saturate(.85);opacity:.92}
/* empty state: same size everywhere, spans the whole grid */
.mk-tiles>.mn-empty,.mn-empty.mk-empty{grid-column:1/-1;width:100%;max-width:34rem;margin:clamp(1rem,4vw,2.5rem) auto}
.mn-empty.mk-empty .mn-empty__img{max-width:20rem}
.mn-empty.mk-empty .mn-empty__actions{flex-direction:column;align-items:center;gap:.5rem}
.mn-empty.mk-empty .mn-empty__actions .mn-btn--ghost{border-color:transparent;text-decoration:underline;text-underline-offset:3px}
@media(min-width:480px){.mn-empty.mk-empty .mn-empty__actions{flex-direction:row}}

/* --- detail: swipeable gallery with thumbnails --- */
.mk-gal{display:grid;gap:.6rem;background:none!important}
.mk-gal__track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--mn-r-lg);aspect-ratio:3/2;background:var(--mn-soft)}
.mk-gal__track::-webkit-scrollbar{display:none}
.mk-gal__track img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;scroll-snap-align:start}
.mk-gal__thumbs{display:flex;gap:.5rem;overflow-x:auto;scrollbar-width:none;padding:2px}
.mk-gal__thumbs button{flex:none;width:4.5rem;aspect-ratio:4/3;padding:0;border:2px solid transparent;border-radius:var(--mn-r-sm);overflow:hidden;background:var(--mn-soft);cursor:pointer;opacity:.7}
.mk-gal__thumbs button[aria-current=true]{border-color:var(--mn-ink);opacity:1}
.mk-gal__thumbs img{width:100%;height:100%;object-fit:cover;display:block}

/* ============================================================ MEMBER ============================================================ */

/* --- category switch: tabs (desktop) / button + full-screen sheet (mobile) --- */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types{width:100%;max-width:calc(var(--df-max,72rem) + 2*var(--mn-gut));margin-inline:auto;padding:clamp(1rem,3vw,1.75rem) var(--mn-gut) 0}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types__btn{display:flex;align-items:center;gap:.75rem;width:100%;min-height:3.25rem;padding:.5rem 1rem;border:1px solid var(--mn-line-2);border-radius:var(--mn-r);background:var(--mn-surface);color:var(--mn-ink);font:inherit;text-align:left;cursor:pointer}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types__k{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mn-mute)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types__v{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types__chev{flex:none;color:var(--mn-mute);fill:none;stroke:currentColor;stroke-width:2}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types .mn-i{width:1.1rem;height:1.1rem;flex:none}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types__sheet{position:fixed;inset:0;z-index:90;display:flex;flex-direction:column;background:var(--mn-bg);visibility:hidden;opacity:0;transform:translateY(1.5rem);transition:opacity .2s,transform .25s var(--mn-ease),visibility 0s .25s;padding-bottom:env(safe-area-inset-bottom)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types__sheet.is-open{visibility:visible;opacity:1;transform:none;transition:opacity .2s,transform .25s var(--mn-ease)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:3.75rem;padding:.5rem var(--mn-gut);border-bottom:1px solid var(--mn-line);font-size:1.05rem;color:var(--mn-ink)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-types__list{margin:0;padding:.25rem var(--mn-gut) 1.5rem;list-style:none;overflow-y:auto;flex:1}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tab{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:.85rem;min-height:3.5rem;padding:.75rem 0;border-bottom:1px solid var(--mn-line);color:var(--mn-text);text-decoration:none;font-weight:500}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tab small{grid-column:2;font-size:.84rem;font-weight:400;color:var(--mn-mute);line-height:1.45}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tab[aria-current=page]{color:var(--mn-ink);font-weight:600}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tab[aria-current=page] .mn-i{color:var(--mn-brand-ink)}
html.mk-lock{overflow:hidden}
@media(min-width:960px){
  html.mk-lock{overflow:auto}
  :is(.mn-body,.sawalife-modular):not(#mk) .mk-types__btn,:is(.mn-body,.sawalife-modular):not(#mk) .mk-types__head{display:none}
  :is(.mn-body,.sawalife-modular):not(#mk) .mk-types__sheet{position:static;visibility:visible;opacity:1;transform:none;background:none;transition:none;padding:0}
  :is(.mn-body,.sawalife-modular):not(#mk) .mk-types__list{display:flex;flex-wrap:wrap;gap:0 1.5rem;padding:0;border-bottom:1px solid var(--mn-line)}
  :is(.mn-body,.sawalife-modular):not(#mk) .mk-tab{display:inline-flex;gap:.5rem;min-height:3rem;padding:.6rem 0;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;font-size:.92rem}
  :is(.mn-body,.sawalife-modular):not(#mk) .mk-tab small{display:none}
  :is(.mn-body,.sawalife-modular):not(#mk) .mk-tab[aria-current=page]{border-bottom-color:var(--mn-brand)}
  :is(.mn-body,.sawalife-modular):not(#mk) .mk-tab:hover{color:var(--mn-ink)}
}
/* tabs above: the embedded manager keeps a calm top gap */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-hub>.mk-types+.df,:is(.mn-body,.sawalife-modular):not(#mk) .mk-hub>.mk-types+*>.df:first-child{padding-top:clamp(1.5rem,4vw,2.5rem)}

/* --- overview: one hairline row per category --- */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-hub__t{margin:0 0 .75rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick{margin:0;padding:0;list-style:none;border-top:1px solid var(--mn-line)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.4rem 1rem;padding:1.1rem 0;border-bottom:1px solid var(--mn-line);color:inherit;text-decoration:none}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__i{display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;background:var(--mn-brand-l);color:var(--mn-brand-ink)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__i .mn-i{width:1.2rem;height:1.2rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__txt strong{display:block;color:var(--mn-ink);font-weight:600;font-size:1.02rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__txt small{display:block;margin-top:.2rem;color:var(--mn-mute);font-size:.86rem;line-height:1.45}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__s{grid-column:2;font-size:.84rem;font-weight:600;color:var(--mn-brand-ink)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__s.is-soon{color:var(--mn-mute);font-weight:500}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__chev{grid-column:3;grid-row:1/span 2;color:var(--mn-mute);fill:none;stroke:currentColor;stroke-width:2;width:1.1rem;height:1.1rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__a:hover .mk-pick__txt strong{color:var(--mn-brand-ink)}
@media(min-width:720px){:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__s{grid-column:3;grid-row:1}:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__a{grid-template-columns:auto minmax(0,1fr) auto auto}:is(.mn-body,.sawalife-modular):not(#mk) .mk-pick__chev{grid-column:4;grid-row:1}}

/* --- form frame --- */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-manager .df-head{margin-bottom:1.25rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-legal{margin:0 0 1.25rem;display:grid;gap:.35rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-legal__more{display:block}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-legal__link{color:var(--mn-brand-ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-legal__cta{justify-self:start;margin-top:.4rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-form{margin-top:clamp(1.25rem,3vw,2rem)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-legend{margin:0 0 .25rem;font-size:1.05rem;font-weight:600;color:var(--mn-ink)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-legend span{font-size:.85rem;font-weight:400;color:var(--mn-mute)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-form>.mk-legend+.df-sec{border-top:1px solid var(--mn-line);margin-top:1rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-step .df-sec__k{display:flex;gap:.6rem;align-items:center}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-opt{padding:.05rem .5rem;border:1px solid var(--mn-line-2);border-radius:var(--mn-r-pill);font-size:.66rem;letter-spacing:.06em;color:var(--mn-mute)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-req{color:var(--mn-red);font-weight:600}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-field.is-invalid :is(input,select,textarea),:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop.is-invalid .mk-drop__zone{border-color:var(--mn-red)!important}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-manager .df-grid>.df-field:not(.df-field--full):only-child{grid-column:1/-1}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-manager textarea.sawalife-input{min-height:8rem;resize:vertical}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-manager select.sawalife-input:disabled{opacity:.55}
/* tailwind col-span helpers left by legacy components inside our grids */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-manager .df-grid>[class*="sm:col-span-2"]{grid-column:1/-1}

/* map picker */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-map__box{border-radius:var(--mn-r);overflow:hidden;border:1px solid var(--mn-line)}

/* checkbox rows + chips */
:is(.mn-body,.sawalife-modular):not(#mk) label.mk-check{display:flex;align-items:flex-start;gap:.7rem;min-height:2.75rem;margin:0;padding:.55rem 0;font-size:.93rem;font-weight:500;line-height:1.5;color:var(--mn-ink);cursor:pointer}
:is(.mn-body,.sawalife-modular):not(#mk) label.mk-check input{flex:none;width:1.15rem;height:1.15rem;margin:.18rem 0 0;accent-color:var(--mn-brand)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-checks{display:flex;flex-wrap:wrap;gap:.5rem}
:is(.mn-body,.sawalife-modular):not(#mk) label.mk-check--chip{align-items:center;min-height:2.6rem;padding:.35rem .95rem;border:1px solid var(--mn-line-2);border-radius:var(--mn-r-pill);font-size:.88rem}
:is(.mn-body,.sawalife-modular):not(#mk) label.mk-check--chip input{margin:0}
:is(.mn-body,.sawalife-modular):not(#mk) label.mk-check--chip:has(input:checked){border-color:var(--mn-brand-d);background:color-mix(in srgb,var(--mn-brand) 7%,transparent);color:var(--mn-ink);font-weight:600}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-policy{display:grid;gap:.75rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-policy .df-note{margin:0;display:grid;gap:.3rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-policy.is-invalid label.mk-check{color:var(--mn-red)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-affix{position:relative}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-affix input{padding-right:3.5rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-affix span{position:absolute;right:1rem;top:50%;transform:translateY(-50%);font-size:.8rem;font-weight:600;color:var(--mn-mute)}

/* --- dropzone + previews --- */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop__zone{position:relative;display:grid;justify-items:center;gap:.3rem;padding:1.6rem 1rem;border:1.5px dashed var(--mn-line-2);border-radius:var(--mn-r-lg);background:color-mix(in srgb,var(--mn-soft) 55%,transparent);text-align:center;color:var(--mn-text);cursor:pointer;transition:border-color .15s,background .15s}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop__zone:hover,:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop__zone.is-over{border-color:var(--mn-brand);background:color-mix(in srgb,var(--mn-brand) 6%,transparent)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop__zone:focus-within{border-color:var(--mn-brand);box-shadow:var(--mn-focus)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop__zone strong{font-size:.98rem;color:var(--mn-ink)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop__zone span{font-size:.84rem;color:var(--mn-mute);max-width:26rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop__i{width:1.75rem;height:1.75rem;color:var(--mn-brand-ink);fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop__input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop__count{margin:.85rem 0 .4rem;font-size:.84rem;font-weight:600;color:var(--mn-ink)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.5rem,1fr));gap:.5rem;margin:0;padding:0;list-style:none}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-thumbs li{position:relative;aspect-ratio:4/3;border-radius:var(--mn-r-sm);overflow:hidden;background:var(--mn-soft);box-shadow:0 0 0 1px var(--mn-line)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-thumbs__ph{display:block;width:100%;height:100%}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-thumbs__tag{position:absolute;left:.3rem;bottom:.3rem;padding:.05rem .45rem;border-radius:var(--mn-r-pill);background:var(--mn-ink);color:var(--mn-bg);font-size:.66rem;font-weight:600}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-thumbs.is-busy{opacity:.5}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop--sm .mk-drop__zone{padding:1rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-drop--half{grid-column:auto!important}

/* --- sticky action bar: leave room for the bottom app nav + payment-gating notes --- */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-actions{gap:.6rem 1rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-actions .mn-btn--primary{min-width:12rem}
@media(max-width:767px){:is(.mn-body,.sawalife-modular):not(#mk) .mk-actions .mn-btn--primary{min-width:0}}

/* repeatable groups (stops, menu items) */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-repeat{margin:0 0 1rem;padding:0;list-style:none;display:grid;gap:1.25rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-repeat__item{padding:1rem 0 0 1rem;border-left:2px solid var(--mn-line-2)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-repeat__h{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.75rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-repeat__h h3{margin:0;font-size:.98rem;font-weight:600;color:var(--mn-ink)}

/* opening hours */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-hours{margin:0;padding:0;list-style:none;border-top:1px solid var(--mn-line)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-hours li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.25rem 1rem;padding:.35rem 0;border-bottom:1px solid var(--mn-line)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-hours__t{display:flex;align-items:center;gap:.5rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-hours__t input{width:7.5rem;min-height:2.6rem;text-align:center}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-hours .df-err{flex-basis:100%}


/* --- my listings --- */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-list .df-block__h{align-items:flex-end}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-list__n{margin-left:.6rem;font-size:.9rem;font-weight:500;color:var(--mn-mute);font-variant-numeric:tabular-nums;letter-spacing:0}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-list__acts{display:flex;flex-wrap:wrap;gap:.5rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-list__acts .mn-i{width:1rem;height:1rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-filter{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:.45rem;margin:0 0 1rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-filter .mn-chip{flex:none;cursor:pointer;font:inherit;font-size:.88rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-filter .mn-chip.is-active{border-color:var(--mn-ink);color:var(--mn-ink);font-weight:600}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-filter__n{color:var(--mn-mute);font-weight:500;font-variant-numeric:tabular-nums}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-items{margin:0;padding:0;list-style:none;border-top:1px solid var(--mn-line)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-items--single{margin-bottom:1.5rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item{display:grid;grid-template-columns:5rem minmax(0,1fr);gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--mn-line)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item.is-selected{background:color-mix(in srgb,var(--mn-brand) 5%,transparent);box-shadow:-.75rem 0 0 color-mix(in srgb,var(--mn-brand) 5%,transparent)}
@media(min-width:640px){:is(.mn-body,.sawalife-modular):not(#mk) .mk-item{grid-template-columns:8rem minmax(0,1fr);gap:1.25rem}}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__img{aspect-ratio:4/3;border-radius:var(--mn-r-sm);overflow:hidden;background:var(--mn-soft)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__img img{width:100%;height:100%;object-fit:cover;display:block}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__ph{display:grid;place-items:center;width:100%;height:100%;color:var(--mn-line-2)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__ph svg{width:1.6rem;height:1.6rem;fill:none;stroke:currentColor;stroke-width:1.6}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__main{min-width:0;display:grid;gap:.35rem;align-content:start}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.35rem .75rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__price{font-weight:600;color:var(--mn-ink);font-variant-numeric:tabular-nums;font-size:.92rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__t{margin:0;font-size:1.02rem;font-weight:600;line-height:1.35;color:var(--mn-ink);overflow-wrap:anywhere}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__m{margin:0;font-size:.86rem;color:var(--mn-mute);line-height:1.45}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__note{margin:.35rem 0 0;display:grid;gap:.2rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__help{color:var(--mn-mute);font-size:.84rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__acts{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.4rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__acts .mn-btn{min-height:2.5rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__flag{margin:0;display:inline-flex;align-items:center;gap:.3rem;font-size:.8rem;font-weight:600;color:var(--mn-gold)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__flag .mn-i{width:.9rem;height:.9rem}
/* promotion campaign blocks inside a row stay as they are, just aligned to the row */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__main>div.mt-4{margin-top:.5rem!important}

/* status timeline: draft → in review → published */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl{display:flex;gap:0;margin:.35rem 0 0;padding:0;list-style:none;max-width:26rem;font-size:.74rem;color:var(--mn-mute)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li{position:relative;flex:1;padding-top:.9rem;min-width:0}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:.4rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li::before{content:"";position:absolute;top:.25rem;left:0;width:.55rem;height:.55rem;border-radius:50%;background:var(--mn-bg);box-shadow:inset 0 0 0 1.5px var(--mn-line-2);z-index:1}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li::after{content:"";position:absolute;top:.48rem;left:.55rem;right:0;height:1.5px;background:var(--mn-line)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li:last-child::after{display:none}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li.is-done{color:var(--mn-text)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li.is-done::before{background:var(--mn-ok);box-shadow:none}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li.is-done::after{background:var(--mn-ok)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li.is-now{color:var(--mn-ink);font-weight:600}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl li.is-now::before{background:var(--mn-gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--mn-gold) 20%,transparent)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl.is-rejected li:not(.is-end)::before,:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl.is-rejected li:not(.is-end)::after,
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl.is-closed li:not(.is-end)::before,:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl.is-closed li:not(.is-end)::after{background:var(--mn-line-2);box-shadow:none}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl.is-rejected li.is-end{color:var(--mn-red);font-weight:600}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl.is-rejected li.is-end::before{background:var(--mn-red);box-shadow:none}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl.is-closed li.is-end{color:var(--mn-text);font-weight:600}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-tl.is-closed li.is-end::before{background:var(--mn-mute);box-shadow:none}

/* empty list: image + next step */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-none{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem 1.5rem;align-items:center;padding:1.25rem 0;border-top:1px solid var(--mn-line)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-none img{width:100%;max-width:14rem;aspect-ratio:4/3;object-fit:cover;border-radius:var(--mn-r-lg)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-none h3{margin:0;font-size:1.1rem;font-weight:600;color:var(--mn-ink)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-none p{margin:.4rem 0 .9rem;color:var(--mn-mute);font-size:.92rem;line-height:1.55;max-width:32rem}
@media(min-width:640px){:is(.mn-body,.sawalife-modular):not(#mk) .mk-none{grid-template-columns:14rem minmax(0,1fr)}}

/* crafts: rules row + toast */
:is(.mn-body,.sawalife-modular):not(#mk) .mk-rules{margin:0 0 1rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-rules .df-sec__t{margin-bottom:1rem}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-rule{border-top-width:2px}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-rule--warn{border-top-color:var(--mn-gold)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-rule--red{border-top-color:var(--mn-red)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-rule--ok{border-top-color:var(--mn-ok)}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-toast{justify-content:space-between;align-items:center}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-toast.is-warn{border-left-color:var(--mn-gold)}

/* --- product sheet (dialog): full screen on mobile, centred card on desktop --- */
dialog.mk-sheet{margin:0;padding:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border:0;border-radius:0;background:var(--mn-bg);color:var(--mn-text);font-family:var(--mn-font)}
dialog.mk-sheet::backdrop{background:rgb(var(--mn-scrim-rgb)/55%)}
.mk-sheet__in{display:flex;flex-direction:column;height:100%;min-height:0}
.mk-sheet__head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem var(--mn-gut);border-bottom:1px solid var(--mn-line)}
.mk-sheet__head .df-sec__t{margin:0}
/* body = flex column: on mobile it fills the screen and the foot is pushed to the bottom (margin-top:auto) even when
   the form is short, and stays sticky when it scrolls — never a footer floating mid-panel over dead space */
.mk-sheet__body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:1.25rem var(--mn-gut) 0;display:flex;flex-direction:column;gap:1.25rem}
.mk-sheet__body>*{flex:none;min-width:0}
dialog.mk-sheet:not(#_m) .mk-sheet__foot.df-actions{margin-top:auto}/* outranks dashforms' .df-actions margin-top (ID-weighted) */
.mk-sheet__foot.df-actions{position:sticky;bottom:0;margin:auto calc(var(--mn-gut)*-1) 0;padding:.75rem var(--mn-gut) calc(.75rem + env(safe-area-inset-bottom));background:var(--mn-bg);border-top:1px solid var(--mn-line)}
@media(min-width:768px){
  /* height:fit-content, NOT auto: a top-layer dialog is position:fixed with top:0+bottom:0, so height:auto stretches it
     to the full viewport (dead area under the foot). fit-content = the UA default that keeps it content-sized. */
  dialog.mk-sheet{margin:auto;width:min(46rem,calc(100vw - 3rem));height:fit-content;max-height:calc(100dvh - 3rem);border-radius:var(--mn-r-xl);box-shadow:var(--mn-sh-lg)}
  .mk-sheet__in{height:auto;max-height:calc(100dvh - 3rem)}
  .mk-sheet__body{flex:0 1 auto}
}

/* --- landing index: label + description get the full width, count sits under them on small screens --- */
.mn-links a:has(.mn-mkt-count){display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:.75rem;row-gap:.3rem}
.mn-links a:has(.mn-mkt-count)>span:first-child{grid-column:1}
.mn-links a:has(.mn-mkt-count) .mn-mkt-count{grid-column:1;grid-row:2;font-weight:600;color:var(--mn-brand-ink)}
.mn-links a:has(.mn-mkt-count) .mn-chev{grid-column:2;grid-row:1/span 2;align-self:center}

/* --- detail: notes stack (title above text) and the sticky contact bar never truncates the price --- */
.mn-dt .mn-note{display:block}
.mn-dt .mn-note>strong{display:block;margin-bottom:.2rem}
@media(max-width:1023.98px){
  .mn-dt .mn-sticky__t{flex:1 1 auto}
  .mn-dt .mn-sticky__t strong{white-space:nowrap;overflow:visible}
  .mn-dt .mn-sticky .mn-btn{flex:0 1 auto;width:auto;min-width:0;padding-inline:1.1rem;white-space:nowrap}
}

/* sticky action bar sits ABOVE the app tab bar (dashforms' bottom:0 outranks shell.css' offset) */
@media(max-width:767px){
  :is(.mn-body,.sawalife-modular):has(.ap-tabbar):not(#mk) .mk-actions.df-actions--sticky{bottom:calc(4.1rem + env(safe-area-inset-bottom));padding-bottom:.75rem;border-top:1px solid var(--mn-line);z-index:40}
}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__acts .mn-btn{width:auto!important;flex:0 0 auto}
:is(.mn-body,.sawalife-modular):not(#mk) .mk-item__acts .mn-btn--text{padding-inline:.25rem}
@media(max-width:767px){:is(.mn-body,.sawalife-modular):not(#mk) .mk-filter{margin-inline:calc(var(--mn-gut)*-1);padding-inline:var(--mn-gut);-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 2rem),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 2rem),transparent)}}
.mk-sheet__foot.df-actions{flex-wrap:nowrap}
.mk-sheet__foot .mn-btn{width:auto!important}
.mk-sheet__foot .mn-btn--primary{flex:1 1 auto}
@media(min-width:768px){.mk-sheet__foot .mn-btn--primary{flex:0 0 auto}}

/* directory bar: never wider than its container (chip row bleeds via negative margins) */
.mn-bar.mk-bar{grid-template-columns:minmax(0,1fr)}
.mk-bar>*{min-width:0}
.mk-bar__tools{flex-wrap:wrap;justify-content:flex-end;row-gap:.25rem}
.mk-notice.mn-note{display:block}
.mk-notice.mn-note>strong{display:block;margin-bottom:.2rem}
.mk-bar__tools .mn-btn{width:auto!important}
