.header .brand-group .brand { flex: none; width: 95px; }
.header .brand .user-wordmark { width: 100%; height: auto; max-height: 44px; object-fit: contain; }

.rubro-heading { padding-block: 15px 13px; }
.rubro-heading .breadcrumbs { margin-block-end: 6px; }
.rubro-heading .page-heading-row { align-items: center; gap: 12px; }
.rubro-heading h1 { margin: 0; font-size: clamp(22px, 2vw, 30px); letter-spacing: -.025em; }
.rubro-heading .page-tools { flex: none; }
.rubro-navigation { margin: 24px var(--gutter) 0; display: flex; align-items: center; flex-wrap: wrap; gap: 6px 16px; }
.rubro-navigation a { display: inline-flex; align-items: center; min-height: 40px; color: #c7c7c7; font-size: 13px; }
.rubro-navigation a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.payment-references { margin: 24px var(--gutter) 0; max-width: 680px; }
.payment-references summary { display: list-item; cursor: pointer; width: fit-content; padding-block: 10px; color: #d2d2d2; font-size: 13px; }
.payment-references ul { margin-block: 0; padding-inline-start: 20px; }
.payment-references li { margin-block: 6px; color: #bbb; font-size: 13px; }
.payment-references a { text-decoration: underline; text-underline-offset: 3px; }
.rubro-view-settings { padding-block: 8px; }
.rubro-view-settings summary { width: fit-content; cursor: pointer; min-height: 36px; }
.rubro-view-settings label { display: inline-flex; align-items: center; gap: 9px; margin: 4px 14px 4px 0; }

.sick-suggestions {
  position: fixed;
  inset: auto max(52px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) auto;
  z-index: 40;
  display: flex;
  align-items: stretch;
  width: max-content;
  min-height: 42px;
  border-radius: 14px;
  background: #25d366;
  color: #071b10;
  box-shadow: 0 4px 18px #0007;
}
.sick-suggestions[hidden],
body:has(dialog[open], #keyPhonesToggle[aria-expanded="true"]) .sick-suggestions,
.search-open .sick-suggestions,
body:has(.toast.visible) .sick-suggestions { display: none; }
.sick-suggestions a, .sick-suggestions button { display: inline-flex; align-items: center; justify-content: center; color: inherit; }
.sick-suggestions a { gap: 7px; padding-inline: 11px 9px; font-size: 13px; font-weight: 700; border-radius: 14px 0 0 14px; }
.sick-suggestions img { display: block; flex: none; }
.sick-suggestions button { width: 35px; min-width: 35px; padding: 0; border: 0; border-inline-start: 1px solid #0b44283d; border-radius: 0 14px 14px 0; background: transparent; font-size: 20px; line-height: 1; }
.sick-suggestions a:hover, .sick-suggestions button:hover { background: #ffffff24; }
.sick-suggestions :is(a,button):focus-visible { outline: 2px solid currentColor; outline-offset: -4px; }
.sick-suggestions-inline { position: static; margin-inline-start: auto; }
.footer .sick-suggestions-inline { margin-block: 12px 0; }
@media (max-width: 760px) {
  .header .brand-group .brand { width: 78px; }
  .sick-suggestions { min-height: 44px; }
  .sick-suggestions:not(.sick-suggestions-inline) { inset-inline-end: max(14px, env(safe-area-inset-right)); }
  .sick-suggestions button { width: 44px; min-width: 44px; }
  .rubro-heading { padding-block: 13px 11px; }
}
@media (max-width: 375px) {
  .header .brand-group .brand { width: 71px; }
}

.header .brand-group { gap: 5px; }
.header-explore {
  --enhanced-display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  gap: 6px;
  min-width: 44px;
  min-height: 44px;
  padding-inline: 9px;
  border: 1px solid #414145;
  border-radius: 8px;
  background: #161617;
  color: #f3f3f5;
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}
.header-explore [aria-hidden] { font-size: 18px; line-height: 1; }
.header-explore:hover, .header-explore[aria-expanded="true"] { background: #2a2a2c; }
.header .city-panel { width: 157px; padding: 4px 8px; background: #0b0b0d; color: #f3f3f5; }
.header .city-panel label { gap: 7px; min-height: 32px; font-size: 13px; }
.header .city-panel input { width: 14px; height: 14px; margin: 0; }
.header .city-panel label:has(:disabled) { color: #a9a9b1; }
@media (max-width: 1099px) {
  .header.news-expanded { height: calc(var(--header) + env(safe-area-inset-top, 0px)); grid-template-rows: 1fr; }
  .header.news-expanded #headerNews {
    position: absolute;
    inset: 100% 12px auto;
    width: auto;
    padding: 4px;
    background: #101011;
    border: 1px solid #39393d;
    border-radius: 8px;
  }
}
@media (max-width: 470px) {
  .header-explore-text { display: none; }
  .header .brand-group { gap: 2px; }
}
@media (max-width: 350px) {
  .header,.search-open .header { gap: 4px; padding-inline: max(8px, env(safe-area-inset-left)) max(8px, env(safe-area-inset-right)); }
  .header .brand-group .brand { width: 62px; }
  #cityToggle svg { display: none; }
}

#collectionExplorer {
  position: fixed;
  z-index: 108;
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: 1px solid #424249;
  border-radius: 12px;
  background: #161618;
  color: #f3f3f5;
  box-shadow: 0 12px 32px #0009;
  overflow: hidden;
  --explorer-card: 110px;
}
#collectionExplorer[hidden] { display: none; }
.explorer-titlebar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: none;
  min-height: 48px;
  padding: 0 8px 0 14px;
  background: #212123;
  border-bottom: 1px solid #39393f;
  cursor: move;
  touch-action: none;
  user-select: none;
}
.explorer-titlebar h2 { margin: 0; font-size: 16px; }
.explorer-close,.explorer-resize,.explorer-add,.explorer-arrows button,.explorer-copy {
  color: inherit;
  background: #ffffff0b;
  border: 1px solid #434349;
  border-radius: 6px;
}
.explorer-close { width: 38px; height: 38px; font-size: 21px; cursor: pointer; }
.explorer-resize {
  position: absolute;
  inset: auto 1px 1px auto;
  width: 24px;
  height: 24px;
  border: 0;
  background: repeating-linear-gradient(135deg, transparent 0 3px, #9d9da5 3px 4px, transparent 4px 7px) bottom right / 10px 10px no-repeat;
  cursor: nwse-resize;
  touch-action: none;
}
.explorer-scroll { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 7px 13px 20px; }
.explorer-row { margin-bottom: 8px; }
.explorer-row-heading { display: flex; align-items: center; gap: 7px; margin-bottom: 4px; }
.explorer-row-heading h3 { margin: 0; font-size: 14px; flex: 1; }
.explorer-add { padding: 4px 8px; min-height: 29px; font-size: 11px; white-space: nowrap; }
.explorer-add:disabled { color: #a5dfb6; opacity: 1; }
.explorer-arrows { display: flex; gap: 3px; }
.explorer-arrows button { width: 27px; height: 29px; font-size: 17px; }
.explorer-arrows button:disabled { opacity: .45; }
.explorer-track {
  display: flex;
  gap: 7px;
  padding: 2px 0 4px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: auto;
  scrollbar-width: thin;
  scrollbar-color: #4c4c52 transparent;
}
.explorer-card { position: relative; flex: 0 0 var(--explorer-card); min-width: 0; }
.explorer-source { display: block; aspect-ratio: 16/9; border-radius: 6px; cursor: grab; }
.explorer-source img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: inherit; user-select: none; }
.explorer-source:hover { outline: 1px solid #b6b6bc; outline-offset: -1px; }
.explorer-copy {
  position: absolute;
  bottom: 3px;
  right: 3px;
  width: 25px;
  height: 24px;
  padding: 0;
  background: #151518ee;
  font-size: 15px;
  line-height: 1;
}
.explorer-copy:hover,.explorer-add:hover:not(:disabled),.explorer-close:hover,.explorer-arrows button:hover:not(:disabled) { background: #4a4a51; }
#collectionExplorer :focus-visible { outline: 2px solid #f0a4ae; outline-offset: -2px; }
.catalog-dragging .explorer-source { cursor: grabbing; }
body:has(.catalog-dragging) .personal-shelf .rail { scroll-snap-type: none; }
body:has(.catalog-dragging) .personal-shelf .rail-arrow { pointer-events: none; }
body:has(#collectionExplorer[data-drag-action="copy"]) .personal-shelf .catalog-drop-target * { cursor: copy; }
body:has(#collectionExplorer[data-drag-action="move"]) .personal-shelf .catalog-drop-target * { cursor: move; }
.catalog-drag-ghost {
  position: fixed;
  inset: 0 auto auto 0;
  z-index: 118;
  width: clamp(106px, 9vw, 148px);
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  border: 1px solid #d3f1dc;
  border-radius: 6px;
  pointer-events: none;
  box-shadow: 0 5px 14px #0007;
}
.personal-shelf [data-drop-index].catalog-drop-target .card-visual {
  outline: 2px solid #a3e5b5;
  outline-offset: -2px;
  box-shadow: inset 0 0 0 2px #a3e5b5;
}
.personal-shelf .personal-card.catalog-drop-target::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 4;
  width: 4px;
  border-radius: 2px;
  background: #a3e5b5;
  pointer-events: none;
}
.personal-shelf .personal-card.catalog-drop-after::after { inset: 0 0 0 auto; }
@media (max-width:760px) { #collectionExplorer { --explorer-card: 102px; } }
@media (pointer: coarse) {
  .explorer-close { width: 44px; height: 44px; }
  .explorer-copy, .explorer-copy:hover {
    width: 32px;
    height: 32px;
    color: transparent;
    background: transparent;
    border-color: transparent;
  }
  .explorer-copy::after {
    content: "+";
    position: absolute;
    inset: auto -1px -1px auto;
    display: grid;
    place-items: center;
    width: 21px;
    height: 21px;
    border: 1px solid #434349;
    border-radius: 6px;
    color: #f3f3f5;
    background: #151518ee;
  }
  .explorer-add,.explorer-arrows button { min-height: 36px; }
  .explorer-source { cursor: pointer; }
}