/* The cooling rack: drawn in the toybox skin's own parts (cream cards, gum shadows, dashed stitching). */
.wl-sec--rack .gz-rack { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(20px, 4vw, 44px); align-items: start; }
.wl-sec--rack .wl-kicker__label::before { content: "Play mat"; }
.gz-rack__copy { display: grid; gap: 16px; padding: clamp(20px, 3vw, 30px); border-radius: 34px; background: var(--tb-cream); box-shadow: var(--tb-plush); border: 3px dashed var(--tb-stitch); }
.gz-rack__copy .wl-lore__lead { font-family: var(--v-font-display); font-weight: 800; font-size: clamp(1.25rem, 2.2vw, 1.6rem); color: var(--tb-ink); margin: 0; }
.gz-rack__copy .wl-lore__p { margin: 0; color: var(--v-soft); font-weight: 600; line-height: 1.6; }
.gz-ca { display: grid; box-shadow: 0 4px 0 color-mix(in srgb, var(--tb-deep) 22%, transparent); grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; margin-top: 6px; }
.gz-ca .wl-ca__value { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.86rem; }
.gz-ca .gz-copy { border: 0; cursor: pointer; font-weight: 800; }
.gz-explore { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--tb-cream-2); color: var(--tb-deep); box-shadow: var(--tb-gum); transition: translate 0.25s var(--v-spring); }
.gz-explore svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.gz-explore:hover { translate: 0 -3px; }
.gz-explore:active { translate: 0 3px; }
.gz-rack__board { display: grid; gap: 18px; padding: clamp(18px, 3vw, 28px); border-radius: 34px; background: var(--tb-cream); box-shadow: var(--tb-plush); border: 3px dashed var(--tb-stitch); }
.gz-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.gz-stat { display: grid; gap: 6px; padding: 14px 16px; border-radius: 22px; background: var(--tb-blush); box-shadow: inset 0 -5px 0 color-mix(in srgb, var(--tb-pop) 16%, transparent); }
.gz-stats--me .gz-stat { background: #fff; }
.gz-stat__label { font-size: 0.76rem; font-weight: 800; letter-spacing: 0.02em; color: var(--tb-pop); font-family: var(--v-font-display); }
.gz-stat__value { font-family: var(--v-font-display); font-weight: 900; font-size: clamp(1.1rem, 2vw, 1.4rem); color: var(--tb-ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.is-loading .gz-stat__value { animation: gz-pulse 1.2s ease-in-out infinite; }
@keyframes gz-pulse { 50% { opacity: 0.4; } }
.gz-me { display: grid; gap: 16px; }
.gz-me[hidden], .gz-connect[hidden] { display: none; }
.gz-field { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 8px 8px 8px 22px; border-radius: 999px; background: #fff; border: 3px solid color-mix(in srgb, var(--tb-pop) 40%, transparent); }
.gz-field:focus-within { border-color: var(--tb-pop); }
.gz-field__label { font-family: var(--v-font-display); font-weight: 800; color: var(--tb-pop); font-size: 0.9rem; }
.gz-input { min-width: 0; border: 0; outline: 0; background: transparent; font: 800 1.15rem var(--v-font-display); color: var(--tb-ink); }
.gz-max { border: 0; cursor: pointer; padding: 10px 16px; border-radius: 999px; background: var(--tb-butter); color: var(--tb-deep); font: 800 0.86rem var(--v-font-display); box-shadow: 0 4px 0 color-mix(in srgb, var(--tb-deep) 40%, transparent); transition: translate 0.2s var(--v-spring); }
.gz-max:active { translate: 0 3px; }
.gz-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.gz-actions .wl-btn { cursor: pointer; }
.gz-actions .wl-btn:disabled { opacity: 0.45; cursor: not-allowed; translate: none; }
.gz-connect { display: flex; }
.gz-connect .wl-btn { cursor: pointer; text-decoration: none; }
.gz-status { margin: 0; min-height: 1.4em; font-weight: 700; font-size: 0.92rem; color: var(--v-soft); }
.gz-status--ok { color: var(--tb-ink); }
.gz-status--err { color: color-mix(in srgb, var(--tb-pop) 70%, #7a0a1a); }
.gz-status a { color: inherit; font-weight: 800; }
.gz-picker { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 20px; background: color-mix(in srgb, var(--tb-deep) 55%, transparent); }
.gz-picker__card { position: relative; display: grid; gap: 10px; width: min(360px, 100%); padding: 26px 20px 20px; border-radius: 34px; background: var(--tb-cream); box-shadow: var(--tb-plush); border: 3px dashed var(--tb-stitch); }
.gz-picker__title { margin: 0 0 6px; font: 900 1.3rem var(--v-font-display); color: var(--tb-ink); }
.gz-picker__item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 0; border-radius: 999px; background: #fff; font: 800 1rem var(--v-font-display); color: var(--tb-ink); cursor: pointer; box-shadow: var(--tb-gum); transition: translate 0.2s var(--v-spring); }
.gz-picker__item:hover { translate: 0 -2px; }
.gz-picker__item img { width: 28px; height: 28px; border-radius: 8px; }
.gz-picker__close { position: absolute; top: 12px; right: 14px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--tb-blush); color: var(--tb-deep); font: 900 1.3rem/1 var(--v-font-display); cursor: pointer; }
@media (max-width: 760px) {
  .wl-sec--rack .gz-rack { grid-template-columns: 1fr; }
  .gz-stats { grid-template-columns: 1fr 1fr; }
  .gz-stats .gz-stat:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .gz-ca { grid-template-columns: minmax(0, 1fr) auto auto; padding-left: 18px; }
  .gz-ca .wl-ca__label { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .is-loading .gz-stat__value { animation: none; }
  .gz-explore, .gz-max, .gz-picker__item { transition: none; }
}
.gz-status:empty { display: none; }