
.shop-page {max-width:1040px;margin:44px auto;padding:0 28px 64px;}
.shop-page * {box-sizing:border-box;}
.shop-page [hidden] {display:none !important;}
.shop-heading {display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:30px;}
.shop-heading h1 {font-size:38px;font-weight:650;letter-spacing:-1.2px;margin:0;}
.shop-page p {color:#a9b7ca;line-height:1.6;}
.shop-page .shop-collection-heading p,.shop-page p.shop-fine-print,p.shop-layout-fine-print {color:var(--shop-note, #a9b7ca);}
.shop-page h2 {font-size:24px;font-weight:600;letter-spacing:-.5px;margin:0 0 8px;}
.shop-wallet {display:flex;align-items:center;gap:10px;color:var(--wallet-ink, #f0f5ff);text-decoration:none;padding:10px 14px;border:1px solid var(--card-edge, #314156);border-radius:var(--radius-md);background:var(--card-bg, transparent);}
.shop-wallet strong {color:var(--wallet-strong, currentColor);font-size:20px;font-weight:650;font-variant-numeric:tabular-nums;}
.shop-wallet span:not(.connectly-coin) {font-size:12px;color:var(--wallet-note, #a9b7ca);}
.shop-tabs {display:flex;gap:26px;border-bottom:1px solid #2d3b4e;margin:0 0 32px;}
.shop-tabs button {position:relative;padding:14px 2px;border:0;border-radius:0;background:var(--tab-bg, none);color:var(--tab-ink, #94a6be);font-size:14px;font-weight:550;cursor:pointer;white-space:nowrap;}
.shop-tabs button[aria-pressed="true"] {color:var(--tab-active-ink, #f3f7ff);background:var(--tab-active-bg, none);}
.shop-tabs button[aria-pressed="true"]::after {content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#82adf2;}
.shop-tabs button:hover {color:var(--tab-hover-ink, #dceaff);}
.shop-tabs button[aria-pressed="true"]:hover {color:var(--tab-active-ink, #dceaff);}
.shop-page :focus-visible {outline:2px solid var(--focus-ring);outline-offset:4px;}
#shop-message:empty,#filter-purchase-message:empty,#shop-payment-status:empty,#shop-preview-message:empty {display:none;}
.shop-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0;}
.shop-card {position:relative;display:flex;flex-direction:column;align-items:stretch;min-width:0;padding:18px;border:1px solid var(--card-edge, #2d3e55);border-radius:var(--radius-lg);background:var(--card-bg, #172231);}
.shop-card h3 {font-size:18px;font-weight:600;letter-spacing:-.3px;margin:16px 0 6px;}
.shop-card p {font-size:13px;margin:4px 0 16px;}
.shop-card button,.shop-page .primary,.shop-reset {display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border:1px solid #43618a;border-radius:var(--radius-md);background:#253d5e;color:#f0f5ff;font-size:14px;font-weight:550;text-decoration:none;cursor:pointer;}
.shop-card button {width:100%;margin-top:auto;}
.shop-card > button {border-color:var(--button-edge, #43618a);background:var(--button-bg, #253d5e);color:var(--button-ink, #f0f5ff);}
.shop-card button:hover:not(:disabled),.shop-page .primary:hover {background:#315381;border-color:#789dce;}
.shop-card button:disabled {opacity:.45;cursor:default;}
.coin-pack-card {padding:26px;}
.coin-pack-card > .connectly-coin {--coin-size:56px;margin-bottom:14px;}
.coin-pack-card h3 {font-size:31px;letter-spacing:-1px;margin:8px 0;}
.coin-pack-card p {margin-bottom:26px;color:var(--card-title-ink, #98abc4);}
.coin-pack-card button {background:var(--button-bg, #e3edfc);color:var(--button-ink, #152944);border-color:var(--button-edge, #e3edfc);font-size:17px;font-weight:650;}
.coin-pack-card button:hover:not(:disabled) {background:#c5dafb;border-color:#c5dafb;}
/* Checkout off: show the price as a calm outline instead of a broken-looking grey slab. */
.coin-pack-card button:disabled {opacity:1;background:transparent;border:1px dashed var(--field-line);color:var(--text-faint);}
.coin-pack-card.best-value {border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);}
.coin-pack-saving {position:absolute;top:-11px;right:18px;padding:4px 10px;border-radius:999px;background:var(--selected-bg);border:1px solid var(--control-hover-edge);color:var(--selected-ink);font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;}
.best-value .coin-pack-saving {background:var(--accent);border-color:var(--accent);color:var(--on-accent);}
#shop-payment-status:not(:empty) {display:flex;gap:10px;align-items:center;margin:18px 0 6px;padding:12px 16px;border:1px solid var(--field-line);border-radius:var(--radius-md);background:var(--surface-2);color:var(--text-soft);font-size:14px;}
.shop-quest-link {display:flex;align-items:center;gap:12px;color:var(--quest-ink, #c1d5f3);font-size:14px;text-decoration:none;padding:18px 0;}
.shop-quest-link i {font-size:21px;}
.shop-quest-link > span:last-child {margin-left:auto;font-size:20px;}
.shop-quest-link:hover {color:white;}
.shop-fine-print {font-size:12px;margin:0 0 28px;}
.shop-history {border-top:1px solid #2d3b4e;margin-top:28px;padding-top:18px;}
.shop-history summary {color:var(--history-ink, #a9bbd2);cursor:pointer;font-size:14px;padding:4px 0;}
.shop-ledger {list-style:none;padding:0;margin:14px 0;background:var(--card-bg, none);}
.shop-ledger li {display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid #27374b;font-size:13px;}
.shop-ledger small {display:block;color:var(--ledger-note, #8a9db6);margin-top:5px;font-size:12px;}
.shop-ledger strong {white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600;}
.shop-section-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;}
.shop-section-heading p {margin:0;font-size:14px;}
.shop-credit-status {flex-shrink:0;text-align:right;color:#d5e5fb;}
.shop-credit-status strong {font-size:14px;font-weight:550;}
.shop-credit-status small {display:block;font-size:12px;color:#94a8c4;margin-top:4px;}
.filter-pack-card {padding:24px 20px;}
.filter-pack-card h3 {font-size:25px;letter-spacing:-.8px;margin:4px 0 14px;}
.shop-saving {align-self:flex-start;color:#9bd3c0;background:#214039;border-radius:var(--radius-xs);font-size:12px;padding:4px 7px;margin-bottom:16px;}
:is(#shop-filter-packs,#filter-custom-offer) .actions {display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto;padding-top:16px;}
:is(#shop-filter-packs,#filter-custom-offer) button {padding:12px 6px;font-size:13px;gap:5px;}
:is(#shop-filter-packs,#filter-custom-offer) .connectly-coin {--coin-size:20px;}
:is(#shop-filter-packs,#filter-custom-offer) button:last-child {background:transparent;border-color:#496180;}
#shop-filter-packs a {font-size:12px;color:#a6c5f5;margin-top:14px;}
.shop-filter-foot {display:flex;align-items:center;justify-content:space-between;gap:20px;}
.shop-filter-foot p {font-size:12px;max-width:480px;margin:0;}
.shop-filter-foot a {color:#bed6fb;text-decoration:none;font-size:13px;white-space:nowrap;}
.shop-category-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:30px;}
.shop-category-heading:first-child {margin-top:0;}
.shop-category-heading h2 {font-size:20px;margin:0;}
.shop-reset {padding:7px 12px;font-size:12px;background:var(--button-bg, none);border-color:var(--button-edge, #43618a);color:var(--button-ink, #f0f5ff);}
.shop-preview {position:relative;display:grid;place-items:center;min-height:160px;padding:20px;border-radius:var(--radius-md);background:#101a28;overflow:hidden;}
.shop-demo-profile {display:grid;gap:12px;place-items:center;width:100%;padding:10px;border-radius:var(--radius-md);}
.shop-demo-avatar {display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#355a85;color:white;}
.shop-demo-chat {padding:8px 15px;border-radius:var(--radius-md);background:#354c6d;font-size:12px;}
.shop-waiting-preview .shop-demo-profile {visibility:hidden;}
#shop-preview-dialog,#filter-purchase-dialog {box-sizing:border-box;width:min(440px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto;background:#172436;color:#eef4ff;border:1px solid #435b7e;border-radius:var(--radius-lg);padding:26px;}
#shop-preview-dialog::backdrop,#filter-purchase-dialog::backdrop {background:#050c17ba;backdrop-filter:blur(3px);}
#shop-preview-dialog header {display:flex;align-items:center;justify-content:space-between;gap:12px;}
#shop-preview-close {background:none;border:0;color:inherit;font-size:28px;cursor:pointer;}
#shop-preview-buy {width:100%;}
#filter-purchase-dialog .actions {display:flex;gap:10px;flex-wrap:wrap;}
#filter-purchase-cancel {border:1px solid #435b7e;border-radius:var(--radius-md);background:none;color:#d6e3f6;padding:10px 16px;cursor:pointer;}
@media(max-width:700px) {
 .shop-page {margin:26px auto;padding:0 20px 48px;}
 .shop-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
 #shop-packs,#shop-filter-packs {grid-template-columns:1fr;}
 .coin-pack-card {display:grid;grid-template-columns:54px minmax(0,1fr) 104px;gap:4px 16px;padding:20px;align-items:center;}
 .coin-pack-card > .connectly-coin {--coin-size:50px;grid-column:1;grid-row:1/3;margin:0;}
 .coin-pack-card h3 {grid-column:2;font-size:24px;margin:0;}
 .coin-pack-card p {grid-column:2;font-size:12px;margin:0;}
 .coin-pack-card button {grid-column:3;grid-row:1/3;font-size:15px;padding:12px 8px;margin:0;}
 .filter-pack-card {padding:20px;}
 .filter-pack-card h3 {margin-top:0;}
 .shop-filter-foot {align-items:flex-start;flex-direction:column;gap:14px;}
}
@media(max-width:520px) {
 .shop-heading {gap:12px;margin-bottom:22px;}
 .shop-heading h1 {font-size:31px;}
 .shop-wallet {padding:8px 10px;gap:7px;}
 .shop-wallet .connectly-coin {--coin-size:24px;}
 .shop-wallet strong {font-size:17px;}
 .shop-wallet span:not(.connectly-coin) {font-size:12px;}
 /* One swipeable row of pills: five tabs in a 2-column grid left an orphan. */
 .shop-page .shop-tabs {display:flex;gap:6px;border:0;margin:0 -20px 26px;padding:0 20px 4px;overflow-x:auto;scrollbar-width:none;}
 .shop-page .shop-tabs::-webkit-scrollbar {display:none;}
 .shop-tabs button {flex:0 0 auto;padding:10px 14px;border:1px solid var(--line);border-radius:999px;font-size:13px;text-align:center;line-height:1.3;min-height:42px;}
 .shop-tabs button[aria-pressed="true"] {border-color:var(--control-hover-edge);}
 .shop-tabs button[aria-pressed="true"] {background:var(--tab-active-bg, #263c59);}
 .shop-tabs button[aria-pressed="true"]::after {display:none;}
 .shop-section-heading {align-items:flex-start;flex-direction:column;gap:12px;}
 .shop-credit-status {text-align:left;}
 .shop-preview {padding:10px;min-height:140px;}
}
@media(max-width:380px) {
 .shop-page {padding-left:16px;padding-right:16px;}
 .coin-pack-card {grid-template-columns:40px minmax(0,1fr) 84px;gap:4px 9px;padding:16px;}
 .coin-pack-card > .connectly-coin {--coin-size:38px;}
 .coin-pack-card h3 {font-size:20px;}
 .coin-pack-card p {font-size:12px;}
 .coin-pack-card button {font-size:13px;}
 .shop-grid {grid-template-columns:1fr;}
}
.coin-filter-control {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
}
.coin-filter-control select {
  max-width: 150px;
  padding: 9px;
  background: var(--control-bg);
  color: var(--text);
  border: 1px solid var(--control-edge);
  border-radius: var(--radius-sm);
}
.coin-filter-control a {
  color: #bfdaff;
  white-space: nowrap;
}
/* Fit the filter into the existing call dock without shrinking its controls. */
.camera-app .coin-filter-control {
  min-width: 0;
  flex-wrap: nowrap;
  gap: 5px;
}
.camera-app .coin-filter-control label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
/* The balance is a chip (icon, count, divider, plus) instead of a bare link. */
/* Gender filter: a segmented switch instead of the operating-system menu
   (which rendered light and square inside the dark dock). Unselected options
   show only their symbol, the selected one also shows its label, so the row
   fits the 220px desktop column and phones without clipping. The hidden
   <select id="gender-filter"> stays the source of truth for app.js. */
.coin-filter-control select[hidden] {
  display: none;
}
.camera-app .gender-segments {
  flex: 1;
  min-width: 0;
  display: flex;
  height: 30px;
  padding: 2px;
  gap: 2px;
  border: 1px solid var(--control-edge);
  border-radius: var(--radius-sm);
  background: var(--control-bg);
}
.camera-app .gender-segments button {
  flex: 0 0 auto;
  min-width: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 7px;
  border: 0;
  border-radius: var(--radius-xs);
  background: transparent;
  color: var(--segment-ink, #aebdd0);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.camera-app .gender-segments button i {
  font-size: 16px;
}
.camera-app .gender-segments button span {
  display: none;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.camera-app .gender-segments button[aria-checked="true"] {
  flex: 1 1 auto;
  min-width: 0;
  background: var(--accent);
  color: var(--on-accent);
}
.camera-app .gender-segments button[aria-checked="true"] span {
  display: inline;
}
.camera-app .gender-segments button:hover:not(:disabled):not([aria-checked="true"]) {
  background: var(--control-hover);
  color: var(--text);
}
.camera-app .gender-segments button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 1px;
}
.camera-app .gender-segments button:disabled {
  cursor: not-allowed;
}
.camera-app .gender-segments:has(button:disabled) {
  opacity: .62;
}
.camera-app .coin-filter-control a {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 30px;
  padding: 0 9px;
  border: 1px solid var(--control-edge);
  border-radius: var(--radius-sm);
  background: var(--control-bg);
  color: var(--control-ink);
  box-shadow: var(--control-shadow);
  font-size: 12.5px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-decoration: none;
}
.camera-app .coin-filter-control a:hover {
  border-color: var(--control-hover-edge);
  background: var(--control-hover);
}
.camera-app .coin-filter-control a:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.camera-app .coin-filter-control a i {
  color: var(--control-icon);
  font-size: 15px;
}
.camera-app .coin-filter-plus {
  padding-left: 7px;
  border-left: 1px solid #3a4d68;
  color: var(--control-icon);
  font-size: 15px;
  line-height: 1;
}
.camera-app .match-status {
  display: none;
}
@media (min-width: 851px) {
  .camera-app .country-trigger {
    height: 30px;
  }
  .camera-app .match-strip {
    gap: 5px;
  }
  /* Same width as the filter row below at every desktop size. */
  .camera-app .target-country-control {
    width: 100%;
  }
}
@media (max-width: 850px) {
  /* Phones use 44px touch targets, so
     the filter column gets more room and the chip drops its icon and divider;
     otherwise the selected label is clipped. */
  .camera-app .match-strip {
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: 8px;
  }
  .camera-app .gender-segments,
  .camera-app .coin-filter-control a {
    height: 44px;
    border-radius: var(--radius-md);
  }
  .camera-app .gender-segments {
    padding: 3px;
  }
  /* The global 44px touch minimum would push the pills out of the frame;
     the whole 44px group is the touch target. */
  .camera-app .gender-segments button {
    min-width: 38px;
    min-height: 0;
    border-radius: var(--radius-sm);
  }
  .camera-app .coin-filter-control a {
    gap: 5px;
    padding: 0 9px;
  }
  .camera-app .coin-filter-control a i {
    display: none;
  }
  .camera-app .coin-filter-plus {
    padding-left: 0;
    border-left: 0;
  }
}
/* Smallest phones: the country arrow and segment padding give way. */
@media (max-width: 340px) {
  .camera-app .match-strip {
    grid-template-columns: minmax(0, .7fr) minmax(0, 1fr);
  }
  .camera-app .country-caret {
    display: none;
  }
  .camera-app .gender-segments button {
    min-width: 32px;
    padding: 0 5px;
  }
  /* Symbol only; the title keeps the translated name. */
  .camera-app .gender-segments button[aria-checked="true"] span {
    display: none;
  }
  .camera-app .coin-filter-control a {
    padding: 0 6px;
  }
}

#coin-packs {scroll-margin-top:280px;}

.filter-custom {display:grid;grid-template-columns:1fr minmax(240px,1fr);align-items:center;gap:16px 24px;margin-bottom:24px;}
.filter-custom label {display:block;font-size:18px;font-weight:600;}
.filter-custom p {margin:6px 0 12px;}
.filter-quantity-control {display:flex;gap:8px;align-items:center;}
.filter-quantity-control button {flex:0 0 40px;width:40px;height:40px;padding:0;font-size:21px;margin:0;}
.filter-quantity-control input {width:110px;min-width:0;height:40px;border:1px solid var(--field-line);border-radius:var(--radius-sm);background:#111c2b;color:#eff5ff;text-align:center;font:inherit;font-variant-numeric:tabular-nums;appearance:textfield;}
.filter-quantity-control input::-webkit-inner-spin-button,.filter-quantity-control input::-webkit-outer-spin-button {appearance:none;margin:0;}
#filter-custom-offer .actions {padding-top:0;}
#filter-custom-offer button {white-space:normal;overflow-wrap:anywhere;}
#filter-custom-error {grid-column:1/-1;color:#ffc0b9;margin:0;}
#filter-custom-error:empty {display:none;}
@media(max-width:700px) {.filter-custom {grid-template-columns:1fr;}}

.shop-design-categories {display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px;}
.shop-design-categories button {border:1px solid #354760;border-radius:var(--radius-lg);padding:9px 14px;background:#162130;color:var(--chip-ink, #b4c4d9);cursor:pointer;font-size:12px;line-height:1.4;}
.shop-design-categories button[aria-pressed="true"] {background:#d9e5fa;border-color:#d9e5fa;color:#16233a;}
.shop-design-card {padding:10px 10px 16px;overflow:hidden;}
.shop-design-card .shop-preview {min-height:195px;}
.shop-design-card .shop-waiting-preview {min-height:210px;}
.shop-design-card h3,.shop-design-card > p {margin-left:8px;margin-right:8px;}
.shop-design-card > button {width:calc(100% - 16px);margin-left:8px;margin-right:8px;}
.shop-premium-card {border-color:var(--card-edge, #695585);background:var(--card-bg, linear-gradient(155deg,#211e36,#172231 70%));}
.shop-premium-card > p {color:var(--card-title-ink, #d8c7f0);}
#shop-preview-dialog .shop-waiting-preview {min-height:280px;}
@media(max-width:520px) {
 #shop-discover .shop-grid,#shop-owned .shop-grid {grid-template-columns:1fr;}
 .shop-design-categories {gap:6px;}
 .shop-design-categories button {padding:8px 11px;}
}
/* Immersive collection storefront. Wallet and filter layouts stay compact. */
.shop-page {max-width:1240px;}
.shop-heading h1 {font-family:inherit;font-size:38px;}
.shop-spotlight {position:relative;isolation:isolate;min-height:390px;border:1px solid #4c4c7177;border-radius:var(--radius-lg);overflow:hidden;margin-bottom:48px;background:#080d1a;}
.shop-spotlight > .shop-preview {position:absolute;inset:0;border-radius:0;padding:0;min-height:0;}
.shop-spotlight > .shop-preview::after {background:linear-gradient(90deg,#060b1bee 0%,#060b1b90 43%,#060b1b05 85%),linear-gradient(0deg,#060b1bbf,transparent 35%);animation:none;opacity:1;}
.shop-spotlight .shop-scene-caption {display:none;}
.shop-spotlight-copy {position:relative;max-width:490px;padding:56px 46px 90px;pointer-events:none;}
.shop-eyebrow {font-size:12px;letter-spacing:2.8px;font-weight:700;color:var(--eyebrow-ink, #c1b7e9);}
.shop-spotlight h2 {font:700 clamp(40px,5vw,66px)/1.04 inherit;letter-spacing:-2px;margin:18px 0;}
.shop-spotlight p {font-size:15px;line-height:1.7;color:#d0d9eb;max-width:320px;}
.shop-spotlight-open {pointer-events:auto;border:1px solid #e1def5;border-radius:var(--radius-sm);padding:13px 20px;background:#eae5ff;color:#171329;font-weight:650;font-size:13px;cursor:pointer;margin-top:12px;}
.shop-spotlight-open:hover {background:white;}
.shop-spotlight-choices {position:absolute;bottom:24px;left:46px;display:flex;gap:8px;}
.shop-spotlight-choices button {cursor:pointer;background:#0a102999;color:#e2e6f5;border:1px solid #8892bb55;border-radius:30px;padding:9px 14px;font-size:12px;backdrop-filter:blur(12px);}
.shop-spotlight-choices button[aria-pressed=true] {border-color:#d9ceff;background:#6a549475;}
.shop-collection-heading {display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px;}
.shop-collection-heading h2 {font:650 34px/1.2 inherit;letter-spacing:-1px;margin:10px 0 0;}
.shop-collection-heading p {font-size:12px;max-width:220px;margin:0;}
.shop-design-categories {gap:8px;margin-bottom:32px;}
.shop-design-categories button {padding:11px 16px;background:var(--chip-bg, #141c2b);border-color:var(--chip-edge, #303a50);}
.shop-design-categories button[aria-pressed=true] {background:var(--chip-active-bg, #dcd4f7);border-color:var(--chip-active-edge, #dcd4f7);color:var(--chip-active-ink, #1b1432);}
.shop-category-heading h2 {font-size:16px;color:var(--category-ink, #b8c4da);letter-spacing:.3px;font-family:inherit;}
.shop-design-grid {gap:22px;margin-top:18px;}
.shop-design-card {padding:0 0 20px;border-radius:var(--radius-lg);background:var(--card-bg, #121c2b);border:1px solid var(--card-edge, #33415788);overflow:hidden;transition:transform .2s,border-color .2s;}
.shop-design-card:hover {transform:translateY(-3px);border-color:var(--card-edge, #9585bf);}
.shop-design-card[data-edition="Signature"] {border-color:var(--card-edge, #a38bc377);background:var(--card-bg, linear-gradient(150deg,#211d35,#111a2a 70%));}
.shop-design-card > .shop-edition {position:absolute;z-index:3;top:15px;left:15px;padding:5px 9px;font-size:11px;text-transform:uppercase;letter-spacing:1.5px;border:1px solid #c5c4ea4d;background:#090d1cca;border-radius:var(--radius-xs);color:#dedff0;pointer-events:none;}
.shop-design-card[data-edition="Signature"] > .shop-edition {color:#ffdfad;border-color:#dcbd8077;}
.shop-design-card h3 {font-size:22px;margin:21px 20px 8px;letter-spacing:-.5px;}
.shop-design-card > p {margin:4px 20px 16px;}
.shop-design-card > .shop-design-detail {font-size:12px;color:var(--detail-ink, #aebbd1);line-height:1.6;min-height:39px;margin-bottom:18px;}
.shop-design-card > p:not(.shop-design-detail) {font-size:14px;font-weight:650;color:var(--card-title-ink, #eee9ff);}
.shop-design-card > button {margin:0 20px;margin-top:auto;width:calc(100% - 40px);justify-content:space-between;background:var(--button-bg, #202d43);border-color:var(--button-edge, #435573);}
.shop-design-card .shop-preview {height:245px;min-height:245px;padding:25px 20px;border-radius:0;border-bottom:1px solid #ffffff0e;}
.shop-design-card .shop-waiting-preview {height:245px;min-height:245px;}
.shop-preview {isolation:isolate;background:radial-gradient(ellipse at 50% 35%,#342c56,#0b1322 75%);}
.shop-preview .shop-demo-profile {visibility:visible;}
.shop-scene-caption {position:absolute;bottom:17px;left:20px;padding:6px 10px;border-radius:var(--radius-lg);background:#030c208c;color:#edf1ff;font-size:12px;letter-spacing:.6px;backdrop-filter:blur(8px);}
.shop-preview[data-preview-kind="frame"] .shop-demo-profile {gap:4px;padding-top:12px;}
.shop-preview[data-preview-kind="frame"] .shop-demo-avatar {width:90px;height:90px;margin:25px 0 36px;background:radial-gradient(circle at 40% 20%,#4b5980,#1d2842 75%);font-size:37px;color:#b1bed9;}
.shop-preview[data-preview-kind="frame"] .shop-demo-profile > strong {font-size:13px;font-weight:550;color:#bcc7dc;}
.shop-demo-handle {font-size:10px;color:#9daac0;}
.shop-preview[data-preview-kind="profile"] {padding:0;background:#0a1221;}
.shop-preview[data-preview-kind="profile"] .shop-demo-profile {height:100%;border-radius:0;display:flex;flex-direction:column;justify-content:end;align-items:start;padding:26px;gap:5px;background-size:100% 100%,cover!important;}
.shop-preview[data-preview-kind="profile"] .shop-demo-avatar {width:52px;height:52px;margin-bottom:7px;border:3px solid #ffffffbb;background:#223650bd;backdrop-filter:blur(12px);font-size:22px;}
.shop-preview[data-preview-kind="profile"] .shop-demo-profile > strong {font-size:21px;}
.shop-preview[data-preview-kind="profile"] .shop-demo-profile {background-image:linear-gradient(0deg,#050d20ee,#050d2030 80%),var(--profile-art)!important;}
.shop-demo-conversation {display:flex;flex-direction:column;gap:20px;width:100%;max-width:315px;padding:20px 3px;}
.shop-demo-incoming {align-self:start;color:#b1bdd3;background:#1a293c;border:1px solid #35445c;padding:10px 13px;border-radius:13px 13px 13px 3px;font-size:11px;}
.shop-demo-chat {align-self:end;max-width:90%;font-size:13px;}
.shop-demo-time {align-self:end;font-size:9px;color:#7385a1;margin-top:-8px;}
.shop-demo-app {width:100%;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:0 14px 35px #0006;overflow:hidden;}
.shop-demo-appbar {display:flex;gap:8px;align-items:center;padding:11px 13px;border-bottom:1px solid var(--line);font-size:10px;}
.shop-demo-appbar > i:last-child {margin-left:auto;color:var(--accent);}
.shop-demo-apppanel {display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 12px;background:linear-gradient(0deg,#050b20bb,#050b2044),var(--theme-art) center/cover;font-size:10px;}
.shop-demo-orbit {font-size:24px;color:var(--accent);text-shadow:0 0 16px var(--accent);}
.shop-demo-start {padding:7px 25px;color:#091324;border-radius:var(--radius-sm);background:var(--accent);font-weight:700;}
#shop-preview-dialog {width:min(880px,calc(100% - 32px));padding:24px;background:var(--overlay-bg, #101a2a);border:1px solid var(--overlay-edge, #6f648f);color:var(--overlay-ink, #eef4ff);box-shadow:var(--overlay-shadow, none);border-radius:var(--radius-lg);}
#shop-preview-dialog header {margin-bottom:16px;}
#shop-preview-title {font-family:inherit;font-size:19px;}
#shop-preview-dialog .shop-preview {height:400px;min-height:260px;border-radius:var(--radius-md);}
#shop-preview-dialog .shop-demo-avatar {width:120px;height:120px;margin-top:38px;margin-bottom:50px;}
#shop-preview-dialog [data-preview-kind="profile"] .shop-demo-avatar {width:72px;height:72px;margin:0 0 10px;}
#shop-preview-dialog .shop-demo-conversation {max-width:460px;gap:30px;}
#shop-preview-dialog .shop-demo-chat {font-size:18px;padding:18px 28px;}
#shop-preview-dialog .shop-demo-incoming {font-size:15px;}
#shop-preview-dialog .shop-demo-app {max-width:400px;}
#shop-preview-dialog .shop-demo-apppanel {padding:44px 20px;}
.shop-detail-edition {display:inline-block;color:#d4b4ff;border:1px solid #9e7cc755;border-radius:var(--radius-xs);letter-spacing:1.5px;text-transform:uppercase;font-size:12px;padding:4px 8px;margin-top:22px;}
#shop-preview-description {font-size:16px;color:#d5deed;margin:12px 0;}
#shop-preview-price {font-size:19px;font-weight:650;color:#f5f0ff;margin:20px 0 6px;}
#shop-preview-note {font-size:12px;margin:0 0 22px;}
#shop-preview-buy {background:#d7ccf7;border-color:#d7ccf7;color:#1e1730;min-height:46px;}
#shop-preview-buy:hover:not(:disabled) {background:#ede5ff;}
html[data-design-paused] .shop-waiting-preview::before,html[data-design-paused] .shop-waiting-preview::after {animation-play-state:paused!important;}
@media(max-width:980px) {.shop-design-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.shop-spotlight-copy{padding-left:32px;}.shop-spotlight-choices{left:32px;}}
@media(max-width:600px) {
 .shop-page{padding-left:16px;padding-right:16px;}
 .shop-spotlight{min-height:425px;margin-bottom:36px;border-radius:var(--radius-lg);}
 .shop-spotlight-copy{padding:135px 23px 88px;max-width:none;}
 .shop-spotlight h2{font-size:40px;margin:14px 0;}
 .shop-spotlight p{font-size:13px;margin:0;max-width:290px;}
 .shop-spotlight > .shop-preview::after{background:linear-gradient(0deg,#060b1bfa,#060b1baf 55%,#060b1b00);}
 .shop-spotlight > .shop-preview::before{background-position:65% center;}
 .shop-spotlight-choices{bottom:20px;left:22px;right:15px;gap:5px;}
 .shop-spotlight-choices button{font-size:12px;padding:8px 10px;}
 .shop-eyebrow{font-size:12px;letter-spacing:2px;}
 .shop-collection-heading{display:block;}
 .shop-collection-heading h2{font-size:30px;}
 .shop-collection-heading p{max-width:none;margin-top:12px;}
 .shop-design-categories{gap:6px;}
 .shop-design-categories button{font-size:12px;padding:9px 11px;}
 .shop-design-grid{gap:18px;}
 #shop-preview-dialog{padding:16px;width:calc(100% - 20px);}
 #shop-preview-title{font-size:16px;}
 #shop-preview-dialog .shop-preview{height:300px;}
 #shop-preview-dialog .shop-demo-avatar{width:95px;height:95px;}
 #shop-preview-dialog .shop-demo-chat{font-size:14px;padding:14px 19px;}
 #shop-preview-dialog .shop-demo-incoming{font-size:12px;}
}
@media(prefers-reduced-motion:reduce) {.shop-design-card{transition:none;}.shop-design-card:hover{transform:none;}}

/* A permanent layout upgrade, separate from the backgrounds it expands. */
.shop-layout-upgrade {display:grid;grid-template-columns:196px minmax(0,1fr) 215px;align-items:center;gap:26px;padding:24px;margin-bottom:32px;border:1px solid #54678088;border-radius:var(--radius-lg);background:linear-gradient(115deg,#1d2c3ceb,#142030f2);}
.shop-layout-copy .shop-eyebrow {font-size:12px;letter-spacing:1.7px;color:var(--eyebrow-ink, #a4d4d0);}
.shop-layout-copy h2 {font-size:23px;margin:9px 0 7px;}
.shop-layout-copy p {margin:0 0 7px;font-size:13px;color:#e1eaf7;}
.shop-layout-copy small {display:block;font-size:12px;line-height:1.6;color:#9baec5;max-width:450px;}
.shop-layout-actions {display:flex;flex-direction:column;align-items:stretch;gap:10px;text-align:center;background:var(--card-bg, none);}
.shop-layout-actions strong {font-size:12px;font-weight:550;color:var(--card-title-ink, #ccdceb);}
.shop-layout-actions .primary {padding:11px 12px;font-size:12px;line-height:1.35;background:#d5e8e7;border-color:#d5e8e7;color:#11292d;}
.shop-layout-actions .primary:hover:not(:disabled) {background:#eaf7f5;border-color:#eaf7f5;}
.shop-layout-preview-button {align-self:center;border:0;padding:3px;background:none;font-size:12px;color:var(--layout-link-ink, #b1c8dc);cursor:pointer;text-decoration:underline;text-underline-offset:4px;}
.shop-layout-upgrade button:disabled,#shop-layout-dialog button:disabled {cursor:default;opacity:.5;}
#shop-layout-message {grid-column:1/-1;margin:0;font-size:12px;}
#shop-layout-message:empty,#shop-layout-dialog-message:empty {display:none;}
.shop-layout-demo {position:relative;isolation:isolate;display:grid;grid-template-rows:24px 1fr 24px;aspect-ratio:1.5;background:#111c2b;border:1px solid #71839766;border-radius:var(--radius-md);overflow:hidden;}
.shop-layout-demo-bar {display:flex;align-items:center;justify-content:space-between;padding:0 10px;background:#172334;border-bottom:1px solid #8eacc322;}
.shop-layout-demo-brand {width:23px;height:4px;border-radius:3px;background:#adbbcb;}
.shop-layout-demo-menu {width:9px;height:9px;border-radius:50%;background:#6b8199;}
.shop-layout-demo-panels {display:grid;grid-template-columns:1fr 1fr;min-height:0;padding:6px;gap:6px;}
.shop-layout-demo-waiting,.shop-layout-demo-camera {position:relative;isolation:isolate;display:grid;place-items:center;min-width:0;border-radius:var(--radius-xs);overflow:hidden;color:#e3edf3;}
.shop-layout-demo-camera {background:linear-gradient(150deg,#344557,#1e2b3b);border:1px solid #adbfda22;font-size:23px;color:#91a2b8;}
.shop-layout-demo-waiting {background:#0d192a;}
.shop-layout-demo-waiting > i {font-size:17px;opacity:.8;}
.shop-layout-demo-dock {display:flex;align-items:center;gap:5px;padding:0 8px;background:#172334;border-top:1px solid #8eacc322;}
.shop-layout-demo-dock > span {height:7px;width:17px;border-radius:2px;background:#506782;}
.shop-layout-demo-dock > span:nth-child(2) {width:24px;background:#85b7c4;}
.shop-layout-demo-dock > span:last-child {margin-left:auto;width:8px;}
.shop-layout-demo-scene {position:absolute;inset:0;z-index:-1;}
.shop-layout-demo.is-expanded .shop-layout-demo-bar,.shop-layout-demo.is-expanded .shop-layout-demo-dock {background:#10223080;}
.shop-layout-demo.is-expanded .shop-layout-demo-waiting {background:transparent;}
.shop-layout-demo.is-expanded .shop-layout-demo-camera {border-color:#c4ebed55;box-shadow:0 2px 12px #0004;}
#shop-layout-dialog {box-sizing:border-box;width:min(760px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto;padding:28px;border:1px solid var(--overlay-edge, #5e778d);border-radius:var(--radius-lg);background:var(--overlay-bg, #122031);color:var(--overlay-ink, #eef4ff);box-shadow:var(--overlay-shadow, none);}
#shop-layout-dialog::backdrop {background:#050c17ba;backdrop-filter:blur(3px);}
#shop-layout-dialog header {display:flex;justify-content:space-between;align-items:center;gap:16px;}
#shop-layout-dialog-title {font-size:25px;margin:0;}
#shop-layout-close {border:0;background:none;color:#dae9f5;font-size:28px;padding:0 4px;cursor:pointer;}
#shop-layout-dialog-description {margin:13px 0 24px;font-size:14px;}
.shop-layout-comparison {display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.shop-layout-comparison figure {min-width:0;margin:0;}
.shop-layout-comparison figcaption {margin-top:12px;text-align:center;color:#b5c4d7;font-size:12px;}
.shop-layout-comparison figure:last-child figcaption {color:#b5ece2;}
.shop-layout-comparison .shop-layout-demo {grid-template-rows:30px 1fr 30px;aspect-ratio:1.55;}
.shop-layout-comparison .shop-layout-demo-panels {padding:9px;gap:9px;}
#shop-layout-dialog .shop-layout-benefit {font-size:16px;color:#e2f1f0;margin:26px 0 8px;}
#shop-layout-dialog .shop-layout-fine-print {margin:6px 0;font-size:12px;line-height:1.6;}
#shop-layout-dialog-price {font-size:19px;color:#e8f3f5;font-weight:650;margin:24px 0 12px;}
#shop-layout-dialog-message {font-size:12px;color:#e8c9ae;}
#shop-layout-confirm {width:100%;background:#d5e8e7;border-color:#d5e8e7;color:#11292d;min-height:46px;}
#shop-layout-top-up {display:block;text-align:center;margin-top:16px;font-size:13px;color:#c5d9f4;}
@media(max-width:1000px) {
 .shop-layout-upgrade {grid-template-columns:160px minmax(0,1fr);gap:20px;}
 .shop-layout-actions {grid-column:1/-1;flex-direction:row;align-items:center;gap:16px;text-align:left;}
 .shop-layout-actions strong {margin-right:auto;}
}
@media(max-width:600px) {
 .shop-layout-upgrade {padding:19px;grid-template-columns:1fr;gap:18px;}
 .shop-layout-card-preview {display:none;}
 .shop-layout-copy h2 {font-size:22px;}
 .shop-layout-actions {display:grid;grid-template-columns:1fr;gap:13px;text-align:left;}
 .shop-layout-actions .primary {width:100%;min-height:43px;}
 .shop-layout-preview-button {justify-self:start;}
 #shop-layout-dialog {padding:20px;}
 #shop-layout-dialog-title {font-size:21px;}
 .shop-layout-comparison {gap:10px;}
 .shop-layout-comparison .shop-layout-demo {aspect-ratio:1.05;grid-template-rows:22px 1fr 22px;}
 .shop-layout-comparison .shop-layout-demo-panels {padding:5px;gap:4px;}
 .shop-layout-comparison .shop-layout-demo-camera {font-size:19px;}
 .shop-layout-comparison .shop-layout-demo-waiting > i {font-size:13px;}
 #shop-layout-dialog-description {font-size:13px;margin-bottom:20px;}
}

/* Daylight showcases retain the world's actual brightness. */
.shop-spotlight[data-scene-tone="light"] {color:var(--scene-ink);border-color:var(--scene-edge);background:var(--scene-base);}
.shop-spotlight[data-scene-tone="light"] > .shop-preview::after {background:linear-gradient(90deg,var(--scene-solid),color-mix(in srgb,var(--scene-solid) 78%,transparent) 34%,transparent 78%);}
.shop-spotlight[data-scene-tone="light"] :is(p,.shop-eyebrow) {color:var(--scene-muted);}
.shop-spotlight[data-scene-tone="light"] .shop-spotlight-open {background:var(--scene-primary);color:var(--scene-on-primary);border-color:var(--scene-primary);}
.shop-spotlight[data-scene-tone="light"] .shop-spotlight-choices button {background:var(--scene-panel);color:var(--scene-ink);border-color:var(--scene-edge);}
.shop-spotlight[data-scene-tone="light"] .shop-spotlight-choices button[aria-pressed="true"] {background:var(--scene-primary);color:var(--scene-on-primary);}
.shop-spotlight-choices {flex-wrap:wrap;right:20px;}
.shop-preview[data-preview-kind="profile"] .shop-demo-profile[data-scene-tone="light"] {background-image:linear-gradient(0deg,var(--scene-panel),transparent 90%),var(--profile-art)!important;}
@media(max-width:520px) {
 .shop-spotlight[data-scene-tone="light"] > .shop-preview::after {background:linear-gradient(0deg,var(--scene-solid),color-mix(in srgb,var(--scene-solid) 85%,transparent) 44%,transparent);}
 .shop-spotlight-copy {padding-bottom:105px;}
}

/* Background bookmarks and coordinated packages. */
.shop-tabs {overflow-x:auto;scrollbar-width:thin;}
.shop-card-tools {position:absolute;right:12px;top:12px;z-index:4;}
.shop-card-tools .shop-favorite,#shop-preview-favorite .shop-favorite {display:flex;align-items:center;justify-content:center;gap:8px;width:38px;height:38px;margin:0;padding:8px;border:1px solid #c8d8f04d;border-radius:50%;background:#101a2de6;color:#f1f5ff;cursor:pointer;}
.shop-favorite[aria-pressed="true"] .shop-favorite-star {color:#ffd37a;text-shadow:0 0 7px #efbd6655;}
.shop-favorite[aria-pressed="true"] {border-color:#ffd37a!important;}
.shop-card-tools .shop-favorite-star {font-size:20px;}
#shop-preview-favorite .is-labelled {width:auto;height:auto;border-radius:var(--radius-sm);font-size:12px;}
#shop-preview-favorite {margin-top:20px;}
#shop-preview-favorite:empty {display:none;}
.shop-bundle-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.shop-bundle-preview {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;min-height:260px;}
.shop-bundle-preview .shop-bundle-avatar {position:relative!important;flex:none;width:58px;height:58px;background:#152339cc;}
.shop-bundle-preview .shop-demo-chat {position:relative;max-width:80%;font-size:12px;}
.shop-bundle-summary {margin:0 20px 8px;padding-left:18px;color:var(--scene-muted,#a9b7ca);font-size:12px;line-height:1.9;}
.shop-bundle-card .shop-bundle-discount {color:var(--scene-accent,#a4d4d0);font-size:12px;margin-bottom:3px;}
.shop-bundle-card .shop-bundle-total {margin-bottom:4px;font-weight:600;}
.shop-bundle-card .shop-bundle-personal-price {color:var(--scene-ink,#eef4ff);font-size:16px;font-weight:650;}
#shop-bundle-dialog {box-sizing:border-box;width:min(630px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:24px;border:1px solid var(--scene-edge,#5b708f);border-radius:var(--radius-lg);background:var(--scene-solid,#122031);color:var(--scene-ink,#eef4ff);}
#shop-bundle-dialog::backdrop {background:#050c17ba;backdrop-filter:blur(3px);}
#shop-bundle-dialog header {display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;}
#shop-bundle-title {font-size:23px;}
#shop-bundle-close {background:none;border:0;color:inherit;font-size:28px;cursor:pointer;}
#shop-bundle-preview {border-radius:var(--radius-md);overflow:hidden;}
#shop-bundle-dialog h3 {font-size:15px;margin:22px 0 12px;}
#shop-bundle-items {list-style:none;padding:0;display:grid;gap:11px;font-size:13px;}
#shop-bundle-items li {display:flex;justify-content:space-between;align-items:baseline;gap:18px;line-height:1.45;}
#shop-bundle-items strong {font-size:12px;text-align:right;white-space:nowrap;}
#shop-bundle-items .is-owned {color:var(--scene-muted,#99acc4);}
#shop-bundle-dialog p {font-size:12px;color:var(--scene-muted,#b8c9df);}
#shop-bundle-price {display:flex;flex-wrap:wrap;gap:8px 14px;align-items:baseline;margin:22px 0 16px;}
#shop-bundle-price strong {font-size:20px;color:var(--scene-ink,#eef4ff);}
#shop-bundle-price small {flex-basis:100%;}
#shop-bundle-confirm {width:100%;padding:13px;background:var(--scene-primary,#d5e8e7);color:var(--scene-on-primary,#11292d);}
#shop-bundle-top-up {display:block;text-align:center;margin-top:14px;color:inherit;font-size:13px;}
#shop-bundle-message:empty {display:none;}
@media(max-width:600px) {.shop-bundle-grid {grid-template-columns:1fr;}#shop-bundle-dialog {padding:18px;}#shop-bundle-dialog .shop-bundle-preview {min-height:200px;}#shop-bundle-items li {gap:10px;font-size:12px;}#shop-bundle-items strong {white-space:normal;}}

.shop-bundle-card > s.shop-bundle-total {margin:4px 20px;color:var(--scene-muted,#a9b7ca);font-size:12px;font-weight:400;}

.studio-actions {display:flex;flex-wrap:wrap;gap:10px;margin:14px 0;}
.studio-actions button {flex:1;min-width:100px;padding:11px 15px;border:1px solid var(--control-edge);border-radius:var(--radius-sm);background:var(--control-bg);color:var(--control-ink);cursor:pointer;}
.studio-save {display:grid;grid-template-columns:auto minmax(100px,1fr) auto minmax(90px,1fr) auto;align-items:center;gap:12px;margin:24px 0;}
.studio-save :is(input,select) {min-width:0;width:100%;box-sizing:border-box;border:1px solid var(--field-line);border-radius:var(--radius-sm);background:var(--field-bg);color:var(--control-ink);padding:12px;font:inherit;}
.studio-save button {padding:12px 18px;}
.studio-look-card .studio-actions {margin:14px 20px 20px;}
.studio-look-card {min-width:0;overflow:hidden;}
#shop-look-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.studio-look-card h3 {overflow-wrap:anywhere;}
.studio-look-preview {min-height:240px;}
.studio-try-bar button {border:1px solid var(--field-line);border-radius:var(--radius-sm);background:var(--control-bg);color:var(--control-ink);cursor:pointer;}
.studio-try-bar {position:fixed;z-index:30;inset:auto 20px 20px;display:flex;align-items:center;gap:28px;padding:18px 24px;background:var(--dialog-bg);color:var(--text);border:1px solid var(--dialog-edge);border-radius:var(--radius-lg);box-shadow:var(--shadow);}
.studio-try-copy {display:grid;gap:5px;flex:1;}.studio-try-copy span {font-size:12px;}
.studio-try-bar .shop-demo-avatar {width:44px;height:44px;flex:none;}
.studio-try-bar .shop-demo-chat {margin:0;max-width:180px;min-width:90px;}
.studio-try-bar button {padding:12px 16px;white-space:nowrap;}
body[data-shop-trying] {padding-bottom:170px;}
@media(max-width:700px) {
  .shop-page .shop-tabs {display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;margin-left:0;margin-right:0;padding:0 0 9px;}
  .shop-tabs button {flex:none;white-space:nowrap;padding:12px 15px;}
  #shop-look-grid {grid-template-columns:1fr;}
  .studio-save {grid-template-columns:auto minmax(100px,1fr);}.studio-save button {grid-column:1/-1;}
  .studio-try-bar {inset:auto 12px 12px;padding:17px;gap:20px;flex-wrap:wrap;}
  .studio-try-copy {flex-basis:100%;}.studio-try-bar button {margin-left:auto;}.studio-try-bar .shop-demo-chat {font-size:11px;min-width:70px;}
  body[data-shop-trying] {padding-bottom:260px;}
}
#shop-looks > p,#shop-bundles > p {color:var(--muted);}

/* One discovery bar shared by designs, packages and owned designs. */
.shop-discovery {display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,240px);gap:14px 20px;margin:0 0 26px;}
.shop-discovery label {display:block;margin-bottom:8px;font-size:12px;color:var(--muted);}
.shop-search-input {display:flex;align-items:center;gap:10px;border:1px solid var(--field-line);border-radius:var(--radius-sm);background:var(--field-bg);padding:0 13px;color:var(--muted);}
.shop-search-input:focus-within {outline:2px solid var(--accent);outline-offset:2px;}
.shop-search-input > i {font-size:20px;flex:none;}
.shop-discovery #shop-search {min-width:0;width:100%;height:46px;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--text);font:inherit;outline:none;box-shadow:none;}
#shop-search::placeholder {color:var(--muted);opacity:1;}
#shop-search::-webkit-search-cancel-button {appearance:none;}
#shop-search-clear {flex:none;width:32px;height:32px;padding:0;border:0;border-radius:var(--radius-xs);background:var(--control-bg);color:var(--control-ink);font-size:23px;cursor:pointer;}
.shop-discovery #shop-sort {box-sizing:border-box;width:100%;min-width:0;height:48px;margin:0;padding:0 12px;border:1px solid var(--field-line);border-radius:var(--radius-sm);background:var(--field-bg);color:var(--text);font:inherit;}
#shop-result-count {grid-column:1/-1;margin:0;color:var(--muted);font-size:12px;}
.shop-empty-results {grid-column:1/-1;padding:32px 20px;text-align:center;border:1px solid var(--control-edge);border-radius:var(--radius-md);background:var(--control-bg);color:var(--control-ink);}
.shop-empty-results p {margin:0 0 14px;}
.shop-owned-resets {display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;}
.shop-owned-resets:empty {display:none;}
.shop-design-card > .shop-card-category {font-size:11px;color:var(--muted);margin-top:-5px;margin-bottom:8px;}
@media(max-width:600px) {
  .shop-discovery {grid-template-columns:1fr;gap:14px;}
  .shop-sort-field {display:flex;align-items:center;gap:16px;}
  .shop-sort-field label {margin:0;}
  .shop-discovery #shop-sort {flex:1;width:auto;}
}
/* Level medallions are standalone ornaments, not empty avatar placeholders. */
.shop-badge-art {width:58%;height:76%;object-fit:contain;align-self:center;margin:auto;}
