.feature-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:20px; margin-block:24px }
.account-content { min-width:0 }
.account-content > .panel { margin-block:20px }
.button-row,.filter-row { display:flex; flex-wrap:wrap; align-items:center; gap:12px }
.button-row { margin-block:18px }
.filter-row { margin-block:20px }
.filter-row label { flex:1; min-width:140px }
.filter-row input[type=checkbox] { width:auto }
.feature-cards details { margin-top:20px }
.review-photo { width:160px; height:180px; object-fit:cover; border-radius:12px }
.look-layout { display:grid; grid-template-columns:1.2fr 1fr; gap:32px }
.look-photo { position:relative; align-self:start; overflow:hidden; border-radius:var(--radius) }
.look-photo>img { display:block; width:100%; height:auto }
.look-hotspot { position:absolute; width:44px; height:44px; border:2px solid var(--surface); background:var(--ink); color:var(--bg); display:grid; place-items:center; border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 2px 12px #0004 }
.header-search { position:relative }
.search-suggestions { position:absolute; inset-inline-start:0; top:100%; width:max(100%,300px); max-width:85vw; max-height:65vh; overflow:auto; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:8px; list-style:none; box-shadow:0 12px 30px #0002; z-index:70 }
.search-suggestions a { display:flex; align-items:center; gap:10px; min-height:48px; padding:8px; border-radius:8px }
.search-suggestions img { width:42px; height:50px; object-fit:cover; border-radius:5px }
.search-suggestions [aria-selected=true] a,.search-suggestions a:hover { background:var(--soft) }
.search-suggestions .search-note { padding:8px; color:var(--muted) }
.mobile-menu form { position:relative }
.cookie-choice { position:fixed; z-index:65; inset-inline-end:20px; bottom:90px; max-width:min(420px,calc(100vw - 40px)); box-shadow:0 10px 45px #0003; font-size:14px; padding:22px }
.cookie-choice p { margin-block:10px }
.connection-notice { position:fixed; z-index:100; top:0; inset-inline:0; background:var(--surface); border-bottom:2px solid var(--red); padding:14px 24px; display:flex; flex-wrap:wrap; gap:12px; align-items:center }
[hidden] { display:none!important }
dialog { background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:var(--radius); padding:24px; max-width:calc(100vw - 24px); max-height:90dvh; overflow:auto }
dialog::backdrop { background:#0008 }
.cart-drawer { inset-inline-start:auto; inset-inline-end:0; top:0; margin:0; width:min(470px,100vw); height:100dvh; max-height:100dvh; border-radius:0; padding-bottom:calc(24px + env(safe-area-inset-bottom)) }
.mini-cart-item { display:grid; grid-template-columns:70px minmax(0,1fr); gap:14px; padding-block:20px; border-bottom:1px solid var(--line) }
.mini-cart-item img { border-radius:8px; object-fit:cover }
.mini-cart-item>b { grid-column:2 }
.mini-cart-item input { width:70px; min-height:44px }
.mini-cart-item form { display:flex; align-items:end; flex-wrap:wrap; gap:12px; margin-block:8px }
.mini-cart-item label { display:grid; gap:5px }
.invoice-signatures { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-block:24px; break-inside:avoid }
.invoice-signatures>div { min-height:95px; border:1px solid var(--line); border-radius:8px; padding:14px; color:var(--muted) }
.photo-dialog img { max-height:75dvh; width:100%; object-fit:contain }
.size-dialog { width:min(800px,96vw) }
.size-dialog iframe { border:0; width:100%; height:70dvh }
.restock-picker { margin-block:18px }
.restock-picker summary { cursor:pointer; min-height:44px; padding:10px 0 }
.address-map { height:320px; overflow:hidden; border:1px solid var(--line); position:relative; direction:ltr; background:var(--soft); border-radius:14px; touch-action:none; cursor:crosshair }
.address-map .map-tile { position:absolute; width:256px; height:256px; max-width:none; pointer-events:none }
.map-pin { position:absolute; width:22px; height:22px; border-radius:50% 50% 50% 0; transform:translate(-50%,-100%) rotate(-45deg); background:var(--red); border:3px solid white; pointer-events:none }
.map-attribution { position:absolute; bottom:0; right:0; background:#fffd; color:#111; padding:3px 8px; font:11px sans-serif }
.map-tools { display:flex; gap:8px; margin-block:12px; flex-wrap:wrap }
.order-timeline { border-inline-start:2px solid var(--line); padding-inline-start:20px; display:grid; gap:18px; list-style:none }
.order-timeline time { display:block; font-size:13px; color:var(--muted) }
.checkout-step-controls { display:flex; gap:12px; justify-content:space-between; margin-block:22px }
.checkout-step-summary { padding:18px; border:1px solid var(--line); border-radius:12px; background:var(--soft) }
.policy-sections { display:grid; grid-template-columns:220px minmax(0,1fr); gap:30px }
.policy-sections nav { display:grid; align-content:start; gap:12px; position:sticky; top:100px; align-self:start }
.policy-sections article section { scroll-margin-top:16px }
.invoice-merchant { border:1px solid var(--line); padding:18px; margin-block:20px }
.invoice-signature { display:flex; justify-content:space-between; padding-block:35px; border-top:1px solid var(--line); margin-top:30px }
@media(max-width:760px) { .look-layout,.policy-sections { grid-template-columns:1fr } .policy-sections nav { position:static } .cookie-choice { inset-inline:12px; bottom:80px; max-width:none; padding:16px } .button-row .button { flex:1 } .look-layout { gap:20px } }
@media print { .cookie-choice,.connection-notice,dialog { display:none!important } }
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important } }
.account-avatar img { width:100%; height:100%; border-radius:50%; object-fit:cover }
.look-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:24px; margin-bottom:40px }
.look-grid img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:14px }
.policy-nav { display:flex; flex-wrap:wrap; gap:18px; margin-block:24px }
.policy-nav a,.filter-row a { padding:8px 12px; border-radius:8px; border:1px solid var(--line); min-height:44px }
.filter-row [aria-current=page] { background:var(--ink); color:var(--bg) }
.return-case { border-bottom:1px solid var(--line); padding-block:20px }
.button.secondary { background:transparent; color:var(--ink); border:1px solid var(--line) }
.text-button { border:0; background:transparent; color:var(--accent-dark); padding:10px 0; cursor:pointer; min-height:44px }
.header-search input { min-width:0 }
.filter-sheet { position:fixed; margin:0; inset-inline:0; top:auto; bottom:0; width:100%; max-width:100%; border-radius:22px 22px 0 0; padding:24px; max-height:90dvh }
.filter-sheet .filter-form { max-width:640px; margin-inline:auto }
.filter-sheet-trigger { margin:0; min-height:48px; padding:10px 12px; border-radius:12px; font-size:14px }

.search-suggestions {
  margin-block: 8px 0;
  overscroll-behavior: contain;
}

.mobile-search-bar .search-suggestions {
  width: 100%;
  max-width: 100%;
  max-height: min(55dvh, 420px);
}

.cookie-choice {
  bottom: 24px;
  padding: 20px;
}

.cookie-choice .button-row {
  margin: 16px 0 0;
}

.cookie-choice .button {
  flex: 1;
  padding-inline: 12px;
}

.filter-sheet {
  padding: 0 24px calc(24px + env(safe-area-inset-bottom));
  overscroll-behavior: contain;
}

.filter-sheet-header {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-block: 16px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}

.filter-sheet-header h2 {
  font-size: 20px;
}

.filter-sheet .filter-form {
  display: flex;
  gap: 20px;
}

.filter-sheet .filter-heading b {
  display: none;
}

.filter-sheet .filter-heading {
  justify-content: flex-end;
}

.filter-form legend, .filter-heading {
  font-size: 14px;
}

.filter-sheet .price-inputs {
  flex-direction: row;
}

.filter-sheet .price-inputs > label {
  flex: 1;
}

.filter-sheet .filter-form > .button {
  position: sticky;
  bottom: 0;
  box-shadow: 0 0 0 8px var(--surface);
}

.photo-dialog > .icon-button, .size-dialog > .icon-button {
  position: sticky;
  top: 0;
  z-index: 1;
  margin-bottom: 12px;
  background: var(--surface);
}

@media (max-width: 800px) {
  .cookie-choice {
    inset-inline: 12px;
    bottom: calc(80px + env(safe-area-inset-bottom));
    max-width: none;
    padding: 16px;
    max-height: calc(100dvh - 110px);
    overflow: auto;
  }

  dialog {
    padding: 16px;
  }

  .filter-sheet {
    padding: 0 20px calc(20px + env(safe-area-inset-bottom));
  }

  .button-row .button {
    min-width: 0;
  }
}