:root{--paper:#ececec;--black:#050505;--line:#1a1a1a;--ui:12px;--ease:cubic-bezier(.19,1,.22,1)}
*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;background:var(--paper);color:var(--black)}html{scroll-behavior:smooth}body{overflow:hidden}.app{width:100%;height:100dvh;min-height:460px;position:relative;background:var(--paper);overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid #111;outline-offset:4px}button:not(.shop-icon){touch-action:manipulation}
.topbar{height:48px;position:absolute;z-index:80;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 24px;pointer-events:none}.topbar>*{pointer-events:auto}.signal{display:flex;gap:12px;align-items:center;font-size:12px;white-space:nowrap;min-width:220px}.signal-bars{display:flex;align-items:end;gap:2px;height:12px;margin-right:-5px}.signal-bars i{width:3px;background:#a5a5a5;display:block}.signal-bars i:nth-child(1){height:4px}.signal-bars i:nth-child(2){height:6px}.signal-bars i:nth-child(3){height:9px}.signal-bars i:nth-child(4){height:12px}.wordmark{border:0;background:transparent;font-size:24px;letter-spacing:-.09em;font-weight:400;position:absolute;left:50%;transform:translateX(-50%);padding:0;line-height:1}.wordmark sup,.receipt-brand sup{vertical-align:super;font-size:9px;letter-spacing:0;padding-left:1px}.header-right{margin-left:auto;display:flex;gap:16px;align-items:center;font-size:11px}.battery{display:flex;align-items:center;gap:5px}.battery-shape{width:23px;height:12px;border:1.3px solid #000;border-radius:2px;display:flex;align-items:center;padding:2px;position:relative}.battery-shape:after{content:"";position:absolute;right:-4px;width:2px;height:5px;background:#111;border-radius:1px}.battery-level{width:12%;height:100%;background:#111}.outline-btn{border:1px dashed #111;background:transparent;border-radius:50px;height:33px;min-width:97px;padding:0 16px;font-size:11px;transition:background .2s,color .2s}.outline-btn:hover{background:#000;color:white}
.qr{position:absolute;z-index:20;top:56px;left:24px;width:48px;height:48px;display:block;mix-blend-mode:multiply}.qr img{width:100%;height:100%;image-rendering:pixelated}.edge-label{position:absolute;z-index:45;left:24px;top:50%;transform:translateY(-50%);height:80px;width:36px;border:1px dashed #111;background:#fafafa00;border-radius:25px;writing-mode:vertical-rl;transform-origin:center;rotate:180deg;top:calc(50% - 40px);font-size:12px;line-height:1;text-align:center;transition:background .2s,color .2s}.edge-label:hover{background:#000;color:white}.mode-toggle{position:absolute;z-index:45;right:24px;top:50%;transform:translateY(-50%);width:38px;height:122px;border:1px dashed #111;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;background:#f0f0f0}.mode-btn{border:0;background:transparent;flex:1;writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;text-align:center;line-height:36px;display:flex;align-items:center;justify-content:center}.mode-btn.active{background:#000;color:white;border-radius:17px}.mode-btn:hover:not(.active){background:#ddd}
.content,.fashion-stage,.models{height:100%;width:100%;position:absolute;inset:0}.fashion-stage{overflow:hidden;touch-action:pan-y;user-select:none}.models{pointer-events:none}.model{position:absolute;top:0;left:0;display:block;transform:translate(-50%,-50%) scale(1);transform-origin:center;object-fit:contain;transition:top 820ms var(--ease),left 820ms var(--ease),height 820ms var(--ease),filter 820ms var(--ease),opacity 580ms ease,transform 820ms var(--ease);will-change:transform,top,left;pointer-events:auto;cursor:pointer;outline:none}.model:hover{filter:blur(0px)!important}.model:focus-visible{outline:1px dashed #111;border-radius:20px}.model.is-center{cursor:zoom-in}.model.is-back{cursor:pointer}.model.is-grid{cursor:pointer}.model.is-detail{cursor:default}.model.is-hidden{pointer-events:none}.model:active{cursor:grabbing}.model img{width:auto;height:100%;display:block;user-select:none;pointer-events:none}.model .grid-label{display:none;position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);font-size:12px;color:#666;white-space:nowrap;line-height:1.2}.app[data-mode=grid] .model .grid-label{display:block}.app[data-mode=grid] .model:hover .grid-label{color:#050505}.grid-label strong{font-weight:normal;margin-right:9px}.app[data-mode=grid] .model:hover{transform:translate(-50%,-50%) scale(1.06)}
.drag-indicator{position:absolute;z-index:35;width:78px;height:78px;border-radius:50%;border:1px dashed #111;display:grid;place-items:center;font-size:11px;background:#ecececcc;pointer-events:none;top:61%;left:69%;transform:translate(-50%,-50%);transition:opacity .35s}.look-caption{position:absolute;z-index:45;left:32px;bottom:31px;max-width:34%;pointer-events:none;transition:opacity .2s}.caption-eyebrow{font-size:12px;display:flex;gap:14px;align-items:center;margin-bottom:8px;line-height:1}.play-control{border:1px dashed #000;border-radius:50%;background:transparent;font-size:12px;height:23px;width:23px;padding:0;pointer-events:auto;display:grid;place-items:center;line-height:1}.play-control:hover{background:#111;color:white}.look-caption h1{font-size:32px;font-weight:400;letter-spacing:-.065em;line-height:.96;margin:0;text-transform:uppercase}.bottom-products{position:absolute;z-index:45;left:50%;bottom:31px;transform:translateX(-50%);display:flex;gap:8px;justify-content:center;align-items:center;white-space:nowrap;max-width:58%;transition:opacity .2s}.product-pill{height:59px;border:1px dashed #111;border-radius:50px;display:flex;align-items:center;background:#ecececaa;padding:3px 17px 3px 5px;gap:10px;min-width:175px;cursor:pointer;transition:background .2s,border-color .2s}.product-pill:hover{background:#fff}.product-pill img{height:49px;width:49px;object-fit:cover;border-radius:50%;background:#ddd;flex:none}.product-pill .pill-copy{font-size:11px;text-align:left;line-height:1.35;letter-spacing:-.015em}.shop-fit{position:absolute;z-index:45;right:32px;bottom:31px;display:flex;gap:17px;align-items:center;background:none;border:0;font-size:11px;padding:0}.shop-icon{width:65px;height:65px;background:black;color:white;display:grid;place-items:center;border-radius:50%;font-size:33px;font-weight:200;transition:transform .3s var(--ease)}.shop-fit:hover .shop-icon{transform:rotate(90deg) scale(1.08)}
.detail-heading{display:none;position:absolute;left:49px;top:61px;z-index:46;font-size:40px;letter-spacing:-.055em;line-height:1.1;font-weight:400}.detail-heading em{font-style:italic}.circle-close{border:1px dashed #111;background:transparent;width:47px;height:47px;border-radius:50%;font-size:24px;font-weight:200;display:grid;place-items:center;transition:background .2s,color .2s}.circle-close:hover{background:#000;color:white}.detail-close{display:none;position:absolute;z-index:61;right:calc(min(26vw,380px) + 13px);top:62px}.hotspots{display:none;position:absolute;inset:0;z-index:42;pointer-events:none}.hotspot{position:absolute;border:1px dashed #111;border-radius:25px;padding:10px 15px;background:#f6f6f6d9;display:flex;gap:16px;align-items:center;font-size:11px;white-space:nowrap;pointer-events:auto;transform:translate(-50%,-50%);transition:background .2s}.hotspot:hover{background:white}.hotspot span:last-child{opacity:.8}.hotspot.pin-only{height:27px;width:27px;background:#050505;color:white;padding:0;display:grid;place-items:center;font-size:16px}.hotspot.pin-only:hover{background:#eee;color:#000}.grid-legend{display:none;position:absolute;bottom:26px;left:50%;transform:translateX(-50%);font-size:10px;color:#999;letter-spacing:.06em}
.app[data-mode=grid] .look-caption,.app[data-mode=grid] .bottom-products,.app[data-mode=grid] .shop-fit,.app[data-mode=grid] .drag-indicator{opacity:0;pointer-events:none}.app[data-mode=grid] .grid-legend{display:block}.app[data-mode=detail] .look-caption,.app[data-mode=detail] .bottom-products,.app[data-mode=detail] .shop-fit,.app[data-mode=detail] .drag-indicator,.app[data-mode=detail] .edge-label,.app[data-mode=detail] .mode-toggle{opacity:0;pointer-events:none}.app[data-mode=detail] .detail-heading,.app[data-mode=detail] .detail-close,.app[data-mode=detail] .hotspots{display:block}.app[data-mode=detail] .model:not(.is-detail){pointer-events:none}
.receipt{position:absolute;z-index:50;right:24px;top:62px;width:336px;background:#fff;transform:translateX(calc(100% + 55px));transition:transform 700ms var(--ease),opacity .4s;opacity:0;box-shadow:0 12px 30px #00000005}.receipt:after{position:absolute;content:"";top:100%;width:100%;height:14px;left:0;background:linear-gradient(135deg,#fff 25%,transparent 25%) -7px 0/14px 14px,linear-gradient(225deg,#fff 25%,transparent 25%) -7px 0/14px 14px}.app[data-mode=detail] .receipt{transform:translateX(0);opacity:1}.receipt-inner{padding:21px 24px 26px}.receipt-heading{border-bottom:1px solid #111;text-align:center;padding:3px 0 14px}.receipt-brand{font-size:32px;letter-spacing:-.08em;line-height:1}.receipt-heading p{font-size:8px;line-height:1.45;margin:7px 0 0;letter-spacing:.04em}.receipt-items{border-bottom:1px dashed #111;padding-top:12px}.receipt-item{display:grid;grid-template-columns:1fr auto;gap:8px;font-size:10px;line-height:1.2;padding:7px 0;border-bottom:1px dashed #aaa}.receipt-item:last-child{border-bottom:0}.receipt-item span:nth-child(2){font-size:10px}.receipt-item small{display:block;font-size:9px;color:#9a9a9a;margin-top:2px}.receipt-counts{padding:9px 0;border-bottom:1px dashed #111}.receipt-counts>div{display:flex;justify-content:space-between;font-size:9px;margin:3px 0}.receipt-counts>div span:last-child{font-size:9px}.receipt-total{display:flex;justify-content:space-between;align-items:center;font-size:30px;letter-spacing:-.065em;padding:12px 0 14px}.add-fit{border:0;background:black;color:#fff;width:100%;height:48px;font-size:11px;display:flex;align-items:center;justify-content:center;gap:14px}.add-fit:hover{background:#303030}.add-fit span{font-size:26px;font-weight:200}.barcode{height:41px;margin:23px 0 11px;background:repeating-linear-gradient(to right,#000 0,#000 1px,transparent 1px,transparent 3px,#000 3px,#000 5px,transparent 5px,transparent 8px,#000 8px,#000 9px,transparent 9px,transparent 11px,#000 11px,#000 12px,transparent 12px,transparent 16px)}.receipt-foot{text-align:center;font-size:10px}
.bag-scrim{position:absolute;inset:0;background:#0002;z-index:90;opacity:0;pointer-events:none;transition:opacity .35s}.bag-panel{position:absolute;right:0;top:0;bottom:0;background:#fff;z-index:91;width:min(440px,100%);display:flex;flex-direction:column;transform:translateX(105%);transition:transform 600ms var(--ease);padding:30px 28px}.app.bag-open .bag-panel{transform:translateX(0)}.app.bag-open .bag-scrim{opacity:1;pointer-events:auto}.bag-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #111;padding-bottom:25px}.bag-head h2{font-size:31px;letter-spacing:-.055em;font-weight:400;margin:0}.bag-list{overflow-y:auto;flex:1}.empty-bag{font-size:13px;padding-top:30px;color:#777}.bag-item{display:grid;grid-template-columns:72px 1fr auto;gap:15px;align-items:center;padding:17px 0;border-bottom:1px dashed #999}.bag-item img{width:72px;height:88px;object-fit:contain}.bag-item h3{font-size:13px;margin:0 0 8px;font-weight:400}.bag-item p{font-size:11px;color:#777;margin:0}.bag-item button{border:0;background:transparent;text-decoration:underline;font-size:10px;color:#555;padding:0;margin-top:8px}.bag-item>span{font-size:12px}.bag-bottom{border-top:1px solid #111;padding-top:18px}.bag-total{display:flex;justify-content:space-between;font-size:25px;letter-spacing:-.06em}.concept-note{font-size:10px;color:#777;margin:25px 0 10px}.back-to-looks{width:100%;background:#000;color:white;border:0;height:48px;font-size:11px}.toast{position:absolute;z-index:95;left:50%;bottom:115px;transform:translateX(-50%) translateY(15px);padding:14px 20px;background:#000;color:white;font-size:11px;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}.toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:1120px){.bottom-products{bottom:25px;gap:5px}.product-pill{min-width:0;padding-right:12px;gap:5px;height:49px}.product-pill img{height:40px;width:40px}.product-pill .pill-copy{font-size:10px}.shop-fit{bottom:25px}.look-caption{bottom:27px}.look-caption h1{font-size:25px}.receipt{right:15px}.detail-close{right:365px}}
@media(max-width:760px){.app{min-height:480px}.topbar{padding:0 12px;height:54px}.signal{gap:5px;min-width:0;font-size:9px}.signal-bars{display:none}.signal span:last-child{display:none}.wordmark{font-size:21px}.header-right{gap:9px}.battery{font-size:9px}.battery-shape{width:17px;height:9px}.outline-btn{min-width:65px;height:30px;padding:0 8px;font-size:10px}.qr{left:13px;top:67px;width:36px;height:36px}.edge-label{left:10px;width:30px;height:73px;top:calc(50% - 36px);font-size:10px}.mode-toggle{right:10px;width:32px;height:110px}.mode-btn{font-size:10px;line-height:30px}.drag-indicator{width:54px;height:54px;font-size:9px;left:68%;top:63%}.look-caption{left:17px;bottom:98px;max-width:72%}.look-caption h1{font-size:29px}.caption-eyebrow{font-size:10px}.bottom-products{left:17px;bottom:23px;right:16px;width:calc(100% - 33px);max-width:none;transform:none;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;padding-bottom:3px}.bottom-products::-webkit-scrollbar{display:none}.product-pill{flex:0 0 auto;height:44px;min-width:120px;padding:2px 9px 2px 3px}.product-pill img{height:37px;width:37px}.product-pill .pill-copy{font-size:9px}.shop-fit{right:17px;bottom:93px;gap:8px;font-size:9px}.shop-icon{height:46px;width:46px;font-size:23px}.detail-heading{left:17px;top:78px;font-size:26px}.detail-close{right:17px;top:72px;width:38px;height:38px;font-size:20px}.receipt{width:100%;max-height:47dvh;overflow:auto;right:0;top:auto;bottom:0;transform:translateY(110%);box-shadow:0 -10px 35px #00000008}.receipt:after{display:none}.app[data-mode=detail] .receipt{transform:translateY(0)}.receipt-inner{padding:15px 23px 23px}.receipt-heading{display:flex;align-items:center;justify-content:space-between;padding-bottom:8px}.receipt-brand{font-size:26px}.receipt-heading p{text-align:right;font-size:8px}.receipt-items{padding-top:7px}.receipt-item{padding:4px 0}.receipt-counts{padding:6px 0}.receipt-total{font-size:24px;padding:7px 0}.add-fit{height:43px}.barcode{height:28px;margin:12px 0 8px}.receipt-foot{font-size:9px}.hotspot{padding:5px 10px;font-size:9px;gap:7px}.grid-legend{bottom:12px;font-size:8px}.app[data-mode=detail] .model.is-detail{top:33%!important;height:40dvh!important;left:50%!important}.app[data-mode=grid] .model .grid-label{font-size:9px;text-align:center;white-space:normal;min-width:100px;line-height:1.4}.app[data-mode=grid] .model .grid-label strong{margin-right:4px}}
@media(max-height:600px) and (min-width:761px){.look-caption,.bottom-products,.shop-fit{bottom:15px}.product-pill{height:45px}.product-pill img{height:37px;width:37px}.shop-icon{height:48px;width:48px}.detail-heading{font-size:30px}.receipt{top:52px;max-height:calc(100% - 75px);overflow-y:auto}.receipt-inner{padding:13px 20px}.receipt-total{font-size:23px}.barcode{margin:12px 0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* Remove browser-native button boxes from the model cutouts. */
.model{appearance:none;-webkit-appearance:none;border:0;background:none;padding:0;margin:0;border-radius:0}
.app[data-mode=detail] .qr{opacity:0;pointer-events:none}
@media(max-width:760px){.shop-fit span:first-child{display:none}.app[data-mode=grid] .looks-toggle{opacity:0;pointer-events:none}.app[data-mode=detail] .detail-heading{left:20px}}
