#xxiiiStoreOverlay{position:fixed;z-index:2300;inset:0;display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:rgba(3,7,9,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
#xxiiiStoreOverlay[hidden]{display:none}
.xxiiiStoreDialog{display:flex;overflow:hidden;width:min(920px,100%);max-height:min(790px,calc(100dvh - 28px));min-height:0;flex-direction:column;border:1px solid rgba(254,203,68,.34);border-radius:20px;background:linear-gradient(145deg,#17221e,#0a1110 62%);box-shadow:0 30px 90px rgba(0,0,0,.62);color:#f7fbf8;font-family:Inter,Arial,sans-serif}
.xxiiiStoreHead{display:flex;align-items:center;gap:12px;padding:18px 20px 14px;border-bottom:1px solid rgba(255,255,255,.1)}
.xxiiiStoreTitle{min-width:0;flex:1}.xxiiiStoreTitle p{margin:0 0 3px;color:#f4c542;font-size:10px;font-weight:900;letter-spacing:.19em}.xxiiiStoreTitle h2{margin:0;font-size:clamp(20px,3.2vw,30px);letter-spacing:.025em}
.xxiiiStoreWallet{display:flex;align-items:center;gap:7px;padding:9px 11px;border:1px solid rgba(244,197,66,.42);border-radius:10px;background:rgba(244,197,66,.1);color:#fff;font-size:13px;font-weight:900;white-space:nowrap}.xxiiiStoreWallet span{color:#f4c542;font-size:16px}.xxiiiStoreClose{width:36px;height:36px;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:rgba(255,255,255,.06);color:#fff;font:400 28px/30px Arial;cursor:pointer}.xxiiiStoreClose:hover{background:rgba(255,255,255,.14)}
.xxiiiStoreIntro{margin:0;padding:13px 20px 11px;color:rgba(238,249,242,.7);font-size:13px;line-height:1.45}.xxiiiStoreIntro strong{color:#fff}.xxiiiStoreTabs{display:flex;gap:7px;padding:0 20px 12px;border-bottom:1px solid rgba(255,255,255,.1)}.xxiiiStoreTab{min-height:34px;padding:6px 13px;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:rgba(255,255,255,.045);color:rgba(255,255,255,.66);font:800 12px/1 Inter,Arial,sans-serif;cursor:pointer}.xxiiiStoreTab.active{border-color:#f4c542;background:rgba(244,197,66,.17);color:#fff}.xxiiiStoreTab[disabled]{opacity:.42;cursor:not-allowed}
.xxiiiStoreContent{overflow:auto;min-height:0;padding:16px 20px 22px}.xxiiiStoreStatus{min-height:20px;margin:0 0 12px;color:#f4c542;font-size:12px;font-weight:700}.xxiiiStoreGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.xxiiiStoreCard{position:relative;display:flex;min-width:0;min-height:275px;flex-direction:column;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:linear-gradient(150deg,rgba(255,255,255,.095),rgba(255,255,255,.028) 52%,rgba(0,0,0,.22));box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}.xxiiiStoreCard.owned{border-color:rgba(124,240,165,.48)}.xxiiiStoreCard.equipped{border-color:#f4c542;box-shadow:0 0 0 1px rgba(244,197,66,.22),0 10px 22px rgba(0,0,0,.26)}
.xxiiiStoreVisual{position:relative;display:grid;overflow:hidden;height:138px;place-items:end center;background:radial-gradient(circle at 50% 22%,rgba(140,255,195,.24),rgba(16,38,31,.25) 46%,rgba(3,7,8,.72) 100%)}.xxiiiStoreVisual:after{position:absolute;bottom:14px;left:15%;width:70%;height:12px;border-radius:50%;background:rgba(0,0,0,.4);content:'';filter:blur(5px)}.xxiiiStoreSock{position:relative;z-index:1;width:42px;height:91px;margin-left:-36px;border:1px solid rgba(255,255,255,.42);border-bottom:0;border-radius:11px 11px 4px 4px;background:linear-gradient(90deg,#c8d0d3,#fff 48%,#b7c0c4);box-shadow:inset -7px 0 10px rgba(0,0,0,.13)}.xxiiiStoreSock:after{position:absolute;top:26px;left:0;width:100%;height:7px;background:rgba(41,54,59,.22);content:''}.xxiiiStoreBoot{position:relative;z-index:2;width:76px;height:37px;margin:-14px 0 12px -4px;border:1px solid rgba(255,255,255,.35);border-radius:17px 22px 9px 12px;background:linear-gradient(135deg,var(--boot-a,#1fe29d),var(--boot-b,#06734e) 66%,#07100d);box-shadow:inset -7px -6px 10px rgba(0,0,0,.3),0 5px 7px rgba(0,0,0,.28);transform:skewX(-8deg)}.xxiiiStoreBoot:before{position:absolute;top:8px;left:25px;width:28px;height:3px;border-radius:4px;background:rgba(255,255,255,.72);box-shadow:0 7px 0 rgba(255,255,255,.66),0 14px 0 rgba(255,255,255,.54);content:''}.xxiiiStoreBoot:after{position:absolute;right:-4px;bottom:-5px;width:67px;height:7px;border-radius:50%;background:#060908;content:''}
.xxiiiStoreCardBody{display:flex;min-height:0;flex:1;flex-direction:column;padding:12px}.xxiiiStoreCardTitle{margin:0;font-size:15px;font-weight:900;letter-spacing:.03em}.xxiiiStoreCardType{margin:3px 0 9px;color:rgba(255,255,255,.5);font-size:10px;font-weight:800;letter-spacing:.12em}.xxiiiStorePriceRow{display:flex;align-items:baseline;gap:7px;min-height:24px;margin-top:auto}.xxiiiStorePrice{color:#fff;font-size:16px;font-weight:900}.xxiiiStorePrice:before{margin-right:4px;color:#f4c542;content:'◉'}.xxiiiStoreOldPrice{color:rgba(255,255,255,.47);font-size:12px;font-weight:800;text-decoration:line-through}.xxiiiStorePromo{position:absolute;top:10px;right:10px;padding:5px 7px;border-radius:6px;background:#ff575f;color:#fff;font-size:9px;font-weight:950;letter-spacing:.09em}.xxiiiStoreOwned{color:#9dffc5;font-size:11px;font-weight:850}.xxiiiStoreCardAction{width:100%;min-height:35px;margin-top:10px;border:1px solid rgba(244,197,66,.54);border-radius:8px;background:rgba(244,197,66,.13);color:#fff;font:900 11px/1 Inter,Arial,sans-serif;letter-spacing:.06em;cursor:pointer}.xxiiiStoreCardAction:hover:not(:disabled){background:rgba(244,197,66,.3)}.xxiiiStoreCardAction:disabled{opacity:.48;cursor:not-allowed}.xxiiiStoreCardAction.isEquipped{border-color:rgba(124,240,165,.65);background:rgba(124,240,165,.12);color:#c6ffdb}
.xxiiiStoreEmpty{display:grid;min-height:230px;place-items:center;border:1px dashed rgba(255,255,255,.2);border-radius:14px;color:rgba(255,255,255,.55);font-weight:700;text-align:center}.xxiiiStoreSignIn{border:0;background:none;color:#f4c542;font:800 12px Inter,Arial,sans-serif;cursor:pointer;text-decoration:underline}
@media(max-width:650px){#xxiiiStoreOverlay{padding:0}.xxiiiStoreDialog{width:100%;height:100dvh;max-height:none;border:0;border-radius:0}.xxiiiStoreHead{padding:calc(env(safe-area-inset-top) + 11px) 14px 11px}.xxiiiStoreIntro{padding:11px 14px}.xxiiiStoreTabs{padding:0 14px 10px}.xxiiiStoreContent{padding:13px 14px calc(env(safe-area-inset-bottom) + 16px)}.xxiiiStoreGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.xxiiiStoreCard{min-height:242px}.xxiiiStoreVisual{height:116px}.xxiiiStoreSock{height:76px}.xxiiiStoreWallet{padding:7px 8px;font-size:12px}.xxiiiStoreTitle p{font-size:8px}.xxiiiStoreTitle h2{font-size:20px}}

.xxiiiAdminPage{min-height:100dvh;padding:clamp(18px,5vw,64px);box-sizing:border-box;background:radial-gradient(circle at 15% 0,#1b4c3a 0,transparent 34%),#07100e;color:#f4faf6;font-family:Inter,Arial,sans-serif}.xxiiiAdminShell{width:min(980px,100%);margin:0 auto}.xxiiiAdminHead{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}.xxiiiAdminEyebrow{margin:0 0 5px;color:#f4c542;font-size:11px;font-weight:900;letter-spacing:.18em}.xxiiiAdminHead h1{margin:0;font-size:clamp(24px,5vw,40px)}.xxiiiAdminHead p{max-width:630px;margin:8px 0 0;color:rgba(244,250,246,.68);font-size:14px;line-height:1.45}.xxiiiAdminButton{min-height:39px;padding:8px 13px;border:1px solid rgba(244,197,66,.55);border-radius:9px;background:rgba(244,197,66,.13);color:#fff;font:800 12px Inter,Arial,sans-serif;cursor:pointer}.xxiiiAdminButton:hover:not(:disabled){background:rgba(244,197,66,.27)}.xxiiiAdminButton:disabled{opacity:.48;cursor:not-allowed}.xxiiiAdminStatus{min-height:22px;margin:0 0 14px;color:#f4c542;font-weight:750}.xxiiiAdminTable{overflow:auto;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:rgba(255,255,255,.045)}.xxiiiAdminTable table{width:100%;min-width:820px;border-collapse:collapse}.xxiiiAdminTable th,.xxiiiAdminTable td{padding:12px;border-bottom:1px solid rgba(255,255,255,.1);text-align:left;font-size:12px}.xxiiiAdminTable th{color:rgba(255,255,255,.55);font-size:10px;letter-spacing:.1em}.xxiiiAdminTable tr:last-child td{border-bottom:0}.xxiiiAdminTable input{width:100%;min-height:33px;box-sizing:border-box;border:1px solid rgba(255,255,255,.2);border-radius:6px;background:rgba(0,0,0,.28);color:#fff;font:600 12px Inter,Arial,sans-serif;padding:5px 7px}.xxiiiAdminItem strong{display:block;font-size:13px}.xxiiiAdminItem small{color:rgba(255,255,255,.52);font-size:10px}.xxiiiAdminStarter{color:#9dffc5;font-size:10px;font-weight:900;letter-spacing:.08em}.xxiiiAdminNotice{margin:16px 0 0;padding:13px 15px;border:1px solid rgba(255,255,255,.13);border-radius:11px;background:rgba(255,255,255,.04);color:rgba(244,250,246,.71);font-size:12px;line-height:1.45}
.xxiiiAdminToolbar,.xxiiiAdminCreateHead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}.xxiiiAdminToolbar h2,.xxiiiAdminCreateHead h2{margin:0;font-size:18px}.xxiiiAdminCreate{margin:0 0 16px;padding:16px;border:1px solid rgba(124,240,165,.34);border-radius:14px;background:rgba(124,240,165,.055)}.xxiiiAdminFormGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.xxiiiAdminFormGrid label{display:grid;gap:5px;color:rgba(244,250,246,.7);font-size:11px;font-weight:800}.xxiiiAdminFormGrid select,.xxiiiAdminTable select{width:100%;min-height:33px;box-sizing:border-box;border:1px solid rgba(255,255,255,.2);border-radius:6px;background:#111c18;color:#fff;font:600 12px Inter,Arial,sans-serif;padding:5px 7px}.xxiiiAdminFormGrid input[type=file]{padding:6px}.xxiiiAdminCheckbox{display:flex!important;grid-column:auto;align-items:center;gap:8px;padding:8px;border:1px solid rgba(255,255,255,.13);border-radius:7px}.xxiiiAdminCheckbox input{width:auto!important}.xxiiiAdminHint{margin:12px 0;color:rgba(244,250,246,.58);font-size:11px;line-height:1.4}.xxiiiAdminTextButton{border:0;background:none;color:#f4c542;font:800 12px Inter,Arial,sans-serif;cursor:pointer}.xxiiiAdminThumb{display:block;width:48px;height:48px;object-fit:cover;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:#0a1110}.xxiiiAdminThumbFallback{display:grid;place-items:center;color:#f4c542;font-size:10px;font-weight:950}.xxiiiAdminItem input{min-width:145px;margin-bottom:5px}.xxiiiAdminItem select{margin-bottom:5px}.xxiiiAdminItem small{display:block;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.xxiiiAdminVisible{display:flex;align-items:center;gap:6px;color:#9dffc5;font-size:11px;font-weight:900}.xxiiiAdminVisible input{width:auto}.xxiiiAdminTable td:nth-child(8){min-width:190px}.xxiiiAdminTable td:nth-child(8) input{margin-bottom:5px}.xxiiiAdminTable td:nth-child(8) input:last-child{margin-bottom:0;width:78px}@media(max-width:650px){.xxiiiAdminFormGrid{grid-template-columns:1fr}.xxiiiAdminHead{flex-direction:column}.xxiiiAdminHead .xxiiiAdminButton{width:100%}}

/* One shared WebGL preview keeps the Store accurate without creating six
   GPU contexts on a phone.  Cards select the real GLB shown above them. */
.xxiiiStoreViewer{position:relative;height:190px;margin:0 20px 13px;overflow:hidden;border:1px solid rgba(124,240,165,.26);border-radius:14px;background:radial-gradient(circle at 50% 34%,rgba(102,247,185,.21),rgba(10,27,23,.34) 50%,rgba(2,6,6,.87))}.xxiiiStoreViewer canvas{display:block;width:100%;height:100%;touch-action:none}.xxiiiStoreViewerLabel{position:absolute;top:11px;left:13px;pointer-events:none}.xxiiiStoreViewerLabel strong{display:block;color:#fff;font-size:13px;letter-spacing:.06em}.xxiiiStoreViewerLabel span{display:block;margin-top:3px;color:rgba(255,255,255,.55);font-size:10px;font-weight:750}.xxiiiStoreViewerHint{position:absolute;right:13px;bottom:10px;color:rgba(255,255,255,.48);font-size:10px;font-weight:750;pointer-events:none}.xxiiiStoreCard{cursor:pointer}.xxiiiStoreCard.isPreviewed{border-color:#f4c542;box-shadow:0 0 0 1px rgba(244,197,66,.22),0 10px 22px rgba(0,0,0,.26)}
@media(max-width:650px){.xxiiiStoreViewer{height:158px;margin:0 14px 11px}}

/* Store header and card-level 3D previews.  A single transparent renderer
   layer is scissored into every boot card, so the UI gets six real previews
   without opening six WebGL contexts on a phone. */
.xxiiiStoreDialog{position:relative}.xxiiiStoreHead{position:relative;z-index:4;flex:none;justify-content:space-between;min-height:58px;padding:10px 20px}.xxiiiStoreBack{z-index:1;min-height:36px;padding:7px 11px;border:1px solid rgba(255,255,255,.22);border-radius:8px;background:rgba(8,15,13,.74);color:#fff;font:850 11px/1 Inter,Arial,sans-serif;letter-spacing:.07em;cursor:pointer}.xxiiiStoreBack:hover{border-color:#f4c542;background:rgba(244,197,66,.14)}.xxiiiStoreBrand{position:absolute;top:50%;left:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;transform:translate(-50%,-50%)}.xxiiiStoreBrand img{display:block;width:clamp(118px,18vw,176px);height:auto;filter:drop-shadow(0 3px 9px rgba(0,0,0,.48))}.xxiiiStoreBrand strong{margin-top:-4px;color:#fff;font-size:11px;font-weight:950;letter-spacing:.21em;line-height:1}.xxiiiStoreHeadRight{z-index:1;display:flex;align-items:center;gap:12px}.xxiiiStoreRenderLayer{position:absolute;z-index:2;inset:0;display:block;width:100%;height:100%;pointer-events:none}.xxiiiStoreIntro,.xxiiiStoreTabs{position:relative;z-index:4;flex:none}.xxiiiStoreContent{position:relative;z-index:3;flex:1 1 auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.xxiiiStoreVisual{cursor:grab;touch-action:none;background:radial-gradient(circle at 50% 48%,rgba(255,255,255,.075),rgba(8,14,13,.30) 55%,rgba(3,7,8,.84))}.xxiiiStoreVisual:active{cursor:grabbing}.xxiiiStoreVisual:after{display:none}
.xxiiiStoreCard{min-height:294px}.xxiiiStoreVisual{height:176px;place-items:normal}.xxiiiStoreCardTitle{position:absolute;z-index:3;top:12px;left:13px;margin:0;color:#fff;font-size:14px;font-weight:950;letter-spacing:.055em;line-height:1;text-shadow:0 2px 5px rgba(0,0,0,.78)}.xxiiiStoreCardBody{padding:10px 12px 12px}.xxiiiStorePriceRow{min-height:22px;margin-top:0}
.xxiiiStoreThumbnail{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 12px rgba(0,0,0,.42))}
@media(max-width:650px){.xxiiiStoreHead{min-height:49px;padding:8px 14px}.xxiiiStoreBack{min-height:33px;padding:6px 8px;font-size:10px}.xxiiiStoreBrand img{width:120px}.xxiiiStoreBrand strong{font-size:9px}.xxiiiStoreHeadRight{gap:7px}.xxiiiStoreClose{width:34px;height:34px}.xxiiiStoreWallet{padding:7px 8px}}
@media(max-width:650px){.xxiiiStoreCard{min-height:260px}.xxiiiStoreVisual{height:151px}.xxiiiStoreCardTitle{top:10px;left:11px;font-size:12px}}

/* Mobile Store: a boot is the product, so give its real 3D preview a full
   card width in portrait.  Landscape phones retain a compact three-column
   gallery while each viewport remains large enough for a useful rotation. */
@media (max-width:650px) and (orientation:portrait){
  #xxiiiStoreOverlay{padding:0}
  .xxiiiStoreDialog{width:100%;height:100dvh;max-height:none;border:0;border-radius:0}
  .xxiiiStoreHead{min-height:52px;padding:calc(env(safe-area-inset-top) + 8px) 14px 8px}
  .xxiiiStoreIntro{padding:8px 14px 7px;font-size:11px}
  .xxiiiStoreTabs{gap:6px;padding:0 14px 9px}
  .xxiiiStoreTab{min-height:32px;padding:5px 10px;font-size:11px}
  .xxiiiStoreContent{padding:10px 14px calc(env(safe-area-inset-bottom) + 18px)}
  .xxiiiStoreStatus{min-height:16px;margin-bottom:7px;font-size:11px}
  .xxiiiStoreGrid{grid-template-columns:minmax(0,1fr);gap:13px}
  .xxiiiStoreCard{min-height:342px;border-radius:15px}
  .xxiiiStoreVisual{height:254px}
  .xxiiiStoreCardTitle{top:14px;left:15px;font-size:15px}
  .xxiiiStoreCardBody{min-height:70px;padding:10px 13px 12px}
  .xxiiiStorePriceRow{min-height:20px}
  .xxiiiStoreCardAction{min-height:39px;margin-top:7px;font-size:12px}
}

@media (max-height:520px) and (orientation:landscape){
  #xxiiiStoreOverlay{padding:0}
  .xxiiiStoreDialog{width:100%;height:100dvh;max-height:none;border:0;border-radius:0}
  .xxiiiStoreHead{min-height:42px;padding:6px 14px}
  .xxiiiStoreBack{min-height:30px;padding:5px 8px}
  .xxiiiStoreBrand img{width:106px}.xxiiiStoreBrand strong{font-size:8px}
  .xxiiiStoreClose{width:31px;height:31px;font-size:24px}.xxiiiStoreWallet{padding:5px 7px}
  .xxiiiStoreIntro{display:none}
  .xxiiiStoreTabs{padding:7px 12px;border-top:1px solid rgba(255,255,255,.08)}
  .xxiiiStoreTab{min-height:29px;padding:4px 9px;font-size:10px}
  .xxiiiStoreContent{padding:7px 12px 14px}
  .xxiiiStoreStatus{min-height:14px;margin:0 0 5px;font-size:10px}
  .xxiiiStoreGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
  .xxiiiStoreCard{min-height:218px;border-radius:12px}
  .xxiiiStoreVisual{height:133px}
  .xxiiiStoreCardTitle{top:9px;left:10px;font-size:11px}
  .xxiiiStorePromo{top:8px;right:8px;padding:4px 5px;font-size:8px}
  .xxiiiStoreCardBody{padding:7px 9px 9px}
  .xxiiiStorePrice,.xxiiiStoreOldPrice{font-size:12px}
  .xxiiiStoreCardAction{min-height:30px;margin-top:5px;font-size:9px}
}

/* The admin is operated on a desktop screen: retain every editor column in
   the visible 16:9 workspace instead of forcing horizontal table scrolling. */
@media(min-width:1100px){
  .xxiiiAdminPage{padding:24px 28px;overflow-x:hidden}
  .xxiiiAdminShell{width:100%;max-width:none;margin:0}
  .xxiiiAdminTable{overflow:visible}
  .xxiiiAdminTable table{min-width:0;table-layout:fixed}
  .xxiiiAdminTable th,.xxiiiAdminTable td{padding:10px 8px;vertical-align:top}
  .xxiiiAdminTable th:nth-child(1),.xxiiiAdminTable td:nth-child(1){width:4%}
  .xxiiiAdminTable th:nth-child(2),.xxiiiAdminTable td:nth-child(2){width:16%}
  .xxiiiAdminTable th:nth-child(3),.xxiiiAdminTable td:nth-child(3),.xxiiiAdminTable th:nth-child(4),.xxiiiAdminTable td:nth-child(4){width:8%}
  .xxiiiAdminTable th:nth-child(5),.xxiiiAdminTable td:nth-child(5),.xxiiiAdminTable th:nth-child(6),.xxiiiAdminTable td:nth-child(6){width:12%}
  .xxiiiAdminTable th:nth-child(7),.xxiiiAdminTable td:nth-child(7){width:6%}
  .xxiiiAdminTable th:nth-child(8),.xxiiiAdminTable td:nth-child(8){width:24%}
  .xxiiiAdminTable th:nth-child(9),.xxiiiAdminTable td:nth-child(9){width:8%}
  .xxiiiAdminTable input,.xxiiiAdminTable select{min-width:0}
  .xxiiiAdminTable input[type=datetime-local]{font-size:11px;padding-inline:4px}
  .xxiiiAdminThumb{width:44px;height:44px}
}

/* Uploaded photos share the admin crop and Cosmetic Pass frame. */
.xxiiiStoreVisual:has(.xxiiiStoreThumbnail){height:auto;aspect-ratio:3/2}.xxiiiStoreVisual .xxiiiStoreThumbnail{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:none}

/* Full-length kits use a portrait preview while keeping the existing grid. */
.xxiiiStoreKitCard .xxiiiStoreVisual,
.xxiiiStoreKitCard .xxiiiStoreVisual:has(.xxiiiStoreThumbnail){height:auto;aspect-ratio:4 / 5;flex:none}