.hero-photo,.hero-price,.tick-icon,.hero-blob,.product-stage,.rail-card,.features li,.info-art,.info-why,.bag-thumb,.account-design-open img{--ink: var(--light-ink);--muted: var(--light-muted);--paper: var(--light-paper);--white: var(--light-white);--soft-line: var(--light-soft-line);--pink: var(--light-pink);--mint: var(--light-mint);--sky: var(--light-sky);--lilac: var(--light-lilac);--line: var(--light-line);--shade: var(--light-shade);--link: var(--light-link);--well: var(--light-well);--feature-card: var(--light-feature-card);--feature-muted: var(--light-feature-muted)}.hero-blob,.product-stage,.rail-card,.features li,.info-art,.info-why,.bag-thumb{color:var(--ink)}:is(.hero-photo,.hero-price,.tick-icon,.hero-blob,.product-stage,.rail-card,.features li,.info-art,.info-why,.bag-thumb,.account-design-open img){--line: var(--sticker-line);--shade: var(--sticker-shade)}:is(.product-stage,.hero-blob){--sky: var(--studio-sky);--mint: var(--studio-mint)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.app{min-height:100vh;min-height:100dvh}.noscript{margin:16px}.topbar-nav{display:none}.language-toggle[data-target=en] .flag-en,.language-toggle[data-target=th] .flag-th,.language-toggle[data-target=fr] .flag-fr{display:block}.sheet-header-actions{display:flex;align-items:center;gap:10px}.sheet-header .unit-toggle{height:36px;box-shadow:none}.tool-stack:not(:has(#ruler-toggle[aria-pressed=true])) .unit-button{display:none}.unit-button{font-size:13px;font-weight:800;letter-spacing:-.01em}.unit-toggle{display:inline-flex;height:42px;align-items:center;padding:3px;background:var(--raised);border:2px solid var(--line);border-radius:999px;box-shadow:var(--shadow-sm)}.unit-toggle button{height:100%;min-width:30px;padding:0 7px;color:var(--muted);background:none;border:0;border-radius:999px;font-size:13px;font-weight:800;transition:background-color .21s var(--ease),color .21s var(--ease)}.unit-toggle button[aria-pressed=true]{color:var(--paper);background:var(--ink)}.bag-count{position:absolute;top:-7px;right:-7px;display:grid;min-width:22px;height:22px;padding:0 5px;place-items:center;color:var(--on-color);background:var(--coral);border:2px solid var(--line);border-radius:999px;font-size:12px;font-weight:800;line-height:1;animation:pop .42s var(--spring)}.bag-button.is-bumping{animation:bump .68s var(--spring)}.bag-button .bag-ring{color:var(--coral)}.bag-button:not(.is-waiting) .bag-ring{display:none}.bag-button .bag-ring-left{stroke-dasharray:var(--left, 0) calc(1 - var(--left, 0));transition:stroke-dasharray 1s linear}.studio{--studio-need: calc(12px + var(--petee-room, 0px) + max(360px, var(--stage-need, 0px)) + 80px + var(--petee-bar, 0px));display:flex;height:max(calc((var(--studio-height, 100svh) - var(--topbar)) * .85),var(--studio-need));min-height:520px;max-height:860px;flex-direction:column;padding-top:12px}@media (max-width: 719.98px){.studio:not(.is-full){height:max(calc(var(--studio-height, 100svh) - var(--topbar)),var(--studio-need));max-height:max(760px,var(--studio-need))}}.studio.is-full{position:fixed;inset:0;z-index:25;width:auto;height:auto;min-height:0;max-height:none;margin:0;padding:max(12px,env(safe-area-inset-top)) 0 0;overflow:hidden;overscroll-behavior:none;background:var(--paper)}.studio.is-full:fullscreen{width:100%;height:100%}.studio-spacer{margin-top:calc(var(--space) - 12px)}.studio.is-morphing{isolation:isolate}.studio.is-morphing:not(.is-full){position:relative;z-index:25}.studio.is-morphing.is-full{background:transparent}.studio.is-morphing .product-stage{overflow:visible;background:transparent;border-color:transparent;box-shadow:none;transition:none}.studio.is-morphing :is(.photo-grip,.photo-corner,.add-plus,.manipulator,.mockup-overlay,.mockup-loupe){opacity:0}.studio-backdrop{position:fixed;inset:0;z-index:-3;background:var(--paper);pointer-events:none}.stage-frame{position:fixed;z-index:-1;box-sizing:border-box;pointer-events:none}html.is-studio-full{overflow:hidden;overscroll-behavior:none}main>.studio{margin-top:calc(var(--space) - 12px)}main>.products{margin-top:32px}main>.products+.studio,main>.products+.studio-spacer{margin-top:8px}.product-stage{position:relative;isolation:isolate;flex:1;min-height:360px;margin:0 max(12px,env(safe-area-inset-left));overflow:hidden;background:var(--sky);border:2px solid var(--line);border-radius:28px;box-shadow:var(--shadow);touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;transition:background-color .39s var(--ease)}.stage-sheen,.stage-sheen:before,.stage-sheen:after{position:absolute;inset:0;border-radius:inherit;pointer-events:none}.stage-sheen{z-index:-1;overflow:hidden}.stage-sheen:before,.stage-sheen:after{content:""}.stage-sheen:before{background:radial-gradient(circle at 50% 45%,rgb(255 255 255 / 92%),transparent 58%),radial-gradient(circle,rgb(255 111 97 / 9%) 0 1.6px,transparent 2.4px) 0 0 / 22px 22px;opacity:var(--sheen-light)}.stage-sheen:after{background:radial-gradient(circle at 50% 45%,rgb(255 255 255 / 20%),transparent 58%),radial-gradient(circle,rgb(255 255 255 / 15%) 0 1.6px,transparent 2.4px) 0 0 / 22px 22px;opacity:calc(1 - var(--sheen-light))}.studio.is-morphing .product-stage>.stage-sheen{visibility:hidden}.mockup-fade{transition:filter .42s var(--ease)}.mockup-fade.is-held{filter:blur(7px) saturate(.6) opacity(.6)}:is(.product-stage,.merch-stage,.order-promptpay):before,:is(.product-stage,.merch-stage,.order-promptpay):after{position:absolute;top:50%;left:50%;z-index:2;content:"";pointer-events:none;opacity:0;transition:opacity .22s var(--ease)}:is(.product-stage,.merch-stage,.order-promptpay):after{width:64px;height:64px;margin:-40px 0 0 -32px;background:var(--hop-cat) center / contain no-repeat;filter:drop-shadow(0 0 1px rgb(255 255 255 / 55%));transform-origin:50% 100%}:is(.product-stage,.merch-stage,.order-promptpay):before{width:46px;height:10px;margin:26px 0 0 -23px;background:color-mix(in srgb,var(--shadow-color) 26%,transparent);border-radius:50%}:is(.product-stage,.merch-stage,.order-promptpay):is(.is-loading,.is-taking):before,:is(.product-stage,.merch-stage,.order-promptpay):is(.is-loading,.is-taking):after{opacity:1}:is(.product-stage,.merch-stage,.order-promptpay):is(.is-loading,.is-taking):after{animation:cat-hop 1.3s cubic-bezier(.45,0,.55,1) infinite,cat-arrive .42s var(--spring) both}:is(.product-stage,.merch-stage,.order-promptpay):is(.is-loading,.is-taking):before{animation:cat-shadow 1.3s cubic-bezier(.45,0,.55,1) infinite}@keyframes cat-shadow{0%,50%,to{scale:1.1 1;opacity:1}25%,75%{scale:.55 .8;opacity:.45}}@keyframes cat-arrive{0%{transform:scale(.4)}}.product-stage.is-dropping{box-shadow:inset 0 0 0 4px var(--coral),var(--shadow)}.mockup-canvas{position:absolute;inset:0;z-index:1;width:100%;height:100%;touch-action:pan-y;will-change:transform}.mockup-overlay{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:none}.mockup-under{position:absolute;top:0;left:0;z-index:0;pointer-events:none;transform-origin:0 0}.mockup-fade{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:none}.mockup-loupe{position:absolute;z-index:6;width:96px;height:96px;pointer-events:none;border:3px solid var(--white);border-radius:50%;box-shadow:0 0 0 2px var(--shade),0 12px 28px color-mix(in srgb,var(--shadow-color) 28%,transparent)}.mockup-loupe{transition:opacity .2s var(--ease),transform .26s var(--out),display .26s allow-discrete}.mockup-loupe[hidden]{display:none;opacity:0;transform:scale(.86)}.mockup-loupe.is-placed{transition:left .11s linear,top .11s linear,opacity .2s var(--ease),transform .26s var(--out),display .26s allow-discrete}@starting-style{.mockup-loupe:not([hidden]){opacity:0;transform:scale(.86)}}.add-plus{position:absolute;z-index:3;padding:0;background:none;border:0;border-radius:50%;transform:translate(-50%,-50%);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.photo-grip{position:absolute;z-index:4;width:32px;height:32px;background:var(--coral) center / 17px no-repeat;border:0;border-radius:50%;box-shadow:0 2px 8px color-mix(in srgb,var(--shadow-color) 28%,transparent);touch-action:none;transform:translate(-50%,-50%);cursor:grab;animation:grip-in .34s var(--spring)}.photo-grip:after{position:absolute;inset:-7px;content:"";border-radius:50%}.photo-grip:active{cursor:grabbing}.grip-resize{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff6f61' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 18 18 6M6 12.5V18h5.5M12.5 6H18v5.5'/%3E%3C/svg%3E");cursor:nesw-resize}.grip-move{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M3 12h18M9 6l3-3 3 3M9 18l3 3 3-3M6 9l-3 3 3 3M18 9l3 3-3 3'/%3E%3C/svg%3E")}.grip-turn{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff6f61' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12a7 7 0 1 1-2.05-4.95'/%3E%3Cpath d='M19 4v4h-4'/%3E%3C/svg%3E")}.grip-resize,.grip-turn{background-color:var(--light-white);box-shadow:inset 0 0 0 2px var(--coral),0 1px 6px color-mix(in srgb,var(--shadow-color) 18%,transparent)}.photo-corner{position:absolute;z-index:4;width:14px;height:14px;box-sizing:border-box;background:var(--light-white);border:2.5px solid var(--coral);border-radius:50%;box-shadow:0 1px 4px color-mix(in srgb,var(--shadow-color) 30%,transparent);touch-action:none;transform:translate(-50%,-50%);animation:grip-in .34s var(--spring)}.photo-corner:after{position:absolute;content:"";border-radius:50%}.corner-0:after{inset:-22px -4px -4px -22px}.corner-1:after{inset:-22px -22px -4px -4px}.corner-2:after{inset:-4px -22px -22px -4px}.corner-3:after{inset:-4px -4px -22px -22px}.corner-0,.corner-2{cursor:nwse-resize}.corner-1,.corner-3{cursor:nesw-resize}@keyframes grip-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}}.manipulator{position:absolute;z-index:2;touch-action:none;border-radius:18px}.photo-render{display:none}.product-stage{--control: 40px;--row-gap: 6px;--hit: min(4px, var(--tool-gap, 8px) / 2);--hit-x: min(var(--hit), var(--row-gap) / 2)}.product-stage :is(.stage-tools,.stage-side,.stage-bottom) .tool-button{position:relative}.product-stage :is(.stage-tools,.stage-side) .tool-button:not(.is-guided):after{position:absolute;inset:calc(-2px - var(--hit));content:"";border-radius:50%}.product-stage .stage-bottom .tool-button:not(.is-guided):after{position:absolute;inset:calc(-2px - var(--hit)) calc(-2px - var(--hit-x));content:"";border-radius:50%}.product-stage .stage-bottom :is(#side-more,#flip-button,.color-button):after{inset:calc(-2px - var(--hit))}.zoom-control button{position:relative}.zoom-control button:after{position:absolute;inset:calc(-4px - var(--hit)) 0;content:""}#zoom-out:after{left:calc(-4px - var(--hit-x))}#zoom-in:after{right:calc(-4px - var(--hit-x))}.studio:not(.is-full)>.product-stage{min-height:max(360px,var(--stage-need, 0px))}.stage-top,.stage-bottom{position:absolute;z-index:3;right:10px;left:10px;display:flex;align-items:center;justify-content:space-between;gap:8px;pointer-events:none}.stage-top>*,.stage-bottom>*{pointer-events:auto}.stage-top{top:10px;align-items:flex-start}.stage-bottom{bottom:10px;display:grid;grid-template-columns:minmax(var(--control),auto) 1fr auto 1fr minmax(var(--control),auto);column-gap:var(--row-gap);align-items:end;justify-items:center}.stage-bottom>:is(#side-more,#flip-button){grid-area:1 / 1;justify-self:start}.stage-bottom>:last-child{justify-self:end}.stage-bottom>#undo-button{grid-column:2;justify-self:end}.stage-bottom>.zoom-control{grid-column:3}.stage-bottom>#redo-button{grid-column:4;justify-self:start}.stage-bottom>.color-picker{grid-column:5}@media (max-width: 340px){.product-stage{--row-gap: 4px}.stage-bottom{right:8px;left:8px}.stage-side{left:8px}.stage-bottom .zoom-control button{min-width:24px;padding:0 2px}.stage-bottom #zoom-reset{min-width:28px}}.stage-lead{display:grid;min-width:0;justify-items:start;gap:8px;pointer-events:none}.stage-lead>*{max-width:100%;pointer-events:auto}.stage-tools{display:grid;justify-items:end;gap:var(--tool-gap, 8px);pointer-events:none}.stage-tools .tool-button{width:var(--tool-size, var(--control));height:var(--tool-size, var(--control))}.stage-tools>*{pointer-events:auto}.stage-corner{display:flex;align-items:center;gap:8px;pointer-events:none}.stage-corner>*{pointer-events:auto}#full-button .full-close,#full-button[aria-pressed=true] .full-open{display:none}#full-button[aria-pressed=true] .full-close{display:block}@media (hover: hover) and (pointer: fine){#full-button{display:none}}.tool-stack{display:grid;gap:var(--tool-gap, 8px);animation:pop .39s var(--spring)}.tool-stack.is-paired{grid-template-rows:repeat(var(--tool-rows),auto);grid-auto-flow:column;direction:rtl}.tool-stack.is-paired>*{direction:ltr}.stage-side{position:absolute;z-index:3;bottom:calc(10px + var(--control) + var(--tool-gap, 8px));left:10px;justify-items:start;pointer-events:none}.stage-side>*{pointer-events:auto}.stage-side .tool-button{width:var(--tool-size, var(--control));height:var(--tool-size, var(--control))}.product-stage:has(#flip-button[hidden]) .stage-side{bottom:10px}.product-stage.has-side:not(.is-side-open) :is(#petee-tools,#flip-button),.product-stage:is(:not(.has-side),.is-side-open) #side-more,.product-stage:not(.has-side) #petee-tools{display:none}.tool-stack.stage-side{transition:none}.tool-button.side-fold{color:var(--raised-ink);background:transparent;border-color:transparent;box-shadow:none}.side-fold>svg{width:22px;height:22px;stroke-width:2.6}.tool-button{display:grid;width:var(--control, 44px);height:var(--control, 44px);place-items:center;padding:0;color:var(--raised-ink);background:var(--raised);border:2px solid var(--line);border-radius:50%;box-shadow:var(--shadow-sm);transition:transform .21s var(--ease),box-shadow .21s var(--ease),background-color .26s var(--ease),color .26s var(--ease)}.tool-button:not(:disabled):active{transform:translate(2px,2px);box-shadow:none}.tool-button:disabled{cursor:default;color:color-mix(in srgb,var(--raised-ink) 30%,transparent);border-color:color-mix(in srgb,var(--raised-ink) 30%,transparent);box-shadow:none}.tool-button[aria-pressed=true],.tool-button[aria-expanded=true]{color:var(--on-accent);background:var(--coral)}.tool-button>svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.wear-petee .petee-figure{width:30px;height:30px;transform-origin:50% 50%}.wear-petee .petee-figure :is(.pt-spark,.pt-extra,.pt-scene){display:none}.wear-petee.is-loading .petee-figure[data-mood] .pt-body{animation:wear-hop 1.15s cubic-bezier(.45,0,.55,1) .14s infinite}@keyframes wear-hop{0%,to{translate:0 0;scale:1.08 .9;rotate:0deg}12%{translate:0 -2px;scale:.95 1.06;rotate:-4deg}25%{translate:0 -9px;scale:1 1;rotate:-8deg}40%{translate:0 -2px;scale:.98 1.03;rotate:-3deg}50%{translate:0 0;scale:1.08 .9;rotate:0deg}62%{translate:0 -2px;scale:.95 1.06;rotate:4deg}75%{translate:0 -9px;scale:1 1;rotate:8deg}90%{translate:0 -2px;scale:.98 1.03;rotate:3deg}}:is(.deck-button,.sticker-button,.styles-button).is-loading>svg{animation:wear-hop 1.15s cubic-bezier(.45,0,.55,1) .14s infinite}@media (prefers-reduced-motion: reduce){:is(.wear-petee.is-loading .petee-figure[data-mood] .pt-body,:is(.deck-button,.sticker-button,.styles-button).is-loading>svg){animation:none;opacity:.6}}.tool-button .tool-spot,.tool-button .place-spot{fill:currentColor;stroke:none}.tool-button .place-garment{fill:none}.tool-button.add-layer{color:var(--on-accent);background:var(--coral)}.stage-tools .tool-button.saved-pill{height:auto;gap:3px;padding:10px 0 8px;border-radius:999px}.saved-pill b{font-size:13px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}.place-menu{position:absolute;z-index:5;top:60px;right:60px;display:grid;gap:2px;padding:4px;background:var(--white);border:2px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm),0 10px 30px color-mix(in srgb,var(--shadow-color) 22%,transparent);transform-origin:100% 0;animation:menu-in .29s var(--spring)}.place-menu button{display:flex;min-height:44px;align-items:center;gap:10px;padding:6px 14px 6px 8px;color:var(--ink);background:transparent;border:0;border-radius:12px;font-size:14px;font-weight:700;text-align:left;white-space:nowrap}.place-menu button:active,.place-menu button[aria-checked=true]{background:var(--lilac)}.place-menu svg{width:28px;height:28px}.arrange-menu{z-index:9;top:60px;right:auto;left:10px;transform-origin:0 0}.arrange-menu button:disabled{opacity:.4}.arrange-menu svg{width:22px;height:22px;margin:3px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.arrange-menu .arrange-solid{fill:currentColor}.arrange-menu .arrange-cover{fill:var(--white)}.action-bar{position:relative}.add-chip{display:grid;width:56px;height:56px;flex:none;place-items:center;padding:0;color:var(--raised-ink);background:var(--raised);border:2px solid var(--line);border-radius:16px;box-shadow:var(--shadow-sm)}.add-chip svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.add-chip:active{transform:translate(2px,2px);box-shadow:none}.add-chip[hidden]{display:none}@media (max-width: 420px){.action-bar{gap:8px}.action-bar .add-button>svg{display:none}}.expert-toggle .expert-close,.expert-toggle[aria-pressed=true] .expert-open{display:none}.expert-toggle[aria-pressed=true] .expert-close{display:block}.tool-button.expert-toggle[aria-pressed=true]{color:var(--ink);background:transparent;border-color:transparent;box-shadow:none}.expert-toggle .expert-close{width:22px;height:22px;stroke-width:2.6}.tool-stack:not(:has(>:not([hidden]))){display:none}.flip-menu svg{stroke-width:1.9}.arrange-menu [data-arrange=group]{margin-top:4px;border-top:1px solid color-mix(in srgb,var(--line) 20%,transparent);border-radius:0 0 12px 12px}.group-bar .group-count:empty{display:none}.group-bar .group-count{display:inline-grid;min-width:22px;height:22px;place-items:center;padding:0 6px;margin-left:4px;background:var(--yellow);color:var(--ink);border-radius:999px;font-size:13px}.place-menu .place-garment{fill:color-mix(in srgb,var(--ink) 7%,transparent);stroke:color-mix(in srgb,var(--ink) 70%,transparent);stroke-width:1.3;stroke-linejoin:round}.place-menu .place-spot,.place-menu [aria-checked=true] .place-spot{fill:var(--coral)}.flip-button{position:relative}.flip-button[data-printed=true]:before{position:absolute;top:-4px;right:-4px;width:12px;height:12px;content:"";background:var(--coral);border:2px solid var(--line);border-radius:50%}.zoom-control{display:flex;align-items:center;height:var(--control);padding:0 2px;background:var(--raised);border:2px solid var(--line);border-radius:999px;box-shadow:var(--shadow-sm)}.zoom-control button{display:grid;min-width:calc(var(--control) - 8px);height:calc(var(--control) - 8px);place-items:center;padding:0 4px;color:var(--raised-ink);background:none;border:0;border-radius:999px;font-family:var(--display);font-size:14px}.zoom-control button:not(:disabled):active{background:var(--lilac)}.zoom-control button:disabled{cursor:default;opacity:.3}.zoom-control svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}#zoom-reset{min-width:42px}.product-stage.is-zoomed,.product-stage.is-zoomed .mockup-canvas{touch-action:none}.color-picker{position:relative}.color-picker.is-single{visibility:hidden}.color-button{padding:0}.color-dot,.color-swatches button{display:block;width:26px;height:26px;padding:0;background:var(--swatch, #fafafa);border:1.5px solid color-mix(in srgb,var(--ink) 28%,transparent);border-radius:50%}.color-swatches{position:absolute;right:0;bottom:calc(100% + 8px);display:grid;gap:8px;padding:6px;background:var(--white);border:2px solid var(--line);border-radius:999px;box-shadow:var(--shadow-sm);transform-origin:50% 100%;animation:colors-in .31s var(--spring)}.color-swatches[hidden]{display:none}.color-swatches button{width:24px;height:24px;transition:transform .26s var(--spring),box-shadow .26s var(--ease)}.color-swatches button:active{transform:scale(.88)}.color-swatches button[hidden]{display:none}.color-swatches button[aria-pressed=true]{border-color:var(--white);box-shadow:0 0 0 2.5px var(--coral)}.color-swatches.is-grid{grid-template-columns:repeat(var(--columns, 5),28px);max-height:min(340px,52dvh);padding:0 10px 10px;overflow-y:auto;overscroll-behavior:contain;border-radius:22px;scrollbar-width:none}.color-swatches.is-grid button{width:28px;height:28px}.color-name{position:sticky;top:0;z-index:1;grid-column:1 / -1;margin:0 -10px;padding:9px 10px 5px;overflow:hidden;color:var(--ink);background:var(--white);font-size:12.5px;font-weight:800;text-align:center;text-overflow:ellipsis;white-space:nowrap}.color-button[aria-expanded=true]{background:var(--lilac)}.stage-bottom:has(#color-swatches:not([hidden])){z-index:5}@keyframes colors-in{0%{opacity:0;transform:translateY(10px) scaleY(.4)}}.photo-menu{display:flex;height:var(--control);box-sizing:border-box;gap:2px;padding:2px;background:var(--white);border:2px solid var(--line);border-radius:999px;box-shadow:var(--shadow-sm);transform-origin:0 50%;animation:menu-in .29s var(--spring)}.stage-lead{min-width:0}.photo-menu{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x}.photo-menu::-webkit-scrollbar{display:none}.photo-menu button{flex:none}.photo-menu[hidden]{display:none}.photo-menu button{display:grid;width:calc(var(--control) - 8px);height:calc(var(--control) - 8px);place-items:center;padding:0;color:var(--ink);background:transparent;border:0;border-radius:50%;transition:background-color .21s var(--ease)}.photo-menu button:active{background:var(--lilac)}.photo-menu button[aria-pressed=true]{color:var(--on-accent);background:var(--coral)}.photo-menu button:disabled{opacity:.4}.photo-menu #remove-photo{color:var(--red-text)}@media (max-width: 374px){.photo-menu svg{width:18px;height:18px}}.tool-button[aria-disabled=true]{opacity:.45;box-shadow:none}.crop-bar{position:absolute;right:12px;bottom:12px;left:12px;z-index:6;display:grid;gap:8px;padding:10px 12px 12px;color:var(--chip-text);background:var(--chip);border-radius:20px;box-shadow:var(--shadow);animation:pop .34s var(--spring)}.crop-bar p{margin:0;font-size:13px;font-weight:700;text-align:center;opacity:.85}.crop-actions{display:grid;grid-template-columns:1fr 1.4fr;gap:8px}.crop-actions .button{min-height:44px}.product-stage.is-cropping :is(.stage-bottom,.tool-stack,.stage-corner){visibility:hidden}.photo-menu svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}@keyframes menu-in{0%{opacity:0;transform:scale(.85)}}.stage-status{position:absolute;z-index:4;inset:auto 16px 50%;margin:0;padding:12px 14px;color:var(--red-text);background:var(--white);border:2px solid var(--line);border-radius:14px;font-size:14px;font-weight:700;text-align:center}.action-bar{display:flex;flex:none;gap:12px;padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left))}.studio.is-full .action-bar{display:none}.studio.is-full .product-stage{margin-bottom:max(12px,env(safe-area-inset-bottom))}.studio.is-full .product-stage{min-height:0}@media (orientation: landscape) and (max-height: 480px){.studio.is-full .stage-bottom{right:calc(18px + var(--tool-size, var(--control)))}}.size-chip{display:grid;min-width:56px;height:56px;padding:4px 12px;place-content:center;justify-items:center;color:var(--raised-ink);background:var(--raised);border:2px solid var(--line);border-radius:16px;box-shadow:var(--shadow-sm);line-height:1.1;transition:transform .21s var(--ease),box-shadow .21s var(--ease)}.size-chip:active{transform:translate(2px,2px);box-shadow:none}.size-chip-label{color:var(--muted);font-size:12px;font-weight:700}.size-chip strong{font-family:var(--display);font-size:19px}.size-chip[data-sized=false] .size-chip-label{color:var(--ink);font-size:15px;font-weight:800}.size-chip[data-sized=false] strong,.size-chip[data-one=true] .size-chip-label{display:none}.size-chip[data-one=true] strong{display:block;font-size:17px;line-height:1.05;text-align:center;white-space:pre-line}.size-chip[data-one=true] strong:lang(en){text-transform:capitalize}.secondary{color:var(--raised-ink);background:var(--raised)}.add-button{flex:1;min-width:0;height:56px;padding-inline:14px;font-family:var(--display);font-size:clamp(16px,4.6vw,19px);white-space:nowrap}.add-button>span:not(.add-price){min-width:0;overflow:hidden;text-overflow:ellipsis}.add-price{flex:none}.danger{color:var(--on-color);background:var(--red)}.add-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.add-button.is-done{background:#23a26d}.action-bar :is(.size-chip,.add-button):focus-visible{outline:none}.add-price{padding:3px 9px;margin-left:2px;color:var(--on-accent);background:var(--yellow);border-radius:999px;font-size:16px;font-variant-numeric:tabular-nums}.add-price:empty{display:none}.studio.is-first-run :is(.stage-tools,.stage-side,.stage-bottom>:not(.color-picker)){visibility:hidden}.studio.is-first-run .action-bar .add-chip{display:none}html.is-focused,html.is-asking{overflow:hidden;overscroll-behavior:none}.focus-veil{position:absolute;top:0;right:0;left:0;height:0;z-index:20;background:color-mix(in srgb,var(--paper) 40%,transparent);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);opacity:0;pointer-events:none;transition:opacity .6s var(--ease)}.focus-veil.is-on{opacity:1;pointer-events:auto}.focus-veil.is-whole{touch-action:none}.focus-skip{display:none;position:absolute;top:calc(100lvh - env(safe-area-inset-bottom) - 76px - 1.3em);right:0;left:0;margin:0;color:var(--muted);font-size:14px;font-weight:700;text-align:center}.focus-veil.is-whole .focus-skip{display:block}.ask-steps{display:flex;align-items:flex-start;justify-content:center;gap:2px}.ask-step{display:flex;width:84px;flex-direction:column;align-items:center;gap:7px}.ask-step-icon{display:grid;width:56px;height:56px;place-items:center;border-radius:50%}.ask-step-icon.is-sky{background:var(--light-sky)}.ask-step-icon.is-pink{background:var(--light-pink)}.ask-step-icon.is-mint{background:var(--light-mint)}.ask-step-icon svg{width:48px;height:48px;fill:none;stroke:var(--light-ink);stroke-linejoin:round}.ask-step-icon .is-filled{fill:var(--yellow)}.ask-step-icon .is-ink{fill:var(--light-ink);stroke:none}.ask-step-icon .is-white{fill:var(--light-white)}.ask-step-icon .is-coral{fill:var(--coral)}.ask-step-icon .is-lilac{fill:var(--light-lilac)}.ask-step-label{font-size:13px;font-weight:700;line-height:1.15;text-align:center}.ask-step-arrow{flex:none;width:18px;height:18px;margin-top:19px}.ask-step-arrow svg{display:block;width:100%;height:100%;fill:none;stroke:var(--yellow);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.is-in-focus:not(.is-full){position:relative;z-index:21}.products.is-held-in{max-height:var(--focus-room);margin-top:24px;padding-top:8px;padding-bottom:var(--held-end);overflow:hidden auto;overscroll-behavior:contain;-webkit-mask-image:linear-gradient(#000 calc(100% - 28px),transparent);mask-image:linear-gradient(#000 calc(100% - 28px),transparent)}.products.is-choosing .rail-card[aria-pressed=true]{border-color:var(--line);box-shadow:var(--shadow-sm)}.topbar-tour{display:flex;align-items:center;gap:8px}:root:has(.studio.is-full.is-touring) .petee-bar{visibility:hidden}.studio>.topbar-tour{position:absolute;top:calc(6px + env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));left:max(12px,env(safe-area-inset-left));z-index:31;justify-content:center;gap:6px;animation:mount-in .18s ease-out both}.studio:not(.is-full)>.topbar-tour{display:none}.studio>.topbar-tour .tour-rail{height:34px}.studio>.topbar-tour .tour-arrow{width:28px;height:28px}.studio>.topbar-tour .tour-arrow svg{width:17px;height:17px}.studio>.topbar-tour .tour-steps i{width:9px;height:9px}.studio>.topbar-tour .tour-steps i.is-now{width:24px}.studio>.topbar-tour .tour-close{width:34px;height:34px}.studio>.topbar-tour .tour-close svg{width:17px;height:17px}.tour-rail{display:inline-flex;height:42px;box-sizing:border-box;align-items:center;gap:2px;padding:0 3px;background:var(--white);border:2px solid var(--line);border-radius:999px;box-shadow:var(--shadow-sm)}.tour-steps{display:inline-flex;align-items:center;gap:6px;padding:0 4px}.tour-arrow{display:grid;width:32px;height:32px;place-items:center;padding:0;color:var(--ink);background:transparent;border:0;border-radius:50%;transition:background-color .2s var(--ease),opacity .2s var(--ease)}.tour-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.tour-arrow:active:not(:disabled){background:var(--well)}.tour-arrow:disabled{opacity:.25}.tour-steps i{width:10px;height:10px;box-sizing:border-box;border:2px solid var(--ink);border-radius:999px;transition:width .32s var(--spring),background-color .26s var(--ease)}.tour-steps i.is-done{background:var(--ink)}.tour-steps i.is-now{width:28px;background:linear-gradient(90deg,var(--yellow) var(--fill, 100%),transparent 0)}@media (prefers-reduced-motion: reduce){.focus-veil,.tour-steps i{transition:none}}.guide-hint{position:absolute;z-index:3;pointer-events:none}.guide-hint[hidden]{display:none}.guide-halo,.guide-plus{position:absolute;box-sizing:border-box;border-radius:50%}.guide-halo:before,.guide-halo:after{position:absolute;inset:0;content:"";background:#ff6f61;border-radius:50%;opacity:0;scale:3;animation:guide-halo 1.8s ease-out infinite}.guide-halo:after{animation-delay:.9s}.guide-plus{padding:0;background:#ff6f61;border:2px solid #2b2037;box-shadow:2px 2px #2b2037;animation:guide-breathe 1.8s ease-in-out infinite}.guide-plus{pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent}.guide-plus:before,.guide-plus:after{position:absolute;top:50%;left:50%;width:46%;height:10%;content:"";background:#fff;border-radius:99px;translate:-50% -50%}.guide-plus:after{rotate:90deg}.is-guided{position:relative}:is(.action-bar,.stage-corner,.tool-stack,.photo-menu,.rail-item):has(>.is-guided){isolation:isolate}.is-guided:before,.is-guided:after{position:absolute;inset:-2px;z-index:-1;content:"";background:#ff6f61;border-radius:inherit;pointer-events:none;opacity:0;scale:var(--halo, 1.4);will-change:scale,opacity;animation:guide-halo 1.8s ease-out infinite}.is-guided:after{animation-delay:.9s}.is-guided:is(:hover,:active),.rail-card.is-guided:active{transform:none}.is-guided:active{top:2px;left:2px}@media (hover: hover) and (pointer: fine){:is(.add-button,#size-button).is-guided:not(:active):hover{top:-1px;left:-1px}}.photo-menu:has(>#cutout-photo.is-guided){overflow:visible}#cutout-photo.is-guided{background:var(--white)}#cutout-photo.is-hinted{color:var(--coral);border-radius:999px;animation:cutout-hint 1.4s ease-in-out 5}@keyframes cutout-hint{50%{background:color-mix(in srgb,var(--coral) 22%,transparent)}}@keyframes guide-halo{0%{opacity:.8;scale:1}80%,to{opacity:0}}@keyframes guide-breathe{50%{scale:1.18}}@media (prefers-reduced-motion: reduce){.guide-halo:before,.guide-halo:after,.guide-plus,.is-guided:before,.is-guided:after{animation:none}.guide-halo:before{opacity:.35;scale:1.5}.is-guided:before{opacity:.35;scale:var(--halo-half, 1.2)}#cutout-photo.is-hinted{background:color-mix(in srgb,var(--coral) 16%,transparent);animation:none}}.help{margin:6px 0 0;color:var(--muted);font-size:13px}@media (hover: hover){.size-chip:hover,.language-toggle:hover{transform:translate(-1px,-1px);box-shadow:var(--shadow)}}.flyer{position:fixed;z-index:30;width:56px;height:56px;margin:0;object-fit:cover;pointer-events:none;background:var(--raised);border:2px solid var(--line);border-radius:14px;box-shadow:var(--shadow-sm)}@keyframes bump{30%{transform:scale(1.22) rotate(-8deg)}60%{transform:scale(.94) rotate(4deg)}}.card-colors{display:flex;min-height:12px;justify-content:center;gap:4px;margin:2px 0}.card-colors i{width:12px;height:12px;background:var(--swatch, #fafafa);border:1.5px solid color-mix(in srgb,var(--ink) 35%,transparent);border-radius:50%}.card-colors b{color:var(--muted);font-size:11px;font-weight:800;line-height:12px}.rail-item{position:relative;display:grid;min-width:0}.info-button{position:absolute;display:grid;width:28px;height:28px;place-items:center;padding:0;color:var(--raised-ink);background:var(--raised);border:2px solid var(--line);border-radius:50%}.info-button:before{position:absolute;inset:-7px;content:""}.info-button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.8;stroke-linecap:round}.info-button:active{transform:scale(.9)}.rail-item .info-button{top:7px;right:7px;z-index:1;width:24px;height:24px}.rail-item .info-button svg{width:14px;height:14px}.rail-item:has(.info-button) .rail-card strong{padding-right:22px}.info-sheet h3{margin:18px 0 8px;font-size:17px}.info-top{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:14px}.info-art{display:block;padding:6px;background:var(--sky);border-radius:16px}.info-art img{display:block;width:100%;height:auto;aspect-ratio:5 / 6;object-fit:contain;filter:drop-shadow(0 4px 5px color-mix(in srgb,var(--shadow-color) 24%,transparent))}.info-specs{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}.info-specs li{padding:3px 10px;background:var(--paper);border:1.5px solid var(--soft-line);border-radius:999px;font-size:13px;font-weight:700}.info-price{margin:10px 0 0;font-family:var(--display);font-size:19px}.info-colors{flex-wrap:wrap;justify-content:flex-start;gap:6px;margin:10px 0 0}.info-colors i{width:18px;height:18px}.info-why{margin-top:16px;padding:12px 14px;background:var(--yellow);border:2px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);color:var(--on-accent)}.info-why h3{margin:0 0 4px;font-size:15px}.info-why p{margin:0;font-size:15px;font-weight:600}.info-points{display:grid;gap:6px;margin:0;padding:0;list-style:none;font-size:15px}.info-points li{position:relative;padding-left:24px}.info-points li:before{position:absolute;left:2px;content:"✓";color:var(--coral);font-weight:900}.info-care li:before{content:"•";color:var(--muted)}.info-sizes{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums;text-align:center}.info-sizes th{padding:6px 4px;color:var(--muted);font-size:12px;font-weight:800;border-bottom:2px solid var(--soft-line)}.info-sizes td{padding:6px 4px;border-bottom:1px solid var(--soft-line)}.info-sizes td:first-child{font-weight:800}.info-note{margin:6px 0 0;color:var(--muted);font-size:12px}.info-text{margin:0;font-size:15px}.info-actions{position:sticky;bottom:calc(-18px - env(safe-area-inset-bottom));margin:18px -16px 0;padding:12px 16px calc(18px + env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--white) 14px)}.info-actions .button{width:100%;font-family:var(--display);font-size:17px}.size-help{display:flex;align-items:center;gap:8px;margin:0 0 14px}.size-help[hidden],:root:not(:has(.has-petee)) .size-help{display:none}.size-help-cat{flex:none;width:46px;height:46px;background:var(--hop-cat) center / contain no-repeat}.size-help-say{position:relative;display:flex;flex:0 1 auto;min-width:0;flex-wrap:nowrap;align-items:center;gap:6px 10px;margin:0;padding:9px 9px 9px 14px;color:var(--paper);background:var(--ink);border-radius:18px;font-family:var(--display);font-size:15px;font-weight:600;line-height:1.2}.size-help-say:before{position:absolute;top:50%;left:-6px;width:12px;height:12px;content:"";background:inherit;border-radius:2px;translate:0 -50%;rotate:45deg}.size-help-say>span{flex:none;white-space:nowrap}.size-help-button{min-height:36px;padding:0 14px;color:#2b2037;background:var(--yellow);border:0;border-radius:999px;font:inherit;white-space:nowrap}.size-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}.size-grid button{display:grid;gap:1px;min-height:58px;padding:6px 4px;place-content:center;color:var(--ink);background:var(--paper);border:2px solid var(--soft-line);border-radius:14px;font-family:var(--display);font-size:18px;font-weight:750;line-height:1.3;transition:transform .26s var(--spring)}.size-grid button small{color:var(--muted);font-family:var(--text);font-size:11px;font-weight:600}.size-grid button .size-price{min-height:1.3em;color:var(--ink);font-weight:800;font-variant-numeric:tabular-nums}.size-grid button:active{transform:scale(.94)}.size-grid button[aria-pressed=true]{background:var(--yellow);border-color:var(--line);box-shadow:var(--shadow-sm);color:var(--on-accent)}.size-grid.is-wide{grid-template-columns:repeat(2,minmax(0,1fr))}.size-detail{min-height:20px;margin:12px 2px 0;color:var(--muted);font-size:13px;font-weight:600;text-align:center}.bag-count.is-popping{animation:pop .46s var(--spring)}@keyframes size-ask{45%{transform:scale(1.08)}}@keyframes rise{0%{opacity:0;transform:translateY(6px)}}.order-head{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:14px}.order-head>.order-badge{margin:0}.order-promptpay{position:relative}.order-promptpay.is-loading{min-height:520px}.order-promptpay.is-loading,.order-promptpay>.promptpay{margin-top:40px}.order-promptpay:not(.is-loading):before,.order-promptpay:not(.is-loading):after{content:none}.order-card:has(>.order-promptpay:is(.is-loading,:not(:empty))){padding:0;background:none;border-color:transparent;box-shadow:none}.order-status{flex:1;overflow:auto;margin-top:0;padding:clamp(12px,3.5svh,28px) 16px clamp(16px,3svh,40px)}.order-card{max-width:520px;margin:0 auto;padding:clamp(16px,3svh,28px) 22px clamp(16px,2.5svh,22px);text-align:center;background:var(--white);border:2px solid var(--line);border-radius:28px;box-shadow:var(--shadow)}.order-badge{display:grid;width:clamp(40px,7svh,60px);height:clamp(40px,7svh,60px);place-items:center;margin:0 auto clamp(8px,1.6svh,14px);color:var(--pt-ink);background:var(--done-mint);border:2px solid var(--line);border-radius:50%;box-shadow:var(--shadow-sm);animation:pop .6s var(--spring) both}.order-badge svg{display:none;width:63%;height:63%;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.order-badge[data-state=paid] .order-badge-paid,.order-badge[data-state=pending] .order-badge-pending,.order-badge[data-state=failed] .order-badge-failed{display:block}.order-badge[data-state=paid] path{stroke-dasharray:24;animation:order-tick .52s var(--ease) .28s both}.order-badge[data-state=pending]{background:var(--yellow)}:is(.order-badge[data-state=pending],.bag-qr-clock) :is(.order-badge-minute,.order-badge-hour){transform-origin:12px 12px;animation:order-hand 2s linear infinite}:is(.order-badge[data-state=pending],.bag-qr-clock) .order-badge-hour{animation-duration:24s}.order-badge[data-state=failed]{background:var(--coral)}@keyframes order-tick{0%{stroke-dashoffset:24}}@keyframes order-hand{to{rotate:360deg}}.order-status h2{margin:0 0 8px;font-size:clamp(24px,min(8vw,4.6svh),40px);line-height:1.1}.order-status #order-copy{max-width:40ch;margin:0 auto;color:var(--muted);font-size:clamp(14px,2.6svh,16px)}.order-steps{--step: clamp(26px, 4.6svh, 40px);display:grid;gap:0;margin:clamp(12px,2.4svh,22px) auto 0;padding:0;max-width:300px;list-style:none;text-align:left;counter-reset:step}.order-steps[hidden]{display:none}.order-steps li{position:relative;display:flex;align-items:center;gap:12px;min-height:var(--step);color:var(--muted);font-weight:700}.order-steps li b{font-weight:inherit}.order-steps li span{position:relative;display:grid;width:24px;height:24px;flex:none;place-items:center;background:var(--paper);border:2px solid var(--soft-line);border-radius:50%}.order-steps li:not(:last-child) span:after{position:absolute;top:100%;left:50%;width:2px;height:calc(var(--step) - 24px);margin-left:-1px;content:"";background:var(--soft-line)}.order-steps[data-at="1"] li:nth-child(-n+1),.order-steps[data-at="2"] li:nth-child(-n+2),.order-steps[data-at="3"] li:nth-child(-n+3),.order-steps[data-at="4"] li:nth-child(-n+4),.order-steps[data-at="5"] li{color:var(--ink)}.order-steps[data-at="2"] li:nth-child(-n+1) span,.order-steps[data-at="3"] li:nth-child(-n+2) span,.order-steps[data-at="4"] li:nth-child(-n+3) span,.order-steps[data-at="5"] li span{background:var(--mint);border-color:var(--line)}.order-steps[data-at="2"] li:nth-child(-n+1) span:before,.order-steps[data-at="3"] li:nth-child(-n+2) span:before,.order-steps[data-at="4"] li:nth-child(-n+3) span:before,.order-steps[data-at="5"] li span:before{width:9px;height:5px;margin-top:-2px;content:"";border:solid var(--pt-ink);border-width:0 0 2.5px 2.5px;rotate:-45deg}.order-steps[data-at="1"] li:nth-child(1),.order-steps[data-at="2"] li:nth-child(2),.order-steps[data-at="3"] li:nth-child(3),.order-steps[data-at="4"] li:nth-child(4){font-weight:800}.order-steps[data-at="1"] li:nth-child(1) span,.order-steps[data-at="2"] li:nth-child(2) span,.order-steps[data-at="3"] li:nth-child(3) span,.order-steps[data-at="4"] li:nth-child(4) span{background:var(--coral);border-color:var(--line);box-shadow:0 0 color-mix(in srgb,var(--coral) 55%,transparent);animation:order-now 1.6s ease-out infinite}@keyframes order-now{to{box-shadow:0 0 0 9px transparent}}.order-production{margin-top:20px;padding:14px 16px;text-align:left;background:var(--paper);border:1.5px solid var(--soft-line);border-radius:18px}.order-production h3{font-size:17px}.order-production p{margin:6px 0 0;overflow-wrap:anywhere}.order-production #supplier-test-mode{color:var(--muted);font-size:13px}.order-production .order-follow{margin-top:12px}.order-production .order-follow[hidden]{display:none}.order-reference{display:inline-block;max-width:100%;margin:clamp(8px,1.8svh,16px) 0 0;padding:6px 12px;color:var(--muted);background:var(--paper);border-radius:999px;font-size:13px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;user-select:all}.order-reference:empty{display:none}.order-actions{display:grid;gap:10px;margin-top:clamp(12px,2.4svh,20px)}.order-actions .button{width:100%}@media (prefers-reduced-motion: reduce){.order-badge,.order-badge path,.bag-qr-clock path,.order-steps li span{animation:none!important}}.tryon-help{margin:0;color:var(--muted);font-size:13px;line-height:1.5}.hero{position:relative;display:grid;padding:20px max(18px,env(safe-area-inset-left)) 0;overflow:hidden}.hero h1{--size: clamp(40px, 11.6vw, 80px);font-size:var(--size);line-height:.96;letter-spacing:-.035em}.hero h1 span{display:block}.hero h1 em{display:block;color:var(--coral);font-style:normal;text-shadow:3px 3px 0 var(--shade)}html[lang=th] .hero h1{font-size:calc(var(--size) * .96);line-height:1;letter-spacing:0}.hero-art{position:relative;width:100%;max-width:460px;aspect-ratio:1 / 1.02;margin:18px auto 0}.hero-art{pointer-events:none}.hero-blob{position:absolute;inset:10% 2% 6% 14%;background:var(--sky);border:2px solid var(--line);border-radius:48% 52% 46% 54%/54% 44% 56% 46%;box-shadow:6px 6px 0 var(--shade)}.hero-shot{position:absolute;height:auto;filter:drop-shadow(0 14px 18px color-mix(in srgb,var(--shadow-color) 22%,transparent));transform:rotate(var(--tilt));animation:float 6s ease-in-out var(--float) infinite}.hero-shot-back{--tilt: 5deg;--at: 90ms;--float: -1.5s;top:0;right:-3%;z-index:1;width:58%}.hero-shot-tee{--tilt: -3deg;--at: .2s;--float: 0s;top:24%;left:17%;z-index:2;width:58%}.hero-shot-tote{--tilt: 8deg;--at: .31s;--float: -3s;right:-5%;bottom:-3%;z-index:3;width:40%}.hero-photo{position:absolute;top:2%;left:0;z-index:4;width:36%;margin:0;padding:6px;background:var(--white);border:2px solid var(--line);border-radius:6px;box-shadow:var(--shadow-sm);--tilt: -8deg;transform:rotate(var(--tilt));animation:sway 8s ease-in-out infinite}.hero-photo img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;background:#f3e6d8;border-radius:3px}.hero-photo:before{position:absolute;top:-10px;left:50%;width:54px;height:18px;content:"";background:#ffffff8c;border:1px solid rgb(43 32 55 / 12%);box-shadow:0 1px 2px #2b20371a;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);transform:translate(-50%) rotate(4deg)}.hero-arrow{position:absolute;inset:0;z-index:4;width:100%;height:100%;overflow:visible;pointer-events:none;animation:float 6s ease-in-out .45s infinite}.hero-arrow-dots{fill:var(--coral)}.hero-arrow-phone .hero-arrow-dots circle:nth-child(-n+4){stroke:var(--white);stroke-width:.6;paint-order:stroke}.hero-arrow-head{fill:var(--coral);stroke:var(--coral);stroke-width:.5;stroke-linejoin:round}@keyframes arrow-in{0%{opacity:0}}.hero-waits .hero-art:not(.is-ready)>*{opacity:0}.hero-art.is-ready .hero-blob{animation:hero-swell .82s var(--out) both}.hero-art.is-ready .hero-shot{animation:hero-rise .86s var(--out) var(--at) both,float 6s ease-in-out var(--float) infinite}.hero-art.is-ready .hero-photo{animation:hero-drop .76s var(--out) .43s both,sway 8s ease-in-out infinite}.hero-art.is-ready .hero-price{animation:hero-pop .62s var(--spring) .64s both}.hero-art.is-ready .hero-arrow{animation:arrow-in .42s var(--ease) 1s both,float 6s ease-in-out .45s infinite}:is(.hero-art.is-away,html.has-dialog .hero-art) :is(.hero-blob,.hero-shot,.hero-photo,.hero-price,.hero-arrow){animation-play-state:paused}@keyframes hero-swell{0%{opacity:0;transform:scale(.86)}}@keyframes hero-rise{0%{opacity:0;transform:translateY(26px) rotate(var(--tilt)) scale(.95)}}@keyframes hero-drop{0%{opacity:0;transform:translateY(-20px) rotate(calc(var(--tilt) - 7deg)) scale(1.05)}}@keyframes hero-pop{0%{opacity:0;transform:rotate(calc(var(--tilt) - 24deg)) scale(.5)}}@media (max-width: 719px){.hero-art:not(.has-cap){scale:-1 1}.hero-art:not(.has-cap) :is(.hero-price,.hero-shot-tee){scale:-1 1}.hero-art:not(.has-cap) .hero-photo{top:-3%;width:33%}.hero-arrow-wide{display:none}}@media (min-width: 720px){.hero-arrow-phone{display:none}}.hero-price{position:absolute;bottom:9%;left:4%;z-index:4;display:grid;width:86px;height:86px;place-content:center;text-align:center;background:var(--yellow);border:2px solid var(--line);border-radius:50%;box-shadow:var(--shadow-sm);--tilt: -10deg;transform:rotate(var(--tilt));color:var(--on-accent)}.hero-price small{font-size:12px;font-weight:800;line-height:1}.hero-price strong{font-family:var(--display);font-size:25px;line-height:1.05}.hero-art.has-cap{aspect-ratio:1 / 1.05}.has-cap .hero-blob{inset:2.7% auto auto 1.1%;width:97.7%;aspect-ratio:1;border-radius:50%}.has-cap .hero-shot-tote{--tilt: -10deg;inset:-3.2% auto auto -2.3%;z-index:1;width:28.2%}.has-cap .hero-shot-tee{--tilt: -2deg;top:1.9%;left:11.6%;width:76.3%}.has-cap .hero-shot-back{--tilt: 7deg;top:42.5%;right:auto;left:60.7%;z-index:3;width:33.3%}.hero-shot-cap{--tilt: -9deg;--at: .26s;--float: -4.5s;top:59.1%;left:6.2%;z-index:3;width:44.1%}.has-cap .hero-photo{--tilt: 8deg;top:-9.1%;right:0;left:auto;width:29.4%}.has-cap .hero-price{inset:78.8% -2.5% auto auto}.has-cap>.hero-arrow:not(.hero-arrow-cap){display:none}.hero-actions{display:grid;gap:12px;margin-top:16px}.hero-cta{min-height:58px;width:100%;padding-inline:26px;font-family:var(--display);font-size:19px}.hero-ticks{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin:0;padding:0;color:var(--muted);font-size:13px;font-weight:800;list-style:none}.hero-ticks li:before{content:"✓ ";color:var(--coral)}.tick-icon{display:none}@keyframes float{50%{translate:0 -8px}}@keyframes sway{0%,to{rotate:-1.5deg;translate:1.3% -.18%}50%{rotate:1.5deg;translate:-1.3% .18%}}.section{padding:0 max(18px,env(safe-area-inset-left))}.section>h2{margin-bottom:24px;font-size:clamp(30px,8.5vw,46px);line-height:1.05;letter-spacing:-.03em}.products>h2{margin-bottom:10px;font-size:20px;line-height:1.2;letter-spacing:-.01em}.product-rail{display:grid;grid-auto-columns:168px;grid-auto-flow:column;gap:12px;margin:0 calc(-1*max(18px,env(safe-area-inset-left)));padding:14px max(18px,env(safe-area-inset-left)) 7px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:max(18px,env(safe-area-inset-left));scrollbar-width:none}.product-rail::-webkit-scrollbar{display:none}.product-rail.is-grid{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 8px;margin:0;padding-inline:0;overflow:visible;scroll-snap-type:none}.rail-item{scroll-snap-align:start}.rail-card{position:relative;display:grid;grid-template-columns:58px minmax(0,1fr);grid-template-rows:1fr auto;align-content:center;align-items:center;column-gap:8px;row-gap:3px;min-width:0;min-height:96px;padding:7px;color:var(--ink);background:var(--card-face);border:2px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);text-align:left;transition:transform .26s var(--spring),border-color .3s var(--ease),box-shadow .3s var(--ease)}.rail-card{--card-face: var(--white);--card-photo: var(--sky)}@media (prefers-color-scheme: dark){:root:not([data-theme=light]) .rail-card{--ink: #f1f3f9;--muted: #b8bfd3;--card-face: #2c3447;--card-photo: #3a5283}}:root[data-theme=dark] .rail-card{--ink: #f1f3f9;--muted: #b8bfd3;--card-face: #2c3447;--card-photo: #3a5283}.rail-card:active{transform:scale(.97)}.rail-card.is-pointed{animation:rail-point 1.1s var(--spring) 2}@keyframes rail-point{30%{transform:translateY(-6px) rotate(-1.5deg)}60%{transform:rotate(1deg)}}.rail-card[aria-pressed=true],.petee-wardrobe-item[aria-pressed=true]{border-color:var(--coral);box-shadow:2px 2px 0 var(--coral),inset 0 0 0 1px var(--coral)}.rail-art{display:block;grid-row:1 / 3;padding:4px;background:var(--card-photo);border-radius:12px}.rail-card img{display:block;width:100%;height:auto;aspect-ratio:5 / 6;object-fit:contain;filter:drop-shadow(0 5px 6px color-mix(in srgb,var(--shadow-color) 24%,transparent))}.rail-card strong{align-self:end;min-width:0;overflow:hidden;font-family:var(--display);font-size:14px;line-height:1.15;overflow-wrap:anywhere}.rail-meta{display:flex;min-width:0;flex-direction:column;align-items:flex-start;align-self:start;gap:4px}.rail-card b{color:var(--muted);font-size:12px;font-weight:800;line-height:1.2}.rail-card .card-colors{flex:0 1 auto;min-width:0;max-width:100%;margin:0;overflow:hidden}.rail-card .card-colors>*{flex:none}.rail-label{display:contents}@media (max-width: 719.98px){.product-rail.is-grid{--foot: 46px;container-type:inline-size;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 8px}.product-rail.is-grid .rail-card{display:flex;flex-direction:column;justify-content:flex-end;height:calc((100cqw - 16px) / 3 * 4 / 3);min-height:0;padding:0;background:var(--card-face);border-radius:16px}.product-rail.is-grid .rail-art{position:absolute;inset:0 0 var(--foot);overflow:hidden;padding:0;background:var(--card-photo);border-radius:14px 14px 12px 12px}.products:not(.is-choosing) .product-rail.is-grid .rail-card[aria-pressed=true] .rail-art{inset:1px 1px var(--foot);border-radius:13px 13px 11px 11px}.product-rail.is-grid .rail-card img{width:100%;height:100%;aspect-ratio:auto;transform:scale(1.12) translateY(4%)}.product-rail.is-grid .rail-label{z-index:1;display:flex;height:var(--foot);flex-direction:column;justify-content:center;align-self:stretch;gap:2px;padding:0 7px 1px 8px;text-align:left}.product-rail.is-grid .rail-item .rail-card strong{align-self:stretch;overflow:hidden;padding:0;font-size:13px;line-height:1.15;white-space:nowrap;text-overflow:ellipsis}.product-rail.is-grid .rail-card strong br{display:none}.product-rail.is-grid .rail-card b{font-size:11.5px}.product-rail.is-grid .rail-meta{align-self:stretch}.product-rail.is-grid .rail-card .card-colors{position:absolute;right:8px;bottom:calc(var(--foot) + 7px);max-width:calc(100% - 16px);align-items:center;gap:4px}.product-rail.is-grid .card-colors i{width:10px;height:10px}.product-rail.is-grid .card-colors b{font-size:10px;line-height:10px}.product-rail.is-grid .rail-pick{top:0;left:8px;max-width:calc(100% - 16px);overflow:hidden;padding:1px 5px;font-size:10px;text-overflow:ellipsis;transform:translateY(-50%)}.product-rail.is-grid .rail-item .info-button{top:9px;right:7px;width:22px;height:22px;border-width:1.5px}.product-rail.is-grid .rail-item .info-button svg{width:13px;height:13px}}@media (min-width: 720px){.rail-item{grid-template-rows:auto auto auto;row-gap:6px}.rail-card{grid-area:1 / 1 / 4 / 2;grid-template-columns:none;grid-template-rows:subgrid;align-content:normal;min-height:0;padding:8px 8px 10px;box-shadow:var(--shadow)}.rail-art{grid-row:auto;padding:6px}.rail-card img{aspect-ratio:1}.rail-card strong{align-self:center;font-size:15px;line-height:1.2}.rail-card strong br{display:none}.rail-meta{flex-direction:row;align-items:center;align-self:center;justify-content:space-between;gap:6px}.rail-card b{color:var(--ink);font-size:14px}.rail-item .info-button{position:relative;top:auto;right:auto;grid-area:2 / 1;justify-self:end;margin-right:10px}.rail-item:has(.info-button) .rail-card strong{padding-right:30px}}@supports not (grid-template-rows: subgrid){@media (min-width: 720px){.rail-item .info-button{position:absolute;grid-area:auto;top:14px;right:4px}}}.product-kinds{position:relative;isolation:isolate;display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:8px;margin:0}.product-kind{display:flex;min-width:0;min-height:46px;align-items:center;justify-content:center;gap:6px;padding:0 6px;white-space:nowrap;color:var(--raised-ink);background:var(--raised);border:2px solid var(--line);border-radius:999px;box-shadow:var(--shadow-sm);font:700 14px var(--display);transition:color .3s var(--ease)}.product-kind span{overflow:hidden;text-overflow:ellipsis}.product-kind svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}.product-kind[aria-checked=true]{color:var(--on-accent);background:var(--coral)}.product-kind:active{transform:translate(2px,2px);box-shadow:none}.kind-mark{position:absolute;top:0;left:0;z-index:1;box-sizing:border-box;visibility:hidden;background:var(--coral);border:2px solid var(--line);border-radius:999px;box-shadow:var(--shadow-sm);pointer-events:none;transition:translate .44s var(--spring),width .44s var(--spring)}.product-kinds.has-mark .kind-mark{visibility:visible}.product-kinds.is-placing .kind-mark{transition:none}.product-kinds.has-mark .product-kind[aria-checked=true]{background:var(--white)}.product-kinds.has-mark .product-kind>*{position:relative;z-index:2}@media (prefers-reduced-motion: reduce){.kind-mark,.product-kind{transition:none}}.rail-pick{position:absolute;top:-11px;left:10px;z-index:1;padding:2px 8px;color:var(--on-accent);background:var(--yellow);border:1.5px solid var(--line);border-radius:999px;font-size:11px;font-style:normal;font-weight:800;line-height:1.35;white-space:nowrap;transform:rotate(-2deg)}@media (min-width: 720px){.rail-pick{top:14px;left:14px;border:0;transform:none}}html.is-rail-turning,html.is-rail-turning body{overflow-anchor:none}.rail-more{display:flex;justify-content:center;margin-top:6px}.rail-more:not(:has(button:not([hidden]))){display:none}.rail-all{display:inline-flex;min-height:44px;align-items:center;gap:8px;padding:0 12px;color:var(--ink);background:none;border:0;font:800 15px var(--text);text-decoration:underline;text-underline-offset:4px}.rail-all:after{width:7px;height:7px;margin-top:-2px;content:"";border-right:2.2px solid currentColor;border-bottom:2.2px solid currentColor;transform:rotate(45deg);transition:transform .26s var(--ease)}.rail-all[aria-expanded=true]:after{margin-top:3px;transform:rotate(-135deg)}.features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}.features li{padding:16px 14px;background:var(--white);border:2px solid var(--line);border-radius:22px;box-shadow:var(--shadow-sm)}.features li:nth-child(2){background:var(--lilac)}.features li:nth-child(3){background:var(--feature-card);color:var(--ink);--muted: var(--feature-muted)}.features li:nth-child(4){background:var(--pink)}.feature-icon{display:block;margin-bottom:8px;font-size:28px}.features h3{font-size:17px}.features p{margin:4px 0 0;color:var(--ink);font-size:14px;opacity:.78}.faq details{border-bottom:2px solid var(--soft-line)}.faq summary{position:relative;display:flex;min-height:56px;align-items:center;padding:14px 36px 14px 0;cursor:pointer;font-size:17px;font-weight:800;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary:after{position:absolute;top:50%;right:8px;width:10px;height:10px;margin-top:-7px;content:"";border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(45deg);transition:transform .29s var(--spring)}.faq details[open]:not(.is-closing) summary:after{transform:translateY(4px) rotate(-135deg)}.faq details p{margin:0 0 18px;color:var(--muted);font-size:16px}.footer .footer-regions{grid-area:1 / 2;gap:6px 16px}.footer .footer-regions a{color:var(--muted);font-weight:600}.footer .footer-regions a[aria-current]{color:var(--ink);text-decoration:underline;text-underline-offset:4px}:is(.is-order-page .storefront-page,.storefront-page:has(#order-status:not([hidden]))) :is(.hero,.section,.studio){display:none}.is-order-page #order-status[hidden]{display:block!important}@media (min-width: 720px){.topbar-nav{display:flex;gap:4px}.topbar-nav a{display:inline-flex;min-height:40px;align-items:center;padding:0 14px;color:var(--ink);border-radius:999px;font-weight:800;text-decoration:none}.topbar-nav a:hover{background:var(--nav-hover)}.hero{grid-template:". art" 1fr "copy art" auto "actions art" auto ". art" 1fr / minmax(0,1fr) minmax(0,1fr);align-items:start;gap:0 48px;width:min(100% - 48px,1120px);margin-inline:auto;padding:56px 0 0}.hero{overflow:visible}.hero-copy{grid-area:copy}.hero-art{grid-area:art;max-width:520px;margin:0}.hero-art.has-cap{margin-top:48px}.hero-actions{grid-area:actions;justify-items:start;margin-top:28px}.hero-cta{width:auto}.hero-ticks{justify-content:start}.studio{width:min(100% - 48px,760px);margin-inline:auto}.section{width:min(100% - 48px,1120px);margin-inline:auto;padding-inline:0}.product-rail,.product-rail.is-grid{grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 12px;margin:0;padding-inline:0;overflow:visible;scroll-snap-type:none}.features{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.faq{max-width:760px}.footer .footer-regions{grid-area:1 / 4}.product-stage{margin:0;border-radius:32px}.action-bar{width:min(100%,560px);margin-inline:auto}.action-bar{padding-inline:0}}@media (min-width: 1000px){.hero{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.hero h1{--size: min(116px, 10.6vw)}.hero h1 span{max-width:5em}html[lang=th] .hero h1{font-size:calc(var(--size) * .9);line-height:calc(var(--size) * .96)}html[lang=th] .hero h1 span{max-width:3.4em}.hero-actions{gap:28px;margin-top:44px}.hero-cta{min-height:66px;padding-inline:34px;font-size:22px}.hero-ticks{gap:26px;font-size:15px}.hero-ticks li{display:grid;justify-items:center;gap:8px;color:var(--ink);text-align:center}.hero-ticks li:before{content:none}.tick-icon{display:grid;width:52px;height:52px;place-items:center;background:var(--sky);border:2px solid var(--line);border-radius:50%;box-shadow:3px 3px 0 var(--shade)}.hero-ticks li:nth-child(2) .tick-icon{background:var(--lilac)}.hero-ticks li:nth-child(3) .tick-icon{background:var(--pink)}.tick-icon svg{width:26px;height:26px;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}}.photo-menu,.color-swatches,.merch-sizes,.place-menu,.crop-bar,.tool-stack{animation:none;transition-property:opacity,transform,display;transition-duration:.23s,.39s,.39s;transition-timing-function:var(--ease),var(--out),linear;transition-behavior:allow-discrete}.photo-menu[hidden],.place-menu[hidden]{opacity:0;transform:scale(.92)}.color-swatches[hidden],.merch-sizes[hidden]{opacity:0;transform:translateY(8px) scale(.94)}.crop-bar[hidden]{opacity:0;transform:translateY(10px)}.tool-stack[hidden]{opacity:0;transform:translate(8px)}.account-badge{transition:opacity .26s var(--ease),transform .42s var(--out),display .42s allow-discrete}.account-badge[hidden]{opacity:0;transform:scale(.6)}@starting-style{.account-badge{opacity:0;transform:scale(.6)}}@starting-style{.photo-menu,.place-menu{opacity:0;transform:scale(.92)}.color-swatches,.merch-sizes{opacity:0;transform:translateY(8px) scale(.94)}.crop-bar{opacity:0;transform:translateY(10px)}.tool-stack{opacity:0;transform:translate(8px)}.tool-stack.stage-side{transform:translate(-8px)}}:is(.rail-item,.rail-card,.size-grid button,.zoom-control button,.place-menu button,.info-button,.chip,.step-card,.features li){transition:transform .29s var(--out),background-color .26s var(--ease),border-color .26s var(--ease),box-shadow .29s var(--ease),color .26s var(--ease)}.tool-button,.language-toggle,.size-chip{transition:transform .21s var(--ease),box-shadow .21s var(--ease),background-color .26s var(--ease),color .26s var(--ease),border-color .26s var(--ease),opacity .26s var(--ease)}@media (hover: hover) and (pointer: fine){.rail-item:hover,.rail-card:not(.rail-item>*):hover{transform:translateY(-2px)}.features li:hover{transform:translateY(-3px)}.tool-button:not(:disabled):not(.add-layer,.side-fold):not([aria-pressed=true]):not([aria-expanded=true]):hover,.zoom-control button:not(:disabled):hover{background-color:var(--lilac)}.tool-button:is([aria-pressed=true],[aria-expanded=true],.side-fold):hover{background-color:var(--coral)}}.unit-toggle{position:relative;display:inline-grid;grid-template-columns:1fr 1fr}.unit-toggle:before{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);content:"";background:var(--ink);border-radius:999px;transition:transform .39s var(--out)}.unit-toggle[data-active=in]:before{transform:translate(100%)}.unit-toggle button{position:relative;z-index:1}.unit-toggle button[aria-pressed=true]{background:none}.is-ticking{animation:tick .47s var(--out)}@keyframes tick{35%{transform:scale(1.08)}}.color-dot.is-changing{animation:dot .49s var(--spring)}@keyframes dot{0%{transform:scale(.6)}}.flip-button.is-turning svg{animation:turn-icon .6s var(--out)}@keyframes turn-icon{0%{transform:rotate(-180deg)}}#undo-button.is-nudging svg{animation:nudge-back .44s var(--out)}#redo-button.is-nudging svg{animation:nudge-on .44s var(--out)}@keyframes nudge-back{40%{transform:translate(-3px) rotate(-14deg)}}@keyframes nudge-on{40%{transform:translate(3px) rotate(14deg)}}.topbar.is-raised:before{box-shadow:0 1px color-mix(in srgb,var(--shadow-color) 8%,transparent),0 10px 24px -16px color-mix(in srgb,var(--shadow-color) 45%,transparent)}.hero h1>span,.hero h1>em{animation:rise-in .91s var(--out) both}.hero h1>em{animation-delay:.1s}.hero-actions{animation:rise-in .91s var(--out) .31s both}@keyframes rise-in{0%{opacity:0;transform:translateY(16px)}}.can-reveal :is(.section>h2,.steps>li,.features>li,.faq details,#product-rail){opacity:0;transform:translateY(14px);transition:opacity .68s var(--ease) calc(var(--i, 0) * 90ms),transform .83s var(--out) calc(var(--i, 0) * 90ms)}.can-reveal .is-revealed:is(.section>h2,.steps>li,.features>li,.faq details,#product-rail){opacity:1;transform:none}@keyframes open-in{0%{opacity:0;transform:translateY(-4px)}}.agent-status{margin:0;color:var(--link);font-size:14px;font-weight:700}.agent-status:empty{display:none}@keyframes agent-in{0%{opacity:0;transform:translateY(10px) scale(.97)}}.agent-shot{display:block;width:100%;height:100%}.agent-shot.is-back{position:absolute;right:4px;bottom:4px;width:38%;height:auto;aspect-ratio:4 / 5;background:color-mix(in srgb,var(--white) 70%,transparent);border:1.5px solid var(--white);border-radius:8px;box-shadow:0 2px 8px color-mix(in srgb,var(--shadow-color) 18%,transparent)}.agent-shot.is-back:only-child{position:static;width:100%;height:100%;background:none;border:0;box-shadow:none}.text-editor{display:grid;gap:12px;padding:0 16px calc(16px + env(safe-area-inset-bottom))}.text-preview{display:grid;height:116px;place-items:center;padding:10px;background:#fafafa;border:2px solid var(--soft-line);border-radius:18px}.text-preview[data-dark=true]{background:#202020}.text-preview img{max-width:100%;max-height:92px;object-fit:contain}.text-value{min-height:52px;padding:0 16px;color:var(--ink);background:var(--white);border:2px solid var(--line);border-radius:16px;font:inherit;font-size:18px;font-weight:700}.text-value:focus{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--coral) 35%,transparent)}.text-row{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:8px}.text-label{color:var(--muted);font-size:13px;font-weight:800}.text-choices{display:flex;gap:8px;padding:3px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}.text-choices::-webkit-scrollbar{display:none}.text-choices button{display:grid;flex:none;min-width:46px;height:44px;place-items:center;padding:0 10px;color:var(--raised-ink);background:var(--raised);border:2px solid var(--soft-line);border-radius:14px;font-size:19px;line-height:1;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}.text-choices button[aria-checked=true]{border-color:var(--coral);box-shadow:0 0 0 2px var(--coral)}.text-colors button{width:36px;min-width:36px;height:36px;padding:0;background:var(--swatch);border-color:color-mix(in srgb,var(--ink) 25%,transparent);border-radius:50%}.text-choices [data-outline]{font-weight:900;-webkit-text-stroke:4px var(--ring, transparent);paint-order:stroke fill}.text-choices [data-outline=white]{color:var(--ink);background:#c9c3d6}.text-choices svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}.text-fonts{display:grid;grid-auto-columns:max-content;grid-auto-flow:column;grid-template-rows:repeat(2,auto)}.text-fonts button{display:flex;height:56px;min-width:72px;max-width:150px;flex-direction:column;justify-content:center;gap:3px;padding:0 12px}.text-fonts .font-sample{max-width:100%;overflow:hidden;font-size:19px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.text-fonts .font-name{color:var(--muted);font-family:var(--text);font-size:11px;font-weight:700;line-height:1;white-space:nowrap}.account-button{position:relative}.account-button svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.account-button{overflow:hidden}.account-button[data-signed-in=true]{background:var(--coral);animation:pop .46s var(--spring);color:var(--on-accent)}.account-badge{position:absolute;inset:0;display:grid;place-items:center;color:var(--on-accent);background:var(--coral);border-radius:50%;font-family:var(--display);font-size:20px;font-weight:700;line-height:1}.account-badge img{width:100%;height:100%;object-fit:cover;border-radius:50%}.account-button:has(.account-badge:not([hidden]))>svg{visibility:hidden}.keep-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round;transition:fill .26s var(--ease)}.tool-button.keep-button[aria-pressed=true]{color:var(--on-accent);background:var(--coral)}.keep-button[aria-pressed=true] svg{fill:currentColor}.keep-button.is-keeping svg{animation:keep-pop .52s var(--spring)}.keep-button.is-saving{cursor:progress}.keep-button.is-saving svg{animation:keep-saving .9s ease-in-out infinite}@keyframes keep-saving{0%,to{fill:transparent;transform:scale(1)}50%{fill:currentColor;transform:scale(1.12)}}@keyframes keep-pop{40%{transform:scale(1.25) translateY(-1px)}}.page-toast{position:fixed;inset:calc(var(--topbar) + 8px) max(12px,env(safe-area-inset-right)) auto auto;z-index:70;display:flex;width:max-content;max-width:min(380px,calc(100vw - 24px));align-items:center;gap:10px;margin:0;padding:10px 10px 10px 14px;overflow:visible;color:var(--chip-text);background:var(--chip);border:0;border-radius:16px;box-shadow:0 14px 34px color-mix(in srgb,var(--shadow-color) 30%,transparent);font-size:15px;font-weight:700;line-height:1.3;opacity:0;pointer-events:none;outline:1px solid var(--chip-edge)}.is-studio-full .page-toast{top:max(10px,calc(env(safe-area-inset-top) + 6px))}.page-toast.is-shown{opacity:1;pointer-events:auto}.page-toast{touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.page-toast:not([popover]){display:flex}.page-toast-icon{display:none;width:24px;height:24px;flex:none;place-items:center;color:var(--on-accent);background:var(--coral);border-radius:50%}.page-toast[data-tone=done] .page-toast-icon{display:grid}.page-toast-icon svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.page-toast[data-tone=error]{color:var(--on-color);background:var(--red)}.page-toast-action{min-height:34px;padding:0 12px;color:var(--on-accent);background:var(--yellow);border:0;border-radius:11px;font:inherit;font-size:14px;font-weight:800;white-space:nowrap}.page-toast-action[hidden]{display:none}.page-toast:not(:has(.page-toast-action:not([hidden]))){padding-right:16px}.showcase{position:fixed;inset:var(--showcase-top, 60px) 0 var(--showcase-bottom, 0px);z-index:39;transition:bottom .36s var(--ease);touch-action:none}.showcase-haze{position:absolute;inset:0;z-index:-1;background:color-mix(in srgb,var(--paper) 42%,transparent);-webkit-backdrop-filter:blur(14px) saturate(1.1);backdrop-filter:blur(14px) saturate(1.1)}.showcase.is-over-chat{--showcase-fade: 56px;z-index:41;bottom:max(0px,calc(var(--showcase-bottom, 0px) - var(--showcase-fade)))}.showcase.is-over-chat .showcase-haze{-webkit-mask-image:linear-gradient(to top,transparent,#000 var(--showcase-fade));mask-image:linear-gradient(to top,transparent,#000 var(--showcase-fade))}.showcase-stage{position:absolute;inset:0 0 auto;display:grid;height:var(--showcase-room, 50%);place-items:center;padding-top:30px;pointer-events:none;transition:height .36s var(--ease)}.showcase .showcase-cards{--showcase-card: 168px;grid-auto-columns:var(--showcase-card);grid-auto-flow:column;grid-template-columns:none;justify-content:center;width:100%;margin:0;padding:14px max(16px,env(safe-area-inset-left)) 12px;overflow:auto hidden;scroll-snap-type:x mandatory;pointer-events:auto;touch-action:none}.showcase .showcase-cards.is-gallery{justify-content:start;touch-action:pan-x}.showcase .rail-card{box-shadow:var(--shadow)}.showcase .rail-art{overflow:hidden}.showcase .rail-card img{scale:1.3}@media (max-width: 719.98px){.showcase .rail-item{grid-template-rows:auto auto auto;row-gap:4px}.showcase .rail-card{grid-area:1 / 1 / 4 / 2;grid-template-columns:none;grid-template-rows:subgrid;align-content:normal;min-height:0;padding:6px 6px 8px}.showcase .rail-art{grid-row:auto;padding:4px}.showcase .rail-card img{aspect-ratio:1}.showcase .rail-card strong{align-self:center;white-space:nowrap;text-overflow:ellipsis}.showcase .rail-card strong br{display:none}.showcase .rail-meta{flex-direction:row;align-items:center;align-self:center;justify-content:space-between;gap:6px}.showcase .rail-card b{color:var(--ink);font-size:12.5px}.showcase .rail-pick{top:10px;left:10px;max-width:calc(100% - 20px);overflow:hidden;padding:1px 6px;border:0;font-size:10px;text-overflow:ellipsis;transform:none}.showcase .rail-item .info-button{position:relative;top:auto;right:auto;grid-area:2 / 1;justify-self:end;width:22px;height:22px;margin-right:8px}.showcase .rail-item:has(.info-button) .rail-card strong{padding-right:26px}}@media (min-width: 720px){.showcase .showcase-cards{--showcase-card: 240px}}.showcase-pick{display:grid;align-content:start;row-gap:10px;min-width:0;scroll-snap-align:start;container-type:inline-size}.showcase .rail-card .card-colors{display:none}.showcase-swatches{--swatch-size: clamp(24px, calc((100cqw - (var(--per-row, 4) - 1) * 8px) / var(--per-row, 4)), 30px);display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:calc(var(--per-row, 4) * var(--swatch-size) + (var(--per-row, 4) - 1) * 8px);margin:0 auto}.showcase-swatch{width:var(--swatch-size);height:var(--swatch-size);padding:0;background:var(--swatch, #fafafa);border:1.5px solid color-mix(in srgb,var(--ink) 28%,transparent);border-radius:50%;box-shadow:var(--shadow-sm);transition:transform .26s var(--spring),box-shadow .26s var(--ease)}.showcase-swatch:active{transform:scale(.88)}.showcase-swatch[aria-pressed=true]{border-color:var(--white);box-shadow:0 0 0 2.5px var(--coral)}.showcase-close{position:absolute;top:12px;right:max(14px,env(safe-area-inset-right),calc((100% - 560px)/2 + 12px));width:34px;height:34px;color:var(--raised-ink);background:var(--raised);border:2px solid var(--line);box-shadow:var(--shadow-sm)}.showcase-close svg{width:15px;height:15px;stroke-width:2.8}
