@layer components{html:has(.design){--stage-drop:calc(var(--top-block) + var(--space-8));--stage-top:var(--stage-drop);--stage-block:var(--stage-top) calc(100% - var(--design-above));--object-block:31svh;--design-above:calc(var(--object-block) + .75rem + var(--stage-drop));--design-below:calc(var(--control) + var(--space-40));--band-clear:calc(var(--control) + var(--space-12) * 2 + env(safe-area-inset-bottom,0px));--band-block:calc(var(--space-8) + var(--stage-drop) + var(--object-block) + var(--space-8));--stage-leave:calc(var(--band-block) + var(--band-clear));--stage-gone:calc(var(--stage-top) + var(--object-block) - var(--top-block));--page-gutter:calc(var(--gutter-phone) + max(0px, (100vw - var(--content-max)) / 2));scroll-padding-block:calc(var(--band-block) + var(--space-24)) var(--design-below);overflow-x:clip}html:has(.design[data-scene]){scroll-padding-block-end:0}.design{display:grid}.design__stage{z-index:1;justify-items:center;gap:var(--space-4);background:var(--ground-grain), var(--ground);background-blend-mode:multiply;padding-block:calc(var(--space-8) + var(--stage-drop)) var(--space-8);block-size:var(--band-block);margin-block-end:var(--band-clear);margin-inline:calc(-1 * var(--gutter-phone));padding-inline:var(--gutter-phone);display:grid;position:sticky;inset-block-start:0}.design__poster{justify-items:center;gap:var(--space-4);inline-size:min(100%,92vw);margin:0;display:grid}.design__object{inline-size:100%;block-size:var(--object-block);place-items:center;display:grid}@media (min-width:768px){.design__sewing{inline-size:clamp(160px,34%,220px)}}.design__turn>.sbt-turn:not(.sbt-turn--share){animation:.6s ease-in-out .32s both stage-in-plain}@media (prefers-reduced-motion:reduce){.design__turn>.sbt-turn:not(.sbt-turn--share){animation:none}}html:has(.stage:is([data-stage=live],[data-stage=poster])) .design__preparing{display:none}.design__poster img{inline-size:100%;block-size:var(--object-block);object-fit:cover}:where(html:has(.stage[data-stage=poster])) .design__object{display:none}html:has(.design) .stage{z-index:2}.design .sbt-strip__input{block-size:var(--control)}html:has(.design:is(:not([data-scene]),[data-scene=paid])) .stage canvas{pointer-events:auto;touch-action:none;cursor:grab}html:has(.design:is(:not([data-scene]),[data-scene=paid])) .stage canvas:active{cursor:grabbing}.design__turn{z-index:3;position:fixed;inset-block-start:0;inset-inline-start:0}.design__turn[hidden]{visibility:hidden;display:block}.design__stage:after{content:"";block-size:var(--space-24);pointer-events:none;background:var(--ground-grain), var(--ground);background-blend-mode:multiply;position:absolute;inset-block-start:100%;inset-inline:0;-webkit-mask-image:linear-gradient(#000,#0000);mask-image:linear-gradient(#000,#0000)}@media (min-width:1024px){.design__stage:after{display:none}}.design__panel{isolation:isolate;align-content:start;gap:0;margin-block-start:calc(-1 * var(--band-clear));display:grid}.design__title{justify-items:center;margin:0;display:grid}.design__headline{display:none}.design__build{font-size:var(--text-body);color:var(--ink-muted);justify-self:center;margin:2px 0 0;font-weight:400;display:none}.design__resume{gap:var(--space-12);margin:var(--space-24) 0 0;justify-self:center;justify-items:center;display:grid}.design__resumeAsk{max-inline-size:var(--measure);font-size:var(--text-body);color:var(--ink-muted);text-align:center;text-wrap:balance;margin:0}.design__resumeTabs{justify-content:center}.design__consent{margin:var(--space-24) 0 0;font-size:var(--text-caption);color:var(--ink-muted)}.design__chapter{gap:var(--space-24);display:grid}.design__chapter .sbt-group:has(#g-packaging):not(:first-child){margin-block-start:var(--space-24)}.design__extras{border-block:1px dashed color-mix(in srgb, var(--stitch) 60%, transparent);margin-block-start:var(--space-32)}.design__extrasHead{grid-template-columns:minmax(0, 1fr) var(--touch-min);align-items:center;column-gap:var(--space-12);min-block-size:64px;padding-block:var(--space-12);cursor:pointer;list-style:none;display:grid}.design__extrasHead::-webkit-details-marker{display:none}.design__extrasName{font-size:var(--text-body-lg);color:var(--ink);margin:0;font-weight:400}.design__extrasSaid{font-size:var(--text-body);color:var(--ink-muted);text-wrap:pretty;grid-column:1}.design__plus{box-sizing:border-box;inline-size:var(--touch-min);block-size:var(--touch-min);background:var(--ground-raised);outline:1.3px dashed var(--stitch);outline-offset:-4px;fill:none;stroke:var(--ink);stroke-width:1.6px;stroke-linecap:round;transition:rotate .3s var(--ease);border-radius:50%;grid-area:1/2/span 2;padding:13px}.design__extras[open] .design__plus{rotate:45deg}.design__extrasHead:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:8px}.design__extras>.design__chapter{padding-block:var(--space-8) var(--space-32)}.design__charmsStep{margin-block-start:var(--space-32)}.design__chapter :is(.sbt-formats,.sbt-book__ring,.sbt-materials,.sbt-tabs,.sbt-counts,.sbt-closures,.sbt-slots,.sbt-leaves):not(dialog *){overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:var(--gutter-phone);scrollbar-width:none;margin-block:calc(-1 * var(--space-8));margin-inline:calc(-1 * var(--gutter-phone));padding-block:calc(var(--lift,0px) + var(--space-8)) var(--space-8);padding-inline:var(--gutter-phone);flex-wrap:nowrap;display:flex;overflow-x:auto}.design__chapter :is(.sbt-formats,.sbt-book__ring,.sbt-materials,.sbt-tabs,.sbt-counts,.sbt-closures,.sbt-slots,.sbt-leaves):not(dialog *)::-webkit-scrollbar{display:none}.design__chapter :is(.sbt-formats,.sbt-book__ring,.sbt-materials,.sbt-tabs,.sbt-counts,.sbt-closures,.sbt-slots,.sbt-leaves):not(dialog *)>*{scroll-snap-align:start;flex:none}.design__chapter :is(.sbt-book__ring,.sbt-materials){--lift:4px;column-gap:var(--tile-gap)}.design__chapter :is(.sbt-book__ring>.sbt-sample,.sbt-materials>.sbt-material){inline-size:76px}.design__chapter :is(.sbt-book__ring>.sbt-sample,.sbt-materials>.sbt-material)>:last-child{overflow-wrap:anywhere;grid-template-rows:minmax(2lh,auto) auto;align-content:start;justify-items:center;display:grid}.design__chapter .sbt-book__ring .sbt-sample__leather,.design__chapter .sbt-materials .sbt-material__face{transform:none}.design__chapter .sbt-book__ring .sbt-sample[data-checked] .sbt-sample__leather,.design__chapter .sbt-materials .sbt-material[data-checked] .sbt-material__face{outline:2px solid var(--primary);outline-offset:3px;transform:translateY(-4px)}.design__chapter :is(.sbt-tab:has(.sbt-glyph),.sbt-closure,.sbt-format){inline-size:150px}.design__chapter .sbt-tab.sbt-tab--charm{inline-size:var(--tile);block-size:var(--tile);grid-template-columns:auto;place-items:center;padding:0;display:grid}.design__chapter .sbt-tab.sbt-tab--charm>svg{grid-area:auto}.design__letters text{font-family:var(--font-latin-display);transition:opacity .4s var(--ease);font-size:26px}.design__letters text[data-off]{opacity:0}.design__chapter .sbt-slot{grid-template-rows:44px minmax(2lh,auto);align-items:start;inline-size:124px;padding:12px}.sbt-spot[data-lit] i{position:relative}.sbt-spot[data-lit]:before,.sbt-spot[data-lit]:after,.sbt-spot[data-lit] i:before,.sbt-spot[data-lit] i:after{content:"";background:var(--foil-gold);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);opacity:0;pointer-events:none;block-size:7px;inline-size:7px;position:absolute}.sbt-spot[data-lit]:before{opacity:1;inset-block-start:3px;inset-inline-start:5px}.sbt-spot[data-lit]:after{background:color-mix(in srgb, var(--foil-gold), var(--primary) 30%);block-size:5px;inline-size:5px;inset-block-end:4px;inset-inline-end:3px}.sbt-spot[data-lit] i:before{block-size:6px;inline-size:6px;inset-block-start:-7px;inset-inline-end:-6px}.sbt-spot[data-lit] i:after{background:color-mix(in srgb, var(--foil-gold), var(--primary) 30%);block-size:5px;inline-size:5px;inset-block-end:-6px;inset-inline-start:-7px}@media (prefers-reduced-motion:no-preference){.sbt-spot[data-lit]:before,.sbt-spot[data-lit]:after,.sbt-spot[data-lit] i:before,.sbt-spot[data-lit] i:after{animation:2s ease-in-out infinite both spot-spark}.sbt-spot[data-lit]:after{animation-delay:.5s}.sbt-spot[data-lit] i:before{animation-delay:1s}.sbt-spot[data-lit] i:after{animation-delay:1.5s}}@keyframes spot-spark{0%,to{opacity:0;transform:scale(.3)rotate(0)}50%{opacity:1;transform:scale(1)rotate(45deg)}}@media (prefers-reduced-motion:no-preference){.design__chapter :is(.sbt-formats,.sbt-book__ring,.sbt-materials,.sbt-tabs,.sbt-counts,.sbt-closures,.sbt-slots,.sbt-leaves):not(dialog *){scroll-behavior:smooth}}@supports (interpolate-size:allow-keywords){.design__extras{interpolate-size:allow-keywords}.design__extras::details-content{block-size:0;transition:block-size .42s var(--ease), content-visibility .42s allow-discrete;overflow:clip}.design__extras[open]::details-content{block-size:auto}}@media (prefers-reduced-motion:reduce){.design__plus{transition:none}.design__extras::details-content{transition:none}}.design__now{gap:var(--space-8);margin:var(--space-16) 0 0;max-inline-size:420px;display:grid}.design__now .design__said{margin:0}.design__editing{align-items:center;gap:0 var(--space-8);padding:var(--space-8) var(--space-16);max-inline-size:420px;min-block-size:var(--touch-min);border-radius:var(--radius-tile);outline:var(--stitch-width) dashed var(--ink);outline-offset:calc(-1 * var(--stitch-inset));font-size:var(--text-caption);color:var(--ink-muted);flex-wrap:wrap;margin:0;margin-block-start:var(--space-16);display:flex}.design__editing b{align-items:center;gap:var(--space-8);color:var(--ink);font-weight:600;display:inline-flex}.design__editing b:before{content:"";background:var(--leather);block-size:12px;inline-size:12px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ink) 25%, transparent);border-radius:50%}.design__editing b bdi{font-weight:400}.design__editing .sbt-thread-link{min-block-size:var(--touch-min);min-inline-size:var(--touch-min);justify-content:center;margin-inline-start:auto}.design__editing .design__said{flex-basis:100%;margin:0;margin-block-end:var(--space-8)}.design__matching{gap:var(--space-8);justify-items:start;margin-block-start:var(--space-32);display:grid}.design__matched:empty{display:none}.design__add{align-items:center;gap:var(--space-12);min-block-size:var(--touch-min);font:inherit;font-size:var(--text-body);color:var(--ink);text-align:start;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;padding:0;display:flex}.design__add:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:6px}.design__add[aria-disabled=true]{opacity:.6;cursor:progress}.design__add .sbt-piece{transition:scale var(--duration-fast) var(--ease)}.design__add:active .sbt-piece{scale:.94}@media (prefers-reduced-motion:reduce){.design__add .sbt-piece{transition:none}}.design__groupHint,.design__said{margin:calc(var(--space-8) * -1) 0 0;max-inline-size:46ch;font-size:var(--text-caption);line-height:var(--leading-arabic);color:var(--ink-muted)}.design__picked{min-block-size:2lh}.design__notebooks{gap:var(--space-8);margin:0;padding:0;list-style:none;display:grid}.design__notebook{align-items:center;gap:var(--space-12);grid-template-columns:auto 1fr auto;display:grid}.design__notebook[data-none]{color:var(--ink-muted)}.design__notebook .sbt-pick__note{display:block}.design__notebooksGroup .sbt-group__value{font-size:var(--text-caption);color:var(--ink-muted)}.design__said+.design__said{margin-block-start:calc(var(--space-12) * -1)}.design__said .sbt-thread-link{margin-inline-start:.3em}.design__pair{gap:var(--space-24);display:grid}.design__sub{gap:10px;display:grid}.design__subName{font-size:var(--text-caption);color:var(--ink-muted)}.design__charms>.design__sub{gap:var(--space-16);margin-block-start:calc(var(--space-32) - 14px)}.design__charmsSaid:empty{border-color:#0000;padding-block:0}.design__promo{justify-content:center;align-items:baseline;gap:var(--space-8);margin-block:var(--space-16) 0;font-size:var(--text-caption);text-wrap:balance;display:flex}.design__promo:before{content:"";border-block-start:var(--stitch-width) dashed var(--stitch-thread);flex:none;inline-size:14px;translate:0 -.3em}.design__promo+.design__promo{margin-block-start:var(--space-4)}.design__made{margin-block:var(--space-16) 0;font-size:var(--text-caption);text-align:center;opacity:.8}.design__dock{z-index:1;margin-block-start:var(--space-16);margin-inline:calc(var(--gutter-phone) * -1);position:sticky;inset-block-end:0}.design__dock .sbt-dock__in>.sbt-stitch-btn{max-inline-size:var(--panel);flex:auto}.design__dock .sbt-edge{display:none}.design__dock .sbt-dock__in{flex-wrap:wrap;row-gap:0}.design__dock .sbt-dock__in>.sbt-notice{flex-basis:100%}html:has(.stage[data-stage=live]) .parcel-still{visibility:hidden}.design__poster:has(.parcel-still)>:is(img,.design__object){display:none}.design__poster{position:relative}.design__poster>.design__steps{order:1;inline-size:min(100%,420px)}html:has(.design){--checkout-ease:cubic-bezier(.65, 0, .35, 1);--checkout-sew:.9s}.design__steps .sbt-stitches__step{color:var(--ink-muted);font-weight:400}.design__steps .sbt-stitches__step[data-state=current]{color:var(--ink)}.design__steps .sbt-stitches__step:before{transition-duration:var(--checkout-sew);transition-timing-function:var(--checkout-ease)}.design__steps .sbt-stitches__step[data-state=current]:before{transition-delay:calc(var(--checkout-sew) / 2)}.design__steps .sbt-stitches__step:after{transition:background-color var(--duration-slow) var(--checkout-ease) var(--checkout-sew)}.design:not([data-scene]) .design__steps{visibility:hidden;opacity:0;transition:opacity var(--duration-slow) var(--checkout-ease) var(--checkout-sew), visibility 0s calc(var(--checkout-sew) + var(--duration-slow));position:absolute;inset-block-end:0}html[data-fold]:has(.design) .stage{view-transition-name:design-stage}html[data-fold] .design__stage{view-transition-name:design-band}html[data-fold] .design__panel{view-transition-name:design-panel}::view-transition-old(design-stage){display:none}::view-transition-new(design-stage){animation:none}::view-transition-group(design-panel){animation:none}::view-transition-old(design-panel){transform-origin:50% 0;animation:design-fold-away var(--checkout-sew) var(--checkout-ease) both}::view-transition-new(design-panel){animation:design-fold-in var(--checkout-sew) var(--checkout-ease) var(--duration-fast) both}@keyframes design-fold-away{to{opacity:0;scale:.9}}@keyframes design-fold-in{0%{opacity:0;translate:0 var(--space-12)}}.design__packing{margin:var(--space-24) 0 0;color:var(--ink-muted);opacity:0;justify-self:center;animation:1ms 1.5s forwards design-packing}@keyframes design-packing{to{opacity:1}}@media (max-width:1023px){#c-main{margin-block-start:var(--space-24)}html:has(.design[data-scene]){--object-block:calc(30svh - var(--space-32));--band-block:calc(var(--space-8) + var(--object-block) + var(--space-4) + 2.5rem + var(--space-16));--stage-drop:20px}html:has(.design[data-scene]) .stage__frame{inset-block-end:20px}.design__steps .sbt-stitches__step{padding-block-start:18px}.design[data-scene] .design__stage{padding-block:var(--space-8) 0}.design[data-scene]{align-content:start;min-block-size:100svh}.design:is([data-scene=pay],[data-scene=paid],[data-scene=review],[data-scene=expired]) .design__stage{position:relative}html:has(.design:is([data-scene=pay],[data-scene=paid],[data-scene=review],[data-scene=expired])) .stage{animation:none}.design:is([data-scene=pay],[data-scene=paid],[data-scene=review],[data-scene=expired]) .design__stage:after{display:none}}.design[data-scene] .design__poster{animation:none}.design__offstage,.design__preparing{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (min-width:768px){html:has(.design){--object-block:min(48svh, 490px);--design-above:calc(var(--object-block) + 2.25rem + var(--stage-drop));--band-block:calc(var(--space-8) + var(--stage-drop) + var(--object-block) + var(--space-24) + var(--space-24));--stage-frame-inline:max(0px, (100% - 748px) / 2);--page-gutter:calc(var(--gutter-tablet) + max(0px, (100vw - var(--content-max)) / 2))}.design__poster{gap:var(--space-24);inline-size:min(100%,560px)}.design__stage{padding-block:calc(var(--space-8) + var(--stage-drop)) var(--space-24);margin-inline:calc(-1 * var(--gutter-tablet));padding-inline:var(--gutter-tablet)}.design__poster img{inline-size:auto;max-inline-size:100%;margin-inline:auto}.design__dock{margin-inline:calc(var(--gutter-tablet) * -1)}.design__dock .sbt-dock{padding-inline:var(--gutter-tablet)}.design__pair{column-gap:var(--space-40);grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:768px) and (max-width:1023px){.design__dock{margin-block-start:var(--space-96)}.design__panel{max-inline-size:760px;margin-inline:auto}.design[data-scene] .design__panel{inline-size:min(100%,560px)}html:has(.design[data-scene]){--band-block:calc(var(--space-8) + var(--object-block) + var(--space-24) + 2.5rem + var(--space-32))}.design[data-scene] .design__stage{padding-block-end:var(--space-24)}.design__poster>.design__steps{inline-size:min(100%,560px)}.design__extras>.design__chapter{column-gap:var(--space-40);grid-template-columns:repeat(2,minmax(0,340px));justify-content:center;align-items:start}.design__chapter .sbt-group__head{justify-content:flex-start}.design__chapter .sbt-group:has(:is(.sbt-leaves,.sbt-strip,.design__pair)){grid-column:1/-1}}@media (min-width:1024px){.design{grid-template-columns:minmax(0, 1fr) var(--panel);column-gap:var(--space-48);align-items:start}html:has(.design){--design-above:calc(var(--top-block) + var(--space-24));--band-block:var(--design-above);--stage-side:48px;--stage-top:calc(var(--top-block) + var(--space-40));--stage-block:var(--stage-top) 0;--band-clear:0px;--stage-leave:100vh;--stage-gutter:max(0px, (100% - var(--content-max)) / 2);--stage-frame-inline:var(--stage-gutter) calc(var(--stage-gutter) + var(--panel) + var(--space-48))}.design{position:relative}.design__stage{padding-inline:0;padding-block:var(--space-24);block-size:calc(100svh - var(--stage-top));align-content:center;margin-inline:0;inset-block-start:var(--stage-top)}.design__poster{inline-size:100%}html:has(.design[data-scene]) .stage__frame{inset-block:calc((100% - var(--object-block)) / 2)}.design__panel>.design__steps{margin-block-end:var(--space-24)}.design__title{justify-items:start}.design__headline{font-size:var(--text-title);font-weight:var(--weight-display-arabic);line-height:var(--leading-display-arabic);text-wrap:balance;display:block}[dir=ltr] .design__headline{font-family:var(--font-latin-display);font-style:italic;font-weight:400;line-height:var(--leading-display-latin)}.design__dock{margin-inline:0}.design__dock .sbt-dock{padding-inline:0}.design__dock .sbt-edge{inset-inline:-64px calc(-1 * var(--page-gutter));inset-block-start:calc(-1 * var(--space-48))}.design__panel{--panel-frost:94%;--panel-frost-text:0%;z-index:2;padding-block-start:var(--space-32);position:relative}.design__panel :is(.design__title,.design__build,.design__resume,.design__extrasHead,.sbt-group,.design__consent){position:relative}.design__panel :is(.design__title,.design__build,.design__resume,.design__extrasHead,.sbt-group,.design__consent):after{content:"";inset:calc(-1 * var(--space-16));z-index:-1;pointer-events:none;background:color-mix(in srgb, var(--ground) var(--panel-frost-text), transparent);-webkit-mask-image:linear-gradient(90deg, transparent, #000 var(--space-16), #000 calc(100% - var(--space-16)), transparent), linear-gradient(transparent, #000 var(--space-16), #000 calc(100% - var(--space-16)), transparent);mask-image:linear-gradient(90deg, transparent, #000 var(--space-16), #000 calc(100% - var(--space-16)), transparent), linear-gradient(transparent, #000 var(--space-16), #000 calc(100% - var(--space-16)), transparent);position:absolute;-webkit-mask-composite:source-in;mask-composite:intersect}.design__panel:before{content:"";inset-block:0;inset-inline:-64px calc(-1 * var(--page-gutter));z-index:-1;pointer-events:none;background:var(--ground-grain), color-mix(in srgb, var(--ground) var(--panel-frost), transparent);background-blend-mode:multiply;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);-webkit-mask-image:linear-gradient(calc(90deg * var(--sbt-dir)), transparent, #000 64px);mask-image:linear-gradient(calc(90deg * var(--sbt-dir)), transparent, #000 64px);position:absolute}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.design__panel:before{background:var(--ground-grain), var(--ground)}}@media (prefers-reduced-transparency:reduce){.design__panel:before{background:var(--ground-grain), var(--ground);-webkit-backdrop-filter:none;backdrop-filter:none}}.design__build{justify-self:start;display:block}.design__resume{justify-self:start;justify-items:start}.design__resumeAsk{text-align:start}.design__resumeTabs{justify-content:start}}.design__real{gap:var(--space-4);font-size:var(--text-caption);color:var(--primary)}.design__loupe{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;block-size:18px;inline-size:18px}}
